├── common ├── common.js └── loadPic.js ├── css ├── bootstrap.min.css ├── mui.min.css └── style.css ├── fonts └── mui.ttf ├── game ├── actor.js ├── crash.js ├── data.js ├── effects.js ├── enemy.js ├── freeModel.js ├── index.js └── main.js ├── images ├── background.jpeg ├── bg.png ├── enemy │ ├── blowfish-icon.png │ ├── crab-icon-middle.png │ ├── octo-icon.png │ └── squid-icon-middle.png ├── finger3.png ├── obg.png ├── starfish-middle0.png ├── starfish-middle1.png ├── starfish-middle2.png ├── starfish-middle3.png ├── starfish-middle4.png ├── starfish-middle5.png ├── starfish-middle6.png ├── starfish-middle7.png ├── starfish-middle8.png ├── starfish-middle9.png ├── starfish-small0.png ├── starfish-small1.png ├── starfish-small2.png ├── starfish-small3.png ├── starfish-small4.png ├── starfish-small5.png └── weixin.png ├── index.html ├── js ├── animation.js ├── app.js ├── jquery-3.1.1 │ └── jquery-3.1.1.min.js ├── mui.enterfocus.js ├── mui.locker.js ├── mui.min.js └── tween.js ├── main.html ├── manifest.json ├── setting.html ├── test.html └── unpackage └── .confirmed_dependencies /common/common.js: -------------------------------------------------------------------------------- 1 | /* requestAnimationFrame.js 2 | * by zhangxinxu 2013-09-30 3 | */ 4 | var lastTime = 0; 5 | var vendors = ['webkit', 'moz']; 6 | for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { 7 | window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame']; 8 | window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || // name has changed in Webkit 9 | window[vendors[x] + 'CancelRequestAnimationFrame']; 10 | } 11 | 12 | if (!window.requestAnimationFrame) { 13 | window.requestAnimationFrame = function(callback, element) { 14 | var currTime = new Date().getTime(); 15 | var timeToCall = Math.max(0, 16.7 - (currTime - lastTime)); 16 | var id = window.setTimeout(function() { 17 | callback(currTime + timeToCall); 18 | }, timeToCall); 19 | lastTime = currTime + timeToCall; 20 | return id; 21 | }; 22 | } 23 | if (!window.cancelAnimationFrame) { 24 | window.cancelAnimationFrame = function(id) { 25 | clearTimeout(id); 26 | }; 27 | } 28 | 29 | 30 | function lerpDistance(aim, cur, ratio){ // 目标，当前，百分比 31 | var del = cur - aim; 32 | return aim + del * ratio; 33 | } 34 | function lerpAngle(a, b, t){ 35 | var d = b - a; 36 | if(d > Math.PI) d = d - 2 * Math.PI; 37 | if(d < -Math.PI) d = d + 2 * Math.PI; 38 | return a+d*t; 39 | } 40 | 41 | function calLength(x1, y1, x2, y2){ 42 | return Math.pow(x1-x2, 2) + Math.pow(y1-y2, 2); 43 | } 44 | 45 | -------------------------------------------------------------------------------- /common/loadPic.js: -------------------------------------------------------------------------------- 1 | //预加载图片方法 2 | 3 | var pro = ['images/background.jpeg','images/starfish-middle0.png','images/starfish-middle1.png','images/starfish-middle2.png','images/starfish-middle3.png','images/starfish-middle4.png','images/starfish-middle5.png','images/starfish-middle6.png','images/starfish-middle7.png','images/starfish-middle8.png','images/starfish-middle9.png','images/enemy/blowfish-icon.png','images/enemy/crab-icon-middle.png','images/enemy/octo-icon.png','images/enemy/squid-icon-middle.png'], // 预加载图片路径 4 | proTip = ['正在疯狂布置海洋...','主角急匆匆进入海洋...','主角正在变装...','白色智障进入海洋...','紫色奇葩进入海洋...','红色大佬正在路上...','Boss章鱼暗中观察...'], // 预加载图片路径 5 | i = 0, 6 | timer = null, 7 | len = pro.length, 8 | load = function(src){ 9 | if(i < len){ 10 | $('#tip').html((proTip[i]?proTip[i]:'正在疯狂布置海洋...')); 11 | var img_obj = new Image(); 12 | img_obj.src = src; 13 | timer = setInterval(function(){ 14 | if( img_obj.complete ) { 15 | clearInterval(timer); 16 | mui('#loading').progressbar().setProgress( ((i+1)/len)*100 ); 17 | load(pro[i++]); 18 | } 19 | },80); 20 | }else { 21 | //加载完成后动作 22 | $('.mui-content').hide();//关闭进度条 23 | $('#container').show();//显示主界面 24 | main();//执行游戏入口 25 | } 26 | }; 27 | 28 | load(pro[i]); 29 | -------------------------------------------------------------------------------- /css/mui.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * ===================================================== 3 | * Mui v3.3.0 (http://dev.dcloud.net.cn/mui) 4 | * ===================================================== 5 | *//*! normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0}mark{color:#000;background:#ff0}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{font:inherit;margin:0;color:inherit}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{margin:0 2px;padding:.35em .625em .75em;border:1px solid silver}legend{padding:0;border:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}*{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;outline:0;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}body{font-family:'Helvetica Neue',Helvetica,sans-serif;font-size:17px;line-height:21px;color:#000;background-color:#efeff4;-webkit-overflow-scrolling:touch}a{text-decoration:none;color:#007aff}a:active{color:#0062cc}.mui-content{background-color:#efeff4;-webkit-overflow-scrolling:touch}.mui-bar-nav~.mui-content{padding-top:44px}.mui-bar-nav~.mui-content.mui-scroll-wrapper .mui-scrollbar-vertical{top:44px}.mui-bar-header-secondary~.mui-content{padding-top:88px}.mui-bar-header-secondary~.mui-content.mui-scroll-wrapper .mui-scrollbar-vertical{top:88px}.mui-bar-footer~.mui-content{padding-bottom:44px}.mui-bar-footer~.mui-content.mui-scroll-wrapper .mui-scrollbar-vertical{bottom:44px}.mui-bar-footer-secondary~.mui-content{padding-bottom:88px}.mui-bar-footer-secondary~.mui-content.mui-scroll-wrapper .mui-scrollbar-vertical{bottom:88px}.mui-bar-tab~.mui-content{padding-bottom:50px}.mui-bar-tab~.mui-content.mui-scroll-wrapper .mui-scrollbar-vertical{bottom:50px}.mui-bar-footer-secondary-tab~.mui-content{padding-bottom:94px}.mui-bar-footer-secondary-tab~.mui-content.mui-scroll-wrapper .mui-scrollbar-vertical{bottom:94px}.mui-content-padded{margin:10px}.mui-inline{display:inline-block;vertical-align:top}.mui-block{display:block!important}.mui-visibility{visibility:visible!important}.mui-hidden{display:none!important}.mui-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.mui-ellipsis-2{display:-webkit-box;overflow:hidden;white-space:normal!important;text-overflow:ellipsis;word-wrap:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical}.mui-table{display:table;width:100%;table-layout:fixed}.mui-table-cell{position:relative;display:table-cell}.mui-text-left{text-align:left!important}.mui-text-center{text-align:center!important}.mui-text-justify{text-align:justify!important}.mui-text-right{text-align:right!important}.mui-pull-left{float:left}.mui-pull-right{float:right}.mui-list-unstyled{padding-left:0;list-style:none}.mui-list-inline{margin-left:-5px;padding-left:0;list-style:none}.mui-list-inline>li{display:inline-block;padding-right:5px;padding-left:5px}.mui-clearfix:after,.mui-clearfix:before{display:table;content:' '}.mui-clearfix:after{clear:both}.mui-bg-primary{background-color:#007aff}.mui-bg-positive{background-color:#4cd964}.mui-bg-negative{background-color:#dd524d}.mui-error{margin:88px 35px;padding:10px;border-radius:6px;background-color:#bbb}.mui-subtitle{font-size:15px}h1,h2,h3,h4,h5,h6{line-height:1;margin-top:5px;margin-bottom:5px}.mui-h1,h1{font-size:36px}.mui-h2,h2{font-size:30px}.mui-h3,h3{font-size:24px}.mui-h4,h4{font-size:18px}.mui-h5,h5{font-size:14px;font-weight:400;color:#8f8f94}.mui-h6,h6{font-size:12px;font-weight:400;color:#8f8f94}p{font-size:14px;margin-top:0;margin-bottom:10px;color:#8f8f94}.mui-row:after,.mui-row:before{display:table;content:' '}.mui-row:after{clear:both}.mui-col-sm-1,.mui-col-sm-10,.mui-col-sm-11,.mui-col-sm-12,.mui-col-sm-2,.mui-col-sm-3,.mui-col-sm-4,.mui-col-sm-5,.mui-col-sm-6,.mui-col-sm-7,.mui-col-sm-8,.mui-col-sm-9,.mui-col-xs-1,.mui-col-xs-10,.mui-col-xs-11,.mui-col-xs-12,.mui-col-xs-2,.mui-col-xs-3,.mui-col-xs-4,.mui-col-xs-5,.mui-col-xs-6,.mui-col-xs-7,.mui-col-xs-8,.mui-col-xs-9{position:relative;min-height:1px}.mui-row>[class*=mui-col-]{float:left}.mui-col-xs-12{width:100%}.mui-col-xs-11{width:91.66666667%}.mui-col-xs-10{width:83.33333333%}.mui-col-xs-9{width:75%}.mui-col-xs-8{width:66.66666667%}.mui-col-xs-7{width:58.33333333%}.mui-col-xs-6{width:50%}.mui-col-xs-5{width:41.66666667%}.mui-col-xs-4{width:33.33333333%}.mui-col-xs-3{width:25%}.mui-col-xs-2{width:16.66666667%}.mui-col-xs-1{width:8.33333333%}@media (min-width:400px){.mui-col-sm-12{width:100%}.mui-col-sm-11{width:91.66666667%}.mui-col-sm-10{width:83.33333333%}.mui-col-sm-9{width:75%}.mui-col-sm-8{width:66.66666667%}.mui-col-sm-7{width:58.33333333%}.mui-col-sm-6{width:50%}.mui-col-sm-5{width:41.66666667%}.mui-col-sm-4{width:33.33333333%}.mui-col-sm-3{width:25%}.mui-col-sm-2{width:16.66666667%}.mui-col-sm-1{width:8.33333333%}}.mui-scroll-wrapper{position:absolute;z-index:2;top:0;bottom:0;left:0;overflow:hidden;width:100%}.mui-scroll{position:absolute;z-index:1;width:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}.mui-scrollbar{position:absolute;z-index:9998;overflow:hidden;-webkit-transition:500ms;transition:500ms;transform:translateZ(0px);pointer-events:none;opacity:0}.mui-scrollbar-vertical{top:0;right:1px;bottom:2px;width:4px}.mui-scrollbar-vertical .mui-scrollbar-indicator{width:100%}.mui-scrollbar-horizontal{right:2px;bottom:0;left:2px;height:4px}.mui-scrollbar-horizontal .mui-scrollbar-indicator{height:100%}.mui-scrollbar-indicator{position:absolute;display:block;box-sizing:border-box;-webkit-transition:.01s cubic-bezier(.1,.57,.1,1);transition:.01s cubic-bezier(.1,.57,.1,1);transform:translate(0px,0) translateZ(0px);border:1px solid rgba(255,255,255,.80196);border-radius:2px;background:rgba(0,0,0,.39804)}.mui-plus-pullrefresh .mui-fullscreen .mui-scroll-wrapper .mui-scroll-wrapper,.mui-plus-pullrefresh .mui-fullscreen .mui-slider-group .mui-scroll-wrapper{position:absolute;top:0;bottom:0;left:0;overflow:hidden;width:100%}.mui-plus-pullrefresh .mui-fullscreen .mui-scroll-wrapper .mui-scroll,.mui-plus-pullrefresh .mui-fullscreen .mui-slider-group .mui-scroll{position:absolute;width:100%}.mui-plus-pullrefresh .mui-scroll-wrapper,.mui-plus-pullrefresh .mui-slider-group{position:static;top:auto;bottom:auto;left:auto;overflow:auto;width:auto}.mui-plus-pullrefresh .mui-slider-group{overflow:visible}.mui-plus-pullrefresh .mui-scroll{position:static;width:auto}.mui-off-canvas-wrap .mui-bar{position:absolute!important;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-box-shadow:none;box-shadow:none}.mui-off-canvas-wrap{position:relative;z-index:1;overflow:hidden;width:100%;height:100%}.mui-off-canvas-wrap .mui-inner-wrap{position:relative;z-index:1;width:100%;height:100%}.mui-off-canvas-wrap .mui-inner-wrap.mui-transitioning{-webkit-transition:-webkit-transform 350ms;transition:transform 350ms cubic-bezier(.165,.84,.44,1)}.mui-off-canvas-wrap .mui-inner-wrap .mui-off-canvas-left{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.mui-off-canvas-wrap .mui-inner-wrap .mui-off-canvas-right{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.mui-off-canvas-wrap.mui-active{overflow:hidden;height:100%}.mui-off-canvas-wrap.mui-active .mui-off-canvas-backdrop{position:absolute;z-index:998;top:0;right:0;bottom:0;left:0;display:block;transition:background 350ms cubic-bezier(.165,.84,.44,1);background:rgba(0,0,0,.4);box-shadow:-4px 0 4px rgba(0,0,0,.5),4px 0 4px rgba(0,0,0,.5);-webkit-tap-highlight-color:transparent}.mui-off-canvas-wrap.mui-slide-in .mui-off-canvas-right{z-index:10000!important;-webkit-transform:translate3d(100%,0,0)}.mui-off-canvas-wrap.mui-slide-in .mui-off-canvas-left{z-index:10000!important;-webkit-transform:translate3d(-100%,0,0)}.mui-off-canvas-left,.mui-off-canvas-right{position:absolute;z-index:-1;top:0;bottom:0;visibility:hidden;box-sizing:content-box;width:70%;min-height:100%;background:#333;-webkit-overflow-scrolling:touch}.mui-off-canvas-left.mui-transitioning,.mui-off-canvas-right.mui-transitioning{-webkit-transition:-webkit-transform 350ms cubic-bezier(.165,.84,.44,1);transition:transform 350ms cubic-bezier(.165,.84,.44,1)}.mui-off-canvas-left{left:0}.mui-off-canvas-right{right:0}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable{background-color:#333}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable>.mui-off-canvas-left,.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable>.mui-off-canvas-right{width:80%;-webkit-transform:scale(.8);transform:scale(.8);opacity:.1}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable>.mui-off-canvas-left.mui-transitioning,.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable>.mui-off-canvas-right.mui-transitioning{-webkit-transition:-webkit-transform 350ms cubic-bezier(.165,.84,.44,1),opacity 350ms cubic-bezier(.165,.84,.44,1);transition:transform 350ms cubic-bezier(.165,.84,.44,1),opacity 350ms cubic-bezier(.165,.84,.44,1)}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable>.mui-off-canvas-left{-webkit-transform-origin:-100%;transform-origin:-100%}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable>.mui-off-canvas-right{-webkit-transform-origin:200%;transform-origin:200%}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable.mui-active>.mui-inner-wrap{-webkit-transform:scale(.8);transform:scale(.8)}.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable.mui-active>.mui-off-canvas-left,.mui-off-canvas-wrap:not(.mui-slide-in).mui-scalable.mui-active>.mui-off-canvas-right{-webkit-transform:scale(1);transform:scale(1);opacity:1}.mui-loading .mui-spinner{display:block;margin:0 auto}.mui-spinner{display:inline-block;width:24px;height:24px;-webkit-transform-origin:50%;transform-origin:50%;-webkit-animation:spinner-spin 1s step-end infinite;animation:spinner-spin 1s step-end infinite}.mui-spinner:after{display:block;width:100%;height:100%;content:'';background-image:url('data:image/svg+xml;charset=utf-8,');background-repeat:no-repeat;background-position:50%;background-size:100%}.mui-spinner-white:after{background-image:url('data:image/svg+xml;charset=utf-8,')}@-webkit-keyframes spinner-spin{0%{-webkit-transform:rotate(0deg)}8.33333333%{-webkit-transform:rotate(30deg)}16.66666667%{-webkit-transform:rotate(60deg)}25%{-webkit-transform:rotate(90deg)}33.33333333%{-webkit-transform:rotate(120deg)}41.66666667%{-webkit-transform:rotate(150deg)}50%{-webkit-transform:rotate(180deg)}58.33333333%{-webkit-transform:rotate(210deg)}66.66666667%{-webkit-transform:rotate(240deg)}75%{-webkit-transform:rotate(270deg)}83.33333333%{-webkit-transform:rotate(300deg)}91.66666667%{-webkit-transform:rotate(330deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spinner-spin{0%{transform:rotate(0deg)}8.33333333%{transform:rotate(30deg)}16.66666667%{transform:rotate(60deg)}25%{transform:rotate(90deg)}33.33333333%{transform:rotate(120deg)}41.66666667%{transform:rotate(150deg)}50%{transform:rotate(180deg)}58.33333333%{transform:rotate(210deg)}66.66666667%{transform:rotate(240deg)}75%{transform:rotate(270deg)}83.33333333%{transform:rotate(300deg)}91.66666667%{transform:rotate(330deg)}100%{transform:rotate(360deg)}}.mui-btn,button,input[type=button],input[type=reset],input[type=submit]{font-size:14px;font-weight:400;line-height:1.42;position:relative;display:inline-block;margin-bottom:0;padding:6px 12px;cursor:pointer;-webkit-transition:all;transition:all;-webkit-transition-timing-function:linear;transition-timing-function:linear;-webkit-transition-duration:.2s;transition-duration:.2s;text-align:center;vertical-align:top;white-space:nowrap;color:#333;border:1px solid #ccc;border-radius:3px;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;background-color:#fff;background-clip:padding-box}.mui-btn.mui-active:enabled,.mui-btn:enabled:active,button.mui-active:enabled,button:enabled:active,input[type=button].mui-active:enabled,input[type=button]:enabled:active,input[type=reset].mui-active:enabled,input[type=reset]:enabled:active,input[type=submit].mui-active:enabled,input[type=submit]:enabled:active{color:#fff;background-color:#929292}.mui-btn.mui-disabled,.mui-btn:disabled,button.mui-disabled,button:disabled,input[type=button].mui-disabled,input[type=button]:disabled,input[type=reset].mui-disabled,input[type=reset]:disabled,input[type=submit].mui-disabled,input[type=submit]:disabled{opacity:.6}.mui-btn-blue,.mui-btn-primary,input[type=submit]{color:#fff;border:1px solid #007aff;background-color:#007aff}.mui-btn-blue.mui-active:enabled,.mui-btn-blue:enabled:active,.mui-btn-primary.mui-active:enabled,.mui-btn-primary:enabled:active,input[type=submit].mui-active:enabled,input[type=submit]:enabled:active{color:#fff;border:1px solid #0062cc;background-color:#0062cc}.mui-btn-green,.mui-btn-positive,.mui-btn-success{color:#fff;border:1px solid #4cd964;background-color:#4cd964}.mui-btn-green.mui-active:enabled,.mui-btn-green:enabled:active,.mui-btn-positive.mui-active:enabled,.mui-btn-positive:enabled:active,.mui-btn-success.mui-active:enabled,.mui-btn-success:enabled:active{color:#fff;border:1px solid #2ac845;background-color:#2ac845}.mui-btn-warning,.mui-btn-yellow{color:#fff;border:1px solid #f0ad4e;background-color:#f0ad4e}.mui-btn-warning.mui-active:enabled,.mui-btn-warning:enabled:active,.mui-btn-yellow.mui-active:enabled,.mui-btn-yellow:enabled:active{color:#fff;border:1px solid #ec971f;background-color:#ec971f}.mui-btn-danger,.mui-btn-negative,.mui-btn-red{color:#fff;border:1px solid #dd524d;background-color:#dd524d}.mui-btn-danger.mui-active:enabled,.mui-btn-danger:enabled:active,.mui-btn-negative.mui-active:enabled,.mui-btn-negative:enabled:active,.mui-btn-red.mui-active:enabled,.mui-btn-red:enabled:active{color:#fff;border:1px solid #cf2d28;background-color:#cf2d28}.mui-btn-purple,.mui-btn-royal{color:#fff;border:1px solid #8a6de9;background-color:#8a6de9}.mui-btn-purple.mui-active:enabled,.mui-btn-purple:enabled:active,.mui-btn-royal.mui-active:enabled,.mui-btn-royal:enabled:active{color:#fff;border:1px solid #6641e2;background-color:#6641e2}.mui-btn-grey{color:#fff;border:1px solid #c7c7cc;background-color:#c7c7cc}.mui-btn-grey.mui-active:enabled,.mui-btn-grey:enabled:active{color:#fff;border:1px solid #acacb4;background-color:#acacb4}.mui-btn-outlined{background-color:transparent}.mui-btn-outlined.mui-btn-blue,.mui-btn-outlined.mui-btn-primary{color:#007aff}.mui-btn-outlined.mui-btn-green,.mui-btn-outlined.mui-btn-positive,.mui-btn-outlined.mui-btn-success{color:#4cd964}.mui-btn-outlined.mui-btn-warning,.mui-btn-outlined.mui-btn-yellow{color:#f0ad4e}.mui-btn-outlined.mui-btn-danger,.mui-btn-outlined.mui-btn-negative,.mui-btn-outlined.mui-btn-red{color:#dd524d}.mui-btn-outlined.mui-btn-purple,.mui-btn-outlined.mui-btn-royal{color:#8a6de9}.mui-btn-outlined.mui-btn-blue:enabled:active,.mui-btn-outlined.mui-btn-danger:enabled:active,.mui-btn-outlined.mui-btn-green:enabled:active,.mui-btn-outlined.mui-btn-negative:enabled:active,.mui-btn-outlined.mui-btn-positive:enabled:active,.mui-btn-outlined.mui-btn-primary:enabled:active,.mui-btn-outlined.mui-btn-purple:enabled:active,.mui-btn-outlined.mui-btn-red:enabled:active,.mui-btn-outlined.mui-btn-royal:enabled:active,.mui-btn-outlined.mui-btn-success:enabled:active,.mui-btn-outlined.mui-btn-warning:enabled:active,.mui-btn-outlined.mui-btn-yellow:enabled:active{color:#fff}.mui-btn-link{padding-top:6px;padding-bottom:6px;color:#007aff;border:0;background-color:transparent}.mui-btn-link.mui-active:enabled,.mui-btn-link:enabled:active{color:#0062cc;background-color:transparent}.mui-btn-block{font-size:18px;display:block;width:100%;margin-bottom:10px;padding:15px 0}.mui-btn .mui-badge{font-size:14px;margin:-2px -4px -2px 4px;background-color:rgba(0,0,0,.15)}.mui-btn .mui-badge-inverted,.mui-btn:enabled:active .mui-badge-inverted{background-color:transparent}.mui-btn-negative:enabled:active .mui-badge-inverted,.mui-btn-positive:enabled:active .mui-badge-inverted,.mui-btn-primary:enabled:active .mui-badge-inverted{color:#fff}.mui-btn-block .mui-badge{position:absolute;right:0;margin-right:10px}.mui-btn .mui-icon{font-size:inherit}.mui-btn.mui-icon{font-size:14px;line-height:1.42}.mui-btn.mui-fab{width:56px;height:56px;padding:16px;border-radius:50%;outline:0}.mui-btn.mui-fab.mui-btn-mini{width:40px;height:40px;padding:8px}.mui-btn.mui-fab .mui-icon{font-size:24px;line-height:24px;width:24px;height:24px}.mui-bar{position:fixed;z-index:10;right:0;left:0;height:44px;padding-right:10px;padding-left:10px;border-bottom:0;background-color:#f7f7f7;-webkit-box-shadow:0 0 1px rgba(0,0,0,.85);box-shadow:0 0 1px rgba(0,0,0,.85);-webkit-backface-visibility:hidden;backface-visibility:hidden}.mui-bar .mui-title{right:40px;left:40px;display:inline-block;overflow:hidden;width:auto;margin:0;text-overflow:ellipsis}.mui-bar .mui-backdrop{background:0 0}.mui-bar-header-secondary{top:44px}.mui-bar-footer{bottom:0}.mui-bar-footer-secondary{bottom:44px}.mui-bar-footer-secondary-tab{bottom:50px}.mui-bar-footer,.mui-bar-footer-secondary,.mui-bar-footer-secondary-tab{border-top:0}.mui-bar-transparent{top:0;background-color:rgba(247,247,247,0);-webkit-box-shadow:none;box-shadow:none}.mui-bar-nav{top:0;-webkit-box-shadow:0 1px 6px #ccc;box-shadow:0 1px 6px #ccc}.mui-bar-nav~.mui-content .mui-anchor{display:block;visibility:hidden;height:45px;margin-top:-45px}.mui-bar-nav.mui-bar .mui-icon{margin-right:-10px;margin-left:-10px;padding-right:10px;padding-left:10px}.mui-title{font-size:17px;font-weight:500;line-height:44px;position:absolute;display:block;width:100%;margin:0 -10px;padding:0;text-align:center;white-space:nowrap;color:#000}.mui-title a{color:inherit}.mui-bar-tab{bottom:0;display:table;width:100%;height:50px;padding:0;table-layout:fixed;border-top:0;border-bottom:0;-webkit-touch-callout:none}.mui-bar-tab .mui-tab-item{display:table-cell;overflow:hidden;width:1%;height:50px;text-align:center;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;color:#929292}.mui-bar-tab .mui-tab-item.mui-active{color:#007aff}.mui-bar-tab .mui-tab-item .mui-icon{top:3px;width:24px;height:24px;padding-top:0;padding-bottom:0}.mui-bar-tab .mui-tab-item .mui-icon~.mui-tab-label{font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis}.mui-bar-tab .mui-tab-item .mui-icon:active{background:0 0}.mui-focusin>.mui-bar-header-secondary,.mui-focusin>.mui-bar-nav{position:absolute}.mui-focusin>.mui-bar~.mui-content{padding-bottom:0}.mui-bar .mui-btn{font-weight:400;position:relative;z-index:20;top:7px;margin-top:0;padding:6px 12px 7px}.mui-bar .mui-btn.mui-pull-right{margin-left:10px}.mui-bar .mui-btn.mui-pull-left{margin-right:10px}.mui-bar .mui-btn-link{font-size:16px;line-height:44px;top:0;padding:0;color:#007aff;border:0}.mui-bar .mui-btn-link.mui-active,.mui-bar .mui-btn-link:active{color:#0062cc}.mui-bar .mui-btn-block{font-size:16px;top:6px;margin-bottom:0;padding:5px 0}.mui-bar .mui-btn-nav.mui-pull-left{margin-left:-5px}.mui-bar .mui-btn-nav.mui-pull-left .mui-icon-left-nav{margin-right:-3px}.mui-bar .mui-btn-nav.mui-pull-right{margin-right:-5px}.mui-bar .mui-btn-nav.mui-pull-right .mui-icon-right-nav{margin-left:-3px}.mui-bar .mui-btn-nav:active{opacity:.3}.mui-bar .mui-icon{font-size:24px;position:relative;z-index:20;padding-top:10px;padding-bottom:10px}.mui-bar .mui-icon:active{opacity:.3}.mui-bar .mui-btn .mui-icon{top:1px;margin:0;padding:0}.mui-bar .mui-title .mui-icon{margin:0;padding:0}.mui-bar .mui-title .mui-icon.mui-icon-caret{top:4px;margin-left:-5px}.mui-bar input[type=search]{height:29px;margin:6px 0}.mui-bar .mui-input-row .mui-btn{padding:12px 10px}.mui-bar .mui-search:before{margin-top:-10px}.mui-bar .mui-input-row .mui-input-clear~.mui-icon-clear,.mui-bar .mui-input-row .mui-input-speech~.mui-icon-speech{top:0;right:12px}.mui-bar.mui-bar-header-secondary .mui-input-row .mui-input-clear~.mui-icon-clear,.mui-bar.mui-bar-header-secondary .mui-input-row .mui-input-speech~.mui-icon-speech{top:0;right:0}.mui-bar .mui-segmented-control{top:7px;width:auto;margin:0 auto}.mui-bar.mui-bar-header-secondary .mui-segmented-control{top:0}.mui-badge{font-size:12px;line-height:1;display:inline-block;padding:3px 6px;color:#333;border-radius:100px;background-color:rgba(0,0,0,.15)}.mui-badge.mui-badge-inverted{padding:0 5px 0 0;color:#929292;background-color:transparent}.mui-badge-blue,.mui-badge-primary{color:#fff;background-color:#007aff}.mui-badge-blue.mui-badge-inverted,.mui-badge-primary.mui-badge-inverted{color:#007aff;background-color:transparent}.mui-badge-green,.mui-badge-success{color:#fff;background-color:#4cd964}.mui-badge-green.mui-badge-inverted,.mui-badge-success.mui-badge-inverted{color:#4cd964;background-color:transparent}.mui-badge-warning,.mui-badge-yellow{color:#fff;background-color:#f0ad4e}.mui-badge-warning.mui-badge-inverted,.mui-badge-yellow.mui-badge-inverted{color:#f0ad4e;background-color:transparent}.mui-badge-danger,.mui-badge-red{color:#fff;background-color:#dd524d}.mui-badge-danger.mui-badge-inverted,.mui-badge-red.mui-badge-inverted{color:#dd524d;background-color:transparent}.mui-badge-purple,.mui-badge-royal{color:#fff;background-color:#8a6de9}.mui-badge-purple.mui-badge-inverted,.mui-badge-royal.mui-badge-inverted{color:#8a6de9;background-color:transparent}.mui-icon .mui-badge{font-size:10px;line-height:1.4;position:absolute;top:-2px;left:100%;margin-left:-10px;padding:1px 5px;color:#fff;background:red}.mui-card{font-size:14px;position:relative;overflow:hidden;margin:10px;border-radius:2px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 2px rgba(0,0,0,.3)}.mui-content>.mui-card:first-child{margin-top:15px}.mui-card .mui-input-group .mui-input-row:last-child:after,.mui-card .mui-input-group .mui-input-row:last-child:before,.mui-card .mui-input-group:after,.mui-card .mui-input-group:before{height:0}.mui-card .mui-table-view{margin-bottom:0;border-top:0;border-bottom:0;border-radius:6px}.mui-card .mui-table-view .mui-table-view-cell:first-child,.mui-card .mui-table-view .mui-table-view-divider:first-child{top:0;border-top-left-radius:6px;border-top-right-radius:6px}.mui-card .mui-table-view .mui-table-view-cell:last-child,.mui-card .mui-table-view .mui-table-view-divider:last-child{border-bottom-right-radius:6px;border-bottom-left-radius:6px}.mui-card .mui-table-view:after,.mui-card .mui-table-view:before,.mui-card>.mui-table-view>.mui-table-view-cell:last-child:after,.mui-card>.mui-table-view>.mui-table-view-cell:last-child:before{height:0}.mui-card-footer,.mui-card-header{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;min-height:44px;padding:10px 15px;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.mui-card-footer .mui-card-link,.mui-card-header .mui-card-link{line-height:44px;position:relative;display:-webkit-box;display:-webkit-flex;display:flex;height:44px;margin-top:-10px;margin-bottom:-10px;-webkit-transition-duration:.3s;transition-duration:.3s;text-decoration:none;-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.mui-card-footer:before,.mui-card-header:after{position:absolute;top:0;right:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-card-header{font-size:17px;border-radius:2px 2px 0 0}.mui-card-header:after{top:auto;bottom:0}.mui-card-header>img:first-child{font-size:0;line-height:0;float:left;width:34px;height:34px}.mui-card-footer{color:#6d6d72;border-radius:0 0 2px 2px}.mui-card-content{font-size:14px;position:relative}.mui-card-content-inner{position:relative;padding:15px}.mui-card-media{vertical-align:bottom;color:#fff;background-position:center;background-size:cover}.mui-card-header.mui-card-media{display:block;padding:10px}.mui-card-header.mui-card-media .mui-media-body{font-size:14px;font-weight:500;line-height:17px;margin-bottom:0;margin-left:44px;color:#333}.mui-card-header.mui-card-media .mui-media-body p{font-size:13px;margin-bottom:0}.mui-table-view{position:relative;margin-top:0;margin-bottom:0;padding-left:0;list-style:none;background-color:#fff}.mui-table-view:after{position:absolute;right:0;bottom:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view:before{position:absolute;right:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc;top:-1px}.mui-table-view-icon .mui-table-view-cell .mui-navigate-right .mui-icon{font-size:20px;margin-top:-1px;margin-right:5px;margin-left:-5px}.mui-table-view-icon .mui-table-view-cell:after{left:40px}.mui-table-view-chevron .mui-table-view-cell{padding-right:65px}.mui-table-view-chevron .mui-table-view-cell>a:not(.mui-btn){margin-right:-65px}.mui-table-view-radio .mui-table-view-cell{padding-right:65px}.mui-table-view-radio .mui-table-view-cell>a:not(.mui-btn){margin-right:-65px}.mui-table-view-radio .mui-table-view-cell .mui-navigate-right:after{font-size:30px;font-weight:600;right:9px;content:'';color:#007aff}.mui-table-view-radio .mui-table-view-cell.mui-selected .mui-navigate-right:after{content:'\e472'}.mui-table-view-inverted{color:#fff;background:#333}.mui-table-view-inverted:after{position:absolute;right:0;bottom:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#222}.mui-table-view-inverted:before{position:absolute;top:0;right:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#222}.mui-table-view-inverted .mui-table-view-cell:after{position:absolute;right:0;bottom:0;left:15px;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#222}.mui-table-view-inverted .mui-table-view-cell.mui-active,.mui-table-view-inverted .mui-table-view-cell>a:not(.mui-btn).mui-active{background-color:#242424}.mui-table-view-cell{position:relative;overflow:hidden;padding:11px 15px;-webkit-touch-callout:none}.mui-table-view-cell:after{position:absolute;right:0;bottom:0;left:15px;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view-cell.mui-checkbox input[type=checkbox],.mui-table-view-cell.mui-radio input[type=radio]{top:8px}.mui-table-view-cell.mui-checkbox.mui-left,.mui-table-view-cell.mui-radio.mui-left{padding-left:58px}.mui-table-view-cell.mui-active{background-color:#eee}.mui-table-view-cell:last-child:after,.mui-table-view-cell:last-child:before{height:0}.mui-table-view-cell>a:not(.mui-btn){position:relative;display:block;overflow:hidden;margin:-11px -15px;padding:inherit;white-space:nowrap;text-overflow:ellipsis;color:inherit}.mui-table-view-cell>a:not(.mui-btn).mui-active{background-color:#eee}.mui-table-view-cell p{margin-bottom:0}.mui-table-view-cell.mui-transitioning>.mui-slider-handle,.mui-table-view-cell.mui-transitioning>.mui-slider-left .mui-btn,.mui-table-view-cell.mui-transitioning>.mui-slider-right .mui-btn{-webkit-transition:-webkit-transform 300ms ease;transition:transform 300ms ease}.mui-table-view-cell.mui-active>.mui-slider-handle{background-color:#eee}.mui-table-view-cell>.mui-slider-handle{position:relative;background-color:#fff}.mui-table-view-cell>.mui-slider-handle .mui-navigate-right:after,.mui-table-view-cell>.mui-slider-handle.mui-navigate-right:after{right:0}.mui-table-view-cell>.mui-slider-handle,.mui-table-view-cell>.mui-slider-left .mui-btn,.mui-table-view-cell>.mui-slider-right .mui-btn{-webkit-transition:-webkit-transform 0ms ease;transition:transform 0ms ease}.mui-table-view-cell>.mui-slider-left,.mui-table-view-cell>.mui-slider-right{position:absolute;top:0;display:-webkit-box;display:-webkit-flex;display:flex;height:100%}.mui-table-view-cell>.mui-slider-left>.mui-btn,.mui-table-view-cell>.mui-slider-right>.mui-btn{position:relative;left:0;display:-webkit-box;display:-webkit-flex;display:flex;padding:0 30px;color:#fff;border:0;border-radius:0;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.mui-table-view-cell>.mui-slider-left>.mui-btn:after,.mui-table-view-cell>.mui-slider-right>.mui-btn:after{position:absolute;z-index:-1;top:0;width:600%;height:100%;content:'';background:inherit}.mui-table-view-cell>.mui-slider-left>.mui-btn.mui-icon,.mui-table-view-cell>.mui-slider-right>.mui-btn.mui-icon{font-size:30px}.mui-table-view-cell>.mui-slider-right{right:0;-webkit-transition:-webkit-transform 0ms ease;transition:transform 0ms ease;-webkit-transform:translateX(100%);transform:translateX(100%)}.mui-table-view-cell>.mui-slider-left{left:0;-webkit-transition:-webkit-transform 0ms ease;transition:transform 0ms ease;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.mui-table-view-cell>.mui-slider-left>.mui-btn:after{right:100%;margin-right:-1px}.mui-table-view-divider{font-weight:500;position:relative;margin-top:-1px;margin-left:0;padding-top:6px;padding-bottom:6px;padding-left:15px;color:#999;background-color:#fafafa}.mui-table-view-divider:after{position:absolute;right:0;bottom:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view-divider:before{position:absolute;top:0;right:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view .mui-media,.mui-table-view .mui-media-body{overflow:hidden}.mui-table-view .mui-media-large .mui-media-object{line-height:80px;max-width:80px;height:80px}.mui-table-view .mui-media .mui-subtitle{color:#000}.mui-table-view .mui-media-object{line-height:42px;max-width:42px;height:42px}.mui-table-view .mui-media-object.mui-pull-left{margin-right:10px}.mui-table-view .mui-media-object.mui-pull-right{margin-left:10px}.mui-table-view .mui-table-view-cell.mui-media-icon .mui-media-object{line-height:29px;max-width:29px;height:29px;margin:-4px 0}.mui-table-view .mui-table-view-cell.mui-media-icon .mui-media-object img{line-height:29px;max-width:29px;height:29px}.mui-table-view .mui-table-view-cell.mui-media-icon .mui-media-object.mui-pull-left{margin-right:10px}.mui-table-view .mui-table-view-cell.mui-media-icon .mui-media-object .mui-icon{font-size:29px}.mui-table-view .mui-table-view-cell.mui-media-icon .mui-media-body:after{position:absolute;right:0;bottom:0;left:55px;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view .mui-table-view-cell.mui-media-icon:after{height:0!important}.mui-table-view.mui-unfold .mui-table-view-cell.mui-collapse .mui-table-view{display:block}.mui-table-view.mui-unfold .mui-table-view-cell.mui-collapse .mui-table-view:after,.mui-table-view.mui-unfold .mui-table-view-cell.mui-collapse .mui-table-view:before{height:0!important}.mui-table-view.mui-unfold .mui-table-view-cell.mui-media-icon.mui-collapse .mui-media-body:after{position:absolute;right:0;bottom:0;left:70px;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view-cell>.mui-badge,.mui-table-view-cell>.mui-btn,.mui-table-view-cell>.mui-switch,.mui-table-view-cell>a>.mui-badge,.mui-table-view-cell>a>.mui-btn,.mui-table-view-cell>a>.mui-switch{position:absolute;top:50%;right:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.mui-table-view-cell .mui-navigate-right>.mui-badge,.mui-table-view-cell .mui-navigate-right>.mui-btn,.mui-table-view-cell .mui-navigate-right>.mui-switch,.mui-table-view-cell .mui-push-left>.mui-badge,.mui-table-view-cell .mui-push-left>.mui-btn,.mui-table-view-cell .mui-push-left>.mui-switch,.mui-table-view-cell .mui-push-right>.mui-badge,.mui-table-view-cell .mui-push-right>.mui-btn,.mui-table-view-cell .mui-push-right>.mui-switch,.mui-table-view-cell>a .mui-navigate-right>.mui-badge,.mui-table-view-cell>a .mui-navigate-right>.mui-btn,.mui-table-view-cell>a .mui-navigate-right>.mui-switch,.mui-table-view-cell>a .mui-push-left>.mui-badge,.mui-table-view-cell>a .mui-push-left>.mui-btn,.mui-table-view-cell>a .mui-push-left>.mui-switch,.mui-table-view-cell>a .mui-push-right>.mui-badge,.mui-table-view-cell>a .mui-push-right>.mui-btn,.mui-table-view-cell>a .mui-push-right>.mui-switch{right:35px}.mui-content>.mui-table-view:first-child{margin-top:15px}.mui-table-view-cell.mui-collapse .mui-table-view .mui-table-view-cell:last-child:after,.mui-table-view-cell.mui-collapse .mui-table-view:after,.mui-table-view-cell.mui-collapse .mui-table-view:before{height:0}.mui-table-view-cell.mui-collapse>.mui-navigate-right:after,.mui-table-view-cell.mui-collapse>.mui-push-right:after{content:'\e581'}.mui-table-view-cell.mui-collapse.mui-active{margin-top:-1px}.mui-table-view-cell.mui-collapse.mui-active .mui-collapse-content,.mui-table-view-cell.mui-collapse.mui-active .mui-table-view{display:block}.mui-table-view-cell.mui-collapse.mui-active>.mui-navigate-right:after,.mui-table-view-cell.mui-collapse.mui-active>.mui-push-right:after{content:'\e580'}.mui-table-view-cell.mui-collapse.mui-active .mui-table-view-cell>a:not(.mui-btn).mui-active{margin-left:-31px;padding-left:47px}.mui-table-view-cell.mui-collapse .mui-collapse-content{position:relative;display:none;overflow:hidden;margin:11px -15px -11px;padding:8px 15px;-webkit-transition:height .35s ease;-o-transition:height .35s ease;transition:height .35s ease;background:#fff}.mui-table-view-cell.mui-collapse .mui-collapse-content>.mui-input-group,.mui-table-view-cell.mui-collapse .mui-collapse-content>.mui-slider{width:auto;height:auto;margin:-8px -15px}.mui-table-view-cell.mui-collapse .mui-collapse-content>.mui-slider{margin:-8px -16px}.mui-table-view-cell.mui-collapse .mui-table-view{display:none;margin-top:11px;margin-right:-15px;margin-bottom:-11px;margin-left:-15px;border:0}.mui-table-view-cell.mui-collapse .mui-table-view.mui-table-view-chevron{margin-right:-65px}.mui-table-view-cell.mui-collapse .mui-table-view .mui-table-view-cell{padding-left:31px;background-position:31px 100%}.mui-table-view-cell.mui-collapse .mui-table-view .mui-table-view-cell:after{position:absolute;right:0;bottom:0;left:30px;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-table-view.mui-grid-view{font-size:0;display:block;width:100%;padding:0 10px 10px 0;white-space:normal}.mui-table-view.mui-grid-view .mui-table-view-cell{font-size:17px;display:inline-block;margin-right:-4px;padding:10px 0 0 14px;text-align:center;vertical-align:middle;background:0 0}.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-object{width:100%;max-width:100%;height:auto}.mui-table-view.mui-grid-view .mui-table-view-cell>a:not(.mui-btn){margin:-10px 0 0 -14px}.mui-table-view.mui-grid-view .mui-table-view-cell>a:not(.mui-btn).mui-active,.mui-table-view.mui-grid-view .mui-table-view-cell>a:not(.mui-btn):active{background:0 0}.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body{font-size:15px;line-height:15px;display:block;width:100%;height:15px;margin-top:8px;text-overflow:ellipsis;color:#333}.mui-table-view.mui-grid-view .mui-table-view-cell:after,.mui-table-view.mui-grid-view .mui-table-view-cell:before{height:0}.mui-grid-view.mui-grid-9{margin:0;padding:0;border-top:1px solid #eee;border-left:1px solid #eee;background-color:#f2f2f2}.mui-grid-view.mui-grid-9:after,.mui-grid-view.mui-grid-9:before{display:table;content:' '}.mui-grid-view.mui-grid-9:after{clear:both;position:static}.mui-grid-view.mui-grid-9 .mui-table-view-cell{margin:0;padding:11px 15px;vertical-align:top;border-right:1px solid #eee;border-bottom:1px solid #eee}.mui-grid-view.mui-grid-9 .mui-table-view-cell.mui-active{background-color:#eee}.mui-grid-view.mui-grid-9 .mui-table-view-cell>a:not(.mui-btn){margin:0;padding:10px 0}.mui-grid-view.mui-grid-9:before{height:0}.mui-grid-view.mui-grid-9 .mui-media{color:#797979}.mui-grid-view.mui-grid-9 .mui-media .mui-icon{font-size:2.4em;position:relative}.mui-slider-cell{position:relative}.mui-slider-cell>.mui-slider-handle{z-index:1}.mui-slider-cell>.mui-slider-left,.mui-slider-cell>.mui-slider-right{position:absolute;z-index:0;top:0;bottom:0}.mui-slider-cell>.mui-slider-left{left:0}.mui-slider-cell>.mui-slider-right{right:0}input,select,textarea{font-family:'Helvetica Neue',Helvetica,sans-serif;font-size:17px;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}input:focus,select:focus,textarea:focus{-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent;-webkit-user-modify:read-write-plaintext-only}input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{line-height:21px;width:100%;height:40px;margin-bottom:15px;padding:10px 15px;-webkit-user-select:text;border:1px solid rgba(0,0,0,.2);border-radius:3px;outline:0;background-color:#fff;-webkit-appearance:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}input[type=search]{font-size:16px;-webkit-box-sizing:border-box;box-sizing:border-box;height:34px;text-align:center;border:0;border-radius:6px;background-color:rgba(0,0,0,.1)}input[type=search]:focus{text-align:left}textarea{height:auto;resize:none}select{font-size:14px;height:auto;margin-top:1px;border:0!important;background-color:#fff}select:focus{-webkit-user-modify:read-only}.mui-input-group{position:relative;padding:0;border:0;background-color:#fff}.mui-input-group:after{position:absolute;right:0;bottom:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-input-group:before{position:absolute;top:0;right:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-input-group input,.mui-input-group textarea{margin-bottom:0;border:0;border-radius:0;background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.mui-input-group input[type=search]{background:0 0}.mui-input-group input:last-child{background-image:none}.mui-input-row{clear:left;overflow:hidden}.mui-input-row select{font-size:17px;height:37px;padding:0}.mui-input-row .mui-btn+input,.mui-input-row label+input,.mui-input-row:last-child{background:0 0}.mui-input-group .mui-input-row{height:40px}.mui-input-group .mui-input-row:after{position:absolute;right:0;bottom:0;left:15px;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-input-row label{font-family:'Helvetica Neue',Helvetica,sans-serif;line-height:1.1;float:left;width:35%;padding:11px 15px}.mui-input-row label~input,.mui-input-row label~select,.mui-input-row label~textarea{float:right;width:65%;margin-bottom:0;padding-left:0;border:0}.mui-input-row .mui-btn{line-height:1.1;float:right;width:15%;padding:10px 15px}.mui-input-row .mui-btn~input,.mui-input-row .mui-btn~select,.mui-input-row .mui-btn~textarea{float:left;width:85%;margin-bottom:0;padding-left:0;border:0}.mui-button-row{position:relative;padding-top:5px;text-align:center}.mui-input-group .mui-button-row{height:45px}.mui-input-row{position:relative}.mui-input-row.mui-input-range{overflow:visible;padding-right:20px}.mui-input-row .mui-inline{padding:8px 0}.mui-input-row .mui-input-clear~.mui-icon-clear,.mui-input-row .mui-input-password~.mui-icon-eye,.mui-input-row .mui-input-speech~.mui-icon-speech{font-size:20px;position:absolute;z-index:1;top:10px;right:0;width:38px;height:38px;text-align:center;color:#999}.mui-input-row .mui-input-clear~.mui-icon-clear.mui-active,.mui-input-row .mui-input-password~.mui-icon-eye.mui-active,.mui-input-row .mui-input-speech~.mui-icon-speech.mui-active{color:#007aff}.mui-input-row .mui-input-speech~.mui-icon-speech{font-size:24px;top:8px}.mui-input-row .mui-input-clear~.mui-icon-clear~.mui-icon-speech{display:none}.mui-input-row .mui-input-clear~.mui-icon-clear.mui-hidden~.mui-icon-speech{display:inline-block}.mui-input-row .mui-icon-speech~.mui-placeholder{right:38px}.mui-input-row.mui-search .mui-icon-clear{top:7px}.mui-input-row.mui-search .mui-icon-speech{top:5px}.mui-checkbox,.mui-radio{position:relative}.mui-checkbox label,.mui-radio label{display:inline-block;float:none;width:100%;padding-right:58px}.mui-checkbox.mui-left input[type=checkbox],.mui-radio.mui-left input[type=radio]{left:20px}.mui-checkbox.mui-left label,.mui-radio.mui-left label{padding-right:15px;padding-left:58px}.mui-checkbox input[type=checkbox],.mui-radio input[type=radio]{position:absolute;top:4px;right:20px;display:inline-block;width:28px;height:26px;border:0;outline:0!important;background-color:transparent;-webkit-appearance:none}.mui-checkbox input[type=checkbox][disabled]:before,.mui-radio input[type=radio][disabled]:before{opacity:.3}.mui-checkbox input[type=checkbox]:before,.mui-radio input[type=radio]:before{font-family:Muiicons;font-size:28px;font-weight:400;line-height:1;text-decoration:none;color:#aaa;border-radius:0;background:0 0;-webkit-font-smoothing:antialiased}.mui-checkbox input[type=checkbox]:checked:before,.mui-radio input[type=radio]:checked:before{color:#007aff}.mui-checkbox label.mui-disabled,.mui-checkbox.mui-disabled label,.mui-radio label.mui-disabled,.mui-radio.mui-disabled label{opacity:.4}.mui-radio input[type=radio]:before{content:'\e411'}.mui-radio input[type=radio]:checked:before{content:'\e441'}.mui-checkbox input[type=checkbox]:before{content:'\e411'}.mui-checkbox input[type=checkbox]:checked:before{content:'\e442'}.mui-select{position:relative}.mui-select:before{font-family:Muiicons;position:absolute;top:8px;right:21px;content:'\e581';color:rgba(170,170,170,.6)}.mui-input-row .mui-switch{float:right;margin-top:5px;margin-right:20px}.mui-input-range input[type=range]{position:relative;width:100%;height:2px;margin:17px 0;padding:0;cursor:pointer;border:0;border-radius:3px;outline:0;background-color:#999;-webkit-appearance:none!important}.mui-input-range input[type=range]::-webkit-slider-thumb{width:28px;height:28px;border-color:#0062cc;border-radius:50%;background-color:#007aff;background-clip:padding-box;-webkit-appearance:none!important}.mui-input-range label~input[type=range]{width:65%}.mui-input-range .mui-tooltip{font-size:36px;line-height:64px;position:absolute;z-index:1;top:-70px;width:64px;height:64px;text-align:center;opacity:.8;color:#333;border:1px solid #ddd;border-radius:6px;background-color:#fff;text-shadow:0 1px 0 #f3f3f3}.mui-search{position:relative}.mui-search input[type=search]{padding-left:30px}.mui-search .mui-placeholder{font-size:16px;line-height:34px;position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;display:inline-block;height:34px;text-align:center;color:#999;border:0;border-radius:6px;background:0 0}.mui-search .mui-placeholder .mui-icon{font-size:20px;color:#333}.mui-search:before{font-family:Muiicons;font-size:20px;font-weight:400;position:absolute;top:50%;right:50%;display:none;margin-top:-18px;margin-right:31px;content:'\e466'}.mui-search.mui-active:before{font-size:20px;right:auto;left:5px;display:block;margin-right:0}.mui-search.mui-active input[type=search]{text-align:left}.mui-search.mui-active .mui-placeholder{display:none}.mui-segmented-control{font-size:15px;font-weight:400;position:relative;display:table;overflow:hidden;width:100%;table-layout:fixed;border:1px solid #007aff;border-radius:3px;background-color:transparent;-webkit-touch-callout:none}.mui-segmented-control.mui-segmented-control-vertical{border-collapse:collapse;border-width:0;border-radius:0}.mui-segmented-control.mui-segmented-control-vertical .mui-control-item{display:block;border-bottom:1px solid #c8c7cc;border-left-width:0}.mui-segmented-control.mui-scroll-wrapper{height:38px}.mui-segmented-control.mui-scroll-wrapper .mui-scroll{width:auto;height:40px;white-space:nowrap}.mui-segmented-control.mui-scroll-wrapper .mui-control-item{display:inline-block;width:auto;padding:0 20px;border:0}.mui-segmented-control .mui-control-item{line-height:38px;display:table-cell;overflow:hidden;width:1%;-webkit-transition:background-color .1s linear;transition:background-color .1s linear;text-align:center;white-space:nowrap;text-overflow:ellipsis;color:#007aff;border-color:#007aff;border-left:1px solid #007aff}.mui-segmented-control .mui-control-item:first-child{border-left-width:0}.mui-segmented-control .mui-control-item.mui-active{color:#fff;background-color:#007aff}.mui-segmented-control.mui-segmented-control-inverted{width:100%;border:0;border-radius:0}.mui-segmented-control.mui-segmented-control-inverted.mui-segmented-control-vertical .mui-control-item,.mui-segmented-control.mui-segmented-control-inverted.mui-segmented-control-vertical .mui-control-item.mui-active{border-bottom:1px solid #c8c7cc}.mui-segmented-control.mui-segmented-control-inverted .mui-control-item{color:inherit;border:0}.mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active{color:#007aff;border-bottom:2px solid #007aff;background:0 0}.mui-segmented-control.mui-segmented-control-inverted~.mui-slider-progress-bar{background-color:#007aff}.mui-segmented-control-positive{border:1px solid #4cd964}.mui-segmented-control-positive .mui-control-item{color:#4cd964;border-color:inherit}.mui-segmented-control-positive .mui-control-item.mui-active{color:#fff;background-color:#4cd964}.mui-segmented-control-positive.mui-segmented-control-inverted .mui-control-item.mui-active{color:#4cd964;border-bottom:2px solid #4cd964;background:0 0}.mui-segmented-control-positive.mui-segmented-control-inverted~.mui-slider-progress-bar{background-color:#4cd964}.mui-segmented-control-negative{border:1px solid #dd524d}.mui-segmented-control-negative .mui-control-item{color:#dd524d;border-color:inherit}.mui-segmented-control-negative .mui-control-item.mui-active{color:#fff;background-color:#dd524d}.mui-segmented-control-negative.mui-segmented-control-inverted .mui-control-item.mui-active{color:#dd524d;border-bottom:2px solid #dd524d;background:0 0}.mui-segmented-control-negative.mui-segmented-control-inverted~.mui-slider-progress-bar{background-color:#dd524d}.mui-control-content{position:relative;display:none}.mui-control-content.mui-active{display:block}.mui-popover{position:absolute;z-index:999;display:none;width:280px;-webkit-transition:opacity .3s;transition:opacity .3s;-webkit-transition-property:opacity;transition-property:opacity;-webkit-transform:none;transform:none;opacity:0;border-radius:7px;background-color:#f7f7f7;-webkit-box-shadow:0 0 15px rgba(0,0,0,.1);box-shadow:0 0 15px rgba(0,0,0,.1)}.mui-popover .mui-popover-arrow{position:absolute;z-index:1000;top:-25px;left:0;overflow:hidden;width:26px;height:26px}.mui-popover .mui-popover-arrow:after{position:absolute;top:19px;left:0;width:26px;height:26px;content:' ';-webkit-transform:rotate(45deg);transform:rotate(45deg);border-radius:3px;background:#f7f7f7}.mui-popover .mui-popover-arrow.mui-bottom{top:100%;left:-26px;margin-top:-1px}.mui-popover .mui-popover-arrow.mui-bottom:after{top:-19px;left:0}.mui-popover.mui-popover-action{bottom:0;width:100%;-webkit-transition:-webkit-transform .3s,opacity .3s;transition:transform .3s,opacity .3s;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);border-radius:0;background:0 0;-webkit-box-shadow:none;box-shadow:none}.mui-popover.mui-popover-action .mui-popover-arrow{display:none}.mui-popover.mui-popover-action.mui-popover-bottom{position:fixed}.mui-popover.mui-popover-action.mui-active{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mui-popover.mui-popover-action .mui-table-view{margin:8px;text-align:center;color:#007aff;border-radius:4px}.mui-popover.mui-popover-action .mui-table-view .mui-table-view-cell:after{position:absolute;right:0;bottom:0;left:0;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);background-color:#c8c7cc}.mui-popover.mui-popover-action .mui-table-view small{font-weight:400;line-height:1.3;display:block}.mui-popover.mui-active{display:block;opacity:1}.mui-popover .mui-bar~.mui-table-view{padding-top:44px}.mui-backdrop{position:fixed;z-index:998;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.3)}.mui-bar-backdrop.mui-backdrop{bottom:50px;background:0 0}.mui-backdrop-action.mui-backdrop{background-color:rgba(0,0,0,.3)}.mui-backdrop-action.mui-backdrop,.mui-bar-backdrop.mui-backdrop{opacity:0}.mui-backdrop-action.mui-backdrop.mui-active,.mui-bar-backdrop.mui-backdrop.mui-active{-webkit-transition:all .4s ease;transition:all .4s ease;opacity:1}.mui-popover .mui-btn-block{margin-bottom:5px}.mui-popover .mui-btn-block:last-child{margin-bottom:0}.mui-popover .mui-bar{-webkit-box-shadow:none;box-shadow:none}.mui-popover .mui-bar-nav{border-bottom:1px solid rgba(0,0,0,.15);border-top-left-radius:12px;border-top-right-radius:12px;-webkit-box-shadow:none;box-shadow:none}.mui-popover .mui-scroll-wrapper{margin:7px 0;border-radius:7px;background-clip:padding-box}.mui-popover .mui-scroll .mui-table-view{max-height:none}.mui-popover .mui-table-view{overflow:auto;max-height:300px;margin-bottom:0;border-radius:7px;background-color:#f7f7f7;background-image:none;-webkit-overflow-scrolling:touch}.mui-popover .mui-table-view:after,.mui-popover .mui-table-view:before{height:0}.mui-popover .mui-table-view .mui-table-view-cell:first-child,.mui-popover .mui-table-view .mui-table-view-cell:first-child>a:not(.mui-btn){border-top-left-radius:12px;border-top-right-radius:12px}.mui-popover .mui-table-view .mui-table-view-cell:last-child,.mui-popover .mui-table-view .mui-table-view-cell:last-child>a:not(.mui-btn){border-bottom-right-radius:12px;border-bottom-left-radius:12px}.mui-popover.mui-bar-popover .mui-table-view{width:106px}.mui-popover.mui-bar-popover .mui-table-view .mui-table-view-cell{padding:11px 15px;background-position:0 100%}.mui-popover.mui-bar-popover .mui-table-view .mui-table-view-cell>a:not(.mui-btn){margin:-11px -15px -11px -15px}.mui-popup-backdrop{position:fixed;z-index:998;top:0;right:0;bottom:0;left:0;-webkit-transition-duration:400ms;transition-duration:400ms;opacity:0;background:rgba(0,0,0,.4)}.mui-popup-backdrop.mui-active{opacity:1}.mui-popup{position:fixed;z-index:10000;top:50%;left:50%;display:none;overflow:hidden;width:270px;-webkit-transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-transform:translate3d(-50%,-50%,0) scale(1.185);transform:translate3d(-50%,-50%,0) scale(1.185);text-align:center;opacity:0;color:#000;border-radius:13px}.mui-popup.mui-popup-in{display:block;-webkit-transition-duration:400ms;transition-duration:400ms;-webkit-transform:translate3d(-50%,-50%,0) scale(1);transform:translate3d(-50%,-50%,0) scale(1);opacity:1}.mui-popup.mui-popup-out{-webkit-transition-duration:400ms;transition-duration:400ms;-webkit-transform:translate3d(-50%,-50%,0) scale(1);transform:translate3d(-50%,-50%,0) scale(1);opacity:0}.mui-popup-inner{position:relative;padding:15px;border-radius:13px 13px 0 0;background:rgba(255,255,255,.95)}.mui-popup-inner:after{position:absolute;z-index:15;top:auto;right:auto;bottom:0;left:0;display:block;width:100%;height:1px;content:'';-webkit-transform:scaleY(.5);transform:scaleY(.5);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;background-color:rgba(0,0,0,.2)}.mui-popup-title{font-size:18px;font-weight:500;text-align:center}.mui-popup-title+.mui-popup-text{font-family:inherit;font-size:14px;margin:5px 0 0}.mui-popup-buttons{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;height:44px;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center}.mui-popup-button{font-size:17px;line-height:44px;position:relative;display:block;overflow:hidden;box-sizing:border-box;width:100%;height:44px;padding:0 5px;cursor:pointer;text-align:center;white-space:nowrap;text-overflow:ellipsis;color:#007aff;background:rgba(255,255,255,.95);-webkit-box-flex:1}.mui-popup-button:after{position:absolute;z-index:15;top:0;right:0;bottom:auto;left:auto;display:block;width:1px;height:100%;content:'';-webkit-transform:scaleX(.5);transform:scaleX(.5);-webkit-transform-origin:100% 50%;transform-origin:100% 50%;background-color:rgba(0,0,0,.2)}.mui-popup-button:first-child{border-radius:0 0 0 13px}.mui-popup-button:first-child:last-child{border-radius:0 0 13px 13px}.mui-popup-button:last-child{border-radius:0 0 13px}.mui-popup-button:last-child:after{display:none}.mui-popup-button.mui-popup-button-bold{font-weight:600}.mui-popup-input input{font-size:14px;width:100%;height:26px;margin:15px 0 0;padding:0 5px;border:1px solid rgba(0,0,0,.3);border-radius:0;background:#fff}.mui-plus.mui-android .mui-popup-backdrop{-webkit-transition-duration:1ms;transition-duration:1ms}.mui-plus.mui-android .mui-popup{-webkit-transition-duration:1ms;transition-duration:1ms;-webkit-transform:translate3d(-50%,-50%,0) scale(1);transform:translate3d(-50%,-50%,0) scale(1)}.mui-progressbar{position:relative;display:block;overflow:hidden;width:100%;height:2px;-webkit-transform-origin:center top;transform-origin:center top;vertical-align:middle;border-radius:2px;background:#b6b6b6;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.mui-progressbar span{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-transition:150ms;transition:150ms;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);background:#007aff}.mui-progressbar.mui-progressbar-infinite:before{position:absolute;top:0;left:0;width:100%;height:100%;content:'';-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-transform-origin:left center;transform-origin:left center;-webkit-animation:mui-progressbar-infinite 1s linear infinite;animation:mui-progressbar-infinite 1s linear infinite;background:#007aff}body>.mui-progressbar{position:absolute;z-index:10000;top:44px;left:0;border-radius:0}.mui-progressbar-in{-webkit-animation:mui-progressbar-in 300ms forwards;animation:mui-progressbar-in 300ms forwards}.mui-progressbar-out{-webkit-animation:mui-progressbar-out 300ms forwards;animation:mui-progressbar-out 300ms forwards}@-webkit-keyframes mui-progressbar-in{from{-webkit-transform:scaleY(0);opacity:0}to{-webkit-transform:scaleY(1);opacity:1}}@keyframes mui-progressbar-in{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}@-webkit-keyframes mui-progressbar-out{from{-webkit-transform:scaleY(1);opacity:1}to{-webkit-transform:scaleY(0);opacity:0}}@keyframes mui-progressbar-out{from{transform:scaleY(1);opacity:1}to{transform:scaleY(0);opacity:0}}@-webkit-keyframes mui-progressbar-infinite{0%{-webkit-transform:translate3d(-50%,0,0) scaleX(.5)}100%{-webkit-transform:translate3d(100%,0,0) scaleX(.5)}}@keyframes mui-progressbar-infinite{0%{transform:translate3d(-50%,0,0) scaleX(.5)}100%{transform:translate3d(100%,0,0) scaleX(.5)}}.mui-pagination{display:inline-block;margin:0 auto;padding-left:0;border-radius:6px}.mui-pagination>li{display:inline}.mui-pagination>li>a,.mui-pagination>li>span{line-height:1.428571429;position:relative;float:left;margin-left:-1px;padding:6px 12px;text-decoration:none;color:#007aff;border:1px solid #ddd;background-color:#fff}.mui-pagination>li:first-child>a,.mui-pagination>li:first-child>span{margin-left:0;border-top-left-radius:6px;border-bottom-left-radius:6px;background-clip:padding-box}.mui-pagination>li:last-child>a,.mui-pagination>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px;background-clip:padding-box}.mui-pagination>li.mui-active>a,.mui-pagination>li.mui-active>a:active,.mui-pagination>li.mui-active>span,.mui-pagination>li.mui-active>span:active,.mui-pagination>li:active>a,.mui-pagination>li:active>a:active,.mui-pagination>li:active>span,.mui-pagination>li:active>span:active{z-index:2;cursor:default;color:#fff;border-color:#007aff;background-color:#007aff}.mui-pagination>li.mui-disabled>a,.mui-pagination>li.mui-disabled>a:active,.mui-pagination>li.mui-disabled>span,.mui-pagination>li.mui-disabled>span:active{opacity:.6;color:#777;border:1px solid #ddd;background-color:#fff}.mui-pagination-lg>li>a,.mui-pagination-lg>li>span{font-size:18px;padding:10px 16px}.mui-pagination-sm>li>a,.mui-pagination-sm>li>span{font-size:12px;padding:5px 10px}.mui-pager{padding-left:0;list-style:none;text-align:center}.mui-pager:after,.mui-pager:before{display:table;content:' '}.mui-pager:after{clear:both}.mui-pager li{display:inline}.mui-pager li>a,.mui-pager li>span{display:inline-block;padding:5px 14px;border:1px solid #ddd;border-radius:6px;background-color:#fff;background-clip:padding-box}.mui-pager li.mui-active>a,.mui-pager li.mui-active>span,.mui-pager li:active>a,.mui-pager li:active>span{cursor:default;text-decoration:none;color:#fff;border-color:#007aff;background-color:#007aff}.mui-pager .mui-next>a,.mui-pager .mui-next>span{float:right}.mui-pager .mui-previous>a,.mui-pager .mui-previous>span{float:left}.mui-pager .mui-disabled>a,.mui-pager .mui-disabled>a:active,.mui-pager .mui-disabled>span,.mui-pager .mui-disabled>span:active{opacity:.6;color:#777;border:1px solid #ddd;background-color:#fff}.mui-modal{position:fixed;z-index:999;top:0;overflow:hidden;width:100%;min-height:100%;-webkit-transition:-webkit-transform .25s,opacity 1ms .25s;transition:transform .25s,opacity 1ms .25s;-webkit-transition-timing-function:cubic-bezier(.1,.5,.1,1);transition-timing-function:cubic-bezier(.1,.5,.1,1);-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);opacity:0;background-color:#fff}.mui-modal.mui-active{height:100%;-webkit-transition:-webkit-transform .25s;transition:transform .25s;-webkit-transition-timing-function:cubic-bezier(.1,.5,.1,1);transition-timing-function:cubic-bezier(.1,.5,.1,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}.mui-android .mui-modal .mui-bar{position:static}.mui-android .mui-modal .mui-bar-nav~.mui-content{padding-top:0}.mui-slider{position:relative;z-index:1;overflow:hidden;width:100%}.mui-slider .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active{border-bottom:0}.mui-slider .mui-segmented-control.mui-segmented-control-inverted~.mui-slider-group .mui-slider-item{border-top:1px solid #c8c7cc;border-bottom:1px solid #c8c7cc}.mui-slider .mui-slider-group{font-size:0;position:relative;-webkit-transition:all 0s linear;transition:all 0s linear;white-space:nowrap}.mui-slider .mui-slider-group .mui-slider-item{font-size:14px;position:relative;display:inline-block;width:100%;height:100%;vertical-align:top;white-space:normal}.mui-slider .mui-slider-group .mui-slider-item>a:not(.mui-control-item){line-height:0;position:relative;display:block}.mui-slider .mui-slider-group .mui-slider-item img{width:100%}.mui-slider .mui-slider-group .mui-slider-item .mui-table-view:after,.mui-slider .mui-slider-group .mui-slider-item .mui-table-view:before{height:0}.mui-slider .mui-slider-group.mui-slider-loop{-webkit-transform:translate(-100%,0);transform:translate(-100%,0)}.mui-slider-title{line-height:30px;position:absolute;bottom:0;left:0;width:100%;height:30px;margin:0;text-align:left;text-indent:12px;opacity:.8;background-color:#000}.mui-slider-indicator{position:absolute;bottom:8px;width:100%;text-align:center;background:0 0}.mui-slider-indicator.mui-segmented-control{position:relative;bottom:auto}.mui-slider-indicator .mui-indicator{display:inline-block;width:6px;height:6px;margin:1px 6px;cursor:pointer;border-radius:50%;background:#aaa;-webkit-box-shadow:0 0 1px 1px rgba(130,130,130,.7);box-shadow:0 0 1px 1px rgba(130,130,130,.7)}.mui-slider-indicator .mui-active.mui-indicator{background:#fff}.mui-slider-indicator .mui-icon{font-size:20px;line-height:30px;width:40px;height:30px;margin:3px;text-align:center;border:1px solid #ddd}.mui-slider-indicator .mui-number{line-height:32px;display:inline-block;width:58px}.mui-slider-indicator .mui-number span{color:#ff5053}.mui-slider-progress-bar{z-index:1;height:2px;-webkit-transform:translateZ(0);transform:translateZ(0)}.mui-switch{position:relative;display:block;width:74px;height:30px;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-duration:.2s;transition-duration:.2s;-webkit-transition-property:background-color,border;transition-property:background-color,border;border:2px solid #ddd;border-radius:20px;background-color:#fff;background-clip:padding-box}.mui-switch.mui-disabled{opacity:.3}.mui-switch .mui-switch-handle{position:absolute;z-index:1;top:-1px;left:-1px;width:28px;height:28px;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out;-webkit-transition-property:-webkit-transform,width,left;transition-property:transform,width,left;border-radius:16px;background-color:#fff;background-clip:padding-box;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.4);box-shadow:0 2px 5px rgba(0,0,0,.4)}.mui-switch:before{font-size:13px;position:absolute;top:3px;right:11px;content:'Off';text-transform:uppercase;color:#999}.mui-switch.mui-dragging{border-color:#f7f7f7;background-color:#f7f7f7}.mui-switch.mui-dragging .mui-switch-handle{width:38px}.mui-switch.mui-dragging.mui-active .mui-switch-handle{left:-11px;width:38px}.mui-switch.mui-active{border-color:#4cd964;background-color:#4cd964}.mui-switch.mui-active .mui-switch-handle{-webkit-transform:translate(43px,0);transform:translate(43px,0)}.mui-switch.mui-active:before{right:auto;left:15px;content:'On';color:#fff}.mui-switch input[type=checkbox]{display:none}.mui-switch-mini{width:47px}.mui-switch-mini:before{display:none}.mui-switch-mini.mui-active .mui-switch-handle{-webkit-transform:translate(16px,0);transform:translate(16px,0)}.mui-switch-blue.mui-active{border:2px solid #007aff;background-color:#007aff}.mui-content.mui-fade{left:0;opacity:0}.mui-content.mui-fade.mui-in{opacity:1}.mui-content.mui-sliding{z-index:2;-webkit-transition:-webkit-transform .4s;transition:transform .4s;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mui-content.mui-sliding.mui-left{z-index:1;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.mui-content.mui-sliding.mui-right{z-index:3;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.mui-navigate-right:after,.mui-push-left:after,.mui-push-right:after{font-family:Muiicons;font-size:inherit;line-height:1;position:absolute;top:50%;display:inline-block;-webkit-transform:translateY(-50%);transform:translateY(-50%);text-decoration:none;color:#bbb;-webkit-font-smoothing:antialiased}.mui-push-left:after{left:15px;content:'\e582'}.mui-navigate-right:after,.mui-push-right:after{right:15px;content:'\e583'}.mui-pull-bottom-pocket,.mui-pull-top-pocket{position:absolute;left:0;display:block;visibility:hidden;overflow:hidden;width:100%;height:50px}.mui-plus-pullrefresh .mui-pull-bottom-pocket,.mui-plus-pullrefresh .mui-pull-top-pocket{display:none;visibility:visible}.mui-pull-top-pocket{top:0}.mui-bar-nav~.mui-content .mui-pull-top-pocket{top:44px}.mui-bar-nav~.mui-bar-header-secondary~.mui-content .mui-pull-top-pocket{top:88px}.mui-pull-bottom-pocket{position:relative;bottom:0;height:40px}.mui-pull-bottom-pocket .mui-pull-loading{visibility:hidden}.mui-pull-bottom-pocket .mui-pull-loading.mui-in{display:inline-block}.mui-pull{font-weight:700;position:absolute;right:0;bottom:10px;left:0;text-align:center;color:#777}.mui-pull-loading{margin-right:10px;-webkit-transition:-webkit-transform .4s;transition:transform .4s;-webkit-transition-duration:400ms;transition-duration:400ms;vertical-align:middle}.mui-pull-loading.mui-reverse{-webkit-transform:rotate(180deg) translateZ(0);transform:rotate(180deg) translateZ(0)}.mui-pull-caption{font-size:15px;line-height:24px;position:relative;display:inline-block;overflow:visible;margin-top:0;vertical-align:middle}.mui-pull-caption span{display:none}.mui-pull-caption span.mui-in{display:inline}.mui-toast-container{position:fixed;z-index:9999;bottom:50px;width:100%;-webkit-transition:opacity .8s;transition:opacity .8s;opacity:0}.mui-toast-container.mui-active{opacity:1}.mui-toast-message{font-size:14px;width:270px;margin:5px auto;padding:5px;text-align:center;color:#000;border-radius:7px;background-color:#d8d8d8}.mui-numbox{position:relative;display:inline-block;overflow:hidden;width:120px;height:35px;padding:0 40px;vertical-align:top;vertical-align:middle;border:solid 1px #bbb;border-radius:3px;background-color:#efeff4}.mui-numbox [class*=btn-numbox],.mui-numbox [class*=numbox-btn]{font-size:18px;font-weight:400;line-height:100%;position:absolute;top:0;overflow:hidden;width:40px;height:100%;padding:0;color:#555;border:none;border-radius:0;background-color:#f9f9f9}.mui-numbox [class*=btn-numbox]:active,.mui-numbox [class*=numbox-btn]:active{background-color:#ccc}.mui-numbox [class*=btn-numbox][disabled],.mui-numbox [class*=numbox-btn][disabled]{color:silver}.mui-numbox .mui-btn-numbox-plus,.mui-numbox .mui-numbox-btn-plus{right:0;border-top-right-radius:3px;border-bottom-right-radius:3px}.mui-numbox .mui-btn-numbox-minus,.mui-numbox .mui-numbox-btn-minus{left:0;border-top-left-radius:3px;border-bottom-left-radius:3px}.mui-numbox .mui-input-numbox,.mui-numbox .mui-numbox-input{display:inline-block;overflow:hidden;width:100%!important;height:100%;margin:0;padding:0 3px!important;text-align:center;text-overflow:ellipsis;word-break:normal;border:none!important;border-right:solid 1px #ccc!important;border-left:solid 1px #ccc!important;border-radius:0!important}.mui-input-row .mui-numbox{float:right;margin:2px 8px}@font-face{font-family:Muiicons;font-weight:400;font-style:normal;src:url(../fonts/mui.ttf) format('truetype')}.mui-icon{font-family:Muiicons;font-size:24px;font-weight:400;font-style:normal;line-height:1;display:inline-block;text-decoration:none;-webkit-font-smoothing:antialiased}.mui-icon.mui-active{color:#007aff}.mui-icon.mui-right:before{float:right;padding-left:.2em}.mui-icon-contact:before{content:'\e100'}.mui-icon-person:before{content:'\e101'}.mui-icon-personadd:before{content:'\e102'}.mui-icon-contact-filled:before{content:'\e130'}.mui-icon-person-filled:before{content:'\e131'}.mui-icon-personadd-filled:before{content:'\e132'}.mui-icon-phone:before{content:'\e200'}.mui-icon-email:before{content:'\e201'}.mui-icon-chatbubble:before{content:'\e202'}.mui-icon-chatboxes:before{content:'\e203'}.mui-icon-phone-filled:before{content:'\e230'}.mui-icon-email-filled:before{content:'\e231'}.mui-icon-chatbubble-filled:before{content:'\e232'}.mui-icon-chatboxes-filled:before{content:'\e233'}.mui-icon-weibo:before{content:'\e260'}.mui-icon-weixin:before{content:'\e261'}.mui-icon-pengyouquan:before{content:'\e262'}.mui-icon-chat:before{content:'\e263'}.mui-icon-qq:before{content:'\e264'}.mui-icon-videocam:before{content:'\e300'}.mui-icon-camera:before{content:'\e301'}.mui-icon-mic:before{content:'\e302'}.mui-icon-location:before{content:'\e303'}.mui-icon-mic-filled:before,.mui-icon-speech:before{content:'\e332'}.mui-icon-location-filled:before{content:'\e333'}.mui-icon-micoff:before{content:'\e360'}.mui-icon-image:before{content:'\e363'}.mui-icon-map:before{content:'\e364'}.mui-icon-compose:before{content:'\e400'}.mui-icon-trash:before{content:'\e401'}.mui-icon-upload:before{content:'\e402'}.mui-icon-download:before{content:'\e403'}.mui-icon-close:before{content:'\e404'}.mui-icon-redo:before{content:'\e405'}.mui-icon-undo:before{content:'\e406'}.mui-icon-refresh:before{content:'\e407'}.mui-icon-star:before{content:'\e408'}.mui-icon-plus:before{content:'\e409'}.mui-icon-minus:before{content:'\e410'}.mui-icon-checkbox:before,.mui-icon-circle:before{content:'\e411'}.mui-icon-clear:before,.mui-icon-close-filled:before{content:'\e434'}.mui-icon-refresh-filled:before{content:'\e437'}.mui-icon-star-filled:before{content:'\e438'}.mui-icon-plus-filled:before{content:'\e439'}.mui-icon-minus-filled:before{content:'\e440'}.mui-icon-circle-filled:before{content:'\e441'}.mui-icon-checkbox-filled:before{content:'\e442'}.mui-icon-closeempty:before{content:'\e460'}.mui-icon-refreshempty:before{content:'\e461'}.mui-icon-reload:before{content:'\e462'}.mui-icon-starhalf:before{content:'\e463'}.mui-icon-spinner:before{content:'\e464'}.mui-icon-spinner-cycle:before{content:'\e465'}.mui-icon-search:before{content:'\e466'}.mui-icon-plusempty:before{content:'\e468'}.mui-icon-forward:before{content:'\e470'}.mui-icon-back:before,.mui-icon-left-nav:before{content:'\e471'}.mui-icon-checkmarkempty:before{content:'\e472'}.mui-icon-home:before{content:'\e500'}.mui-icon-navigate:before{content:'\e501'}.mui-icon-gear:before{content:'\e502'}.mui-icon-paperplane:before{content:'\e503'}.mui-icon-info:before{content:'\e504'}.mui-icon-help:before{content:'\e505'}.mui-icon-locked:before{content:'\e506'}.mui-icon-more:before{content:'\e507'}.mui-icon-flag:before{content:'\e508'}.mui-icon-home-filled:before{content:'\e530'}.mui-icon-gear-filled:before{content:'\e532'}.mui-icon-info-filled:before{content:'\e534'}.mui-icon-help-filled:before{content:'\e535'}.mui-icon-more-filled:before{content:'\e537'}.mui-icon-settings:before{content:'\e560'}.mui-icon-list:before{content:'\e562'}.mui-icon-bars:before{content:'\e563'}.mui-icon-loop:before{content:'\e565'}.mui-icon-paperclip:before{content:'\e567'}.mui-icon-eye:before{content:'\e568'}.mui-icon-arrowup:before{content:'\e580'}.mui-icon-arrowdown:before{content:'\e581'}.mui-icon-arrowleft:before{content:'\e582'}.mui-icon-arrowright:before{content:'\e583'}.mui-icon-arrowthinup:before{content:'\e584'}.mui-icon-arrowthindown:before{content:'\e585'}.mui-icon-arrowthinleft:before{content:'\e586'}.mui-icon-arrowthinright:before{content:'\e587'}.mui-icon-pulldown:before{content:'\e588'}.mui-fullscreen{position:absolute;top:0;right:0;bottom:0;left:0}.mui-fullscreen.mui-slider .mui-slider-group{height:100%}.mui-fullscreen .mui-segmented-control~.mui-slider-group{position:absolute;top:40px;bottom:0;width:100%;height:auto}.mui-fullscreen.mui-slider .mui-slider-item>a{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.mui-fullscreen .mui-off-canvas-wrap .mui-slider-item>a{top:auto;-webkit-transform:none;transform:none}.mui-bar-nav~.mui-content .mui-slider.mui-fullscreen{top:44px}.mui-bar-tab~.mui-content .mui-slider.mui-fullscreen .mui-segmented-control~.mui-slider-group{bottom:50px}.mui-android.mui-android-4-0 input:focus,.mui-android.mui-android-4-0 textarea:focus{-webkit-user-modify:inherit}.mui-android.mui-android-4-2 input,.mui-android.mui-android-4-2 textarea,.mui-android.mui-android-4-3 input,.mui-android.mui-android-4-3 textarea{-webkit-user-select:text}.mui-ios .mui-table-view-cell{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.mui-plus-visible,.mui-wechat-visible{display:none!important}.mui-plus-hidden,.mui-wechat-hidden{display:block!important}.mui-tab-item.mui-plus-hidden,.mui-tab-item.mui-wechat-hidden{display:table-cell!important}.mui-plus .mui-plus-visible,.mui-wechat .mui-wechat-visible{display:block!important}.mui-plus .mui-tab-item.mui-plus-visible,.mui-wechat .mui-tab-item.mui-wechat-visible{display:table-cell!important}.mui-plus .mui-plus-hidden,.mui-wechat .mui-wechat-hidden{display:none!important}.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav{height:64px;padding-top:20px}.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav~.mui-content{padding-top:64px}.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-header-secondary,.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-nav~.mui-content .mui-pull-top-pocket{top:64px}.mui-plus.mui-statusbar.mui-statusbar-offset .mui-bar-header-secondary~.mui-content{padding-top:94px}.mui-iframe-wrapper{position:absolute;right:0;left:0;-webkit-overflow-scrolling:touch}.mui-iframe-wrapper iframe{width:100%;height:100%;border:0} -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | .ui-page-login, 2 | body { 3 | width: 100%; 4 | height: 100%; 5 | margin: 0px; 6 | padding: 0px; 7 | } 8 | .mui-content{height: 100%;} 9 | -------------------------------------------------------------------------------- /fonts/mui.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/fonts/mui.ttf -------------------------------------------------------------------------------- /game/actor.js: -------------------------------------------------------------------------------- 1 | var actor = function(){ 2 | this.x; 3 | this.y; 4 | this.body;//体型 5 | this.actorSkin = []; 6 | this.angle; 7 | this.bodyTimer = 0; 8 | this.bodyCount = 8; 9 | } 10 | actor.prototype.init = function(){ 11 | this.body = 30;//初始化体型大小 12 | this.angle = 0; 13 | this.x = wWidth*0.5; 14 | this.y = wHeight; 15 | for(var i=0; i<10; i++){ 16 | this.actorSkin[i] = new Image(); 17 | this.actorSkin[i].src = 'images/starfish-middle'+i+'.png'; 18 | } 19 | } 20 | actor.prototype.draw = function(){ 21 | this.x = lerpDistance(mx, this.x, 0.97); 22 | this.y = lerpDistance(my, this.y, 0.97); 23 | 24 | var xDvalue = mx - this.x; 25 | var yDvalue = my - this.y; 26 | var beta = Math.atan2(yDvalue, xDvalue) + Math.PI//正切 27 | this.angle = lerpAngle(beta, this.angle, 0.7); 28 | 29 | //升级动画 30 | this.bodyTimer += subTime; 31 | if(this.bodyTimer > 100){ 32 | this.bodyCount = this.bodyCount + 1 ; 33 | this.bodyTimer = 0 ; 34 | if(this.bodyCount > 9){ 35 | this.bodyCount = 9 ; 36 | } 37 | } 38 | 39 | ctx2.save(); 40 | ctx2.translate(this.x, this.y); 41 | ctx2.rotate(this.angle - Math.PI/2); 42 | ctx2.drawImage(this.actorSkin[this.bodyCount], -this.actorSkin[this.bodyCount].width * 0.5, -this.actorSkin[this.bodyCount].height * 0.5, this.body, this.body); 43 | ctx2.restore(); 44 | } 45 | actor.prototype.bigger = function(score){ 46 | if(this.body < 80) { 47 | this.body += score; 48 | data.death += 1; 49 | } else{ 50 | gameWin() 51 | } 52 | } 53 | actor.prototype.upgrade = function(){ 54 | this.bodyCount = 0; 55 | } 56 | -------------------------------------------------------------------------------- /game/crash.js: -------------------------------------------------------------------------------- 1 | function enemyCarsh() { 2 | for(var i = 0; i < enemy.num; i++) { 3 | if(enemy.isAttack[i] && gameStatus == false) { 4 | var l = calLength(enemy.x[i], enemy.y[i], actor.x, actor.y); 5 | if(l < 900) { 6 | if(enemy.type[i] == 'small') { 7 | wave.born(enemy.x[i], enemy.y[i], 50); 8 | enemy.dead(i); 9 | actor.bigger(0.3 * difficulty); 10 | } else if(enemy.type[i] == 'middle') { 11 | if(actor.body >= 40) { 12 | wave.born(enemy.x[i], enemy.y[i], 100); 13 | enemy.dead(i); 14 | actor.bigger(0.6 * difficulty); 15 | } else { 16 | gameOver(); 17 | } 18 | } else if(enemy.type[i] == 'large') { 19 | if(actor.body >= 50) { 20 | wave.born(enemy.x[i], enemy.y[i], 120); 21 | enemy.dead(i); 22 | actor.bigger(0.8 * difficulty); 23 | } else { 24 | gameOver(); 25 | } 26 | } else if(enemy.type[i] == 'boss') { 27 | if(actor.body >= 65) { 28 | wave.born(enemy.x[i], enemy.y[i], 140); 29 | enemy.dead(i); 30 | actor.bigger(1 * difficulty); 31 | } else { 32 | gameOver(); 33 | } 34 | } 35 | } 36 | } 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /game/data.js: -------------------------------------------------------------------------------- 1 | var data = function() { 2 | this.death = 0 3 | this.level = 1 4 | this.show = '' 5 | } 6 | data.prototype.init = function() { 7 | var proh = wHeight - 20 * 2 + 2 8 | $('#data').attr('style', 'top:' + proh + 'px;padding-left: 80px;'); 9 | } 10 | data.prototype.draw = function() { 11 | $('.progress-bar').attr('style', 'width: ' + (actor.body - 30) / 50 * 100 + '%;'); 12 | $('.progress-value').hide(); 13 | if(actor.body >= 40 && actor.body < 50) { //lv2 14 | this.level = 2 15 | $('.progress-bar').removeClass('progress-bar-info') 16 | $('.progress-bar').addClass('progress-bar-success') 17 | } else if(actor.body >= 50 && actor.body < 65) { //lv3 18 | this.level = 3 19 | $('.progress-bar').removeClass('progress-bar-success') 20 | $('.progress-bar').addClass('progress-bar-warning') 21 | } else if(actor.body >= 65) { //lv4 22 | this.level = '∞' 23 | $('.progress-bar').removeClass('progress-bar-warning') 24 | $('.progress-bar').addClass('progress-bar-danger') 25 | } 26 | if(actor.body >= 40 && actor.body < 4.7 || actor.body >= 50 && actor.body < 51 || actor.body >= 65 && actor.body < 66) { 27 | actor.upgrade(); 28 | $('.progress-value').show(); 29 | } 30 | if(difficulty == 1 && moshi == 'fast') { //特殊竞速模式 31 | if(countdown > 0) { 32 | this.show = '时间：' + countdown 33 | } else { 34 | this.show = '深海绝望' 35 | } 36 | } else { 37 | this.show = '等级：' + this.level 38 | } 39 | ctx1.save(); 40 | ctx1.font = "16px 微软雅黑"; 41 | ctx1.strokeStyle = 'rgba(255, 255, 255,0.98)'; 42 | ctx1.strokeText(this.show, 10, wHeight - 20); 43 | ctx1.restore(); 44 | } 45 | 46 | function gameOver() { 47 | wxShare(true); 48 | gameStatus = true; 49 | wx.ready(function() { 50 | wx.onMenuShareTimeline({ 51 | title: '我'+theTime+'秒内消灭了'+data.death+'只生物，称霸海洋...', // 分享标题 52 | link: 'http://palxp.com/game', // 分享链接 53 | imgUrl: 'http://palxp.com/game/images/starfish-middle0.png', // 分享图标 54 | success: function() { 55 | // 用户确认分享后执行的回调函数 56 | }, 57 | cancel: function() { 58 | // 用户取消分享后执行的回调函数 59 | } 60 | }); 61 | }) 62 | mui.confirm('\n总共耗时：' + theTime + ' 秒\n消灭：' + data.death + ' 只生物', '您被吞食了', ["主界面", "英雄不朽"], function(e) { 63 | if(e.index == 0) { 64 | mui.back(); 65 | } else location.reload() 66 | }); 67 | } 68 | 69 | function gameWin() { 70 | wxShare(true); 71 | gameStatus = true; 72 | mui.confirm('\n总共消灭：' + data.death + ' 只生物', '游戏胜利，称霸海洋', ["主界面", "再来一局"], function(e) { 73 | if(e.index == 0) { 74 | mui.back(); 75 | } else location.reload() 76 | }); 77 | } 78 | function wxShare(e){ 79 | if(e){ 80 | $('#wxShare').show(); 81 | } else{ 82 | $('#wxShare').hide(); 83 | } 84 | } 85 | -------------------------------------------------------------------------------- /game/effects.js: -------------------------------------------------------------------------------- 1 | var wave = function(){ 2 | this.x = [] 3 | this.y = [] 4 | this.exist = [] 5 | this.r = [] 6 | this.power = [] 7 | } 8 | wave.prototype.num = 12; 9 | wave.prototype.init = function(){ 10 | for (var i=0; ithis.power ){ 24 | this.exist[i] = false 25 | } 26 | var alpha = 1 - this.r[i] / this.power; 27 | ctx2.beginPath(); 28 | ctx2.arc(this.x[i], this.y[i], this.r[i], 0, Math.PI*2); 29 | ctx2.closePath(); 30 | ctx2.strokeStyle = 'rgba(255, 255, 255,'+alpha+')'; 31 | ctx2.stroke(); 32 | } 33 | } 34 | ctx2.restore(); 35 | } 36 | wave.prototype.born = function(x, y, power){ 37 | for (var i=0; i 0.2 && Math.random() < 0.35) { 34 | this.EStype[i] = 2 35 | } else if(Math.random() > 0.35 && Math.random() < 0.45) { 36 | this.EStype[i] = 3 37 | } else if(Math.random() > 0.45 && Math.random() < 0.6) { 38 | this.EStype[i] = 4 39 | } else if(Math.random() > 0.6 && Math.random() < 0.8) { 40 | this.EStype[i] = 5 41 | } else this.EStype[i] = 6 42 | } 43 | this.smallEnemy.src = 'images/enemy/blowfish-icon.png'; 44 | this.middleEnemy.src = 'images/enemy/octo-icon.png'; 45 | this.largeEnemy.src = 'images/enemy/crab-icon-middle.png'; 46 | this.boss.src = 'images/enemy/squid-icon-middle.png'; 47 | } 48 | enemy.prototype.draw = function() { 49 | ctx2.strokeRect(0, 0, wWidth, wHeight); 50 | // ctx2.clearRect(this.x[i]-this.l[i]*0.5, this.y[i]-this.l[i]*0.5, this.l[i], this.l[i]) 51 | for(var i = 0; i < this.num; i++) { 52 | if(this.alive[i]) { 53 | if(this.EStype[i] == 1) { 54 | this.x[i] += Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 55 | } else if(this.EStype[i] == 2) { 56 | this.y[i] += Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 57 | } else if(this.EStype[i] == 3) { 58 | this.x[i] -= Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 59 | } else if(this.EStype[i] == 4) { 60 | this.y[i] -= Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 61 | } else if(this.EStype[i] == 5) { 62 | this.x[i] -= Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 63 | this.y[i] -= Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 64 | } else { 65 | this.x[i] += Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 66 | this.y[i] += Math.random() * this.spd[i] * this.enemySpeed[i] * subTime 67 | } 68 | var pic; 69 | if(this.type[i] == 'small') { 70 | pic = this.smallEnemy 71 | } else if(this.type[i] == 'middle') { 72 | pic = this.middleEnemy 73 | } else if(this.type[i] == 'large') { 74 | pic = this.largeEnemy 75 | } else if(this.type[i] == 'boss') { 76 | pic = this.boss 77 | } 78 | if(this.l[i] < this.body[i]) { 79 | this.l[i] += this.spd[i] * subTime 80 | } else { 81 | this.isAttack[i] = true 82 | } 83 | ctx2.drawImage(pic, this.x[i] - this.l[i] * 0.5, this.y[i] - this.l[i] * 0.5, this.l[i], this.l[i]); 84 | 85 | if(this.y[i] > wHeight || this.x[i] > wWidth || this.y[i] < 0 || this.x[i] < 0) { 86 | this.alive[i] = false; 87 | } 88 | } 89 | } 90 | } 91 | enemy.prototype.born = function(i) { 92 | this.x[i] = Math.floor(Math.random() * wWidth); 93 | this.y[i] = Math.floor(Math.random() * wHeight); 94 | this.l[i] = 0; 95 | this.body[i] = 25; 96 | this.alive[i] = true; 97 | this.isAttack[i] = false; 98 | var ran = Math.random(); 99 | if(ran < flag) { 100 | this.type[i] = 'small'; 101 | } else { 102 | if(flag == 0.7) { 103 | if(Math.random() > 0.5) { 104 | this.type[i] = 'large'; 105 | this.body[i] = 45; 106 | return; 107 | } 108 | } else if(flag == 0) { 109 | if(Math.random() > 0.35) { 110 | this.type[i] = 'large'; 111 | this.body[i] = 45; 112 | return; 113 | } else { 114 | this.type[i] = 'boss'; 115 | this.body[i] = 55; 116 | if(moshi == 'fast') { //产出boss 117 | return; 118 | } else { 119 | console.log("重新排序") 120 | var ran = Math.random(); 121 | if(ran <= 0.35) { 122 | this.type[i] = 'middle'; 123 | this.body[i] = 35; 124 | return; 125 | } else if(ran > 0.35 && ran < 0.8) { 126 | this.type[i] = 'small'; 127 | this.body[i] = 25; 128 | return; 129 | } else { 130 | this.type[i] = 'boss'; 131 | this.body[i] = 55; 132 | return; 133 | } 134 | } 135 | } 136 | } 137 | this.type[i] = 'middle'; 138 | this.body[i] = 35; 139 | } 140 | } 141 | enemy.prototype.dead = function(i) { 142 | this.alive[i] = false; 143 | this.isAttack[i] = false; 144 | } 145 | 146 | function enemyMonitor() { 147 | var enemyNum = 0; 148 | for(var i = 0; i < enemy.num; i++) { 149 | if(enemy.alive[i]) { 150 | enemyNum++ 151 | } 152 | } 153 | if(enemyNum < 15) { 154 | sendEnemy() 155 | return 156 | } 157 | } 158 | 159 | function sendEnemy() { 160 | for(var i = 0; i < enemy.num; i++) { 161 | if(!enemy.alive[i]) { 162 | enemy.born(i); 163 | return 164 | } 165 | } 166 | } -------------------------------------------------------------------------------- /game/freeModel.js: -------------------------------------------------------------------------------- 1 | var model = function() { 2 | this.x = []; 3 | this.y = []; 4 | this.bodySkin = []; 5 | this.angle = []; 6 | } 7 | model.prototype.num = 6; 8 | model.prototype.init = function() { 9 | for(var i = 0; i < this.num; i++) { 10 | mx2[i] = Math.floor(Math.random() * wWidth); 11 | my2[i] = Math.floor(Math.random() * wHeight); 12 | } 13 | for(var i = 0; i < this.num; i++) { 14 | this.angle[i] = 0; 15 | this.x[i] = wWidth * 0.5; 16 | this.y[i] = 0; 17 | } 18 | for(var i = 0; i < this.num; i++) { 19 | this.bodySkin[i] = new Image(); 20 | this.bodySkin[i].src = 'images/starfish-small' + i + '.png'; 21 | } 22 | } 23 | model.prototype.draw = function() { 24 | for(var i = 0; i < this.num; i++) { 25 | this.x[i] = lerpDistance(mx2[i], this.x[i], 0.980); 26 | this.y[i] = lerpDistance(my2[i], this.y[i], 0.980); 27 | 28 | var xDvalue = mx2[i] - this.x[i]; 29 | var yDvalue = my2[i] - this.y[i]; 30 | var beta = Math.atan2(yDvalue, xDvalue) + Math.PI //正切 31 | this.angle[i] = lerpAngle(beta, this.angle[i], 0.7); 32 | 33 | ctx.save(); 34 | ctx.translate(this.x[i], this.y[i]); 35 | ctx.rotate(this.angle[i] - Math.PI / 2); 36 | ctx.drawImage(this.bodySkin[i], -this.bodySkin[i].width * 0.5, -this.bodySkin[i].height * 0.5, 20, 20); 37 | ctx.restore(); 38 | } 39 | } -------------------------------------------------------------------------------- /game/index.js: -------------------------------------------------------------------------------- 1 | var wWidth = window.screen.width; 2 | var wHeight = document.documentElement.clientHeight; 3 | var mx = []; 4 | var mx2 = []; 5 | var my = []; 6 | var my2 = []; 7 | 8 | document.getElementById('can').setAttribute('width', wWidth); 9 | document.getElementById('can').setAttribute('height', wHeight); 10 | 11 | can = document.getElementById('can'); 12 | ctx = can.getContext('2d'); 13 | 14 | can.addEventListener("touchstart", function(e) { 15 | e.preventDefault(); 16 | for(var i = 0; i < actor.num; i++) { 17 | mx[i] = mx2[i] = e.touches[0].pageX; 18 | my[i] = my2[i] = e.touches[0].pageY; 19 | } 20 | //进行了点击 21 | document.getElementById('tip').style.display="none"; 22 | 23 | }); 24 | can.addEventListener("touchmove", function(e) { 25 | if(e.touches.length > 1 || e.scale && e.scale !== 1) return; 26 | for(var i = 0; i < actor.num; i++) { 27 | mx[i] = mx2[i] = e.touches[0].pageX; 28 | my[i] = my2[i] = e.touches[0].pageY; 29 | } 30 | }); 31 | 32 | var actor = function() { 33 | this.x = []; 34 | this.y = []; 35 | this.bodySkin = []; 36 | this.angle = []; 37 | } 38 | actor.prototype.num = 6; 39 | actor.prototype.init = function() { 40 | for(var i = 0; i < this.num; i++) { 41 | mx[i] = Math.floor(Math.random() * wWidth); 42 | my[i] = Math.floor(Math.random() * wHeight); 43 | } 44 | for(var i = 0; i < this.num; i++) { 45 | this.angle[i] = 0; 46 | this.x[i] = wWidth * 0.5; 47 | this.y[i] = wHeight; 48 | } 49 | for(var i = 0; i < this.num; i++) { 50 | this.bodySkin[i] = new Image(); 51 | this.bodySkin[i].src = 'images/starfish-small' + i + '.png'; 52 | } 53 | } 54 | actor.prototype.draw = function() { 55 | ctx.clearRect(0, 0, wWidth, wHeight); 56 | for(var i = 0; i < this.num; i++) { 57 | this.x[i] = lerpDistance(mx[i], this.x[i], 0.989); 58 | this.y[i] = lerpDistance(my[i], this.y[i], 0.989); 59 | 60 | var xDvalue = mx[i] - this.x[i]; 61 | var yDvalue = my[i] - this.y[i]; 62 | var beta = Math.atan2(yDvalue, xDvalue) + Math.PI //正切 63 | this.angle[i] = lerpAngle(beta, this.angle[i], 0.7); 64 | 65 | ctx.save(); 66 | ctx.translate(this.x[i], this.y[i]); 67 | ctx.rotate(this.angle[i] - Math.PI / 2); 68 | ctx.drawImage(this.bodySkin[i], -this.bodySkin[i].width * 0.5, -this.bodySkin[i].height * 0.5, 20, 20); 69 | ctx.restore(); 70 | } 71 | } -------------------------------------------------------------------------------- /game/main.js: -------------------------------------------------------------------------------- 1 | var can1, can2, ctx1, ctx2; 2 | var lastTime, subTime = 0; 3 | var bgPic = new Image(); 4 | var wWidth, wHight; 5 | var enemy, enemyTemp; 6 | var mx, my; 7 | var actor; 8 | var wave; 9 | var gameStatus = false; 10 | var flag = 0.8; 11 | var difficulty; //游戏难度 12 | var moshi; //游戏模式 13 | var countdown = 59 14 | var theTime = 0; //记录耗时 15 | 16 | //document.body.onload = main; 17 | 18 | function main() { 19 | //准备微信分享 http://palxp.com/spider_api/blog/json 20 | mui.ajax('http://palxp.com/jfinal_demo/weixin/circleShare?shareUrl=http://palxp.com/game/main.html', { 21 | dataType: 'json', //服务器返回json格式数据 22 | type: 'get', //HTTP请求类型 23 | async: true, 24 | timeout: 10000, //超时时间设置为10秒； 25 | success: function(data) { 26 | console.log(data); 27 | wx.config({ 28 | debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 29 | appId: 'wx3f8bf6344e14ae66', // 必填，公众号的唯一标识 30 | timestamp: data.timestamp, // 必填，生成签名的时间戳 31 | nonceStr: data.nonceStr, // 必填，生成签名的随机串 32 | signature: data.signature, // 必填，签名，见附录1 33 | jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo','hideOptionMenu','showOptionMenu','hideMenuItems','showMenuItems','hideAllNonBaseMenuItem','showAllNonBaseMenuItem'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 34 | }); 35 | wx.ready(function() { 36 | wx.onMenuShareAppMessage({ 37 | title: '天哦怎么有这么无聊的游戏', // 分享标题 38 | desc: '吃吃吃停不下来...', // 分享描述 39 | link: 'http://palxp.com/game', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致 40 | imgUrl: 'http://palxp.com/game/images/starfish-middle0.png', // 分享图标 41 | type: '', // 分享类型,music、video或link，不填默认为link 42 | dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空 43 | success: function() { 44 | // 用户确认分享后执行的回调函数 45 | }, 46 | cancel: function() { 47 | // 用户取消分享后执行的回调函数 48 | } 49 | }); 50 | }) 51 | }, 52 | error: function(xhr, type, errorThrown) { 53 | console.log("获取微信签名出错") 54 | } 55 | }); 56 | //获取游戏难度 57 | if(localStorage.getItem('difficulty')) { 58 | difficulty = localStorage.getItem('difficulty') 59 | } else { 60 | difficulty = 1 61 | } 62 | //获取游戏模式 63 | if(localStorage.getItem('moshi')) { 64 | moshi = localStorage.getItem('moshi') 65 | } else { 66 | moshi = 'normal' 67 | } 68 | 69 | init(); 70 | gameLoop(); 71 | } 72 | 73 | function init() { 74 | lastTime = Date.now(); 75 | can1 = document.getElementById('canvas1'); 76 | ctx1 = can1.getContext('2d'); 77 | can2 = document.getElementById('canvas2'); 78 | ctx2 = can1.getContext('2d'); 79 | 80 | bgPic.src = './images/background.jpeg'; 81 | 82 | // mui.plusReady(function() { 83 | // void plus.navigator.setFullscreen(false); 84 | wWidth = window.screen.width; 85 | wHeight = document.documentElement.clientHeight; 86 | // wHeight = plus.screen.resolutionHeight - plus.navigator.getStatusbarHeight() 87 | // wWidth = plus.screen.resolutionWidth 88 | $('#container').attr('height', wHeight).attr('width', wWidth); 89 | $('#canvas1').attr('height', wHeight).attr('width', wWidth); 90 | $('#canvas2').attr('height', wHeight).attr('width', wWidth); 91 | ctx1.globalAlpha = 0.9 92 | ctx1.drawImage(bgPic, 0, 0, wWidth, wHeight); //绘制背景，静态 93 | //初始化 94 | enemyTemp = 1; 95 | //定时改变敌人移动规律 96 | var timer = setInterval(function() { 97 | enemyTemp = -(enemyTemp); 98 | countdown -= 1; 99 | theTime += 1; 100 | }, 1000); 101 | //初始化敌人 102 | enemy = new enemy(); 103 | enemy.init(); 104 | //初始化主角 105 | actor = new actor(); 106 | actor.init(); 107 | 108 | mx = wWidth * 0.5; 109 | my = wHeight * 0.5; 110 | //初始化波动特效 111 | wave = new wave(); 112 | wave.init(); 113 | //到达时间出现其他怪物 114 | mui.later(function() { 115 | flag = 0.7; 116 | }, 26000); 117 | mui.later(function() { 118 | flag = 0; 119 | }, 60000); 120 | //分值计算 121 | data = new data(); 122 | data.init(); 123 | 124 | // }); 125 | 126 | can2.addEventListener("touchstart", function(e) { 127 | e.preventDefault(); 128 | if(!gameStatus) { 129 | mx = e.touches[0].pageX; 130 | my = e.touches[0].pageY; 131 | } 132 | }); 133 | can2.addEventListener("touchmove", function(e) { 134 | if(e.touches.length > 1 || e.scale && e.scale !== 1) return; 135 | if(!gameStatus) { 136 | mx = e.touches[0].pageX; 137 | my = e.touches[0].pageY; 138 | } 139 | //console.log(e.touches[0].pageX, e.touches[0].pageY); 140 | }); 141 | } 142 | 143 | function gameLoop() { 144 | window.requestAnimationFrame(gameLoop); 145 | subTime = Date.now() - lastTime; 146 | if(subTime > 40) { 147 | subTime = 40; 148 | } 149 | lastTime = Date.now(); 150 | 151 | // mui.plusReady(function() { 152 | ctx1.drawImage(bgPic, 0, 0, wWidth, wHeight); 153 | enemy.draw(); 154 | enemyMonitor(); 155 | actor.draw(); 156 | enemyCarsh(); 157 | wave.draw(); 158 | data.draw(); 159 | // }); 160 | } -------------------------------------------------------------------------------- /images/background.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/background.jpeg -------------------------------------------------------------------------------- /images/bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/bg.png -------------------------------------------------------------------------------- /images/enemy/blowfish-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/enemy/blowfish-icon.png -------------------------------------------------------------------------------- /images/enemy/crab-icon-middle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/enemy/crab-icon-middle.png -------------------------------------------------------------------------------- /images/enemy/octo-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/enemy/octo-icon.png -------------------------------------------------------------------------------- /images/enemy/squid-icon-middle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/enemy/squid-icon-middle.png -------------------------------------------------------------------------------- /images/finger3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/finger3.png -------------------------------------------------------------------------------- /images/obg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/obg.png -------------------------------------------------------------------------------- /images/starfish-middle0.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle0.png -------------------------------------------------------------------------------- /images/starfish-middle1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle1.png -------------------------------------------------------------------------------- /images/starfish-middle2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle2.png -------------------------------------------------------------------------------- /images/starfish-middle3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle3.png -------------------------------------------------------------------------------- /images/starfish-middle4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle4.png -------------------------------------------------------------------------------- /images/starfish-middle5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle5.png -------------------------------------------------------------------------------- /images/starfish-middle6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle6.png -------------------------------------------------------------------------------- /images/starfish-middle7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle7.png -------------------------------------------------------------------------------- /images/starfish-middle8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle8.png -------------------------------------------------------------------------------- /images/starfish-middle9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-middle9.png -------------------------------------------------------------------------------- /images/starfish-small0.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-small0.png -------------------------------------------------------------------------------- /images/starfish-small1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-small1.png -------------------------------------------------------------------------------- /images/starfish-small2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-small2.png -------------------------------------------------------------------------------- /images/starfish-small3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-small3.png -------------------------------------------------------------------------------- /images/starfish-small4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-small4.png -------------------------------------------------------------------------------- /images/starfish-small5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/starfish-small5.png -------------------------------------------------------------------------------- /images/weixin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/palxiao/game/85335218087d04572ca6adfd3ae7918c38347532/images/weixin.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 我是一只鱼 7 | 8 | 9 | 69 | 70 | 71 | 72 | 73 |
74 | 75 | 76 |
77 |
78 |
点击任意处
79 |
80 | 81 |
82 |
83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 132 | 133 | 134 | -------------------------------------------------------------------------------- /js/animation.js: -------------------------------------------------------------------------------- 1 | // 对运动方法进行封装 2 | Math.animation = function (from, to, duration, easing, callback) { 3 | var isUndefined = function (obj) { 4 | return typeof obj == 'undefined'; 5 | }; 6 | var isFunction = function (obj) { 7 | return typeof obj == 'function'; 8 | }; 9 | var isNumber = function(obj) { 10 | return typeof obj == 'number'; 11 | }; 12 | var isString = function(obj) { 13 | return typeof obj == 'string'; 14 | }; 15 | 16 | // 转换成毫秒 17 | var toMillisecond = function(obj) { 18 | if (isNumber(obj)) { 19 | return obj; 20 | } else if (isString(obj)) { 21 | if (/\d+m?s$/.test(obj)) { 22 | if (/ms/.test(obj)) { 23 | return 1 * obj.replace('ms', ''); 24 | } 25 | return 1000 * obj.replace('s', ''); 26 | } else if (/^\d+$/.test(obj)) { 27 | return +obj; 28 | } 29 | } 30 | return -1; 31 | }; 32 | 33 | if (!isNumber(from) || !isNumber(to)) { 34 | if (window.console) { 35 | console.error('from和to两个参数必须且为数值'); 36 | } 37 | return 0; 38 | } 39 | 40 | // 缓动算法 41 | var tween = Math.tween || window.Tween; 42 | 43 | if (!tween) { 44 | if (window.console) { 45 | console.error('缓动算法函数缺失'); 46 | } 47 | return 0; 48 | } 49 | 50 | // duration, easing, callback均为可选参数 51 | // 而且顺序可以任意 52 | var options = { 53 | duration: 300, 54 | easing: 'Linear', 55 | callback: function() {} 56 | }; 57 | 58 | var setOptions = function(obj) { 59 | if (isFunction(obj)) { 60 | options.callback = obj; 61 | } else if (toMillisecond(obj) != -1) { 62 | options.duration = toMillisecond(obj); 63 | } else if (isString(obj)) { 64 | options.easing = obj; 65 | } 66 | }; 67 | setOptions(duration); 68 | setOptions(easing); 69 | setOptions(callback); 70 | 71 | // requestAnimationFrame的兼容处理 72 | if (!window.requestAnimationFrame) { 73 | requestAnimationFrame = function (fn) { 74 | setTimeout(fn, 17); 75 | }; 76 | } 77 | 78 | // 算法需要的几个变量 79 | var start = 0; 80 | // during根据设置的总时间计算 81 | var during = Math.ceil(options.duration / 17); 82 | 83 | // 当前动画算法 84 | // 确保首字母大写 85 | options.easing = options.easing.slice(0, 1).toUpperCase() + options.easing.slice(1); 86 | var arrKeyTween = options.easing.split('.'); 87 | var fnGetValue; 88 | 89 | if (arrKeyTween.length == 1) { 90 | fnGetValue = tween[arrKeyTween[0]]; 91 | } else if (arrKeyTween.length == 2) { 92 | fnGetValue = tween[arrKeyTween[0]] && tween[arrKeyTween[0]][arrKeyTween[1]]; 93 | } 94 | if (isFunction(fnGetValue) == false) { 95 | console.error('没有找到名为"'+ options.easing +'"的动画算法'); 96 | return; 97 | } 98 | 99 | // 运动 100 | var step = function() { 101 | // 当前的运动位置 102 | var value = fnGetValue(start, from, to - from, during); 103 | 104 | // 时间递增 105 | start++; 106 | // 如果还没有运动到位，继续 107 | if (start <= during) { 108 | options.callback(value); 109 | requestAnimationFrame(step); 110 | } else { 111 | // 动画结束，这里可以插入回调... 112 | options.callback(to, true); 113 | } 114 | }; 115 | // 开始执行动画 116 | step(); 117 | }; -------------------------------------------------------------------------------- /js/app.js: -------------------------------------------------------------------------------- 1 | /** 2 | * 演示程序当前的 “注册/登录” 等操作，是基于 “本地存储” 完成的 3 | * 当您要参考这个演示程序进行相关 app 的开发时， 4 | * 请注意将相关方法调整成 “基于服务端Service” 的实现。 5 | **/ 6 | (function($, owner) { 7 | /** 8 | * 用户登录 9 | **/ 10 | owner.login = function(loginInfo, callback) { 11 | callback = callback || $.noop; 12 | loginInfo = loginInfo || {}; 13 | loginInfo.account = loginInfo.account || ''; 14 | loginInfo.password = loginInfo.password || ''; 15 | if (loginInfo.account.length < 5) { 16 | return callback('账号最短为 5 个字符'); 17 | } 18 | if (loginInfo.password.length < 6) { 19 | return callback('密码最短为 6 个字符'); 20 | } 21 | var users = JSON.parse(localStorage.getItem('$users') || '[]'); 22 | var authed = users.some(function(user) { 23 | return loginInfo.account == user.account && loginInfo.password == user.password; 24 | }); 25 | if (authed) { 26 | return owner.createState(loginInfo.account, callback); 27 | } else { 28 | return callback('用户名或密码错误'); 29 | } 30 | }; 31 | 32 | owner.createState = function(name, callback) { 33 | var state = owner.getState(); 34 | state.account = name; 35 | state.token = "token123456789"; 36 | owner.setState(state); 37 | return callback(); 38 | }; 39 | 40 | /** 41 | * 新用户注册 42 | **/ 43 | owner.reg = function(regInfo, callback) { 44 | callback = callback || $.noop; 45 | regInfo = regInfo || {}; 46 | regInfo.account = regInfo.account || ''; 47 | regInfo.password = regInfo.password || ''; 48 | if (regInfo.account.length < 5) { 49 | return callback('用户名最短需要 5 个字符'); 50 | } 51 | if (regInfo.password.length < 6) { 52 | return callback('密码最短需要 6 个字符'); 53 | } 54 | if (!checkEmail(regInfo.email)) { 55 | return callback('邮箱地址不合法'); 56 | } 57 | var users = JSON.parse(localStorage.getItem('$users') || '[]'); 58 | users.push(regInfo); 59 | localStorage.setItem('$users', JSON.stringify(users)); 60 | return callback(); 61 | }; 62 | 63 | /** 64 | * 获取当前状态 65 | **/ 66 | owner.getState = function() { 67 | var stateText = localStorage.getItem('$state') || "{}"; 68 | return JSON.parse(stateText); 69 | }; 70 | 71 | /** 72 | * 设置当前状态 73 | **/ 74 | owner.setState = function(state) { 75 | state = state || {}; 76 | localStorage.setItem('$state', JSON.stringify(state)); 77 | //var settings = owner.getSettings(); 78 | //settings.gestures = ''; 79 | //owner.setSettings(settings); 80 | }; 81 | 82 | var checkEmail = function(email) { 83 | email = email || ''; 84 | return (email.length > 3 && email.indexOf('@') > -1); 85 | }; 86 | 87 | /** 88 | * 找回密码 89 | **/ 90 | owner.forgetPassword = function(email, callback) { 91 | callback = callback || $.noop; 92 | if (!checkEmail(email)) { 93 | return callback('邮箱地址不合法'); 94 | } 95 | return callback(null, '新的随机密码已经发送到您的邮箱，请查收邮件。'); 96 | }; 97 | 98 | /** 99 | * 获取应用本地配置 100 | **/ 101 | owner.setSettings = function(settings) { 102 | settings = settings || {}; 103 | localStorage.setItem('$settings', JSON.stringify(settings)); 104 | } 105 | 106 | /** 107 | * 设置应用本地配置 108 | **/ 109 | owner.getSettings = function() { 110 | var settingsText = localStorage.getItem('$settings') || "{}"; 111 | return JSON.parse(settingsText); 112 | } 113 | /** 114 | * 获取本地是否安装客户端 115 | **/ 116 | owner.isInstalled = function(id) { 117 | if (id === 'qihoo' && mui.os.plus) { 118 | return true; 119 | } 120 | if (mui.os.android) { 121 | var main = plus.android.runtimeMainActivity(); 122 | var packageManager = main.getPackageManager(); 123 | var PackageManager = plus.android.importClass(packageManager) 124 | var packageName = { 125 | "qq": "com.tencent.mobileqq", 126 | "weixin": "com.tencent.mm", 127 | "sinaweibo": "com.sina.weibo" 128 | } 129 | try { 130 | return packageManager.getPackageInfo(packageName[id], PackageManager.GET_ACTIVITIES); 131 | } catch (e) {} 132 | } else { 133 | switch (id) { 134 | case "qq": 135 | var TencentOAuth = plus.ios.import("TencentOAuth"); 136 | return TencentOAuth.iphoneQQInstalled(); 137 | case "weixin": 138 | var WXApi = plus.ios.import("WXApi"); 139 | return WXApi.isWXAppInstalled() 140 | case "sinaweibo": 141 | var SinaAPI = plus.ios.import("WeiboSDK"); 142 | return SinaAPI.isWeiboAppInstalled() 143 | default: 144 | break; 145 | } 146 | } 147 | } 148 | }(mui, window.app = {})); -------------------------------------------------------------------------------- /js/mui.enterfocus.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | $.enterfocus = function(selector, callback) { 3 | var boxArray = [].slice.call(document.querySelectorAll(selector)); 4 | for (var index in boxArray) { 5 | var box = boxArray[index]; 6 | box.addEventListener('keyup', function(event) { 7 | if (event.keyCode == 13) { 8 | var boxIndex = boxArray.indexOf(this); 9 | if (boxIndex == boxArray.length - 1) { 10 | if (callback) callback(); 11 | } else { 12 | //console.log(boxIndex); 13 | var nextBox = boxArray[++boxIndex]; 14 | nextBox.focus(); 15 | } 16 | } 17 | }, false); 18 | } 19 | }; 20 | }(window.mui = window.mui || {})); -------------------------------------------------------------------------------- /js/mui.locker.js: -------------------------------------------------------------------------------- 1 | /** 2 | * 手势锁屏插件 3 | * varstion 1.0.5 4 | * by Houfeng 5 | * Houfeng@DCloud.io 6 | */ 7 | 8 | (function($, doc) { 9 | 10 | var touchSupport = ('ontouchstart' in document); 11 | var startEventName = touchSupport ? 'touchstart' : 'mousedown'; 12 | var moveEventName = touchSupport ? 'touchmove' : 'mousemove'; 13 | var endEventName = touchSupport ? 'touchend' : 'mouseup'; 14 | var lockerHolderClassName = $.className('locker-holder'); 15 | var lockerClassName = $.className('locker'); 16 | 17 | var styleHolder = doc.querySelector('head') || doc.querySelector('body'); 18 | styleHolder.innerHTML += ""; 19 | 20 | var times = 4; 21 | 22 | function getElementLeft(element) {　　　　 23 | var actualLeft = element.offsetLeft;　　　　 24 | var current = element.offsetParent;　　　　 25 | while (current !== null) {　　　　　　 26 | actualLeft += current.offsetLeft;　　　　　　 27 | current = current.offsetParent;　　　　 28 | }　　　　 29 | return actualLeft;　　 30 | }　　 31 | 32 | function getElementTop(element) {　　　　 33 | var actualTop = element.offsetTop;　　　　 34 | var current = element.offsetParent;　　　　 35 | while (current !== null) {　　　　　　 36 | actualTop += current.offsetTop;　　　　　　 37 | current = current.offsetParent;　　　　 38 | }　　　　 39 | return actualTop;　　 40 | } 41 | 42 | //定义 Locker 类 43 | var Locker = $.Locker = $.Class.extend({ 44 | R: 26, 45 | CW: 400, 46 | CH: 320, 47 | OffsetX: 30, 48 | OffsetY: 30, 49 | 50 | /** 51 | * 构造函数 52 | * */ 53 | init: function(holder, options) { 54 | var self = this; 55 | if (!holder) { 56 | throw "构造 Locker 时缺少容器元素"; 57 | } 58 | self.holder = holder; 59 | //避免重复初始化开始 60 | if (self.holder.__locker_inited) return; 61 | self.holder.__locker_inited = true; 62 | //避免重复初始化结束 63 | // 64 | self.options = options || {}; 65 | self.options.callback = self.options.callback || self.options.done || $.noop; 66 | self.holder.innerHTML = ''; 67 | // 68 | self.holder.classList.add(lockerHolderClassName); 69 | //初始化 70 | var canvas = self.canvas = $.qsa('canvas', self.holder)[0]; 71 | canvas.on = canvas.addEventListener || function(name, handler, capture) { 72 | canvas.attachEvent('on' + name, handler, capture); 73 | }; 74 | canvas.off = canvas.removeEventListener || function(name, handler, capture) { 75 | canvas.detachEvent('on' + name, handler, capture); 76 | }; 77 | // 78 | if (self.options.width) self.holder.style.width = self.options.width + 'px'; 79 | if (self.options.height) self.holder.style.height = self.options.height + 'px'; 80 | self.CW = self.options.width || self.holder.offsetWidth || self.CW; 81 | self.CH = self.options.height || self.holder.offsetHeight || self.CH; 82 | //处理 “宽、高” 等数值, 全部扩大 times 倍 83 | self.R *= times; 84 | self.CW *= times; 85 | self.CH *= times; 86 | self.OffsetX *= times; 87 | self.OffsetY *= times; 88 | // 89 | canvas.width = self.CW; 90 | canvas.height = self.CH; 91 | var cxt = self.cxt = canvas.getContext("2d"); 92 | //两个圆之间的外距离 就是说两个圆心的距离去除两个半径 93 | var X = (self.CW - 2 * self.OffsetX - self.R * 2 * 3) / 2; 94 | var Y = (self.CH - 2 * self.OffsetY - self.R * 2 * 3) / 2; 95 | self.pointLocationArr = self.caculateNinePointLotion(X, Y); 96 | self.initEvent(canvas, cxt, self.holder); 97 | //console.log(X); 98 | self.draw(cxt, self.pointLocationArr, [], null); 99 | setTimeout(function() { 100 | self.draw(cxt, self.pointLocationArr, [], null); 101 | }, 0); 102 | }, 103 | 104 | /** 105 | * 计算 106 | */ 107 | caculateNinePointLotion: function(diffX, diffY) { 108 | var self = this; 109 | var Re = []; 110 | for (var row = 0; row < 3; row++) { 111 | for (var col = 0; col < 3; col++) { 112 | var Point = { 113 | X: (self.OffsetX + col * diffX + (col * 2 + 1) * self.R), 114 | Y: (self.OffsetY + row * diffY + (row * 2 + 1) * self.R) 115 | }; 116 | Re.push(Point); 117 | } 118 | } 119 | return Re; 120 | }, 121 | 122 | /** 123 | * 绘制 124 | */ 125 | draw: function(cxt, _PointLocationArr, _LinePointArr, touchPoint) { 126 | var self = this; 127 | var R = self.R; 128 | if (_LinePointArr.length > 0) { 129 | cxt.beginPath(); 130 | for (var i = 0; i < _LinePointArr.length; i++) { 131 | var pointIndex = _LinePointArr[i]; 132 | cxt.lineTo(_PointLocationArr[pointIndex].X, _PointLocationArr[pointIndex].Y); 133 | } 134 | cxt.lineWidth = 2 * times; 135 | cxt.strokeStyle = self.options.lineColor || "#999"; //连结线颜色 136 | cxt.stroke(); 137 | cxt.closePath(); 138 | if (touchPoint != null) { 139 | var lastPointIndex = _LinePointArr[_LinePointArr.length - 1]; 140 | var lastPoint = _PointLocationArr[lastPointIndex]; 141 | cxt.beginPath(); 142 | cxt.moveTo(lastPoint.X, lastPoint.Y); 143 | cxt.lineTo(touchPoint.X, touchPoint.Y); 144 | cxt.stroke(); 145 | cxt.closePath(); 146 | } 147 | } 148 | for (var i = 0; i < _PointLocationArr.length; i++) { 149 | var Point = _PointLocationArr[i]; 150 | cxt.fillStyle = self.options.ringColor || "#888"; //圆圈边框颜色 151 | cxt.beginPath(); 152 | cxt.arc(Point.X, Point.Y, R, 0, Math.PI * times, true); 153 | cxt.closePath(); 154 | cxt.fill(); 155 | cxt.fillStyle = self.options.fillColor || "#f3f3f3"; //圆圈填充颜色 156 | cxt.beginPath(); 157 | cxt.arc(Point.X, Point.Y, R - (2 * times), 0, Math.PI * times, true); 158 | cxt.closePath(); 159 | cxt.fill(); 160 | if (_LinePointArr.indexOf(i) >= 0) { 161 | cxt.fillStyle = self.options.pointColor || "#777"; //圆圈中心点颜色 162 | cxt.beginPath(); 163 | cxt.arc(Point.X, Point.Y, R - (16 * times), 0, Math.PI * times, true); 164 | cxt.closePath(); 165 | cxt.fill(); 166 | } 167 | } 168 | }, 169 | 170 | isPointSelect: function(touches, linePoint) { 171 | var self = this; 172 | for (var i = 0; i < self.pointLocationArr.length; i++) { 173 | var currentPoint = self.pointLocationArr[i]; 174 | var xdiff = Math.abs(currentPoint.X - touches.elementX); 175 | var ydiff = Math.abs(currentPoint.Y - touches.elementY); 176 | var dir = Math.pow((xdiff * xdiff + ydiff * ydiff), 0.5); 177 | if (dir < self.R) { 178 | if (linePoint.indexOf(i) < 0) { 179 | linePoint.push(i); 180 | } 181 | break; 182 | } 183 | } 184 | }, 185 | 186 | initEvent: function(canvas, cxt, holder) { 187 | var self = this; 188 | var linePoint = []; 189 | var isDown = false; //针对鼠标事件 190 | //start 191 | self._startHandler = function(e) { 192 | e.point = event.changedTouches ? event.changedTouches[0] : event; 193 | e.point.elementX = (e.point.pageX - getElementLeft(holder)) * times; 194 | e.point.elementY = (e.point.pageY - getElementTop(holder)) * times; 195 | self.isPointSelect(e.point, linePoint); 196 | isDown = true; 197 | }; 198 | canvas.on(startEventName, self._startHandler, false); 199 | //move 200 | self._moveHanlder = function(e) { 201 | if (!isDown) return; 202 | e.preventDefault(); 203 | e.point = event.changedTouches ? event.changedTouches[0] : event; 204 | e.point.elementX = (e.point.pageX - getElementLeft(holder)) * times; 205 | e.point.elementY = (e.point.pageY - getElementTop(holder)) * times; 206 | var touches = e.point; 207 | self.isPointSelect(touches, linePoint); 208 | cxt.clearRect(0, 0, self.CW, self.CH); 209 | self.draw(cxt, self.pointLocationArr, linePoint, { 210 | X: touches.elementX, 211 | Y: touches.elementY 212 | }); 213 | }; 214 | canvas.on(moveEventName, self._moveHanlder, false); 215 | //end 216 | self._endHandler = function(e) { 217 | e.point = event.changedTouches ? event.changedTouches[0] : event; 218 | e.point.elementX = (e.point.pageX - getElementLeft(holder)) * times; 219 | e.point.elementY = (e.point.pageY - getElementTop(holder)) * times; 220 | cxt.clearRect(0, 0, self.CW, self.CH); 221 | self.draw(cxt, self.pointLocationArr, linePoint, null); 222 | //事件数据 223 | var eventData = { 224 | sender: self, 225 | points: linePoint 226 | }; 227 | /* 228 | * 回调完成事件 229 | * 230 | * 备注: 231 | * 比较理想的做法是为 Locker 的实例启用事件机制，比如 locker.on('done',handler); 232 | * 在 mui 没有完整的公共事件模块前，此版本中 locker 实例暂通过 options.callback 处理 233 | */ 234 | self.options.callback(eventData); 235 | //触发声明的DOM的自定义事件(暂定 done 为事件名，可以考虑更有针对的事件名 ) 236 | $.trigger(self.holder, 'done', eventData); 237 | //- 238 | linePoint = []; 239 | isDown = false; 240 | }; 241 | canvas.on(endEventName, self._endHandler, false); 242 | }, 243 | 244 | pointLocationArr: [], 245 | 246 | /** 247 | * 清除图形 248 | * */ 249 | clear: function() { 250 | var self = this; 251 | //self.pointLocationArr = []; 252 | if (self.cxt) { 253 | self.cxt.clearRect(0, 0, self.CW, self.CH); 254 | self.draw(self.cxt, self.pointLocationArr, [], { 255 | X: 0, 256 | Y: 0 257 | }); 258 | } 259 | }, 260 | 261 | /** 262 | * 释放资源 263 | * */ 264 | dispose: function() { 265 | var self = this; 266 | self.cxt = null; 267 | self.canvas.off(startEventName, self._startHandler); 268 | self.canvas.off(moveEventName, self._moveHandler); 269 | self.canvas.off(endEventName, self._endHandler); 270 | self.holder.innerHTML = ''; 271 | self.canvas = null; 272 | } 273 | }); 274 | 275 | //添加 locker 插件 276 | $.fn.locker = function(options) { 277 | //遍历选择的元素 278 | this.each(function(i, element) { 279 | if (options) { 280 | new Locker(element, options); 281 | } else { 282 | var optionsText = element.getAttribute('data-locker-options'); 283 | var options = optionsText ? JSON.parse(optionsText) : {}; 284 | options.lineColor = element.getAttribute('data-locker-line-color') || options.lineColor; 285 | options.ringColor = element.getAttribute('data-locker-ring-color') || options.ringColor; 286 | options.fillColor = element.getAttribute('data-locker-fill-color') || options.fillColor; 287 | options.pointColor = element.getAttribute('data-locker-point-color') || options.pointColor; 288 | options.width = element.getAttribute('data-locker-width') || options.width; 289 | options.height = element.getAttribute('data-locker-height') || options.height; 290 | new Locker(element, options); 291 | } 292 | }); 293 | return this; 294 | }; 295 | 296 | //自动处理 class='mui-locker' 的 dom 297 | try { 298 | $('.' + lockerClassName).locker(); 299 | } catch (ex) {} 300 | $.ready(function() { 301 | $('.' + lockerClassName).locker(); 302 | }); 303 | 304 | }(mui, document)); -------------------------------------------------------------------------------- /js/tween.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tween.js 3 | * t: current time（当前时间）； 4 | * b: beginning value（初始值）； 5 | * c: change in value（变化量）； 6 | * d: duration（持续时间）。 7 | * you can visit 'http://easings.net/zh-cn' to get effect 8 | */ 9 | var Tween = { 10 | Linear: function(t, b, c, d) { return c*t/d + b; }, 11 | Quad: { 12 | easeIn: function(t, b, c, d) { 13 | return c * (t /= d) * t + b; 14 | }, 15 | easeOut: function(t, b, c, d) { 16 | return -c *(t /= d)*(t-2) + b; 17 | }, 18 | easeInOut: function(t, b, c, d) { 19 | if ((t /= d / 2) < 1) return c / 2 * t * t + b; 20 | return -c / 2 * ((--t) * (t-2) - 1) + b; 21 | } 22 | }, 23 | Cubic: { 24 | easeIn: function(t, b, c, d) { 25 | return c * (t /= d) * t * t + b; 26 | }, 27 | easeOut: function(t, b, c, d) { 28 | return c * ((t = t/d - 1) * t * t + 1) + b; 29 | }, 30 | easeInOut: function(t, b, c, d) { 31 | if ((t /= d / 2) < 1) return c / 2 * t * t*t + b; 32 | return c / 2*((t -= 2) * t * t + 2) + b; 33 | } 34 | }, 35 | Quart: { 36 | easeIn: function(t, b, c, d) { 37 | return c * (t /= d) * t * t*t + b; 38 | }, 39 | easeOut: function(t, b, c, d) { 40 | return -c * ((t = t/d - 1) * t * t*t - 1) + b; 41 | }, 42 | easeInOut: function(t, b, c, d) { 43 | if ((t /= d / 2) < 1) return c / 2 * t * t * t * t + b; 44 | return -c / 2 * ((t -= 2) * t * t*t - 2) + b; 45 | } 46 | }, 47 | Quint: { 48 | easeIn: function(t, b, c, d) { 49 | return c * (t /= d) * t * t * t * t + b; 50 | }, 51 | easeOut: function(t, b, c, d) { 52 | return c * ((t = t/d - 1) * t * t * t * t + 1) + b; 53 | }, 54 | easeInOut: function(t, b, c, d) { 55 | if ((t /= d / 2) < 1) return c / 2 * t * t * t * t * t + b; 56 | return c / 2*((t -= 2) * t * t * t * t + 2) + b; 57 | } 58 | }, 59 | Sine: { 60 | easeIn: function(t, b, c, d) { 61 | return -c * Math.cos(t/d * (Math.PI/2)) + c + b; 62 | }, 63 | easeOut: function(t, b, c, d) { 64 | return c * Math.sin(t/d * (Math.PI/2)) + b; 65 | }, 66 | easeInOut: function(t, b, c, d) { 67 | return -c / 2 * (Math.cos(Math.PI * t/d) - 1) + b; 68 | } 69 | }, 70 | Expo: { 71 | easeIn: function(t, b, c, d) { 72 | return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; 73 | }, 74 | easeOut: function(t, b, c, d) { 75 | return (t==d) ? b + c : c * (-Math.pow(2, -10 * t/d) + 1) + b; 76 | }, 77 | easeInOut: function(t, b, c, d) { 78 | if (t==0) return b; 79 | if (t==d) return b+c; 80 | if ((t /= d / 2) < 1) return c / 2 * Math.pow(2, 10 * (t - 1)) + b; 81 | return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b; 82 | } 83 | }, 84 | Circ: { 85 | easeIn: function(t, b, c, d) { 86 | return -c * (Math.sqrt(1 - (t /= d) * t) - 1) + b; 87 | }, 88 | easeOut: function(t, b, c, d) { 89 | return c * Math.sqrt(1 - (t = t/d - 1) * t) + b; 90 | }, 91 | easeInOut: function(t, b, c, d) { 92 | if ((t /= d / 2) < 1) return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b; 93 | return c / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1) + b; 94 | } 95 | }, 96 | Elastic: { 97 | easeIn: function(t, b, c, d, a, p) { 98 | var s; 99 | if (t==0) return b; 100 | if ((t /= d) == 1) return b + c; 101 | if (typeof p == "undefined") p = d * .3; 102 | if (!a || a < Math.abs(c)) { 103 | s = p / 4; 104 | a = c; 105 | } else { 106 | s = p / (2 * Math.PI) * Math.asin(c / a); 107 | } 108 | return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b; 109 | }, 110 | easeOut: function(t, b, c, d, a, p) { 111 | var s; 112 | if (t==0) return b; 113 | if ((t /= d) == 1) return b + c; 114 | if (typeof p == "undefined") p = d * .3; 115 | if (!a || a < Math.abs(c)) { 116 | a = c; 117 | s = p / 4; 118 | } else { 119 | s = p/(2*Math.PI) * Math.asin(c/a); 120 | } 121 | return (a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b); 122 | }, 123 | easeInOut: function(t, b, c, d, a, p) { 124 | var s; 125 | if (t==0) return b; 126 | if ((t /= d / 2) == 2) return b+c; 127 | if (typeof p == "undefined") p = d * (.3 * 1.5); 128 | if (!a || a < Math.abs(c)) { 129 | a = c; 130 | s = p / 4; 131 | } else { 132 | s = p / (2 *Math.PI) * Math.asin(c / a); 133 | } 134 | if (t < 1) return -.5 * (a * Math.pow(2, 10* (t -=1 )) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b; 135 | return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p ) * .5 + c + b; 136 | } 137 | }, 138 | Back: { 139 | easeIn: function(t, b, c, d, s) { 140 | if (typeof s == "undefined") s = 1.70158; 141 | return c * (t /= d) * t * ((s + 1) * t - s) + b; 142 | }, 143 | easeOut: function(t, b, c, d, s) { 144 | if (typeof s == "undefined") s = 1.70158; 145 | return c * ((t = t/d - 1) * t * ((s + 1) * t + s) + 1) + b; 146 | }, 147 | easeInOut: function(t, b, c, d, s) { 148 | if (typeof s == "undefined") s = 1.70158; 149 | if ((t /= d / 2) < 1) return c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b; 150 | return c / 2*((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b; 151 | } 152 | }, 153 | Bounce: { 154 | easeIn: function(t, b, c, d) { 155 | return c - Tween.Bounce.easeOut(d-t, 0, c, d) + b; 156 | }, 157 | easeOut: function(t, b, c, d) { 158 | if ((t /= d) < (1 / 2.75)) { 159 | return c * (7.5625 * t * t) + b; 160 | } else if (t < (2 / 2.75)) { 161 | return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b; 162 | } else if (t < (2.5 / 2.75)) { 163 | return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b; 164 | } else { 165 | return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b; 166 | } 167 | }, 168 | easeInOut: function(t, b, c, d) { 169 | if (t < d / 2) { 170 | return Tween.Bounce.easeIn(t * 2, 0, c, d) * .5 + b; 171 | } else { 172 | return Tween.Bounce.easeOut(t * 2 - d, 0, c, d) * .5 + c * .5 + b; 173 | } 174 | } 175 | } 176 | } 177 | Math.tween = Tween; -------------------------------------------------------------------------------- /main.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 我是一只鱼 8 | 9 | 10 | 11 | 12 | 13 | 117 | 118 | 119 | 120 |
121 |
122 |
123 | 124 |
125 |
126 | 140 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 | 156 | 157 | -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "@platforms": ["android", "iPhone", "iPad"], 3 | "id": "H53E208C6",/*应用的标识，创建应用时自动生成，勿手动修改*/ 4 | "name": "testM",/*应用名称，程序桌面图标名称*/ 5 | "version": { 6 | "name": "1.0.0",/*应用版本名称*/ 7 | "code": "83" 8 | }, 9 | "description": "",/*应用描述信息*/ 10 | "icons": { 11 | "72": "icon.png" 12 | }, 13 | "launch_path": "index.html",/*应用的入口页面，默认为根目录下的index.html；支持网络地址，必须以http://或https://开头*/ 14 | "developer": { 15 | "name": "",/*开发者名称*/ 16 | "email": "",/*开发者邮箱地址*/ 17 | "url": "http://www.dcloud.io" 18 | }, 19 | "permissions": { 20 | "Accelerometer": { 21 | "description": "访问加速度感应器" 22 | }, 23 | "Audio": { 24 | "description": "访问麦克风" 25 | }, 26 | "Cache": { 27 | "description": "管理应用缓存" 28 | }, 29 | "Camera": { 30 | "description": "访问摄像头" 31 | }, 32 | "Console": { 33 | "description": "跟踪调试输出日志" 34 | }, 35 | "Contacts": { 36 | "description": "访问系统联系人信息" 37 | }, 38 | "Device": { 39 | "description": "访问设备信息" 40 | }, 41 | "Downloader": { 42 | "description": "文件下载管理" 43 | }, 44 | "Events": { 45 | "description": "应用扩展事件" 46 | }, 47 | "File": { 48 | "description": "访问本地文件系统" 49 | }, 50 | "Gallery": { 51 | "description": "访问系统相册" 52 | }, 53 | "Geolocation": { 54 | "description": "访问位置信息" 55 | }, 56 | "Invocation": { 57 | "description": "使用Native.js能力" 58 | }, 59 | "Messaging": { 60 | "description": "访问通讯能力" 61 | }, 62 | "Orientation": { 63 | "description": "访问方向感应器" 64 | }, 65 | "Proximity": { 66 | "description": "访问距离感应器" 67 | }, 68 | "Storage": { 69 | "description": "管理应用本地数据" 70 | }, 71 | 72 | "Uploader": { 73 | "description": "管理文件上传任务" 74 | }, 75 | "Runtime": { 76 | "description": "访问运行期环境" 77 | }, 78 | "XMLHttpRequest": { 79 | "description": "跨域网络访问" 80 | }, 81 | "Zip": { 82 | "description": "文件压缩与解压缩" 83 | }, 84 | "Barcode": { 85 | "description": "管理二维码扫描插件" 86 | }, 87 | "Maps": { 88 | "description": "管理地图插件" 89 | }, 90 | "Speech": { 91 | "description": "管理语音识别插件" 92 | }, 93 | "Webview":{ 94 | "description": "窗口管理" 95 | }, 96 | "NativeUI":{ 97 | "description": "原生UI控件" 98 | }, 99 | "Navigator":{ 100 | "description": "浏览器信息" 101 | }, 102 | "NativeObj":{ 103 | "description": "原生对象" 104 | } 105 | }, 106 | "plus": { 107 | "splashscreen": { 108 | "autoclose": true,/*是否自动关闭程序启动界面，true表示应用加载应用入口页面后自动关闭；false则需调plus.navigator.closeSplashscreen()关闭*/ 109 | "waiting": true 110 | }, 111 | "runmode": "liberate",/*应用的首次启动运行模式，可取liberate或normal，liberate模式在第一次启动时将解压应用资源（Android平台File API才可正常访问_www目录）*/ 112 | "signature": "Sk9JTiBVUyBtYWlsdG86aHIyMDEzQGRjbG91ZC5pbw==",/*可选，保留给应用签名，暂不使用*/ 113 | "distribute": { 114 | "apple": { 115 | "appid": "",/*iOS应用标识，苹果开发网站申请的appid，如io.dcloud.HelloH5*/ 116 | "mobileprovision": "",/*iOS应用打包配置文件*/ 117 | "password": "",/*iOS应用打包个人证书导入密码*/ 118 | "p12": "",/*iOS应用打包个人证书，打包配置文件关联的个人证书*/ 119 | "devices": "universal",/*iOS应用支持的设备类型，可取值iphone/ipad/universal*/ 120 | "frameworks": [] 121 | }, 122 | "google": { 123 | "packagename": "",/*Android应用包名，如io.dcloud.HelloH5*/ 124 | "keystore": "",/*Android应用打包使用的密钥库文件*/ 125 | "password": "",/*Android应用打包使用密钥库中证书的密码*/ 126 | "aliasname": "",/*Android应用打包使用密钥库中证书的别名*/ 127 | "permissions": ["","","","","","","","","","","","","","","","","","","","","","","",""] 128 | }, 129 | "orientation": ["portrait-primary", "portrait-secondary"],/*应用支持的方向，portrait-primary：竖屏正方向；portrait-secondary：竖屏反方向；landscape-primary：横屏正方向；landscape-secondary：横屏反方向*/ 130 | "icons": { 131 | "ios": { 132 | "prerendered": true, /*应用图标是否已经高亮处理，在iOS6及以下设备上有效*/ 133 | "auto": "", /*应用图标，分辨率：512x512，用于自动生成各种尺寸程序图标*/ 134 | "iphone": { 135 | "normal": "",/*iPhone普通屏幕程序图标，分辨率：57x57*/ 136 | "retina": "",/*iPhone高分屏程序图标，分辨率：114x114*/ 137 | "retina7": "",/*iPhone iOS7高分屏程序图标，分辨率：120x120*/ 138 | "spotlight-normal": "", /*iPhone Spotlight搜索程序图标，分辨率：29x29*/ 139 | "spotlight-retina": "", /*iPhone高分屏Spotlight搜索程序图标，分辨率：58x58*/ 140 | "spotlight-retina7": "",/*iPhone iOS7高分屏Spotlight搜索程序图标，分辨率：80x80*/ 141 | "settings-normal": "", /*iPhone设置页面程序图标，分辨率：29x29*/ 142 | "settings-retina": "" 143 | }, 144 | "ipad": { 145 | "normal": "", /*iPad普通屏幕程序图标，分辨率：72x72*/ 146 | "retina": "", /*iPad高分屏程序图标，分辨率：144x144*/ 147 | "normal7": "", /*iPad iOS7程序图标，分辨率：76x76*/ 148 | "retina7": "", /*iPad iOS7高分屏程序图标，分辨率：152x152*/ 149 | "spotlight-normal": "", /*iPad Spotlight搜索程序图标，分辨率：50x50*/ 150 | "spotlight-retina": "", /*iPad高分屏Spotlight搜索程序图标，分辨率：100x100*/ 151 | "spotlight-normal7": "",/*iPad iOS7 Spotlight搜索程序图标，分辨率：40x40*/ 152 | "spotlight-retina7": "",/*iPad iOS7高分屏Spotlight搜索程序图标，分辨率：80x80*/ 153 | "settings-normal": "",/*iPad设置页面程序图标，分辨率：29x29*/ 154 | "settings-retina": "" 155 | } 156 | }, 157 | "android": { 158 | "mdpi": "", /*普通屏程序图标，分辨率：48x48*/ 159 | "ldpi": "", /*大屏程序图标，分辨率：48x48*/ 160 | "hdpi": "", /*高分屏程序图标，分辨率：72x72*/ 161 | "xhdpi": "",/*720P高分屏程序图标，分辨率：96x96*/ 162 | "xxhdpi": "" 163 | } 164 | }, 165 | "splashscreen": { 166 | "ios": { 167 | "iphone": { 168 | "default": "", /*iPhone3启动图片选，分辨率：320x480*/ 169 | "retina35": "",/*3.5英寸设备(iPhone4)启动图片，分辨率：640x960*/ 170 | "retina40": "" 171 | }, 172 | "ipad": { 173 | "portrait": "", /*iPad竖屏启动图片，分辨率：768x1004*/ 174 | "portrait-retina": "",/*iPad高分屏竖屏图片，分辨率：1536x2008*/ 175 | "landscape": "", /*iPad横屏启动图片，分辨率：1024x748*/ 176 | "landscape-retina": "", /*iPad高分屏横屏启动图片，分辨率：2048x1496*/ 177 | "portrait7": "", /*iPad iOS7竖屏启动图片，分辨率：768x1024*/ 178 | "portrait-retina7": "",/*iPad iOS7高分屏竖屏图片，分辨率：1536x2048*/ 179 | "landscape7": "", /*iPad iOS7横屏启动图片，分辨率：1024x768*/ 180 | "landscape-retina7": "" 181 | } 182 | }, 183 | "android": { 184 | "mdpi": "", /*普通屏启动图片，分辨率：240x282*/ 185 | "ldpi": "", /*大屏启动图片，分辨率：320x442*/ 186 | "hdpi": "", /*高分屏启动图片，分辨率：480x762*/ 187 | "xhdpi": "", /*720P高分屏启动图片，分辨率：720x1242*/ 188 | "xxhdpi": "" 189 | } 190 | } 191 | } 192 | }, 193 | "dependencies": { 194 | "pages": { 195 | "index.html": { 196 | "resources": [ 197 | "js/mui.min.js", 198 | "css/mui.min.css", 199 | "js/jquery-3.1.1/jquery-3.1.1.min.js", 200 | "common/drawMethod.js", 201 | "common/main.js", 202 | "common/common.js", 203 | "images/background.jpeg", 204 | "game/enemy.js", 205 | "game/main.js", 206 | "images/enemy/blowfish-icon.png", 207 | "images/enemy/octo-icon.png", 208 | "game/actor.js", 209 | "images/starfish-icon.png", 210 | "images/starfish-small.png", 211 | "images/starfish-middle.png", 212 | "game/crash.js", 213 | "game/effects.js", 214 | "game/data.js", 215 | "images/enemy/squid-icon-middle.png", 216 | "images/enemy/crab-icon-middle.png", 217 | "css/bootstrap.min.css" 218 | ], 219 | "refer": [ 220 | "main.html" 221 | ], 222 | "priority": 0 223 | }, 224 | "main.html": { 225 | "resources": [ 226 | "images/starfish-middle5.png", 227 | "images/starfish-middle1.png", 228 | "game/effects.js", 229 | "common/loadPic.js", 230 | "game/actor.js", 231 | "game/crash.js", 232 | "game/data.js", 233 | "images/enemy/crab-icon-middle.png", 234 | "css/bootstrap.min.css", 235 | "images/starfish-middle9.png", 236 | "game/enemy.js", 237 | "images/enemy/octo-icon.png", 238 | "js/jquery-3.1.1/jquery-3.1.1.min.js", 239 | "images/starfish-middle7.png", 240 | "images/starfish-small.png", 241 | "images/starfish-middle8.png", 242 | "images/enemy/blowfish-icon.png", 243 | "images/starfish-middle6.png", 244 | "common/common.js", 245 | "game/main.js", 246 | "images/starfish-middle3.png", 247 | "images/enemy/squid-icon-middle.png", 248 | "images/starfish-middle0.png", 249 | "images/starfish-middle2.png", 250 | "images/starfish-middle4.png", 251 | "images/background.jpeg", 252 | "js/mui.min.js", 253 | "css/mui.min.css" 254 | ], 255 | "refer": [], 256 | "priority": 0 257 | } 258 | }, 259 | "idle": { 260 | "resources": [ 261 | "fonts/mui.ttf", 262 | "js/mui.js", 263 | "css/mui.css" 264 | ] 265 | } 266 | } 267 | } -------------------------------------------------------------------------------- /setting.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 39 | 40 | 41 |
42 |
43 | 游戏难度 44 |
45 | 46 | 47 | 48 |
49 | 50 |
51 |
52 | 游戏模式 53 |
54 | 55 | 56 | 57 |
58 | 59 |
60 | 61 |
62 | 63 | 64 | 65 | 115 | 116 | 117 | -------------------------------------------------------------------------------- /test.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 40 | 41 | 42 |
43 |
44 |
45 |
46 |
47 | 48 | 49 | 50 | 51 | 71 | 72 | -------------------------------------------------------------------------------- /unpackage/.confirmed_dependencies: -------------------------------------------------------------------------------- 1 | { 2 | "index.html": { 3 | "resources": [ 4 | "js/mui.min.js", 5 | "css/mui.min.css", 6 | "js/jquery-3.1.1/jquery-3.1.1.min.js", 7 | "common/drawMethod.js", 8 | "common/main.js", 9 | "common/common.js", 10 | "images/background.jpeg", 11 | "game/enemy.js", 12 | "game/main.js", 13 | "images/enemy/blowfish-icon.png", 14 | "images/enemy/octo-icon.png", 15 | "game/actor.js", 16 | "images/starfish-icon.png", 17 | "images/starfish-small.png", 18 | "images/starfish-middle.png", 19 | "game/crash.js", 20 | "game/effects.js", 21 | "game/data.js", 22 | "images/enemy/squid-icon-middle.png", 23 | "images/enemy/crab-icon-middle.png", 24 | "css/bootstrap.min.css" 25 | ], 26 | "refer": [ 27 | "main.html" 28 | ] 29 | }, 30 | "main.html": { 31 | "resources": [ 32 | "images/starfish-middle5.png", 33 | "images/starfish-middle1.png", 34 | "game/effects.js", 35 | "common/loadPic.js", 36 | "game/actor.js", 37 | "game/crash.js", 38 | "game/data.js", 39 | "images/enemy/crab-icon-middle.png", 40 | "css/bootstrap.min.css", 41 | "images/starfish-middle9.png", 42 | "game/enemy.js", 43 | "images/enemy/octo-icon.png", 44 | "js/jquery-3.1.1/jquery-3.1.1.min.js", 45 | "images/starfish-middle7.png", 46 | "images/starfish-small.png", 47 | "images/starfish-middle8.png", 48 | "images/enemy/blowfish-icon.png", 49 | "images/starfish-middle6.png", 50 | "common/common.js", 51 | "game/main.js", 52 | "images/starfish-middle3.png", 53 | "images/enemy/squid-icon-middle.png", 54 | "images/starfish-middle0.png", 55 | "images/starfish-middle2.png", 56 | "images/starfish-middle4.png", 57 | "images/background.jpeg", 58 | "js/mui.min.js", 59 | "css/mui.min.css" 60 | ] 61 | } 62 | } --------------------------------------------------------------------------------