WO2015121805A1 - Système de comparaison et de fusion de versions dans des sites web et applications interactives modifiés - Google Patents

Système de comparaison et de fusion de versions dans des sites web et applications interactives modifiés Download PDF

Info

Publication number
WO2015121805A1
WO2015121805A1 PCT/IB2015/051025 IB2015051025W WO2015121805A1 WO 2015121805 A1 WO2015121805 A1 WO 2015121805A1 IB 2015051025 W IB2015051025 W IB 2015051025W WO 2015121805 A1 WO2015121805 A1 WO 2015121805A1
Authority
WO
WIPO (PCT)
Prior art keywords
components
component
version
semantic
nodes
Prior art date
Application number
PCT/IB2015/051025
Other languages
English (en)
Inventor
Yuval GOLDSTEIN
Amit Kaufman
Oren HOLLANDER
Roni Ben-Aharon
Original Assignee
Wix.Com Ltd.
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Wix.Com Ltd. filed Critical Wix.Com Ltd.
Priority to AU2015216600A priority Critical patent/AU2015216600B2/en
Priority to BR112016018388-6A priority patent/BR112016018388B1/pt
Priority to CA2938812A priority patent/CA2938812A1/fr
Priority to EP15748646.5A priority patent/EP3105692A4/fr
Priority to IL262068A priority patent/IL262068B/en
Priority to MX2016010422A priority patent/MX2016010422A/es
Publication of WO2015121805A1 publication Critical patent/WO2015121805A1/fr
Priority to IL247189A priority patent/IL247189B/en
Priority to AU2019226189A priority patent/AU2019226189B2/en

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents

Definitions

  • Web sites and interactive applications have different display form factors and characteristics depending on where they are viewed such as on the desktop PC, the small-scale mobile device and the mid- size mobile tablet.
  • a device implementable in a website design program includes a component based version comparer to compare at least two versions of a website, the at least two versions having components in a set of hierarchies, where the components are at least one of a visual component, a container and a non-visual site element, and to generate a difference tree representing the differences in the components between the at least two versions of the same website and where the version comparer preprocesses the components in each single version of the at least two versions of the website to determine at least one of internal geometric, semantic, content and attribute relationships before comparing the components and the relationships between the at least two versions of the website using at least one of semantic, geometrical, content and attribute analysis.
  • the device also includes a version merger to create an integrated version of the two versions of the website based on the difference tree.
  • the device also includes version resolver to resolve conflicts in the generation of the difference tree.
  • the device is implementable on at least one of a server and a client.
  • the at least two versions of the same website include at least one version from an external version control system.
  • the website components are stored in at least one of a database, an object store; markup language files and data interchange format files.
  • the hierarchies and the difference tree are trees and where the trees include nodes representing the components, the components having attributes.
  • the version comparer includes a structural version comparer to compare the nodes through comparison of their geometrical, content and semantic relationships; an order based version comparer to compare the nodes based on the order of the nodes and to pre-match the nodes according to an internal website design system identifier; a semantic matching comparer to perform semantic classification on the nodes and match them according to their semantic classes and geometrical parameters; a comparison selector and coordinator to provide selection and coordination between the structural version comparer, the order based version comparer and the semantic matching comparer based on at least one of the structure and attributes of the components and a difference tree generator to generate the difference tree based on results of at least one of the structural version comparer, the order based version comparer and the semantic matching comparer.
  • the difference tree includes at least one of a group node and a comparison node.
  • the version resolver includes a difference tree browser to display the difference tree hierarchy for manual version resolving; a merged page displayer to present a display of at least one current state of a merged page; a component attribute browser to display the values of a component attribute, including displaying the two values for components for which there is a comparison node; a resolver selector and coordinator to select and coordinate between the difference tree browser, the merged page displayer and the component attribute browser and a merged component tree generator to provide combined results from at least one of the difference tree browser, the merged page displayer and the component attribute browser and to generate a new resolved difference tree.
  • the structural version comparer includes an ID-based matcher to match all the components in the trees that have the same ID; a geometrical relationship analyzer to perform geometrical matching to find pairs among non-ID-matched components in the trees; a component/attribute analyzer to check for changes in the component attributes; a component semantic analyzer to find pairs among non-ID-matched the components; and a split merge analyzer to detect splitting and merging of the components and containers and to further detect ID retaining split transformations.
  • the order based version comparer includes a preprocessor to analyze the components in each tree to extract relevant component sets and to analyze and modify the components for comparison where necessary; an orderer to determine an order for the elements within each the node; and a sequence matcher to perform sequence matching on the components.
  • the semantic matching comparer includes a semantic classifier to classify the components into a semantic classification; and a class/attribute matcher to create a match between elements from two matched components based on the semantic classification.
  • the geometrical relationship is at least one of overlap, intersection, proximity, relative position and relative size.
  • the merged page displayer includes an animator to animate the display of conflicting components by switching between the at least one states.
  • the animator is at least one of automatic and controlled by user.
  • the animator is integrated with dynamic layout processing.
  • the coordination is based on a combined metric of results returned from the structural version comparer, the order based version comparer and the semantic matching comparer.
  • the metric is a weighted average.
  • the difference tree browser includes a hierarchical system menu generator to generate a display of conflicting components.
  • display of at least one current state of the merged page is based on a weighted average of the states.
  • a method includes comparing at least two versions of a website, the at least two versions having components in a set of hierarchies, where the components are at least one of a visual component, a container and a non-visual site element; generating a difference tree representing the differences in the components between the at least two versions of the same website; preprocessing the components in each single version of the at least two versions of the website to determine at least one of internal geometric, semantic, content and attribute relationships; comparing the components and the relationships between the at least two versions of the website using at least one of semantic, geometrical, content and attribute analysis; and creating an integrated version of the two versions of the website based on the difference tree.
  • the method is implementable on at least one of a server and a client.
  • the at least two versions of the same website include at least one version from an external version control system.
  • the website components are stored in at least one of a database, an object store; markup language files and data interchange format files.
  • the hierarchies and the difference tree are trees and where the trees include nodes representing the components, the components having attributes.
  • the difference tree includes at least one of a group node and a comparison node.
  • the resolving includes displaying the difference tree hierarchy for manual version resolving; presenting a display of at least one current state of a merged page; displaying the values of a component attribute, including displaying the two values for components for which there is a comparison node; selecting and coordinating between the displaying the difference tree hierarchy, the presenting and the displaying the values of a component attribute; providing the combined results from the displaying the difference tree browser, the presenting and the displaying the values of a component attribute; and generating a new resolved difference tree.
  • the animating is at least one of automatic and controlled by user.
  • the coordinating is based on a combined metric of results returned from the structural version comparer, the order based version comparer and the semantic matching comparer.
  • metric is a weighted average.
  • the displaying the difference tree hierarchy for manual version resolving includes generating a display of conflicting components.
  • FIG. 2 is a schematic illustration of the elements of an initial layout converter, constructed and operative in accordance with the present invention
  • FIG. 3 is a schematic illustration of dynamic layout anchor breaking when components are moved
  • Fig. 4 is a schematic illustration of why vertical lines are irrelevant in a mobile display
  • FIG. 5 is a schematic illustration of the elements of a super-node creator, constructed and operative in accordance with the present invention
  • Fig. 6 is an illustration of a required text re-flow due to font size and field size change
  • Fig. 7 is a picture which does not looks correct when resized without preserving the aspect ratio
  • FIGs. 8A, 8B and 8C are schematic illustrations of the mapping between visual application and their corresponding super-node structure, as performed in accordance with the present invention.
  • FIG. 9 is a schematic illustration of components within containers before rearrangement
  • FIG. 10 is a schematic illustration of the components of Fig. 9 after re-arrangement;
  • Fig. 11 is a schematic illustration of the elements of an orderer, constructed and operative in accordance with the present invention.
  • Fig. 13 is a schematic illustration of an arrangement which includes two text paragraphs and two pictures which has multiple possible reading orders;
  • FIGs. 14A, 14B and 14C are schematic illustrations of the conversion of the set of elements within a super-node into an element graph and then an element order, performed in accordance with the present invention
  • Figs. 16A, 16B, 16C, 16D, 16E, 16F, 16G and 16H are schematic illustrations of the process of the primary direction with split and merge orderer of Figs. 15A, 15B and 15C, constructed and operative in accordance with the present invention
  • Fig. 18 is a schematic illustration of horizontal and vertical divisions of super-nodes, constructed and operative in accordance with the present invention.
  • Fig. 20 is a schematic illustration of how a vertical division of super-nodes is preferred as the components are better aligned on horizontal lines, constructed and operative in accordance with the present invention
  • Fig. 21 is a schematic illustration of an interlocking element configuration
  • Fig. 22 is a schematic illustration of component pairs having switched locations
  • FIG. 23 is a schematic illustration of how four picture components can be divided into pairs in two ways
  • Fig. 24 is a schematic illustration of a non-rectangular display shape remaining after carving out automatically added components
  • Fig. 25 is a schematic illustration of the elements of a reconverter, constructed and operative in accordance with the present invention.
  • Fig. 26 is a schematic illustration of elements of a component adder, constructed and operative in accordance with the present invention.
  • Fig. 27 is a schematic illustration of the functionality of the reconverter of Fig. 25, constructed and operative in accordance with the present invention
  • FIGs. 28A, 28B, 28C. 28D, 28E, 28F and 28G are schematic illustrations of the placement of components when converting or re-converting a webpage from a desktop layout configuration to a mobile layout configuration, constructed and operative in accordance with the present invention
  • Fig. 29 is a schematic illustration of methods of inserting components into the mobile version of a webpage
  • Fig. 30 is a schematic illustration of the removal of components from the mobile version of a webpage
  • FIG. 31 is a schematic illustration of a system using a comparer and merger to compare and merge the components from different versions of a website, constructed and operative in accordance with the present invention
  • FIG. 32 is a schematic illustration of how different versions of a website may be created and merged over time;
  • Fig. 33 is a schematic illustration of the elements of the comparer and merger of Fig. 31, constructed and operative in accordance with the present invention;
  • Figs 34A and 34B are schematic illustrations of the elements of the version comparer and version resolver of Fig. 33, constructed and operative in accordance with the present invention
  • Fig. 35 is a schematic illustration of the use of comparison and group nodes
  • Fig. 36 is a schematic illustration of the use of comparison nodes in conjunction with multi-page containers
  • Figs 37A, 37B and 37C are schematic illustrations of the elements of the structural version comparer, order based comparer and semantic matching comparer of Fig. 34A, constructed and operative in accordance with the present invention
  • Fig. 38 is a schematic illustration of the geometric matching of components
  • Fig. 39 is a schematic illustration of an ID retaining split transformation
  • Fig. 40 is a schematic illustration of a simple semantic hierarchy
  • Fig. 41 is a schematic illustration of class/attribute-based component matching integrating semantic linking information
  • Fig. 42 is a schematic illustration of an alternative embodiment of the system of Fig. 31, constructed and operative in accordance with the present invention.
  • Fig. 43 is a schematic illustration of an element of the difference tree browser of Fig. 34B.
  • Applicants have realized that existing sites and applications are typically designed for the desktop PC, with high-resolution large-scale display being very common. When accessing such sites and applications using smaller scale display numerous problems are manifested, including (for example): excessive required scrolling (in particular horizontal scrolling); difficult navigation; non-mobile adapted font sizes; designs and display components which are not adapted to mobile touch screens etc.
  • the pertinent visual design system may retain single copies of the inherited components, but may allow a per-page layout to be applied to them (as the adaptation to mobile in each page may be different).
  • Template handler 206 may use this information about the original template of a given component set to create a component group based on the template - ensuring better conformance to the original intent of the template.
  • preprocessor 201 may review the elements taking into account parameters such as the dimensions of the target screen.
  • Component filterer 221 may remove or hide components that are not suitable for mobile display. Such components may include, for example, vertical separator lines (but not horizontal lines), Adobe Flash content (which can't be played on some mobile systems) or ornamental frames.
  • component filterer 221 may elect to hide them rather then remove them completely. In this case, the website designer may be able to re-insert them into the mobile layout configuration as they would be visible and re-insert-able through the mobile modifications display GUI as described in further detail herein below. It will be appreciated that some components might be unsuitable or not recommended for a mobile platform, but still provide substantial information to initial layout converter 200.
  • Component adapter 225 may employ width-reduction means, similar to these which may be employed by placer 270 as detailed herein below (whenever such means can be activated at this pre-processing stage). For example, component adapter 225 may switch components to "lighter" mobile versions. For example, switch galleries which may display multiple mini-pages (e.g. accordion type) to galleries which display a single contained mini- page at a time. Component adapter 225 may also provide a specific "lightweight" version of given components for use in mobile versions of the created applications (through a separate version or a different view customized for mobile display).
  • Component adapter 225 may also handle content-related adaptations such as converting character-based graphics to vector-based scalable graphics.
  • Component adapter 225 may also unite menu components into a unified mobile- friendly (small format) menu. Pages often contain multiple navigation menus used for both inter-page and intra-page navigation. Furthermore, some pages may contain multiple menus defined in different ways such as menus defined in the page itself, menus resulting from page templates used in the page (e.g. application-global header and footer containing menus) and menus defined automatically based on the application structure (e.g. a top-level page navigation menu). Component adapter 225 may further create composite menus (one or more) and merge menus into them depending on criteria such as proximity of evaluated menu to the given created composite menu (e.g. unite all menus starting at the top 200 pixels of the page into a single top- level menu).
  • Component adapter 225 may insert the single (unified and mobile-friendly) or the multiple modified menus at directly, or may "post" them for inclusion at later stage (e.g. by placer 270 or by automatically added components inserter 281). This is especially relevant if the (one or more) menus are added in such a way as not to be a part of the regular component layout but rather as "floating", conditionally activated etc.
  • Component adjuster 227 may modify component parameters to decrease their width. An example of this is the modification of matrix gallery components to 1-2 columns only. Component adjuster 227 may also modify components defined with large ornamental borders into a simpler, less ornamental version of the same component.
  • Component adjuster 227 may resize components to reflect the actual size used. For example it may shrink text components according to actual text content using enclosing rectangles.
  • Component adjuster 227 may also "dissolve" containers which tightly wrap an internal component. For example, if a container tightly wraps a sub-container with no additional components in the larger container, it may remove the internal container, merging the two containers into one. It will be appreciated that in this manner a hierarchy level is saved as the container is transparent to the process.
  • Component adjuster 227 may employ "image stitching " and use the attributes and content of the multiple such image components to detect if they should be stitched into a single image. The decision may be based on editing history - if the images were created and/or modified together, based on similarity of dimension in the adjacent image edges, based on the length of overlap of adjacent image edges compared to the separation between the images or based on use of similar colors/features on the boundary (detected through the use of an image content analyzer).
  • Component adjuster 227 may employ font size mapping.
  • the text in any given application or page may use a large variety of font sizes. These sizes should be mapped to a given (smaller) range for use on a mobile device - while keeping font size differences if possible. Some font sizes would be too small while some would be too large.
  • the mapping is not linear, i.e. not multiplication by a fixed factor. However, it is a monotone function of font size.
  • Component adjuster 227 may collect the range of font sizes used and map this range to the range of allowed mobile font sizes.
  • Component adjuster 227 may provide such mapping which is system wide, or specific at the user, application, page or component level.
  • overlap group locator 232 may consider the component pair as overlapping. Once it has finished looping, overlap group locator 232 may merge the overlapping pairs into overlapping groups according to common members. For example component pairs [a,b] and [b,c] may be merged into [a,b,c]. It will be appreciated that the area for each created virtual component may be that of the minimal enclosing rectangle for all grouped components. It will be further appreciated that overlap groups may typically represent detailed design elements and therefore should be only resized and not rearranged. In particular, the text component in such a group should be according to its original size instead of using the font size mapping as described herein above as performed by component adapter 225. Thus the text should be scaled in such a way as to avoid font size mapping completely or use a scaling factor which reverses the effect of font size mapping.
  • some components may be omitted from an overlap group definition. These may include specific components, such as (for example) horizontal lines and screen-width containers and text size bigger than a given limit (e.g. 25 characters) which is interpreted as the text being a regular paragraph (which should not be marked as overlap group and resized as a composition) rather than as a logo text.
  • a given limit e.g. 25 characters
  • Predefined group locator 2366 may group components according to hints at the template, application, page or components level. This may be regarded as a permanent version of grouping often performed using the GUI of the specific design system so that multiple components may be manipulated together.
  • the resulting node structure may be a page super-node (PSN3) having 2 page super-nodes (PSN1 and PSN2) each having elements as illustrated in Fig. 8C.
  • node creator 238 may classify components that substantially overlap a given container (e.g. over 75% area overlap) as members of the specific container for the purpose of super-node generation, so to make the super-node hierarchy better reflect the visual arrangement. This is relevant to visual design systems in which components that are not logically contained in a given container may still overlap the container.
  • orderer 240 may create an order for the set of components and contained page super-nodes and virtual super-nodes within each super-node (separately). It will be further appreciated that this basic order may be further modified as a result of the findings of a partial order set locator as described in more detail herein below.
  • Orderer 240 may comprise a basic orderer 247, a Partial Order Set (POS) locator 250 and an order integrator 245.
  • Basic orderer 247 may further comprise a primary direction orderer 241, a primary direction with split and merge orderer 242, and an H/V sheer 243
  • H/V sheer 243 may further comprise an element divider 244 as described in more detail herein below.
  • POS locator 250 may comprise a cluster POS locator 251, a semantic relationship POS locator 252, a pattern POS locator 253, a predefined POS locator 254 and an ESI (Editing Session Information) based POS locator 255. It will be appreciated that POS locator 250 may analyze the semantics, content and geometry of the components.
  • orderer 240 may attempt to emulate the order in which a human reader may view the elements on a page (or within the specific super-node). It will be further appreciated that since a page is a 2-dimensional entity (or even 3-dimensional with z- order included), this order may not be so well defined even for a human reader.
  • Fig. 12 shows an arrangement of four text paragraphs in a square arrangement. Assuming that the paragraphs are in English (which reads from top to bottom and left to right) it is not clear if the reading order should be Al, A2, Bl, B2 or Al, Bl, A2, B2. Both orders may be considered correct. Furthermore if the elements are text and pictures as is illustrated in Fig. 13 to which reference is now made, it is not clear what the related text and picture elements are. [00151] Primary direction orderer 241 may pre-define a primary direction (i.e. sorting rows first or columns first) and may then try to sort the components in the 2 dimensional page based on the primary direction and then the secondary direction.
  • a primary direction i.e. sorting rows first or columns first
  • primary direction orderer 241 working in rows-first mode may sort the elements in a super-node so that the element A precedes the element B if either A and B have a suitable Y overlap (for example at least 25% of the smaller height of the two) and element A is to the left (i.e. order within the row) or if A and B do not have sufficient Y-overlap and A is higher (i.e. order among rows).
  • a suitable Y overlap for example at least 25% of the smaller height of the two
  • element A is to the left (i.e. order within the row) or if A and B do not have sufficient Y-overlap and A is higher (i.e. order among rows).
  • Primary direction with split and merge orderer 242 may also pre-define a primary direction and may also try to track any row/column splitting and merging. This may be considered more common for columns as opposed to rows.
  • PDSM orderer 242 may essentially convert a set of rectangles (as shown in Fig. 14 A) to a graph of columns (which may merge, split or continue as shown in Fig. 14B) which is then used to generate a ordering of the components (as shown in Fig. 14C). The rectangles may possibly intersect.
  • PDSM orderer 242 may then create two new sets - a set X of the generated columns (in their current state) (steps 420 and 430) and their elements and a set Y of elements to be processed into columns (steps 440 and 450). PDSM orderer 242 may then scan the elements of set Y from top to bottom according to their y-order (step 470) and for each element Q in set Y select a subset R of the elements (in all columns in X) that control Q. Reference is now made to Fig. 16B which illustrates how elements A, E and F all control Q. PDSM orderer 242 may then remove any duplicates from set R. As can be seen in Fig.
  • PDSM orderer 242 may connect element Q to the columns containing each of the elements Cl ...Cn, creating a column continuation (if connected at end of column) or column split (if connected in mid-column) for each.
  • PDSM orderer 242 may merge the columns as is illustrated in Fig. 16D to which reference is now made. As is shown in Fig. 16D, PDSM orderer 242 may merge columns G and H into a single column continued by element Q. Reference is now made to Fig. 16E which shows a column G which continues from an element which is not the last element in column G. In this scenario element Q creates a split in column G creating 2 columns continued by F and Q.
  • PDSM orderer 242 may have a combined split and merge situation such as is illustrated in Fig. 16F to which reference is now made. As is illustrated, element Q may create a split for the 2 columns containing elements G and H. PDSM orderer 242 may immediately merge the splits into a single column continued by element Q.
  • PDSM orderer 242 may arrange them according to the X order as is illustrated in Fig. 16H to which reference is now made. If the element pairs a-c and b-d are close enough to be connected, they may form complete columns and the order between them may be a-c-b-d and not a-b-c-d. Since they are not close enough, they are not connected causing elements c and d to be orphan columns and the order to the specified number order is modified as described herein above.
  • PDSM orderer 242 may be appropriately modified for super-nodes which have content arranged from right-to-left (rather than left- to-right).
  • H/V slicer 243 may use alternate horizontal and vertical slicing of the elements in a super-node to create an internal tree of such divisions and thereby define an order of display among the elements. It will be appreciated that such an internal tree is specific to a given super- node and is not related to the general super-node level tree. It will be appreciated that H/V slicer 243 is best adapted to "chocolate table" style sites which are built from horizontal and vertical sections - classical in newspaper layouts such as the example page as is illustrated in Fig. 17 to which reference is now made.
  • H/V slicer 243 may take the element set of a single super-node and create an internal tree of nodes (which are different from the higher-level super-nodes, as each super-node may contain a separate such internal tree).
  • the nodes may be of the following types:
  • V-nodes (vertically- arranged nodes) - a set of sub-nodes / elements which are arranged from top to bottom.
  • H-nodes Horizontally- arranged nodes
  • sub-nodes / elements which are arranged from left to right (the right to left arrangement is described herein below).
  • Leaf nodes - nodes which represent final elements of the internal tree - components or contained super-nodes.
  • a leaf node may contain multiple components which still fit within the allocated width.
  • Each node may contain a set of element references as well as the coordinates and sizes of the underlying elements, and a complete enclosing rectangle for the nodes' elements.
  • the entire collection of nodes (of the four types above) inside a single super-node may be known as an internal tree. It will be appreciated that H/V slicer 243 may adjust the procedure for super-nodes which are specified or detected as containing right to left (R2L) material or having a R2L layout.
  • H/V slicer 243 may on an initial call, create an internal tree with a single UR-node and place references to all elements in the super-node inside it. H/V slicer 243 may handle the UR node by taking all the elements in the node. If the enclosing rectangle of the elements fits in the allowed width, H/V slicer 243 may convert the node into a leaf node. H/V slicer 243 may also call on element divider 244 which may suggest a specific division (horizontal or vertical) of the elements of the UR-node into sub-groups.
  • H/V slicer 243 may create a leaf node descendent of the node N from the containing single element sub-group. H/V slicer 243 may then apply width reduction such as resizing, text re-flowing etc. as described herein above. .
  • H/V slicer 243 may then scan the generated internal tree recursively (using depth first scanning) and emit the components (such as the leaf nodes) according to the scanning order. H/V slicer 243 may scan each H/V -node according to its natural order (e.g. top-to-bottom for V- node). It will be appreciated that at the stage, since the basic order of the elements has been generated, the created internal tree for this super-node is no longer needed.
  • element divider 244 may generate the horizontal and vertical divisions of the elements based on dividers orthogonal to the gap segments. For example as is illustrated in see Fig. 18 to which reference is now made, case A is a horizontal division (into columns) using a single divider and case B is a vertical division (into rows) using two dividers.
  • Element divider 244 may also take into account in which of the directions the components are better aligned. For example as is illustrated in Fig. 20 to which reference is now made, in scenario A the division should be vertical (i.e. the components are arranged and aligned in rows) even though there are larger gaps when doing horizontal division (i.e., into columns). This can be better observed when alignment lines are added in scenario B.
  • POS locator 250 may detect sets of components which are related in some way and should possibly remain together when the elements are re-ordered for a mobile device display.
  • the components may be a text heading and the matching text paragraph.
  • Cluster POS locator 251 may also use a mean or median calculation instead of the average calculation in order to take into account a given number of outliers which may distort the average distance value. In an alternative embodiment, cluster POS locator 251 may use any clustering algorithm known in the art. POS locator 251 may then check the extracted clusters and if dense enough (e.g. the maximal distance between cluster members is below a given certain threshold), create a cluster partial order set.
  • dense enough e.g. the maximal distance between cluster members is below a given certain threshold
  • Another combination of pairs of components may be text and a button partial order set. It will be appreciated that in this scenario, semantic relationship POS locator 252 may link a button describing a text field to the actual text field. It will be appreciated that the relationship may be determined according to position only.
  • Predefined POS locator 254 may detect partial order sets which are created based on specific hints which may be provided by the application designer or within the original application template. Such hints may take a number of forms. Specific composite components which include predefined partial order system hints, such as a "picture + text caption" component may include the coupling of the two into a predefined partial order set. Another hint may be the explicitly specified association of arbitrary components in the page or a mobile- related association derived from other forms of association available in a visual design system such as grouping for editing, as many visual design systems have the ability to associate components in groups so they can be moved, resized or otherwise modified together.
  • predefined partial order system hints such as a "picture + text caption" component may include the coupling of the two into a predefined partial order set.
  • Another hint may be the explicitly specified association of arbitrary components in the page or a mobile- related association derived from other forms of association available in a visual design system such as grouping for editing, as many visual design systems have the ability to associate components
  • basic orderer 247 may not to create a complete order between all components, but rather may divide the page/super-node into page sections which fit into the allowed width. This may be relevant when there is a need to maintain the basic structure, e.g. when converting an application to a device (e.g. table, large display) having a width similar to or larger than the desktop display. In this scenario, a complete decomposition into components arranged on a line might destroy the basic underlying component arrangement, and minimal "slicing" might be visually superior. In order to do this, the elements of basic orderer 247 may be modified so to work on page sections (which still fit into the available width) rather than separate components.
  • super-node creator 230, basic orderer 247 and POS locator 250 may further create results which contradict each other.
  • one of the sub elements of POS locator 250 may generate a specific partial order set definition involving some elements, and another element may generate a different and contradicting partial order set definition.
  • Order integrator 245 may merge results from the different elements and may also resolve any conflicts in order to create a single output.
  • super-node creator 230, basic orderer 247 and POS locator 250 may all use a quality score.
  • a design based on explicit designer requests may typically have the maximal quality score, as it can be assumed that the designer is fully aware of the composition of his design.
  • super-node creator 230, basic orderer 247 and POS locator 250 may all check their scores against quality scores held by scorer 500 which may provide for each generated result a certainty score of how much the element is certain sure about the correctness of the specific result based on the analyzed parameters.
  • a page super-node that is contained in the main page super-node and that takes the maximal available width, would have the available width of 300 - (2* 10) 280 ⁇ etc.
  • Placer 270 may then create line breaks according to explicit hints (e.g. "put this group/POS on a separate line") created by super-node creator 230 and orderer 240. When an added component exceeds the available width (taking reserved spaces into account), placer 270 may try to keep component groups together, i.e. if needed create a line break before a group so that entire group would fit on the same component line. Placer 270 may avoid adding a line break so to break between components having a semantic relationship (as detected earlier, e.g. by the POS locator 250).
  • explicit hints e.g. "put this group/POS on a separate line”
  • placer 270 may try to keep component groups together, i.e. if needed create a line break before a group so that entire group would fit on the same component line.
  • Placer 270 may avoid adding a line break so to break between components having a semantic relationship (as detected earlier, e.g. by the POS locator 250).
  • Placer 270 may also apply width-reduction means to each element according to its type.
  • Width reduction means may include modifying components which may be adapted (e.g. text components) according to the component type - including re-scaling, font size change, text re-flow etc. Width reduction may also use the prescribed handling method for each virtual super-node according to its type.
  • These width-reduction means may also include transformations similar to those performed by component adjuster 227 (as a pre-processing stage) - which may now be performed with the added information about the final position and size of the components in the mobile layout configuration.
  • Placer 270 may also perform width enlargement, e.g. to enlarge a component that was placed alone in a component line
  • Placer 270 provides specific resizing means for specific element types. For example, placer 270 may resize super-nodes representing text over image groups (as located by the text over image group locator 234) by using the background image as a virtual container. Next the text is resized in order to reach the desired height and width. This includes font size mapping and text re-flow which might change the text component aspect ratio (e.g. making a longer text component with larger characters inside) as is illustrated in Fig. 6 to which reference is now made. As is shown, when moving from scenario 1 to scenario 2, the font size is increased while the field width has been reduced - requiring a text re-flow. Text over image group locator 234 may also resize the group when the background image is resized to the next text size - typically changing the aspect ratio.
  • text component aspect ratio e.g. making a longer text component with larger characters inside
  • Placer 270 may also resize/repeat the decoration image as needed to fit the new page size. If the page exceeds a given length parameter, placer 270 may possibly create a page- internal navigation menu and add it as a separate menu to the page, or to any of the existing unified menus as appropriate.
  • Placer 70 may also apply width reduction/enlargement processes to components as well as recursively to super-nodes and their descendants.
  • the processes may include resizing of the actual component, text font-size mapping, text re-flow and text reduction by splitting it into visible part and "show more" extension (which is only displayed when requested).
  • Other processes may include switching components to "lighter” mobile versions, modifying component parameters to change their width. Processing may also include resizing components to reflect the actual size used.
  • Automatically added components inserter 281 may insert automatically added components into the new mobile layout configuration such as system menus or other mobile related widgets which may be added to all or some converted applications (in all or some of their pages). Such inserted automatically added components may also include (for example) advertisements and/or other promotional material. Such inserted automatically added components may be required (i.e. always insert them) or optional. In the latter case they may be inserted conditionally - based on parameters or combination of parameters such as (for example) user type or profile (e.g. insert a specific automatically added components for all users in Europe) or per mobile device type or profile (e.g.
  • automatically added components inserter 281 may place such automatically added components in a number of ways. It may place them as absolute- position automatically added components which are inserted in a given position in the page or in specific containers (i.e. super-nodes) - typically using a reserved space as described herein below. Automatically added components inserter 281 may also insert them as relative-position automatically added components inserted in a given position relative to some page elements (e.g. pre-defined components, components located via query etc.) This is similar to the insertion of components at the mobile layout configuration level as described in more detail herein below.
  • Automatically added components inserter 281 may also add automatically added components as remaining-space automatically added components which are inserted based on space availability in the layout. Since components are sometimes moved to a separate component line, in some cases there are additional vacated spaces in the mobile layout configuration compared to the desktop layout configuration which may be used for such automatically added components.
  • automatically added components inserter 281 may be required to reserve specific space on the mobile display area for these elements - carving out the area from the rectangular mobile display area allocated to the page / super-container and reserving it.
  • the area used for component lines may be non-rectangular.
  • Fig. 24 illustrates how the area remaining in the main container C after carving-out the reserved area for automatically added components A and B is a non-rectangular shape.
  • the pertinent visual design system may also support dynamic layout including the use of explicit (designer- specified) anchors as well as implicit (automatically created) ones as described in US Patent Publication 2013-0219263 entitled “A SERVER BASED WEB SITE DESIGN SYSTEM INTEGRATING DYNAMIC LAYOUT AND DYNAMIC CONTENT", published 22 August 2013 and assigned to the common assignee of the present invention.
  • the visual design system may have anchors (both implicit and explicit) which may be broken due to the re-arrangement process inherent to the adaptation to mobile device width.
  • dynamic layout handler 284 may modify any existing dynamic layout anchors according to the new layout. For example, dynamic layout handler 284 may remove the anchors for components which have been moved in such a way as to make the anchor irrelevant as is illustrated in Fig. 3 to which reference is now made. As is illustrated, the horizontal anchor which exists between components A and B in scenario 1 should be broken when B is moved to be below A in scenario 2.
  • Dynamic layout handler 284 may also retain the anchors which may be retained (e.g. component sets which were not modified, inside containers which were not modified etc.) Dynamic layout handler 284 may also modify the anchors which may be retained but would need their parameters modified (e.g. anchor length change for components which were moved closer together). Dynamic layout handler 284 may also create new dynamic layout anchors between components placed in proximity (e.g. one above the other) - including both component-to-component and component-to-container anchors. This may be based on the automatic anchor creation criteria built into the system (e.g. based on amount of overlap and distance between components).
  • initial layout converter 200 may apply modifications (such as addition and deletion of pages and components as well as component content change) made to the desktop layout configuration to the mobile layout configuration.
  • Reconverter 300 may merge any desktop layout configuration modifications and any separate mobile layout configuration modifications into the modified mobile layout configuration in order to create a final mobile layout configuration to be displayed to mobile users, keeping the content of the mobile layout configuration better coordinated with the desktop layout configuration.
  • reconverter 300 has to determine the appropriate position to place the added component within the modified layout configuration as well as the layout to be used for the added components themselves.
  • any mobile layout configuration modifications are not merged back into the desktop layout configuration. While editing the desktop site might change the mobile site, editing the mobile site will not affect the desktop site. It will also be appreciated that pure layout changes (i.e. changes in position and size) made to either the desktop layout configuration or to the mobile layout configuration may not affect the other layout configuration - as opposed for example to component content changes or removal (which affect the mobile layout configuration if performed in the desktop layout configuration). It will, be further appreciated that system 100 may limit mobile editing so that components may be removed (or hidden) from the mobile layout configuration but cannot be added or have their content edited - except possibly for some mobile oriented components as discussed in further detail herein below. Thus (for example), a mobile editor may not allow a component in the mobile layout configuration to be moved from one page to another, since this may entail adding components to a page.
  • Reconverter 300 may comprise a page deleter 310, a page adder 320, a component deleter 330, a component adder 340, a component modifier 350 and a mobile handler 360.
  • Component adder 340 may further comprise an added component identifier 342, a parent / predecessor searcher 344 and a mobile layout adder 346 as is illustrated in Fig. 26 to which reference is now made. The functionality of these elements is described in more detail herein below.
  • Initial layout converter 200 may convert DPI (desktop page 1) creating the resulting mobile layout configuration MP2.
  • a designer may then edit MP1 using the local mobile editor to create MP2.
  • the designer may edits DPI using the local desktop editor to create DP2.
  • Reconverter 300 may then create an updated mobile layout configuration integrating the changes made in DP2 as well as in MP2.
  • recon verier 300 may limit the scope of modifications the designer may perform on the mobile layout configuration. For example, the designer may be limited to modifications which may only affect mobile layout configuration layout but not the actual content. Such a limitation may be enforced by the systems mobile editor before the various modifications are handled by reconverter 300.
  • Desktop layout modifications may include adding pages, removing pages; adding components, removing components; changing attributes of components, moving and resizing components and changing the content of component (e.g. the text inside a text paragraph).
  • pure layout changes e.g. moving and resizing
  • a visual design system may have internal unique ID for each component which does not change when a component is modified or moved. It will be appreciated that reconverter 300 may use these ID's to track components which have been modified from one version of a page to another. Since reconverter 300 assumes that all modifications are performed through the visual design system editor and are fully tracked, when evaluating a modified version, reconverter 300 may have (for each modified component) a detailed list of the modified attributes and the value changes (e.g. for component X the style was changed from SI to S2 and the width from Wl to W2).
  • page deleter 310 may also remove the page from the mobile layout configuration. It will be appreciated that this implies that specific mobile layout configuration modifications made to this page are lost. The only way to restore them is through "undo" functionality (e.g. session level undo during the current session or version revert at the database level).
  • reconverter 300 may instruct initial layout converter 200 to reconvert the desktop page as there is no need for the merging of the desktop layout configuration and the mobile layout configuration modifications.
  • FIG. 28A shows a desktop page DPI containing two components, A and B.
  • Initial layout converter 200 may convert this page into a mobile page MP1. If a new component X is then added between A and B in DPI so to create page DP2, parent/ predecessor searcher 344 performs a parent / predecessor search for X, finding that X follows A inside the containing page (in the desktop layout configuration). Thus, mobile layout adder inserts X after A in the containing page in MP1 so as to create MP2.
  • mobile page MP1 is edited via the mobile editor to exchange the vertical positions of A and B, creating MP2.
  • the designer then inserts the new component X between A and B in the DPI to create page DP2.
  • Component adder 340 may reconcile the changes made to DP2 and MP2.
  • Parent/predecessor searcher 344 may perform a parent/predecessor search for component X, finding that X follows A (its nearest predecessor) inside the containing page (its nearest parent in the desktop layout configuration).
  • mobile layout adder 346 may insert X into MP2 in the containing page following component A (which is now below B rather than above B), creating the updated mobile page MP3.
  • mobile page MP1 is edited via the mobile editor to remove (hide) component B which resides below A and above C (creating MP2).
  • DPI is then edited via the desktop editor to insert component X after B and before C (creating DP2).
  • Component adder 340 may then reconcile the changes made to DP2 and MP2.
  • Parent/ predecessor searcher 344 may perform the parent / predecessor search for the added component X and may determine that the predecessor of X is A instead of B, since B is marked as "removed in mobile".
  • mobile layout adder inserts X after A (and before C) in MP2 to create MP3.
  • page DPI contains a container A which contains an internal container B and another component D - all of which are converted into MP1.
  • Mobile page MP1 is then edited via the mobile editor to remove (hide) the internal container B (creating MP2).
  • DPI is then edited via the desktop to insert component C inside the internal container B (creating DP2).
  • Component adder 340 may then reconcile the changes made to DP2 and MP2.
  • parent/ predecessor searcher 344 may determine that the parent of is A instead of B, since B is marked as "removed in mobile”.
  • Parent/ predecessor searcher 344 may further determine that C has no predecessor, since it is the first component in A (disregarding B).
  • mobile layout adder 346 may insert C inside A (at the top and before D) in MP2 to create MP3.
  • Fig. 28E mobile page MP1 is edited via the mobile editor to exchange the vertical positions of A and B, creating MP2. Later, a designer inserts two new highly-overlapping components XI and X2 between components A and B in DPI to create page DP2.
  • Component adder 340 may reconcile the changes made to DP2 and MP2 in one of two possible ways, generating either MP3 (for the one-by-one method) or MP4 (for the clustered method).
  • parent/ predecessor searcher 344 may perform the parent/ predecessor search for XI first, determining that A is the predecessor of XI.
  • Parent/ predecessor searcher 344 may then perform the parent / predecessor search for X2 (taking XI into account), and may determine that XI is the predecessor of X2.
  • mobile layout adder 346 may then place component XI after A and place component X2 after XI thus creating MP3. It will be appreciated that in this method, components XI and X2 are analyzed and moved as separate entities and therefore their compositions are separated.
  • parent/ predecessor searcher 344 may perform the parent / predecessor search for both XI and X2 without regarding XI or X2 (for the search), and may determine that both have the same parent (the main page) and the same predecessor (component A).
  • component adder 340 may cluster XI and X2 together, may create a virtual super-node containing XI and X2, and may instruct initial layout converter 200 to create a mobile ready version of the composition of XI and X2. It will be appreciated that this converted composition would be placed below A creating MP4. Since XI and X2 were highly overlapping, it is likely they would be resized as to preserve their composition (as described above).
  • an original desktop page DPI containing two components is edited via the desktop editor by adding 4 new components - two pairs of semantically-related text and image components (Tl/Il and T2/I2) - creating a new page DP2.
  • parent/ predecessor searcher 344 may determine that Tl is the predecessor of T2.
  • the generated (vertical) sequence of components would be A-T1-T2-I1-I2-B (as shown in MP2) - breaking the text caption to image connections.
  • parent/ predecessor searcher 344 may determine that T1/T2/I1/I2 all have the same predecessor (A) and parent (main page).
  • mobile layout adder 346 may cluster these 4 components into a new virtual page and may run initial layout converter 200 on them. Since Tl is semantically related to II, and T2 to 12, these pairs would be kept together. Thus, the created (vertical) sequence would be A-T1-I1-T2-I-B (as in MP3) - preserving the semantic information.
  • Desktop page DPI contains three components (A, B and C) and is converted to mobile.
  • the resulting mobile page MP1 is edited via the mobile editor, removing component C and exchanging the order of A and B to create MP2.
  • DPI is then edited via the desktop editor, adding two overlapping components XI and X2 between B and C and an additional component X3 below C to create DP2.
  • Component adder 340 is configured to use the clustered method and therefore all three added components (XI, X2 and X3) are clustered together, since the parent/ predecessor searcher 344 has determined that B is the predecessor of all 3 new components (since C was removed in the mobile version).
  • mobile layout adder 346 may place all 3 new components below B and above A, retaining the composition of XI and X2 (as shown in MP3).
  • mobile layout adder 346 may be implemented in a limited version in which components are added to the desktop version or are only added to the mobile version vertically between two vertically-separate components.
  • component adder 340 may add a "cluster" of added components anywhere inside a "line” of components laid out in the mobile version, so not to limit the insertion of the new components to be below a given component in the mobile version.
  • component adder 340 may add components to the mobile layout configuration by dividing the mobile layout configuration horizontally into segment, and adding the added component or component cluster after the segment containing the predecessor instead of directly after the predecessor.
  • component modifier 350 may modify the components in the mobile layout configuration. Since the mobile layout configuration defines a visual application subject to dynamic layout, it can accommodate such changes and re-adjust component sizes and positions accordingly.
  • component modifier 350 may update the mobile layout configuration accordingly. Similar to attribute modification, such data change may cause some re-formatting of components on the mobile layout configuration, handled using dynamic layout.
  • Mobile handler 360 may use a number of methods for placing added (mobile only) components. Mobile handler 360 may allow the insertion of a new component only between two components on a component line or on a new component line following or preceding an existing one as is illustrated in Fig. 29 to which reference is now made. A new component X may be inserted between A and B or a new component Y may be inserted below P and above A, B and C. It may also insert line breaks before / after added component.
  • the inserted component in this case may be anchored to the preceding component (or container) and may be re-inserted in that position if the mobile layout configuration is re-generated and "preserving added mobile components" was requested. If the anchor is not available (e.g. the anchored-to component was removed in desktop layout configuration), mobile handler 360 may search for the closest previous component or container as noted above for adding components to the desktop layout configuration.
  • Mobile handler 360 may also allow placing the new (mobile only) component X in an arbitrary position in the page. Mobile handler 360 may then search for an anchoring component by searching for the component with the largest intersection with X. If no such component is available, mobile handler 360 may look for the closest neighbor (on all 4 sides) based on the weighted average of distance and overlap and by using distance and overlap thresholds. If no such component is found use the container containing X, then mobile handler 360 may use the page start as an anchor which may be defined as the anchor in term of distance and offset from the closest edge of the anchor.
  • the mobile editor may also place non-mobile- recommended components initially in the "removed component" display, and require a second step to actually incorporate them into the mobile layout configuration.
  • the added components may be listed in the mobile modifications display as discussed herein below, so to make it easy to remove specific add- to-mobile-only components.
  • Mobile handler 360 may also remove a component from the mobile layout configuration (which may be implemented by actually removing the component or just hiding it). It will be appreciated that when a component is removed from the mobile layout configuration, mobile handler 360 may not rearrange the components in the same line. When an entire component line is removed, mobile handler 360 may move the components below up as close as possible as is illustrated in Fig. 30 to which reference is now made. If any of components A, B or C (but not all three) are removed, the remaining components in the line (A, B or C) are not affected or moved. If all three components (A, B and C) are removed, component Q and the components following it will move up to near component P. The removed component(s) may be listed in the mobile modifications display as discussed herein below, so to make it easy to re-insert the hidden components into the application at a later stage if required.
  • reconverter 300 may provide a separate GUI displaying the list of modifications specific to a given mobile layout configuration (e.g. components added, components removed and components modified). This may useful in order to view the specific mobile layout configuration modifications and distinguish between them and other layout modifications made by initial layout converter 200. It may also be useful in order to review different changes made to different mobile layout configurations and to be able to undo specific mobile layout configuration modifications such as to re-insert a specific "removed" component.
  • modifications specific to a given mobile layout configuration e.g. components added, components removed and components modified.
  • Reconverter 300 may further support mobile layout configuration regeneration options. When activated, reconverter 300 may instruct initial layout converter 200 to run again on the underlying desktop layout configuration (which may have been modified since initial layout converter 200 was last run), and the mobile layout configuration specific changes may be possibly re-applied.
  • a desktop layout configuration of a particular application may be suitably converted into a mobile layout configuration (or any other different sized target layouts) taking into account the relationship between components. Furthermore, after the initial conversions, modifications may be made to both the desktop and mobile layout configurations for the same page and may be reflected within a newly generated mobile page.
  • Applicants have realized that superior results can be achieved using a component- based comparison and merging system which may use any of the following: the underlying website building system component IDs; locating geometrical and semantic relationships between the components; analysis of the component attributes and content; analysis of the component editing history; and smart ordering of the components at each hierarchy level (so that linear comparison and merging algorithms known in the art can be used).
  • a website may have hierarchical arrangements of components having attributes. These hierarchical arrangements may also be known as component trees. Each node in a component tree may represent a component and may have multiple sub-nodes (e.g. for components inside a container component). Specifically, each node may have geometrical attributes (position and size) relative to the containing entity.
  • Fig. 32 illustrates a scenario of versions of a website that may be stored in database 660.
  • the published version may be the version of the website currently available to both users and designers
  • edited version 1 may be content added by a user
  • edited version 2 may be actual changes to an object schema made by a designer
  • the new published version may be the published version with edited version 1 and edited version 2 merged accordingly.
  • Comparer and merger 650 may comprise a component manager 651, a version manager 652, an editor 653, a version integrator 654 and a version merger 657.
  • Version integrator 654 may further comprise a version comparer 655 and a version resolver 656.
  • Editor 653 may further comprise an editing history database 635 to store edits made to website 605 handled by website design system 640.
  • Component manager 651 may manage the storage of created websites or other created visual applications and component storage and provide access services for editor 653 to database 660
  • version manager 652 may manage and store multiple versions of the created websites or other created visual applications
  • editor 653 may support the editing of the website by a designer
  • version integrator 654 may compare and resolve differences between different versions
  • version merger 657 may merge versions once they have been compared and resolved based on the analysis performed by version integrator 654.
  • comparer and merger 650 may be required to compare (and later merge) two component trees (e.g. the baseline version and a modified version) into a single component tree. Such merging may be automatic, user-guided or both.
  • Version comparer 655 may compare two or more versions of the created visual application generating an intermediate data structure describing their differences. Version comparer 655 may further comprise a comparison and selection coordinator 699, a structural version comparer 701, an order based version comparer 702, a semantic matching comparer 703 and a difference tree generator 704. Version resolver 656 may comprise a resolver selector and coordinator 710, a difference tree browser 711, a merged page displayer 712, a component attribute browser 713 and a merged component tree generator 714. Merged page displayer 712 may further comprise an animator 715 and difference tree browser may comprise a hierarchical menu generator 716
  • Comparison selector and coordinator 699 may analyze the incoming trees and decide which of comparers 701, 702 and 703 to use based on the structure of trees. Comparison selector and coordinator 699 may also coordinate between the use of more than one of comparers 701, 702 and 703 when required. Comparers 701, 702 and 703 may all first preprocess the nodes of each individual component tree either structurally, by their order or semantically to determine an object order and relationships between objects before comparing the two component trees structurally, by their order or semantically as described in more detail herein below.
  • comparer and merger 650 may base its functionality on the creation and later resolution of a difference tree.
  • Difference tree generator 704 may create a difference tree based on the results of comparers 701, 702 and 703. It will be further appreciated that a difference tree may be similar to a component tree but may include the result of comparing two component trees. Whereas a component tree consists of regular nodes (having sub-nodes) and leaf nodes, a difference tree may contain nodes of additional types.
  • One such node may be a comparison node which has two sub-nodes, both of which are the versions of the node found in the two compared component trees (e.g. Tl and T2).
  • One (but not both) sub-nodes may be null in a case in which a component node exists in just one of the compared component tree (Tl or T2) but not in the second component tree.
  • Another such node may be a group node.
  • FIG. 35 illustrates the use of comparison and group nodes.
  • a group node may be used, if two components (A and B) in Tl have been replaced in the application with a single component C in T2.
  • the 1st sub-node of comparison node X would be a newly created group node Y which includes A and B, and the 2 nd sub-node would be the component C (and its contained sub-components) .
  • a difference tree may only contain nodes containing differences between Tl and T2.
  • Sub-trees (sub-nodes) which are identical between Tl and T2 are omitted from the difference tree.
  • a difference tree may also aim to "push the differences as low possible", e.g. to include a comparison node at the lowest (most detailed) level in which the difference exists.
  • Each node may contain pointers or references to the version of the node in both Tl and T2.
  • An alternative embodiment may use, for example, a tree containing the unmodified nodes as well, with specific node type for these unmodified sub-branches added to the node types as described in more detail herein below.
  • Yet another alternative embodiment may include details of differences in attribute values of a given component Z (i.e. between Tl and T2) inside the specific node describing Z, and would only use comparison nodes for differences in the set of contained sub-components as further described below.
  • a difference tree represents a component (such as multi- page container) which has multiple sub-components (which may be displayed simultaneously or not). In such a case, sub-components may:
  • Comparer and merger 650 may compare Tl and T2 to create difference tree K.
  • Comparer and merger 650 may recursively scan Tl and T2 starting at the root of both trees and at each node level may match the sub-nodes of Tl and T2 as described in more detail herein below.
  • Fig. 37A illustrates the sub elements of structural version comparer 701
  • Fig. 37B illustrates the sub elements of order based version comparer 702
  • Fig. 37C which illustrates the sub elements of semantic matching comparer 703.
  • Structural version comparer 701 may comprise a ID-based matcher 721, a geometrical relationship analyzer 722, a component content/attribute analyzer 723, a component semantic analyzer 724 and a split merge analyzer 725.
  • Version comparer 655 may run recursively on each such node pair, and may determine if it should be included in a difference tree based on the existence of differences at the lower level (as indicated by the results of the recursion). If the comparison is a leaf node comparison, version comparer 655 may include a comparison node in the difference tree if there are differences in the attribute value between the compared leaf nodes (as described in more detail herein below). As discussed herein above, the elements of version comparer 655 may be coordinated by comparison selector coordinator 699 and may be run independently or may be used in parallel to complement each other.
  • Geometrical relationship analyzer 722 may match nodes which only exist in Tl with nodes which only exist in T2 based on the nodes in the pair occupying approximately the same area. This may be done based on the percentage of overlap (e.g. in terms of X / Y / area), with additional weight given to the component type and other attributes.
  • Geometrical relationship analyzer 701 may also match nodes which only exist in Tl with nodes which only exist in T2 based on position, size and intersection relative to other paired nodes. As is illustrated in Fig. 38 to which reference is now made, if component C exists in both Tl and T2, and has an adjacent component Dl in T2 and D2 in T2, then geometrical relationship analyzer 722 may match Dl and D2.
  • split merge analyzer 725 cannot perform ID matching, but rather geometrical relationship analyzer 722 and/or component semantic analyzer 724 may perform analysis to detect ID-retaining transformations as described in more detail herein below.
  • merge transformation e.g. one in which components B and C are merged into A
  • split merge transformation e.g. one in which components B and C are converted into components A and D.
  • Order based version comparer 702 may compare elements by preprocessing the elements and creating an order to compare like components.
  • Preprocessor 731 may perform any required pre-processing on the compared components sets so as to extract the relevant part of the components sets and may also analyze the suitability of the components and may make modifications to the existing components where necessary. It also may analyze any hierarchies and any specific container relationships at the start of the process in order to gather information that may be useful to the process. It will be appreciated that the functionality of preprocessor 731 may be similar to the functionality of preprocessor 201 as described herein above. After the components have been preprocessed by preprocessor 731, orderer 732 may order the components accordingly to aid the comparison process. It will be appreciated that the functionality of orderer 732 may be similar to the functionality of orderer 240 as described herein above.
  • Orderer 732 may then convert each of the strings from a "string of components" to a string of symbols (from a newly created alphabet which represents the components) using identical symbols for matched components in the multiple strings, and different unique symbols for the unmatched components. It may then apply a known linear text comparison / merging algorithm between the multiple strings (such as the recursive three-way merging algorithm described in http://en.wikipedia.org/wiki/Merge_(revision_control)). It will be appreciated that in this scenario, orderer 732 may convert the multi-dimensional component merge into a linear text merge, the process of which is well known in the industry.
  • Class/attribute matcher 742 may divide the components in each of the compared component sets into classes according to their semantic types. It will be appreciated that semantic matching comparer 703 may typically use very abstract semantic types (i.e. high on the semantic type hierarchy) as classes, so as to provide wider matching. For example, semantic classifier 741 may use four classes based on major semantic types such as text, image, galleries and "other components".
  • class/attribute matcher 742 may sort the components in each class according to their size, or possibly - in particular for text - their amount of content. The latter is done so a large text area containing small amount of text may be matched with a smaller text area which might be more suitable. Class/attribute matcher 742 may further sort components having identical (or near-identical) area according to additional attributes such as aspect ratio, position on screen etc.
  • Class/attribute matcher 742 may take into account semantic links as noted above, e.g. "components A and B should be close together” or "component A must be above component B with no inferring components”. It may also try to satisfy these requirements before matching the remaining components.
  • Version resolver 656 may take the created difference tree (containing the differences between Tl and T2) and "resolve” it, by removing all special nodes and generating a merged component tree. Version resolver 656 may also display conflicting components emphasized through the modification of their display attributes or modification of the non-conflicting components display attributes. This may done through interaction with the user, automatically or both. [00351] A discussed herein above, version resolver 656 may comprise a resolver selector and coordinator 710, difference tree browser 711, a merged page displayer 712, a component attribute browser 713 and a merged component tree generator 714.
  • Merged page displayer 712 may display a weighted average of the two configurations. Merged page displayer 712 may also possibly create a continuum of configurations between the Tl and T2 configurations. For example, for regular numerical attributes (e.g. position or size), merged page displayer 712 may use a weighted average attribute value. For some attributes (e.g. color), merged page displayer 712 may use a specific method (e.g. creating a color gradient in a given color space between the two colors). For a binary type attribute, merged page displayer 712 may switch them between the two states at a specific point.
  • regular numerical attributes e.g. position or size
  • merged page displayer 712 may use a weighted average attribute value.
  • merged page displayer 712 may use a specific method (e.g. creating a color gradient in a given color space between the two colors). For a binary type attribute, merged page displayer 712 may switch them between the two states at a specific point.
  • Animator 715 may also solve the multiple states issue by further providing a continuous animation of the page changing between the two states or by adding a toggle or slider between the two states. Animator 715 may also provide a way to select either state, or possibly to select a given attribute value which is between the two states.
  • Embodiments of the present invention may include apparatus for performing the operations herein.
  • This apparatus may be specially constructed for the desired purposes, or it may comprise a general-purpose computer selectively activated or reconfigured by a computer program stored in the computer.
  • the resultant apparatus when instructed by software may turn the general purpose computer into inventive elements as discussed herein.
  • the instructions may define the inventive device in operation with the computer platform for which it is desired.
  • Such a computer program may be stored in a computer readable storage medium, such as, but not limited to, any type of disk, including floppy disks, optical disks, magnetic-optical disks, readonly memories (ROMs), compact disc read-only memories (CD-ROMs), random access memories (RAMs), electrically programmable read-only memories (EPROMs), electrically erasable and programmable read only memories (EEPROMs), magnetic or optical cards, Flash memory ,disk-on-key or any other type of media suitable for storing electronic instructions and capable of being coupled to a computer system bus.
  • ROMs readonly memories
  • CD-ROMs compact disc read-only memories
  • RAMs random access memories
  • EPROMs electrically programmable read-only memories
  • EEPROMs electrically erasable and programmable read only memories
  • magnetic or optical cards such as, but not limited to, any type of disk, including floppy disks, optical disks, magnetic-optical disks, readonly memories (ROMs), compact disc read-only
  • Embodiments of the present invention may include apparatus for performing the operations herein.
  • This apparatus may be specially constructed for the desired purposes, or it may comprise a general-purpose computer selectively activated or reconfigured by a computer program stored in the computer.
  • the resultant apparatus when instructed by software may turn the general purpose computer into inventive elements as discussed herein.
  • the instructions may define the inventive device in operation with the computer platform for which it is desired.
  • Such a computer program may be stored in a computer readable storage medium, such as, but not limited to, any type of disk, including floppy disks, optical disks, magnetic-optical disks, readonly memories (ROMs), compact disc read-only memories (CD-ROMs), random access memories (RAMs), electrically programmable read-only memories (EPROMs), electrically erasable and programmable read only memories (EEPROMs), magnetic or optical cards, Flash memory ,disk-on-key or any other type of media suitable for storing electronic instructions and capable of being coupled to a computer system bus.
  • ROMs readonly memories
  • CD-ROMs compact disc read-only memories
  • RAMs random access memories
  • EPROMs electrically programmable read-only memories
  • EEPROMs electrically erasable and programmable read only memories
  • magnetic or optical cards such as, but not limited to, any type of disk, including floppy disks, optical disks, magnetic-optical disks, readonly memories (ROMs), compact disc read-only

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Databases & Information Systems (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Data Mining & Analysis (AREA)
  • User Interface Of Digital Computer (AREA)
  • Information Transfer Between Computers (AREA)
  • Data Exchanges In Wide-Area Networks (AREA)

Abstract

L'invention concerne un dispositif pouvant être mis en œuvre dans un programme de conception de site Web, ledit dispositif comprenant : un comparateur de versions à base de composants permettant de comparer au moins deux versions d'un site Web, les au moins deux versions comprenant des composants dans un ensemble de hiérarchies, et de générer une arborescence de différences représentant les différences de composants entre les au moins deux versions du même site Web ; le comparateur de versions prétraitant les composants dans chaque version unique des au moins deux versions du site Web afin de déterminer au moins l'une des relations géométriques, sémantiques, de contenus et d'attributs internes avant de comparer les composants et les relations entre les au moins deux versions du site Web à l'aide d'au moins l'une des relations sémantiques, géométriques, de contenus et d'attributs. Le dispositif comprend également un fusionneur de versions permettant de créer une version intégrée des deux versions du site Web d'après l'arborescence de différences.
PCT/IB2015/051025 2014-02-11 2015-02-11 Système de comparaison et de fusion de versions dans des sites web et applications interactives modifiés WO2015121805A1 (fr)

Priority Applications (8)

Application Number Priority Date Filing Date Title
AU2015216600A AU2015216600B2 (en) 2014-02-11 2015-02-11 A system for comparison and merging of versions in edited websites and interactive applications
BR112016018388-6A BR112016018388B1 (pt) 2014-02-11 2015-02-11 Dispositivo implementável em um sistema criador de website e método para um sistema criador de website
CA2938812A CA2938812A1 (fr) 2014-02-11 2015-02-11 Un systeme servant a comparer et a fusionner des versions dans les sites web modifies et les applications interactives
EP15748646.5A EP3105692A4 (fr) 2014-02-11 2015-02-11 Système de comparaison et de fusion de versions dans des sites web et applications interactives modifiés
IL262068A IL262068B (en) 2014-02-11 2015-02-11 A system for comparing and merging versions in editing websites and interactive applications
MX2016010422A MX2016010422A (es) 2014-02-11 2015-02-11 Sistema para la comparacion y la fusion de versiones en sitios web editados y aplicaciones interactivas.
IL247189A IL247189B (en) 2014-02-11 2016-08-08 A system for comparing and merging versions in editing websites and interactive applications
AU2019226189A AU2019226189B2 (en) 2014-02-11 2019-09-05 A system for comparison and merging of versions in edited websites and interactive applications

Applications Claiming Priority (4)

Application Number Priority Date Filing Date Title
US201461938166P 2014-02-11 2014-02-11
US61/938,166 2014-02-11
US201461985489P 2014-04-29 2014-04-29
US61/985,489 2014-04-29

Publications (1)

Publication Number Publication Date
WO2015121805A1 true WO2015121805A1 (fr) 2015-08-20

Family

ID=53799645

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/IB2015/051025 WO2015121805A1 (fr) 2014-02-11 2015-02-11 Système de comparaison et de fusion de versions dans des sites web et applications interactives modifiés

Country Status (6)

Country Link
EP (1) EP3105692A4 (fr)
AU (2) AU2015216600B2 (fr)
CA (1) CA2938812A1 (fr)
IL (2) IL262068B (fr)
MX (1) MX2016010422A (fr)
WO (1) WO2015121805A1 (fr)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2020124124A1 (fr) 2018-12-19 2020-06-25 Fivecast Pty Ltd Procédé et système de visualisation de différenciation de données
CN116756052A (zh) * 2023-08-18 2023-09-15 建信金融科技有限责任公司 一种数据处理方法和装置

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2002001394A1 (fr) * 2000-06-27 2002-01-03 Ge Financial Assurance Holdings, Inc. Systeme et procede permettant de faciliter et de controler le developpement d'un site web
US20020016601A1 (en) * 2000-01-03 2002-02-07 Shadduck John H. Instruments and techniques for inducing neocollagenesis in skin treatments
WO2005107409A2 (fr) * 2004-05-04 2005-11-17 Fisher-Rosemount Systems, Inc. Cadriciel d'affichage graphique pour interface de systeme de commande de processus
US20080295005A1 (en) * 2002-05-30 2008-11-27 Microsoft Corporation System and method for adaptive document layout via manifold content

Family Cites Families (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130014008A1 (en) * 2010-03-22 2013-01-10 Niranjan Damera-Venkata Adjusting an Automatic Template Layout by Providing a Constraint
US9396167B2 (en) * 2011-07-21 2016-07-19 Flipboard, Inc. Template-based page layout for hosted social magazines

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20020016601A1 (en) * 2000-01-03 2002-02-07 Shadduck John H. Instruments and techniques for inducing neocollagenesis in skin treatments
WO2002001394A1 (fr) * 2000-06-27 2002-01-03 Ge Financial Assurance Holdings, Inc. Systeme et procede permettant de faciliter et de controler le developpement d'un site web
US20080295005A1 (en) * 2002-05-30 2008-11-27 Microsoft Corporation System and method for adaptive document layout via manifold content
WO2005107409A2 (fr) * 2004-05-04 2005-11-17 Fisher-Rosemount Systems, Inc. Cadriciel d'affichage graphique pour interface de systeme de commande de processus

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
See also references of EP3105692A4 *

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2020124124A1 (fr) 2018-12-19 2020-06-25 Fivecast Pty Ltd Procédé et système de visualisation de différenciation de données
EP3899745A4 (fr) * 2018-12-19 2022-09-14 Fivecast Pty Ltd Procédé et système de visualisation de différenciation de données
CN116756052A (zh) * 2023-08-18 2023-09-15 建信金融科技有限责任公司 一种数据处理方法和装置
CN116756052B (zh) * 2023-08-18 2023-11-14 建信金融科技有限责任公司 一种数据处理方法和装置

Also Published As

Publication number Publication date
AU2019226189B2 (en) 2021-05-13
AU2015216600B2 (en) 2019-06-20
IL262068B (en) 2022-07-01
CA2938812A1 (fr) 2015-08-20
IL247189B (en) 2018-10-31
AU2019226189A1 (en) 2019-09-26
EP3105692A4 (fr) 2017-11-01
MX2016010422A (es) 2017-01-23
IL262068A (en) 2018-11-29
EP3105692A1 (fr) 2016-12-21
AU2015216600A1 (en) 2016-09-22

Similar Documents

Publication Publication Date Title
US20240095297A1 (en) System for comparison and merging of versions in edited websites and interactive applications
AU2021205057B2 (en) System and method for automated conversion of interactive sites and applications to support mobile and other display environments
US20230367841A1 (en) System and method for implementing containers which extract and apply semantic page knowledge
AU2019226189B2 (en) A system for comparison and merging of versions in edited websites and interactive applications
BR112016018388B1 (pt) Dispositivo implementável em um sistema criador de website e método para um sistema criador de website
BR112016005468B1 (pt) Conversor implementável por meio de um sistema de cliente/servidor tendo pelo menos um processador para processar instruções que definem o dito conversor; e método implementável em um dispositivo de computação

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 15748646

Country of ref document: EP

Kind code of ref document: A1

ENP Entry into the national phase

Ref document number: 2938812

Country of ref document: CA

WWE Wipo information: entry into national phase

Ref document number: 247189

Country of ref document: IL

WWE Wipo information: entry into national phase

Ref document number: MX/A/2016/010422

Country of ref document: MX

NENP Non-entry into the national phase

Ref country code: DE

REG Reference to national code

Ref country code: BR

Ref legal event code: B01A

Ref document number: 112016018388

Country of ref document: BR

REEP Request for entry into the european phase

Ref document number: 2015748646

Country of ref document: EP

WWE Wipo information: entry into national phase

Ref document number: 2015748646

Country of ref document: EP

ENP Entry into the national phase

Ref document number: 2015216600

Country of ref document: AU

Date of ref document: 20150211

Kind code of ref document: A

ENP Entry into the national phase

Ref document number: 112016018388

Country of ref document: BR

Kind code of ref document: A2

Effective date: 20160809