Switch to template for popup preview (easier integration)

This commit is contained in:
jdescottes
2015-03-03 23:36:12 +01:00
parent bcecd3058b
commit fe95abca0f
3 changed files with 12 additions and 19 deletions

View File

@@ -76,6 +76,7 @@
<iframe src="templates/cheatsheet.html" onload="iframeloader.onLoad(event)" data-iframe-loader="display"></iframe>
<iframe src="templates/misc-templates.html" onload="iframeloader.onLoad(event)" data-iframe-loader="display"></iframe>
<iframe src="templates/popup-preview.html" onload="iframeloader.onLoad(event)" data-iframe-loader="display"></iframe>
<script type="text/javascript" src="piskel-boot.js"></script>
<!--body-main-end-->

View File

@@ -18,7 +18,9 @@
ns.PopupPreviewController.prototype.open = function () {
if (!this.isOpen()) {
this.popup = window.open('/popup-preview.html', '', 'width=320,height=320');
this.popup = window.open('about:blank', '', 'width=320,height=320');
this.popup.document.body.innerHTML = pskl.utils.Template.get('popup-preview-partial');
window.setTimeout(this.onPopupLoaded.bind(this), 500);
}
};

View File

@@ -1,8 +1,6 @@
<!doctype html>
<html>
<head>
<div style="display:none">
<script type="text/template" id="popup-preview-partial">
<style>
body,
.popup-container ,
.preview-container,
@@ -39,36 +37,28 @@
.light-picker-background,
.light-canvas-background .canvas-background {
background: url(../img/canvas_background/light_canvas_background.png) repeat;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAgCAMAAADdXFNzAAAABlBMVEXf39////8zI3BgAAAAHUlEQVR4AWNghAAGKGBE4w93eXTxkcYf2fE/Gv8A3C0B8ZfvECMAAAAASUVORK5CYII=) repeat;
}
.medium-picker-background,
.medium-canvas-background .canvas-background {
background: url(../img/canvas_background/medium_canvas_background.png) repeat;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAF0AAABhCAMAAACDF10nAAAABlBMVEW6urr///82MBGFAAAAVElEQVR42u3UIRIAMAgEsfL/T9eAqajBnAiOgYncM1M9z7470+lhen3/lmc6PUtXArq+KwFd33WGru86Q9d3naHrO52u73S6vtPp+k6n6zudntD3CycwEZ5PT1TIAAAAAElFTkSuQmCC) repeat;
}
.lowcont-medium-picker-background,
.lowcont-medium-canvas-background .canvas-background {
background: url(../img/canvas_background/lowcont_medium_canvas_background.png) repeat;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAAwCAMAAAC2edPQAAAACVBMVEXV1dXb29v///8dwgMCAAAAMElEQVR4AWNghAAGKGBE46Nzqap+VD0hdYzoXOqqH1U/MtPnaPofVT+a/kfT/6h6AMwdBGmkql8KAAAAAElFTkSuQmCC) repeat;
}
.lowcont-dark-picker-background,
.lowcont-dark-canvas-background .canvas-background {
background: url(../img/canvas_background/lowcont_dark_canvas_background.png) repeat;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAF0AAABhCAMAAACDF10nAAAACVBMVEVMTExVVVX///8WgdEBAAAAVElEQVR42u3UIRIAMAgEsfL/T9eAqajBnAiOgYncM1M9z7470+lhen3/lmc6PUtXArq+KwFd33WGru86Q9d3naHrO52u73S6vtPp+k6n6zudntD3CycwEZ5PT1TIAAAAAElFTkSuQmCC) repeat;
}
</style>
<title>Preview</title>
</head>
<body>
<div class="popup-container lowcont-dark-canvas-background ">
<div class="preview-container canvas-container">
<div class="canvas-background"></div>
</div>
</div>
<script type="text/javascript">
window.addEventListener('load', function () {
window.opener.pskl.app.previewController.popupPreviewController.onPopupLoaded()
});
</script>
</body>
</html>
</script>
</div>