{ "type": "root", "children": [ { "type": "svelteScript", "tagName": "script", "properties": [], "selfClosing": false, "children": [ { "type": "text", "value": "\n\tconst layers = [0, 1, 2, 3, 4, 5, 6, 7, 8];\n\n\tlet y;\n", "position": { "start": { "line": 1, "column": 9, "offset": 8 }, "end": { "line": 5, "column": 1, "offset": 63 } } } ], "position": { "start": { "line": 1, "column": 1, "offset": 0 }, "end": { "line": 5, "column": 10, "offset": 72 } } }, { "type": "text", "value": "\n\n", "position": { "start": { "line": 5, "column": 10, "offset": 72 }, "end": { "line": 7, "column": 1, "offset": 74 } } }, { "type": "svelteMeta", "tagName": "window", "properties": [ { "type": "svelteDirective", "name": "bind", "value": [ { "type": "svelteDynamicContent", "position": { "start": { "line": 7, "column": 29, "offset": 102 }, "end": { "line": 7, "column": 32, "offset": 105 } }, "expression": { "type": "svelteExpression", "value": "y", "position": { "start": { "line": 7, "column": 30, "offset": 103 }, "end": { "line": 7, "column": 31, "offset": 104 } } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 7, "column": 16, "offset": 89 }, "end": { "line": 7, "column": 32, "offset": 105 } }, "specifier": "scrollY" } ], "selfClosing": true, "children": [], "position": { "start": { "line": 7, "column": 1, "offset": 74 }, "end": { "line": 7, "column": 34, "offset": 107 } } }, { "type": "text", "value": "\n\n", "position": { "start": { "line": 7, "column": 34, "offset": 107 }, "end": { "line": 9, "column": 1, "offset": 109 } } }, { "type": "svelteElement", "tagName": "a", "properties": [ { "type": "svelteProperty", "name": "class", "value": [ { "type": "text", "value": "parallax-container", "position": { "start": { "line": 9, "column": 11, "offset": 119 }, "end": { "line": 9, "column": 30, "offset": 138 } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 9, "column": 4, "offset": 112 }, "end": { "line": 9, "column": 30, "offset": 138 } } }, { "type": "svelteProperty", "name": "href", "value": [ { "type": "text", "value": "https://www.firewatchgame.com", "position": { "start": { "line": 9, "column": 37, "offset": 145 }, "end": { "line": 9, "column": 67, "offset": 175 } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 9, "column": 31, "offset": 139 }, "end": { "line": 9, "column": 67, "offset": 175 } } } ], "selfClosing": false, "children": [ { "type": "text", "value": "\n\t", "position": { "start": { "line": 9, "column": 68, "offset": 176 }, "end": { "line": 10, "column": 2, "offset": 178 } } }, { "type": "svelteBranchingBlock", "name": "each", "branches": [ { "type": "svelteBranch", "name": "each", "expression": { "type": "svelteExpression", "value": "[0, 1, 2, 3, 4, 5, 6, 7, 8] as layer", "position": { "start": { "line": 10, "column": 9, "offset": 185 }, "end": { "line": 10, "column": 45, "offset": 221 } } }, "children": [ { "type": "text", "value": "\n\t\t", "position": { "start": { "line": 10, "column": 46, "offset": 222 }, "end": { "line": 11, "column": 3, "offset": 225 } } }, { "type": "svelteElement", "tagName": "img", "properties": [ { "type": "svelteProperty", "name": "style", "value": [ { "type": "text", "value": "transform:", "position": { "start": { "line": 12, "column": 11, "offset": 240 }, "end": {} } }, { "type": "text", "value": " ", "position": { "start": { "line": 12, "column": 21, "offset": 250 }, "end": {} } }, { "type": "text", "value": "translate(0,", "position": { "start": { "line": 12, "column": 22, "offset": 251 }, "end": { "line": 12, "column": 34, "offset": 263 } } }, { "type": "svelteDynamicContent", "position": { "start": { "line": 12, "column": 34, "offset": 263 }, "end": { "line": 12, "column": 68, "offset": 297 } }, "expression": { "type": "svelteExpression", "value": "-y * layer / (layers.length - 1)", "position": { "start": { "line": 12, "column": 35, "offset": 264 }, "end": { "line": 12, "column": 67, "offset": 296 } } } }, { "type": "text", "value": "px)", "position": { "start": { "line": 12, "column": 68, "offset": 297 }, "end": { "line": 12, "column": 72, "offset": 301 } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 12, "column": 4, "offset": 233 }, "end": { "line": 12, "column": 72, "offset": 301 } } }, { "type": "svelteProperty", "name": "src", "value": [ { "type": "text", "value": "https://www.firewatchgame.com/images/parallax/parallax", "position": { "start": { "line": 13, "column": 9, "offset": 310 }, "end": { "line": 13, "column": 63, "offset": 364 } } }, { "type": "svelteDynamicContent", "position": { "start": { "line": 13, "column": 63, "offset": 364 }, "end": { "line": 13, "column": 70, "offset": 371 } }, "expression": { "type": "svelteExpression", "value": "layer", "position": { "start": { "line": 13, "column": 64, "offset": 365 }, "end": { "line": 13, "column": 69, "offset": 370 } } } }, { "type": "text", "value": ".png", "position": { "start": { "line": 13, "column": 70, "offset": 371 }, "end": { "line": 13, "column": 75, "offset": 376 } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 13, "column": 4, "offset": 305 }, "end": { "line": 13, "column": 75, "offset": 376 } } }, { "type": "svelteProperty", "name": "alt", "value": [ { "type": "text", "value": "parallax", "position": { "start": { "line": 14, "column": 9, "offset": 385 }, "end": {} } }, { "type": "text", "value": " ", "position": { "start": { "line": 14, "column": 17, "offset": 393 }, "end": {} } }, { "type": "text", "value": "layer", "position": { "start": { "line": 14, "column": 18, "offset": 394 }, "end": {} } }, { "type": "text", "value": " ", "position": { "start": { "line": 14, "column": 23, "offset": 399 }, "end": { "line": 14, "column": 24, "offset": 400 } } }, { "type": "svelteDynamicContent", "position": { "start": { "line": 14, "column": 24, "offset": 400 }, "end": { "line": 14, "column": 31, "offset": 407 } }, "expression": { "type": "svelteExpression", "value": "layer", "position": { "start": { "line": 14, "column": 25, "offset": 401 }, "end": { "line": 14, "column": 30, "offset": 406 } } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 14, "column": 4, "offset": 380 }, "end": { "line": 14, "column": 32, "offset": 408 } } } ], "selfClosing": true, "children": [], "position": { "start": { "line": 11, "column": 3, "offset": 225 }, "end": { "line": 15, "column": 4, "offset": 412 } } }, { "type": "text", "value": "\n\t", "position": { "start": { "line": 15, "column": 4, "offset": 412 }, "end": { "line": 16, "column": 2, "offset": 414 } } } ], "position": { "start": { "line": 10, "column": 2, "offset": 178 }, "end": { "line": 16, "column": 2, "offset": 414 } } } ], "position": { "start": { "line": 10, "column": 2, "offset": 178 }, "end": { "line": 16, "column": 9, "offset": 421 } } }, { "type": "text", "value": "\n", "position": { "start": { "line": 16, "column": 9, "offset": 421 }, "end": { "line": 17, "column": 1, "offset": 422 } } } ], "position": { "start": { "line": 9, "column": 1, "offset": 109 }, "end": { "line": 17, "column": 5, "offset": 426 } } }, { "type": "text", "value": "\n\n", "position": { "start": { "line": 17, "column": 5, "offset": 426 }, "end": { "line": 19, "column": 1, "offset": 428 } } }, { "type": "svelteElement", "tagName": "div", "properties": [ { "type": "svelteProperty", "name": "class", "value": [ { "type": "text", "value": "text", "position": { "start": { "line": 19, "column": 13, "offset": 440 }, "end": { "line": 19, "column": 18, "offset": 445 } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 19, "column": 6, "offset": 433 }, "end": { "line": 19, "column": 18, "offset": 445 } } } ], "selfClosing": false, "children": [ { "type": "text", "value": "\n\t", "position": { "start": { "line": 19, "column": 19, "offset": 446 }, "end": { "line": 20, "column": 2, "offset": 448 } } }, { "type": "svelteElement", "tagName": "span", "properties": [ { "type": "svelteProperty", "name": "style", "value": [ { "type": "text", "value": "opacity:", "position": { "start": { "line": 20, "column": 15, "offset": 461 }, "end": {} } }, { "type": "text", "value": " ", "position": { "start": { "line": 20, "column": 23, "offset": 469 }, "end": { "line": 20, "column": 24, "offset": 470 } } }, { "type": "svelteDynamicContent", "position": { "start": { "line": 20, "column": 24, "offset": 470 }, "end": { "line": 20, "column": 49, "offset": 495 } }, "expression": { "type": "svelteExpression", "value": "1 - Math.max(0, y / 40)", "position": { "start": { "line": 20, "column": 25, "offset": 471 }, "end": { "line": 20, "column": 48, "offset": 494 } } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 20, "column": 8, "offset": 454 }, "end": { "line": 20, "column": 50, "offset": 496 } } } ], "selfClosing": false, "children": [ { "type": "text", "value": "\n\t\tscroll down\n\t", "position": { "start": { "line": 20, "column": 51, "offset": 497 }, "end": { "line": 22, "column": 2, "offset": 513 } } } ], "position": { "start": { "line": 20, "column": 2, "offset": 448 }, "end": { "line": 22, "column": 9, "offset": 520 } } }, { "type": "text", "value": "\n\n\t", "position": { "start": { "line": 22, "column": 9, "offset": 520 }, "end": { "line": 24, "column": 2, "offset": 523 } } }, { "type": "svelteElement", "tagName": "div", "properties": [ { "type": "svelteProperty", "name": "class", "value": [ { "type": "text", "value": "foreground", "position": { "start": { "line": 24, "column": 14, "offset": 535 }, "end": { "line": 24, "column": 25, "offset": 546 } } } ], "modifiers": [], "shorthand": "none", "position": { "start": { "line": 24, "column": 7, "offset": 528 }, "end": { "line": 24, "column": 25, "offset": 546 } } } ], "selfClosing": false, "children": [ { "type": "text", "value": "\n\t\tYou have scrolled ", "position": { "start": { "line": 24, "column": 26, "offset": 547 }, "end": { "line": 25, "column": 21, "offset": 568 } } }, { "type": "svelteDynamicContent", "position": { "start": { "line": 25, "column": 21, "offset": 568 }, "end": { "line": 25, "column": 24, "offset": 571 } }, "expression": { "type": "svelteExpression", "value": "y", "position": { "start": { "line": 25, "column": 22, "offset": 569 }, "end": { "line": 25, "column": 23, "offset": 570 } } } }, { "type": "text", "value": " pixels\n\t", "position": { "start": { "line": 25, "column": 24, "offset": 571 }, "end": { "line": 26, "column": 2, "offset": 580 } } } ], "position": { "start": { "line": 24, "column": 2, "offset": 523 }, "end": { "line": 26, "column": 8, "offset": 586 } } }, { "type": "text", "value": "\n", "position": { "start": { "line": 26, "column": 8, "offset": 586 }, "end": { "line": 27, "column": 1, "offset": 587 } } } ], "position": { "start": { "line": 19, "column": 1, "offset": 428 }, "end": { "line": 27, "column": 7, "offset": 593 } } }, { "type": "text", "value": "\n\n", "position": { "start": { "line": 27, "column": 7, "offset": 593 }, "end": { "line": 29, "column": 1, "offset": 595 } } }, { "type": "svelteStyle", "tagName": "style", "properties": [], "selfClosing": false, "children": [ { "type": "text", "value": "\n\t.parallax-container {\n\t\tposition: fixed;\n\t\twidth: 2400px;\n\t\theight: 712px;\n\t\tleft: 50%;\n\t\ttransform: translate(-50%,0);\n\t}\n\n\t.parallax-container img {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\twidth: 100%;\n\t\twill-change: transform;\n\t}\n\n\t.parallax-container img:last-child::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbackground: rgb(45,10,13);\n\t}\n\n\t.text {\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\theight: 300vh;\n\t\tcolor: rgb(220,113,43);\n\t\ttext-align: center;\n\t\tpadding: 4em 0.5em 0.5em 0.5em;\n\t\tbox-sizing: border-box;\n\t\tpointer-events: none;\n\t}\n\n\tspan {\n\t\tdisplay: block;\n\t\tfont-size: 1em;\n\t\ttext-transform: uppercase;\n\t\twill-change: transform, opacity;\n\t}\n\n\t.foreground {\n\t\tposition: absolute;\n\t\ttop: 711px;\n\t\tleft: 0;\n\t\twidth: 100%;\n\t\theight: calc(100% - 712px);\n\t\tbackground-color: rgb(32,0,1);\n\t\tcolor: white;\n\t\tpadding: 50vh 0 0 0;\n\t}\n\n\t:global(body) {\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tbackground-color: rgb(253, 174, 51);\n\t}\n", "position": { "start": { "line": 29, "column": 8, "offset": 602 }, "end": { "line": 88, "column": 1, "offset": 1569 } } } ], "position": { "start": { "line": 29, "column": 1, "offset": 595 }, "end": { "line": 88, "column": 9, "offset": 1577 } } } ], "position": { "start": { "column": 1, "line": 1, "offset": 0 }, "end": { "line": 88, "column": 9, "offset": 1577 } } }