|
1 |
| -(function() { |
2 |
| - 'use strict'; |
| 1 | +;(function() { |
| 2 | + 'use strict' |
3 | 3 |
|
4 |
| - var privateData = new WeakMap(); |
| 4 | + const privateData = new WeakMap() |
5 | 5 |
|
6 | 6 | function fire(name, target) {
|
7 | 7 | setTimeout(function() {
|
8 |
| - var event = target.ownerDocument.createEvent('Event'); |
9 |
| - event.initEvent(name, false, false); |
10 |
| - target.dispatchEvent(event); |
11 |
| - }, 0); |
| 8 | + const event = target.ownerDocument.createEvent('Event') |
| 9 | + event.initEvent(name, false, false) |
| 10 | + target.dispatchEvent(event) |
| 11 | + }, 0) |
12 | 12 | }
|
13 | 13 |
|
14 | 14 | function handleData(el, data) {
|
15 |
| - return data.then(function(html) { |
16 |
| - var parentNode = el.parentNode; |
17 |
| - if (parentNode) { |
18 |
| - el.insertAdjacentHTML('afterend', html); |
19 |
| - parentNode.removeChild(el); |
| 15 | + return data.then( |
| 16 | + function(html) { |
| 17 | + const parentNode = el.parentNode |
| 18 | + if (parentNode) { |
| 19 | + el.insertAdjacentHTML('afterend', html) |
| 20 | + parentNode.removeChild(el) |
| 21 | + } |
| 22 | + }, |
| 23 | + function() { |
| 24 | + el.classList.add('is-error') |
20 | 25 | }
|
21 |
| - }, function() { |
22 |
| - el.classList.add('is-error'); |
23 |
| - }); |
| 26 | + ) |
24 | 27 | }
|
25 | 28 |
|
26 |
| - var IncludeFragmentPrototype = Object.create(window.HTMLElement.prototype); |
| 29 | + const IncludeFragmentPrototype = Object.create(window.HTMLElement.prototype) |
27 | 30 |
|
28 | 31 | Object.defineProperty(IncludeFragmentPrototype, 'src', {
|
29 |
| - get: function() { |
30 |
| - var src = this.getAttribute('src'); |
| 32 | + get() { |
| 33 | + const src = this.getAttribute('src') |
31 | 34 | if (src) {
|
32 |
| - var link = this.ownerDocument.createElement('a'); |
33 |
| - link.href = src; |
34 |
| - return link.href; |
| 35 | + const link = this.ownerDocument.createElement('a') |
| 36 | + link.href = src |
| 37 | + return link.href |
35 | 38 | } else {
|
36 |
| - return ''; |
| 39 | + return '' |
37 | 40 | }
|
38 | 41 | },
|
39 |
| - set: function(value) { |
40 |
| - this.setAttribute('src', value); |
| 42 | + |
| 43 | + set(value) { |
| 44 | + this.setAttribute('src', value) |
41 | 45 | }
|
42 |
| - }); |
| 46 | + }) |
43 | 47 |
|
44 | 48 | function getData(el) {
|
45 |
| - var src = el.src; |
46 |
| - var data = privateData.get(el); |
| 49 | + const src = el.src |
| 50 | + let data = privateData.get(el) |
47 | 51 | if (data && data.src === src) {
|
48 |
| - return data.data; |
| 52 | + return data.data |
49 | 53 | } else {
|
50 | 54 | if (src) {
|
51 |
| - data = el.load(); |
| 55 | + data = el.load() |
52 | 56 | } else {
|
53 |
| - data = Promise.reject(new Error('missing src')); |
| 57 | + data = Promise.reject(new Error('missing src')) |
54 | 58 | }
|
55 |
| - privateData.set(el, {src: src, data: data}); |
56 |
| - return data; |
| 59 | + privateData.set(el, {src, data}) |
| 60 | + return data |
57 | 61 | }
|
58 | 62 | }
|
59 | 63 |
|
60 | 64 | Object.defineProperty(IncludeFragmentPrototype, 'data', {
|
61 |
| - get: function() { |
62 |
| - return getData(this); |
| 65 | + get() { |
| 66 | + return getData(this) |
63 | 67 | }
|
64 |
| - }); |
| 68 | + }) |
65 | 69 |
|
66 | 70 | IncludeFragmentPrototype.attributeChangedCallback = function(attrName) {
|
67 | 71 | if (attrName === 'src') {
|
68 | 72 | // Reload data load cache.
|
69 |
| - var data = getData(this); |
| 73 | + const data = getData(this) |
70 | 74 |
|
71 | 75 | // Source changed after attached so replace element.
|
72 | 76 | if (this._attached) {
|
73 |
| - handleData(this, data); |
| 77 | + handleData(this, data) |
74 | 78 | }
|
75 | 79 | }
|
76 |
| - }; |
| 80 | + } |
77 | 81 |
|
78 | 82 | IncludeFragmentPrototype.createdCallback = function() {
|
79 | 83 | // Preload data cache
|
80 | 84 | getData(this)['catch'](function() {
|
81 | 85 | // Ignore `src missing` error on pre-load.
|
82 |
| - }); |
83 |
| - }; |
| 86 | + }) |
| 87 | + } |
84 | 88 |
|
85 | 89 | IncludeFragmentPrototype.attachedCallback = function() {
|
86 |
| - this._attached = true; |
| 90 | + this._attached = true |
87 | 91 | if (this.src) {
|
88 |
| - handleData(this, getData(this)); |
| 92 | + handleData(this, getData(this)) |
89 | 93 | }
|
90 |
| - }; |
| 94 | + } |
91 | 95 |
|
92 | 96 | IncludeFragmentPrototype.detachedCallback = function() {
|
93 |
| - this._attached = false; |
94 |
| - }; |
| 97 | + this._attached = false |
| 98 | + } |
95 | 99 |
|
96 | 100 | IncludeFragmentPrototype.request = function() {
|
97 |
| - var src = this.src; |
| 101 | + const src = this.src |
98 | 102 | if (!src) {
|
99 |
| - throw new Error('missing src'); |
| 103 | + throw new Error('missing src') |
100 | 104 | }
|
101 | 105 |
|
102 | 106 | return new Request(src, {
|
103 | 107 | method: 'GET',
|
104 | 108 | credentials: 'same-origin',
|
105 | 109 | headers: {
|
106 |
| - 'Accept': 'text/html' |
| 110 | + Accept: 'text/html' |
107 | 111 | }
|
108 |
| - }); |
109 |
| - }; |
| 112 | + }) |
| 113 | + } |
110 | 114 |
|
111 | 115 | IncludeFragmentPrototype.load = function() {
|
112 |
| - var self = this; |
113 |
| - |
114 |
| - return Promise.resolve().then(function() { |
115 |
| - var request = self.request(); |
116 |
| - fire('loadstart', self); |
117 |
| - return self.fetch(request); |
118 |
| - }).then(function(response) { |
119 |
| - if (response.status !== 200) { |
120 |
| - throw new Error('Failed to load resource: ' + |
121 |
| - 'the server responded with a status of ' + response.status); |
122 |
| - } |
123 |
| - |
124 |
| - var ct = response.headers.get('Content-Type'); |
125 |
| - if (!ct || !ct.match(/^text\/html/)) { |
126 |
| - throw new Error('Failed to load resource: ' + |
127 |
| - 'expected text/html but was ' + ct); |
128 |
| - } |
129 |
| - |
130 |
| - return response; |
131 |
| - }).then(function(response) { |
132 |
| - return response.text(); |
133 |
| - }).then(function(data) { |
134 |
| - fire('load', self); |
135 |
| - fire('loadend', self); |
136 |
| - return data; |
137 |
| - }, function(error) { |
138 |
| - fire('error', self); |
139 |
| - fire('loadend', self); |
140 |
| - throw error; |
141 |
| - }); |
142 |
| - }; |
| 116 | + const self = this |
| 117 | + |
| 118 | + return Promise.resolve() |
| 119 | + .then(function() { |
| 120 | + const request = self.request() |
| 121 | + fire('loadstart', self) |
| 122 | + return self.fetch(request) |
| 123 | + }) |
| 124 | + .then(function(response) { |
| 125 | + if (response.status !== 200) { |
| 126 | + throw new Error(`Failed to load resource: the server responded with a status of ${response.status}`) |
| 127 | + } |
| 128 | + |
| 129 | + const ct = response.headers.get('Content-Type') |
| 130 | + if (!ct || !ct.match(/^text\/html/)) { |
| 131 | + throw new Error(`Failed to load resource: expected text/html but was ${ct}`) |
| 132 | + } |
| 133 | + |
| 134 | + return response |
| 135 | + }) |
| 136 | + .then(function(response) { |
| 137 | + return response.text() |
| 138 | + }) |
| 139 | + .then( |
| 140 | + function(data) { |
| 141 | + fire('load', self) |
| 142 | + fire('loadend', self) |
| 143 | + return data |
| 144 | + }, |
| 145 | + function(error) { |
| 146 | + fire('error', self) |
| 147 | + fire('loadend', self) |
| 148 | + throw error |
| 149 | + } |
| 150 | + ) |
| 151 | + } |
143 | 152 |
|
144 | 153 | IncludeFragmentPrototype.fetch = function(request) {
|
145 |
| - return fetch(request); |
146 |
| - }; |
| 154 | + return fetch(request) |
| 155 | + } |
147 | 156 |
|
148 | 157 | window.IncludeFragmentElement = document.registerElement('include-fragment', {
|
149 | 158 | prototype: IncludeFragmentPrototype
|
150 |
| - }); |
151 |
| -})(); |
| 159 | + }) |
| 160 | +})() |
0 commit comments