| OLD | NEW |
| 1 Sky Markup: Syntax | 1 Sky Markup: Syntax |
| 2 ================== | 2 ================== |
| 3 | 3 |
| 4 A Sky file must consist of the following components: | 4 A Sky file must consist of the following components: |
| 5 | 5 |
| 6 1. If the file is intended to be a top-level Sky application, the | 6 1. If the file is intended to be a top-level Sky application, the |
| 7 string "```#!mojo mojo:sky```" followed by a U+0020, U+000A or | 7 string "``#!mojo mojo:sky``" followed by a U+0020, U+000A or |
| 8 U+000D character. | 8 U+000D character. |
| 9 | 9 |
| 10 If the file is intended to be a module, then the string "SKY", a | 10 If the file is intended to be a module, then the string "SKY", a |
| 11 U+0020 (space) character, the string "MODULE", and a U+0020, | 11 U+0020 (space) character, the string "MODULE", and a U+0020, |
| 12 U+000A or U+000D character. | 12 U+000A or U+000D character. |
| 13 | 13 |
| 14 These signatures make it more difficult to e.g. embed some Sky | 14 These signatures make it more difficult to e.g. embed some Sky |
| 15 markup into a PNG and then cause someone to import that image as a | 15 markup into a PNG and then cause someone to import that image as a |
| 16 module. | 16 module. |
| 17 | 17 |
| 18 2. Zero or more of the following, in any order: | 18 2. Zero or more of the following, in any order: |
| 19 - comments | 19 - comments |
| 20 - text | 20 - text |
| 21 - escapes | 21 - escapes |
| 22 - elements | 22 - elements |
| 23 | 23 |
| 24 Sky files must be encoded using UTF-8. | 24 Sky files must be encoded using UTF-8. |
| 25 | 25 |
| 26 A file that doesn't begin with the "```#!mojo mojo:sky```" signature | 26 A file that doesn't begin with the "``#!mojo mojo:sky``" signature |
| 27 isn't a Sky application file. For example: | 27 isn't a Sky application file. For example: |
| 28 | 28 |
| 29 #!mojo https://example.com/runtimes/sky.asmjs | 29 #!mojo https://example.com/runtimes/sky.asmjs |
| 30 Hello World | 30 Hello World |
| 31 | 31 |
| 32 ...is not a Sky file, even if ```https://example.com/runtimes/sky.asmjs``` | 32 ...is not a Sky file, even if ``https://example.com/runtimes/sky.asmjs`` |
| 33 is an implementation of the Sky runtime: it's just a file intended | 33 is an implementation of the Sky runtime: it's just a file intended |
| 34 specifically for that runtime. | 34 specifically for that runtime. |
| 35 | 35 |
| 36 The ```mojo:sky``` URL represents the generic Sky runtime provided by | 36 The ``mojo:sky`` URL represents the generic Sky runtime provided by |
| 37 your Mojo runtime vendor. | 37 your Mojo runtime vendor. |
| 38 | 38 |
| 39 | 39 |
| 40 Comments | 40 Comments |
| 41 -------- | 41 -------- |
| 42 | 42 |
| 43 Comments start with the sequence "```<!--```" and end with the | 43 Comments start with the sequence "``<!--``" and end with the |
| 44 sequence "```-->```", where the start and end hyphens don't overlap. | 44 sequence "``-->``", where the start and end hyphens don't overlap. |
| 45 In between these characters, any sequence of characters is allowed | 45 In between these characters, any sequence of characters is allowed |
| 46 except "```-->```", which terminates the comment. Comments cannot, | 46 except "``-->``", which terminates the comment. Comments cannot, |
| 47 therefore, be nested. | 47 therefore, be nested. |
| 48 | 48 |
| 49 | 49 |
| 50 Text | 50 Text |
| 51 ---- | 51 ---- |
| 52 | 52 |
| 53 Any sequence of Unicode characters other than ```<```, ```&```, and | 53 Any sequence of Unicode characters other than ``<``, ``&``, and |
| 54 U+0000. | 54 U+0000. |
| 55 | 55 |
| 56 | 56 |
| 57 Escapes | 57 Escapes |
| 58 ------- | 58 ------- |
| 59 | 59 |
| 60 There are three kinds of escapes: | 60 There are three kinds of escapes: |
| 61 | 61 |
| 62 ### Hex | 62 ### Hex |
| 63 | 63 |
| 64 They begin with the sequence ```&#x``` or ```&#X```, followed by a | 64 They begin with the sequence ``&#x`` or ``&#X``, followed by a |
| 65 sequence of hex characters (lowercase or uppercase), followed by a | 65 sequence of hex characters (lowercase or uppercase), followed by a |
| 66 semicolon. The number 0 is not allowed. | 66 semicolon. The number 0 is not allowed. |
| 67 | 67 |
| 68 ### Decimal | 68 ### Decimal |
| 69 | 69 |
| 70 They begin with the sequence ```&#``` or ```&#```, followed by a | 70 They begin with the sequence ``&#`` or ``&#``, followed by a |
| 71 sequence of decimal characters, followed by a semicolon. The number 0 | 71 sequence of decimal characters, followed by a semicolon. The number 0 |
| 72 is not allowed. | 72 is not allowed. |
| 73 | 73 |
| 74 ### Named | 74 ### Named |
| 75 | 75 |
| 76 They begin with the sequence ```&```, followed by any characters, | 76 They begin with the sequence ``&``, followed by any characters, |
| 77 followed by a semicolon. | 77 followed by a semicolon. |
| 78 | 78 |
| 79 The following names work: | 79 The following names work: |
| 80 | 80 |
| 81 | Name | Character | Unicode | | 81 | Name | Character | Unicode | |
| 82 | ---- | --------- | ------- | | 82 | ---- | --------- | ------- | |
| 83 | `lt` | `<` | U+003C LESS-THAN SIGN character | | 83 | `lt` | `<` | U+003C LESS-THAN SIGN character | |
| 84 | `gt` | `>` | U+003E GREATER-THAN SIGN character | | 84 | `gt` | `>` | U+003E GREATER-THAN SIGN character | |
| 85 | `amp` | `&` | U+0026 AMPERSAND character | | 85 | `amp` | `&` | U+0026 AMPERSAND character | |
| 86 | `apos` | `'` | U+0027 APOSTROPHE character | | 86 | `apos` | `'` | U+0027 APOSTROPHE character | |
| 87 | `quot` | `"` | U+0022 QUOTATION MARK character | | 87 | `quot` | `"` | U+0022 QUOTATION MARK character | |
| 88 | 88 |
| 89 | 89 |
| 90 Elements | 90 Elements |
| 91 -------- | 91 -------- |
| 92 | 92 |
| 93 An element consists of the following: | 93 An element consists of the following: |
| 94 | 94 |
| 95 1. ```<``` | 95 1. ``<`` |
| 96 2. Tag name: A sequence of characters other than ```/```, ```>```, | 96 2. Tag name: A sequence of characters other than ``/``, ``>``, |
| 97 U+0020, U+000A, U+000D (whitespace). | 97 U+0020, U+000A, U+000D (whitespace). |
| 98 3. Zero or more of the following: | 98 3. Zero or more of the following: |
| 99 1. One or more U+0020, U+000A, U+000D (whitespace). | 99 1. One or more U+0020, U+000A, U+000D (whitespace). |
| 100 2. Attribute name: A sequence of characters other than ```/```, | 100 2. Attribute name: A sequence of characters other than ``/``, |
| 101 ```=```, ```>```, U+0020, U+000A, U+000D (whitespace). | 101 ``=``, ``>``, U+0020, U+000A, U+000D (whitespace). |
| 102 3. Optionally: | 102 3. Optionally: |
| 103 1. Zero or more U+0020, U+000A, U+000D (whitespace) characters. | 103 1. Zero or more U+0020, U+000A, U+000D (whitespace) characters. |
| 104 2. ```=``` | 104 2. ``=`` |
| 105 3. Zero or more U+0020, U+000A, U+000D (whitespace) characters. | 105 3. Zero or more U+0020, U+000A, U+000D (whitespace) characters. |
| 106 4. Attribute value: Either: | 106 4. Attribute value: Either: |
| 107 - ```'``` followed by attribute text other than ```'``` | 107 - ``'`` followed by attribute text other than ``'`` |
| 108 followed by a terminating ```'```. | 108 followed by a terminating ``'``. |
| 109 - ```"``` followed by attribute text other than ```'``` | 109 - ``"`` followed by attribute text other than ``'`` |
| 110 followed by a terminating ```"```. | 110 followed by a terminating ``"``. |
| 111 - attribute text other than ```/```, ```>```, | 111 - attribute text other than ``/``, ``>``, |
| 112 U+0020, U+000A, U+000D (whitespace). | 112 U+0020, U+000A, U+000D (whitespace). |
| 113 "Attribute text" is escapes or any unicode characters other | 113 "Attribute text" is escapes or any unicode characters other |
| 114 than U+0000. | 114 than U+0000. |
| 115 4. Either: | 115 4. Either: |
| 116 - For a void element: | 116 - For a void element: |
| 117 1. ```/```, indicating an empty element. | 117 1. ``/``, indicating an empty element. |
| 118 2. ```>``` | 118 2. ``>`` |
| 119 - For a non-void element: | 119 - For a non-void element: |
| 120 2. ```>``` | 120 2. ``>`` |
| 121 3. The element's contents: | 121 3. The element's contents: |
| 122 - If the element's tag name is ```script```, then any sequence of | 122 - If the element's tag name is ``script``, then any sequence of |
| 123 characters other than U+0000, but there must not be the | 123 characters other than U+0000, but there must not be the |
| 124 substring ```</script```. The sequence must be valid sky script. | 124 substring ``</script``. The sequence must be valid sky script. |
| 125 - If the element's tag name is ```style```, then any sequence of | 125 - If the element's tag name is ``style``, then any sequence of |
| 126 characters other than U+0000, but there must not be the | 126 characters other than U+0000, but there must not be the |
| 127 substring ```</style```. The sequence must be valid sky style. | 127 substring ``</style``. The sequence must be valid sky style. |
| 128 - Otherwise, zero or more of the following, in any order: | 128 - Otherwise, zero or more of the following, in any order: |
| 129 - comments | 129 - comments |
| 130 - text | 130 - text |
| 131 - escapes | 131 - escapes |
| 132 - elements | 132 - elements |
| 133 4. Finally, the end tag, which may be omitted if the element's tag | 133 4. Finally, the end tag, which may be omitted if the element's tag |
| 134 name is not ```template```, consisting of: | 134 name is not ``template``, consisting of: |
| 135 1. ```<``` | 135 1. ``<`` |
| 136 2. ```/``` | 136 2. ``/`` |
| 137 3. Same sequence of characters as "tag name" above. | 137 3. Same sequence of characters as "tag name" above. |
| 138 4. ```>``` | 138 4. ``>`` |
| 139 | 139 |
| 140 | 140 |
| 141 Sky Markup: Elements | 141 Sky Markup: Elements |
| 142 ==================== | 142 ==================== |
| 143 | 143 |
| 144 The Sky language consists of very few elements, since it is expected | 144 The Sky language consists of very few elements, since it is expected |
| 145 that everything of note would be provided by frameworks. | 145 that everything of note would be provided by frameworks. |
| 146 | 146 |
| 147 ```<import src="foo.sky">``` | 147 ``<import src="foo.sky">`` |
| 148 - Downloads and imports foo.sky in the background. | 148 - Downloads and imports foo.sky in the background. |
| 149 | 149 |
| 150 ```<import src="foo.sky" as="foo">``` | 150 ``<import src="foo.sky" as="foo">`` |
| 151 - Downloads and imports foo.sky in the background, using "foo" as its | 151 - Downloads and imports foo.sky in the background, using "foo" as its |
| 152 local name (see ```<script>```). | 152 local name (see ``<script>``). |
| 153 | 153 |
| 154 ```<template>``` | 154 ``<template>`` |
| 155 - The contents of the element aren't placed in the Element itself. | 155 - The contents of the element aren't placed in the Element itself. |
| 156 They are instead placed into a DocumentFragment that you can obtain | 156 They are instead placed into a DocumentFragment that you can obtain |
| 157 from the element's "content" attribute. | 157 from the element's "content" attribute. |
| 158 | 158 |
| 159 ```<script>``` | 159 ``<script>`` |
| 160 - Blocks until all previous imports have been loaded, then runs the | 160 - Blocks until all previous imports have been loaded, then runs the |
| 161 script, with either 'module' or 'application' as the first | 161 script, with either 'module' or 'application' as the first |
| 162 argument, the exports of any imports that have "as" attributes at | 162 argument, the exports of any imports that have "as" attributes at |
| 163 this time passed in as subsequent arguments, and with "this" set to | 163 this time passed in as subsequent arguments, and with "this" set to |
| 164 null. | 164 null. |
| 165 | 165 |
| 166 ```<style>``` | 166 ``<style>`` |
| 167 - Adds the contents to the document's styles. | 167 - Adds the contents to the document's styles. |
| 168 | 168 |
| 169 ```<content>``` | 169 ``<content>`` |
| 170 ```<content select="...">``` | 170 ``<content select="...">`` |
| 171 - In a shadow tree, acts as an insertion point for distributed nodes. | 171 - In a shadow tree, acts as an insertion point for distributed nodes. |
| 172 The select="" attribute gives the selector to use to pick the nodes | 172 The select="" attribute gives the selector to use to pick the nodes |
| 173 to place in this insertion point; it defaults to everything. | 173 to place in this insertion point; it defaults to everything. |
| 174 | 174 |
| 175 ```<shadow>``` | 175 ``<shadow>`` |
| 176 - In a shadow tree, acts as an insertion point for older shadow trees. | 176 - In a shadow tree, acts as an insertion point for older shadow trees. |
| 177 | 177 |
| 178 ```<img src="foo.bin">``` | 178 ``<img src="foo.bin">`` |
| 179 - Sky fetches the bits for foo.bin, looks for a decoder for those | 179 - Sky fetches the bits for foo.bin, looks for a decoder for those |
| 180 bits, and renders the bits that the decoder returns. | 180 bits, and renders the bits that the decoder returns. |
| 181 | 181 |
| 182 ```<iframe src="foo.bin">``` | 182 ``<iframe src="foo.bin">`` |
| 183 - Sky tells mojo to open an application for foo.bin, and hands that | 183 - Sky tells mojo to open an application for foo.bin, and hands that |
| 184 application a view so that the application can render appropriately. | 184 application a view so that the application can render appropriately. |
| 185 | 185 |
| 186 ```<t>``` | 186 ``<t>`` |
| 187 - Within a ```<t>``` section, whitespace is not trimmed from the start and | 187 - Within a ``<t>`` section, whitespace is not trimmed from the start and |
| 188 end of text nodes by the parser. | 188 end of text nodes by the parser. |
| 189 TOOD(ianh): figure out if the authoring aesthetics of this are ok | 189 TOOD(ianh): figure out if the authoring aesthetics of this are ok |
| 190 | 190 |
| 191 ```<a href="foo.bin">``` | 191 ``<a href="foo.bin">`` |
| 192 - A widget that, when invoked, causes mojo to open a new application | 192 - A widget that, when invoked, causes mojo to open a new application |
| 193 for "foo.bin". | 193 for "foo.bin". |
| 194 | 194 |
| 195 ```<title>``` | 195 ``<title>`` |
| 196 - Sets the contents as the document's title (as provided by Sky to | 196 - Sets the contents as the document's title (as provided by Sky to |
| 197 the view manager). (Actually just ensures that any time the element | 197 the view manager). (Actually just ensures that any time the element |
| 198 is mutated, theTitleElement.ownerScope.ownerDocument.title is set | 198 is mutated, theTitleElement.ownerScope.ownerDocument.title is set |
| 199 to the element's contents.) | 199 to the element's contents.) |
| 200 | 200 |
| 201 | 201 |
| 202 Sky Markup: Global Attributes | 202 Sky Markup: Global Attributes |
| 203 ============================= | 203 ============================= |
| 204 | 204 |
| 205 The following attributes are available on all elements: | 205 The following attributes are available on all elements: |
| 206 | 206 |
| 207 id="" (any value) | 207 id="" (any value) |
| 208 class="" (any value, space-separated) | 208 class="" (any value, space-separated) |
| 209 style="" (declaration part of a Sky style rule) | 209 style="" (declaration part of a Sky style rule) |
| 210 lang="" (language code) | 210 lang="" (language code) |
| 211 dir="" (ltr or rtl only) | 211 dir="" (ltr or rtl only) |
| 212 | 212 |
| 213 contenteditable="" (subject to future developments) | 213 contenteditable="" (subject to future developments) |
| 214 tabindex="" (subject to future developments) | 214 tabindex="" (subject to future developments) |
| OLD | NEW |