Update Shell

This commit is contained in:
Bruce
2025-11-21 12:55:08 +08:00
parent 1674f2c35b
commit ae3771bfdb
33 changed files with 972 additions and 78 deletions

View File

@@ -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">

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 KiB

View File

@@ -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;

View File

@@ -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">&#57543;</span>&nbsp;
<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">&#57543;</span>&nbsp;<span class="status">Installing... 0%</span>
<span class="ring-loading">&#57543;</span>&nbsp;<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>

View File

@@ -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);

View File

@@ -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
View 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
View 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;
}
}
}
}
};
})();

View File

@@ -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);

View 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 = "";
}
}
}
}
};
})();