Patent Application
20090235186
When creating and editing complex World Wide Web (“Web”) pages, it is often the case that a user is only interested in working on a particular portion of the Web page. For example, during a particular editing session, a user may focus their efforts on editing the page navigation content within a Web page. During another session, the user may focus their efforts on editing the main content of the Web page.
When a user is focused on editing a particular portion of a complex Web page, the remaining but currently unimportant content of the Web page can diminish the editing experience in several ways. For instance, the currently unimportant content on the Web page may be distracting to the user. Moreover, displaying the unimportant content requires a portion of the display screen, thereby causing the particular portion of the Web page being edited to be rendered in a smaller area. Additionally, the performance of the editor program utilized to edit the Web page may be reduced because of the resources needed to render the currently unimportant Web page content.
It is with respect to these considerations and others that the disclosure made herein is presented.
Technologies and concepts are presented herein for limited-scope rendering of a document, such as a Web page. In particular, through the use of the embodiments presented herein, the scope of a Web page rendered and displayed by an editor program can be limited to a specific code or page element defined by the Web page. Rendering and displaying only the desired portion of the Web page simplifies the editing experience, maximizes the available area of a screen display, and may improve the performance of the editor program by allowing the program to only render the desired element.
According to one aspect presented herein, an editor program provides functionality for editing a document, such as a Web page, that contains code that when rendered or executed generates one or more graphical page elements. In one implementation, the editor program provides a split view user interface for editing a Web page. The split view user interface includes a first section that shows the code of the Web page and a second section that is utilized to display the rendered graphical page elements. The editor program provides functionality for editing the code and the page elements.
According to other aspects, the editor program also provides functionality for “zooming” into a specified scope within the code or the displayed page elements. As described herein, the term zooming refers to the process of rendering and displaying only a specified scope within the code and/or page elements. For instance, in one implementation, a user may select one of the page elements in the split view user interface and request to “zoom” into the page element. In response to such a request, the editor program renders and displays only the selected page element in the second section of the user interface. Additionally, only the code responsible for generating the selected page element is displayed and made available for editing in the first section of the user interface. Code and page elements outside the specified scope are not rendered or displayed. In one implementation, the selected page element is rendered in a manner that fills the entire second section of the user interface, thereby maximizing the use of the available display area. At any time, the user may request to zoom out of the selected page element, thereby showing all of the code and page elements.
According to another aspect, a user may also select a portion of the code displayed in the first portion of the split view user interface and request to zoom into the selected code. For instance, the selected portion may comprise code for generating one of the page elements. In response thereto, the editor program displays only the selected code in the first section of the user interface. The editor program also renders and displays only the page element, or elements, generated by the selected code in the second section of the user interface. The user may request to zoom out of the selected code, thereby showing all of the code and page elements.
According to another aspect, the editor program also provides a code view user interface and a design view user interface. The code view user interface provides a single display section for showing the code, but does not display the rendered graphical page elements as in the split view user interface. The design view user interface provides a single display section for showing the rendered graphical page elements, but does not display the code. According to aspects, functionality is provided for zooming into a selected scope of code within the code view user interface and for zooming into a page element shown in the design view user interface. When the user interface is zoomed into the code or a page element and a transition is made between the split view, code view, and design view user interfaces, only the zoomed code or page element is displayed in each of the user interfaces. In this manner, a user can utilize each of the user interfaces while remaining zoomed in to the specified code or page element.
It should be appreciated that the above-described subject matter may also be implemented as a computer-controlled apparatus, a computer process, a computing system, or as an article of manufacture such as a computer-readable medium. These and various other features will be apparent from a reading of the following Detailed Description and a review of the associated drawings.
This Summary is provided to introduce a selection of concepts in a simplified form that are further described below in the Detailed Description. This Summary is not intended to identify key features or essential features of the claimed subject matter, nor is it intended that this Summary be used to limit the scope of the claimed subject matter. Furthermore, the claimed subject matter is not limited to implementations that solve any or all disadvantages noted in any part of this disclosure.
The following detailed description is directed to technologies for limited scope rendering. While the subject matter described herein is presented in the general context of program modules that execute in conjunction with the execution of an operating system and application programs on a computer system, those skilled in the art will recognize that other implementations may be performed in combination with other types of program modules. Generally, program modules include routines, programs, components, data structures, and other types of structures that perform particular tasks or implement particular abstract data types. Moreover, those skilled in the art will appreciate that the subject matter described herein may be practiced with other computer system configurations, including hand-held devices, multiprocessor systems, microprocessor-based or programmable consumer electronics, minicomputers, mainframe computers, and the like.
In the following detailed description, references are made to the accompanying drawings that form a part hereof, and which are shown by way of illustration specific embodiments or examples. Referring now to the drawings, in which like numerals represent like elements through the several figures, aspects of a computing system and methodology for limited-scope rendering will be described.
Turning now to
In one embodiment, the client computer 102 illustrated in
According to embodiments, the client computer 102 is also operative to execute a Web browser program 110. As known in the art, the Web browser program 110 is capable of communicating with a Web server program 114 executing on the server computer 104 to retrieve, render, and display a Web page 112 and any associated resources at the client computer 102. A Web page, such as the Web page 112, is a resource of information that is suitable for delivery via the World Wide Web (e.g. via the Hypertext Transfer Protocol (“HTTP”)). For instance, the Web page 112 may comprise a document that includes code which, when rendered and/or executed at the client computer 102 or the server computer 104, generates one or more graphical page elements. Page elements are any graphical object that can be rendered and displayed by a Web browser.
It should be appreciated that, according to embodiments, the Web page 112 may contain markup language code, such as the Hypertext Markup Language (“HTML”), and/or program code, including but not limited to scripts or other types of executable or interpretable program code. For instance, the Web page 112 may include ASP.NET code, JAVASCRIPT, Extensible Style Sheet Language (“XSL”) code, Cascading Style Sheet (“CSS”) code, FLASH or SILVERLIGHT code, or others. Accordingly, the term “code” as used herein includes any data that can be rendered, executed, interpreted, or otherwise utilized to generate a page element. It should be appreciated that the Web page 112 may also be stored statically or generated dynamically by the Web server program 114, and may include content that is contributed from other Web pages, such as a template or master page, off of which the Web page 112 is based.
According to aspects, the client computer 102 may also be configured to execute an editor program 116 (referred to herein as the “editor”). The editor 116 is a program that includes functionality for creating and editing Web pages, such as the Web page 112. Through the functionality provided by the editor 116, a user can retrieve the Web page 112 from the server computer 104, edit the Web page 112, and store the edited Web page 112 back to the server computer 104. The Web server program 114 may then deliver the edited Web page 112 to the Web browser program 110 executing on the client computer 102 and to other client computers.
In order to facilitate the editing of a Web page 112, the editor 116 provides several user interfaces for editing code and page elements. In particular, according to one embodiment, the editor 116 provides a split view user interface, a code view user interface, and a design view user interface. As will be discussed in greater detail below, the split view user interface includes one section that shows the code of the Web page and another section that is utilized to display the rendered graphical page elements. As will also be discussed in greater detail below, the code view user interface provides a single section for showing the code, but does not display the rendered graphical page elements as in the split view user interface. The design view user interface provides a single section for showing the rendered graphical page elements, but does not display the code. Additional details regarding the split view user interface will be provided below with respect to
As will also be discussed in greater detail below, the editor 116 also provides functionality for zooming into a specified scope within the code of the Web page 112 or the displayed page elements. As mentioned above, the term zooming refers to the process of rendering and displaying only a specified scope within the code and/or page elements. For instance, in one implementation, a user may select one of the page elements in the split view user interface and request to zoom into the page element. In response to such a request, the editor 116 renders and displays only the selected page element in the design section of the user interface. Additionally, only the code responsible for generating the selected page element is displayed and made available for editing in the code section of the user interface. Code and page elements outside the specified scope are not rendered or displayed. At any time, the user may request to zoom out of the selected page element, thereby showing all of the code and page elements.
According to one embodiment, a user may also select a portion of the code displayed in the code section of the split view user interface and request to zoom into the selected code. For instance, the selected code portion may comprise code for generating one of the page elements. In response thereto, the editor 116 displays only the selected code in the first section of the user interface. The editor 116 also renders and displays only the page element, or elements, generated by the selected code in the design section of the split view user interface. The user may request to zoom out of the selected code, thereby showing all of the code and page elements. Details regarding the functionality provided by the split view user interface in this regard are discussed below with respect to
Referring now to
As also shown in
According to embodiments presented herein, selection of the user interface button 206D will cause the code view user interface 200 shown in
Once the zoom scope has been specified and a user selects the user interface button 206D, the section 202 of the code view user interface 200 is modified to display only the portion of the code within the selected scope. Code outside the selected scope is not displayed in the section 202. The user can edit the code within the selected scope while the display is zoomed in. In order to return to a view showing the entire code 204 of the Web page 112, the user may again select the button 206D or perform another type of pre-defined user input such as selecting an “escape” key. Any changes made to the Web page 112 while zoomed are automatically saved. There is no need for the user to manually save the changes. Additional details regarding the zooming of the code view user interface are provided below with respect to
Turning now to
As also shown in
Referring now to
As also shown in
As mentioned above, selection of the user interface button 206D may also cause the split view user interface 300 to be zoomed into a selected portion 402 of the code 204. For instance, using an appropriate user interface control, a user may select a portion 402 of the code 204. The user may then select the user interface button 206D to zoom into the selected portion 402. In order to zoom into the selected portion 402 of the code 204, the editor 116 only displays the selected portion 402 of the code 204 in the section 202. The remainder of the code 204 is not displayed in the section 202. Additionally, the editor 116 only renders the selected portion 402 of the code 204. In this manner, the editor 116 only renders and displays the page elements in the section 302 that are generated by the selected portion 402 of the code 204.
According to embodiments, the editor 116 provides functionality for moving between the code view user interface, the design view user interface, and the split view user interface while zoomed in to a portion of the code 204 or a page element 304. For instance, if a user selects the user interface button 206C while the screen display shown in
Referring now to
The routine 800 begins at operation 802, where the editor 116 displays the code view user interface 200, the design view user interface 300, or the split view user interface 400. While any of these user interfaces are shown, a user is permitted to edit the code 204, the page elements 304, or both, in the manner described above. From operation 802, the routine 800 continues to operation 804, where the editor 116 receives a selection of a portion of the code 204 or one of the page elements 304. The routine 800 then continues to operation 806.
At operation 806, the editor 116 receives a request to zoom into a specified scope of the Web page 112 defined by the selected portion 402 of the code 204 or the selected page element 304. As discussed above, the user interface button 206D or another user interface control may be utilized to provide the zoom request. In response to receiving the zoom request, the routine 800 continues to operation 808, where the editor 116 renders only the elements within the selected scope. For instance, if a portion 402 of the code 204 is selected, only the code portion will be rendered and displayed in the manner described above. If one of the page elements 304 is selected, only the selected page element will be rendered and displayed and only the code corresponding to the selected page element will be shown in the code and split view user interfaces as discussed above. Once the zooming operation has been performed, the routine 800 continues to operation 810.
At operation 810, the user is permitted to continue editing the Web page 112 while the user interface is zoomed in. In the code view user interface 200, the user can edit the code 204. In the design view user interface 300, the user can edit the page elements 304. In the split view user interface 400, the user can edit both the code 204 and the page elements 304.
From operation 810, the routine 800 continues to operation 812, where a determination is made as to whether the user has requested to zoom out. If not, the routine 800 returns to operation 810, where additional editing is permitted. If so, the routine 800 proceeds to operation 814, where the entire Web page 112 is rendered and the rendering and/or the code 204 are displayed depending upon the current view. From operation 814, the routine 800 returns to operation 802, where the above-described process is repeated.
It should be appreciated that, according to embodiments, the page elements 304 may be organized into groups, such as by a container object or content placeholder in the Web page 112. In this embodiment, a user may select the placeholder and request to zoom into the page element, or elements, within the selected placeholder. When received in the split view user interface 400, such a request will cause only the code 204 responsible for generating the page elements 304 within the selected placeholder to be displayed in the section 202. Only the page elements 304 within the selected placeholder will be rendered and displayed in the section 302.
It should also be appreciated that zoomed page elements 304 are rendered in the proper context within the Web page 112 even if the page elements 304 have parent content that is not rendered because it is outside of the rendered scope. For instance, some Web technologies, like contextual cascading style sheets (“CSS”) and ASP.NET, depend upon an object's hierarchy within the page or upon the interaction of multiple page elements and their respective properties. The editor 116 maintains a tree that includes full information on all of the elements within the Web page 112 so that these technologies will still function as expected even if content they depend upon is out of the rendered scope of the Web page 112.
The computer architecture shown in
The mass storage device 910 is connected to the CPU 902 through a mass storage controller (not shown) connected to the bus 904. The mass storage device 910 and its associated computer-readable media provide non-volatile storage for the client computer 102. Although the description of computer-readable media contained herein refers to a mass storage device, such as a hard disk or CD-ROM drive, it should be appreciated by those skilled in the art that computer-readable media can be any available computer storage media that can be accessed by the client computer 102.
By way of example, and not limitation, computer-readable media may include volatile and non-volatile, removable and non-removable media implemented in any method or technology for storage of information such as computer-readable instructions, data structures, program modules or other data. For example, computer-readable media includes, but is not limited to, RAM, ROM, EPROM, EEPROM, flash memory or other solid state memory technology, CD-ROM, digital versatile disks (“DVD”), HD-DVD, BLU-RAY, or other optical storage, magnetic cassettes, magnetic tape, magnetic disk storage or other magnetic storage devices, or any other medium which can be used to store the desired information and which can be accessed by the client computer 102.
According to various embodiments, the client computer 102 may operate in a networked environment using logical connections to remote computers such as the server computer 104 through a network such as the network 106. The client computer 102 may connect to the network 106 through a network interface unit 906 connected to the bus 904. It should be appreciated that the network interface unit 906 may also be utilized to connect to other types of networks and remote computer systems. The client computer 102 may also include an input/output controller 912 for receiving and processing input from a number of other devices, including a keyboard, mouse, or electronic stylus (not shown in
As mentioned briefly above, a number of program modules and data files may be stored in the mass storage device 910 and RAM 914 of the client computer 102, including an operating system 108 suitable for controlling the operation of a networked desktop, laptop, or server computer. The mass storage device 910 and RAM 914 may also store one or more program modules and associated data. In particular, the mass storage device 910 and the RAM 914 may store the editor 116 and the Web page 112, each of which has been described in detail above with respect to
Based on the foregoing, it should be appreciated that technologies for limited-scope rendering are provided herein. Although the subject matter presented herein has been described in language specific to computer structural features, methodological acts, and computer readable media, it is to be understood that the invention defined in the appended claims is not necessarily limited to the specific features, acts, or media described herein. Rather, the specific features, acts and mediums are disclosed as example forms of implementing the claims.
The subject matter described above is provided by way of illustration only and should not be construed as limiting. Various modifications and changes may be made to the subject matter described herein without following the example embodiments and applications illustrated and described, and without departing from the true spirit and scope of the present invention, which is set forth in the following claims.
