mirror of
https://gitee.com/newgateway/vtj.git
synced 2026-06-20 09:23:34 +08:00
101 lines
3.0 KiB
HTML
101 lines
3.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
|
|
<meta http-equiv="Pragma" content="no-cache"/>
|
|
<meta http-equiv="Expires" content="0"/>
|
|
<title>VTJ dev</title>
|
|
<style>
|
|
#vtj-ide-loading {
|
|
width: 400px;
|
|
height: 100px;
|
|
position: fixed;
|
|
left:50%;
|
|
top: 50%;
|
|
transform: translate(-50%,-50%);
|
|
z-index: 9999;
|
|
border-radius: 4px;
|
|
background-color: rgba(255,255,255,0.7);
|
|
box-shadow: 0 0 10px rgba(0,0,0,0.2);
|
|
padding: 20px;
|
|
font-size: 12px;
|
|
box-sizing: border-box;
|
|
}
|
|
.vtj-ide-loading__bar {
|
|
height: 14px;
|
|
border-radius: 4px;
|
|
margin-top: 10px;
|
|
border: 1px solid #eee;
|
|
overflow: hidden;
|
|
}
|
|
.vtj-ide-loading__title {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
.vtj-ide-loading__value {
|
|
display: block;
|
|
height: 100%;
|
|
background-color: #409eff;
|
|
border-radius: 4px;
|
|
font-size: 0;
|
|
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app"></div>
|
|
<div id="vtj-ide-loading">
|
|
<div class="vtj-ide-loading__title"><span>正在加载资源.... </span><span id="vtj-ide-loading-count"></span></div>
|
|
<div class="vtj-ide-loading__bar">
|
|
<span class="vtj-ide-loading__value" id="vtj-ide-loading-value" style="width:0%"></span>
|
|
</div>
|
|
</div>
|
|
<script type="module" src="/src/ide.ts"></script>
|
|
<script>
|
|
var _hmt = _hmt || [];
|
|
(function() {
|
|
var hm = document.createElement("script");
|
|
hm.src = "https://hm.baidu.com/hm.js?ef1ba59d70b12a005a6058f563f634bb";
|
|
var s = document.getElementsByTagName("script")[0];
|
|
s.parentNode.insertBefore(hm, s);
|
|
})();
|
|
|
|
(function(){
|
|
var loading = document.querySelector('#vtj-ide-loading');
|
|
var countEl = document.querySelector('#vtj-ide-loading-count');
|
|
var valueEl = document.querySelector('#vtj-ide-loading-value');
|
|
var links = document.querySelectorAll('link,script');
|
|
var total = links.length;
|
|
var setValue = function(current) {
|
|
countEl.innerHTML = current + '/' +total;
|
|
valueEl.style.width = (current * 100 / total) + '%';
|
|
if(!total || current === total) {
|
|
setTimeout(function() {
|
|
loading.parentNode.removeChild(loading);
|
|
loading = null;
|
|
countEl = null;
|
|
valueEl = null;
|
|
}, 100);
|
|
}
|
|
}
|
|
|
|
var current = 0;
|
|
links.forEach(function(link) {
|
|
link.onload = function() {
|
|
++current;
|
|
setValue(current);
|
|
link.onload = null;
|
|
}
|
|
})
|
|
window.addEventListener('load',function() {
|
|
current = total
|
|
setValue(current)
|
|
});
|
|
|
|
})()
|
|
</script>
|
|
</body>
|
|
</html>
|