muzi
/
macUI
mirror of https://github.com/1099438829/macUI.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

升级v1.1.2.5

This commit is contained in:
1099438829 2021-02-01 11:48:22 +08:00
parent bbb5436123
commit 4f06ec2e42
17 changed files with 830 additions and 734 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
.vscode/launch.json vendored Normal file
View File

@ -0,0 +1,15 @@
{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "pwa-chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
}
]
}

37
LICENSE.txt Normal file
View File

@ -0,0 +1,37 @@
The Star And Thank Author License (SATA)
Copyright (c) 2017 muzi_ys(1099438829@qq.com)
Project Url: https://gitee.com/muziys/macUI
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
And wait, the most important, you shall star/+1/like the project(s) in project url
section above first, and then thank the author(s) in Copyright section.
Here are some suggested ways:
- Email the authors a thank-you letter, and make friends with him/her/them.
- Report bugs or issues.
- Tell friends what a wonderful project this is.
- And, sure, you can just express thanks in your mind without telling the world.
Contributors of this project by forking have the option to add his/her name and
forked project url at copyright and project url sections, but shall not delete
or modify anything else in these two sections.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.

7
README.md
View File

@ -6,7 +6,7 @@ MAC_UI基于WIN10UI打造的mac风格的后台UI,让你轻松搭建一个眼前
## 版本 ## 版本
v1.1.2.3 v1.1.2.5
> 该版本为小更新，针对插件开发作了一些准备，添加了一些语法糖（具体改动请参考更新日志）。 > 该版本为小更新，针对插件开发作了一些准备，添加了一些语法糖（具体改动请参考更新日志）。
> 更新方式：基本无须修改html文件，覆盖css和win10.js文件。 > 更新方式：基本无须修改html文件，覆盖css和win10.js文件。
@ -15,7 +15,7 @@ v1.1.2.3
## 预览 ## 预览
[1] http://mac.apecloud.cn ![1] http://mac.apecloud.cn
@ -28,6 +28,7 @@ v1.1.2.3
* 极少的API，大部分功能可用html元素定义完成 * 极少的API，大部分功能可用html元素定义完成
* 响应式兼容，在手机浏览器也有不错的观感 * 响应式兼容，在手机浏览器也有不错的观感
* 目前只保证对主流现代浏览器的兼容性支持 * 目前只保证对主流现代浏览器的兼容性支持
* 支持 class 配置高斯模糊 blur background_blur
## 前置组件 ## 前置组件
@ -183,6 +184,8 @@ Win10.openUrl("http://win10ui.yuri2.cn","<i class=\"fa fa-camera-retro icon\"></
* orange{background:#F7B824} * orange{background:#F7B824}
* red{background:#FF5722} * red{background:#FF5722}
* dark{background:#2F4056} * dark{background:#2F4056}
* blur 高斯模糊 前置模糊
* backgroud_blur 背景高斯模糊
#### 右键菜单配置 #### 右键菜单配置

39
css/index.css
View File

@ -58,6 +58,17 @@ body {
transition: -ms-filter 0.3s; transition: -ms-filter 0.3s;
} }
#win10 .backgroud_blur {
/* Safari for macOS & iOS */
-webkit-backdrop-filter: blur(20px);
/* Google Chrome */
backdrop-filter: saturate(180%) blur(20px);
transition: filter 0.3s;
transition: -webkit-filter 0.3s;
transition: -moz-filter 0.3s;
transition: -ms-filter 0.3s;
}
#win10 .desktop .background { #win10 .desktop .background {
position: absolute; position: absolute;
width: 100%; width: 100%;
@ -96,11 +107,11 @@ body {
top: 0; top: 0;
height: 24px; height: 24px;
line-height:24px; line-height:24px;
/* IE9+ */ background-color: rgba(255,255,255,0.5);
background-color:rgba(255,255,255,0.4); -webkit-box-shadow: 0 0.3125rem 0.07rem -0.3125rem rgba(0, 0, 0, 0.42);
/* IE6-IE8 */ -moz-box-shadow: 0 0.3125rem 0.07rem -0.3125rem rgba(0, 0, 0, 0.42);
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#68FFFFFF,endColorStr=#68FFFFFF); box-shadow: 0 0.3125rem 0.07rem -0.3125rem rgba(0, 0, 0, 0.42);
z-index: 19930813; z-index: 1000;
} }
#win10 .btn_group { #win10 .btn_group {
@ -198,6 +209,9 @@ body {
top: 24px; top: 24px;
left: 0.5rem; left: 0.5rem;
background-color: rgba(255,255,255,0.55); background-color: rgba(255,255,255,0.55);
box-shadow: 1px 1px 5px #909090;
-moz-box-shadow: 1px 1px 5px #909090;/*firefox*/
-webkit-box-shadow: 1px 1px 5px #909090;/*safari或chrome*/
height: auto; height: auto;
width: 12rem; width: 12rem;
max-width: 880px; max-width: 880px;
@ -331,6 +345,7 @@ body {
#win10 #win10-shortcuts { #win10 #win10-shortcuts {
height: 100%; height: 100%;
width: 100%;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
@ -383,9 +398,11 @@ body {
right: 0; right: 0;
top: 25px; top: 25px;
width: 300px; width: 300px;
background-color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.6);
/* -webkit-box-shadow: 0 0.3125rem 0.3125rem -0.3125rem rgba(0,0,0,0.117); */
-moz-box-shadow: 0 0.3125rem 0.3125rem -0.3125rem rgba(0,0,0,0.117);
box-shadow: 0 0.3125rem 0.3125rem -0.3125rem rgba(0,0,0,0.117);
height: calc(100% - 25px); height: calc(100% - 25px);
transition: all 0.5s;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
color: #333; color: #333;
@ -621,7 +638,6 @@ body {
} }
#win10_command_center .msgs .msg>.title{ #win10_command_center .msgs .msg>.title{
color: #777;
font-size: 14px; font-size: 14px;
line-height: 28px; line-height: 28px;
} }
@ -641,7 +657,6 @@ body {
#win10_command_center .msgs .msg>.content{ #win10_command_center .msgs .msg>.content{
font-size: 12px; font-size: 12px;
color: #777;
padding-bottom: 5px; padding-bottom: 5px;
} }
@ -774,12 +789,12 @@ body {
} }
/*右键菜单*/ /*右键菜单*/
#win10 .win10-context-menu { left: 0;top: 0;position: fixed; width: 150px; height: auto; background-color: rgba(255, 255, 255,0.75); border: #CCC 1px solid; display: block; border-radius: 5px; z-index: 99999999; } #win10 .win10-context-menu { left: 0;top: 0;position: fixed; width: 150px; height: auto; background-color: rgba(255, 255, 255,0.45); display: block; border-radius: 5px; z-index: 99999999; }
#win10 .win10-context-menu ul { margin: 0px; padding: 0px; } #win10 .win10-context-menu ul { margin: 0px; padding: 0px; }
#win10 .win10-context-menu ul li {transition: background-color 0.5s;cursor: default;padding: 0px 1em; list-style: none; line-height: 30px; height: 30px; margin: 3px 0; font-size: 13px; } #win10 .win10-context-menu ul li {transition: background-color 0.5s;cursor: default;padding: 0px 1em; list-style: none; line-height: 25px; height: 25px; margin: 3px 0; font-size: 13px; }
#win10 .win10-context-menu ul li:hover { background-color: rgba(49,156,241,0.71);cursor: pointer; } #win10 .win10-context-menu ul li:hover { background-color: rgba(49,156,241,0.71);cursor: pointer; }
#win10 .win10-context-menu ul li a {text-decoration: none; display: block; height: 100%; color: #333; outline: none; } #win10 .win10-context-menu ul li a {text-decoration: none; display: block; height: 100%; color: #333; outline: none; }
#win10 .win10-context-menu ul hr { margin: 0; height: 0px; border: 0px; border-bottom: rgba(233,233,233) 1px solid;border-top: none } #win10 .win10-context-menu ul hr { margin: 0; height: 0px; border: 0px; border-bottom: rgba(121, 121, 121, 0.24) 1px solid;border-top: none }
/*块级按钮*/ /*块级按钮*/
.win10-open-iframe .layui-layer-ico{background-image:none;} .win10-open-iframe .layui-layer-ico{background-image:none;}

1
css/index.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
css/login.min.css vendored Normal file
View File

@ -0,0 +1 @@
.cm-tab-wrap-hack::after{content:""}.com-user{position:fixed;display:flex;justify-content:center;align-items:center;background:#fff none repeat scroll 0 0}.com-user,.com-user::after{top:0;left:0;bottom:0;right:0;z-index:1000}.com-user::after{position:absolute;content:"";background:rgba(0,0,0,0) url(../img/wallpapers/main.jpg) no-repeat scroll 0 0/cover;margin:-50px;filter:blur(20px);opacity:.8}.com-user .login-box{width:200px}.com-user .login-box img{width:50px;height:50px;border-radius:50%;margin-bottom:10px}.com-user .login-box .login{position:absolute;padding:0;right:-50px;top:90px;border-radius:15px;border:medium none;background:rgba(255,255,255,.3) none repeat scroll 0 0;width:30px;color:#fff;font-size:18px;outline:medium none;height:30px;cursor:pointer}.com-user .login-box .login:active{background:rgba(255,255,255,.4) none repeat scroll 0 0}.com-user .box{z-index:1001;display:flex;flex-direction:column;position:relative;justify-content:center;align-items:center}.com-user .third img{width:32px;height:32px;cursor:pointer;margin:10px}.com-user input{width:150px;background:rgba(255,255,255,.3) none repeat scroll 0 0;border:medium none rgba(0,0,0,.3);border-radius:5px;height:25px;margin:10px 0;outline:medium none;color:#fff;text-align:center}.com-user .cancel{position:absolute;z-index:1001;bottom:22%;background:rgba(0,0,0,0) none repeat scroll 0 0;border:medium none;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;outline:medium none;cursor:pointer}.com-user .cancel img{opacity:.8}.com-user .cancel span{color:#fff;font-size:12px;margin-top:10px}body,html{margin:0;padding:0;font-family:sans-serif;height:100%;width:100%;overflow:hidden}button{-moz-user-select:none;cursor:default;background-color:#fff;outline:medium none;border-width:1px;border-style:solid;border-radius:5px;border-color:#c8c8c8 #c2c2c2 #acacac;box-shadow:0 1px rgba(0,0,0,.04);padding:0 13px;line-height:19px;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,sans-serif;font-size:13px}button:active{border-color:#247fff #125eed #003ddb;background-image:-webkit-linear-gradient(top,#4c98fe,#0564e3);color:rgba(255,255,255,.9)}*{box-sizing:border-box}#root,.layout-desktop{height:100%;width:100%}.layout-desktop{background-image:url(../img/wallpapers/main.jpg);background-size:cover;display:flex;flex-direction:column}.layout-desktop .content{position:relative;height:100%;width:100%;flex:1 1 0%}.layout-desktop .icons{padding:30px}.layout-desktop .icons>div{display:flex;width:150px;height:150px;justify-content:center;align-items:center;flex-direction:column}.layout-desktop .icons>div img{max-width:60px;max-height:60px}.layout-desktop .icons>div span{margin-top:10px;color:#fff;font-size:12px}

131
demo.html
View File

@ -9,58 +9,21 @@
<link href="./css/animate.css" rel="stylesheet"> <link href="./css/animate.css" rel="stylesheet">
<link rel="stylesheet" href="./component/font-awesome-4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="./component/font-awesome-4.7.0/css/font-awesome.min.css">
<link href="./css/index.css" rel="stylesheet"> <link href="./css/index.css" rel="stylesheet">
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="./js/interface.js"></script>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/mac.js"></script>
<link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css">
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
//设置壁纸
Win10.setBgUrl({
main:'./img/wallpapers/main.jpg',
mobile:'./img/wallpapers/mobile.jpg',
});
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)',function () {
Win10.enableFullScreen();
});
Win10.newMsg('最新资讯', '最新资讯信息',function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: './broadcast.html'
});
});
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
},2000);
});
</script>
</head> </head>
<body> <body>
<div id="win10"> <div id="win10">
<div id="win10_task_bar" class="backgroud_blur">
<div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn" onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span class="fa fa-safari"></span></div>
</div>
<div id="win10_btn_group_middle" class="btn_group"></div>
<div id="win10_btn_group_right" class="btn_group">
<div class="btn" id="win10_btn_time"></div>
<div class="btn" id="win10_btn_command"><span id="win10-msg-nof" class="fa fa-list-ul"></span></div>
<div class="btn" id="win10_btn_show_desktop"></div>
</div>
</div>
<div class="desktop"> <div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden"> <div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','OS官网')"> <div class="shortcut" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','OS官网')">
@ -128,7 +91,7 @@
<div class="background blur"></div> <div class="background blur"></div>
</div> </div>
<div id="win10-menu" class="hidden"> <div id="win10-menu" class="hidden backgroud_blur">
<div class="list win10-menu-hidden animated animated-slideOutLeft"> <div class="list win10-menu-hidden animated animated-slideOutLeft">
<div class="item"><i class="icon fa fa-wrench fa-fw"></i><span>API测试</span></div> <div class="item"><i class="icon fa fa-wrench fa-fw"></i><span>API测试</span></div>
<div class="sub-item" onclick="Win10.openUrl('./child.html','子页')">父子页沟通</div> <div class="sub-item" onclick="Win10.openUrl('./child.html','子页')">父子页沟通</div>
@ -143,30 +106,18 @@
<div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div> <div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div>
</div> </div>
</div> </div>
<div id="win10_command_center" class="hidden_right"> <div id="win10_command_center" class="hidden_right backgroud_blur">
<div class="command-header"> <div class="command-header">
<div class="tab-today active">今天</div> <div class="tab-today active">今天</div>
<div class="tab-msg">通知</div> <div class="tab-msg">通知</div>
</div> </div>
<div class="command-body today" win-render="none"></div> <div class="command-body today"></div>
<!-- <span id="win10_btn_command_center_clean_all">全部清除</span> --> <!-- <span id="win10_btn_command_center_clean_all">全部清除</span> -->
<div class="command-body msgs"></div> <div class="command-body msgs"></div>
</div>
<div id="win10_task_bar">
<div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn" onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span class="fa fa-safari"></span></div>
</div>
<div id="win10_btn_group_middle" class="btn_group"></div>
<div id="win10_btn_group_right" class="btn_group">
<div class="btn" id="win10_btn_time"></div>
<div class="btn" id="win10_btn_command"><span id="win10-msg-nof" class="fa fa-list-ul"></span></div>
<div class="btn" id="win10_btn_show_desktop"></div>
</div>
</div> </div>
<!--bottom dock --> <!--bottom dock -->
<div class="dock" id="dock"> <div class="dock" id="dock">
<div class="dock-container"> <div class="dock-container backgroud_blur">
<a class="dock-item" onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')"> <img src="./img/icon/finder.png"></a> <a class="dock-item" onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')"> <img src="./img/icon/finder.png"></a>
<a class="dock-item" href="#"><span>appstore</span><img src="./img/icon/appstore.png" alt="appstore" /></a> <a class="dock-item" href="#"><span>appstore</span><img src="./img/icon/appstore.png" alt="appstore" /></a>
<a class="dock-item" href="#"><span>gamecenter</span><img src="./img/icon/gamecenter.png" alt="gamecenter" /></a> <a class="dock-item" href="#"><span>gamecenter</span><img src="./img/icon/gamecenter.png" alt="gamecenter" /></a>
@ -181,4 +132,54 @@
</div> </div>
</div> </div>
</body> </body>
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/interface.js"></script>
<script type="text/javascript" src="./js/mac.min.js"></script>
<link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css">
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
//设置壁纸
Win10.setBgUrl({
main: './img/wallpapers/main.jpg',
mobile: './img/wallpapers/mobile.jpg',
});
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)', function () {
Win10.enableFullScreen();
});
Win10.newMsg('最新资讯', '最新资讯信息', function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade: 0,
skin: 'win10-open-iframe',
offset: 'rb',
content: './broadcast.html'
});
});
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade: 0,
skin: 'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
}, 2000);
});
</script>
</html> </html>

93
index.html
View File

@ -4,53 +4,19 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<title>mac桌面</title> <title>macOS</title>
<meta name="description" content="mac桌面">
<meta name="keywords" content="mac桌面">
<link rel='Shortcut Icon' type='image/x-icon' href='./img/favicon.ico'> <link rel='Shortcut Icon' type='image/x-icon' href='./img/favicon.ico'>
<link href="./css/animate.css" rel="stylesheet"> <link href="./css/animate.css" rel="stylesheet">
<link rel="stylesheet" href="./component/font-awesome-4.7.0/css/font-awesome.min.css"> <link href="./component/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="./css/index.css" rel="stylesheet"> <link href="./css/index.min.css" rel="stylesheet">
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="./js/interface.js"></script>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/mac.js"></script>
<link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css"> <link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css">
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
//设置壁纸
Win10.setBgUrl({
main:'./img/wallpapers/main.jpg',
mobile:'./img/wallpapers/mobile.jpg',
});
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)',function () {
Win10.enableFullScreen();
})
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
},2000);
});
</script>
</head> </head>
<body> <body>
<div id="win10"> <div id="win10">
<div id="win10_task_bar"> <div id="win10_task_bar" class="backgroud_blur">
<div id="win10_btn_group_left" class="btn_group"> <div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div> <div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn" onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span class="fa fa-safari"></span></div> <div class="btn" onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span class="fa fa-safari"></span></div>
@ -64,7 +30,7 @@
</div> </div>
<div class="desktop"> <div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden"> <div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','UI官网')"> <div class="shortcut" onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','UI官网')">
<img class="icon" src="./img/icon/computer.png"/> <img class="icon" src="./img/icon/computer.png"/>
<div class="title">UI官网</div> <div class="title">UI官网</div>
</div> </div>
@ -99,13 +65,13 @@
</div> </div>
<div class="background blur"></div> <div class="background blur"></div>
</div> </div>
<div id="win10-menu" class="hidden"> <div id="win10-menu" class="hidden backgroud_blur">
<div class="list win10-menu-hidden animated animated-slideOutLeft"> <div class="list win10-menu-hidden animated animated-slideOutLeft">
<div class="item" onclick="Win10.aboutUs()"><i class="icon fa fa-star fa-fw"></i>关于</div> <div class="item" onclick="Win10.aboutUs()"><i class="icon fa fa-star fa-fw"></i>关于</div>
<div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div> <div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div>
</div> </div>
</div> </div>
<div id="win10_command_center" class="hidden_right"> <div id="win10_command_center" class="hidden_right backgroud_blur">
<div class="command-header"> <div class="command-header">
<div class="tab-today active">今天</div> <div class="tab-today active">今天</div>
<div class="tab-msg">通知</div> <div class="tab-msg">通知</div>
@ -115,7 +81,7 @@
<div class="command-body msgs"></div> <div class="command-body msgs"></div>
</div> </div>
<div class="dock" id="dock"> <div class="dock" id="dock">
<div class="dock-container"> <div class="dock-container backgroud_blur">
<a class="dock-item" onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')"> <span>finder</span><img src="./img/icon/finder.png"></a> <a class="dock-item" onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')"> <span>finder</span><img src="./img/icon/finder.png"></a>
<a class="dock-item" href="#" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','UI官网')" ><span>UI官网</span><img src="./img/icon/computer.png" alt="UI官网" /></a> <a class="dock-item" href="#" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','UI官网')" ><span>UI官网</span><img src="./img/icon/computer.png" alt="UI官网" /></a>
<a class="dock-item" href="#"><span>appstore</span><img src="./img/icon/appstore.png" alt="appstore" /></a> <a class="dock-item" href="#"><span>appstore</span><img src="./img/icon/appstore.png" alt="appstore" /></a>
@ -130,5 +96,42 @@
</div> </div>
</div> </div>
</div> </div>
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/interface.js"></script>
<script type="text/javascript" src="./js/mac.min.js"></script>
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
//设置壁纸
Win10.setBgUrl({
main: './img/wallpapers/main.jpg',
mobile: './img/wallpapers/mobile.jpg',
});
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)', function () {
Win10.enableFullScreen();
})
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade: 0,
skin: 'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
}, 2000);
});
</script>
</body> </body>
</html> </html>

1
js/interface.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
js/login.min.js vendored Normal file
View File

@ -0,0 +1 @@
$(document).ready((function(){let animating=!1,submitPhase1=1100,submitPhase2=400,logoutPhase1=800,$login=$(".login"),$app=$(".app");function ripple(elem,e){$(".ripple").remove();let elTop=elem.offset().top,elLeft=elem.offset().left,x=e.pageX-elLeft,y=e.pageY-elTop,$ripple=$("<div class='ripple'></div>");$ripple.css({top:y,left:x}),elem.append($ripple)}$(document).on("click",".login__submit",(function(e){if(animating)return;animating=!0;let that=this;ripple($(that),e),$(that).addClass("processing"),setTimeout((function(){$(that).addClass("success"),setTimeout((function(){$app.show(),$app.css("top"),$app.addClass("active")}),330),setTimeout((function(){$login.hide(),$login.addClass("inactive"),animating=!1,$(that).removeClass("success processing")}),400)}),1100)})),$(document).on("click",".app__logout",(function(e){if(animating)return;$(".ripple").remove(),animating=!0;let that=this;$(that).addClass("clicked"),setTimeout((function(){$app.removeClass("active"),$login.show(),$login.css("top"),$login.removeClass("inactive")}),680),setTimeout((function(){$app.hide(),animating=!1,$(that).removeClass("clicked")}),800)}))}));

262
js/mac.js
View File

@ -2,7 +2,7 @@
* Created by Yuri2 on 2017/7/10. * Created by Yuri2 on 2017/7/10.
*/ */
window.Win10 = { window.Win10 = {
_version:'v1.1.2.4', _version: 'v1.1.2.5',
_debug: true, _debug: true,
_bgs: { _bgs: {
main: '', main: '',
@ -27,15 +27,15 @@ window.Win10 = {
track: function (element, cb) { track: function (element, cb) {
this.iframes.push(new this.Iframe(element, cb)); this.iframes.push(new this.Iframe(element, cb));
if (!this.interval) { if (!this.interval) {
var _this = this; let _this = this;
this.interval = setInterval(function () { _this.checkClick(); }, this.resolution); this.interval = setInterval(function () { _this.checkClick(); }, this.resolution);
} }
}, },
checkClick: function () { checkClick: function () {
if (document.activeElement) { if (document.activeElement) {
var activeElement = document.activeElement; let activeElement = document.activeElement;
for (var i in this.iframes) { for (let i in this.iframes) {
var eid=undefined; let eid = undefined;
if ((eid = this.iframes[i].element.id) && !document.getElementById(eid)) { if ((eid = this.iframes[i].element.id) && !document.getElementById(eid)) {
delete this.iframes[i]; delete this.iframes[i];
continue; continue;
@ -56,27 +56,27 @@ window.Win10 = {
_renderBar: function () { _renderBar: function () {
//调整任务栏项目的宽度 //调整任务栏项目的宽度
if (this._countTask <= 0) { return; } //防止除以0 if (this._countTask <= 0) { return; } //防止除以0
var btns=$("#win10_btn_group_middle>.btn"); let btns = $("#win10_btn_group_middle>.btn");
btns.css('width', ('calc(' + (1 / this._countTask * 100) + '% - 1px )')) btns.css('width', ('calc(' + (1 / this._countTask * 100) + '% - 1px )'))
}, },
_handleReady: [], _handleReady: [],
_hideShortcut: function () { _hideShortcut: function () {
var that=$("#win10 #win10-shortcuts .shortcut"); let that = $("#win10 #win10-shortcuts .shortcut");
that.removeClass('animated flipInX'); that.removeClass('animated flipInX');
that.addClass('animated flipOutX'); that.addClass('animated flipOutX');
}, },
_showShortcut: function () { _showShortcut: function () {
var that=$("#win10 #win10-shortcuts .shortcut"); let that = $("#win10 #win10-shortcuts .shortcut");
that.removeClass('animated flipOutX'); that.removeClass('animated flipOutX');
that.addClass('animated flipInX'); that.addClass('animated flipInX');
}, },
_checkBgUrls: function () { _checkBgUrls: function () {
var loaders=$('#win10>.img-loader'); let loaders = $('#win10>.img-loader');
var flag=false; let flag = false;
if (Win10.isSmallScreen()) { if (Win10.isSmallScreen()) {
if (Win10._bgs.mobile) { if (Win10._bgs.mobile) {
loaders.each(function () { loaders.each(function () {
var loader=$(this); let loader = $(this);
if (loader.attr('src') === Win10._bgs.mobile && loader.hasClass('loaded')) { if (loader.attr('src') === Win10._bgs.mobile && loader.hasClass('loaded')) {
Win10._setBackgroundImg(Win10._bgs.mobile); Win10._setBackgroundImg(Win10._bgs.mobile);
flag = true; flag = true;
@ -84,7 +84,7 @@ window.Win10 = {
}); });
if (!flag) { if (!flag) {
//没找到加载完毕的图片 //没找到加载完毕的图片
var img=$('<img class="img-loader" src="'+Win10._bgs.mobile+'" />'); let img = $('<img class="img-loader" src="' + Win10._bgs.mobile + '" />');
$('#win10').append(img); $('#win10').append(img);
Win10._onImgComplete(img[0], function () { Win10._onImgComplete(img[0], function () {
img.addClass('loaded'); img.addClass('loaded');
@ -95,7 +95,7 @@ window.Win10 = {
} else { } else {
if (Win10._bgs.main) { if (Win10._bgs.main) {
loaders.each(function () { loaders.each(function () {
var loader=$(this); let loader = $(this);
if (loader.attr('src') === Win10._bgs.main && loader.hasClass('loaded')) { if (loader.attr('src') === Win10._bgs.main && loader.hasClass('loaded')) {
Win10._setBackgroundImg(Win10._bgs.main); Win10._setBackgroundImg(Win10._bgs.main);
flag = true; flag = true;
@ -103,7 +103,7 @@ window.Win10 = {
}); });
if (!flag) { if (!flag) {
//没找到加载完毕的图片 //没找到加载完毕的图片
var img=$('<img class="img-loader" src="'+Win10._bgs.main+'" />'); let img = $('<img class="img-loader" src="' + Win10._bgs.main + '" />');
$('#win10').append(img); $('#win10').append(img);
Win10._onImgComplete(img[0], function () { Win10._onImgComplete(img[0], function () {
img.addClass('loaded'); img.addClass('loaded');
@ -120,7 +120,7 @@ window.Win10 = {
}, },
//动态加载JS文件 //动态加载JS文件
loadScript: function (url, callback) { loadScript: function (url, callback) {
var el = document.createElement("script"); let el = document.createElement("script");
el.type = "text/javascript"; el.type = "text/javascript";
if (typeof (callback) != "undefined") { if (typeof (callback) != "undefined") {
@ -143,13 +143,13 @@ window.Win10 = {
}, },
_startAnimate: function () { _startAnimate: function () {
setInterval(function () { setInterval(function () {
var classes_lenth=Win10._animated_classes.length; let classes_lenth = Win10._animated_classes.length;
var animated_liveness=Win10._animated_liveness; let animated_liveness = Win10._animated_liveness;
if (animated_liveness === 0 || classes_lenth === 0 || !$("#win10-menu").hasClass('opened')) { return; } if (animated_liveness === 0 || classes_lenth === 0 || !$("#win10-menu").hasClass('opened')) { return; }
$('#win10-menu>.blocks>.menu_group>.block').each(function () { $('#win10-menu>.blocks>.menu_group>.block').each(function () {
if (!$(this).hasClass('onAnimate') && Math.random() <= animated_liveness) { if (!$(this).hasClass('onAnimate') && Math.random() <= animated_liveness) {
var that=$(this); let that = $(this);
var class_animate = Win10._animated_classes[Math.floor((Math.random()*classes_lenth))]; let class_animate = Win10._animated_classes[Math.floor((Math.random() * classes_lenth))];
that.addClass('onAnimate'); that.addClass('onAnimate');
setTimeout(function () { setTimeout(function () {
that.addClass(class_animate); that.addClass(class_animate);
@ -164,7 +164,7 @@ window.Win10 = {
}, },
_onImgComplete: function (img, callback) { _onImgComplete: function (img, callback) {
if (!img) { return; } if (!img) { return; }
var timer = setInterval(function() { let timer = setInterval(function () {
if (img.complete) { if (img.complete) {
callback(img); callback(img);
clearInterval(timer); clearInterval(timer);
@ -179,7 +179,7 @@ window.Win10 = {
layero = this.getLayeroByIndex(layero); layero = this.getLayeroByIndex(layero);
} }
//置顶窗口 //置顶窗口
var max_zindex=0; let max_zindex = 0;
$(".win10-open-iframe").each(function () { $(".win10-open-iframe").each(function () {
z = parseInt($(this).css('z-index')); z = parseInt($(this).css('z-index'));
$(this).css('z-index', z - 1); $(this).css('z-index', z - 1);
@ -188,11 +188,11 @@ window.Win10 = {
layero.css('z-index', max_zindex + 1); layero.css('z-index', max_zindex + 1);
}, },
_checkTop: function () { _checkTop: function () {
var max_index=0,max_z=0,btn=null; let max_index = 0, max_z = 0, btn = null;
$("#win10_btn_group_middle .btn.show").each(function () { $("#win10_btn_group_middle .btn.show").each(function () {
var index=$(this).attr('index'); let index = $(this).attr('index');
var layero=Win10.getLayeroByIndex(index); let layero = Win10.getLayeroByIndex(index);
var z=layero.css('z-index'); let z = layero.css('z-index');
if (z > max_z) { if (z > max_z) {
max_index = index; max_index = index;
max_z = z; max_z = z;
@ -209,11 +209,11 @@ window.Win10 = {
_renderContextMenu: function (x, y, menu, trigger) { _renderContextMenu: function (x, y, menu, trigger) {
this._removeContextMenu(); this._removeContextMenu();
if (menu === true) { return; } if (menu === true) { return; }
var dom = $("<div class='win10-context-menu'><ul></ul></div>"); let dom = $("<div class='win10-context-menu'><ul></ul></div>");
$('#win10').append(dom); $('#win10').append(dom);
var ul=dom.find('ul'); let ul = dom.find('ul');
for(var i=0;i<menu.length;i++){ for (let i = 0; i < menu.length; i++) {
var item=menu[i]; let item = menu[i];
if (item === '|') { if (item === '|') {
ul.append($('<hr/>')); ul.append($('<hr/>'));
continue; continue;
@ -223,7 +223,7 @@ window.Win10 = {
continue; continue;
} }
if (typeof (item) === 'object') { if (typeof (item) === 'object') {
var sub=$('<li>'+item[0]+'</li>'); let sub = $('<li>' + item[0] + '</li>');
ul.append(sub); ul.append(sub);
sub.click(trigger, item[1]); sub.click(trigger, item[1]);
continue; continue;
@ -249,11 +249,11 @@ window.Win10 = {
}, },
_fixWindowsHeightAndWidth: function () { _fixWindowsHeightAndWidth: function () {
//此处代码修正全屏切换引起的子窗体尺寸超出屏幕 //此处代码修正全屏切换引起的子窗体尺寸超出屏幕
var opens=$('.win10-open-iframe'); let opens = $('.win10-open-iframe');
var clientHeight=document.body.clientHeight; let clientHeight = document.body.clientHeight;
opens.each(function () { opens.each(function () {
var layero_opened=$(this); let layero_opened = $(this);
var height=layero_opened.css('height'); let height = layero_opened.css('height');
height = parseInt(height.replace('px', '')); height = parseInt(height.replace('px', ''));
if (height + 30 >= clientHeight) { if (height + 30 >= clientHeight) {
layero_opened.css('height', clientHeight - 30); layero_opened.css('height', clientHeight - 30);
@ -278,11 +278,11 @@ window.Win10 = {
//>> 判断url地址是否为空 如果为空 不予处理 //>> 判断url地址是否为空 如果为空 不予处理
if ($this.data('url') !== "") { if ($this.data('url') !== "") {
//>> 获取弹窗标题 //>> 获取弹窗标题
var title = $this.data('title')||'', let title = $this.data('title') || '',
areaAndOffset, icon; areaAndOffset, icon;
//>> 判断是否有标题图片 //>> 判断是否有标题图片
var bg=$this.data('icon-bg')?$this.data('icon-bg'):''; let bg = $this.data('icon-bg') ? $this.data('icon-bg') : '';
if ($this.data('icon-image')) { if ($this.data('icon-image')) {
//>> 加入到标题中 //>> 加入到标题中
icon = '<img class="icon ' + bg + '" src="' + $this.data('icon-image') + '"/>'; icon = '<img class="icon ' + bg + '" src="' + $this.data('icon-image') + '"/>';
@ -329,7 +329,7 @@ window.Win10 = {
Win10.commandCenterClose(); Win10.commandCenterClose();
}); });
$('#win10').on('click', ".notice .btn_close_msg", function () { $('#win10').on('click', ".notice .btn_close_msg", function () {
var msg = $(this).parents('.notice'); let msg = $(this).parents('.notice');
$(msg).addClass('animated slideOutRight'); $(msg).addClass('animated slideOutRight');
setTimeout(function () { setTimeout(function () {
msg.remove() msg.remove()
@ -348,7 +348,7 @@ window.Win10 = {
} }
}); });
$('#win10_btn_command_center_clean_all').click(function () { $('#win10_btn_command_center_clean_all').click(function () {
var msgs=$('#win10_command_center .msg'); let msgs = $('#win10_command_center .msg');
msgs.addClass('animated slideOutRight'); msgs.addClass('animated slideOutRight');
setTimeout(function () { setTimeout(function () {
msgs.remove() msgs.remove()
@ -364,10 +364,10 @@ window.Win10 = {
$("#win10-menu-switcher").click(function () { $("#win10-menu-switcher").click(function () {
if (Win10._switchMenuTooHurry) { return; } if (Win10._switchMenuTooHurry) { return; }
Win10._switchMenuTooHurry = true; Win10._switchMenuTooHurry = true;
var class_name='win10-menu-hidden'; let class_name = 'win10-menu-hidden';
var list=$("#win10-menu>.list"); let list = $("#win10-menu>.list");
var blocks=$("#win10-menu>.blocks"); let blocks = $("#win10-menu>.blocks");
var toggleSlide=function (obj) { let toggleSlide = function (obj) {
if (obj.hasClass(class_name)) { if (obj.hasClass(class_name)) {
obj.addClass('animated slideInLeft'); obj.addClass('animated slideInLeft');
obj.removeClass('animated slideOutLeft'); obj.removeClass('animated slideOutLeft');
@ -390,21 +390,21 @@ window.Win10 = {
$("#win10 .desktop").click(); $("#win10 .desktop").click();
}); });
$(document).on('click', '.win10-btn-refresh', function () { $(document).on('click', '.win10-btn-refresh', function () {
var index = $(this).attr('index'); let index = $(this).attr('index');
var iframe = Win10.getLayeroByIndex(index).find('iframe'); let iframe = Win10.getLayeroByIndex(index).find('iframe');
iframe.attr('src', iframe.attr('src')); iframe.attr('src', iframe.attr('src'));
}); });
$(document).on('mousedown', '.win10-open-iframe', function () { $(document).on('mousedown', '.win10-open-iframe', function () {
var layero=$(this); let layero = $(this);
Win10._settop(layero); Win10._settop(layero);
Win10._checkTop(); Win10._checkTop();
}); });
$('#win10_btn_group_middle').on('click', '.btn_close', function () { $('#win10_btn_group_middle').on('click', '.btn_close', function () {
var index = $(this).parent().attr('index') ; let index = $(this).parent().attr('index');
Win10._closeWin(index); Win10._closeWin(index);
}); });
$('#win10-menu .list').on('click', '.item', function () { $('#win10-menu .list').on('click', '.item', function () {
var e=$(this); let e = $(this);
if (e.hasClass('has-sub-down')) { if (e.hasClass('has-sub-down')) {
$('#win10-menu .list .item.has-sub-up').toggleClass('has-sub-down').toggleClass('has-sub-up'); $('#win10-menu .list .item.has-sub-up').toggleClass('has-sub-down').toggleClass('has-sub-up');
$("#win10-menu .list .sub-item").slideUp(); $("#win10-menu .list .sub-item").slideUp();
@ -419,12 +419,12 @@ window.Win10 = {
}); });
setInterval(function () { setInterval(function () {
//重新写mac时间 //重新写mac时间
var myDate = Win10.getLunarObj(); let myDate = Win10.getLunarObj();
$("#win10_btn_time").html(myDate.weekDay + myDate.hour + ':' + myDate.minute); $("#win10_btn_time").html(myDate.weekDay + myDate.hour + ':' + myDate.minute);
}, 1000); }, 1000);
//离开前警告 //离开前警告
document.body.onbeforeunload = function (event) { document.body.onbeforeunload = function (event) {
var rel = Win10.lang( '系统可能不会保存您所做的更改','The system may not save the changes you have made.'); let rel = Win10.lang('系统可能不会保存您所做的更改', 'The system may not save the changes you have made.');
if (!window.event) { if (!window.event) {
event.returnValue = rel; event.returnValue = rel;
} else { } else {
@ -444,15 +444,6 @@ window.Win10 = {
if (!Win10.isSmallScreen()) Win10._fixWindowsHeightAndWidth(); //2017年11月14日修改，加入了if条件 if (!Win10.isSmallScreen()) Win10._fixWindowsHeightAndWidth(); //2017年11月14日修改，加入了if条件
Win10.renderDocks(); Win10.renderDocks();
}); });
//细节
$(document).on('focus',".win10-layer-open-browser textarea",function () {
$(this).attr('spellcheck','false');
});
$(document).on('keyup',".win10-layer-open-browser textarea",function (e) {
if(e.keyCode===13){
$(this).parent().parent().find('.layui-layer-btn0').click();
}
});
//打广告 //打广告
setTimeout(function () { setTimeout(function () {
console.log(Win10.lang('本页由Win10-UI强力驱动\n更多信息：http://win10ui.yuri2.cn \nWin10-UI,轻松打造别具一格的后台界面 ', 'The page is strongly driven by Win10-UI.\nFor more info: http://win10ui.yuri2.cn.\n Win10-UI, easy to create a unique background interface.')) console.log(Win10.lang('本页由Win10-UI强力驱动\n更多信息：http://win10ui.yuri2.cn \nWin10-UI,轻松打造别具一格的后台界面 ', 'The page is strongly driven by Win10-UI.\nFor more info: http://win10ui.yuri2.cn.\n Win10-UI, easy to create a unique background interface.'))
@ -471,9 +462,9 @@ window.Win10 = {
Win10.setContextMenu('#win10', true); Win10.setContextMenu('#win10', true);
Win10.setContextMenu('#win10>.desktop', [ Win10.setContextMenu('#win10>.desktop', [
['<i class="fa fa-fw fa-star"></i> 收藏本页', function () { ['<i class="fa fa-fw fa-star"></i> 收藏本页', function () {
var url = window.location; let url = window.location;
var title = document.title; let title = document.title;
var ua = navigator.userAgent.toLowerCase(); let ua = navigator.userAgent.toLowerCase();
if (ua.indexOf("360se") > -1) { if (ua.indexOf("360se") > -1) {
layer.alert(Win10.lang('您的浏览器不支持,请按 Ctrl+D 手动收藏!', 'Your browser does not support, please press Ctrl+D to manual collection!')); layer.alert(Win10.lang('您的浏览器不支持,请按 Ctrl+D 手动收藏!', 'Your browser does not support, please press Ctrl+D to manual collection!'));
} }
@ -507,7 +498,7 @@ window.Win10 = {
//处理消息图标闪烁 //处理消息图标闪烁
setInterval(function () { setInterval(function () {
var btn=$("#win10-msg-nof.on-new-msg"); let btn = $("#win10-msg-nof.on-new-msg");
if (btn.length > 0) { if (btn.length > 0) {
btn.toggleClass('fa-commenting-o'); btn.toggleClass('fa-commenting-o');
} }
@ -515,8 +506,7 @@ window.Win10 = {
//绑定快捷键 //绑定快捷键
$("body").keyup(function (e) { $("body").keyup(function (e) {
if (e.ctrlKey) if (e.ctrlKey) {
{
switch (e.keyCode) { switch (e.keyCode) {
case 37://left case 37://left
$("#win10_btn_win").click(); $("#win10_btn_win").click();
@ -568,7 +558,7 @@ window.Win10 = {
}, },
getLunarObj: function () { getLunarObj: function () {
//农历年信息 //农历年信息
var lunarInfo = new Array( let lunarInfo = new Array(
0x04bd8, 0x04ae0, 0x0a570, 0x054d5, 0x0d260, 0x0d950, 0x16554, 0x056a0, 0x09ad0, 0x055d2, 0x04bd8, 0x04ae0, 0x0a570, 0x054d5, 0x0d260, 0x0d950, 0x16554, 0x056a0, 0x09ad0, 0x055d2,
0x04ae0, 0x0a5b6, 0x0a4d0, 0x0d250, 0x1d255, 0x0b540, 0x0d6a0, 0x0ada2, 0x095b0, 0x14977, 0x04ae0, 0x0a5b6, 0x0a4d0, 0x0d250, 0x1d255, 0x0b540, 0x0d6a0, 0x0ada2, 0x095b0, 0x14977,
0x04970, 0x0a4b0, 0x0b4b5, 0x06a50, 0x06d40, 0x1ab54, 0x02b60, 0x09570, 0x052f2, 0x04970, 0x04970, 0x0a4b0, 0x0b4b5, 0x06a50, 0x06d40, 0x1ab54, 0x02b60, 0x09570, 0x052f2, 0x04970,
@ -584,13 +574,13 @@ window.Win10 = {
0x07954, 0x06aa0, 0x0ad50, 0x05b52, 0x04b60, 0x0a6e6, 0x0a4e0, 0x0d260, 0x0ea65, 0x0d530, 0x07954, 0x06aa0, 0x0ad50, 0x05b52, 0x04b60, 0x0a6e6, 0x0a4e0, 0x0d260, 0x0ea65, 0x0d530,
0x05aa0, 0x076a3, 0x096d0, 0x04bd7, 0x04ad0, 0x0a4d0, 0x1d0b6, 0x0d250, 0x0d520, 0x0dd45, 0x05aa0, 0x076a3, 0x096d0, 0x04bd7, 0x04ad0, 0x0a4d0, 0x1d0b6, 0x0d250, 0x0d520, 0x0dd45,
0x0b5a0, 0x056d0, 0x055b2, 0x049b0, 0x0a577, 0x0a4b0, 0x0aa50, 0x1b255, 0x06d20, 0x0ada0); 0x0b5a0, 0x056d0, 0x055b2, 0x049b0, 0x0a577, 0x0a4b0, 0x0aa50, 0x1b255, 0x06d20, 0x0ada0);
var Animals=new Array("鼠","牛","虎","兔","龙","蛇","马","羊","猴","鸡","狗","猪"); let Animals = new Array("鼠", "牛", "虎", "兔", "龙", "蛇", "马", "羊", "猴", "鸡", "狗", "猪");
var Gan=new Array("甲","乙","丙","丁","戊","己","庚","辛","壬","癸"); let Gan = new Array("甲", "乙", "丙", "丁", "戊", "己", "庚", "辛", "壬", "癸");
var Zhi=new Array("子","丑","寅","卯","辰","巳","午","未","申","酉","戌","亥"); let Zhi = new Array("子", "丑", "寅", "卯", "辰", "巳", "午", "未", "申", "酉", "戌", "亥");
//==== 传回农历 y年的总天数 //==== 传回农历 y年的总天数
function lYearDays(y) { function lYearDays(y) {
var i, sum = 348 let i, sum = 348
for (i = 0x8000; i > 0x8; i >>= 1) sum += (lunarInfo[y - 1900] & i) ? 1 : 0 for (i = 0x8000; i > 0x8; i >>= 1) sum += (lunarInfo[y - 1900] & i) ? 1 : 0
return (sum + leapDays(y)) return (sum + leapDays(y))
} }
@ -612,9 +602,9 @@ window.Win10 = {
//==== 算出农历, 传入日期物件, 传回农历日期物件 //==== 算出农历, 传入日期物件, 传回农历日期物件
// 该物件属性有 .year .month .day .isLeap .yearCyl .dayCyl .monCyl // 该物件属性有 .year .month .day .isLeap .yearCyl .dayCyl .monCyl
function lunar(objDate) { function lunar(objDate) {
var i, leap=0, temp=0 let i, leap = 0, temp = 0
var baseDate = new Date(1900,0,31) let baseDate = new Date(1900, 0, 31)
var offset = (objDate - baseDate)/86400000 let offset = (objDate - baseDate) / 86400000
this.dayCyl = offset + 40 this.dayCyl = offset + 40
this.monCyl = 14 this.monCyl = 14
@ -638,23 +628,19 @@ window.Win10 = {
for (i = 1; i < 13 && offset > 0; i++) { for (i = 1; i < 13 && offset > 0; i++) {
//闰月 //闰月
if(leap>0 && i==(leap+1) && this.isLeap==false) if (leap > 0 && i == (leap + 1) && this.isLeap === false) { --i; this.isLeap = true; temp = leapDays(this.year); }
{ --i; this.isLeap = true; temp = leapDays(this.year); } else { temp = monthDays(this.year, i); }
else
{ temp = monthDays(this.year, i); }
//解除闰月 //解除闰月
if(this.isLeap==true && i==(leap+1)) this.isLeap = false if (this.isLeap === true && i == (leap + 1)) this.isLeap = false
offset -= temp offset -= temp
if(this.isLeap == false) this.monCyl ++ if (this.isLeap === false) this.monCyl++
} }
if (offset == 0 && leap > 0 && i == leap + 1) if (offset == 0 && leap > 0 && i == leap + 1)
if(this.isLeap) if (this.isLeap) { this.isLeap = false; }
{ this.isLeap = false; } else { this.isLeap = true; --i; --this.monCyl; }
else
{ this.isLeap = true; --i; --this.monCyl;}
if (offset < 0) { offset += temp; --i; --this.monCyl; } if (offset < 0) { offset += temp; --i; --this.monCyl; }
@ -663,12 +649,12 @@ window.Win10 = {
} }
//获取农历（月）中文格式 //获取农历（月）中文格式
function get_lunarmonth(month) { function get_lunarmonth(month) {
var fm = ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","腊月"]; let fm = ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "腊月"];
return fm[month - 1]; return fm[month - 1];
} }
//获取农历（日）中文格式 //获取农历（日）中文格式
function get_lunarday(day) { function get_lunarday(day) {
var fd = ["十","一","二","三","四","五","六","七","八","九","十"]; let fd = ["十", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十"];
if (day <= 10) { if (day <= 10) {
return "初" + fd[day]; return "初" + fd[day];
} }
@ -688,7 +674,7 @@ window.Win10 = {
//获取干支 //获取干支
function get_ganzhi(year) { function get_ganzhi(year) {
var num = year-1900+36; let num = year - 1900 + 36;
return (Gan[num % 10] + Zhi[num % 12]); return (Gan[num % 10] + Zhi[num % 12]);
} }
//获取生肖 //获取生肖
@ -697,19 +683,19 @@ window.Win10 = {
} }
//获取周 //获取周
function get_weekday(date) { function get_weekday(date) {
var values = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"]; let values = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
return values[date.getDay()]; return values[date.getDay()];
} }
//获取星期 //获取星期
function get_week(date) { function get_week(date) {
var values = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]; let values = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
return values[date.getDay()]; return values[date.getDay()];
} }
//获取分钟 //获取分钟
function get_min(date) { function get_min(date) {
var mins=date.getMinutes(); let mins = date.getMinutes();
if (mins < 10) { if (mins < 10) {
mins = '0' + mins mins = '0' + mins
} }
@ -718,7 +704,7 @@ window.Win10 = {
//获取小时 //获取小时
function get_hour(date) { function get_hour(date) {
var hour=date.getHours(); let hour = date.getHours();
if (hour < 6) { hours = '凌晨' + hour; } if (hour < 6) { hours = '凌晨' + hour; }
else if (hour < 9) { hours = '早上' + hour; } else if (hour < 9) { hours = '早上' + hour; }
else if (hour < 12) { hours = '上午' + hour; } else if (hour < 12) { hours = '上午' + hour; }
@ -730,8 +716,8 @@ window.Win10 = {
return hours; return hours;
} }
var viewdate = {}; let viewdate = {};
var date = new Date(); let date = new Date();
//秒 //秒
viewdate.second = date.getSeconds();; viewdate.second = date.getSeconds();;
//分钟 //分钟
@ -751,11 +737,11 @@ window.Win10 = {
//年份(2位) //年份(2位)
viewdate.year = date.getYear(); viewdate.year = date.getYear();
//农历信息 //农历信息
var lunar_obj = new lunar(date); let lunar_obj = new lunar(date);
//农历中文月 //农历中文月
viewdate.lunarmonth = get_lunarmonth(lunar_obj.month); viewdate.lunarmonth = get_lunarmonth(lunar_obj.month);
//农历中文日 //农历中文日
var lunar_day = Math.floor(lunar_obj.day); let lunar_day = Math.floor(lunar_obj.day);
viewdate.lunarday = get_lunarday(lunar_day); viewdate.lunarday = get_lunarday(lunar_day);
//农历年月日 //农历年月日
viewdate.lunar = lunar_obj.year + "-" + lunar_obj.month + "-" + lunar_day; viewdate.lunar = lunar_obj.year + "-" + lunar_obj.month + "-" + lunar_day;
@ -768,11 +754,11 @@ window.Win10 = {
}, },
//消息中心渲染 //消息中心渲染
renderCommand: function (today = null) { renderCommand: function (today = null) {
var active = $("#win10_command_center .command-body.today").hasClass('active'); let active = $("#win10_command_center .command-body.today").hasClass('active');
if (!active) { if (!active) {
if (!today) { if (!today) {
var lunarDate = Win10.getLunarObj(); let lunarDate = Win10.getLunarObj();
var today = '<div class="command-body-calendar">' + let today = '<div class="command-body-calendar">' +
'<div class="command-body-calendar-date normal-date">' + lunarDate.month + '月' + lunarDate.day + '日 ' + lunarDate.week + '</div>' + '<div class="command-body-calendar-date normal-date">' + lunarDate.month + '月' + lunarDate.day + '日 ' + lunarDate.week + '</div>' +
'<div class="command-body-calendar-date lunar-date">' + lunarDate.ganzhi + '年' + lunarDate.lunarmonth + lunarDate.lunarday + '</div>' + '<div class="command-body-calendar-date lunar-date">' + lunarDate.ganzhi + '年' + lunarDate.lunarmonth + lunarDate.lunarday + '</div>' +
'</div>'; '</div>';
@ -813,11 +799,17 @@ window.Win10 = {
$("#win10-msg-nof").removeClass('on-new-msg fa-commenting-o'); $("#win10-msg-nof").removeClass('on-new-msg fa-commenting-o');
}, },
renderShortcuts: function () { renderShortcuts: function () {
var h=parseInt(($("#win10 #win10-shortcuts")[0].offsetHeight-85)/100); if (!this.isSmallScreen()) {
var x=0,y=0; //大屏执行pc的布局也就是竖排靠右对齐，小屏幕执行移动端也就是横向排列
let h = parseInt(($("#win10 #win10-shortcuts")[0].offsetHeight - 90) / 100);
let w = 0;
//计算一列最大几个图标，公式是（桌面图标界面的大小 - 顶部状态栏和底部dock栏的尺寸）/单个图标高度所占的尺寸
let x = 0,
y = 0;
$("#win10 #win10-shortcuts .shortcut").each(function () { $("#win10 #win10-shortcuts .shortcut").each(function () {
$(this).css({ $(this).css({
left:x*82+10, right: x * 82 + 10,
left: 'auto',
top: y * 100 + 10, top: y * 100 + 10,
}); });
y++; y++;
@ -826,14 +818,32 @@ window.Win10 = {
x++; x++;
} }
}); });
} else {
//小屏幕执行横屏
let w = parseInt(($("#win10 #win10-shortcuts")[0].offsetWidth - 10) / 82);
let x = 0,
y = 0;
$("#win10 #win10-shortcuts .shortcut").each(function () {
$(this).css({
left: x * 82 + 10,
right: 0,
top: y * 100 + 10,
});
x++;
if (x >= w) {
x = 0;
y++;
}
});
}
}, },
//渲染DOCK //渲染DOCK
renderDocks: function () { renderDocks: function () {
var cell_width=50; let cell_width = 50;
var width=document.body.clientWidth ; let width = document.body.clientWidth;
var docks=$(".dock .dock-container a"); let docks = $(".dock .dock-container a");
var max_num=parseInt((width-40)/(cell_width+25))-1; let max_num = parseInt((width - 40) / (cell_width + 25)) - 1;
for (var i = 0; i <= docks.length; i++) { for (let i = 0; i <= docks.length; i++) {
if (i >= max_num) { if (i >= max_num) {
docks.eq(i).hide(); docks.eq(i).hide();
} else { } else {
@ -854,7 +864,7 @@ window.Win10 = {
}) })
} else { } else {
$('.dock-container').css({ 'width': width }); $('.dock-container').css({ 'width': width });
for (var i = 0; i < max_num; i++) { for (let i = 0; i < max_num; i++) {
docks.on('mouseover', function (e) { docks.on('mouseover', function (e) {
e.preventDefault(); e.preventDefault();
@ -880,7 +890,7 @@ window.Win10 = {
} }
}, },
newMsg: function (title, content, handle_click, app_name = '提示消息', app_icon = '<img src="./img/icon/weather.png" class="notice-header-icon-img" />', is_del = true) { newMsg: function (title, content, handle_click, app_name = '提示消息', app_icon = '<img src="./img/icon/weather.png" class="notice-header-icon-img" />', is_del = true) {
var msg = '<div class="notice">' + let msg = '<div class="notice">' +
'<div class="notice-header">' + '<div class="notice-header">' +
'<span class="notice-header-icon">' + app_icon + '</span>' + '<span class="notice-header-icon">' + app_icon + '</span>' +
'<span class="notice-header-title">' + app_name + '</span>'; '<span class="notice-header-title">' + app_name + '</span>';
@ -893,7 +903,7 @@ window.Win10 = {
'<div class="title">' + title + '</div>' + '<div class="title">' + title + '</div>' +
'<div class="content">' + content + '</div>' + '<div class="content">' + content + '</div>' +
'</div></div></div>'; '</div></div></div>';
var e = $(msg); let e = $(msg);
$("#win10_command_center .msgs").prepend(e); $("#win10_command_center .msgs").prepend(e);
e.find('.content:first,.title:first').click(function () { e.find('.content:first,.title:first').click(function () {
if (handle_click) { if (handle_click) {
@ -915,11 +925,11 @@ window.Win10 = {
if (!size) { if (!size) {
size = 768 size = 768
} }
var width = document.body.clientWidth; let width = document.body.clientWidth;
return width < size; return width < size;
}, },
enableFullScreen: function () { enableFullScreen: function () {
var docElm = document.documentElement; let docElm = document.documentElement;
//W3C //W3C
if (docElm.requestFullscreen) { if (docElm.requestFullscreen) {
docElm.requestFullscreen(); docElm.requestFullscreen();
@ -969,7 +979,7 @@ window.Win10 = {
} }
if (!url) { url = '404' } if (!url) { url = '404' }
url = url.replace(/(^\s*)|(\s*$)/g, ""); url = url.replace(/(^\s*)|(\s*$)/g, "");
var preg=/^(https?:\/\/|\.\.?\/|\/\/?)/; let preg = /^(https?:\/\/|\.\.?\/|\/\/?)/;
if (!preg.test(url)) { if (!preg.test(url)) {
url = 'http://' + url; url = 'http://' + url;
} }
@ -979,7 +989,7 @@ window.Win10 = {
if (!title) { if (!title) {
title = url; title = url;
} }
var area,offset; let area, offset;
if (this.isSmallScreen() || areaAndOffset === 'max') { if (this.isSmallScreen() || areaAndOffset === 'max') {
area = ['100%', (document.body.clientHeight - 24) + 'px']; area = ['100%', (document.body.clientHeight - 24) + 'px'];
offset = ['24px', '0']; offset = ['24px', '0'];
@ -988,14 +998,14 @@ window.Win10 = {
offset = areaAndOffset[1]; offset = areaAndOffset[1];
} else { } else {
area = ['80%', '80%']; area = ['80%', '80%'];
var topset, leftset; let topset, leftset;
topset = parseInt($(window).height()); topset = parseInt($(window).height());
topset = (topset - (topset * 0.8)) / 2 - 31; topset = (topset - (topset * 0.8)) / 2 - 31;
leftset = parseInt($(window).width()); leftset = parseInt($(window).width());
leftset = (leftset - (leftset * 0.8)) / 2 - 120; leftset = (leftset - (leftset * 0.8)) / 2 - 120;
offset = [Math.round((this._countTask % 10 * 20) + topset) + 'px', Math.round((this._countTask % 10 * 20 + 100) + leftset) + 'px']; offset = [Math.round((this._countTask % 10 * 20) + topset) + 'px', Math.round((this._countTask % 10 * 20 + 100) + leftset) + 'px'];
} }
var index = layer.open({ let index = layer.open({
type: 2, type: 2,
shadeClose: true, shadeClose: true,
shade: false, shade: false,
@ -1024,8 +1034,8 @@ window.Win10 = {
}, },
}); });
$('#win10_btn_group_middle .btn.active').removeClass('active'); $('#win10_btn_group_middle .btn.active').removeClass('active');
var btn = $('<div id="win10_' + index + '" index="' + index + '" class="btn show active"><div class="btn_title">'+icon+'</div></div>'); let btn = $('<div id="win10_' + index + '" index="' + index + '" class="btn show active"><div class="btn_title">' + icon + '</div></div>');
var layero_opened=Win10.getLayeroByIndex(index); let layero_opened = Win10.getLayeroByIndex(index);
layero_opened.css('z-index', Win10._countTask + 813); layero_opened.css('z-index', Win10._countTask + 813);
Win10._settop(layero_opened); Win10._settop(layero_opened);
//重新定义菜单布局 //重新定义菜单布局
@ -1036,7 +1046,7 @@ window.Win10 = {
}) })
layero_opened.find('.layui-layer-setwin .layui-layer-max').click(function () { layero_opened.find('.layui-layer-setwin .layui-layer-max').click(function () {
setTimeout(function () { setTimeout(function () {
var height=layero_opened.css('height'); let height = layero_opened.css('height');
height = parseInt(height.replace('px', '')); height = parseInt(height.replace('px', ''));
if (height >= document.body.clientHeight) { if (height >= document.body.clientHeight) {
layero_opened.css('height', height - 25); layero_opened.css('height', height - 25);
@ -1049,11 +1059,11 @@ window.Win10 = {
$("#win10_btn_group_middle").append(btn); $("#win10_btn_group_middle").append(btn);
Win10._renderBar(); Win10._renderBar();
btn.click(function () { btn.click(function () {
var index = $(this).attr('index'); let index = $(this).attr('index');
var layero = Win10.getLayeroByIndex(index); let layero = Win10.getLayeroByIndex(index);
var settop=function () { let settop = function () {
//置顶窗口 //置顶窗口
var max_zindex=0; let max_zindex = 0;
$(".win10-open-iframe").each(function () { $(".win10-open-iframe").each(function () {
z = parseInt($(this).css('z-index')); z = parseInt($(this).css('z-index'));
$(this).css('z-index', z - 1); $(this).css('z-index', z - 1);
@ -1158,8 +1168,8 @@ window.Win10 = {
}, },
hideWins: function () { hideWins: function () {
$('#win10_btn_group_middle>.btn.show').each(function () { $('#win10_btn_group_middle>.btn.show').each(function () {
var index = $(this).attr('index'); let index = $(this).attr('index');
var layero = Win10.getLayeroByIndex(index); let layero = Win10.getLayeroByIndex(index);
$(this).removeClass('show'); $(this).removeClass('show');
$(this).removeClass('active'); $(this).removeClass('active');
layero.hide(); layero.hide();
@ -1167,8 +1177,8 @@ window.Win10 = {
}, },
showWins: function () { showWins: function () {
$('#win10_btn_group_middle>.btn').each(function () { $('#win10_btn_group_middle>.btn').each(function () {
var index = $(this).attr('index'); let index = $(this).attr('index');
var layero = Win10.getLayeroByIndex(index); let layero = Win10.getLayeroByIndex(index);
$(this).addClass('show'); $(this).addClass('show');
layero.show(); layero.show();
}); });
@ -1185,8 +1195,8 @@ window.Win10 = {
$(function () { $(function () {
Win10._init(); Win10._init();
for(var i in Win10._handleReady){ for (let i in Win10._handleReady) {
var handle=Win10._handleReady[i]; let handle = Win10._handleReady[i];
handle(); handle();
} }
}); });

1
js/mac.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

8
login.html
View File

@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<meta charset="utf-8"> <meta charset="utf-8">
@ -7,8 +8,9 @@
<meta name="theme-color" content="#000000"> <meta name="theme-color" content="#000000">
<link rel="shortcut icon" href="./img/favicon.ico"> <link rel="shortcut icon" href="./img/favicon.ico">
<title>登录</title> <title>登录</title>
<link media="all" href="./css/login.css" type="text/css" rel="stylesheet"> <link media="all" href="./css/login.min.css" type="text/css" rel="stylesheet">
</head> </head>
<body> <body>
<div id="root"> <div id="root">
<div class="layout-desktop"> <div class="layout-desktop">
@ -27,8 +29,7 @@
</div> </div>
</form> </form>
<button class="cancel"> <button class="cancel">
<img src="./img/login/cancel.png" <img src="./img/login/cancel.png" alt="">
alt="">
<span> <span>
关闭 关闭
</span> </span>
@ -38,4 +39,5 @@
</div> </div>
</div> </div>
</body> </body>
</html> </html>

11
plugins/shortcut-drawer/shortcut-drawer.css
View File

@ -53,19 +53,24 @@
background: transparent; background: transparent;
} }
.drawer.layui-layer>.layui-layer-title{ .drawer.layui-layer>.layui-layer-title{
background-color: srgba(250, 250, 250, 0.9); background:0 0;
text-align: center; text-align: center;
padding: 0; padding: 0;
color: #333; color: #fff;
font-size: 20px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
border-radius: 4px 4px 0px 0px; border-radius: 4px 4px 0px 0px;
border: 0; border: 0;
} }
.drawer.layui-layer{
box-shadow:none;
}
.drawer.layui-layer>.layui-layer-content{ .drawer.layui-layer>.layui-layer-content{
background-color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.5);
padding: 1em; padding: 1em;
border-radius:1em;
} }

2
plugins/shortcut-drawer/shortcut-drawer.js
View File

@ -49,7 +49,7 @@ Win10.onReady(function () {
type: 1, type: 1,
shadeClose: true, shadeClose: true,
skin: 'drawer', skin: 'drawer',
area:[Win10.isSmallScreen()?"80%":"60%","80%"], area: [Win10.isSmallScreen() ? "80%" : "60%", "50%"],
closeBtn: 0, closeBtn: 0,
title: title, title: title,
content: content, content: content,

2
plugins/shortcut-drawer/shortcut-drawer.min.css vendored
View File

@ -1 +1 @@
.win10-drawer-box{height:0;overflow:hidden}.shortcut-drawer{width:80px;overflow:hidden;cursor:pointer;padding:0;transition:all .5s;display:inline-block}.shortcut-drawer:hover{background-color:rgba(255,255,255,.11)}.shortcut-drawer>.icon{width:50px;height:50px;overflow:hidden;margin:0 auto;color:#fff;box-sizing:border-box;margin-bottom:5px;margin-top:5px;text-align:center;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;display:block;font-size:37px;line-height:50px}.shortcut-drawer .title{color:#fff;font-size:12px;text-align:center;line-height:18px;margin-bottom:5px;height:36px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.drawer.layui-layer{border-radius:.5em;overflow:auto;background:0 0}.drawer.layui-layer>.layui-layer-title{background-color:rgba(250, 250, 250, 0.9);text-align:center;padding:0;color:#333;border:0;height: 30px;line-height: 30px;border-radius: 4px 4px 0px 0px;}.drawer.layui-layer>.layui-layer-content{background-color:rgba(255,255,255,0.7);padding:1em}.drawer .black-green{background:#009688!important}.drawer .green{background:#5FB878!important}.drawer .black{background:#393D49!important}.drawer .blue{background:#1E9FFF!important}.drawer .orange{background:#F7B824!important}.drawer .red{background:#FF5722!important}.drawer .dark{background:#2F4056!important}.drawer .purple{background:#b074e6!important} .win10-drawer-box{height:0;overflow:hidden}.shortcut-drawer{width:80px;overflow:hidden;cursor:pointer;padding:0;transition:all .5s;display:inline-block}.shortcut-drawer:hover{background-color:rgba(255,255,255,.11)}.shortcut-drawer>.icon{width:50px;height:50px;overflow:hidden;margin:0 auto;color:#fff;box-sizing:border-box;margin-bottom:5px;margin-top:5px;text-align:center;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;display:block;font-size:37px;line-height:50px}.shortcut-drawer .title{color:#fff;font-size:12px;text-align:center;line-height:18px;margin-bottom:5px;height:36px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.drawer.layui-layer{border-radius:.5em;overflow:auto;background:0 0}.drawer.layui-layer>.layui-layer-title{background:0 0;text-align:center;padding:0;color:#fff;font-size:20px;height:30px;line-height:30px;border-radius:4px 4px 0 0;border:0}.drawer.layui-layer{box-shadow:none}.drawer.layui-layer>.layui-layer-content{background-color:rgba(255,255,255,.5);padding:1em;border-radius:1em}.drawer .black-green{background:#009688!important}.drawer .green{background:#5fb878!important}.drawer .black{background:#393d49!important}.drawer .blue{background:#1e9fff!important}.drawer .orange{background:#f7b824!important}.drawer .red{background:#ff5722!important}.drawer .dark{background:#2f4056!important}.drawer .purple{background:#b074e6!important}

2
plugins/shortcut-drawer/shortcut-drawer.min.js vendored
View File

@ -1 +1 @@
Win10.onReady(function(){(function(){$('body').on('click','.shortcut-drawer.win10-open-window',function(){$this=$(this);if($this.data('url')!==""){var title=$this.data('title')||'',areaAndOffset,icon;var bg=$this.data('icon-bg')?$this.data('icon-bg'):'';if($this.data('icon-image')){icon='<img class="icon '+bg+'" src="'+$this.data('icon-image')+'"/>'}if($this.data('icon-font')){icon='<i class="fa fa-fw fa-'+$this.data('icon-font')+' icon '+bg+'"></i>'}if(!title&&$this.children('.icon').length===1&&$this.children('.title').length===1){title=$this.children('.title').html();if(!icon){icon=$this.children('.icon').prop("outerHTML")}}if($this.data('area-offset')){areaAndOffset=$this.data('area-offset');if(areaAndOffset.indexOf(',')!==-1){areaAndOffset=eval(areaAndOsffset)}}Win10.openUrl($this.data('url'),icon,title,areaAndOffset)}})})(),$('body').on('click','.win10-drawer',function(){var content=$(this).find('.win10-drawer-box').html();var title=$(this).children('.title').html();var index=layer.open({type:1,shadeClose:true,skin:'drawer',area:[Win10.isSmallScreen()?"80%":"60%","80%"],closeBtn:0,title:title,content:content,});var layero=Win10.getLayeroByIndex(index);layero.find('.shortcut-drawer').click(function(){layer.close(index)})})}); Win10.onReady((function(){(function(){$("body").on("click",".shortcut-drawer.win10-open-window",(function(){if($this=$(this),""!==$this.data("url")){var title=$this.data("title")||"",areaAndOffset,icon,bg=$this.data("icon-bg")?$this.data("icon-bg"):"";$this.data("icon-image")&&(icon='<img class="icon '+bg+'" src="'+$this.data("icon-image")+'"/>'),$this.data("icon-font")&&(icon='<i class="fa fa-fw fa-'+$this.data("icon-font")+" icon "+bg+'"></i>'),title||1!==$this.children(".icon").length||1!==$this.children(".title").length||(title=$this.children(".title").html(),icon||(icon=$this.children(".icon").prop("outerHTML"))),$this.data("area-offset")&&(areaAndOffset=$this.data("area-offset"),-1!==areaAndOffset.indexOf(",")&&(areaAndOffset=eval(areaAndOsffset))),Win10.openUrl($this.data("url"),icon,title,areaAndOffset)}}))})(),$("body").on("click",".win10-drawer",(function(){var content=$(this).find(".win10-drawer-box").html(),title=$(this).children(".title").html(),index=layer.open({type:1,shadeClose:!0,skin:"drawer",area:[Win10.isSmallScreen()?"80%":"60%","50%"],closeBtn:0,title:title,content:content}),layero;Win10.getLayeroByIndex(index).find(".shortcut-drawer").click((function(){layer.close(index)}))}))}));