Procedurally expressing graphic objects for web pages

• US 8,239,749 B2
• Filed: 06/02/2005
• Issued: 08/07/2012
• Est. Priority Date: 06/25/2004
• Status: Active Grant

• Current Assignee: Apple Inc.
• Original Assignee: Apple Inc.
• Inventors: Williamson, Richard, Hyatt, David, Louch, John
• Primary Examiner(s): HUYNH, CONG LAC T
• Application Number:
  US11/144,384
• Publication Number:
  US 20060005114A1
• Time in Patent Office: 2,623 Days
• Field of Search: 715/200, 715/211, 715/205
• US Class Current: 715/211
• CPC Class Codes: G06F 16/958 Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
• CPC Class Codes: G06F 40/117 Tagging; Marking up details of markup languages G06F40/143; Designating a block; Setting of attributes style sheets, e.g. eXtensible Stylesheet Language Transformation [XSLT], G06F40/154
• CPC Class Codes: G06F 40/143 Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
• CPC Class Codes: G06F 40/146 Coding or compression of tree-structured data
• CPC Class Codes: G06T 11/20 Drawing from basic elements, e.g. lines or circles

Abstract

A graphics object can be expressed using procedural language embedded in a markup language document. In a embodiment, a drawing space is specified in markup language. A drawing command to arbitrarily draw a graphics object into the drawing space is specified in procedural language. Interpretation of the markup and procedural language commands results in the rendering of the arbitrary graphics object. In another embodiment, there is a browser comprising a rendering engine, an interpreter, and parser. The rendering engine is configured to interpret a markup language instruction that specifies a drawing space as well as drawing commands in procedural language for drawing an arbitrary graphic object into the drawing space. The parser can then parse the drawing commands and convert them into an execution tree of tree objects.

Claims

1. A computer-implemented method of drawing an arbitrary graphics object in a web page, the method comprising:

accessing, by a web browser, a file including coded markup language that specifies a drawing space as an extent within the web page and coded procedural language that specifies a drawing command to draw the arbitrary graphics object in the drawing space in the web page;

creating the drawing space within the web page using the coded markup language; and

drawing, by the web browser, the arbitrary graphics object into the drawing space within the web page using the coded procedural language.

2. The method of claim 1, wherein creating the drawing space comprises executing a retrieving command in the procedural language to retrieve an arbitrary graphics command from a library of graphics commands to create the drawing space.

3. The method of claim 1, further comprising responsive to the coded procedural command comprising a context command, retrieving a drawing object for performing the drawing command.

4. The method of claim 3, wherein the drawing object maintains a drawing state.

5. The method of claim 4, wherein the drawing state comprising at least one of:

a transformation matrix, a clip region, and a value of a graphics object attribute.

6. The method of claim 5, wherein the graphics object attribute comprises at least one of:

a color attribute, a style attribute, a line attribute, a shadow attribute, and a drawing attribute.

7. The method of claim 1, wherein the coded markup language further specifies a styling to be applied to the arbitrary graphics object using a content style sheet.

8. The method of claim 1, wherein the drawing command comprises a call to a library of graphics commands for rendering the arbitrary graphics object.

9. The method of claim 1, wherein the coded markup language comprises a coded markup tag specifying the drawing space.

10. The method of claim 1, wherein the file is created using a markup editor.

11. The method of claim 1, wherein the drawing space comprises a two-dimensional drawing space.

12. The method of claim 1, wherein the drawing space comprises a three-dimensional drawing space.

13. The method of claim 1, wherein the markup language is one of hypertext markup language, extensible hypertext markup language, and extensible markup language.

14. The method of claim 1, wherein the procedural language is one of Javascript, Python, and Visual Basic.

15. The method of claim 1, wherein the drawing command is one of a vector graphics command and an OpenGL command.

16. The method of claim 1, wherein the drawing command consists of at least one of a shape drawing command, a masking command, a pathing command, a transparency command, and a fill command.

17. The method of claim 1, wherein the file further includes an association of a procedural language command with at least one arbitrary drawing function implemented by a graphics language command to draw the arbitrary graphics object in the drawing space.

18. The method of claim 17, wherein the file further includes a command to retrieve the drawing space on which the procedural language command can be performed.

19. The method of claim 18, wherein the drawing space comprises a two-dimensional drawing space.

20. The method of claim 19, wherein the drawing space comprises a three-dimensional drawing space.

21. The method of claim 17, wherein the file further includes a command to retrieve the drawing object to perform the procedural language command.

22. The method of claim 21, wherein the drawing object maintains a drawing state.

23. The method of claim 22, wherein the drawing state consists of at least one of:

a transformation matrix, a clip region, and a value of a graphics object attribute.

24. The method of claim 17, wherein the at least one arbitrary drawing function comprises one of:

a pathing function, a filling function, a stroking function, a curve-drawing function, a line-drawing function, a rotating function, a compositing function, a coloring function, a style function, a shadowing function, and a shape function.

25. The method of claim 17, wherein the graphics language command is one of a vector graphics command and an OpenGL command.

26. The method of claim 17, wherein the procedural language command calls a graphics command of a library of graphics commands for arbitrarily rendering the arbitrary graphics object.

27. The method of claim 17, wherein the procedural language is one of Javascript, Python, and Visual Basic.

28. A computer program product comprising a non-transitory computer readable storage medium and computer program instructions encoded on the storage medium for drawing an arbitrary graphics object in a web page, the computer program instructions when executed by a processor perform the steps of:

accessing, by a web browser, a file including markup language that specifies a drawing space as an extent within the web page and coded procedural language that specifies a drawing command to draw the arbitrary graphics object in the drawing space in the web page;

creating the drawing space within the web page using the coded markup language; and

drawing, by the web browser, the arbitrary graphics object into the drawing space within the web page using the coded procedural language.

29. The computer program product of claim 28, wherein creating the drawing space comprises executing an instruction for specifying a command in the procedural language to retrieve an arbitrary graphics command from a library of graphics commands to create the drawing space.

30. The computer program product of claim 28, further comprising responsive to the coded procedural command comprising a context command, retrieving a drawing object for performing the drawing command.

31. The computer program product of claim 30, wherein the drawing object supports a drawing state, the drawing state comprising at least one of:

a transformation matrix, a clip region, and a value of an arbitrary graphics object attribute.

32. The computer program product of claim 31, wherein the graphics object attribute consists of at least one of:

a color attribute, a style attribute, a line attribute, a shadow attribute, and a drawing attribute.

33. The computer program product of claim 28, wherein the coded markup language further specifies a styling to be applied to the graphics object using a content style sheet.

34. A system for drawing an arbitrary graphics object in a web page, the system comprising:

a processor; and

a computer-readable storage medium comprising computer program instructions, the instructions when executed by the processor are configured to;

access, by a web browser, a file including coded markup language that specifies a drawing spaces as an extent within the web page and coded procedural language that specifies a drawing command to draw the arbitrary graphics object in the drawing space in the web page;

create the drawing space within the web page using coded markup language; and

drawing, by the web browser, the arbitrary graphics object into the drawing space within the web page using the coded procedural language.

35. The system of claim 34, wherein the processor is further configured for associating a procedural language command with at least one arbitrary drawing function implemented by a graphics language command responsive to user input.