Abstract:
The present invention provides a method of providing manipulated content to a user from a website page. The method identifies the location and size of defined regions within a website page, such as document division elements. The site page is built on a virtual display, and a site page coordinate system is established to locate the defined region relative to an origin. The site page is then converted to an image file, where an image file coordinate system corresponds to the site page coordinate system to permit the locating and mapping of the defined regions images on the image file, for cropping and so that the original hyperlinks can be reassociated with the defined regions images. Individual defined regions images in cropped form may be communicated to and positioned on a user interface. An updated image may compared with the original image to determine if the content has changed.

Description:
RELATED APPLICATION DATA 
       [0001]    This application is a continuation of U.S. nonprovisional application Ser. No. 14/290,839 filed on May 29, 2015, which claims the priority date of U.S. provisional application No. 61/806,805 filed on Mar. 29, 2013, each of which is incorporated by reference in their entirety. 
     
    
     BACKGROUND 
       [0002]    The present method relates to methods of detecting and manipulating defined regions within web pages, and more particularly, to a method of consolidating web pages by periodically collecting data from a user-selected group of web resources for display to the user. 
         [0003]    Webpages are often comprised of multiple defined regions of structured elements, such as a document division elements or “divs” (indicated by the &lt;div&gt;tag in HTML). The defined regions permit organization of the content in blocks, where each block may contain a specific content, links, or a div within a div, etc. News webpages especially utilize defined regions, with each block potentially displaying a headline, an article teaser, one or more hyperlinks, contact information, and the like. Alternatively, a webpage may contain a large defined region with a single, complete article, surrounded by blocks containing internal site links, advertising, and similar information related or unrelated to the main article. 
         [0004]    What is needed is a means to detect and define the location of defined regions within a webpage for manipulation and conversion to more readable and understandable forms; and, ultimately, delivery to an end user in a desired format. 
       SUMMARY OF THE INVENTION 
       [0005]    A method of mapping of defined regions within a webpage is described herein. The steps of the method of providing content to a user includes communicating a resource address from a user input on a local computing device to a web browser instance on a remote server. Then, building a site page associated with the resource address within the web browser instance and detecting a site page code indicative of a defined region within the site page. Next, storing a boundary and a coordinate of the defined region relative to an origin. At least a portion of the site page that at least includes the defined region is converted into an image file, where the image file is visually representative of the portion of the site page. A position is defined on the image file which substantially corresponds to the coordinate of the defined region. An area on the image file is defined which includes the position and substantially corresponds to the boundary of the defined region. At least part of the image file is stored on the remote server, with the position and the area data, such that a defined region image portion can be located on the part of the image file. 
         [0006]    The coordinate of the defined region comprises a horizontal coordinate and a vertical coordinate, the horizontal coordinate defining a horizontal pixel count from the origin and the vertical coordinate defining a vertical pixel count from the origin, the method further comprising the steps of:
   assigning a screen resolution to a virtual screen;   assigning a location for the origin on the virtual screen for a site page coordinate system;   locating the horizontal coordinate and the vertical coordinate of the defined region relative to the origin; and   storing the horizontal pixel count of the horizontal coordinate and the vertical pixel count of the vertical coordinate on the remote server.   
 
         [0011]    The boundary comprises a pixel height count and a pixel width count of the defined region, the boundary including the coordinate of the defined region, the method further comprising the step of:
   storing the pixel height count and the pixel width count on the remote server.   
 
         [0013]    An image resolution of the image file corresponds to the screen resolution of the virtual screen, and wherein an image coordinate system corresponds to the site page coordinate system, the method further comprising the steps of:
   associating the horizontal pixel count and the vertical pixel count with the part of the image file to locate the defined region image portion within the part of the image file; and   associating the pixel height count and the pixel width count with the part of the image file to determine the area of the defined region image portion.   
 
         [0016]    Alternative steps may include defining a crop boundary on the part of the image file, the crop boundary being defined on the part of the image file by the horizontal pixel count, the vertical pixel count, the pixel width count, and the pixel height count; cropping the part of the image file at the crop boundary to create a cropped image file containing at least the defined region image portion; and storing the cropped image file on the remote server. 
         [0017]    Alternative steps may include communicating the cropped image file to the local computing device; and displaying the cropped image file on a screen of the local computing device. Alternative steps may include defining a user coordinate system within a graphical user interface on the local computing device; positioning the cropped image file to a desired coordinate on the graphical user interface; storing an association between the desired coordinate and the cropped image file on the server. 
         [0018]    Alternative steps may include
   communicating again the resource address to the web browser instance;   building an updated site page associated with the resource address within the web browser instance;   detecting an updated defined region similarly with the boundary and the coordinate of the defined region;   converting at least an updated portion of the updated site page that at least includes the updated defined region into an updated image file, the updated image file being visually representative of the updated portion of the updated site page;   defining the position on the updated image file which substantially corresponds to the coordinate of the updated defined region;   defining the area on the image file which includes the position and substantially corresponds to the boundary of the defined region; and   storing at least an updated part of the updated image file, the updated position, and the updated area on the remote server, such that an updated defined region image portion can be located on the part of the image file.   
 
         [0026]    Alternative steps may include defining the crop boundary on the updated part of the updated image file, the updated crop boundary being defined on the updated part of the updated image file by the horizontal pixel count, the vertical pixel count, the pixel width count, and the pixel height count; cropping the updated part of the updated image file at the crop boundary to create an updated cropped image file containing the updated defined region image portion; and storing the updated cropped image file on the remote server. 
         [0027]    Alternative steps may include converting the cropped image file into a hash value; converting the updated cropped image file into an updated hash value; and comparing the hash value to the updated hash value to determine if the hash value is different than the updated hash value due to a content change within the boundary and the coordinate. Alternatively, the defined region is a document division element. 
         [0028]    Alternative steps may include:
   detecting the presence of a hyperlink with a resource address link within the defined region;   creating a local coordinate system with a local origin within the defined region;   detecting a hyperlink coordinate and a hyperlink boundary relative to the local origin, the hyperlink boundary enclosing at least a section of a text or a graphic associated with the hyperlink; and   storing the hyperlink coordinate and the hyperlink boundary on the local server.   
 
         [0033]    Alternatively, the hyperlink coordinate within the defined region comprises a horizontal hyperlink coordinate and a vertical hyperlink coordinate, the horizontal hyperlink coordinate defining a horizontal hyperlink pixel count from the local origin and the vertical hyperlink coordinate defining a vertical hyperlink pixel count from the local origin, and wherein the hyperlink boundary comprises a hyperlink pixel height count and a hyperlink pixel width count of the defined region, where alternative steps may include:
   assigning a screen resolution for a virtual screen;   assigning a location of the origin on the virtual screen;   locating the local origin relative to the origin;   locating the horizontal hyperlink coordinate and the vertical hyperlink coordinate of the hyperlink relative to the local origin within the defined region;   assigning the hyperlink pixel height count and the hyperlink pixel width count;   storing the horizontal hyperlink pixel count, the vertical hyperlink pixel count, the hyperlink pixel height count, and the hyperlink pixel width count on the remote server, such that a hyperlink image portion can be located on the defined region image portion and so that the resource address link can be associated with the hyperlink image portion.   
 
         [0040]    Alternatively, an image resolution of the image file corresponds to the screen resolution of the virtual screen, the method further comprising the steps of:
   associating the horizontal pixel count and the vertical pixel count with the part of the image file to locate the defined region image portion within the part of the image file;   associating the pixel height count and the pixel width count with the part of the image file to determine the area of the defined region image portion;   defining a hyperlink position on the hyperlink image portion which substantially corresponds to the hyperlink coordinate;   defining a hyperlink area on the image file which includes the position and substantially corresponds to the hyperlink boundary;   associating the horizontal hyperlink pixel count and the vertical hyperlink pixel count with defined region image portion to locate the hyperlink position within the defined region image portion; and   associating the hyperlink pixel height count and the hyperlink pixel width count with defined region image portion to determine the hyperlink area.   
 
         [0047]    Optionally, the local origin is the coordinate of the defined region. Optionally, the hyperlink is a hypertext, the hyperlink boundary enclosing at least the section of the hypertext. Optionally, the hyperlink is a hypergraphic, the hyperlink boundary enclosing at least the section of the hypergraphic. Optionally, the resource address link is associated with the hyperlink image portion, such that selecting the hyperlink image portion causes navigation to a site associated with the resource address link. 
     
    
     
       BRIEF DESCRIPTION OF THE SEVERAL VIEWS OF THE DRAWINGS 
         [0048]    Additional objects and features if the method will be more readily apparent from the following detailed description and appended claims when taken in conjunction with the drawings, in which: 
           [0049]      FIGS. 1A-B  illustrate a typical site page within a web browser instance, schematically showing multiple defined regions; 
           [0050]      FIGS. 2A-B  illustrate the image resulting from the conversion of the site page into an image file, with selected defined regions described; 
           [0051]      FIGS. 3A-C  illustrate the detection of hyperlinks within an example defined region through the image conversion process; 
           [0052]      FIGS. 4A-C  illustrate the detection of hyperlinks within another example defined region through the image conversion process; 
           [0053]      FIG. 5  illustrates an example local computing device screen upon which several example defined regions are positioned; and 
           [0054]      FIGS. 6A-B  illustrate the comparison of a cropped image with an updated cropped image. 
       
    
    
     LISTING OF REFERENCE NUMERALS of FIRST-PREFERRED EMBODIMENT 
       [0055]    web browser instance  20   
         [0056]    virtual screen  21   
         [0057]    site page  22   
         [0058]    header  24   
         [0059]    navigation bar  26   
         [0060]    page background  28   
         [0061]    canvas  30   
         [0062]    main content  32   
         [0063]    first defined region  34   
         [0064]    first subregion  36   
         [0065]    second subregion  38   
         [0066]    second defined region  40   
         [0067]    third defined region  42   
         [0068]    defined regions  44 - 56   
         [0069]    origin  58   
         [0070]    first boundary  60   
         [0071]    first coordinate  61   
         [0072]    second boundary  62   
         [0073]    second coordinate  63   
         [0074]    third boundary  64   
         [0075]    third coordinate  65   
         [0076]    horizontal pixel count  66   
         [0077]    vertical pixel count  68   
         [0078]    graphic  70   
         [0079]    updated graphic  72   
         [0080]    image file  74   
         [0081]    first defined region image portion  76   
         [0082]    second defined region image portion  78   
         [0083]    third defined region image portion  80   
         [0084]    first subregion image portion  82   
         [0085]    second subregion image portion  84   
         [0086]    first area  86   
         [0087]    second area  88   
         [0088]    third area  90   
         [0089]    first position  92   
         [0090]    second position  94   
         [0091]    third position  96   
         [0092]    first subregion image position  98   
         [0093]    second subregion image position  100   
         [0094]    first subregion area  102   
         [0095]    second subregion area  104   
         [0096]    first boundary width w 1   
         [0097]    first boundary height h 1   
         [0098]    second boundary width w 2   
         [0099]    second boundary height h 2   
         [0100]    third boundary width w 3   
         [0101]    third boundary height h 3   
         [0102]    first cropped image  106   
         [0103]    second cropped image  108   
         [0104]    third cropped image  110   
         [0105]    updated cropped image  112   
         [0106]    local computing device screen  114   
         [0107]    user system origin  116   
         [0108]    first user coordinate  118   
         [0109]    second user coordinate  120   
         [0110]    third user coordinate  122   
         [0111]    user interface background  124   
         [0112]    third hypertext link  126   
         [0113]    second hypertext link  127   
         [0114]    hypergraphic link  128   
         [0115]    external link  130   
         [0116]    article excerpt  132   
         [0117]    article excerpt  134   
         [0118]    third hyperlink boundary  136   
         [0119]    second hyperlink boundary  138   
         [0120]    graphic hyperlink boundary  140   
         [0121]    hyperlink coordinate  142 ,  144 ,  146   
         [0122]    hyperlink image portion  148 ,  150 ,  152   
         [0123]    updated site page  154   
       DESCRIPTION OF THE PREFERRED EMBODIMENTS 
       [0124]    The detailed descriptions set forth below in connection with the appended drawings are intended as a description of embodiments of the invention, and is not intended to represent the only forms in which the present invention may be constructed and/or utilized. The descriptions set forth the structure and the sequence of steps for constructing and operating the invention in connection with the illustrated embodiments. It is to be understood, however, that the same or equivalent structures and steps may be accomplished by different embodiments that are also intended to be encompassed within the spirit and scope of the invention. 
         [0125]    Example computer networks are well known in the art, often having one or more client computers and a server, on which any of the methods and systems of various embodiments may be implemented. In particular the computer system, or server in this example, may represent any of the computer systems and physical components necessary to perform the computerized methods discussed in connection with the present figures and, in particular, may represent a server (cloud, array, etc.), client, or other computer system upon which e-commerce servers, websites, web browsers and/or web analytic applications may be instantiated. 
         [0126]    The server and client computer are known to a person of ordinary skill in the art, and may include a processor, a bus for communicating information, a main memory coupled to the bus for storing information and instructions to be executed by the processor and for storing temporary variables or other intermediate information during the execution of instructions by processor, a static storage device or other non-transitory computer readable medium for storing static information and instructions for the processor, and a storage device, such as a hard disk, may also be provided and coupled to the bus for storing information and instructions. The server and client computers may optionally be coupled to a display for displaying information. However, in the case of servers, such a display may not be present and all administration of the server may be via remote clients. Further, the server and client computers may optionally include an input device for communicating information and command selections to the processor, such as a keyboard, mouse, touchpad, and the like. 
         [0127]    The server and client computers may also include a communication interface coupled to the bus, for providing two-way, wired and/or wireless data communication to and from the server and/or client computers. For example, the communications interface may send and receive signals via a local area network or other network, including the Internet. 
         [0128]    The hard drive of the server or the client computer is encoded with executable instructions, that when executed by a processor cause the processor to perform acts as described in the present methods. The server communicates through the Internet with the client computer to cause information and/or graphics to be displayed on the screen, such as HTML code, text, images, and the like. The server may host the URL (uniform resource locator) site with the article or other information, which may be accessed by the client computer. Information transmitted to the client computer may be stored and manipulated according to the methods described below, using the software encoded on the client device. 
         [0129]    While the following description may discuss processing, storage, computers, screens, screen interface, user interface, inputs, outputs as well as a multitude of steps, procedures, logic, handling and the like, it is understood that any of these various steps may be accomplished on a single device, multiple devices or with a single executable code base, or many. Further when multiple different devices are used they may be connected in a multitude of ways and in many configurations. They may for example be hard-wired together, communicate by way of the internet, radio signal or any signal on the electromagnetic spectrum suitable for communicating such information. Multiple devices may be in one location or many and the many process steps described in this method may be broken up in a myriad of ways and among many devices. Processing of these steps may happen in series or in parallel and on one or many devices. There may be one or many users and user interfaces and there may be a number of different formats on which users may receive formation. 
         [0130]    Accordingly, the present method provides content to a user from a site page ( 22 ) built within a web browser instance ( 20 ) on a virtual screen ( 21 ) or an actual screen. A simplified example site page ( 22 ) is illustrated in schematic form in  FIGS. 1A-B , with a header ( 24 ) generally found at the top of the canvas ( 30 ) portion of the site page ( 22 ), with a navigation bar ( 26 ) with various internal links usually found beneath the header ( 24 ). The canvas ( 30 ) is generally positioned over the page background ( 28 ). Within the main content area ( 32 ) are a plurality of defined regions ( 34 - 56 ). Although the defined regions ( 34 - 56 ) are shown in rectangular block form, various shaped regions are possible, such as regions which may be created to match a complex boundary of a graphic (e.g., a map, etc.). Within each defined region ( 34 - 56 ) there may be displayed a headline, an article teaser, one or more hyperlinks, contact information, and the like. 
         [0131]    In particular, and to simplify the example, three defined regions ( 34 ,  40 ,  42 ) will be explored according to the method. However, the method described in reference to defined regions ( 34 ,  40 ,  42 ) may be utilized to manipulate, modify, and convert the remaining defined regions ( 44 - 56 ) similarly. Specifically,  FIG. 1B  illustrates the detection and measurement of the three example defined regions ( 34 ,  40 ,  42 ) within the site page ( 22 ), as would be displayed on a virtual screen ( 21 ). The virtual screen ( 21 ) emulates an actual monitor screen utilizing software, such as an instruction that the computer, such as a server, is connected to the actual monitor screen with an assigned display resolution in pixels. The screen resolution may be fixed, such as 1440 pixels×900 pixels. Preferably, the screen resolution is variable, at least in part, to match the pixel dimensions of the site page ( 22 ). For example, the width of the virtual screen may be fixed at 1440 pixels, and the height varies according to the pixel height of the site page ( 22 ) or, for lengthy pages, a maximum pixel height may be implemented, truncating a portion of the site page ( 22 ). Page down, page up, and similar commands may be emulated to cause the entire length of the site page ( 22 ) below the fold to load. Thus, for most site pages ( 22 ), the entire length (to y max ) is loaded and built, so that the image file ( 74 ) is an image representative of the entire width and length of the site page ( 22 ). 
         [0132]    Within the HTML code (or other code used in website design) are indicators of defined regions, such as the example div block with an internal hyperlink &lt;div id=“Article1” div style=“height:125px; width:75px”&gt;&lt;a href=“http://webaddress.com” target=“_blank”&gt;Article 1 Title&lt;/a&gt;&lt;/div&gt;. This example code would display a defined region with a dimension of 125 pixels high and 75 pixels wide. Alternatively, CSS can be used to set various styles and dimensions. The text within the defined region would be “Article 1 Title”. By clicking on the text, the browser will be directed to the link (webaddress.com) within a new browser instance. Thus, by exploring the known parameters of each defined region and the surrounding defined regions, the width, height, and location of the defined region can be determined and recorded as a pixel dimension on a Cartesian coordinate system. 
         [0133]    Looking more closely at  FIG. 1B , the first defined region ( 34 ) has a first boundary ( 60 ) with a first coordinate ( 61 ) in the upper left corner and is indicated by x 1  and y 1 , although any point may be selected for the first coordinate. The second defined region ( 40 ) has a second coordinate ( 63 ) and a second boundary ( 62 ). The second coordinate ( 63 ) (x 2 , y 2 ) is located relative to the origin ( 58 ) by a horizontal pixel count ( 66 ) and a vertical pixel count ( 68 ). The first defined region ( 34 ) has a first subregion ( 36 ) and a second subregion ( 38 ) within the first boundary ( 60 ). 
         [0134]    Looking at  FIGS. 2A-B , the site page ( 22 ) has been converted into an image file ( 74 ), with an image origin at the upper left corner which corresponds to the site page origin ( 58 ). The x max  and the y max  dimension of the image file ( 74 ) matches the x max  and the y max  dimension of the site page ( 22 ), although the dimension of the image file ( 74 ) may be smaller or larger than the dimension of the site page ( 22 ) in alternate examples. The first position ( 92 ) of the first defined region image portion ( 76 ) is bounded by the first area ( 86 ) which directly corresponds to the size of the first boundary ( 60 ). The first boundary width (w 1 ) and the first boundary height (h 1 ) are illustrated by dimensions.  FIG. 2B  is a magnified view of the image file ( 74 ), detailing the first defined region image portion ( 76 ), with the first subregion image portion ( 82 ) with first subregion area ( 102 ) and the second subregion image portion ( 84 ) with the second subregion area ( 104 ), both within the first area ( 86 ). The first subregion image portion ( 82 ) has a first subregion image position ( 98 ), indicated as (x 1 ′, y 1 ′). The second subregion image portion ( 84 ) has a second subregion image position ( 100 ), indicated as (x 1 ″, y 1 ″). The first position ( 92 ) is generally a Cartesian coordinate with a pixel unit and the origin ( 0 ,  0 ), where the image origin preferably matches the location of the site page origin ( 58 ), so that the dimensions found in the code can be ultimately matched to and overlaid on the image file ( 74 ). 
         [0135]      FIGS. 3A-C  show the conversion of the third defined region ( 42 ) to an image ( 78 ) with the origin ( 96 ) indicated as (x 3 , y 3 ), as shown in  FIG. 3C . The text associated with the third hypertext link ( 126 ) is enclosed with a third hyperlink boundary ( 148 ) with a hyperlink coordinate ( 142 ) indicated as (x 3 +a, y 3 +b), which locates a clickable link on the image file which corresponds to the image of the third hypertext link ( 126 ). The external link ( 130 ) is ignored, due to a resource address differing from the site page ( 22 ) address. Likewise, the hyperlink image portions ( 150 ,  152 ) are associated with graphic ( 70 ) and second hyperlink text ( 127 ) respectively, and have clickable regions on the image portion ( 150  and  152 ). 
         [0136]      FIG. 5  shows the local computing device screen ( 114 ) with the cropped images ( 106 ,  108 ,  110 ) positioned on the background for display to a user. The user selects the position of the cropped images ( 106 ,  108 ,  110 ) by known methods, such as selecting the image with the cursor and moving it to a desired location or entering a coordinate. The user coordinates ( 118 ,  120 ,  122 ) can be stored on the local computer and also on the server. 
         [0137]      FIGS. 6A-B  illustrates a method of comparing the site page ( 22 ) to the updated site page ( 154 ), where the defined region represented by the first cropped image ( 106 ) is compared to the later in time defined region represented by the updated cropped image ( 112 ) to detect changes in content. Further, the graphic ( 70 ) can be compared to the updated graphic ( 72 ) to determine if the image within the defined region has changed.