Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Fix skeleton loader (logo icon, presentation loader). Fix embedded mode on IE11.

Browse source
This commit is contained in:
Julia Radzhabova 2019-09-27 18:43:55 +03:00
parent 25f1f05bec
commit 1c83e503a9
22 changed files with 185 additions and 96 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/common/locale.js
View file

@ -121,7 +121,7 @@ Common.Locale = new(function() {
/* use fetch polifill if native method isn't supported */ /* use fetch polifill if native method isn't supported */
var polyfills = ['../vendor/fetch/fetch.umd']; var polyfills = ['../vendor/fetch/fetch.umd'];
if ( !window.Promise ) { if ( !window.Promise ) {
require(['../vendor/es6-promise/es6-promise.auto.min.js'], require(['../vendor/es6-promise/es6-promise.auto.min'],
function () { function () {
require(polyfills, _requireLang); require(polyfills, _requireLang);
}); });

2
apps/documenteditor/embed/index.html.deploy
View file

@ -214,7 +214,7 @@
<!--vendor--> <!--vendor-->
<script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script> <script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../../vendor/jquery.browser/dist/jquery.browser.min.js"></script> <script type="text/javascript" src="../../../vendor/jquery/jquery.browser.min.js"></script>
<script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.min.js"></script> <script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script> <script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script>
<script type="text/javascript" src="../../../vendor/xregexp/xregexp-all-min.js"></script> <script type="text/javascript" src="../../../vendor/xregexp/xregexp-all-min.js"></script>

2
apps/documenteditor/main/index.html.deploy
View file

@ -171,7 +171,7 @@
<link rel="stylesheet" type="text/css" href="../../../apps/documenteditor/main/resources/css/app.css"> <link rel="stylesheet" type="text/css" href="../../../apps/documenteditor/main/resources/css/app.css">
</head> </head>
<body> <body>
<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="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><img src="../../../apps/documenteditor/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>

2
apps/documenteditor/mobile/index.html.deploy
View file

@ -114,7 +114,7 @@
</style> </style>
</head> </head>
<body> <body>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="circle"></div><div class="loading-logo"><img src="../../common/mobile/resources/img/header/header-logo.png"></div><div class="circle"></div></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="circle"></div><div class="loading-logo"><img src="../../../apps/documenteditor/mobile/resources/img/header/header-logo.png"></div><div class="circle"></div></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>
<script type="text/javascript"> <script type="text/javascript">
var ua = navigator.userAgent; var ua = navigator.userAgent;

16
apps/presentationeditor/embed/index.html
View file

@ -82,7 +82,7 @@
display: flex; display: flex;
position: relative; position: relative;
flex-direction: column; flex-direction: column;
padding-bottom: 100%; padding-bottom: 90%;
} }
.loadmask > .placeholder .slide-container { .loadmask > .placeholder .slide-container {
@ -91,7 +91,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -100,15 +99,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
height: 10%;
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 50%; margin: 120px 80px 0;
margin: auto 35px;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -154,6 +157,7 @@
<div class="slide-v"> <div class="slide-v">
<div class="slide-container"> <div class="slide-container">
<div class="line"></div> <div class="line"></div>
<div class="line empty"></div>
<div class="line"></div> <div class="line"></div>
</div> </div>
</div> </div>

94
apps/presentationeditor/embed/index.html.deploy
View file

@ -62,18 +62,33 @@
} }
.loadmask > .placeholder { .loadmask > .placeholder {
background: #fbfbfb; background: #f5f5f5;
width: 100%; width: 100%;
height: 100%; height: 100%;
padding-top: 56px; padding-top: 32px;
} }
.loadmask > .placeholder > .line { .loadmask > .placeholder .slide-h {
height: 15px; display: flex;
margin: 30px; flex-direction: column;
background: #e2e2e2; justify-content: center;
overflow: hidden; flex-grow: 1;
width: 90%;
margin: 0 auto;
}
.loadmask > .placeholder .slide-v {
display: flex;
position: relative; position: relative;
flex-direction: column;
padding-bottom: 90%;
}
.loadmask > .placeholder .slide-container {
position: absolute;
height: 100%;
width: 100%;
background: #fbfbfb;
border: 1px solid #dfdfdf;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -81,25 +96,41 @@
animation: flickerAnimation 2s infinite ease-in-out; animation: flickerAnimation 2s infinite ease-in-out;
} }
.loadmask > .placeholder .slide-container > .line {
height: 20%;
margin: 0 120px;
border-radius: 6px;
background: #f5f5f5;
}
.loadmask > .placeholder .slide-container > .line.empty {
height: 10%;
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) {
margin: 120px 80px 0;
}
@keyframes flickerAnimation { @keyframes flickerAnimation {
0% { opacity:0.1; } 0% { opacity:1; }
50% { opacity:1; } 50% { opacity:0.3; }
100% { opacity:0.1; } 100% { opacity:1; }
} }
@-o-keyframes flickerAnimation{ @-o-keyframes flickerAnimation{
0% { opacity:0.1; } 0% { opacity:1; }
50% { opacity:1; } 50% { opacity:0.3; }
100% { opacity:0.1; } 100% { opacity:1; }
} }
@-moz-keyframes flickerAnimation{ @-moz-keyframes flickerAnimation{
0% { opacity:0.1; } 0% { opacity:1; }
50% { opacity:1; } 50% { opacity:0.3; }
100% { opacity:0.1; } 100% { opacity:1; }
} }
@-webkit-keyframes flickerAnimation{ @-webkit-keyframes flickerAnimation{
0% { opacity:0.1; } 0% { opacity:1; }
50% { opacity:1; } 50% { opacity:0.3; }
100% { opacity:0.1; } 100% { opacity:1; }
} }
</style> </style>
@ -109,7 +140,28 @@
</head> </head>
<body class="embed-body"> <body class="embed-body">
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="circle"></div><div class="brand-logo loading-logo"><img src=""></div><div class="circle"></div></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="circle"></div>
<div class="brand-logo loading-logo">
<img src="">
</div>
<div class="circle"></div>
</div>
</div>
<div class="placeholder">
<div class="slide-h">
<div class="slide-v">
<div class="slide-container">
<div class="line"></div>
<div class="line empty"></div>
<div class="line"></div>
</div>
</div>
</div>
</div>
</div>
<script> <script>
var userAgent = navigator.userAgent.toLowerCase(), var userAgent = navigator.userAgent.toLowerCase(),
@ -219,7 +271,7 @@
<!--vendor--> <!--vendor-->
<script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script> <script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../../vendor/jquery.browser/dist/jquery.browser.min.js"></script> <script type="text/javascript" src="../../../vendor/jquery/jquery.browser.min.js"></script>
<script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.min.js"></script> <script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script> <script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script>
<script type="text/javascript" src="../../../vendor/xregexp/xregexp-all-min.js"></script> <script type="text/javascript" src="../../../vendor/xregexp/xregexp-all-min.js"></script>

2
apps/presentationeditor/main/app/controller/Main.js
View file

@ -330,7 +330,7 @@ define([
Common.Utils.Metric.setDefaultMetric(Common.Utils.Metric.c_MetricUnits.inch); Common.Utils.Metric.setDefaultMetric(Common.Utils.Metric.c_MetricUnits.inch);
if (!this.editorConfig.customization || !(this.editorConfig.customization.loaderName || this.editorConfig.customization.loaderLogo)) if (!this.editorConfig.customization || !(this.editorConfig.customization.loaderName || this.editorConfig.customization.loaderLogo))
$('#editor_sdk').append('<div class="doc-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>'); $('#editor_sdk').append('<div class="doc-placeholder"><div class="slide-h"><div class="slide-v"><div class="slide-container"><div class="line"></div><div class="line empty"></div><div class="line"></div></div></div></div></div>');
Common.Controllers.Desktop.init(this.appOptions); Common.Controllers.Desktop.init(this.appOptions);
}, },

15
apps/presentationeditor/main/index.html
View file

@ -96,7 +96,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -105,15 +104,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 30%; height: 20%;
margin: auto 120px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 40%; height: 30%;
margin: auto 80px; margin: 120px 80px 0;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -192,7 +195,7 @@
<!-- debug end --> <!-- debug end -->
</head> </head>
<body> <body>
<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="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 empty"></div><div class="line"></div></div></div></div></div></div>
<div id="viewport"></div> <div id="viewport"></div>
<script> <script>

15
apps/presentationeditor/main/index.html.deploy
View file

@ -98,7 +98,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -107,15 +106,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 30%; height: 20%;
margin: auto 120px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 40%; height: 30%;
margin: auto 80px; margin: 120px 80px 0;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -198,7 +201,7 @@
<link rel="stylesheet" type="text/css" href="../../../apps/presentationeditor/main/resources/css/app.css"> <link rel="stylesheet" type="text/css" href="../../../apps/presentationeditor/main/resources/css/app.css">
</head> </head>
<body> <body>
<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="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><img src="../../../apps/presentationeditor/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 empty"></div><div class="line"></div></div></div></div></div></div>
<div id="viewport"></div> <div id="viewport"></div>
<script> <script>

15
apps/presentationeditor/main/index.reporter.html
View file

@ -85,7 +85,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -94,15 +93,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 30%; height: 20%;
margin: auto 120px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 40%; height: 30%;
margin: auto 80px; margin: 120px 80px 0;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -198,7 +201,7 @@
</style> </style>
</head> </head>
<body> <body>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><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="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 empty"></div><div class="line"></div></div></div></div></div></div>
<script> <script>
if (stopLoading) { if (stopLoading) {

15
apps/presentationeditor/main/index.reporter.html.deploy
View file

@ -85,7 +85,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -94,15 +93,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 30%; height: 20%;
margin: auto 120px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 40%; height: 30%;
margin: auto 80px; margin: 120px 80px 0;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -194,7 +197,7 @@
</style> </style>
</head> </head>
<body> <body>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><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="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 empty"></div><div class="line"></div></div></div></div></div></div>
<div id="viewport"></div> <div id="viewport"></div>
<script> <script>

13
apps/presentationeditor/main/resources/less/app.less
View file

@ -207,11 +207,10 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
> .line { > .line {
height: 30%; height: 20%;
margin: auto 120px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
@ -221,8 +220,12 @@
animation: flickerAnimation 2s infinite ease-in-out; animation: flickerAnimation 2s infinite ease-in-out;
&:nth-child(1) { &:nth-child(1) {
height: 40%; height: 30%;
margin: auto 80px; margin: 120px 80px 0;
}
&.empty {
background: transparent;
} }
} }
} }

2
apps/presentationeditor/mobile/app/controller/Main.js
View file

@ -220,7 +220,7 @@ define([
me.api.asc_setLocale(me.editorConfig.lang); me.api.asc_setLocale(me.editorConfig.lang);
if (!me.editorConfig.customization || !(me.editorConfig.customization.loaderName || me.editorConfig.customization.loaderLogo)) if (!me.editorConfig.customization || !(me.editorConfig.customization.loaderName || me.editorConfig.customization.loaderLogo))
$('#editor_sdk').append('<div class="doc-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>'); $('#editor_sdk').append('<div class="doc-placeholder"><div class="slide-h"><div class="slide-v"><div class="slide-container"><div class="line"></div><div class="line empty"></div><div class="line"></div></div></div></div></div>');
// if (this.appOptions.location == 'us' || this.appOptions.location == 'ca') // if (this.appOptions.location == 'us' || this.appOptions.location == 'ca')
// Common.Utils.Metric.setDefaultMetric(Common.Utils.Metric.c_MetricUnits.inch); // Common.Utils.Metric.setDefaultMetric(Common.Utils.Metric.c_MetricUnits.inch);

14
apps/presentationeditor/mobile/index.html
View file

@ -104,7 +104,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -113,15 +112,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 50%; height: 30%;
margin: auto 35px; margin: 120px 80px 0;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -162,6 +165,7 @@
<div class="slide-v"> <div class="slide-v">
<div class="slide-container"> <div class="slide-container">
<div class="line"></div> <div class="line"></div>
<div class="line empty"></div>
<div class="line"></div> <div class="line"></div>
</div> </div>
</div> </div>

16
apps/presentationeditor/mobile/index.html.deploy
View file

@ -103,7 +103,6 @@
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -112,15 +111,19 @@
} }
.loadmask > .placeholder .slide-container > .line { .loadmask > .placeholder .slide-container > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.loadmask > .placeholder .slide-container > .line.empty {
background: transparent;
}
.loadmask > .placeholder .slide-container > .line:nth-child(1) { .loadmask > .placeholder .slide-container > .line:nth-child(1) {
height: 50%; height: 30%;
margin: auto 35px; margin: 120px 80px 0;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
@ -151,7 +154,7 @@
<div> <div>
<div class="circle"></div> <div class="circle"></div>
<div class="loading-logo"> <div class="loading-logo">
<img src="../../common/mobile/resources/img/header/header-logo.png"> <img src="../../../apps/presentationeditor/mobile/resources/img/header/header-logo.png">
</div> </div>
<div class="circle"></div> <div class="circle"></div>
</div> </div>
@ -161,6 +164,7 @@
<div class="slide-v"> <div class="slide-v">
<div class="slide-container"> <div class="slide-container">
<div class="line"></div> <div class="line"></div>
<div class="line empty"></div>
<div class="line"></div> <div class="line"></div>
</div> </div>
</div> </div>

12
apps/presentationeditor/mobile/resources/css/app-ios.css
View file

@ -7055,19 +7055,21 @@ html.pixel-ratio-3 .numbers li {
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
-o-animation: flickerAnimation 2s infinite ease-in-out; -o-animation: flickerAnimation 2s infinite ease-in-out;
animation: flickerAnimation 2s infinite ease-in-out; animation: flickerAnimation 2s infinite ease-in-out;
} }
.doc-placeholder .slide-container > .line { .doc-placeholder .slide-container > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.doc-placeholder .slide-container > .line:nth-child(1) { .doc-placeholder .slide-container > .line:nth-child(1) {
height: 50%; height: 30%;
margin: auto 35px; margin: 120px 80px 0;
}
.doc-placeholder .slide-container > .line.empty {
background: transparent;
} }

12
apps/presentationeditor/mobile/resources/css/app-material.css
View file

@ -6875,19 +6875,21 @@ html.pixel-ratio-3 .numbers li {
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
-o-animation: flickerAnimation 2s infinite ease-in-out; -o-animation: flickerAnimation 2s infinite ease-in-out;
animation: flickerAnimation 2s infinite ease-in-out; animation: flickerAnimation 2s infinite ease-in-out;
} }
.doc-placeholder .slide-container > .line { .doc-placeholder .slide-container > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
} }
.doc-placeholder .slide-container > .line:nth-child(1) { .doc-placeholder .slide-container > .line:nth-child(1) {
height: 50%; height: 30%;
margin: auto 35px; margin: 120px 80px 0;
}
.doc-placeholder .slide-container > .line.empty {
background: transparent;
} }

13
apps/presentationeditor/mobile/resources/less/app-ios.less
View file

@ -281,7 +281,6 @@ input, textarea {
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -289,14 +288,18 @@ input, textarea {
animation: flickerAnimation 2s infinite ease-in-out; animation: flickerAnimation 2s infinite ease-in-out;
> .line { > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
&:nth-child(1) { &:nth-child(1) {
height: 50%; height: 30%;
margin: auto 35px; margin: 120px 80px 0;
}
&.empty {
background: transparent;
} }
} }
} }

13
apps/presentationeditor/mobile/resources/less/app-material.less
View file

@ -269,7 +269,6 @@ input, textarea {
width: 100%; width: 100%;
background: #fbfbfb; background: #fbfbfb;
border: 1px solid #dfdfdf; border: 1px solid #dfdfdf;
display: grid;
-webkit-animation: flickerAnimation 2s infinite ease-in-out; -webkit-animation: flickerAnimation 2s infinite ease-in-out;
-moz-animation: flickerAnimation 2s infinite ease-in-out; -moz-animation: flickerAnimation 2s infinite ease-in-out;
@ -277,14 +276,18 @@ input, textarea {
animation: flickerAnimation 2s infinite ease-in-out; animation: flickerAnimation 2s infinite ease-in-out;
> .line { > .line {
height: 40%; height: 20%;
margin: auto 60px; margin: 0 120px;
border-radius: 6px; border-radius: 6px;
background: #f5f5f5; background: #f5f5f5;
&:nth-child(1) { &:nth-child(1) {
height: 50%; height: 30%;
margin: auto 35px; margin: 120px 80px 0;
}
&.empty {
background: transparent;
} }
} }
} }

2
apps/spreadsheeteditor/embed/index.html.deploy
View file

@ -240,7 +240,7 @@
<!--vendor--> <!--vendor-->
<script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script> <script type="text/javascript" src="../../../vendor/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../../vendor/jquery.browser/dist/jquery.browser.min.js"></script> <script type="text/javascript" src="../../../vendor/jquery/jquery.browser.min.js"></script>
<script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.min.js"></script> <script type="text/javascript" src="../../../vendor/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script> <script type="text/javascript" src="../../../vendor/sockjs/sockjs.min.js"></script>
<script type="text/javascript" src="../../../vendor/underscore/underscore-min.js"></script> <script type="text/javascript" src="../../../vendor/underscore/underscore-min.js"></script>

2
apps/spreadsheeteditor/main/index.html.deploy
View file

@ -188,7 +188,7 @@
<link rel="stylesheet" type="text/css" href="../../../apps/spreadsheeteditor/main/resources/css/app.css"> <link rel="stylesheet" type="text/css" href="../../../apps/spreadsheeteditor/main/resources/css/app.css">
</head> </head>
<body> <body>
<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="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="loading-logo"><img src="../../../apps/spreadsheeteditor/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>

2
apps/spreadsheeteditor/mobile/index.html.deploy
View file

@ -132,7 +132,7 @@
<div> <div>
<div class="circle"></div> <div class="circle"></div>
<div class="loading-logo"> <div class="loading-logo">
<img src="../../common/mobile/resources/img/header/header-logo.png"> <img src="../../../apps/spreadsheeteditor/mobile/resources/img/header/header-logo.png">
</div> </div>
<div class="circle"></div> <div class="circle"></div>
</div> </div>