Enabling absolute positioning with publishable HTML code

• US 9,892,097 B2
• Filed: 04/01/2013
• Issued: 02/13/2018
• Est. Priority Date: 04/01/2013
• Status: Active Grant

• Current Assignee: Adobe Inc.
• Original Assignee: Adobe Systems Incorporated (Adobe Inc.)
• Inventors: Bank, Christopher R., Surber, Jacob Aaron, Joseph, Kristofer G.
• Primary Examiner(s): Hong, Stephen
• Assistant Examiner(s): Vaughn, Gregory
• Application Number:
  US13/854,845
• Publication Number:
  US 20140298163A1
• Time in Patent Office: 1,779 Days
• Field of Search: None
• CPC Class Codes: G06F 40/103 Formatting, i.e. changing of presentation of documents automatic justification G06F40/189; automatic line break hyphenation G06F40/191
• CPC Class Codes: G06F 40/143 Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]

Abstract

This document describes techniques and apparatuses that enable absolute positioning with publishable HTML code. These techniques permit a designer to place objects at absolute positions in a design interface and see how a webpage will actually look in response to that placement. A designer need not publish the design before seeing how it will actually look because the design interface determines and then uses publishable HTML code to present the design, even in real time. Furthermore, in some embodiments, the techniques provide real-time feedback showing parameters of the publishable HTML code, thereby permitting the designer to quickly and easily change the publishable HTML code by altering the shown parameters.

Claims

1. A method comprising:

receiving, in a design interface presenting an HTML page, a selection to move a selected HTML object from a first position relative to other HTML objects in the HTML page to a second position relative to the other HTML objects in the HTML page;

altering parameters of the selected HTML object relative to the other HTML objects to enable placement of the selected HTML object at the second position;

altering parameters of the other HTML objects affected by said altered parameters of the selected HTML object to enable maintenance of positions of the other HTML objects relative one another;

determining, using the altered parameters, publishable HTML code to enable presentation in the HTML page of the selected HTML object at the second position while maintaining the positions of the other HTML objects;

presenting, based on the publishable HTML code determined using the altered parameters;

the selected HTML object at the second position and the other HTML objects at their respective positions; and

parameters for the selected HTML object and the other HTML objects, the parameters presented among the selected HTML object and the other HTML objects within the design interface;

receiving selection to alter a selected parameter of the parameters presented within the design interface;

determining, using the selected parameter, publishable HTML code to enable presenting the selected HTML object and the other HTML objects to reflect said alteration of the selected parameter; and

presenting, based on the publishable HTML code determined using the selected parameter, the selected HTML object and the other HTML objects.

2. A method as described in claim 1, wherein said altering the parameters of the selected HTML object and the other HTML objects includes altering one or more of Cascading Style Sheet (CSS) float, margin, and clearing properties for the selected HTML object and the other HTML objects.

3. A method as described in claim 1, wherein said altering parameters of the other HTML objects includes altering margin values of the other HTML objects that neighbor the selected HTML object when at the first position.

4. A method as described in claim 1, wherein said determining the publishable HTML code determines a location for the selected HTML object in a Document Object Model (DOM) for the HTML page, the location based on the second position.

5. A method as described in claim 1, wherein said altering the parameters of the other HTML objects includes altering a negative margin of one of the other HTML objects based on a negative margin affected by said altered parameters of the selected HTML object.

6. A method as described in claim 1, wherein said receiving the selection to move the selected HTML object includes receiving a drag-and-drop selection of the selected HTML object from the first position to the second position within the HTML page.

7. A method as described in claim 1, wherein said presenting the parameters for the selected HTML object and the other HTML objects presents various Cascading Style Sheet (CSS) margins among the HTML object and the other HTML objects within the HTML page.

8. A method as described in claim 1, wherein the first position of the selected HTML object, the second position of the selected HTML object, and the positions of the other HTML objects are absolute positions on the HTML page.

9. A method as described in claim 8, wherein the absolute positions are fixed on the HTML page and wherein said altering the parameters of the other HTML objects enables.

10. A method as described in claim 1, wherein said presenting the parameters for the selected HTML object and the other HTML objects occurs responsive to said presenting the selected HTML object and the other HTML objects based on the publishable HTML code determined using the altered parameters.

11. A method as described in claim 1, wherein the parameters of the selected HTML object and the other HTML objects describe relative positioning of the selected HTML object and the other HTML objects to one another.

12. A method as described in claim 1, further comprising:

responsive to receiving the selection to move the selected HTML object, presenting parameters for the selected HTML object and the other HTML objects among the selected HTML object and the other HTML objects within the design interface;

determining intermediate publishable HTML code during said moving the selected HTML object to the second position; and

presenting, based on the intermediate publishable HTML code, parameters for the selected HTML object and the other HTML objects in the design interface during said moving the selected HTML object to the second position.

13. A method as described in claim 1, wherein said receiving the selection to move the selected HTML object comprises a selection to resize the selected HTML object from the first position to the second position.

14. One or more computer-readable storage media comprising instructions stored thereon that, responsive to execution by a computing device, cause the computing device to perform operations comprising:

receiving, in a design interface presenting an HTML page, a selection to move a selected HTML object from a first position relative to other HTML objects in the HTML page to a second position relative to the other HTML objects in the HTML page;

altering parameters of the selected HTML object relative to the other HTML objects to enable placement of the selected HTML object at the second position;

altering parameters of the other HTML objects affected by said altered parameters of the selected HTML object to enable maintenance of positions of the other HTML objects relative one another;

determining, using the altered parameters, publishable HTML code to enable presentation in the HTML page of the selected HTML object at the second position while maintaining the positions of the other HTML objects;

presenting, based on the publishable HTML code determined using the altered parameters;

the selected HTML object at the second position and the other HTML objects at their respective positions; and

parameters for the selected HTML object and the other HTML objects, the parameters presented among the selected HTML object and the other HTML objects within the design interface;

receiving selection to alter a selected parameter of the parameters presented within the design interface;

determining, using the selected parameter, publishable HTML code to enable presenting the selected HTML object and the other HTML objects to reflect said alteration of the selected parameter; and

presenting, based on the publishable HTML code determined using the selected parameter, the selected HTML object and the other HTML objects.

15. One or more computer-readable storage media as described in claim 14, wherein the parameters for the selected HTML object and the other HTML objects are Cascading Style Sheet (CSS) float, margin, and clearing properties for the selected HTML object and the other HTML objects.

16. One or more computer-readable storage media as described in claim 14, the operations further comprising:

responsive to receiving the selection to move the selected HTML object, presenting parameters for the selected HTML object and the other HTML objects among the selected HTML object and the other HTML objects within the design interface;

determining intermediate publishable HTML code during said moving the selected HTML object to the second position; and

presenting, based on the intermediate publishable HTML code, parameters for the selected HTML object and the other HTML objects in the design interface during said moving the selected HTML object to the second position.

17. A system comprising:

one or more processors;

one or more computer-readable storage media comprising instructions stored thereon that, responsive to execution by the processors, cause the processors to perform operations including;

receiving, in a design interface presenting an HTML page, a selection to move a selected HTML object from a first position relative to other HTML objects in the HTML page to a second position relative to the other HTML objects in the HTML page;

altering parameters of the selected HTML object relative to the other HTML objects to enable placement of the selected HTML object at the second position;

altering parameters of the other HTML objects affected by said altered parameters of the selected HTML object to enable maintenance of positions of the other HTML objects relative one another;

determining, using the altered parameters, publishable HTML code to enable presentation in the HTML page of the selected HTML object at the second position while maintaining the positions of the other HTML objects;

presenting, based on the publishable HTML code determined using the altered parameters;

the selected HTML object at the second position and the other HTML objects at their respective positions; and

parameters for the selected HTML object and the other HTML objects, the parameters presented among the selected HTML object and the other HTML objects within the design interface;

receiving selection to alter a selected parameter of the parameters presented within the design interface;

determining, using the selected parameter, publishable HTML code to enable presenting the selected HTML object and the other HTML objects to reflect said alteration of the selected parameter; and

presenting, based on the publishable HTML code determined using the selected parameter, the selected HTML object and the other HTML objects.

18. A system as described in claim 17, wherein the publishable HTML code is configured to be published by a browser without an additional publishing step or post-processing step.

19. A system as described in claim 17, wherein said altering the parameters of the other HTML objects includes:

parsing a Document Object Model (DOM) to determine the positions of the other HTML objects within the HTML page; and

determining, based on Cascading Style Sheet (CSS) values for the selected HTML object at the second position, CSS values for the other HTML objects that will not be affected by the CSS values for selected HTML object at the second position.

20. A system as described in claim 17, wherein the operations further include:

determining intermediate publishable HTML code during said movement of the selected HTML object to the second position, the intermediate publishable HTML code based on parameters of the other HTML objects affected by said movement of the selected HTML object;

flagging changes to the parameters of the other HTML objects affected by said movement of the selected HTML object for later use in said altering the parameters of the other HTML objects affected by said altered parameters of the selected HTML object.