Update Shell
@@ -1,10 +1,11 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<resources>
|
||||
<resource id="splash">
|
||||
<scale dpi="100">splash\SplashScreen.scale-100.png</scale>
|
||||
<scale dpi="125">splash\SplashScreen.scale-125.png</scale>
|
||||
<scale dpi="150">splash\SplashScreen.scale-150.png</scale>
|
||||
<scale dpi="200">splash\SplashScreen.scale-200.png</scale>
|
||||
<scale dpi="100">splash\AppPackageSplashScreen.scale-100.png</scale>
|
||||
<scale dpi="125">splash\AppPackageSplashScreen.scale-125.png</scale>
|
||||
<scale dpi="150">splash\AppPackageSplashScreen.scale-150.png</scale>
|
||||
<scale dpi="200">splash\AppPackageSplashScreen.scale-200.png</scale>
|
||||
<scale dpi="400">splash\AppPackageSplashScreen.scale-200.png</scale>
|
||||
<scale dpi="default">SplashScreen.png</scale>
|
||||
</resource>
|
||||
<resource id="splashlarge">
|
||||
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 3.4 KiB |
@@ -65,7 +65,7 @@ body * {
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.page.splash progress.win-ring {
|
||||
.page.splash .content.splash progress.win-ring {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: 32px;
|
||||
@@ -74,6 +74,12 @@ body * {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.page.splash .content.splash progress {
|
||||
border-style: none;
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.page.splash>.content {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
|
||||
@@ -15,31 +15,49 @@
|
||||
<script type="text/javascript" src="js/promise.js"></script>
|
||||
<script type="text/javascript" src="js/bridge.js"></script>
|
||||
<script type="text/javascript" src="js/dpimodes.js"></script>
|
||||
<script type="text/javascript" src="js/resources.js"></script>
|
||||
<script type="text/javascript" src="js/animation.js"></script>
|
||||
<link rel="stylesheet" href="fonts/fonts.css">
|
||||
<link rel="stylesheet" href="css/pages.css">
|
||||
<script type="text/javascript" src="js/event.js"></script>
|
||||
<script type="text/javascript" src="js/pages.js"></script>
|
||||
<script type="text/javascript" src="js/load.js"></script>
|
||||
<script type="text/javascript" src="js/init.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="page-container" class="pagecontainer full">
|
||||
<div class="page preinstall">
|
||||
<div class="page splash">
|
||||
<!-- Splash Screen -->
|
||||
<img class="splash" src="images/splash.default.png" alt="Splash Screen">
|
||||
<img class="splash" src="images/splash.default.png" alt="Splash Screen" width="620" height="300">
|
||||
<div class="content splash">
|
||||
<progress class="win-ring"></progress>
|
||||
</div>
|
||||
<script>
|
||||
(function() {
|
||||
"use strict";
|
||||
var img = document.querySelector(".pagecontainer .page img.splash");
|
||||
if (img) img.src = Bridge.UI.Splash.imageurl;
|
||||
var progress = document.querySelector(".pagecontainer .page .content.splash progress");
|
||||
if (Bridge.Frame.WindowSize.height / Bridge.UI.dpi < 500) {
|
||||
if (progress.classList.contains("win-ring")) progress.classList.remove("win-ring");
|
||||
} else progress.classList.add("win-ring");
|
||||
var splashpage = document.querySelector(".pagecontainer .page.splash");
|
||||
if (splashpage) {
|
||||
splashpage.style.backgroundColor = Bridge.UI.Splash.backcolor;
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<!-- Loading... -->
|
||||
<div class="content loading">
|
||||
<span class="ring-loading"></span>
|
||||
<span>请稍候...</span>
|
||||
<span data-res-byname="IDS_PLEASEWAIT">Please wait...</span>
|
||||
</div>
|
||||
<!-- Main Page -->
|
||||
<div class="content select preinstall installing installsuccess installfailed">
|
||||
<div style="width: 100%; box-sizing: border-box;" class="currentfile multiple">
|
||||
<h1 class="win-type-x-large">有多个包将要安装</h1><br />
|
||||
<label for="select-package" class="win-label">在这里请选择一个包查看信息。</label><br />
|
||||
<h1 class="win-type-x-large" data-res-byname="IDS_PREINSTALL_MTTITLE"></h1>
|
||||
<label for="select-package" class="win-label" data-res-byname="IDS_PREINSTALL_MSELECT">在这里请选择一个包查看信息。</label><br />
|
||||
<select id="select-package"></select><br />
|
||||
</div>
|
||||
<div class="storelogo">
|
||||
@@ -47,18 +65,18 @@
|
||||
<img src="images/splash.default.png" alt="App Store Logo">
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="win-type-x-large pkgtitle">Install {Package Title}?</h1>
|
||||
<p class="pkgtitle multiple">{Package Title}</p>
|
||||
<p>Microsoft Store Application</p>
|
||||
<p class="pkgpublisher">Publisher: {Package Publisher}</p>
|
||||
<p class="pkgversion"> Version: {Package Version}</p><br />
|
||||
<p class="pkgfunctions-label"><span>Functions</span>: </p>
|
||||
<h1 class="win-type-x-large pkgtitle" data-res-byname="IDS_PREINSTALL_TITLE"></h1>
|
||||
<p class="pkgtitle multiple" data-res-byname="IDS_PREINSTALL_MPKGNAME"></p>
|
||||
<p data-res-byname="IDS_MSAPP"></p>
|
||||
<p class="pkgpublisher" data-res-byname="IDS_PUBLISHER"></p>
|
||||
<p class="pkgversion" data-res-byname="IDS_VERSION"></p><br />
|
||||
<p class="pkgfunctions-label" data-res-byname="IDS_FUNCTIONNAME"></p>
|
||||
<div class="functions">
|
||||
<ul>
|
||||
<li>使用全部的系统资源</li>
|
||||
</ul>
|
||||
</div>
|
||||
<a class="moreinfo">更多信息</a>
|
||||
<a class="moreinfo" data-res-byname="IDS_MOREINFO"></a>
|
||||
<script>
|
||||
(function() {
|
||||
"use strict";
|
||||
@@ -87,24 +105,25 @@
|
||||
</div>
|
||||
<div class="progress installing">
|
||||
<div>
|
||||
<span class="ring-loading"></span> <span class="status">Installing... 0%</span>
|
||||
<span class="ring-loading"></span> <span class="status" data-res-byname="IDS_INSTALLING_SLOADING"></span>
|
||||
</div>
|
||||
<progress min="0" max="100" value="50" class="win-progress-bar"></progress>
|
||||
</div>
|
||||
<div class="reason installfailed">
|
||||
<p><span>Reason</span>: </p>
|
||||
<p data-res-byname="IDS_FAILED_REASONNAME"></p>
|
||||
<textarea class="win-textarea" readonly></textarea>
|
||||
</div>
|
||||
<div class="controls select preinstall installing installsuccess installfailed">
|
||||
<div class="checkbox">
|
||||
<input type="checkbox" id="preinst-enablelaunch" class="win-checkbox">
|
||||
<label for="preinst-enablelaunch">Launch app after installation</label>
|
||||
<label for="preinst-enablelaunch" data-res-byname="IDS_LAUNCHWHENREADY"></label>
|
||||
</div>
|
||||
<div class="command">
|
||||
<button>Install</button>
|
||||
<button>Cancel</button>
|
||||
<button data-res-byname="IDS_PREINSTALL_TINSTALL"></button>
|
||||
<button data-res-byname="IDS_PREINSTALL_CANCEL"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div data-win-control="WinJS.UI.Flyout" id="moreinfo-flyout"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
@@ -12,7 +12,13 @@
|
||||
isIe10: function() { return ext.IEFrame.Version === 10; },
|
||||
isIe11: function() { return ext.IEFrame.Version === 11; }
|
||||
},
|
||||
UI: {},
|
||||
UI: {
|
||||
Splash: {
|
||||
show: function() { ext.System.UI.ShowSplash(); },
|
||||
fadeAway: function() { ext.System.UI.FadeAwaySplash(); },
|
||||
fadeOut: function() { ext.System.UI.FadeOutSplash(); }
|
||||
}
|
||||
},
|
||||
String: {
|
||||
trim: function(str) { return ext.String.Trim(str); },
|
||||
tolower: function(str) { return ext.String.ToLower(str); },
|
||||
@@ -23,8 +29,14 @@
|
||||
compare: function(str1, str2) { return ext.String.NString.Compare(str1, str2); },
|
||||
empty: function(str) { return ext.String.NString.Empty(str); },
|
||||
length: function(str) { return ext.String.NString.Length(str); },
|
||||
},
|
||||
Resources: {
|
||||
byname: function(resname) { return ext.System.Resources.GetByName(resname); },
|
||||
byid: function(resid) { return ext.System.Resources.GetById(resid); },
|
||||
nameToId: function(resname) { return ext.System.Resources.ToId(resname); },
|
||||
idToName: function(resid) { return ext.System.Resources.ToName(resid); },
|
||||
}
|
||||
}
|
||||
};
|
||||
Object.defineProperty(global.Bridge.Frame, "scale", {
|
||||
get: function() { return ext.IEFrame.Scale; },
|
||||
set: function(value) { ext.IEFrame.Scale = value; return ext.IEFrame.Scale; }
|
||||
@@ -32,10 +44,24 @@
|
||||
Object.defineProperty(global.Bridge.Frame, "version", {
|
||||
get: function() { return ext.IEFrame.Version; },
|
||||
});
|
||||
Object.defineProperty(global.Bridge.Frame, "WindowSize", {
|
||||
get: function() { return ext.System.UI.WndSize; },
|
||||
});
|
||||
Object.defineProperty(global.Bridge.Frame, "ClientSize", {
|
||||
get: function() { return ext.System.UI.ClientSize; },
|
||||
});
|
||||
Object.defineProperty(global.Bridge.UI, "dpiPercent", {
|
||||
get: function() { return ext.System.UI.DPIPercent; }
|
||||
});
|
||||
Object.defineProperty(global.Bridge.UI, "dpi", {
|
||||
get: function() { return ext.System.UI.DPI; }
|
||||
});
|
||||
Object.defineProperty(global.Bridge.UI.Splash, "backcolor", {
|
||||
get: function() { return ext.System.UI.SplashBackgroundColor; },
|
||||
});
|
||||
Object.defineProperty(global.Bridge.UI.Splash, "imageurl", {
|
||||
get: function() { return ext.System.UI.SplashImage; },
|
||||
});
|
||||
|
||||
|
||||
})(this);
|
||||
@@ -24,21 +24,21 @@
|
||||
break;
|
||||
}
|
||||
var images = document.getElementsByTagName('img');
|
||||
for (var i = 0; i < images.length; i++) {
|
||||
var img = images[i];
|
||||
var parent = img.parentElement;
|
||||
if (!parent) continue;
|
||||
var parentWidth = parent.offsetWidth;
|
||||
var parentHeight = parent.offsetHeight;
|
||||
var scaledWidth = img.naturalWidth * dpiValue;
|
||||
var scaledHeight = img.naturalHeight * dpiValue;
|
||||
if (scaledWidth > parentWidth || scaledHeight > parentHeight) {
|
||||
img.style.transform = 'none';
|
||||
} else {
|
||||
img.style.transform = 'scale(' + dpiValue + ')';
|
||||
}
|
||||
// console.log('Image:', img, 'Parent Size:', parentWidth, parentHeight, 'Scaled:', scaledWidth, scaledHeight, 'Transform:', img.style.transform);
|
||||
}
|
||||
/* for (var i = 0; i < images.length; i++) {
|
||||
var img = images[i];
|
||||
var parent = img.parentElement;
|
||||
if (!parent) continue;
|
||||
var parentWidth = parent.offsetWidth;
|
||||
var parentHeight = parent.offsetHeight;
|
||||
var scaledWidth = img.naturalWidth * dpiValue;
|
||||
var scaledHeight = img.naturalHeight * dpiValue;
|
||||
if (scaledWidth > parentWidth || scaledHeight > parentHeight) {
|
||||
img.style.transform = 'none';
|
||||
} else {
|
||||
img.style.transform = 'scale(' + dpiValue + ')';
|
||||
}
|
||||
// console.log('Image:', img, 'Parent Size:', parentWidth, parentHeight, 'Scaled:', scaledWidth, scaledHeight, 'Transform:', img.style.transform);
|
||||
} */
|
||||
if (IsIeVersionElder && IsIeVersionElder()) {
|
||||
var contentElements = document.getElementsByClassName('content');
|
||||
var controlElements = document.getElementsByClassName('control-column-bottom');
|
||||
|
||||
11
shared/html/js/init.js
Normal file
@@ -0,0 +1,11 @@
|
||||
(function(global) {
|
||||
"use strict";
|
||||
|
||||
function ready(e) {
|
||||
function nextstep() {
|
||||
Resources.processAll();
|
||||
}
|
||||
WinJS.UI.processAll().done(nextstep);
|
||||
}
|
||||
OnLoad.add(ready);
|
||||
})(this);
|
||||
40
shared/html/js/load.js
Normal file
@@ -0,0 +1,40 @@
|
||||
(function() {
|
||||
"use strict";
|
||||
var loaddelegate = [];
|
||||
loaddelegate.push(window.onload);
|
||||
var elderload = loaddelegate[0];
|
||||
|
||||
function onLoad(e) {
|
||||
for (var i = 0; i < loaddelegate.length; i++) {
|
||||
if (typeof loaddelegate[i] === "function") {
|
||||
loaddelegate[i](e);
|
||||
}
|
||||
}
|
||||
}
|
||||
window.onload = onLoad;
|
||||
module.exports = {
|
||||
OnLoad: {
|
||||
add: function(func) {
|
||||
if (typeof func === "function") {
|
||||
for (var i = 0; i < loaddelegate.length; i++) {
|
||||
if (!i) continue; // 第一个元素必须保留,因为其为原生的 onload 事件
|
||||
if (loaddelegate[i] === func) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
loaddelegate.push(func);
|
||||
}
|
||||
},
|
||||
remove: function(func) {
|
||||
if (!func) return;
|
||||
for (var i = 0; i < loaddelegate.length; i++) {
|
||||
if (!i) continue;
|
||||
if (loaddelegate[i] === func) {
|
||||
loaddelegate.splice(i, 1);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
})();
|
||||
@@ -9,6 +9,7 @@
|
||||
}
|
||||
var supportPageList = [
|
||||
"splash",
|
||||
"loading",
|
||||
"select",
|
||||
"preinstall",
|
||||
"installing",
|
||||
@@ -22,6 +23,8 @@
|
||||
"installfailed"
|
||||
];
|
||||
|
||||
var splashBackColor = "";
|
||||
|
||||
function setPage(swPageLabel, bIsMulti) {
|
||||
var page = getPage();
|
||||
swPageLabel = ("" + (swPageLabel || ""));
|
||||
@@ -32,6 +35,13 @@
|
||||
if (page.classList.contains(supportPageList[i])) page.classList.remove(supportPageList[i]);
|
||||
}
|
||||
}
|
||||
if (Bridge.NString.equals(swPageLabel, "splash")) {
|
||||
if (splashBackColor) {
|
||||
page.style.backgroundColor = splashBackColor;
|
||||
}
|
||||
} else {
|
||||
page.style.backgroundColor = "";
|
||||
}
|
||||
if (page.classList.contains("multiple")) page.classList.remove("multiple");
|
||||
for (var j = 0; j < supportMulPageList.length; j++) {
|
||||
if (Bridge.NString.equals(swPageLabel, supportMulPageList[j]) && bIsMulti) {
|
||||
@@ -60,6 +70,40 @@
|
||||
setPage(getPageLabel(), bIsMulti);
|
||||
}
|
||||
|
||||
function getSplashPage() {
|
||||
var page = document.querySelector(".page.splash");
|
||||
if (!page) return null;
|
||||
var ret = {};
|
||||
Object.defineProperty(ret, "background", {
|
||||
get: function() {
|
||||
var page = document.querySelector(".page.splash");
|
||||
return page.style.backgroundColor || splashBackColor;
|
||||
},
|
||||
set: function(value) {
|
||||
splashBackColor = value;
|
||||
var page = document.querySelector(".page.splash");
|
||||
if (page) page.style.backgroundColor = value;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(ret, "imagesrc", {
|
||||
get: function() {
|
||||
var splashimg = page.querySelector("img.splash");
|
||||
return splashimg.src;
|
||||
},
|
||||
set: function(value) {
|
||||
var splashimg = page.querySelector("img.splash");
|
||||
splashimg.src = value;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(ret, "content", {
|
||||
get: function() {
|
||||
var content = page.querySelector(".content.splash");
|
||||
return content;
|
||||
},
|
||||
});
|
||||
return ret;
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
Page: {}
|
||||
};
|
||||
@@ -71,4 +115,7 @@
|
||||
get: function() { return isMultiPage(); },
|
||||
set: function(bIsMulti) { setPage(getPageLabel(), bIsMulti); }
|
||||
});
|
||||
Object.defineProperty(Page, "splash", {
|
||||
get: function() { return getSplashPage(); }
|
||||
});
|
||||
})(this);
|
||||
40
shared/html/js/resources.js
Normal file
@@ -0,0 +1,40 @@
|
||||
(function() {
|
||||
"use strict";
|
||||
|
||||
function getAllNodesHasResource() {
|
||||
var allElements = document.body.getElementsByTagName('*');
|
||||
var result = [];
|
||||
for (var i = 0; i < allElements.length; i++) {
|
||||
var el = allElements[i];
|
||||
var tag = el.tagName.toLowerCase();
|
||||
if (tag === 'script' || tag === 'style' || tag === 'link') {
|
||||
continue;
|
||||
}
|
||||
var byName = el.getAttribute('data-res-byname');
|
||||
var byId = el.getAttribute('data-res-byid');
|
||||
if ((byName && !Bridge.NString.empty(byName)) || (byId && parseInt(byId, 10) > 0)) {
|
||||
result.push(el);
|
||||
}
|
||||
}
|
||||
|
||||
return result; // 返回符合条件的元素数组
|
||||
}
|
||||
module.exports = {
|
||||
Resources: {
|
||||
processAll: function() {
|
||||
var nodes = getAllNodesHasResource();
|
||||
for (var i = 0; i < nodes.length; i++) {
|
||||
if (nodes[i].hasAttribute('data-res-byname')) {
|
||||
var resName = nodes[i].getAttribute('data-res-byname');
|
||||
nodes[i].textContent = Bridge.Resources.byname(resName);
|
||||
} else if (nodes[i].hasAttribute('data-res-byid')) {
|
||||
var resId = parseInt(nodes[i].getAttribute('data-res-byid'), 10);
|
||||
nodes[i].textContent = Bridge.Resources.byid(resId);
|
||||
} else {
|
||||
nodes[i].textContent = "";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
})();
|
||||