mirror of
https://github.com/modernw/App-Installer-For-Windows-8.x-Reset.git
synced 2026-04-11 17:57:19 +10:00
392 lines
13 KiB
HTML
392 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>App Launch List</title>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" type="text/css" href="libs/winjs/2.0/css/ui-light.css">
|
|
<script type="text/javascript" src="js/module.js"></script>
|
|
<script type="text/javascript" src="js/polyfill-ie.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/event.js"></script>
|
|
<script type="text/javascript" src="js/load.js"></script>
|
|
<script type="text/javascript" src="js/init.js"></script>
|
|
<style>
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
margin: 0;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
template {
|
|
display: none;
|
|
}
|
|
|
|
div [role=template] {
|
|
display: none;
|
|
}
|
|
|
|
* {
|
|
font-family: "Microsoft YaHei UI", "Microsoft YaHei", "Segoe UI", "Ebrima", "Nirmala", "Gadugi", "Segoe UI Emoji", "Segoe UI Symbol", "Meiryo", "Leelawadee", "Microsoft JhengHei", "Malgun Gothic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math", "Segoe UI Symbol";
|
|
}
|
|
|
|
.applist-font-title {
|
|
color: black;
|
|
font-size: 11pt;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.applist-font-text {
|
|
color: black;
|
|
font-size: 11pt;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.applist-window {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
border: 2px solid rgb(42, 42, 42);
|
|
background-color: white;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.applist-title {
|
|
position: absolute;
|
|
height: 65px;
|
|
width: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
padding: 0 23px;
|
|
box-sizing: border-box;
|
|
background: white;
|
|
z-index: 1;
|
|
}
|
|
|
|
.applist-control {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 118px;
|
|
box-sizing: border-box;
|
|
background: white;
|
|
z-index: 1;
|
|
padding-bottom: 24px;
|
|
padding-top: 11px;
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
display: none;
|
|
}
|
|
|
|
.applist-listview {
|
|
position: absolute;
|
|
top: 56px;
|
|
bottom: 0;
|
|
width: 100%;
|
|
overflow-y: auto;
|
|
-ms-overflow-style: -ms-autohiding-scrollbar;
|
|
}
|
|
|
|
.applist-list-item {
|
|
height: 60px;
|
|
padding-top: 10px;
|
|
padding-bottom: 10px;
|
|
padding-left: 20px;
|
|
padding-right: 20px;
|
|
background-color: rgba(0, 255, 255, 0);
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-ms-flex-wrap: nowrap;
|
|
flex-wrap: nowrap;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-ms-flex-pack: start;
|
|
justify-content: flex-start;
|
|
-ms-transition: all 0.1s cubic-bezier(0.22, 0.61, 0.36, 1);
|
|
transition: all 0.1s cubic-bezier(0.22, 0.61, 0.36, 1);
|
|
}
|
|
|
|
.applist-list-item:hover {
|
|
background-color: rgb(222, 222, 222);
|
|
}
|
|
|
|
.applist-list-item:active {
|
|
-ms-transform: scale(0.9696);
|
|
transform: scale(0.9696);
|
|
-ms-transform-origin: center;
|
|
transform-origin: center;
|
|
}
|
|
|
|
.applist-item-divide {
|
|
width: 12px;
|
|
min-width: 12px;
|
|
height: 100%;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.applist-item-picbox {
|
|
width: 40px;
|
|
height: 40px;
|
|
min-width: 40px;
|
|
min-height: 40px;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
background-color: #001020;
|
|
position: relative;
|
|
}
|
|
|
|
.applist-item-pic {
|
|
min-width: 32px;
|
|
min-height: 32px;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.applist-item-title {
|
|
padding-top: 11pt;
|
|
padding-bottom: 0pt;
|
|
height: 100%;
|
|
width: auto;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
max-height: 3.9em;
|
|
line-height: 1.3em;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.applist-btn-cancel {
|
|
position: absolute;
|
|
right: 24px;
|
|
bottom: 24px;
|
|
width: 200px;
|
|
height: 32px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.applist-item-img-border {
|
|
background: transparent;
|
|
border: 1px solid rgba(254, 254, 254, 0.1);
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: 2;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.win10 .applist-font-title {
|
|
font-size: 13pt;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.win10.applist-window {
|
|
border: 1px solid #ccc;
|
|
}
|
|
|
|
.win10 .applist-title {
|
|
height: 56px;
|
|
padding: 0 24px;
|
|
}
|
|
|
|
.win10 .applist-control {
|
|
display: block;
|
|
}
|
|
|
|
.win10 .applist-listview {
|
|
bottom: 118px;
|
|
}
|
|
|
|
.win10 .applist-list-item {
|
|
height: 50px;
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
}
|
|
|
|
.win10 .applist-list-item:active {
|
|
transform: scale(0.9709);
|
|
}
|
|
|
|
.win10 .applist-item-divide {
|
|
width: 12px;
|
|
min-width: 12px;
|
|
}
|
|
|
|
.win10 .applist-item-title {
|
|
padding-top: 5pt;
|
|
font-weight: normal;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div role="template" id="applist-item-template">
|
|
<div class="applist-list-item">
|
|
<div class="applist-item-picbox" style="background-color: rgb(0,0,0);">
|
|
<img class="applist-item-pic" src="./Images/AppLogoDefault.png" width="32" height="32">
|
|
<div class="applist-item-img-border"></div>
|
|
</div>
|
|
<div class="applist-item-divide"></div>
|
|
<div class="applist-item-title">
|
|
<span class="applist-font-text">My Application0</span>
|
|
</div>
|
|
</div>
|
|
<div class="applist-window win10">
|
|
<div class="applist-title">
|
|
<span class="applist-font-title" data-res-byname="IDS_APPLIST_TITLE"></span>
|
|
</div>
|
|
<div class="applist-listview">
|
|
</div>
|
|
<div class="applist-control">
|
|
<button class="applist-btn-cancel win-commandbutton div-button-size div-std-button-center" onclick="Bridge.Frame.callEvent ('OnPress_CancelButton')" tabindex="0" data-res-byname="IDS_APPLIST_CANCEL"></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
(function(global) {
|
|
"use strict";
|
|
"App Select List, For Internet Explorer 10 and above.";
|
|
var AppListElements = new function() {
|
|
Object.defineProperty(this, "template", {
|
|
get: function() {
|
|
return document.getElementById("applist-item-template").querySelector(".applist-list-item").cloneNode(true);
|
|
}
|
|
});
|
|
Object.defineProperty(this, "listview", {
|
|
get: function() {
|
|
return document.querySelector(".applist-listview");
|
|
}
|
|
});
|
|
}();
|
|
|
|
function AppListNodeElement(node) {
|
|
var _node = node;
|
|
var _appid = "";
|
|
var _title = "";
|
|
var _logo = "";
|
|
var _color = "";
|
|
Object.defineProperty(this, "node", {
|
|
get: function() {
|
|
return _node;
|
|
},
|
|
set: function(value) {
|
|
_node = value;
|
|
}
|
|
});
|
|
Object.defineProperty(this, "appid", {
|
|
get: function() {
|
|
if (this.node) return this.node.getAttribute("data-appid");
|
|
else return _appid;
|
|
},
|
|
set: function(value) {
|
|
_appid = value;
|
|
if (this.node) this.node.setAttribute("data-appid", value);
|
|
}
|
|
})
|
|
Object.defineProperty(this, "title", {
|
|
get: function() {
|
|
if (this.node) return this.node.querySelector(".applist-item-title").textContent;
|
|
else return _title;
|
|
},
|
|
set: function(value) {
|
|
_title = value;
|
|
if (this.node) this.node.querySelector(".applist-item-title").textContent = value;
|
|
}
|
|
})
|
|
Object.defineProperty(this, "logo", {
|
|
get: function() {
|
|
if (this.node) return this.node.querySelector(".applist-item-pic").getAttribute("src");
|
|
else return _logo;
|
|
},
|
|
set: function(value) {
|
|
_logo = value;
|
|
if (this.node) this.node.querySelector(".applist-item-pic").setAttribute("src", value);
|
|
}
|
|
});
|
|
Object.defineProperty(this, "color", {
|
|
get: function() {
|
|
if (this.node) return this.node.querySelector(".applist-item-picbox").style.backgroundColor;
|
|
else return _color;
|
|
},
|
|
set: function(value) {
|
|
_color = value;
|
|
if (this.node) this.node.querySelector(".applist-item-picbox").style.backgroundColor = value;
|
|
}
|
|
});
|
|
}
|
|
|
|
function createItem(title, logo, appid, color) {
|
|
var item = AppListElements.template.cloneNode(true);
|
|
var inode = new AppListNodeElement(item);
|
|
inode.title = title;
|
|
inode.logo = logo;
|
|
inode.appid = appid;
|
|
inode.color = color;
|
|
item.itemInfo = inode;
|
|
item.addEventListener("click", function() {
|
|
setTimeout(function() {
|
|
external.Package.activate(appid);
|
|
Bridge.Frame.callEvent("OnPress_AppItem", appid);
|
|
});
|
|
});
|
|
return item;
|
|
}
|
|
|
|
function addItem(node) {
|
|
AppListElements.listview.appendChild(node);
|
|
}
|
|
global.AppList = {
|
|
Item: {
|
|
create: createItem
|
|
},
|
|
List: {
|
|
add: addItem
|
|
}
|
|
};
|
|
global.addAppToList = function(title, logo, appid, color) {
|
|
var item = createItem(title, logo, appid, color);
|
|
addItem(item);
|
|
};
|
|
|
|
function setWindows10Style(bIsSet) {
|
|
var applist = document.querySelector(".applist-window");
|
|
if (bIsSet) {
|
|
if (!applist.classList.contains("win10")) applist.classList.add("win10");
|
|
} else {
|
|
if (applist.classList.contains("win10")) applist.classList.remove("win10");
|
|
}
|
|
}
|
|
global.setWindows10Style = setWindows10Style;
|
|
})(this);
|
|
</script>
|
|
</body>
|
|
|
|
</html> |