Fix loading custom logo

This commit is contained in:
Julia Radzhabova 2019-07-22 17:32:10 +03:00
parent 94a9b6a671
commit 147c0a56e1
3 changed files with 21 additions and 27 deletions

View file

@ -48,12 +48,10 @@
height: 20px; height: 20px;
} }
.loadmask > .brendpanel .loading-logo > i { .loadmask > .brendpanel .loading-logo > img {
display: inline-block; display: inline-block;
width: 86px; max-width: 100px;
height: 20px; max-height: 20px;
background: url('../../common/main/resources/img/header/header-logo.png') no-repeat;
background-size: contain;
opacity: 0; opacity: 0;
} }
@ -171,7 +169,7 @@
var params = getUrlParams(), var params = getUrlParams(),
lang = (params["lang"] || 'en').split(/[\-\_]/)[0], lang = (params["lang"] || 'en').split(/[\-\_]/)[0],
logo = params["headerlogo"] ? 'url(' + encodeUrlParam(params["headerlogo"]) + ')' : null; logo = params["headerlogo"] ? encodeUrlParam(params["headerlogo"]) : null;
window.frameEditorId = params["frameEditorId"]; window.frameEditorId = params["frameEditorId"];
</script> </script>
@ -181,16 +179,16 @@
<!-- debug end --> <!-- debug end -->
</head> </head>
<body> <body>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><i></i></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="spacer"></div><div class="rect"></div></div><div><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><div class="spacer"></div><span class="circle"></span><span class="circle"></span><span class="circle"></span></div></div><div class="placeholder"><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div></div></div> <div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><img src="../../common/main/resources/img/header/header-logo.png"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="spacer"></div><div class="rect"></div></div><div><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><div class="spacer"></div><span class="circle"></span><span class="circle"></span><span class="circle"></span></div></div><div class="placeholder"><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div></div></div>
<div id="viewport"></div> <div id="viewport"></div>
<script> <script>
if (stopLoading) { if (stopLoading) {
document.body.removeChild(document.getElementById('loading-mask')); document.body.removeChild(document.getElementById('loading-mask'));
} else { } else {
var elem = document.querySelector('.loading-logo i'); var elem = document.querySelector('.loading-logo img');
if (elem) { if (elem) {
logo && (elem.style.backgroundImage = logo); logo && (elem.setAttribute('src', logo));
elem.style.opacity = 1; elem.style.opacity = 1;
} }
} }

View file

@ -43,12 +43,10 @@
height: 20px; height: 20px;
} }
.loadmask > .brendpanel .loading-logo > i { .loadmask > .brendpanel .loading-logo > img {
display: inline-block; display: inline-block;
width: 86px; max-width: 100px;
height: 20px; max-height: 20px;
background: url('../../common/main/resources/img/header/header-logo.png') no-repeat;
background-size: contain;
opacity: 0; opacity: 0;
} }
@ -189,7 +187,7 @@
var params = getUrlParams(), var params = getUrlParams(),
lang = (params["lang"] || 'en').split(/[\-\_]/)[0], lang = (params["lang"] || 'en').split(/[\-\_]/)[0],
logo = params["headerlogo"] ? 'url(' + encodeUrlParam(params["headerlogo"]) + ')' : null; logo = params["headerlogo"] ? encodeUrlParam(params["headerlogo"]) : null;
window.frameEditorId = params["frameEditorId"]; window.frameEditorId = params["frameEditorId"];
</script> </script>
@ -199,16 +197,16 @@
<!-- debug end --> <!-- debug end -->
</head> </head>
<body> <body>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><i></i></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="spacer"></div><div class="rect"></div></div><div><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><div class="spacer"></div><span class="circle"></span><span class="circle"></span><span class="circle"></span></div></div><div class="placeholder"><div class="slide-h"><div class="slide-v"><div class="slide-container"><div class="line"></div><div class="line"></div></div></div></div></div></div> <div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><img src="../../common/main/resources/img/header/header-logo.png"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="spacer"></div><div class="rect"></div></div><div><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><div class="spacer"></div><span class="circle"></span><span class="circle"></span><span class="circle"></span></div></div><div class="placeholder"><div class="slide-h"><div class="slide-v"><div class="slide-container"><div class="line"></div><div class="line"></div></div></div></div></div></div>
<div id="viewport"></div> <div id="viewport"></div>
<script> <script>
if (stopLoading) { if (stopLoading) {
document.body.removeChild(document.getElementById('loading-mask')); document.body.removeChild(document.getElementById('loading-mask'));
} else { } else {
var elem = document.querySelector('.loading-logo i'); var elem = document.querySelector('.loading-logo img');
if (elem) { if (elem) {
logo && (elem.style.backgroundImage = logo); logo && (elem.setAttribute('src', logo));
elem.style.opacity = 1; elem.style.opacity = 1;
} }
} }

View file

@ -42,12 +42,10 @@
height: 20px; height: 20px;
} }
.loadmask > .brendpanel .loading-logo > i { .loadmask > .brendpanel .loading-logo > img {
display: inline-block; display: inline-block;
width: 86px; max-width: 100px;
height: 20px; max-height: 20px;
background: url('../../common/main/resources/img/header/header-logo.png') no-repeat;
background-size: contain;
opacity: 0; opacity: 0;
} }
@ -178,7 +176,7 @@
var params = getUrlParams(), var params = getUrlParams(),
lang = (params["lang"] || 'en').split(/[\-\_]/)[0], lang = (params["lang"] || 'en').split(/[\-\_]/)[0],
logo = params["headerlogo"] ? 'url(' + encodeUrlParam(params["headerlogo"]) + ')' : null; logo = params["headerlogo"] ? encodeUrlParam(params["headerlogo"]) : null;
window.frameEditorId = params["frameEditorId"]; window.frameEditorId = params["frameEditorId"];
</script> </script>
@ -190,16 +188,16 @@
<!-- debug end --> <!-- debug end -->
</head> </head>
<body> <body>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><i></i></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="spacer"></div><div class="rect"></div></div><div><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><div class="spacer"></div><span class="circle"></span><span class="circle"></span><span class="circle"></span></div></div><div class="placeholder"><div class="columns"></div><div class="columns"></div></div></div> <div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><img src="../../common/main/resources/img/header/header-logo.png"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="circle"></div><div class="spacer"></div><div class="rect"></div></div><div><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><span class="rect"></span><div class="spacer"></div><span class="circle"></span><span class="circle"></span><span class="circle"></span></div></div><div class="placeholder"><div class="columns"></div><div class="columns"></div></div></div>
<div id="viewport"></div> <div id="viewport"></div>
<script> <script>
if (stopLoading) { if (stopLoading) {
document.body.removeChild(document.getElementById('loading-mask')); document.body.removeChild(document.getElementById('loading-mask'));
} else { } else {
var elem = document.querySelector('.loading-logo i'); var elem = document.querySelector('.loading-logo img');
if (elem) { if (elem) {
logo && (elem.style.backgroundImage = logo); logo && (elem.setAttribute('src', logo));
elem.style.opacity = 1; elem.style.opacity = 1;
} }
} }