Merge branch 'master' into songpengmaster

# Conflicts:
#	sparchetype/src/main/java/com/songpeng/sparchetype/system/controller/client/SysLoginController.java

sparchetype/src/main/java/com/songpeng/sparchetype/common/advice/MyErrorViewResolver.java

@@ -0,0 +1,16 @@
+package com.songpeng.sparchetype.common.advice;
+
+import org.springframework.boot.web.server.ErrorPage;
+import org.springframework.boot.web.server.ErrorPageRegistrar;
+import org.springframework.boot.web.server.ErrorPageRegistry;
+import org.springframework.context.annotation.Configuration;
+import org.springframework.http.HttpStatus;
+
+@Configuration
+public class MyErrorViewResolver implements ErrorPageRegistrar {
+
+    @Override
+    public void registerErrorPages(ErrorPageRegistry registry) {
+        registry.addErrorPages(new ErrorPage(HttpStatus.BAD_REQUEST, "/400"));
+    }
+}

sparchetype/src/main/java/com/songpeng/sparchetype/system/config/shiro/ShiroConfig.java

@@ -93,7 +93,7 @@ public class ShiroConfig {
         filterChainDefinitionMap.put("/files/**", "anon");
         filterChainDefinitionMap.put("/logout", "logout");
         filterChainDefinitionMap.put("/client/**", "anon");
-        filterChainDefinitionMap.put("/", "anon");
+        filterChainDefinitionMap.put("/", "authc");
         filterChainDefinitionMap.put("/blog", "anon");
         filterChainDefinitionMap.put("/blog/open/**", "anon");
         filterChainDefinitionMap.put("/**", "authc");

sparchetype/src/main/java/com/songpeng/sparchetype/system/controller/client/SysLoginController.java

@@ -35,7 +35,7 @@ public class SysLoginController {
 	 */
 	@GetMapping({"/", ""})
 	public String welcomeUI(Model model) {
-		return "redirect:/client/company";
+		return "redirect:/admin/index";
 	}
 
 	/**

sparchetype/src/main/java/com/songpeng/sparchetype/system/service/impl/SysMenuServiceImpl.java

@@ -59,7 +59,7 @@ public class SysMenuServiceImpl extends ServiceImpl<SysMenuMapper, SysMenu> impl
 		homeInfo.put("url", "admin/welcome-ui");
 
 		Map<String, String> logoInfo = new HashMap<>(4);
-		logoInfo.put("name", "后台管理");
+		logoInfo.put("name", "黑科制造MES");
 		logoInfo.put("image", "image/logo.png");
 		logoInfo.put("url", "");
 

sparchetype/src/main/resources/application-dev.yml

@@ -13,6 +13,7 @@ spring:
     templateLoaderPath: classpath:/templates/
     cache: false
     expose-spring-macro-helpers: false
+
     request-context-attribute: request
     settings:
       classic_compatible: true

sparchetype/src/main/resources/static/css/splayui.css

@@ -3,24 +3,29 @@
  */
 /**头部-配色*/
 .layui-layout-admin .layui-header {
-  background-color: #1aa094 !important;
+    background-color: #23262e !important;
 }
+
 .layui-header > ul > .layui-nav-item.layui-this,
 .splayui-tool i:hover {
     background-color: #197971 !important;
 }
+
 /**logo-配色*/
 .layui-layout-admin .layui-logo {
     background-color: #243346 !important;
 }
+
 /**左侧-配色*/
 .layui-side.layui-bg-black,
 .layui-side.layui-bg-black > .layui-left-menu > ul {
     background-color: #2f4056 !important;
 }
+
 .layui-left-menu .layui-nav .layui-nav-child a:hover:not(.layui-this) {
     background-color: #3b3f4b;
 }
+
 /**左侧菜单选中-配色*/
 .layui-layout-admin .layui-nav-tree .layui-this,
 .layui-layout-admin .layui-nav-tree .layui-this > a,
@@ -37,22 +42,27 @@
     top: 0;
     bottom: 0;
 }
+
 .layui-header-menu,
 .layui-header {
     height: 60px !important;
 }
+
 .layui-header-menu > .layui-nav-item {
     color: #1b1d21;
     height: 60px !important;
     line-height: 60px !important;
 }
+
 .layui-header > .layui-layout-right > .layui-nav-item {
     height: 60px !important;
     line-height: 60px !important;
 }
+
 .layui-layout-left {
     left: 295px !important;
 }
+
 .layui-nav.layui-layout-left.layui-header-menu.mobile.layui-hide-xs {
     font-weight: bold;
     transition: all 0.2s;
@@ -73,11 +83,19 @@
     line-height: 64px;
     transition: all 0.2s !important;
 }
+
 .layui-layout-admin .layui-logo img {
     display: inline-block;
     height: 30px;
     vertical-align: middle;
 }
+
+.scale img {
+    background-size: contain;
+    width: 100%;
+    height: auto;
+}
+
 .layui-layout-admin .layui-logo h1 {
     display: inline-block;
     margin: 0 0 0 12px;
@@ -92,6 +110,7 @@
 .splayui-admin .layui-layout-admin .layui-logo {
     width: 60px !important;
 }
+
 .splayui-admin .layui-layout-admin .layui-logo h1 {
     display: none;
 }
@@ -131,49 +150,61 @@
     font-style: normal;
     padding-left: 5px;
 }
+
 #top_tabs_box > .layui-tab-title {
     color: #acafb1;
 }
+
 #top_tabs_box > .layui-tab-title li:hover {
     color: #000000;
     background-color: #e7ebed;
 }
+
 #top_tabs_box .layui-tab-close {
     font-size: 12px !important;
     width: 14px !important;
     height: 14px !important;
     line-height: 16px !important;
 }
+
 #top_tabs_box .layui-tab-close:hover {
     border-radius: 4em;
     background: #ff5722;
 }
+
 #top_tabs_box > .layui-tab-title > .layui-this > i:first-child {
     color: #009688;
 }
+
 #top_tabs_box > .layui-tab-title li {
     border-right: 1px solid #e2e2e2;
     font-size: 12.5px !important;
 }
+
 #top_tabs_box > .layui-tab-title .layui-this {
     color: #000000;
 }
+
 .layui-tab-title .layui-this:after {
     border: none;
 }
+
 #top_tabs_box {
     padding-right: 138px;
     height: 34px;
     border-bottom: 1px solid #e2e2e2;
 }
+
 #top_tabs_box > .layui-tab-title,
 #top_tabs_box > .closeBox {
     height: 35px !important;
 }
+
 #top_tabs_box > .layui-tab-title > li,
 #top_tabs_box > .closeBox > li {
     line-height: 35px !important;
 }
+
 #top_tabs {
     position: absolute;
     border-bottom: none;
@@ -189,28 +220,35 @@
     border-bottom: 1px solid #e2e2e2;
     padding: 0 10px !important;
 }
+
 .closeBox .layui-nav-item {
     line-height: 40px;
 }
+
 .closeBox .layui-nav-item > a,
 .closeBox .layui-nav-item > a:hover {
     color: #000;
 }
+
 .closeBox .layui-nav-child {
     top: 40px;
 }
+
 .closeBox .layui-nav-bar {
     display: none;
 }
+
 .closeBox a i.caozuo {
     font-size: 20px;
     position: absolute;
     top: 1px;
     left: 0;
 }
+
 .closeBox a span.layui-nav-more {
     border-color: #333 transparent transparent;
 }
+
 .closeBox a span.layui-nav-more.layui-nav-mored {
     border-color: transparent transparent #333;
 }
@@ -219,38 +257,47 @@
 .layui-side.layui-bg-black {
     transition: all 0.2s;
 }
+
 .layui-side.layui-bg-black > .layui-left-menu > ul {
     transition: all 0.2s;
 }
+
 .layui-side.layui-bg-black
 > .layui-left-menu
 > ul
 > .layui-nav-item:first-child {
     border-top: 1px solid #4b5461;
 }
+
 .layui-left-menu .layui-nav .layui-nav-item a {
     height: 40px;
     line-height: 40px;
     padding-right: 30px;
 }
+
 .layui-left-menu .layui-nav .layui-nav-item > a {
     padding-top: 5px;
     padding-bottom: 5px;
 }
+
 .layui-left-menu .layui-nav .layui-nav-child .layui-nav-child {
     background: 0 0 !important;
 }
+
 .layui-left-menu .layui-nav .layui-nav-more {
     right: 15px;
 }
+
 /**左侧菜单栏 (正常) */
 .splayui-all .layui-nav-itemed .layui-nav-child a,
 .splayui-all .layui-left-menu .layui-nav .layui-nav-child a {
     padding-left: 35px;
 }
+
 .splayui-all .layui-left-menu .layui-nav .layui-nav-child .layui-nav-child a {
     padding-left: 45px;
 }
+
 .splayui-all
 .layui-left-menu
 .layui-nav
@@ -260,6 +307,7 @@
 a {
     padding-left: 55px;
 }
+
 .splayui-all
 .layui-left-menu
 .layui-nav
@@ -270,6 +318,7 @@
 a {
     padding-left: 65px;
 }
+
 .splayui-all
 .layui-left-menu
 .layui-nav
@@ -277,6 +326,7 @@
 > .layui-nav-child {
     padding: 5px 0;
 }
+
 /**左侧菜单栏（缩放） */
 .splayui-admin .layui-side.layui-bg-black,
 .splayui-admin .layui-left-menu,
@@ -284,13 +334,16 @@
 .splayui-admin .layui-left-menu > ul li i {
     width: 60px !important;
 }
+
 .splayui-admin .layui-left-menu > ul li span:first-child {
     display: none;
 }
+
 .splayui-admin .layui-left-menu > ul li span:last-child {
     float: right;
     right: 7px;
 }
+
 .splayui-admin .layui-left-menu .layui-nav .layui-nav-item a {
     height: 40px;
     line-height: 40px;
@@ -304,6 +357,7 @@
     top: 60px !important;
     transition: all 0.2s;
 }
+
 /**内容主体（缩放） */
 .splayui-admin .layui-layout-admin .layui-body {
     left: 60px !important;
@@ -315,13 +369,16 @@
     border-bottom: 1px solid #d9dada;
     margin-bottom: 8px;
 }
+
 .splayui-color .color-content {
     padding: 0 5px 0 5px;
 }
+
 .splayui-color .color-content ul {
     list-style: none;
     text-align: center;
 }
+
 .splayui-color .color-content ul li {
     position: relative;
     display: inline-block;
@@ -335,6 +392,7 @@
     font-size: 12px;
     color: #666;
 }
+
 .splayui-color .color-content li.layui-this:after,
 .splayui-color .color-content li:hover:after {
     width: 100%;
@@ -345,6 +403,7 @@
     border-color: #d8d8d8;
     opacity: 1;
 }
+
 .splayui-color .color-content li:after {
     content: "";
     position: absolute;
@@ -364,38 +423,47 @@
     width: 100% !important;
     height: 100% !important;
 }
+
 .layui-nav-item.layui-this {
     background-color: #1b1d21;
 }
+
 .layui-width-height {
     width: 100%;
     height: 95%;
 }
+
 .layui-tab {
     margin: 0 0 0 0;
     z-index: 99999;
 }
+
 .text-center {
     height: 30px !important;
     line-height: 30px !important;
     text-align: center !important;
 }
+
 .layui-nav {
     padding: 0 !important;
 }
+
 .layui-nav .layui-this:after,
 .layui-nav-bar,
 .layui-nav-tree .layui-nav-itemed:after {
     width: 0 !important;
     height: 0 !important;
 }
+
 .layui-layout-admin .layui-side {
     top: 60px !important;
 }
+
 .layui-tab-card {
     box-shadow: 0px 0px 0px #888888;
     border-bottom: 0;
 }
+
 .clildFrame.layui-tab-content {
     top: 35px;
     position: absolute;
@@ -403,6 +471,7 @@
     width: 100%;
     padding: 0;
 }
+
 * {
     touch-action: pan-y;
 }
@@ -414,48 +483,60 @@
     #top_tabs_box {
         border-bottom: 0px !important;
     }
+
     .layui-layout-admin .layui-body .layui-tab-item.layui-show {
         border-top: 1px solid #e2e2e2;
     }
+
     .splayui-admin .splayui-tool {
         left: 15px !important;
     }
+
     .splayui-tool i:hover {
         background-color: transparent !important;
     }
+
     .splayui-all .layui-layout-left.layui-header-menu {
         transition: all 0.2s;
         float: right;
         right: 5px;
     }
+
     .splayui-all .layui-header-menu > .layui-nav-item {
         float: right;
         right: 0px;
     }
+
     .splayui-admin .layui-layout-left.layui-header-menu {
         left: 50px !important;
         transition: all 0.2s;
     }
+
     .layui-layout-admin .layui-nav.layui-layout-right {
         margin-right: 15px !important;
     }
+
     .layui-layout-admin
     .layui-nav.layui-layout-right
     > li:not(.splayui-setting) {
         width: 40px !important;
     }
+
     .layui-layout-admin
     .layui-nav.layui-layout-right
     > li:not(.splayui-setting)
     a {
         padding: 0 15px;
     }
+
     .splayui-admin .layui-layout-admin .layui-body {
         left: 0px !important;
     }
+
     .layui-layout-admin .layui-body .clildFrame.layui-tab-content {
         top: 0px !important;
     }
+
     .layui-layout-admin .layui-body .clildFrame.layui-tab-content {
         overflow: scroll;
         table-layout: fixed;
@@ -463,6 +544,7 @@
         word-break: break-all;
         -webkit-overflow-scrolling: touch !important;
     }
+
     .splayui-all .layui-nav.layui-layout-right,
     .splayui-admin .layui-layout-admin .layui-logo,
     .splayui-admin .layui-side.layui-bg-black,

sparchetype/src/main/resources/static/css/start.css

@@ -0,0 +1,64 @@
+body {
+    background: radial-gradient(200% 100% at bottom center, #f7f7b6, #e96f92, #75517d, #1b2947);
+    background: radial-gradient(220% 105% at top center, #1b2947 10%, #75517d 40%, #e96f92 65%, #f7f7b6);
+    background-attachment: fixed;
+    overflow: hidden;
+}
+
+@keyframes rotate {
+    0% {
+        transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(0);
+    }
+    100% {
+        transform: perspective(400px) rotateZ(20deg) rotateX(-40deg) rotateY(-360deg);
+    }
+}
+.stars {
+    transform: perspective(500px);
+    transform-style: preserve-3d;
+    position: absolute;
+    bottom: 0;
+    perspective-origin: 50% 100%;
+    left: 50%;
+    animation: rotate 90s infinite linear;
+}
+
+.star {
+    width: 2px;
+    height: 2px;
+    background: #F7F7B6;
+    position: absolute;
+    top: 0;
+    left: 0;
+    transform-origin: 0 0 -300px;
+    transform: translate3d(0, 0, -300px);
+    backface-visibility: hidden;
+}
+.table{
+    width: 400px;
+    height: 350px;
+    margin: 80px auto;
+}
+.table form{
+    width: 100%;
+}
+.table .name{
+    width: 280px;
+    margin: 20px auto 30px auto;
+    display: block;
+    height: 30px;
+    border-radius: 20px;
+    border: none;
+    background: rgba(0,0,0,0.2);
+    text-indent: 0.5em;
+}
+.table .btn{
+    width: 100px;
+    height: 30px;
+    background: rgba(0,0,0,0.1);
+    border-radius: 8px;
+    border: none;
+    color: white;
+    margin: 0 auto;
+    display: block;
+}

sparchetype/src/main/resources/static/js/layuimodule/splayui/splayui.js

@@ -25,7 +25,7 @@ layui.define(["element", "jquery"], function (exports) {
             var config = {
                 urlHashLocation: true,   // URL地址hash定位
                 urlSuffixDefault: true, // URL后缀
-                BgColorDefault: 0,       // 默认皮肤（0开始）
+                BgColorDefault: 1,       // 默认皮肤（0开始）
                 checkUrlDefault: true   // 是否判断URL有效
             };
 
@@ -80,7 +80,7 @@ layui.define(["element", "jquery"], function (exports) {
             sessionStorage.setItem('splayuiHomeHref', data.url);
             $('#splayuiHomeTabId').html('<i class="' + data.icon + '"></i> <span>' + data.name + '</span>');
             $('#splayuiHomeTabId').attr('lay-id', data.url);
-            $('#splayuiHomeTabIframe').html('<iframe width="100%" height="100%" frameborder="0"  src="' + data.url + '"></iframe>');
+            $('#splayuiHomeTabIframe').html('<iframe width="100%" height="100%" frameborder="0"  src="/' + data.url + '"></iframe>');
         };
 
         /**
@@ -390,7 +390,7 @@ layui.define(["element", "jquery"], function (exports) {
             var html = '';
             var bgcolorId = sessionStorage.getItem('splayuiBgcolorId');
             if (bgcolorId == null || bgcolorId == undefined || bgcolorId == '') {
-                bgcolorId = 0;
+                bgcolorId = 1;
             }
             var bgColorConfig = splayui.bgColorConfig();
             $.each(bgColorConfig, function (key, val) {

sparchetype/src/main/resources/templates/admin/index.ftl

@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>后台管理系统</title>
+    <title>黑科-MES系统</title>
     <meta name="renderer" content="webkit">
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
     <meta http-equiv="Access-Control-Allow-Origin" content="*">

sparchetype/src/main/resources/templates/admin/welcome.ftl

@@ -11,56 +11,52 @@
     <meta name="format-detection" content="telephone=no">
     <#include "${request.contextPath}/common/common.ftl">
 </head>
-<body>
+<style>
-<div class="splayui-container">
+    .splayUi-container {
-    <div class="splayui-main">
+        background-image: url(../image/hk.png);
-        <ul class="layui-timeline">
+        background-size: cover;
-            <li class="layui-timeline-item">
+        height: 670px;
-                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
+    }
-                <div class="layui-timeline-content layui-text">
-                    <h3 class="layui-timeline-title">8月18日</h3>
-                    <p>
-                        layui 2.0 的一切准备工作似乎都已到位。发布之弦，一触即发。
-                        <br>不枉近百个日日夜夜与之为伴。因小而大，因弱而强。
-                        <br>无论它能走多远，抑或如何支撑？至少我曾倾注全心，无怨无悔 <i class="layui-icon"></i>
-                    </p>
-                </div>
-            </li>
-            <li class="layui-timeline-item">
-                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
-                <div class="layui-timeline-content layui-text">
-                    <h3 class="layui-timeline-title">8月16日</h3>
-                    <p>杜甫的思想核心是儒家的仁政思想，他有<em>“致君尧舜上，再使风俗淳”</em>的宏伟抱负。个人最爱的名篇有：</p>
-                    <ul>
-                        <li>《登高》</li>
-                        <li>《茅屋为秋风所破歌》</li>
-                    </ul>
-                </div>
-            </li>
-            <li class="layui-timeline-item">
-                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
-                <div class="layui-timeline-content layui-text">
-                    <h3 class="layui-timeline-title">8月15日</h3>
-                    <p>
-                        中国人民抗日战争胜利72周年
-                        <br>常常在想，尽管对这个国家有这样那样的抱怨，但我们的确生在了最好的时代
-                        <br>铭记、感恩
-                        <br>所有为中华民族浴血奋战的英雄将士
-                        <br>永垂不朽
-                    </p>
-                </div>
-            </li>
-            <li class="layui-timeline-item">
-                <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
-                <div class="layui-timeline-content layui-text">
-                    <div class="layui-timeline-title">过去</div>
-                </div>
-            </li>
-        </ul>
-    </div>
-</div>
-<script>
 
+    .box {
+        margin-left: auto;
+        margin-right: 20px;
+    }
+
+    .wrap {
+        display: flex;
+    }
+</style>
+<body>
+<div style="width:100%;">
+    <div class="splayUi-container">
+    </div>
+</div>
+<div class="wrap">
+    <b>开发者：王子杨</b>
+    <div class="box" id="div_timer">
+    </div>
+</div>
+<script type="text/javascript">
+    //获取系统时间
+    function showTime() {
+        nowtime = new Date();
+        year = nowtime.getFullYear();//年
+        month = nowtime.getMonth() + 1;//月
+        day = nowtime.getDate();//日
+        hour = nowtime.getHours();//时
+        minutes = nowtime.getMinutes();//分
+        seconds = nowtime.getSeconds();//秒//文字增加空格
+        document.getElementById("div_timer").style = "white-space:pre;";//显示时间
+        document.getElementById("div_timer").innerText = '当前时间：' + year + "." + p(month) + "." + p(day) + " " + p(hour) + ":" + p(minutes) + ":" + p(seconds);
+    }
+
+    setInterval("showTime()", 1000);
+
+    //月日时分秒小于10补0
+    function p(s) {
+        return s < 10 ? '0' + s : s;
+    }
 </script>
 </body>
 </html>

sparchetype/src/main/resources/templates/login.ftl

@@ -2,7 +2,7 @@
 <html>
 <head>
     <meta charset="UTF-8">
-    <title>后台管理系统</title>
+    <title>黑科-MES系统</title>
     <meta name="renderer" content="webkit|ie-comp|ie-stand">
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
@@ -10,17 +10,13 @@
     <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
     <#include "${request.contextPath}/common/common.ftl">
     <script src="${request.contextPath}/lib/jq-module/jquery.particleground.min.js" charset="utf-8"></script>
+    <link rel="stylesheet" href="${request.contextPath}/css/start.css" media="all">
     <style>
         html, body {
             width: 100%;
             height: 100%;
             overflow: hidden
         }
-
-        body {
-            background: #009688;
-        }
-
         body:after {
             content: '';
             background-repeat: no-repeat;
@@ -61,17 +57,17 @@
         }
 
         .logo-title h1 {
-            color: #009688;
+            color: #fff;
             font-size: 25px;
             font-weight: bold;
         }
 
         .login-form {
-            background-color: #fff;
+            background-color: transparent;
            border: 1px solid #fff;
             border-radius: 3px;
             padding: 14px 20px;
-            box-shadow: 0 0 8px #eeeeee;
+           // box-shadow: 0 0 8px #eeeeee;
         }
 
         .login-form .layui-form-item {
@@ -112,12 +108,13 @@
     </style>
 </head>
 <body>
+<div class="stars"></div>
 <div class="layui-container">
     <div class="admin-login-background">
         <div class="layui-form login-form">
             <form class="layui-form" action="">
                 <div class="layui-form-item logo-title">
-                    <h1>后台登录</h1>
+                    <h1>黑科-MES系统</h1>
                 </div>
                 <div class="layui-form-item">
                     <label class="layui-icon layui-icon-username" for="username"></label>
@@ -138,7 +135,7 @@
                     <input type="checkbox" name="rememberMe" value="true" lay-skin="primary" title="记住密码">
                 </div>
                 <div class="layui-form-item">
-                    <button class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="login">登 入</button>
+                    <button class="layui-btn layui-btn-fluid layui-btn-normal" lay-submit="" lay-filter="login">登 入</button>
                 </div>
             </form>
         </div>
@@ -152,14 +149,6 @@
         // 登录过期的时候，跳出ifram框架
         if (top.location != self.location) top.location = self.location;
         console.log('------------^_^');
-        // 粒子线条背景
-        $(document).ready(function () {
-            $('.layui-container').particleground({
-                dotColor: '#5cbdaa',
-                lineColor: '#5cbdaa'
-            });
-        });
-
         // 进行登录操作
         form.on('submit(login)', function (data) {
             $.ajax({
@@ -187,5 +176,27 @@
         });
     });
 </script>
+
+<script>
+    $(document).ready(function(){
+        var stars=800;  /*星星的密集程度，数字越大越多*/
+        var $stars=$(".stars");
+        var r=800;   /*星星的看起来的距离,值越大越远,可自行调制到自己满意的样子*/
+        for(var i=0;i<stars;i++){
+            var $star=$("<div/>").addClass("star");
+            $stars.append($star);
+        }
+        $(".star").each(function(){
+            var cur=$(this);
+            var s=0.2+(Math.random()*1);
+            var curR=r+(Math.random()*300);
+            cur.css({
+                transformOrigin:"0 0 "+curR+"px",
+                transform:" translate3d(0,0,-"+curR+"px) rotateY("+(Math.random()*360)+"deg) rotateX("+(Math.random()*-50)+"deg) scale("+s+","+s+")"
+
+            })
+        })
+    })
+</script>
 </body>
 </html>