Skip to content

Commit 96d22a3

Browse files
committed
use event delegation on run button
1 parent df6865a commit 96d22a3

File tree

1 file changed

+39
-37
lines changed

1 file changed

+39
-37
lines changed

index.js

Lines changed: 39 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -130,47 +130,49 @@ module.exports = function() {
130130
if (hasRunBtn) {
131131
var btn = document.createElement("button");
132132
btn.innerHTML = "Run";
133-
btn.addEventListener('click', function() {
134-
135-
if (!demoWrapper && matches.call(env.element.parentNode, 'pre')) {
136-
var language = env.language;
137-
var text = env.code;
138-
var data = types[language](text);
139-
if (data.js) {
140-
data.js = data.js.trim();
141-
}
142-
if (data.html) {
143-
data.html = data.html.trim();
133+
document.body.addEventListener('click', function (ev) {
134+
ev.stopPropagation();
135+
if (ev.target === btn) {
136+
if (!demoWrapper && matches.call(env.element.parentNode, 'pre')) {
137+
var language = env.language;
138+
var text = env.code;
139+
var data = types[language](text);
140+
if (data.js) {
141+
data.js = data.js.trim();
142+
}
143+
if (data.html) {
144+
data.html = data.html.trim();
145+
}
146+
if (data) {
147+
cleanCodePenData(data);
148+
if (window.CREATE_CODE_PEN) {
149+
CREATE_CODE_PEN(data);
150+
} else {
151+
createCodePen(data);
152+
}
153+
} else {
154+
console.warn('Unable to create a codepen for this demo');
155+
}
144156
}
145-
if (data) {
146-
cleanCodePenData(data);
157+
if (demoWrapper && matches.call(demoWrapper, '.demo_wrapper')) {
158+
var htmlCode = demoWrapper.querySelector('[data-for=html] code');
159+
var htmlText = htmlCode ? htmlCode.textContent.trim() : '';
160+
var jsCode = demoWrapper.querySelector('[data-for=js] code');
161+
var jsText = jsCode ? jsCode.textContent.trim() : '';
162+
var cssText = getStylesFromIframe(demoWrapper.querySelector('iframe'));
163+
var codePen = {
164+
html: htmlText,
165+
js: jsText,
166+
js_module: true,
167+
editors: '1011',
168+
css: cssText.trim()
169+
};
170+
cleanCodePenData(codePen);
147171
if (window.CREATE_CODE_PEN) {
148-
CREATE_CODE_PEN(data);
172+
CREATE_CODE_PEN(codePen);
149173
} else {
150-
createCodePen(data);
174+
createCodePen(codePen);
151175
}
152-
} else {
153-
console.warn('Unable to create a codepen for this demo');
154-
}
155-
}
156-
if (demoWrapper && matches.call(demoWrapper, '.demo_wrapper')) {
157-
var htmlCode = demoWrapper.querySelector('[data-for=html] code');
158-
var htmlText = htmlCode ? htmlCode.textContent.trim() : '';
159-
var jsCode = demoWrapper.querySelector('[data-for=js] code');
160-
var jsText = jsCode ? jsCode.textContent.trim() : '';
161-
var cssText = getStylesFromIframe(demoWrapper.querySelector('iframe'));
162-
var codePen = {
163-
html: htmlText,
164-
js: jsText,
165-
js_module: true,
166-
editors: '1011',
167-
css: cssText.trim()
168-
};
169-
cleanCodePenData(codePen);
170-
if (window.CREATE_CODE_PEN) {
171-
CREATE_CODE_PEN(codePen);
172-
} else {
173-
createCodePen(codePen);
174176
}
175177
}
176178
});

0 commit comments

Comments
 (0)