CN116069424A - Page display method and device, electronic equipment and storage medium - Google Patents
Page display method and device, electronic equipment and storage medium Download PDFInfo
- Publication number
- CN116069424A CN116069424A CN202310033670.2A CN202310033670A CN116069424A CN 116069424 A CN116069424 A CN 116069424A CN 202310033670 A CN202310033670 A CN 202310033670A CN 116069424 A CN116069424 A CN 116069424A
- Authority
- CN
- China
- Prior art keywords
- code
- symbol
- file
- list
- specified
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 66
- 230000004044 response Effects 0.000 claims abstract description 40
- 239000000725 suspension Substances 0.000 claims abstract description 7
- 238000004458 analytical method Methods 0.000 claims description 35
- 238000007667 floating Methods 0.000 claims description 26
- 238000012545 processing Methods 0.000 claims description 20
- 238000001514 detection method Methods 0.000 claims description 19
- 238000004590 computer program Methods 0.000 claims description 12
- 230000006870 function Effects 0.000 description 28
- 238000010586 diagram Methods 0.000 description 14
- 230000008569 process Effects 0.000 description 14
- 238000004891 communication Methods 0.000 description 8
- 238000011160 research Methods 0.000 description 8
- 230000003068 static effect Effects 0.000 description 5
- 238000011161 development Methods 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 3
- 238000012986 modification Methods 0.000 description 3
- 230000004048 modification Effects 0.000 description 3
- 230000003287 optical effect Effects 0.000 description 3
- 230000003993 interaction Effects 0.000 description 2
- 238000012544 monitoring process Methods 0.000 description 2
- 238000003491 array Methods 0.000 description 1
- 238000013473 artificial intelligence Methods 0.000 description 1
- 230000006399 behavior Effects 0.000 description 1
- 230000001413 cellular effect Effects 0.000 description 1
- 238000010367 cloning Methods 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 230000001953 sensory effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 238000012360 testing method Methods 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Human Computer Interaction (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The disclosure provides a method, a device, electronic equipment and a storage medium for displaying pages, relates to the technical field of computers, and particularly relates to the technical fields of code hosting, online code reading and the like. The specific implementation scheme is as follows: displaying a first code content and a symbol list of a code file according to a viewing request of the code file; responsive to detecting a first selection operation of a symbol in the symbol list, displaying second code content of the symbol; in response to detecting a second selection operation of a specified code of the first code content, symbol definition information of the specified code is displayed in suspension.
Description
Technical Field
The present disclosure relates to the field of computer technology, and in particular, to the technical field of code hosting and online code reading.
Background
An integrated development environment (Integrated Development Environment, IDE) is an application program for providing a program development environment, and generally includes tools such as a code editor, compiler, debugger, and graphical user interface. Code hosting refers to an online code hosting service for software developers, and aims to solve some problems existing in the software development process, such as cross-regional collaboration, multi-branch concurrency, code version management, security and the like.
Currently, when a code hosting tool is used for online reading of codes, only one specific file content is displayed in a general browser page.
Disclosure of Invention
The disclosure provides a method, a device, electronic equipment and a storage medium for page display.
According to an aspect of the present disclosure, there is provided a method of displaying a page, including:
displaying a first code content and a symbol list of a code file according to a viewing request of the code file;
responsive to detecting a first selection operation of a symbol in the symbol list, displaying second code content of the symbol;
in response to detecting a second selection operation of a specified code of the first code content, symbol definition information of the specified code is displayed in suspension.
According to another aspect of the present disclosure, there is provided an apparatus for displaying a page, including:
a file display unit, configured to display a first code content and a symbol list of a code file according to a viewing request of the code file;
a symbol display unit configured to display second code content of a symbol in the symbol list in response to detection of a first selection operation of the symbol;
and an information display unit configured to, in response to detection of a second selection operation of a specified code of the first-code content, hover-display symbol definition information of the specified code.
According to still another aspect of the present disclosure, there is provided an electronic apparatus including:
at least one processor; and
a memory communicatively coupled to the at least one processor; wherein,,
the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the aspects and methods of any one of the possible implementations described above.
According to yet another aspect of the present disclosure, there is provided a non-transitory computer-readable storage medium storing computer instructions for causing the computer to perform the method of the aspects and any possible implementation described above.
According to a further aspect of the present disclosure there is provided a computer program product comprising a computer program which, when executed by a processor, implements the method of the aspects and any one of the possible implementations described above.
According to the technical scheme, the first code content and the symbol list of the code file are displayed according to the viewing request of the code file, and further the second code content of the symbol can be displayed in response to the detection of the first selection operation of the symbol in the symbol list, so that the symbol definition information of the specified code can be displayed in a floating manner in response to the detection of the second selection operation of the specified code of the first code content.
It should be understood that the description in this section is not intended to identify key or critical features of the embodiments of the disclosure, nor is it intended to be used to limit the scope of the disclosure. Other features of the present disclosure will become apparent from the following specification.
Drawings
The drawings are for a better understanding of the present solution and are not to be construed as limiting the present disclosure. Wherein:
FIG. 1 is a schematic diagram according to a first embodiment of the present disclosure;
FIG. 2A is a schematic diagram of a display page of a file list according to a first embodiment of the present disclosure;
FIG. 2B is a schematic diagram of a display page of a symbol list according to a first embodiment of the present disclosure;
FIG. 2C is a schematic diagram of a display page of a plurality of code files according to a first embodiment of the present disclosure;
FIG. 2D is a schematic diagram of a display page of a floating pop-up window according to a first embodiment of the present disclosure;
FIG. 2E is a schematic diagram of a display page of a floating pop-up window according to a first embodiment of the present disclosure;
FIG. 3 is a schematic diagram according to a second embodiment of the present disclosure;
FIG. 4 is a schematic diagram according to a third embodiment of the present disclosure;
fig. 5 is a block diagram of an electronic device for implementing a method of page display of an embodiment of the present disclosure.
Detailed Description
Exemplary embodiments of the present disclosure are described below in conjunction with the accompanying drawings, which include various details of the embodiments of the present disclosure to facilitate understanding, and should be considered as merely exemplary. Accordingly, one of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the present disclosure. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.
It will be apparent that the described embodiments are some, but not all, of the embodiments of the present disclosure. All other embodiments, which can be made by one of ordinary skill in the art based on the embodiments in this disclosure without inventive faculty, are intended to be within the scope of this disclosure.
It should be noted that, the terminal device in the embodiments of the present disclosure may include, but is not limited to, smart devices such as a mobile phone, a personal digital assistant (Personal Digital Assistant, PDA), a wireless handheld device, and a Tablet Computer (Tablet Computer); the display device may include, but is not limited to, a personal computer, a television, or the like having a display function.
In addition, the term "and/or" herein is merely an association relationship describing an association object, and means that three relationships may exist, for example, a and/or B may mean: a exists alone, A and B exist together, and B exists alone. In addition, the character "/" herein generally indicates that the front and rear associated objects are an "or" relationship.
At present, a common code hosting product has a certain gap from a local IDE in terms of code reading, such as lack of files and symbol navigation, and only one file can be opened in a page, so that the class, function definition, reference position and the like cannot be checked and jumped. Moreover, with the development of large internet services, the managed code library can reach the level of hundreds of thousands, and all codes cannot be downloaded locally for reading. Therefore, if the online reading experience can be similar to that of the local IDE, the efficiency of familiarity of a developer with projects and understanding codes can be effectively improved.
Therefore, there is a need to provide a method for displaying a page, which can provide an online code reading service similar to a local IDE code reading experience, and can read and understand the code online without cloning the code locally, so as to improve the efficiency of the developer in familiarity with projects and understanding the code.
Fig. 1 is a schematic diagram according to a first embodiment of the present disclosure, as shown in fig. 1.
101. And displaying the first code content and the symbol list of the code file according to the viewing request of the code file.
102. In response to detecting a first selection operation of a symbol in the symbol list, second code content of the symbol is displayed.
103. In response to detecting a second selection operation of a specified code of the first code content, symbol definition information of the specified code is displayed in suspension.
Note that, for a code compiler, a symbol (symbol) may be a generic term for information such as a function, a class, and a method.
It is understood that symbols may include, but are not limited to, functions, classes, methods, fields, etc., by class or type division.
In the present invention, the "specified" two words in the specified code are not particularly limited, and are to specify the current operation object, so that the specified code is common code content, for example, may be an audio data channel of a certain code in a code file, which is not particularly limited in this embodiment.
It should be noted that, part or all of the execution bodies of 101 to 103 may be applications located in the local terminal, or may be functional units such as a plug-in unit or a software development kit (Software Development Kit, SDK) provided in the applications located in the local terminal, or may be a processing engine located in a server on the network side, or may be a distributed system located on the network side, for example, a processing engine or a distributed system in an online code reading platform on the network side, which is not limited in this embodiment.
It will be appreciated that the application may be a native program (native app) installed on the native terminal, or may also be a web page program (webApp) of a browser on the native terminal, which is not limited in this embodiment.
In this way, the first code content and the symbol list of the code file can be displayed according to the viewing request of the code file, and then the second code content of the symbol can be displayed in response to the detection of the first selection operation of the symbol in the symbol list, so that the symbol definition information of the specified code can be displayed in a floating manner in response to the detection of the second selection operation of the specified code of the first code content.
Optionally, in one possible implementation manner of this embodiment, in 101, a code reading page may specifically be output, where the code reading page may include a file navigation area and a code content area, where the file navigation area includes a file list and a symbol list associated with the file list, and further a view request of a code file may be acquired, so that, according to the view request of the code file, a first code content of the code file may be displayed in the code content area, and the file list and the symbol list of the code file may be displayed in the file navigation area.
In this implementation, the file list may be displayed in a tree structure, i.e., file tree navigation.
In a specific implementation process of the implementation manner, a preset interface is utilized to acquire file names under each folder of the code library layer by layer so as to acquire the file list.
In one case of this particular implementation, after the code reading page is output, the file list may include file names of all files in the code base to navigate all files in the code base.
In another case of the specific implementation, the file list may be displayed in the file navigation area according to a viewing request of the code file in response to detecting a viewing operation of the code file in the file list. Meanwhile, the first code content of the code file may be displayed in a code content area, as shown in fig. 2A.
In this implementation, the file list and the symbol list associated with the file list may be displayed in parallel in the file navigation area. For any one code file in the file list, the symbol list may be a navigation list of all symbols in the code file, i.e., a symbol navigation list.
Specifically, in response to a user selection operation on a certain code file, all symbol data of the code file may be acquired to form a symbol list of the code file, and displayed in parallel with the file list in a file navigation area.
In another specific implementation process of the implementation manner, symbol data based on the code file obtained by pre-analysis is obtained according to a viewing request of the code file, so as to obtain a symbol list of the code file, and the symbol list of the code file is displayed in the file navigation area, as shown in fig. 2B.
In this particular implementation, the symbol data of the code file may include names of all symbols in the code file and location information of the symbols.
Specifically, the kind of symbol may include at least one of an annotation (annotation), a class (enumeration), an enumeration (enum), an enumeration constant (enumstate), a field (field), a function (function), an interface (interface), and a method (method).
Here, different kinds of symbols may correspond to different icons. The types of the symbols can be identified in the symbol list through icons.
In one case of the specific implementation process, symbol data of the code file may be analyzed in advance as follows: and monitoring a message of the code merging into the code library, triggering analysis if the code merging into the message is monitored, analyzing the code through a static analysis strategy, analyzing all symbol definitions and positions of the symbol definitions of the code, and storing analysis results into a database.
Specifically, the saved parsing result, that is, the symbol data may include a symbol name, a file path in which the symbol is located, a symbol start line, a symbol end line, and code library information. The code library information may include, among other things, code library names, code library branches, code library versions, and the like.
Therefore, symbol data based on the code file obtained through pre-analysis can be obtained according to the viewing request of the code file, a symbol list of the code file can be obtained according to the symbol data, and the symbol list of the code file can be displayed in a file navigation area.
In yet another specific implementation of this implementation, the first code content of the code file may be displayed in the code content area according to a view request of the code file.
In the specific implementation process, the first code content is the whole code content of the code file.
In one case of this particular implementation, a plurality of code files, i.e., a display window or a display page having a plurality of code files, may be displayed in the code content area. The display page of each code file has a tab area. In response to detecting a selection operation of a tab area of a display page of a code file, switching to the display page of the code file corresponding to the selected tab area is performed, as shown in fig. 2C.
For example, the code content area may open a plurality of code files. Different code files may be switched through the tag area of the code file.
Here, the location where each code file browses may also be recorded, and when other code files are cut back, the location where it browses at the time can be returned.
It will be appreciated that the switching of different code files and the recording of the locations where each code file is browsed may be achieved by existing means, and are not particularly limited herein.
In still another specific implementation of this implementation, the code reading page may be specifically output in response to detecting a view request generated based on address information of the code reading page input by the user in the browser. The code reading page displays a file navigation area and a code content area.
In this way, in the implementation manner, the first code content of the code file can be displayed in the code content area of the code reading page and the file list and the symbol list of the code file can be displayed in the file navigation area according to the viewing request of the code file.
Optionally, in one possible implementation manner of this embodiment, in 102, in response to detecting a first selection operation on a symbol in the symbol list, position information of the symbol in the first code content may be obtained, and further, according to the position information, jump processing may be performed on the first code content to display second code content of the symbol.
In this implementation, the second code content may be code content corresponding to the symbol. The first selection operation may include, but is not limited to, a click operation, a gesture operation, and the like. The location information may include, but is not limited to, a line number.
Specifically, the user may jump to the row in the code content where the symbol is located by clicking on the symbol in the symbol list, as shown in FIG. 2B.
In this way, in the implementation manner, through the selection operation of the symbol in the symbol list, the position of the symbol in the code file is jumped to display the code content corresponding to the symbol, so that a developer can conveniently check the code content corresponding to the symbol, the pertinence of code reading is improved, and the online code reading experience is further optimized.
It should be noted that, the specific implementation process of the second code content of the display symbol provided in the present implementation manner may be combined with the various specific implementation processes provided in the foregoing implementation manner to implement the page display method of the present embodiment. The detailed description may refer to the relevant content in the foregoing implementation, and will not be repeated here.
Alternatively, in one possible implementation manner of this embodiment, in response to detecting the second selection operation of the specific code of the first code content, in step 103, positioning information based on the specific code obtained by pre-analysis may be obtained, and further, symbol definition information of the specific code may be obtained according to the positioning information of the specific code, and the symbol definition information of the specific code may be displayed in a floating manner.
In a specific implementation process of this implementation manner, the positioning information of the specified code may be obtained by pre-analyzing in the following manner: and monitoring a message of the code merging into the code library, triggering analysis if the code merging into the message is monitored, analyzing the codes in the code library through a static analysis strategy, analyzing positions where all symbols of the codes appear, defined positions and referenced positions, and storing analysis results into a database.
Specifically, the saved parsing result, i.e., positioning information, may include information and location of the symbol itself, a location defined by the symbol, a location to which the symbol is referenced, code library information, and the like.
For example, the information and location of the symbol itself may include the symbol name, the file in which the symbol is located, the line number, and the column number. The location of the symbol definition may include the file and line number where the symbol definition is located, with the general definition location being only one. The location where the symbol is referenced may include the file, line number, where the symbol is referenced. The referenced location may be generally multiple locations and may be recorded separately. The code library information may include code library names, branches, versions, etc.
Here, in order to save storage space, only the position of the symbol itself and the positions of the definition and reference may be saved, and no relevant code segments are recorded.
For another example, the code in the code library may be parsed by a static analysis policy, where all classes, methods, functions, etc. of the code appear, where defined and referenced, and the parsing result saved to the database.
In another specific implementation process of the implementation manner, symbol definition information of the specified code is displayed based on a floating popup window, wherein the floating popup window comprises a view key; and in response to detection of triggering operation of the view key, displaying the extension information of the specified code.
In a specific implementation, a floating popup window, or floating window, may be displayed around the designated code, and may partially obscure other code content, as shown in fig. 2D. For example, the user clicks on a function, pops up a floating pop.
In particular, the floating popup may include symbol definition information that views keys and specified codes. For example, function signatures and notes of the specified code. The view buttons may include a "view definition" button and a "view reference" button, as shown in FIG. 2D.
Specifically, the extension information may include extension information defining the correspondence and extension information referencing the correspondence.
In one case of the specific implementation process, in response to detecting a triggering operation of the view definition key by a user, extension information of view definition of the specified code is displayed.
Specifically, the extension information may include extension information defining a correspondence. As shown in fig. 2E, extension information corresponding to the definition is displayed in definition 1.
For example, a user clicks a "view definition" button, a view definition request may be generated, according to which the file content in which the definition is located may be obtained, 1 line up and down to the line of the definition is extracted based on the line number of the definition to form a code segment, and the code segment of the definition is displayed.
Further, in response to detecting a triggering operation of the user on the extension information, the method can jump to a code file corresponding to the extension information, namely detail code content corresponding to the extension information.
For example, a user clicking on a code segment may jump to a particular file to which the code segment corresponds, and may jump back through a snap key.
Specifically, the extension information may further include extension information corresponding to the reference. Clicking on reference 1, as shown in fig. 2E, may display the extension information corresponding to the reference.
It will be appreciated that the manner in which the display references are viewed may be similar to the manner in which the display definitions are viewed, and detailed description may be made with reference to the relevant content of the foregoing viewing display definitions, which is not repeated here.
In this way, by displaying the extension information of the designated code in response to detecting the triggering operation of the view key in the floating popup window, more detailed code information can be provided for the developer, so that the developer can read and understand the code online, and the experience of reading the code online is further optimized.
In this implementation, the symbol definition information specifying the code may include a signature and annotation of the symbol. Such as signatures and annotations of functions.
In this implementation, the positioning information specifying the code may include the location of the symbol itself, the location defined by the symbol, and the location to which the symbol is referenced in the specifying code.
In the present implementation, the second selection operation may include, but is not limited to, a selection operation, a mouse-over (river) operation, and the like.
In this way, in this implementation manner, the positioning information based on the specified code obtained by pre-analysis may be obtained by responding to the detection of the second selection operation of the specified code of the first code content, so that the symbol definition information of the specified code may be obtained according to the positioning information of the specified code, and the symbol definition information of the specified code may be displayed in a floating manner, so that the symbol definition information of the specified code may be provided to the developer, so that the developer may view the code information of the code to be specified, and improve the pertinence and convenience of online code reading, thereby further optimizing the experience of online code reading.
It should be noted that, the specific implementation process of the symbol definition information of the floating display specified code provided in the present implementation manner may be combined with the various specific implementation processes provided in the foregoing respective implementation manners to implement the page display method of the present embodiment. The detailed description may refer to the relevant content in the foregoing implementation, and will not be repeated here.
In this embodiment, the first code content and the symbol list of the code file may be displayed according to the request for viewing the code file, and further, the second code content of the symbol may be displayed in response to detecting the first selection operation on the symbol in the symbol list, so that the symbol definition information of the specified code may be displayed in suspension in response to detecting the second selection operation on the specified code of the first code content.
In addition, by adopting the technical scheme provided by the embodiment, the first code content of the code file can be displayed in the code content area of the code reading page and the file list and the symbol list of the code file can be displayed in the file navigation area according to the viewing request of the code file.
In addition, by adopting the technical scheme provided by the embodiment, the symbol data based on the code file obtained by pre-analysis can be obtained according to the viewing request of the code file, the symbol list of the code file can be obtained according to the symbol data, and the symbol list of the code file can be displayed in the file navigation area.
In addition, by adopting the technical scheme provided by the embodiment, the selection operation of the symbol in the symbol list can be skipped to the position of the symbol in the code file so as to display the code content corresponding to the symbol, so that a developer can conveniently check the code content corresponding to the symbol, the pertinence of code reading is improved, and the online code reading experience is further optimized.
In addition, by adopting the technical scheme provided by the embodiment, the positioning information of the specified code based on the pre-analysis can be obtained by responding to the detection of the second selection operation of the specified code of the first code content, so that the symbol definition information of the specified code can be obtained according to the positioning information of the specified code, the symbol definition information of the specified code is displayed in a floating manner, the symbol definition information of the specified code can be provided for the research personnel, so that the research personnel can check the code information of the specified code, the pertinence and the convenience of online code reading are improved, and the experience of online code reading is further optimized.
In addition, by adopting the technical scheme provided by the embodiment, the expanding information of the appointed codes can be displayed by responding to the detection of the triggering operation of the checking key in the suspension popup window, and more detailed code information can be provided for the research personnel, so that the research personnel can conveniently read and understand the codes on line, and the experience of reading the codes on line is further optimized.
Fig. 3 is a schematic diagram according to a second embodiment of the present disclosure, as shown in fig. 3.
The method for displaying the page in the embodiment will now be described in detail with reference to an application scenario of a specific online code reading platform.
In this embodiment, as shown in fig. 3, the application scenario includes a page at the front end of the online code reading platform, a code analysis service and a code hosting service at the back end, and a database. The front-end page may be used to handle user behavior and interact with the user. The front-end page may also be used to interact with the back-end to obtain relevant information provided to the user.
Specifically, in the code merging stage, after the code is submitted, code merging processing can be performed, and the code is submitted to a code library of a code hosting service. The code hosting service may write the message into which the code is incorporated into a preset message queue, and the code analysis service may perform snoop message processing on the message queue to obtain the code to be analyzed.
301. A view request for a symbol in a list of symbols is received.
302. And acquiring and displaying code content corresponding to the symbol according to the viewing request of the symbol.
In this embodiment, the left side of the page at the front end of the online code reading platform may display the file list corresponding to the code library in a tree structure. The user can directly open the code file by clicking a certain file in the file list.
Specifically, the content of the file list may be provided by an underlying code hosting service, and the page at the front end obtains the file name under each folder layer by requesting the relevant interface.
In this embodiment, the position parallel to the file navigation on the left side of the page at the front end of the online code reading platform may also provide a symbol navigation function, that is, a navigation list for displaying all symbols of the currently opened file, that is, a symbol list. Clicking on a symbol in the symbol list by the user may locate the row in which the symbol is located.
In this embodiment, first, the user may perform a click operation on a symbol in the symbol list in the front page, and the front page may receive a request for viewing the symbol in the symbol list. Secondly, the page at the front end can send a symbol viewing request to the code analysis service to acquire code content corresponding to the symbol.
Specifically, in the code merging stage, the code analysis service may monitor the code merging message, trigger analysis processing after the code merging, analyze symbol data of all symbols of the code in the code library through a static analysis technology, and store the symbol data in the database.
Specifically, the symbol data stored may include a symbol name, a file path in which the symbol is located, a symbol start line, a symbol end line, code library information, and the like. The code library information may include, among other things, code library names, code library branches, code library versions, and the like.
In this embodiment, first, when a user opens a certain code file on the front page, the front page may request to acquire all symbols of the file, and display all symbols of the code file in the symbol list on the left side. Second, the user clicks on a symbol and may jump to the line of the symbol in the code file.
It will be appreciated that the file reading area of the front page, i.e., the code content area, may open a plurality of code files. Different code files may be switched by the code file tag. And, the location where each code file browses can be recorded, and when other code files are cut back, the location where the code file browses at the time can be returned.
303. A view request for a specified code in the code content is received.
304. And acquiring positioning information of the specified codes according to the view request of the specified codes.
305. And acquiring the code file content of the specified code according to the file path in the view request of the specified code.
306. And extracting the symbol signature and the annotation of the specified code according to the code file content of the specified code so as to display the symbol signature and the annotation in a popup window.
In this embodiment, the symbol definition information may include a symbol signature and an annotation, and different kinds of symbols have different definition information.
In this embodiment, in the code merging stage, the code analysis service may monitor the code merging message, trigger analysis after the code merging, and analyze positioning information corresponding to all symbols in the code library by using a static analysis technique, for example, positions where all classes, methods, functions, etc. appear, defined positions, and referenced positions, and may store the positioning information corresponding to all symbols in the database.
In particular, the saved information may include information and locations of the symbol itself, locations defined by the symbol, locations to which the symbol is referenced, and code library information, among others.
For example, the saved information may include information and locations of the symbols themselves, such as classes, methods, functions, etc.; the defined positions of symbols such as classes, methods, functions, etc.; referenced locations of symbols of classes, methods, functions, etc.; code library related information.
The information and the position of the class can comprise a class name, a file path where the class is located, a line number where the class is located and a column number; the information and the position of the method can comprise the name of the method, the path of the file where the method is located, the line number and the column number where the method is located; the information and location of the function itself may include the name of the function, the path of the file in which the function is located, the line number and column number in which the function is located.
The location of the class definition may include the file path and line number where the class definition resides; the method-defined locations may include the file path and line number where the method definition is located; the location of the function definition may include the file path and line number where the function definition resides. It will be appreciated that the symbol is defined in only one position.
The location where the class is referenced may include the file path and line number where the class is referenced; the location where the method is referenced may include the file path and line number where the method is referenced. The location where the function is referenced may include the file path and line number where the function is referenced. It will be appreciated that there are typically multiple locations to be referenced and that recordings may also be made separately.
The code library related information may include code library names, branches, versions, etc.
It will be appreciated that, in order to save storage space, only the locations of the symbols of classes, methods, functions, etc. and the locations of definitions and references may be saved, and the corresponding code segments may not be recorded.
For example, for the class test, which is defined on line 30 of the a.java file, the database can only store a.java and 30, and the signature and annotation of the class are needed when the definition popup window is displayed, so the code file content of the a.java can be read from the code hosting service, and then the signature and annotation of the class can be extracted according to the line number.
In this embodiment, the user may browse the code by using the mouse to a certain portion of the code while browsing the code on the web page. Here, first, the front-end page may initiate a view request to the code analysis service of the back-end, where the view request may include a name and location information of the partial code, where the location information may include a file path, a line number, a column number, and the like of the partial code. After receiving the check request, the code analysis service can inquire whether the related symbol definition information of the part of codes exists in the database, and if not, the popup window is not displayed; if the relevant symbol definition information is found according to the part code name and the position information, the file, the line number and the like where the definition and the reference are located are returned. Second, the front-end page may initiate a file content retrieval request to the code hosting service, which may carry the file path in which the definition resides. The code hosting service returns the file content corresponding to the file content acquisition request. The front page can extract the signature and annotation corresponding to the symbol from the file content according to the line number, and display the signature and annotation in a popup window mode.
In particular, the pop-up window may include a signature and annotation corresponding to the symbol, and a "view definition" key and a "view reference" key that may be clicked.
Further, the user clicks a 'view definition' button, and the page at the front end can extract the upper row and the lower row of the definition line according to the content of the file where the obtained definition is located, so that a code segment is formed for display.
In addition, the user may jump to a particular file by clicking on the code segment and may jump back to the originally browsed code file by clicking on the key.
It can be understood that the processing manner after the user clicks the "view reference" button is similar to the processing manner of the above-mentioned clicked "view definition" button, and will not be described herein.
According to the scheme, code content corresponding to the user viewing request can be displayed by combining code reading with code analysis according to the user viewing request, and code content words corresponding to the display symbols can be positioned to display definition information popup corresponding to the specified codes of the code file. Thus, the code can be provided with a reading experience comparable to IDE without being downloaded locally, and the online code reading experience can be optimized.
In addition, by adopting the technical scheme provided by the embodiment, better online code reading experience can be provided, and the convenience of online code reading and code understanding is improved.
In addition, by adopting the technical scheme provided by the embodiment, the code reading product is combined with the code analysis technology, so that the code analysis product such as information of class, function definition, reference position and the like can be stored permanently, and the on-line symbol navigation and code skip can be realized by utilizing the pre-analyzed information
It should be noted that, for simplicity of description, the foregoing method embodiments are all described as a series of acts, but it should be understood by those skilled in the art that the present disclosure is not limited by the order of acts described, as some steps may be performed in other orders or concurrently in accordance with the present disclosure. Further, those skilled in the art will also appreciate that the embodiments described in the specification are all of the preferred embodiments, and that the acts and modules referred to are not necessarily required by the present disclosure.
In the foregoing embodiments, the descriptions of the embodiments are emphasized, and for parts of one embodiment that are not described in detail, reference may be made to related descriptions of other embodiments.
Fig. 4 is a schematic diagram according to a third embodiment of the present disclosure, as shown in fig. 4. The apparatus 400 for page display of the present embodiment may include a file display unit 401, a symbol display unit 402, and an information display unit 403. Wherein, the file display unit 401 is configured to display, according to a viewing request of a code file, a first code content and a symbol list of the code file; a symbol display unit 402 for displaying second code content of a symbol in the symbol list in response to detection of a first selection operation of the symbol; an information display unit 403 for suspending display of symbol definition information of a specified code of the first code content in response to detection of a second selection operation of the specified code.
It should be noted that, part or all of the page display device in this embodiment may be an application located in the local terminal, or may also be a functional unit such as a plug-in unit or a software development kit (Software Development Kit, SDK) disposed in the application located in the local terminal, or may also be a processing engine located in a server on the network side, or may also be a distributed system located on the network side, for example, a processing engine or a distributed system in an online code reading platform on the network side, which is not limited in this embodiment.
It will be appreciated that the application may be a native program (native app) installed on the native terminal, or may also be a web page program (webApp) of a browser on the native terminal, which is not limited in this embodiment.
Optionally, in a possible implementation manner of this embodiment, the file display unit 401 may be specifically used to output a code reading page; the code reading page comprises a file navigation area and a code content area, wherein the file navigation area comprises a file list and a symbol list which is associated with the file list; acquiring a viewing request of a code file; according to the viewing request of the code file, displaying the first code content of the code file in the code content area, and displaying the file list and the symbol list of the code file in the file navigation area.
Optionally, in one possible implementation manner of this embodiment, the file display unit 401 may be further configured to obtain, according to a request for viewing a code file, symbol data of the code file obtained based on pre-analysis, so as to obtain a symbol list of the code file; and displaying a symbol list of the code file in the file navigation area.
Optionally, in one possible implementation manner of this embodiment, the symbol display unit 402 may be specifically configured to obtain, in response to detecting a first selection operation of a symbol in the symbol list, location information of the symbol in the first code content; and according to the position information, performing jump processing on the first code content so as to display the second code content of the symbol.
Alternatively, in one possible implementation manner of the present embodiment, the information display unit 403 may be specifically configured to obtain, in response to detecting the second selection operation of the specified code of the first code content, positioning information based on the specified code obtained by the pre-analysis; obtaining symbol definition information of the specified codes according to the positioning information of the specified codes; and displaying symbol definition information of the specified codes in a floating mode.
Optionally, in one possible implementation manner of this embodiment, the information display unit 403 may be further configured to display symbol definition information of the specified code based on a floating popup, where the floating popup includes a view key; and in response to detection of triggering operation of the view key, displaying the extension information of the specified code.
In this embodiment, the first code content and the symbol list of the code file may be displayed by the file display unit according to the viewing request of the code file, and then the symbol display unit may display the second code content of the symbol in the symbol list in response to detecting the first selection operation of the symbol in the symbol list, so that the information display unit may display the symbol definition information of the specified code in a floating manner in response to detecting the second selection operation of the specified code of the first code content.
In addition, by adopting the technical scheme provided by the embodiment, the first code content of the code file can be displayed in the code content area of the code reading page and the file list and the symbol list of the code file can be displayed in the file navigation area according to the viewing request of the code file.
In addition, by adopting the technical scheme provided by the embodiment, the symbol data based on the code file obtained by pre-analysis can be obtained according to the viewing request of the code file, the symbol list of the code file can be obtained according to the symbol data, and the symbol list of the code file can be displayed in the file navigation area.
In addition, by adopting the technical scheme provided by the embodiment, the selection operation of the symbol in the symbol list can be skipped to the position of the symbol in the code file so as to display the code content corresponding to the symbol, so that a developer can conveniently check the code content corresponding to the symbol, the pertinence of code reading is improved, and the online code reading experience is further optimized.
In addition, by adopting the technical scheme provided by the embodiment, the positioning information of the specified code based on the pre-analysis can be obtained by responding to the detection of the second selection operation of the specified code of the first code content, so that the symbol definition information of the specified code can be obtained according to the positioning information of the specified code, the symbol definition information of the specified code is displayed in a floating manner, the symbol definition information of the specified code can be provided for the research personnel, so that the research personnel can check the code information of the specified code, the pertinence and the convenience of online code reading are improved, and the experience of online code reading is further optimized.
In addition, by adopting the technical scheme provided by the embodiment, the expanding information of the appointed codes can be displayed by responding to the detection of the triggering operation of the checking key in the suspension popup window, and more detailed code information can be provided for the research personnel, so that the research personnel can conveniently read and understand the codes on line, and the experience of reading the codes on line is further optimized.
In the technical scheme of the disclosure, the related processes of collecting, storing, using, processing, transmitting, providing, disclosing and the like of the personal information of the user accord with the regulations of related laws and regulations, and the public order colloquial is not violated.
According to embodiments of the present disclosure, the present disclosure also provides an electronic device, a readable storage medium and a computer program product.
Fig. 5 illustrates a schematic block diagram of an example electronic device 500 that may be used to implement embodiments of the present disclosure. Electronic devices are intended to represent various forms of digital computers, such as laptops, desktops, workstations, personal digital assistants, servers, blade servers, mainframes, and other appropriate computers. The electronic device may also represent various forms of mobile devices, such as personal digital processing, cellular telephones, smartphones, wearable devices, and other similar computing devices. The components shown herein, their connections and relationships, and their functions, are meant to be exemplary only, and are not meant to limit implementations of the disclosure described and/or claimed herein.
As shown in fig. 5, the electronic device 500 includes a computing unit 501 that can perform various appropriate actions and processes according to a computer program stored in a Read Only Memory (ROM) 502 or a computer program loaded from a storage unit 508 into a Random Access Memory (RAM) 503. In the RAM 503, various programs and data required for the operation of the electronic device 500 may also be stored. The computing unit 501, ROM 502, and RAM 503 are connected to each other by a bus 504. An input/output (I/O) interface 505 is also connected to bus 504.
A number of components in electronic device 500 are connected to I/O interface 505, including: an input unit 506 such as a keyboard, a mouse, etc.; an output unit 507 such as various types of displays, speakers, and the like; a storage unit 508 such as a magnetic disk, an optical disk, or the like; and a communication unit 509 such as a network card, modem, wireless communication transceiver, etc. The communication unit 509 allows the electronic device 500 to exchange information/data with other devices via a computer network such as the internet and/or various telecommunication networks.
The computing unit 501 may be a variety of general and/or special purpose processing components having processing and computing capabilities. Some examples of computing unit 501 include, but are not limited to, a Central Processing Unit (CPU), a Graphics Processing Unit (GPU), various specialized Artificial Intelligence (AI) computing chips, various computing units running machine learning model algorithms, a Digital Signal Processor (DSP), and any suitable processor, controller, microcontroller, etc. The computing unit 501 performs the respective methods and processes described above, such as a method of page display. For example, in some embodiments, the method of page display may be implemented as a computer software program tangibly embodied on a machine-readable medium, such as storage unit 508. In some embodiments, part or all of the computer program may be loaded and/or installed onto the electronic device 500 via the ROM 502 and/or the communication unit 509. When a computer program is loaded into RAM 503 and executed by computing unit 501, one or more steps of the method of page display described above may be performed. Alternatively, in other embodiments, the computing unit 501 may be configured to perform the method of page display in any other suitable way (e.g., by means of firmware).
Various implementations of the systems and techniques described here above may be implemented in digital electronic circuitry, integrated circuit systems, field Programmable Gate Arrays (FPGAs), application Specific Integrated Circuits (ASICs), application Specific Standard Products (ASSPs), systems On Chip (SOCs), complex Programmable Logic Devices (CPLDs), computer hardware, firmware, software, and/or combinations thereof. These various embodiments may include: implemented in one or more computer programs, the one or more computer programs may be executed and/or interpreted on a programmable system including at least one programmable processor, which may be a special purpose or general-purpose programmable processor, that may receive data and instructions from, and transmit data and instructions to, a storage system, at least one input device, and at least one output device.
Program code for carrying out methods of the present disclosure may be written in any combination of one or more programming languages. These program code may be provided to a processor or controller of a general purpose computer, special purpose computer, or other programmable data processing apparatus such that the program code, when executed by the processor or controller, causes the functions/operations specified in the flowchart and/or block diagram to be implemented. The program code may execute entirely on the machine, partly on the machine, as a stand-alone software package, partly on the machine and partly on a remote machine or entirely on the remote machine or server.
In the context of this disclosure, a machine-readable medium may be a tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. The machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium. The machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any suitable combination of the foregoing. More specific examples of a machine-readable storage medium would include an electrical connection based on one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.
To provide for interaction with a user, the systems and techniques described here can be implemented on a computer having: means for displaying a page display to a user (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor); and a keyboard and pointing device (e.g., a mouse or trackball) by which a user can provide input to the computer. Other kinds of devices may also be used to provide for interaction with a user; for example, feedback provided to the user may be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user may be received in any form, including acoustic input, speech input, or tactile input.
The systems and techniques described here can be implemented in a computing system that includes a background component (e.g., as a data server), or that includes a middleware component (e.g., an application server), or that includes a front-end component (e.g., a user computer having a graphical user interface or a web browser through which a user can interact with an implementation of the systems and techniques described here), or any combination of such background, middleware, or front-end components. The components of the system can be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: local Area Networks (LANs), wide Area Networks (WANs), and the internet.
The computer system may include a client and a server. The client and server are typically remote from each other and typically interact through a communication network. The relationship of client and server arises by virtue of computer programs running on the respective computers and having a client-server relationship to each other. The server may be a cloud server, a server of a distributed system, or a server incorporating a blockchain.
It should be appreciated that various forms of the flows shown above may be used to reorder, add, or delete steps. For example, the steps recited in the present disclosure may be performed in parallel, sequentially, or in a different order, provided that the desired results of the disclosed aspects are achieved, and are not limited herein.
The above detailed description should not be taken as limiting the scope of the present disclosure. It will be apparent to those skilled in the art that various modifications, combinations, sub-combinations and alternatives are possible, depending on design requirements and other factors. Any modifications, equivalent substitutions and improvements made within the spirit and principles of the present disclosure are intended to be included within the scope of the present disclosure.
Claims (15)
1. A method of page display, comprising:
displaying a first code content and a symbol list of a code file according to a viewing request of the code file;
responsive to detecting a first selection operation of a symbol in the symbol list, displaying second code content of the symbol;
in response to detecting a second selection operation of a specified code of the first code content, symbol definition information of the specified code is displayed in suspension.
2. The method of claim 1, wherein the displaying the first code content and the symbol list of the code file according to the view request of the code file comprises:
outputting a code reading page; the code reading page comprises a file navigation area and a code content area, wherein the file navigation area comprises a file list and a symbol list which is associated with the file list;
acquiring a viewing request of the code file;
and displaying the first code content of the code file in the code content area according to the viewing request of the code file, and displaying the file list and the symbol list of the code file in the file navigation area.
3. The method of claim 2, wherein the displaying the symbol list of the code file in the file navigation area according to the view request of the code file comprises:
acquiring symbol data of the code file based on pre-analysis according to a viewing request of the code file so as to acquire a symbol list of the code file;
and displaying a symbol list of the code file in the file navigation area.
4. A method according to any of claims 1-3, wherein said displaying second code content of a symbol in said list of symbols in response to detecting a first selection operation of said symbol comprises:
In response to detecting a first selection operation of a symbol in the symbol list, acquiring position information of the symbol in the first code content;
and according to the position information, performing jump processing on the first code content so as to display the second code content of the symbol.
5. The method of any of claims 1-4, wherein the hovering display of symbol definition information for a specified code of the first code content in response to detecting a second selection operation of the specified code comprises:
in response to detecting a second selection operation of a specified code of the first code content, acquiring positioning information based on the specified code obtained by pre-analysis;
obtaining symbol definition information of the specified codes according to the positioning information of the specified codes;
and displaying symbol definition information of the specified codes in a floating mode.
6. The method of claim 5, wherein the hovering displaying symbol definition information of the specified code comprises:
displaying symbol definition information of the specified codes based on a floating popup window mode, wherein the floating popup window comprises a view key;
and in response to detection of triggering operation of the view key, displaying the extension information of the specified code.
7. An apparatus for displaying a page, comprising:
a file display unit, configured to display a first code content and a symbol list of a code file according to a viewing request of the code file;
a symbol display unit configured to display second code content of a symbol in the symbol list in response to detection of a first selection operation of the symbol;
and an information display unit configured to, in response to detection of a second selection operation of a specified code of the first-code content, hover-display symbol definition information of the specified code.
8. The apparatus of claim 7, wherein the file display unit is specifically configured to:
outputting a code reading page; the code reading page comprises a file navigation area and a code content area, wherein the file navigation area comprises a file list and a symbol list which is associated with the file list;
acquiring a viewing request of the code file;
and displaying the first code content of the code file in the code content area according to the viewing request of the code file, and displaying the file list and the symbol list of the code file in the file navigation area.
9. The apparatus of claim 8, wherein the file display unit is further configured to:
acquiring symbol data of the code file based on pre-analysis according to a viewing request of the code file so as to acquire a symbol list of the code file;
and displaying a symbol list of the code file in the file navigation area.
10. The device according to any of claims 7-9, wherein the symbol display unit is specifically configured to:
in response to detecting a first selection operation of a symbol in the symbol list, acquiring position information of the symbol in the first code content;
and according to the position information, performing jump processing on the first code content so as to display the second code content of the symbol.
11. The device according to any one of claims 7-10, wherein the information display unit is specifically configured to:
in response to detecting a second selection operation of a specified code of the first code content, acquiring positioning information based on the specified code obtained by pre-analysis;
obtaining symbol definition information of the specified codes according to the positioning information of the specified codes;
And displaying symbol definition information of the specified codes in a floating mode.
12. The apparatus of claim 11, wherein the information display unit is further configured to:
displaying symbol definition information of the specified codes based on a floating popup window mode, wherein the floating popup window comprises a view key;
and in response to detection of triggering operation of the view key, displaying the extension information of the specified code.
13. An electronic device, comprising:
at least one processor; and
a memory communicatively coupled to the at least one processor; wherein,,
the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method of any one of claims 1-6.
14. A non-transitory computer readable storage medium storing computer instructions for causing the computer to perform the method of any one of claims 1-6.
15. A computer program product comprising a computer program which, when executed by a processor, implements the method according to any of claims 1-6.
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310033670.2A CN116069424A (en) | 2023-01-10 | 2023-01-10 | Page display method and device, electronic equipment and storage medium |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310033670.2A CN116069424A (en) | 2023-01-10 | 2023-01-10 | Page display method and device, electronic equipment and storage medium |
Publications (1)
Publication Number | Publication Date |
---|---|
CN116069424A true CN116069424A (en) | 2023-05-05 |
Family
ID=86171083
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202310033670.2A Pending CN116069424A (en) | 2023-01-10 | 2023-01-10 | Page display method and device, electronic equipment and storage medium |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN116069424A (en) |
-
2023
- 2023-01-10 CN CN202310033670.2A patent/CN116069424A/en active Pending
Similar Documents
Publication | Publication Date | Title |
---|---|---|
EP3265883B1 (en) | Software robots for programmatically controlling computer programs to perform tasks | |
CN112527748B (en) | Method, device, equipment and storage medium for analyzing user operation behavior | |
US9201648B2 (en) | Associating a visualization of user interface with source code | |
CN110959153B (en) | Application analysis using flexible post-processing | |
US20210209526A1 (en) | Landing page processing method, device and medium | |
CN111125555B (en) | Enterprise information acquisition method and device | |
US20140298194A1 (en) | Providing a personalized navigation experience in a mobile application | |
KR20160125401A (en) | Inline and context aware query box | |
EP3522004A2 (en) | Code execution and data processing pipeline | |
CN113051514A (en) | Element positioning method and device, electronic equipment and storage medium | |
CN114428677A (en) | Task processing method, processing device, electronic equipment and storage medium | |
CN111310044B (en) | Page element information extraction method, device, equipment and storage medium | |
JP2024507902A (en) | Information retrieval methods, devices, electronic devices and storage media | |
CN112506854A (en) | Method, device, equipment and medium for storing page template file and generating page | |
CN111435326B (en) | Method and device for analyzing crash log | |
CN112308602A (en) | Method and apparatus for generating a model | |
CN112667502A (en) | Page testing method, device and medium | |
CN115469849B (en) | Service processing system, method, electronic equipment and storage medium | |
CN113779117A (en) | Data monitoring method and device, storage medium and electronic equipment | |
CN113179183B (en) | Service switch state control device and method | |
WO2023115831A1 (en) | Application testing method and apparatus, electronic device and storage medium | |
CN113687880B (en) | Method, device, equipment and medium for calling component | |
CN116069424A (en) | Page display method and device, electronic equipment and storage medium | |
CN112947984B (en) | Application program development method and device | |
CN114595391A (en) | Data processing method and device based on information search and electronic equipment |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination |