create webpage project
This commit is contained in:
commit
c659f795dd
94 files changed
+9040
No files matched your search
Vendored
BIN
Binary file not shown.
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,3 @@
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
var dialog = require('../../script/extends/phone/dialog');
|
||||
@@ -0,0 +1,5 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
<video id="video" width="200" height="150" autoplay=""></video>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script type="text/javascript">
|
||||
var vedio = document.querySelector('#video');
|
||||
|
||||
//constraints 参数是一个包含了video 和 audio两个成员的MediaStreamConstraints
|
||||
//对象,用于说明请求的媒体类型。必须至少一个类型或者两个同时可以被指定。
|
||||
var constraints = {
|
||||
audio: false,
|
||||
video: {
|
||||
frameRate: { ideal: 10,max: 15,min: 8 }
|
||||
}
|
||||
}
|
||||
|
||||
//获取设备(摄像头或者麦克风)
|
||||
navigator.mediaDevices.getUserMedia({ audio: false, video: true })
|
||||
.then(function(mediaStream){
|
||||
console.log(mediaStream);
|
||||
video.src = window.URL.createObjectURL(mediaStream);
|
||||
video.onloadedmetadata = function(e) {
|
||||
video.play();
|
||||
console.log(e);
|
||||
};
|
||||
})
|
||||
.catch(function(error){
|
||||
console.log(error);
|
||||
});
|
||||
</script>
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
Executable
+29
@@ -0,0 +1,29 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<link rel="dns-prefetch" href="http://file.do.yy.com/">
|
||||
<link rel="dns-prefetch" href="http://dl2.vip.yystatic.com/">
|
||||
<link rel="dns-prefetch" href="http://res.udb.duowan.com/">
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/vue/2.4.2/vue.min.js"></script>
|
||||
{#<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>#}
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
Executable
+5
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "",
|
||||
"description":"Tony",
|
||||
"keywords":"Tony"
|
||||
}
|
||||
Executable
+95
@@ -0,0 +1,95 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}音乐盒{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div id="index-main" class="index-main">
|
||||
|
||||
<div class="middle-box">
|
||||
<audio id="music" v-bind:src="musicUrl" ref="music" style="display:none">你的浏览器不支持audio标签。</audio>
|
||||
<div class="music-main">
|
||||
<div class="bg-block" v-bind:style="backgroundImage"></div>
|
||||
<div class="needle-plus"></div>
|
||||
<div class="disc">
|
||||
<div class="singer-img rotate" v-bind:class="[musicStatus?'rot-play':'rot-paused']"><img v-bind:src="singerImg"></div>
|
||||
<div class="disc-mask"></div>
|
||||
</div>
|
||||
<div class="song-lyrics">
|
||||
<div id="lyrics-scroll" class="lyrics-scroll" ref="lyricsScroll">
|
||||
<p v-for="row in lyrics">{{row[1]}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-btn">
|
||||
<button v-on:touchend="showSeachPop">搜索</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom-bar">
|
||||
<div class="bom-bar-bg">
|
||||
<div class="music-msg">
|
||||
<div class="left-box">
|
||||
<a class="title-page" href="javascript:;">
|
||||
<img v-bind:src="singerImg">
|
||||
</a>
|
||||
</div>
|
||||
<div class="right-box">
|
||||
<div class="progress-bar" id="progress-bar" v-on:touchstart="clickDown" v-on:touchmove="clickMove" v-on:touchend="clickUp" ref="progressBarDom">
|
||||
<div class="load-prog" style="width:{{loadProg}}%"></div>
|
||||
<div class="prog play-prog" id="play-prog" v-bind:style="'width:'+playProg+'%'" ref="playProg">
|
||||
<span class="pos"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-msg">
|
||||
<div class="music-name ell">{{songName}}-{{singer}}</div>
|
||||
<div class="music-time">
|
||||
<span class="ct">{{currentTime}}</span>/<span>{{allTime}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="controller">
|
||||
<a class="prev cutover icon" href="javascript:;" v-on:touchend="prev"></a>
|
||||
<a class="play ctrl-btn icon" href="javascript:;" v-bind:class="[musicStatus?'pause':'play']" v-on:touchend="play"></a>
|
||||
<a class="next cutover icon" href="javascript:;" v-on:touchend="next"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="search-pop" v-if="showPop">
|
||||
<div class="pop-bg"></div>
|
||||
<div class="pop-main">
|
||||
<div class="search-bar">
|
||||
<input class="search-input" type="text" v-model="searchContent">
|
||||
<button class="search-button" v-on:touchend="searchRequest">搜索</button>
|
||||
</div>
|
||||
<div class="search-list">
|
||||
<div class="search-list-scroll">
|
||||
<div class="search-list-item" v-for="item in searchResult">
|
||||
<p class="ell">{{item.FileName | htmlEncode}}</p>
|
||||
<button v-bind:hash="item.FileHash" v-on:touchend="playSong">播放</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="placeholder">
|
||||
<button v-on:touchend="closePop">关 闭</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
Executable
+382
@@ -0,0 +1,382 @@
|
||||
//加载弹窗组件(不用可去掉)
|
||||
//var dialog=require('../../res/script/extends/dialog');
|
||||
var vueResource = require('../../res/script/lib/vue-resource');
|
||||
Vue.use(vueResource);
|
||||
|
||||
var music;//audio
|
||||
|
||||
var timer,movable=false,ProgX,curData={},playList=[],curTime=0;
|
||||
var ps,pcur,ph;
|
||||
var defaultImg = 'data:image/png;base64,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
Line truncated
|
||||
|
||||
|
||||
var indexMain=new Vue({
|
||||
el:'#index-main',
|
||||
data:{
|
||||
musicStatus:false,
|
||||
musicUrl:'',
|
||||
songName:'未知',
|
||||
singer:'未知',
|
||||
singerImg:defaultImg,
|
||||
coverImg:defaultImg,
|
||||
lyrics:[],
|
||||
loadProg:100,
|
||||
playProg:0,
|
||||
currentTime:'00:00',
|
||||
allTime:'00:00',
|
||||
canPlay:false,
|
||||
searchContent:'',
|
||||
searchResult:[],
|
||||
showPop:false
|
||||
},
|
||||
computed:{
|
||||
backgroundImage:function(){
|
||||
return 'background-image:url('+(this.coverImg?this.coverImg:this.singerImg)+')';
|
||||
}
|
||||
},
|
||||
filters:{
|
||||
htmlEncode:function(str){
|
||||
var temp = document.createElement("div");
|
||||
temp.innerHTML = str;
|
||||
var output = temp.innerText || temp.textContent;
|
||||
temp = null;
|
||||
return output;
|
||||
}
|
||||
},
|
||||
mounted:function () {
|
||||
music = this.$refs.music;
|
||||
ProgX = getElementLeft(this.$refs.playProg);
|
||||
},
|
||||
methods:{
|
||||
//播放按钮
|
||||
play:function(){
|
||||
if (this.canPlay) {
|
||||
if (this.musicStatus) {
|
||||
pauseMusic(this);
|
||||
}else{
|
||||
playMusic(this);
|
||||
}
|
||||
}
|
||||
},
|
||||
//下一首
|
||||
next:function() {
|
||||
if (true) {
|
||||
playNext(this);
|
||||
}
|
||||
},
|
||||
//上一首
|
||||
prev:function(){
|
||||
if (true) {
|
||||
playPrev(this);
|
||||
}
|
||||
},
|
||||
//播放进度
|
||||
playProgress:function() {
|
||||
timer = playTimer(this);
|
||||
},
|
||||
//点击进度条
|
||||
clickPlayProg:function(e){
|
||||
//setPlayProg(getMousePos(e).x-ProgX,true);
|
||||
},
|
||||
//拖动进度条-鼠标按下
|
||||
clickDown:function(e){
|
||||
movable=true;
|
||||
curTime=setPlayProg(getMousePos(e).x-ProgX,this.$refs.progressBarDom);
|
||||
},
|
||||
//拖动进度条-鼠标移动
|
||||
clickMove:function(e){
|
||||
if(movable) curTime=setPlayProg(getMousePos(e).x-ProgX,this.$refs.progressBarDom);
|
||||
},
|
||||
//拖动进度条-鼠标弹起
|
||||
clickUp:function(e){
|
||||
movable=false;
|
||||
music.currentTime=curTime;
|
||||
},
|
||||
showSeachPop:function(e){
|
||||
this.showPop = true;
|
||||
},
|
||||
searchRequest:function(e){
|
||||
//console.log(this.searchContent)
|
||||
getSongList(this.searchContent);
|
||||
},
|
||||
playSong:function(e){
|
||||
//console.log(e.target);
|
||||
//console.log(e.target.getAttribute('hash'));
|
||||
var hash = e.target.getAttribute('hash');
|
||||
getPlaySong(hash);
|
||||
this.showPop = false;
|
||||
},
|
||||
closePop:function(e){
|
||||
this.showPop = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
//getPlayList();
|
||||
|
||||
//播放计时器
|
||||
function playTimer(vue) {
|
||||
return setInterval(function(){
|
||||
if(vue.musicStatus&&!movable) {
|
||||
vue.playProg=currentTime()/timeAll()*100
|
||||
vue.currentTime=conversionTime(currentTime());
|
||||
vue.allTime=conversionTime(timeAll());
|
||||
//当歌曲播放完毕后
|
||||
//if(music.ended){
|
||||
//清除定时器,进度条归零,播放下一首
|
||||
// clearInterval(timer);
|
||||
// vue.playProg=0;
|
||||
// vue.musicStatus=false;
|
||||
//}
|
||||
}
|
||||
},1000);
|
||||
}
|
||||
|
||||
//播放
|
||||
function playMusic(vue) {
|
||||
music.play();
|
||||
vue.currentTime=conversionTime(currentTime());
|
||||
vue.playProgress();
|
||||
vue.musicStatus=true;
|
||||
}
|
||||
|
||||
//暂停
|
||||
function pauseMusic(vue) {
|
||||
music.pause();
|
||||
clearInterval(timer);
|
||||
vue.musicStatus=false;
|
||||
}
|
||||
|
||||
//播放下一首
|
||||
function playNext(vue) {
|
||||
if (curData.p>=playList.length-1) setCurMusic(0,vue);
|
||||
else setCurMusic(curData.p+1,vue);
|
||||
}
|
||||
|
||||
//播放上一首
|
||||
function playPrev(vue) {
|
||||
if (curData.p==0) setCurMusic(playList.length-1,vue);
|
||||
else setCurMusic(curData.p-1,vue);
|
||||
}
|
||||
|
||||
|
||||
//设置进度条
|
||||
function setPlayProg(pos,progressBar) {
|
||||
//progressBar = document.querySelector('#progress-bar');
|
||||
pos=pos>progressBar.offsetWidth?progressBar.offsetWidth:pos;
|
||||
var ratio=pos/progressBar.offsetWidth;
|
||||
indexMain.playProg=ratio*100;
|
||||
return ratio*timeAll();
|
||||
}
|
||||
|
||||
//设置播放曲目
|
||||
function setCurMusic(p,vue) {
|
||||
curData.p=p;
|
||||
curData.msg=playList[p];
|
||||
music.src=curData.msg.url;
|
||||
vue.musicUrl=music.src;
|
||||
vue.songName=curData.msg.name;
|
||||
vue.singer=curData.msg.singer;
|
||||
vue.singerImg=curData.msg.photo;
|
||||
vue.coverImg=curData.msg.cover;
|
||||
vue.lyrics=curData.msg.lyrics;
|
||||
canPlayMeta(music,function(){
|
||||
playMusic(vue);
|
||||
});
|
||||
playMusic(vue);
|
||||
canPlayEnded(music,function(){
|
||||
playNext(vue);
|
||||
});
|
||||
var lyricsScroll = vue.$refs.lyricsScroll;
|
||||
music.ontimeupdate = function(e) {
|
||||
//遍历所有歌词,看哪句歌词的时间与当然时间吻合
|
||||
var indexArr = [];
|
||||
for (var i = 0; i < curData.msg.lyrics.length; i++) {
|
||||
/*是否匹配当前播放的时间*/
|
||||
if (this.currentTime > curData.msg.lyrics[i][0]) {
|
||||
indexArr.push(i);
|
||||
};
|
||||
};
|
||||
|
||||
if(indexArr.length > 0) {
|
||||
var index = indexArr[indexArr.length - 1];
|
||||
var moveIndex = (index-2>0)?index-2:0;
|
||||
|
||||
ps = lyricsScroll.querySelectorAll('p');
|
||||
pcur = ps[index];
|
||||
ph = pcur.clientHeight;
|
||||
for (var j = 0; j < ps.length; j++) {
|
||||
ps[j].removeAttribute('class');
|
||||
};
|
||||
pcur.className = 'cur';
|
||||
|
||||
lyricsScroll.style.transform = 'translateY('+(-moveIndex*ph)+'px)';
|
||||
}
|
||||
|
||||
};
|
||||
}
|
||||
|
||||
//将剩余秒数转化为标准格式
|
||||
function conversionTime(time){
|
||||
var surplusMinite,
|
||||
surplusSecond,
|
||||
cTime;
|
||||
//将剩余秒数转化为分钟
|
||||
surplusMinite = Math.floor((time / 60) % 60);
|
||||
//将剩余秒数转化为秒钟
|
||||
surplusSecond = Math.floor(time % 60);
|
||||
if(surplusMinite < 10){
|
||||
surplusMinite = '0' + surplusMinite;
|
||||
}
|
||||
if(surplusSecond < 10){
|
||||
surplusSecond = '0' + surplusSecond;
|
||||
}
|
||||
cTime = surplusMinite + ':' + surplusSecond;
|
||||
return cTime;
|
||||
}
|
||||
|
||||
//获取歌曲总时间
|
||||
function timeAll(){
|
||||
if(music.currentTime != 0){
|
||||
return music.duration;
|
||||
}else{
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
|
||||
//获取歌曲当前播放时间
|
||||
function currentTime(){
|
||||
return music.currentTime;
|
||||
}
|
||||
|
||||
//获取节点偏移量
|
||||
function getElementLeft(element) {
|
||||
var actualLeft = element.offsetLeft;
|
||||
var current = element.offsetParent;
|
||||
|
||||
while (current!==null) {
|
||||
actualLeft += current.offsetLeft;
|
||||
current = current.offsetParent;
|
||||
}
|
||||
return actualLeft;
|
||||
}
|
||||
|
||||
//获取鼠标位置
|
||||
function getMousePos(event) {
|
||||
var e = event.targetTouches[0];
|
||||
var x = e.pageX;
|
||||
var y = e.pageY;
|
||||
|
||||
return { 'x': x, 'y': y };
|
||||
}
|
||||
|
||||
//媒体文件元数据加载完成
|
||||
function loadedMetaData(audio,cb) {
|
||||
audio.onloadedmetadata=function(data){
|
||||
if (cb) cb(data);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//媒体文件可以播放
|
||||
function canPlayMeta(audio,cb) {
|
||||
audio.oncanplay=function(data){
|
||||
indexMain.canPlay=true;
|
||||
if (cb) cb(data);
|
||||
}
|
||||
}
|
||||
|
||||
//媒体文件播放结束
|
||||
function canPlayEnded(audio,cb) {
|
||||
audio.onended=function(data){
|
||||
clearInterval(timer);
|
||||
indexMain.musicStatus=false;
|
||||
indexMain.playProg=0;
|
||||
if (cb) cb(data);
|
||||
}
|
||||
}
|
||||
|
||||
//getPlaySong('4AD039C240CB1C9B9A922FB886A37188');
|
||||
|
||||
function getSongList(keyword) {
|
||||
var url = 'http://songsearch.kugou.com/song_search_v2?keyword='+keyword+'&page=1&pagesize=30&userid=-1&clientver=&platform=WebFilter&tag=em&filter=2&iscorrection=1&privilege_filter=0&_='+Date.now();
|
||||
Vue.http.jsonp(url, {
|
||||
params:{
|
||||
}
|
||||
}).then(function(json){
|
||||
var result = json.json();
|
||||
//console.log(result);
|
||||
if (result) {
|
||||
if(result.status == 1 && result.data.lists.length > 0) {
|
||||
indexMain.searchResult = result.data.lists;
|
||||
}
|
||||
|
||||
}else{
|
||||
|
||||
}
|
||||
}, function(){
|
||||
});
|
||||
}
|
||||
|
||||
function getPlaySong(hash) {
|
||||
Vue.http.get('/data/songMsg?hash='+hash, {
|
||||
params:{
|
||||
}
|
||||
}).then(function(json){
|
||||
var json = json.json();
|
||||
|
||||
if (json) {
|
||||
if(json.result) {
|
||||
var songMsg = {
|
||||
url:json.data.play_url,
|
||||
name:json.data.song_name,
|
||||
singer:json.data.author_name,
|
||||
photo:json.data.img,
|
||||
cover:json.data.img,
|
||||
lyrics:parseLyric(json.data.lyrics)
|
||||
}
|
||||
playList.push(songMsg);
|
||||
setCurMusic(playList.length-1,indexMain);
|
||||
}
|
||||
|
||||
}else{
|
||||
//dialog.showMsg(lotData.desc);
|
||||
}
|
||||
}, function(){
|
||||
//contentBox.loading=false;
|
||||
//dialog.showMsg('你的网络好像不给力,请重试!');
|
||||
});
|
||||
}
|
||||
|
||||
function parseLyric(text) {
|
||||
//将文本分隔成一行一行,存入数组
|
||||
var lines = text.split('\n'),
|
||||
//用于匹配时间的正则表达式,匹配的结果类似[xx:xx.xx]
|
||||
pattern = /\[\d{2}:\d{2}.\d{2}\]/g,
|
||||
//保存最终结果的数组
|
||||
result = [];
|
||||
//去掉不含时间的行
|
||||
while (!pattern.test(lines[0])) {
|
||||
lines = lines.slice(1);
|
||||
};
|
||||
//上面用'\n'生成生成数组时,结果中最后一个为空元素,这里将去掉
|
||||
lines[lines.length - 1].length === 0 && lines.pop();
|
||||
lines.forEach(function(v /*数组元素值*/ , i /*元素索引*/ , a /*数组本身*/ ) {
|
||||
//提取出时间[xx:xx.xx]
|
||||
var time = v.match(pattern),
|
||||
//提取歌词
|
||||
value = v.replace(pattern, '');
|
||||
//因为一行里面可能有多个时间,所以time有可能是[xx:xx.xx][xx:xx.xx][xx:xx.xx]的形式,需要进一步分隔
|
||||
time.forEach(function(v1, i1, a1) {
|
||||
//去掉时间里的中括号得到xx:xx.xx
|
||||
var t = v1.slice(1, -1).split(':');
|
||||
//将结果压入最终数组
|
||||
result.push([parseInt(t[0], 10) * 60 + parseFloat(t[1]), value]);
|
||||
});
|
||||
});
|
||||
//最后将结果数组中的元素按时间大小排序,以便保存之后正常显示歌词
|
||||
result.sort(function(a, b) {
|
||||
return a[0] - b[0];
|
||||
});
|
||||
return result;
|
||||
}
|
||||
Executable
+467
@@ -0,0 +1,467 @@
|
||||
@charset "UTF-8";
|
||||
/*加载公共样式*/
|
||||
@import '../../res/style/common/base.styl';
|
||||
|
||||
/*加载弹窗样式 不用可以去掉*/
|
||||
$norm=750;
|
||||
@import '../../res/style/common/dialog-pop.styl';
|
||||
|
||||
|
||||
html,body,.content-box,.index-main {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.index-main {
|
||||
//min-width: 690px;
|
||||
}
|
||||
|
||||
$pos='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAYCAYAAAD+vg1LAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAMXSURBVEhL3ZTdS9NhFMftTS9CZE3BF6IXEIKoi7oLxIheILrYRaDuKoi6VNhVIvpf1FWxIBSDEG+C6kJZIIIgilCQLQqdL3vfz23OuX57Op/H5/dza2ldd+A7Dud8v9/n7DnPVvffxBGDY4LjgnpBgwE5NXoO768B6agAYcPS0tLVbDb7tFQqLdu2XQSSf6FGD47hojnwAMf0hN/v91iW9bxcLtvqgKAnBwQDgUAzGqOtMXdM630+n7dQKIQQ23ZZ7ezsqny+oLLZbQ1yavQI4X5Eg9Z4VJnrSQWNyWTy5Z6gqLa28ocCDiGaIFrjgZcOTuCeTk5MTHTLPdr5/I6yrNw/AS4atHgYLz01Hyzh1NraWrBY3FWZTNZFOp5S4cGAWrh8Ti1cOqtzapUcNGjxMF7amGfDSR25XO47xFRqy8Xyk4AKdTSp962NGuRfRwarOGjQ4mG88NSjNwnOF+XoZDIjd7aP6c529U4MKxGSWiUnlcrI1MVdPIwXnnqbbPVCLrddSiTSKh7fx9szLTXG1Co5iURGXkx+Gw/jhae+kxbBxVgsuQopFku5CN7srjF+cedGFWdPE/+Bh/HCc994fn5+kq+2uZlwMfZqVD3rvqbenG7WIH89Nl7FQbO4uDiJh/HSxu5V9Pf3P7asrA15YyOuEYlsqtHRcTU0NKxBTs3pw0UzMDDwCA/jpa/CXZ6ga25u7gMTrK/H5QnFDgUcuGjQGg93ee5zE1zxer2+cPjbJ5aIOBKJ/hH04ITD4c9o0BoP97m5PxBBp6DL4/H0zszMTKfTVjkaTcpk+weQy5IVvdnZ2VBbW5sfjdFW/UD4YHROahWwgOuC+z09PcNTU1PTq6uRqBj9lAmLKyuRDWp9fX0jcAwXDVo88NLGhPsnJGgXQGSKe4JewQPBQwNyavTgwOUKav6ECE6gwDYhcDpfjXtDfFtw1+CWqdGDAxcNWjzcaZ1wzDmVr8R9MQmb5hkxGSCnRg8OXGfSGlMnHHPuiSUg4vnwNnn4gJwaPThwDzWtDEiAZ4OQr4kJIKdGz+H9FnV1vwCJAvW00y66NwAAAABJRU5ErkJggg==';
|
||||
|
||||
$disc='data:image/png;base64,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 truncated
|
||||
|
||||
$play1='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAPMSURBVFhH5ZhPSFRRFMYNQfEfCDIxQkKL2eVGhcC0RQQuGmnTqhbuooUrN6LQQG0kRGvjZja2tIWthEKJQEhkiNCsGKGBWQyBGBYWgsSond+bc3nPcd579+m4qQ8O8953zvnOmXvvu3fe1PwLaBC7KTYilhZ77bE55fARQ+y5oUNsJB6PvxkeHv40Pz//bXNz89fu7m7xj4JrOHzEEEuOWDsC1UK92IPOzs53FKLwkSWIJYdcNFTrTGiPxWJz6XS6YBo5ODg4FCzL7UP5vCZUXKxOLQ6nvmVihXMaQwMtNEvS0ZHo7u5+xRQgqo3MiiXUHwpiyTGNoYWmuKw1DDoGBgY+bG1tOUIimBPhq+qLDHLRQAtNtIW2Hqn6vr6+FyxQBERsWSymvlMDDbTQRJsaQlutqSEzTSKwIB91yp8ZaKmmM31CDZU8/mhn8ZGg09SifNWAppk+agnlP3W9vb2PWYCYIGzN8MQ8Emtz7iIAbVOHmkqfQBN7Bp3v7Oy8VM4X+Xz+98rKynfdY5KSdqHksQM1qEVNuW0qsR709PTcYr/Q0Ql9LBEDLNDR0dGPQk2JXXScFqAGtahJbaVdTExMPKdAoVDIKxUIpxsPTjNa1CKX2kq5WFpa+oxzdXX1mVKBILYcZaMVus9QizxqK+XCPOrZbPaGUoEg1g+ZTOanjtZtufUdLWoRr1vAcXg2QqtNkNggoJdKpb5IKKNVEdQysUq5YHE5SkdHjUoFQmNDsbGx8VVTTkDcjcRQWykXpiG5tNpXiLWBjMKCplRCGzEVGzJTlkwmrysVCGKDQJFisXhfLn3XELWIrThl5hEcGxt7qlQgiPWDjAqH6GUN9QW1iK+41eRyuUWcMzMzi0oFgthy2IyKF9Qij9pKudjf37+Dk0dWbkP3EGK9YK3s7e1dUrcNOqhFLrWVcyGCLXzDsAPPwOlCYEZFaWuYg5x8ait9HGUHXuB5JmL8PIk6KgYJq4NcCjgHHjY4OPhWqPN4r2pA29ShpvKVIUHTdM7Pi9bW1idC1ZY8VUEtmmhTg1rK+0PiGiVwnQROcG2qGiPVgBaa2gw1rE4FM3Xbpil9n4r86uJBAg1PM9uhU1UOSegyTTHE/f3974UeF4vyokfsOLmeaaKZrpI7InSknOmTz0PPazEn+F2xK2KcfawzjGs4fFPEkkOuaqxHHplyiEC9CE2zX5jG1tbWfkxOTuZ54eMPhebm5gzGNRw+Ykwj5KKBlsqeHXwzsVnTmA2IJYdclak+RLxF7B6FmAKxbUZCjWumhSaIqfp73f+Ompq/dtpZOtG4hdkAAAAASUVORK5CYII=';
|
||||
|
||||
$play2='data:image/png;base64,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';
|
||||
|
||||
$zt1='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAOvSURBVFhH7ZhPSFRRGMUFUfEfCDIws3A3u9yoEJi2iMBFumsRtXDbQgjcKbRpIyFaGzezsWUtbBUUSgRCIkOEQoEuhFkMgRgW1maIdPp+b85lxum9N+/mtIkOfLw35557zue7d96bZ8u/gE6r61azVjmrV3UFxxgatH8NA1az6XT69czMzIe1tbVP+/v7305OTn7+EDiHYwwNWuZYZTBoFjqs7g4ODr4liOByQqBlDnPxkNeFkEmlUk9zuVzRNXJ6enpm2LSP9+14xai0VbsqDaexTbTGBY3hgReeFWt/ZIeHh1+yBJiqkVWrrMYbAi1zXGN44WlDiT0cBiYmJt4fHh4GRmZ4YMaXNeYN5uKBF554G534SnWMjY09Y4NiYGabVimN/THwwAtPvMkwOtGemnbLZAYv7NAu/sLAS57B8hk1XRmJRobNxwQtU6/4MGTa2tpucax8DBDGnQOebvnIMip66UZHRx+wASlD7J5hcy4uLha0SQOEcWHA2+WQKfo3dHPPoPPj4+Pn4iJhm7OEtlAolEWFclEgAy2Z9rG7wtZgZGTkBvcLXZ2GX0vMHESFclEggywyyRZdxcLCwhOMisViQVQsglRBlFdDgCy0ZIuqYmNj4yOD29vbj0XFAq2DKO+GyEJLtqgq3Fd9b2/vmqhYoHUQ5d0QWWh1CziPmhthopsgWgdR3g2RhZZsUVWwuQKncrlLVCykDSDKuyGTdaElW1QVriE77a8w8UDrIMq7IUM/2tCG3JJNTk5eFRULtA6ivBsiC23okrmv4Nzc3CNRsUDrIMq7IbLQht5qDg4O1hlcWVlZFxULtA6ivBsiCy3ZoqoolUo3Gczn81/tY8PfKmgdRPk2NEAWWrLFVWFfwV42V6MHnkOQKojyasg9yMkkW/R51D3wYp9nZhb8hOAoKpSLQDbRg9w98Kipqak3RkW+V6G1usdRVCgXgk68XU4DbfBXLtO5/YT43tfX99Co1spIU9CKJ95kkCU+GqbrMuEuE7a2tj6rqWa8gXbihaeaISPRU8Et3ZFrSu9TDX8jxSCLR00zRw2Xqh42Ycg1xSUeHx9/Z/S8VeLXFwPaeebWLBPNDFWGPaErFSyfHc9qXouXrG5bXbLi2cc+oziHY2zJvX4zVx673lemHmbQYUbL3C9cYzs7O1/4Mc8LH/9Q6OnpyVOcwzGGxjXCXDzwku3FwV9mteoaSwK0zGGubJoPM++1ukMQS2B1xJVQcc6y0ASauPe6//gDtLT8AigyOthzlTKtAAAAAElFTkSuQmCC';
|
||||
|
||||
$zt2='data:image/png;base64,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';
|
||||
|
||||
$xyg1='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAK5SURBVEhL5ZY7i1pRFIUdgmmFDA6msBCsg1ikkJBmWgshRTCEIUVCupHpDBgzlVUeRWzGIilSDGQwgQgZBpOQzn9g5V+wF/GR/ek6XvVeH2OaQBZsvPu19rn77HO8oX8VByZ5k9cm5yaXEp6x4btt8teg0ItYLPajUChcNpvNr91utz4ajRoIz9jwEWOxp8rZCfei0ej5xcXFN1dgOBy+GQwGz3q93gPTH5kcY3N+Ysmx3MMpxZYIh8MPs9nsr36//wUR+S25fcBHjIvP5/M/4ZB7Iw5pESu25NK6QssYj8cR5TTgMNPGNz3I5XK8ES06NoIbsm8Ny9kjFw7e1Eyr9zSZTL5SW0q7FHMgFw644JTZh302nSBaI9s8aE+QHXA0zqaPU8ABF5ym+o9MJpN5TBuYQJkWQHs0gcmpxQNH47dB6gya5kYqlXoqk4disfgW54q3C7HaTqdzlU6nv5u6MAzkIVJngAt7pVL5KJMHVtlutz9J9cGRUljDcGIy2edVBQGccEv1wOpbrdY7qT44UifVavXKzM/nfTwvA064pXpg5fV6/aVUH+aLOeHWmfdNApcAJ9xSPWB8b5Dqw3whRFdadN43CVwCnIEFuYhrtdpnqT44UgmXwk251haEE26pHthcjXbglDrSoGOzpmAEzsBhdGcmHo8/kWkB5uO6uiN1AbQXkToDXLQz8GwbWZSC5XKZkV91o1wHEfcnALdsi7DVlOh3IpHgeOx8lwI44IJTJj9YCS3Q/Tc72NeBDdOe/Zy4e3nl2zlYwH3aoIPNJ8P+xLEd2IpTcuGAa2reADdArFLfKkcm6wrjOyKWHHIDB2UdLOkuLUEYJBXmL4hW85XGIng+cx9ZLn7rN1uGJbKnk08GhPNEuyBnERxqbM6v2PV7tg0goUUi/OAK8IwNnw1LTOH/NUKhP2esw0hDhIHMAAAAAElFTkSuQmCC';
|
||||
|
||||
$xyg2='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAR2SURBVEhLlZY9SJtRFIYViYIgglBw6ODg4CQEg4OC0B9Ei4PQySBuHazSvVAcLQgOpVJwsY4drIugVLDiICKlKLag0EAGaQstVqwKEjTp+5yc+5kYf+qFN7nf+XnPveeec7+v7KaRy+UqhJhQLdRms9k64U4AMtdhU+Futx84i7CKANPT0y39/f3Pu7u7p3t6ej52dnZ+BsyRocMGW3xuFVjG5b7aWkj6+vpeDQ0NfZmZmfmeTqcPDw4OTs/OzrKAObL5+fkf2GCLD77OUe60lw8MhEpWOjw83AfJxsbGnxBASEk3J0xlMplZ/a8gC3ps8cFXOlLObi8PigIDDAcHB5+OjY2lRRoG5EmhTYgLzQ7myJLY5E0zmcnJyV3SLPnVQSWMYcDqSJ+vehMyIS59A3r9Uzg1wOfI0MVPTk4e46PnHBws3PUxD5MfElCJtcvLywlWh4MMV4QOoRGdUCmUFAMy1xG80X1W9JyDC050wrmvDNh2w+jo6FtS4jvrQCZEJe+I0sNcIFi17G3HArvtgAMuOF1WFZxsdwsLCw85dIxIjQzYGcGMsKWl5ZGcg8xSBIlQl0gk3rS3t7/TnDOjNRrhgAtOuJHLr8LO7vj4+O5rDc5NNhQIZ2ZpEKrRU0Qq+6WJiYkH7mytIzTt7Oz8pT2Yu4z0xvf29t7DCTcckscIyIqbFhcXv6JkZXomlZW+C1YcZ7X0HYEpBunrIZGO1NvQnIqlSMhKgxdRFm49s5hqAtpqWOX+/v7PAic7ZOZCRAqBV+BL/IQuVxHwvv7qBW4p/NrgZPfYSl4bdtDK6re2tr5FCh8QSBaRhrG+vr5PQUiXdBEBsat3P9sInHBr3irUhR20krJUKvVBcxq6xqJpQKDnkoAMyedOT0+f+GNRQDiEZjjJioZlrijg2trajub/FVAkKYJJd+kO4RCa4bwY8NqUYiRwNtEQAX3aJbR5kdlwu+tTGhS7u7s62/Th9vb2PT0XFo0tiFUCJYK2CZeCNbn+bWgeFRz/cMHpxZjfiH6sLQp7Rs+FbUFquLJ4SzxzRyoRP+tD+fHGSDF3mbUFXHDC7TprC2t8ESVR8m5jZZKHxrd70huX86TpkUVvF83DbpnbQuCAC06NZGHjs31r7qOjo08Uz8jIyJKewzVGUG4VgoQ71e5TnyPHjvuUBVhG4ODs4IRbyF9tnja7vMP9xyVAYyNzspK3xMWBjds24AsHXOKmis8vb4Ybh/MY17819sDAwEzB64WdlARG5jp7veGDr56pZrjCuRb7SmAvYIE+nCL3rJJPhoKPJM6Iqi56AYePLGzxkZyKnRLgwqf4BRyGlFYEGCobL0gJI3wk9fb2zvKhBDlgjgwdNm7O+3Q8BINTAW/8ruGAm/TP5wUfStaD9NPq6upvyAGpQxb02OLjvtcHCwMDIbzrOGwqjMCkeVP4FQL4nFuH9EXfPu4Lx/XBCoeMow9h7yFWTXCuKG4UwJwgTd7LtBe7urGqrxw4C6zWGtpJSZcBmeusR93tilFW9g/hONGZsVCpVwAAAABJRU5ErkJggg==';
|
||||
|
||||
$syg1='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAK3SURBVEhL3ZY9i1pREIYNYtqFLC5uYSFYB7FIIWEbWwshRTCEJUVCOsXOwMZYWeWjiM1aJEWKhYgb2ECWxd2Qzn9g5V+wF/Ej81zneD/V624T8sJw78ycec85c+bMvZF/FYciJZH3Imcilyq8Y8N3IHJnQNJIJBLXlUrlstfr/RiNRt35fP4T4R0bPsbI2Dcacyvk4/H4WafTuTATzGazD/Isizwbj8dPptPpK7VZfsYSI7GPlxQhEYvFnpZKpZvJZHKOMIHIA3X7gI8xZnyhUPgNh7q3Ik+KWLEEnywWiz21bwUTE0MsHGLKLz3rccDOCBApy2T31B4aEhMlFo5isXgupvVnmk6n32la2FlUzTuDWDjgglPNPhxy6AwKSOOpShAY60sdHHC1Wq0rUfeXVgcymcxL0kD1qWmFPwpVnUhTlRyD6i7ABWcul3uuJhvNZvMrzoDdUQxW2atqkM9ms7+Gw+EVO1GbC3ARV6vVPqrJBhd4MBh8U9UFz4ScbdVcmzWLWQFOuFW1wUr7/f4nVV3wkL7mXIzN4/MBTrhVtcFqu93uW1VdcJLSXZwTOX1BgDMw5Rg/C1R1wUkqz7iznTl9QYAzcEIacbvd/q6qC15SKYb7oluX2+vzAk64VbXB4Wrph63SVdlvmHAfzsBiJJitJ5PJF2pagRQiqrogkz0UKavqwqa7bZ0NTm26oRv2BuzV63XTl+Nqc0N2eEK+U6kU1+PWvVQQhQMuONXmByshrfRUUatSHDt/LQRWYzB9ee3uDGTAEWnQptsQ2SW9NOmGozEcLc1bYKqPVeq/yrGIv+PbwHfMWGKIDSyUTWB1pARx/CTxiaqKsAD+1Hg/xUeBmPES+0jsu0MCOVPrlwHhPnGRIWcRpA6b8evYzWcWBlI8Cb2nEH4xE/COTY/g7hP9B4hE/gJcEcN7PB4A9AAAAABJRU5ErkJggg==';
|
||||
|
||||
$syg2='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAARySURBVEhLlZY7SFxREIaVsAYEWVgQLFJYWFgJssFCQcgD0WAhpHIRuxRGSR8IlgaEFCE2NsYyhbERlAhGLEQkBMUEFLKwhSQBgxETBVl0N/83O+fmrq/FgX93zpyZf85rzj1VlaRYLN4SEkKtkCwUCvUxpLB5Hz63POzmQrAIb0M6PT2dHhgYeN7T0zPd29v7saur6zNAx0YfPvgSc6PEcq720SYh6e/vfz08PPxlfn7+Ry6X+3t4eHh6dnZWAOjYZmZmvuODLzHEOke1014uOPis6kdGRvoh2djY+B0SCFn1reTz+Vn9Twlz2EI/vsQQqz6Wu+bKpPFkLNHk5OSuiIOQICO0C61CiwMdWwafkms+Pz4+nhsaGnoqO/vMEl9MKmMCBxxZIrWLGvXmycnJY9lb1WykX/8cnDrgOjb6SJ4hhtnC4TOlP+FpSiIDJzG5vLx8l5lJL8pxRegUmugTWJ4LhwGb95G8yWNW1C7CBSd9wv9YOTDtxrGxsbcsCaMkEBvO0pkNR78sqXQOGIiXDrPthAMuOI+Pj++QIwRx/FMLCwsP2XScfBkZLce8vqOj4x1AFywwJBBhUzqdfuTJGFCtx7KveTjhlr00S/0kGMEbCWsv4fSxZziAZo4+QHcb+52amJh4oFJY4pDAITtJbXvgUL5ZOOH2/gQJcWpeXFz8SiezU5ulrFEQM2qXbiK90wMbOFwkohaZCQmElM+emTbCBSfcajPYWjptNMzg4ODgJwkEThYjbZB+X/8m4cQq2UtOIWTeZYMhzhOyTTZYOHd2dv4QJ3uSA8M+tTHSra2tb1FHKZCE3fo3kZ7hEKyvrx+4KRL3ayAOkW4TgRNu6W1CioSMpI3RZrPZD9Ip6DoPKkt4enr6RO05b5aJ+0UJ4RBa4PQlJ2F9WcK1tbUdnIRLE0rPkFS+e26KxP0uJITzfMJKS3p+D9njbiXddLMJfoLtISLT5UsaOthcDs729vY9AmWPNh5CRHq4DKy4NXA79kBSIiwls1i44Nzd3c2pXZqIfqws9vf33xNIzUAo2HVFn+x8EbLobiOG2VMKz4Q5gWIPW2FlAReccKsdlYUVvpy5eAt89xiZ7EYsu13OAF2w21+gTvkENXht4m9XHzoccMEpycQL3642ofXo6OgTGzw6Orqkto1YIAEzAkbos4jfodj5p21XGxxwwQm3wOBK97CTMgO7/yhUihsbBJHjNYKP+zYSCwdc4eYih7tGzmG/Xum/SHEPDg7OxD4v0ezigs377PNGTLgYnCvse3msDPYBFqjDKbWLjJInQ+yRxH5yqss+wOGRhS8xvm98BOC6+AEOok57YuDI6FgShM2HrK+vb5aHEuQAHRt9+Lg78iIkg1MJK79rpDfrn3fMCiMG1CrLBTlYXV39hS3040uMx4YnY+WXm8CJY93ZbHurCFMi5b2yFxK4zuuA5cOH4uagEQvH9cniImfKxR7CXkOMmuTcKFxvAJ0kzV7LYVYVT/WVQrBgzwnBDkkMN3zqV1X9AwVs0gxOys5DAAAAAElFTkSuQmCC';
|
||||
|
||||
$needle='data:image/png;base64,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 truncated
|
||||
|
||||
.pos {
|
||||
background-image: url($pos);
|
||||
}
|
||||
|
||||
.bottom-bar {
|
||||
width: 100%;
|
||||
height: transformRem(100);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 50
|
||||
&>.bom-bar-bg {
|
||||
width: 100%;
|
||||
height: transformRem(100);
|
||||
background: -o-linear-gradient(top , rgb(51, 51, 51) 28% , rgb(30, 30, 30) 68%);
|
||||
background: -ms-linear-gradient(top , rgb(51, 51, 51) 28% , rgb(30, 30, 30) 68%);
|
||||
background: -moz-linear-gradient(top , rgb(51, 51, 51) 28% , rgb(30, 30, 30) 68%);
|
||||
background: -webkit-linear-gradient(top , rgb(51, 51, 51) 28% , rgb(30, 30, 30) 68%);
|
||||
background: linear-gradient(top , rgb(51, 51, 51) 28% , rgb(30, 30, 30) 68%);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.music-msg {
|
||||
height: transformRem(80);
|
||||
padding-top: transformRem(10);
|
||||
padding-left: transformRem(15);
|
||||
float: left;
|
||||
&>.left-box {
|
||||
width: transformRem(80);
|
||||
height: transformRem(80);
|
||||
float: left;
|
||||
&>.title-page {
|
||||
display: block;
|
||||
width: transformRem(80);
|
||||
height: transformRem(80);
|
||||
overflow: hidden;
|
||||
border-radius: transformRem(40);
|
||||
border:#000000 solid transformRem(2);
|
||||
box-sizing:border-box;
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
&>.right-box {
|
||||
float: left;
|
||||
height: transformRem(65);
|
||||
width: transformRem(400);
|
||||
padding-left: transformRem(15);
|
||||
padding-top: transformRem(15);
|
||||
&>.text-msg {
|
||||
width: 100%;
|
||||
height: transformRem(55);
|
||||
line-height: transformRem(65);
|
||||
&>.music-name {
|
||||
width: 65%;
|
||||
color: #fff;
|
||||
float: left;
|
||||
}
|
||||
&>.music-time {
|
||||
width: 35%;
|
||||
float: right;
|
||||
color: #797979;
|
||||
text-align: right;
|
||||
&>.ct {
|
||||
color: #a1a1a1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&>.progress-bar {
|
||||
width: 100%;
|
||||
height: transformRem(10);
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
background-color: #414141;
|
||||
border-radius: transformRem(5);
|
||||
&>.prog {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
&>.load-prog {
|
||||
height: 100%;
|
||||
background-color: #535353;
|
||||
border-radius: transformRem(5);
|
||||
}
|
||||
&>.play-prog {
|
||||
background-color: #c70c0c;
|
||||
border-radius: transformRem(5);
|
||||
&>span {
|
||||
width: transformRem(33);
|
||||
height: transformRem(36);
|
||||
position: absolute;
|
||||
top: transformRem(-10.5);
|
||||
right: transformRem(-19.5);
|
||||
margin-left: transformRem(-16.5);
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.controller {
|
||||
float: right;
|
||||
padding-right: transformRem(15);
|
||||
padding-top: transformRem(15);
|
||||
height: transformRem(65);
|
||||
a {
|
||||
display: block;
|
||||
background-repeat: no-repeat;
|
||||
float: left;
|
||||
}
|
||||
&>.ctrl-btn {
|
||||
width: transformRem(65);
|
||||
height: transformRem(65);
|
||||
margin:0 transformRem(10);
|
||||
}
|
||||
&>.play {
|
||||
background-image: url($play1);
|
||||
background-size: cover;
|
||||
&:active {
|
||||
background-image: url($play2);
|
||||
}
|
||||
}
|
||||
&>.pause {
|
||||
background-image: url($zt1);
|
||||
background-size: cover;
|
||||
&:active {
|
||||
background-image: url($zt2);
|
||||
}
|
||||
}
|
||||
&>.cutover {
|
||||
width: transformRem(50);
|
||||
height: transformRem(50);
|
||||
margin-top: transformRem(7);
|
||||
}
|
||||
&>.prev {
|
||||
background-image: url($syg1);
|
||||
background-size: cover;
|
||||
&:active {
|
||||
background-image: url($syg2);
|
||||
}
|
||||
}
|
||||
&>.next {
|
||||
background-image: url($xyg1);
|
||||
background-size: cover;
|
||||
&:active {
|
||||
background-image: url($xyg2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.middle-box {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.music-main {
|
||||
height: 100%;
|
||||
background-color: #333;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.bg-block {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position:absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
-webkit-filter: blur(100px);
|
||||
-moz-filter: blur(100px);
|
||||
-o-filter: blur(100px);
|
||||
-ms-filter: blur(100px);
|
||||
filter: blur(100px);
|
||||
}
|
||||
|
||||
.needle-plus {
|
||||
width: transformRem(231);
|
||||
height: transformRem(330);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
margin-left: transformRem(-50);
|
||||
background-image: url($needle);
|
||||
background-size: cover;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.disc {
|
||||
width: transformRem(600);
|
||||
height: transformRem(600);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: transformRem(150);
|
||||
margin-left: transformRem(-300);
|
||||
&>.disc-mask {
|
||||
background-image: url($disc);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top:0;
|
||||
}
|
||||
&>.singer-img {
|
||||
width: transformRem(300);
|
||||
height: transformRem(300);
|
||||
padding: transformRem(150);
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.rotate {
|
||||
-webkit-animation-name: rotate;
|
||||
-webkit-animation-duration: 12s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
|
||||
animation-name: rotate;
|
||||
animation-duration: 12s;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
|
||||
}
|
||||
|
||||
@-ms-keyframes rotate {
|
||||
0% {
|
||||
-ms-transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
-ms-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.rot-play {
|
||||
-webkit-animation-play-state: running;
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
.rot-paused {
|
||||
-webkit-animation-play-state: paused;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
.song-lyrics {
|
||||
width: transformRem(600);
|
||||
height: transformRem(300);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: transformRem(800);
|
||||
margin-left: transformRem(-300);
|
||||
overflow: hidden;
|
||||
&>.lyrics-scroll {
|
||||
text-align: center;
|
||||
line-height: transformRem(60);
|
||||
transition: transform .3s ease-out;
|
||||
&>p {
|
||||
font-size: transformRem(30);
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
&>.cur {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.search-btn {
|
||||
//width: transformRem(40);
|
||||
//height: transformRem(40);
|
||||
position: absolute;
|
||||
right: transformRem(40);
|
||||
top: transformRem(50);
|
||||
&>button {
|
||||
font-size: transformRem(26);
|
||||
padding: transformRem(10) transformRem(15);
|
||||
color: #fff;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
border: rgba(255, 255, 255, 0.6) solid transformRem(2);
|
||||
}
|
||||
}
|
||||
|
||||
.search-pop {
|
||||
width:100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
&>.pop-bg {
|
||||
width:100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: .4;
|
||||
background-color: #000;
|
||||
}
|
||||
&>.pop-main {
|
||||
width:100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
width: transformRem(600);
|
||||
height: transformRem(50);
|
||||
padding: transformRem(30) 0;
|
||||
&>.search-input {
|
||||
width: transformRem(500);
|
||||
height: transformRem(50);
|
||||
border: rgba(255, 255, 255, 0.6) solid transformRem(2);
|
||||
border-right: none;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
line-height: transformRem(50);
|
||||
color: #fff;
|
||||
font-size: transformRem(28);
|
||||
box-sizing:border-box;
|
||||
border-top-left-radius: transformRem(25);
|
||||
border-bottom-left-radius: transformRem(25);
|
||||
padding: 0 transformRem(25);
|
||||
float: left;
|
||||
}
|
||||
&>.search-button {
|
||||
width: transformRem(100);
|
||||
height: transformRem(50);
|
||||
border: rgba(255, 255, 255, 0.6) solid transformRem(2);
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
line-height: transformRem(50);
|
||||
color: #fff;
|
||||
font-size: transformRem(28);
|
||||
box-sizing:border-box;
|
||||
border-top-right-radius: transformRem(25);
|
||||
border-bottom-right-radius: transformRem(25);
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
.search-list {
|
||||
width: transformRem(600);
|
||||
flex:1;
|
||||
overflow-y: auto;
|
||||
&>.search-list-scroll {
|
||||
&>.search-list-item {
|
||||
height: transformRem(50);
|
||||
padding: transformRem(10) 0;
|
||||
display: flex;
|
||||
justify-content:space-between;
|
||||
&>p {
|
||||
line-height: transformRem(50);
|
||||
width: transformRem(480);
|
||||
font-size: transformRem(26);
|
||||
color: #fff;
|
||||
}
|
||||
&>button {
|
||||
width: transformRem(100);
|
||||
height: transformRem(50);
|
||||
border: rgba(255, 255, 255, 0.6) solid transformRem(2);
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
line-height: transformRem(50);
|
||||
color: #fff;
|
||||
font-size: transformRem(28);
|
||||
box-sizing:border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
width: transformRem(600);
|
||||
height: transformRem(100);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center
|
||||
&>button {
|
||||
width: transformRem(120);
|
||||
height: transformRem(60);
|
||||
border: rgba(255, 255, 255, 0.6) solid transformRem(2);
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
line-height: transformRem(60);
|
||||
color: #fff;
|
||||
font-size: transformRem(30);
|
||||
box-sizing:border-box;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
(function() {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?0f04900edf2f8fdee9b63f1da475ada3";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
|
||||
<script src="http://dl2.vip.yystatic.com/assets/js/template2.0.4.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "图吧",
|
||||
"description":"美女,内涵图,图吧",
|
||||
"keywords":"美女,内涵图,图吧"
|
||||
}
|
||||
@@ -0,0 +1,123 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}美女图片-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main" id="main">
|
||||
|
||||
{#<div class="item-block">
|
||||
<div class="big-item">
|
||||
<div class="img-box">
|
||||
<img src="http://wx2.sinaimg.cn/mw600/006oxNJJly1fhnavnvq1pj30d20zjq7f.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="small-item">
|
||||
<div class="lit-item">
|
||||
<div class="img-box">
|
||||
<img src="http://wx4.sinaimg.cn/mw600/70f421e3gy1fhn7pwznvyj20jg0t5q4f.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="lit-item mt">
|
||||
<div class="img-box">
|
||||
<img src="http://wx4.sinaimg.cn/mw600/005vbOHfgy1fhnait6kqsj30ia0wijts.jpg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-block">
|
||||
<div class="small-item">
|
||||
<div class="lit-item">
|
||||
<div class="img-box">
|
||||
<img src="http://wx4.sinaimg.cn/mw600/70f421e3gy1fhn7pwznvyj20jg0t5q4f.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="lit-item mt">
|
||||
<div class="img-box">
|
||||
<img src="http://wx4.sinaimg.cn/mw600/005vbOHfgy1fhnait6kqsj30ia0wijts.jpg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="big-item">
|
||||
<div class="img-box">
|
||||
<img src="http://wx2.sinaimg.cn/mw600/006oxNJJly1fhnavnvq1pj30d20zjq7f.jpg">
|
||||
</div>
|
||||
</div>
|
||||
</div>#}
|
||||
|
||||
</div>
|
||||
|
||||
<div class="more-block">
|
||||
<a class="more-btn" id="more-btn" href="javascript:;">加载更多</a>
|
||||
</div>
|
||||
|
||||
<div class="pop-mark" id="pop-mark" style="display: none"></div>
|
||||
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script id="list-tpl" type="text/html">
|
||||
{{each data as val key}}
|
||||
{{if val.length == 3}}
|
||||
{{if key%2 == 0}}
|
||||
<div class="item-block">
|
||||
<div class="big-item">
|
||||
<div class="img-box">
|
||||
<img src="{{val[0].srcUrl}}" {{if val[0].srcGifUrl}}org="{{val[0].srcGifUrl}}"{{/if}}>
|
||||
</div>
|
||||
</div>
|
||||
<div class="small-item">
|
||||
<div class="lit-item">
|
||||
<div class="img-box">
|
||||
<img src="{{val[1].srcUrl}}" {{if val[1].srcGifUrl}}org="{{val[1].srcGifUrl}}"{{/if}}>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lit-item mt">
|
||||
<div class="img-box">
|
||||
<img src="{{val[2].srcUrl}}" {{if val[2].srcGifUrl}}org="{{val[2].srcGifUrl}}"{{/if}}>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="item-block">
|
||||
<div class="small-item">
|
||||
<div class="lit-item">
|
||||
<div class="img-box">
|
||||
<img src="{{val[0].srcUrl}}" {{if val[0].srcGifUrl}}org="{{val[0].srcGifUrl}}"{{/if}}>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lit-item mt">
|
||||
<div class="img-box">
|
||||
<img src="{{val[1].srcUrl}}" {{if val[1].srcGifUrl}}org="{{val[1].srcGifUrl}}"{{/if}}>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="big-item">
|
||||
<div class="img-box">
|
||||
<img src="{{val[2].srcUrl}}" {{if val[2].srcGifUrl}}org="{{val[2].srcGifUrl}}"{{/if}}>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/each}}
|
||||
</script>
|
||||
|
||||
<script id="pop-tpl" type="text/html">
|
||||
<div class="img-pop">
|
||||
<div class="img-main">
|
||||
<img src="{{imgUrl}}">
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,110 @@
|
||||
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
//var dialog = require('../../script/extends/phone/dialog');
|
||||
|
||||
//var template = require('../../script/lib/template.min.js');
|
||||
|
||||
var startNumber = 0;
|
||||
|
||||
getList(startNumber);
|
||||
|
||||
function getList(start) {
|
||||
$.ajax({
|
||||
url:'/data/getPictureList',
|
||||
type:'GET',
|
||||
dataType:'json',
|
||||
data:{
|
||||
start:start,
|
||||
number:12
|
||||
},
|
||||
cache:false,
|
||||
success:function(json){
|
||||
if(json.result) {
|
||||
if(json.data.length >= 12) {
|
||||
var data = fixDataArray(json.data);
|
||||
$('#main').append(template('list-tpl',{data:data}));
|
||||
}else if(json.data.length < 12 && json.data.length > 0){
|
||||
var data = fixDataArray(json.data);
|
||||
$('#main').append(template('list-tpl',{data:data}));
|
||||
|
||||
$('#more-btn').html('已经没有数据了!');
|
||||
$('#more-btn').off('tap');
|
||||
}else if(json.data.length == 0) {
|
||||
$('#more-btn').html('已经没有数据了!');
|
||||
$('#more-btn').off('tap');
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function fixDataArray(data) {
|
||||
var allArr = [];
|
||||
var litArr = [];
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
litArr.push(data[i]);
|
||||
if(((i+1)!=0 && (i+1)%3==0) || i==data.length-1) {
|
||||
//console.log(litArr);
|
||||
allArr.push(litArr);
|
||||
litArr = [];
|
||||
}
|
||||
}
|
||||
return allArr;
|
||||
}
|
||||
|
||||
$('#more-btn').on('tap',function(){
|
||||
startNumber = startNumber+12;
|
||||
getList(startNumber);
|
||||
});
|
||||
|
||||
// $('#more-btn').tap(function(){
|
||||
// startNumber = startNumber+12;
|
||||
// getList(startNumber);
|
||||
// });
|
||||
|
||||
$('#main').delegate('img','tap',function(evt){
|
||||
|
||||
var _this = $(this);
|
||||
|
||||
var imgUrl = _this.attr('org')?_this.attr('org'):_this.attr('src');
|
||||
$('#pop-mark').show();
|
||||
$('.content-box').css({'overflow-y':'hidden'});
|
||||
var tpl = template('pop-tpl',{imgUrl:imgUrl});
|
||||
$('body').append(tpl);
|
||||
|
||||
var imgPop = $('.img-main');
|
||||
|
||||
loadImage(imgUrl,function(){
|
||||
var imgHeight = imgPop.find('img').height();
|
||||
|
||||
//console.log(imgHeight)
|
||||
//console.log(document.body.offsetHeight)
|
||||
if(imgHeight > document.body.offsetHeight){
|
||||
imgPop.css({display:'block'});
|
||||
}else{
|
||||
imgPop.css({display:'flex'});
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
$('body').delegate('.img-pop','tap',function(evt){
|
||||
//console.log($(this).find('img').height());
|
||||
$('#pop-mark').hide();
|
||||
$('.content-box').css({'overflow-y':'auto'});
|
||||
$(this).remove();
|
||||
});
|
||||
|
||||
function loadImage(url, callback) {
|
||||
var img = new Image(); //创建一个Image对象,实现图片的预下载
|
||||
img.src = url;
|
||||
|
||||
if(img.complete) { // 如果图片已经存在于浏览器缓存,直接调用回调函数
|
||||
callback.call(img);
|
||||
return; // 直接返回,不用再处理onload事件
|
||||
}
|
||||
img.onload = function () { //图片下载完毕时异步调用callback函数。
|
||||
callback.call(img);//将回调函数的this替换为Image对象
|
||||
};
|
||||
};
|
||||
@@ -0,0 +1,94 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
html,body,.content-box {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.content-box {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.index-main {
|
||||
width: 9.6rem;
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
|
||||
.item-block {
|
||||
width: 100%;
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
justify-content:space-between;
|
||||
}
|
||||
|
||||
.big-item {
|
||||
width: 6.3rem;
|
||||
height: 6.4rem;
|
||||
}
|
||||
|
||||
.small-item {
|
||||
width: 3.2rem;
|
||||
height: 6.4rem;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: #eee;
|
||||
display: flex;
|
||||
justify-content:center;
|
||||
align-items:center;
|
||||
&>img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.lit-item {
|
||||
width: 3.2rem;
|
||||
height: 3.15rem;
|
||||
}
|
||||
|
||||
.mt {
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
|
||||
.more-block {
|
||||
width: 9.6rem;
|
||||
margin: 0.2rem auto;
|
||||
&>.more-btn {
|
||||
display: block;
|
||||
color: #0a77fd;
|
||||
font-size: 0.4rem;
|
||||
height: 1rem;
|
||||
line-height: 1rem;
|
||||
text-align: center;
|
||||
border-radius: 0.1rem;
|
||||
border: #0a77fd solid 0.02rem;
|
||||
text-decoration:none;
|
||||
}
|
||||
}
|
||||
|
||||
.img-pop {
|
||||
width:100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 101;
|
||||
&>.img-main {
|
||||
width: 9.6rem;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
//justify-content:center;
|
||||
align-items:center;
|
||||
margin: 0 auto;
|
||||
&>img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
<h1>hello,{{name}}</h1>
|
||||
<p>哈哈哈哈</p>
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,10 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
var hello = require('../../script/tmodjs/test-pc/hello');
|
||||
|
||||
$('.index-main').append(hello({name:'大兄弟'}));
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
@@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
<h1>hello,{{name}}</h1>
|
||||
<p>哈哈哈哈!</p>
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,7 @@
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
//var dialog = require('../../script/extends/phone/dialog');
|
||||
|
||||
var hello = require('../../script/tmodjs/test/hello');
|
||||
|
||||
$('.index-main').append(hello({name:'大兄弟'}));
|
||||
@@ -0,0 +1,5 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div id="content-box" class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "测试你是怎样的人",
|
||||
"description":"丰田-凯美瑞-测试你是怎样的人",
|
||||
"keywords":"丰田-凯美瑞-测试你是怎样的人"
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}丰田-凯美瑞-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
<div id="index-main" class="index-main">
|
||||
<div class="img-list">
|
||||
<div class="item cur">
|
||||
<img alt="丰田-凯美瑞-双擎" src="https://t1.picb.cc/uploads/2017/11/16/NAhV6.png">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img alt="丰田-凯美瑞" src="https://t1.picb.cc/uploads/2017/11/16/NAqF7.png">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="item" style="margin-right:0">
|
||||
<img alt="丰田-凯美瑞-运动" src="https://t1.picb.cc/uploads/2017/11/16/NAWAs.png">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
<a id="btn" href="javascript:;"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,49 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
var resultTpl = require('../../script/tmodjs/toyotacamry/result');
|
||||
|
||||
var _resultData = {};
|
||||
var _conclusionArray = [
|
||||
['是商场上的进取者,是时尚界的弄潮儿,你永远先人一步走在前列,你是先锋行者',
|
||||
'是智慧又炫酷的互联网精英,更是勇于创新的革新者。你,就是独具慧眼新一代'],
|
||||
['受不了将就,忍不了低规格,追求品质是你与生俱来的基因,你就是天生贵族',
|
||||
'境界高、品味高、品质要求更要高,没错,你就是众人追捧的社会精英'],
|
||||
['脸上一直挂着阳光,脚下一直奔波在路上。你知道,生命的美好不存在于想象,而在追逐的远方,你是阳光型动派',
|
||||
'热爱旅游,钟情运动,你昂扬的姿态是人群中最独特的存在。你好啊!行走的正能量']
|
||||
];
|
||||
var _titleArray = [['https://t1.picb.cc/uploads/2017/11/15/NusC8.png','https://t1.picb.cc/uploads/2017/11/16/NWauy.png'],['https://t1.picb.cc/uploads/2017/11/15/Nu90w.png','https://t1.picb.cc/uploads/2017/11/15/NuzNg.png'],['https://t1.picb.cc/uploads/2017/11/15/NuTHW.png','https://t1.picb.cc/uploads/2017/11/15/NuDsX.png']];
|
||||
var _typeArray = ['hev','xle','xse'];
|
||||
var _index = 0;
|
||||
var _type = 0;
|
||||
|
||||
|
||||
$('.item').click(function(){
|
||||
//console.log(this);
|
||||
$(this).siblings().removeClass('cur');
|
||||
$(this).addClass('cur');
|
||||
_index = $(this).index();
|
||||
});
|
||||
|
||||
$('#btn').click(function(){
|
||||
_type = Math.floor(Math.random()*2);
|
||||
_resultData.picType = _typeArray[_index];
|
||||
_resultData.title = _titleArray[_index][_type];
|
||||
_resultData.conclusion = _conclusionArray[_index][_type];
|
||||
var resultHtml = $(resultTpl(_resultData));
|
||||
resultHtml.css({
|
||||
opacity:0,
|
||||
marginLeft:'100%'
|
||||
});
|
||||
$('#content-box').html(resultHtml);
|
||||
resultHtml.animate({
|
||||
opacity:1,
|
||||
marginLeft:0
|
||||
},500,function(){
|
||||
resultHtml.removeAttr('style');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,154 @@
|
||||
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
|
||||
$bg = 'https://t1.picb.cc/uploads/2017/11/16/NWbvj.jpg';
|
||||
|
||||
$gou = 'https://t1.picb.cc/uploads/2017/11/15/NuFOv.png';
|
||||
|
||||
$btn = 'https://t1.picb.cc/uploads/2017/11/15/NuPRi.png';
|
||||
|
||||
$hev = 'https://t1.picb.cc/uploads/2017/11/15/Nu03a.png';
|
||||
|
||||
$xle = 'https://t1.picb.cc/uploads/2017/11/15/Nupud.png';
|
||||
|
||||
$xse = 'https://t1.picb.cc/uploads/2017/11/15/Nubd1.png';
|
||||
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #030520
|
||||
}
|
||||
|
||||
.content-box {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
background-image: url($bg);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.index-main {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.img-list {
|
||||
padding-top: 160px;
|
||||
width: 552px;
|
||||
height: 144px;
|
||||
margin: 0 auto;
|
||||
&>.item {
|
||||
width: 176px;
|
||||
height: 144px;
|
||||
float: left;
|
||||
margin-right: 12px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
&>img {
|
||||
border: transparent solid 3px;
|
||||
&:hover {
|
||||
border: #244dca solid 3px;
|
||||
}
|
||||
}
|
||||
&>span {
|
||||
display: none;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
background-image: url($gou);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
bottom: 3px;
|
||||
}
|
||||
}
|
||||
&>.cur {
|
||||
&>img {
|
||||
border: #244dca solid 3px;
|
||||
}
|
||||
&>span {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
padding-top: 16px;
|
||||
width: 263px;
|
||||
height: 48px;
|
||||
margin: 0 auto;
|
||||
&>a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
background-image: url($btn);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.result-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
//padding-top: 153px;
|
||||
}
|
||||
|
||||
.result-main {
|
||||
//width: 546px;
|
||||
//height: 226px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
&>h1 {
|
||||
position: absolute;
|
||||
left: 26px;
|
||||
top:153px;
|
||||
}
|
||||
&>p {
|
||||
width: 490px;
|
||||
height: 40px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
left: 60px;
|
||||
top: 203px;
|
||||
color: #e0e1e3;
|
||||
font-size: 14px;
|
||||
font-family: 'Microsoft YaHei';
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.hev {
|
||||
background-image: url($hev);
|
||||
}
|
||||
|
||||
.xle {
|
||||
background-image: url($xle);
|
||||
}
|
||||
|
||||
.xse {
|
||||
background-image: url($xse);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
<div class="result-box {{picType}}">
|
||||
<div class="result-main">
|
||||
<h1><img src="{{title}}"></h1>
|
||||
<p>测试结果:{{conclusion}}</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div id="content-box" class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "测试你是怎样的人",
|
||||
"description":"丰田-凯美瑞-测试你是怎样的人",
|
||||
"keywords":"丰田-凯美瑞-测试你是怎样的人"
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}丰田-凯美瑞-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
<div id="index-main" class="index-main">
|
||||
<div class="img-list">
|
||||
<div class="item cur">
|
||||
<img alt="丰田-凯美瑞-双擎" src="./images/toyotacamry_hev.png">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img alt="丰田-凯美瑞" src="./images/toyotacamry_xle.png">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="item" style="margin-right:0">
|
||||
<img alt="丰田-凯美瑞-运动" src="./images/toyotacamry_xse.png">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
<a id="btn" href="javascript:;"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,49 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
var resultTpl = require('../../script/tmodjs/toyotacamry/result');
|
||||
|
||||
var _resultData = {};
|
||||
var _conclusionArray = [
|
||||
['是商场上的进取者,是时尚界的弄潮儿,你永远先人一步走在前列,你是先锋行者',
|
||||
'是智慧又炫酷的互联网精英,更是勇于创新的革新者。你,就是独具慧眼新一代'],
|
||||
['受不了将就,忍不了低规格,追求品质是你与生俱来的基因,你就是天生贵族',
|
||||
'境界高、品味高、品质要求更要高,没错,你就是众人追捧的社会精英'],
|
||||
['脸上一直挂着阳光,脚下一直奔波在路上。你知道,生命的美好不存在于想象,而在追逐的远方,你是阳光型动派',
|
||||
'热爱旅游,钟情运动,你昂扬的姿态是人群中最独特的存在。你好啊!行走的正能量']
|
||||
];
|
||||
var _titleArray = [['./images/title_hev_1.png','./images/title_hev_2.png'],['./images/title_xle_1.png','./images/title_xle_2.png'],['./images/title_xse_1.png','./images/title_xse_2.png']];
|
||||
var _typeArray = ['hev','xle','xse'];
|
||||
var _index = 0;
|
||||
var _type = 0;
|
||||
|
||||
|
||||
$('.item').click(function(){
|
||||
//console.log(this);
|
||||
$(this).siblings().removeClass('cur');
|
||||
$(this).addClass('cur');
|
||||
_index = $(this).index();
|
||||
});
|
||||
|
||||
$('#btn').click(function(){
|
||||
_type = Math.floor(Math.random()*2);
|
||||
_resultData.picType = _typeArray[_index];
|
||||
_resultData.title = _titleArray[_index][_type];
|
||||
_resultData.conclusion = _conclusionArray[_index][_type];
|
||||
var resultHtml = $(resultTpl(_resultData));
|
||||
resultHtml.css({
|
||||
opacity:0,
|
||||
marginLeft:'100%'
|
||||
});
|
||||
$('#content-box').html(resultHtml);
|
||||
resultHtml.animate({
|
||||
opacity:1,
|
||||
marginLeft:0
|
||||
},500,function(){
|
||||
resultHtml.removeAttr('style');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,154 @@
|
||||
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
|
||||
$bg = './images/toyotacamry_bg.jpg';
|
||||
|
||||
$gou = './images/toyotacamry_gou.png';
|
||||
|
||||
$btn = './images/toyotacamry_btn.png';
|
||||
|
||||
$hev = './images/hev_pic.png';
|
||||
|
||||
$xle = './images/xle_pic.png';
|
||||
|
||||
$xse = './images/xse_pic.png';
|
||||
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #030520
|
||||
}
|
||||
|
||||
.content-box {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
background-image: url($bg);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.index-main {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.img-list {
|
||||
padding-top: 160px;
|
||||
width: 552px;
|
||||
height: 144px;
|
||||
margin: 0 auto;
|
||||
&>.item {
|
||||
width: 176px;
|
||||
height: 144px;
|
||||
float: left;
|
||||
margin-right: 12px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
&>img {
|
||||
border: transparent solid 3px;
|
||||
&:hover {
|
||||
border: #244dca solid 3px;
|
||||
}
|
||||
}
|
||||
&>span {
|
||||
display: none;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
background-image: url($gou);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
bottom: 3px;
|
||||
}
|
||||
}
|
||||
&>.cur {
|
||||
&>img {
|
||||
border: #244dca solid 3px;
|
||||
}
|
||||
&>span {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
padding-top: 16px;
|
||||
width: 263px;
|
||||
height: 48px;
|
||||
margin: 0 auto;
|
||||
&>a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
background-image: url($btn);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.result-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
//padding-top: 153px;
|
||||
}
|
||||
|
||||
.result-main {
|
||||
//width: 546px;
|
||||
//height: 226px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
&>h1 {
|
||||
position: absolute;
|
||||
left: 26px;
|
||||
top:153px;
|
||||
}
|
||||
&>p {
|
||||
width: 490px;
|
||||
height: 40px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
left: 60px;
|
||||
top: 203px;
|
||||
color: #e0e1e3;
|
||||
font-size: 14px;
|
||||
font-family: 'Microsoft YaHei';
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.hev {
|
||||
background-image: url($hev);
|
||||
}
|
||||
|
||||
.xle {
|
||||
background-image: url($xle);
|
||||
}
|
||||
|
||||
.xse {
|
||||
background-image: url($xse);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
<div class="result-box {{picType}}">
|
||||
<div class="result-main">
|
||||
<h1><img src="{{title}}"></h1>
|
||||
<p>测试结果:{{conclusion}}</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<link rel="icon" type="image/x-icon" href="/pages/webchatroom/favicon.ico">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "老司机聊天室,开车稳",
|
||||
"description":"老司机聊天室,系好安全带",
|
||||
"keywords":"老司机聊天室,用不翻车"
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}老司机聊天室-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css" rel="stylesheet">
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
<div id="top-bar" class="weui-cell top-bar">
|
||||
<p>当前在线人数:<span id="online-users">0</span></p>
|
||||
</div>
|
||||
<div id="msg-content" class="msg-content">
|
||||
{# <div class="weui-cell">
|
||||
<div class="weui-cell__hd head-img hl">
|
||||
<img src="https://sfault-avatar.b0.upaiyun.com/175/934/175934663-572d654c6f521_big64">
|
||||
</div>
|
||||
<div class="weui-cell__hd bubble others">是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页开发量身设计,可以令用户的使用感知更加统一。在微信网页开发中使用1314</div>
|
||||
</div>
|
||||
<div class="weui-cell">
|
||||
<div class="weui-cell__hd head-img hl">
|
||||
<img src="https://sfault-avatar.b0.upaiyun.com/175/934/175934663-572d654c6f521_big64">
|
||||
</div>
|
||||
<div class="weui-cell__hd bubble others">我去年买了个表</div>
|
||||
</div>
|
||||
<div class="weui-cell">
|
||||
<div class="weui-cell__bd"></div>
|
||||
<div class="bubble self weui-cell__ft">我有一头小毛驴,可我从来也不骑</div>
|
||||
<div class="weui-cell__ft head-img hr">
|
||||
<img src="https://sfault-avatar.b0.upaiyun.com/175/934/175934663-572d654c6f521_big64">
|
||||
</div>
|
||||
</div>
|
||||
<div class="weui-cell">
|
||||
<div class="weui-cell__bd"></div>
|
||||
<div class="bubble self weui-cell__ft">WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页开发量身设计,可以令用户的使用感知更加统一。在微信网页开发中使用 WeUI,有如下优势:</div>
|
||||
<div class="weui-cell__ft head-img hr">
|
||||
<img src="https://sfault-avatar.b0.upaiyun.com/175/934/175934663-572d654c6f521_big64">
|
||||
</div>
|
||||
</div> #}
|
||||
</div>
|
||||
<div class="input-bar">
|
||||
<div class="weui-cell weui-cells_form">
|
||||
<div class="input-box weui-cell__bd"><input id="msg-val" class="weui-input" type="text" placeholder="请输入文本"></div>
|
||||
<div id="send-btn" class="send-box weui-cell__ft"><a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary">发送</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="http://node.dengtongyu.com/node_modules/socket.io-client/dist/socket.io.js"></script>
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,75 @@
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
//var dialog = require('../../script/extends/phone/dialog');
|
||||
|
||||
var socket = io.connect('http://node.dengtongyu.com/chat');
|
||||
//var socket = io.connect('http://localhost:8080/chat');
|
||||
var msgBox = $('#msg-content');
|
||||
var onlineUsersDom = $('#online-users');
|
||||
var onlineUsers = 0;
|
||||
var user = (new Date()).getTime();
|
||||
var userImageId = Math.floor(Math.random()*851 + 1);
|
||||
var sendData = {};
|
||||
$('#send-btn').click(function(){
|
||||
if($('#msg-val').val()=='') return false;
|
||||
sendData.msg = $('#msg-val').val();
|
||||
sendData.user = user;
|
||||
sendData.imageId = userImageId;
|
||||
socket.emit('client_chat_message', sendData);
|
||||
$('#msg-val').val('');
|
||||
});
|
||||
|
||||
//console.log(socket);
|
||||
|
||||
socket.on('broadcast_chat_message', function(data){
|
||||
//console.log('接收到服务器消息');
|
||||
//console.log(msgBox.find('.weui-cell').length);
|
||||
if(msgBox.find('.weui-cell').length > 18) {
|
||||
msgBox.find('.weui-cell').eq(0).remove();
|
||||
}
|
||||
if(data.user == user) {
|
||||
msgBox.append(setSelfMsg(data.msg,data.imageId));
|
||||
}else{
|
||||
msgBox.append(setOthersMsg(data.msg,data.imageId));
|
||||
}
|
||||
msgBox.scrollTop(msgBox[0].scrollHeight);
|
||||
});
|
||||
|
||||
msgBox.append(setOthersMsg('欢迎来到老司机开车聊天室!系好安全带,准备开车!','0'));
|
||||
|
||||
function getImageLink(imageId) {
|
||||
if(imageId) {
|
||||
return '/res/images/userimage/' + imageId + '.png';
|
||||
}
|
||||
}
|
||||
|
||||
function setOthersMsg(msg,imgId) {
|
||||
return '<div class="weui-cell"><div class="weui-cell__hd head-img hl"><img src="'+getImageLink(imgId)+'"></div><div class="weui-cell__hd bubble others">'+msg+'</div></div>';
|
||||
}
|
||||
function setSelfMsg(msg,imgId) {
|
||||
return '<div class="weui-cell"><div class="weui-cell__bd"></div><div class="weui-cell__ft bubble self">'+msg+'</div><div class="weui-cell__ft head-img hr"><img src="'+getImageLink(imgId)+'"></div></div>';
|
||||
}
|
||||
|
||||
function getOnlineUsers() {
|
||||
setTimeout(function(){
|
||||
socket.emit('client_get_online_users', {});
|
||||
//getOnlineUsers();
|
||||
},1000);
|
||||
}
|
||||
|
||||
getOnlineUsers();
|
||||
|
||||
socket.on('broadcast_online_users', function(data){
|
||||
setOnlineUsers(data);
|
||||
});
|
||||
|
||||
socket.on('online_users_change', function(data){
|
||||
setOnlineUsers(data);
|
||||
});
|
||||
|
||||
function setOnlineUsers(data) {
|
||||
if(onlineUsers != data.onlineUsers) {
|
||||
onlineUsers = data.onlineUsers;
|
||||
onlineUsersDom.html(onlineUsers);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,103 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
html,body ,.content-box{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.index-main {
|
||||
height: 100%;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.top-bar {
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
|
||||
&>p {
|
||||
line-height: 1rem;
|
||||
}
|
||||
}
|
||||
.msg-content {
|
||||
box-sizing: border-box;
|
||||
overflow-y: auto;
|
||||
flex: 1;
|
||||
|
||||
&>.weui-cell {
|
||||
box-align: start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
&>.weui-cell:before {
|
||||
border: none;
|
||||
}
|
||||
.head-img {
|
||||
&>img {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
border-radius: .2rem;
|
||||
}
|
||||
|
||||
}
|
||||
.hl {
|
||||
padding-right: .2rem;
|
||||
}
|
||||
.hr {
|
||||
padding-left: .2rem;
|
||||
}
|
||||
|
||||
.bubble {
|
||||
max-width: 60%;
|
||||
min-height: .5rem;
|
||||
line-height: .5rem;
|
||||
position: relative;
|
||||
border-radius: .1rem;
|
||||
padding: .1rem .2rem;
|
||||
color: #232323;
|
||||
}
|
||||
.bubble::before{
|
||||
content: '';
|
||||
width: .2rem;
|
||||
height: .2rem;
|
||||
position: absolute;
|
||||
top: .25rem;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.others {
|
||||
background-color: #fff;
|
||||
border: 1px solid #ededed;
|
||||
}
|
||||
.others::before {
|
||||
background-color: #fff;
|
||||
border: 1px #ededed;
|
||||
left: -0.1rem;
|
||||
border-style: none none solid solid;
|
||||
}
|
||||
.self {
|
||||
background-color: #9eea6a;
|
||||
border: 1px solid #9eea6a;
|
||||
}
|
||||
.self::before {
|
||||
background-color: #9eea6a;
|
||||
border: 1px #9eea6a;
|
||||
right: -0.1rem;
|
||||
border-style: solid solid none none;
|
||||
}
|
||||
}
|
||||
.input-bar {
|
||||
width: 100%;
|
||||
//height:1rem;
|
||||
//position: fixed;
|
||||
//bottom: 0;
|
||||
//left: 0;
|
||||
border-top: #ccc solid 1px;
|
||||
#msg-val {
|
||||
height: .85rem;
|
||||
}
|
||||
#send-btn {
|
||||
&>a {
|
||||
font-size: .35rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
Vendored
BIN
Binary file not shown.
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,195 @@
|
||||
/*
|
||||
本弹窗组件用于手机移动端页面,不依赖jQuery或者zepto,不兼容低版本IE浏览器。
|
||||
|
||||
用法:
|
||||
引入js模块
|
||||
var dialog=require('./lightDialog');
|
||||
|
||||
引入样式
|
||||
(因为样式采用rem单位,所以建议引入样式前声明$norm值,不声明则默认值为750)
|
||||
例如:
|
||||
$norm=640;
|
||||
@import './common/dialog-pop.styl';
|
||||
|
||||
调用
|
||||
dialog.showMsgBoth('呵呵哈哈哈',function(){
|
||||
dialog.showMsg('我点了确定按钮');
|
||||
return false; //可以通过 return false 阻断弹窗关闭
|
||||
},function(){
|
||||
dialog.showMsgRightTop('我点了取消按钮',function(){
|
||||
console.log('关闭')
|
||||
});
|
||||
},null,'关闭');
|
||||
|
||||
*/
|
||||
|
||||
var dialogPop=require('./dialog_pop');
|
||||
|
||||
var config={
|
||||
yesShow:true, //是否显示确定按钮
|
||||
noShow:false, //是否显示取消按钮
|
||||
closeBtnShow:false, //是否显示右上角关闭按钮
|
||||
}
|
||||
|
||||
var bodyDom=document.querySelector('body'),
|
||||
tempDom,popObj={};
|
||||
//visible='display:block;visibility:hidden';
|
||||
|
||||
//合并对象
|
||||
function extend(des,src){
|
||||
for(var key in src){
|
||||
des[key]=src[key]
|
||||
}
|
||||
return des;
|
||||
}
|
||||
|
||||
//创建dom
|
||||
function strDom(html) {
|
||||
tempDom = document.createElement('div');
|
||||
tempDom.innerHTML = html//.replace(/\s+|\n/g,' ').replace(/>\s</g,'><');
|
||||
return tempDom.childNodes;
|
||||
};
|
||||
|
||||
//过滤字符DOM
|
||||
function filterNode(nodeList) {
|
||||
var newNodeList=[];
|
||||
for (var i = 0; i < nodeList.length; i++) {
|
||||
/*if (nodeList[i].nodeName!='#text'&&nodeList[i].nodeValue!=' ') {
|
||||
newNodeList.push(nodeList[i]);
|
||||
}*/
|
||||
newNodeList.push(nodeList[i]);
|
||||
}
|
||||
return newNodeList;
|
||||
}
|
||||
|
||||
//插入节点
|
||||
function insertHtml(nodeList,parentNode) {
|
||||
for (var i = 0; i < nodeList.length; i++) {
|
||||
parentNode.appendChild(nodeList[i]);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//计算居中
|
||||
function popDomCenter(node,key) {
|
||||
//node.setAttribute('style',visible);
|
||||
var className=node.getAttribute('class')+' animated bounceIn';
|
||||
node.setAttribute('class',className);
|
||||
node.setAttribute('style','margin-top:-'+(node.offsetHeight/2)+'px;margin-left:-'+(node.offsetWidth/2)+'px');
|
||||
className=null;
|
||||
}
|
||||
|
||||
//选中弹窗
|
||||
function selectPopDom(nodeList,key) {
|
||||
for (var i = 0; i < nodeList.length; i++) {
|
||||
if (nodeList[i].id==key) {
|
||||
return nodeList[i]
|
||||
}else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//确定按钮
|
||||
function bindYesButton(node,cb) {
|
||||
node.querySelector('.dialog-yes').onclick=function(){
|
||||
if (typeof cb==='function') cb(this)===false||closePop(this);
|
||||
else closePop(this);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//取消按钮
|
||||
function bindNoButton(node,cb) {
|
||||
node.querySelector('.dialog-no').onclick=function(){
|
||||
if (typeof cb==='function') cb(this)===false||closePop(this);
|
||||
else closePop(this);
|
||||
}
|
||||
}
|
||||
|
||||
//关闭按钮
|
||||
function bindCloseButton(node,cb) {
|
||||
node.querySelector('.dialog-close').onclick=function(){
|
||||
closePop(this);
|
||||
if (typeof cb==='function') cb(this);
|
||||
}
|
||||
}
|
||||
|
||||
//关闭弹窗
|
||||
function closePop(btn) {
|
||||
var popId=btn.getAttribute('sub');
|
||||
if(popId){
|
||||
for (var i = 0; i < popObj[popId].length; i++) {
|
||||
bodyDom.removeChild(popObj[popId][i]);
|
||||
}
|
||||
delete popObj[popId];
|
||||
}
|
||||
popId=null;
|
||||
}
|
||||
|
||||
//创建弹窗
|
||||
function baseMsgPop(obj) {
|
||||
obj.popId=new Date().getTime();
|
||||
var configTemp=JSON.parse(JSON.stringify(config));
|
||||
obj=extend(configTemp,obj);
|
||||
|
||||
var nodeList=filterNode(strDom(dialogPop(obj)));
|
||||
popObj[obj.popId]=nodeList;
|
||||
insertHtml(nodeList,bodyDom);
|
||||
var popDom=selectPopDom(popObj[obj.popId],obj.popId);
|
||||
if (obj.text) {
|
||||
insertHtml(filterNode(strDom(obj.text)),popDom.querySelector('#dialog-content'));
|
||||
}
|
||||
popDomCenter(popDom,obj.popId);
|
||||
|
||||
if (obj.yesShow) {
|
||||
bindYesButton(popDom,obj.yesFun);
|
||||
};
|
||||
|
||||
if (obj.noShow) {
|
||||
bindNoButton(popDom,obj.noFun);
|
||||
};
|
||||
|
||||
if (obj.closeBtnShow) {
|
||||
bindCloseButton(popDom,obj.closeFun);
|
||||
};
|
||||
configTemp=popDom=nodeList=null;
|
||||
}
|
||||
|
||||
//普通弹窗,只有一个确定按钮
|
||||
function showMsg(text,cb,showMark) {
|
||||
baseMsgPop({
|
||||
text:text, //提示文案
|
||||
yesFun:cb, //确定按钮的回调函数
|
||||
showMark:showMark //是否显示遮罩
|
||||
});
|
||||
}
|
||||
|
||||
//交互弹窗,确定和取消按钮
|
||||
function showMsgBoth(text,yesFun,noFun,yesBtnText,noBtnText,showMark) {
|
||||
baseMsgPop({
|
||||
text:text, //提示文案
|
||||
noShow:true, //显示取消按钮
|
||||
yesFun:yesFun, //确定按钮的回调函数
|
||||
noFun:noFun, //取消按钮的回调函数
|
||||
yesBtnText:yesBtnText, //确定按钮的文案
|
||||
noBtnText:noBtnText, //取消按钮的文案
|
||||
showMark:showMark //是否显示遮罩
|
||||
});
|
||||
}
|
||||
|
||||
//关闭弹窗,只有右上角的关闭按钮
|
||||
function showMsgRightTop(text,closeFun,showMark) {
|
||||
baseMsgPop({
|
||||
text:text, //提示文案
|
||||
yesShow:false, //不显示确定按钮
|
||||
closeBtnShow:true, //显示右上角关闭按钮
|
||||
closeFun:closeFun, //关闭按钮的回调函数
|
||||
showMark:showMark //是否显示遮罩
|
||||
});
|
||||
}
|
||||
|
||||
exports.baseMsgPop=baseMsgPop //基础创建弹窗方法
|
||||
exports.showMsg=showMsg; //普通弹窗,只有一个确定按钮
|
||||
exports.showMsgBoth=showMsgBoth; //交互弹窗,确定和取消按钮
|
||||
exports.showMsgRightTop=showMsgRightTop; //关闭弹窗,只有右上角的关闭按钮
|
||||
@@ -0,0 +1,2 @@
|
||||
/*TMODJS:{"version":21,"md5":"320106be58718108f95400007e217d19"}*/
|
||||
define(function(require){return require("./template")("dialog_pop",function(a){"use strict";var b=this,c=(b.$helpers,a.popId),d=b.$escape,e=a.yesShow,f=a.noShow,g=a.noBtnText,h=a.yesBtnText,i=a.closeBtnShow,j=a.showMark,k="";return k+='<div class="dialog-pop"',c&&(k+=' id="',k+=d(c),k+='"'),k+=' style="display:block;visibility:hidden"> <div class="dialog-content" id="dialog-content"></div> ',(e||f)&&(k+=' <div class="dialog-btn"> ',f&&(k+='<button id="dialog-no-btn" class="dialog-no" sub="',k+=d(c),k+='">',k+=d(g||"\u53d6\u6d88"),k+="</button>"),k+=" ",e&&(k+='<button id="dialog-yes-btn" class="dialog-yes" sub="',k+=d(c),k+='">',k+=d(h||"\u786e\u5b9a"),k+="</button>"),k+=" </div> "),k+=" ",i&&(k+='<button id="dialog-close-btn" class="dialog-close" sub="',k+=d(c),k+='"></button>'),k+=" </div> ",j&&(k+='<div class="pop-mark"></div>'),k+=" ",new String(k)})});
|
||||
@@ -0,0 +1,2 @@
|
||||
/*TMODJS:{}*/
|
||||
!function(){function a(a,b){return(/string|function/.test(typeof b)?h:g)(a,b)}function b(a,c){return"string"!=typeof a&&(c=typeof a,"number"===c?a+="":a="function"===c?b(a.call(a)):""),a}function c(a){return l[a]}function d(a){return b(a).replace(/&(?![\w#]+;)|[<>"']/g,c)}function e(a,b){if(m(a))for(var c=0,d=a.length;d>c;c++)b.call(a,a[c],c,a);else for(c in a)b.call(a,a[c],c)}function f(a,b){var c=/(\/)[^\/]+\1\.\.\1/,d=("./"+a).replace(/[^\/]+$/,""),e=d+b;for(e=e.replace(/\/\.\//g,"/");e.match(c);)e=e.replace(c,"/");return e}function g(b,c){var d=a.get(b)||i({filename:b,name:"Render Error",message:"Template not found"});return c?d(c):d}function h(a,b){if("string"==typeof b){var c=b;b=function(){return new k(c)}}var d=j[a]=function(c){try{return new b(c,a)+""}catch(d){return i(d)()}};return d.prototype=b.prototype=n,d.toString=function(){return b+""},d}function i(a){var b="{Template Error}",c=a.stack||"";if(c)c=c.split("\n").slice(0,2).join("\n");else for(var d in a)c+="<"+d+">\n"+a[d]+"\n\n";return function(){return"object"==typeof console&&console.error(b+"\n\n"+c),b}}var j=a.cache={},k=this.String,l={"<":"<",">":">",'"':""","'":"'","&":"&"},m=Array.isArray||function(a){return"[object Array]"==={}.toString.call(a)},n=a.utils={$helpers:{},$include:function(a,b,c){return a=f(c,a),g(a,b)},$string:b,$escape:d,$each:e},o=a.helpers=n.$helpers;a.get=function(a){return j[a.replace(/^\.\//,"")]},a.helper=function(a,b){o[a]=b},define(function(){return a})}();
|
||||
Vendored
+1
@@ -0,0 +1 @@
|
||||
!function(e){"use strict";var n=function(e,r){return n["string"==typeof r?"compile":"render"].apply(n,arguments)};n.version="2.0.4",n.openTag="<%",n.closeTag="%>",n.isEscape=!0,n.isCompress=!1,n.parser=null,n.render=function(e,r){var t=n.get(e)||a({id:e,name:"Render Error",message:"No Template"});return t(r)},n.compile=function(e,t){function o(r){try{return new l(r,e)+""}catch(i){return s?a(i)():n.compile(e,t,!0)(r)}}var c=arguments,s=c[2],u="anonymous";"string"!=typeof t&&(s=c[1],t=c[0],e=u);try{var l=i(e,t,s)}catch(p){return p.id=e||t,p.name="Syntax Error",a(p)}return o.prototype=l.prototype,o.toString=function(){return l.toString()},e!==u&&(r[e]=o),o};var r=n.cache={},t=n.helpers=function(){var e=function(n,r){return"string"!=typeof n&&(r=typeof n,"number"===r?n+="":n="function"===r?e(n.call(n)):""),n},r={"<":"<",">":">",'"':""","'":"'","&":"&"},t=function(n){return e(n).replace(/&(?![\w#]+;)|[<>"']/g,function(e){return r[e]})},a=Array.isArray||function(e){return"[object Array]"==={}.toString.call(e)},i=function(e,n){if(a(e))for(var r=0,t=e.length;t>r;r++)n.call(e,e[r],r,e);else for(r in e)n.call(e,e[r],r)};return{$include:n.render,$string:e,$escape:t,$each:i}}();n.helper=function(e,n){t[e]=n},n.onerror=function(n){var r="Template Error\n\n";for(var t in n)r+="<"+t+">\n"+n[t]+"\n\n";e.console&&console.error(r)},n.get=function(t){var a;if(r.hasOwnProperty(t))a=r[t];else if("document"in e){var i=document.getElementById(t);if(i){var o=i.value||i.innerHTML;a=n.compile(t,o.replace(/^\s*|\s*$/g,""))}}return a};var a=function(e){return n.onerror(e),function(){return"{Template Error}"}},i=function(){var e=t.$each,r="break,case,catch,continue,debugger,default,delete,do,else,false,finally,for,function,if,in,instanceof,new,null,return,switch,this,throw,true,try,typeof,var,void,while,with,abstract,boolean,byte,char,class,const,double,enum,export,extends,final,float,goto,implements,import,int,interface,long,native,package,private,protected,public,short,static,super,synchronized,throws,transient,volatile,arguments,let,yield,undefined",a=/\/\*[\w\W]*?\*\/|\/\/[^\n]*\n|\/\/[^\n]*$|"(?:[^"\\]|\\[\w\W])*"|'(?:[^'\\]|\\[\w\W])*'|[\s\t\n]*\.[\s\t\n]*[$\w\.]+/g,i=/[^\w$]+/g,o=new RegExp(["\\b"+r.replace(/,/g,"\\b|\\b")+"\\b"].join("|"),"g"),c=/^\d[^,]*|,\d[^,]*/g,s=/^,+|,+$/g,u=function(e){return e.replace(a,"").replace(i,",").replace(o,"").replace(c,"").replace(s,"").split(/^$|,+/)};return function(r,a,i){function o(e){return m+=e.split(/\n/).length-1,n.isCompress&&(e=e.replace(/[\n\r\t\s]+/g," ").replace(/<!--.*?-->/g,"")),e&&(e=x[1]+p(e)+x[2]+"\n"),e}function c(e){var r=m;if($?e=$(e):i&&(e=e.replace(/\n/g,function(){return m++,"$line="+m+";"})),0===e.indexOf("=")){var a=!/^=[=#]/.test(e);if(e=e.replace(/^=[=#]?|[\s;]*$/g,""),a&&n.isEscape){var o=e.replace(/\s*\([^\)]+\)/,"");t.hasOwnProperty(o)||/^(include|print)$/.test(o)||(e="$escape("+e+")")}else e="$string("+e+")";e=x[1]+e+x[2]}return i&&(e="$line="+r+";"+e),s(e),e+"\n"}function s(n){n=u(n),e(n,function(e){e&&!v.hasOwnProperty(e)&&(l(e),v[e]=!0)})}function l(e){var n;"print"===e?n=k:"include"===e?(y.$include=t.$include,n=E):(n="$data."+e,t.hasOwnProperty(e)&&(y[e]=t[e],n=0===e.indexOf("$")?"$helpers."+e:n+"===undefined?$helpers."+e+":"+n)),w+=e+"="+n+","}function p(e){return"'"+e.replace(/('|\\)/g,"\\$1").replace(/\r/g,"\\r").replace(/\n/g,"\\n")+"'"}var f=n.openTag,d=n.closeTag,$=n.parser,g=a,h="",m=1,v={$data:1,$id:1,$helpers:1,$out:1,$line:1},y={},w="var $helpers=this,"+(i?"$line=0,":""),b="".trim,x=b?["$out='';","$out+=",";","$out"]:["$out=[];","$out.push(",");","$out.join('')"],T=b?"$out+=$text;return $text;":"$out.push($text);",k="function($text){"+T+"}",E="function(id,data){data=data||$data;var $text=$helpers.$include(id,data,$id);"+T+"}";e(g.split(f),function(e){e=e.split(d);var n=e[0],r=e[1];1===e.length?h+=o(n):(h+=c(n),r&&(h+=o(r)))}),g=h,i&&(g="try{"+g+"}catch(e){"+"throw {"+"id:$id,"+"name:'Render Error',"+"message:e.message,"+"line:$line,"+"source:"+p(a)+".split(/\\n/)[$line-1].replace(/^[\\s\\t]+/,'')"+"};"+"}"),g=w+x[0]+g+"return new String("+x[3]+");";try{var j=new Function("$data","$id",g);return j.prototype=y,j}catch(O){throw O.temp="function anonymous($data,$id) {"+g+"}",O}}}();"function"==typeof define?define(function(){return n}):"undefined"!=typeof exports&&(module.exports=n),e.template=n}(this),function(e){e.openTag="{{",e.closeTag="}}",e.parser=function(n){n=n.replace(/^\s/,"");var r=n.split(" "),t=r.shift(),a=r.join(" ");switch(t){case"if":n="if("+a+"){";break;case"else":r="if"===r.shift()?" if("+r.join(" ")+")":"",n="}else"+r+"{";break;case"/if":n="}";break;case"each":var i=r[0]||"$data",o=r[1]||"as",c=r[2]||"$value",s=r[3]||"$index",u=c+","+s;"as"!==o&&(i="[]"),n="$each("+i+",function("+u+"){";break;case"/each":n="});";break;case"echo":n="print("+a+");";break;case"include":n="include("+r.join(",")+");";break;default:e.helpers.hasOwnProperty(t)?n="=#"+t+"("+r.join(",")+");":(n=n.replace(/[\s;]*$/,""),n="="+n)}return n}}(Line truncated
|
||||
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,179 @@
|
||||
/*TMODJS:{}*/
|
||||
!function () {
|
||||
|
||||
function template (filename, content) {
|
||||
return (
|
||||
/string|function/.test(typeof content)
|
||||
? compile : renderFile
|
||||
)(filename, content);
|
||||
};
|
||||
|
||||
|
||||
var cache = template.cache = {};
|
||||
var String = this.String;
|
||||
|
||||
function toString (value, type) {
|
||||
|
||||
if (typeof value !== 'string') {
|
||||
|
||||
type = typeof value;
|
||||
if (type === 'number') {
|
||||
value += '';
|
||||
} else if (type === 'function') {
|
||||
value = toString(value.call(value));
|
||||
} else {
|
||||
value = '';
|
||||
}
|
||||
}
|
||||
|
||||
return value;
|
||||
|
||||
};
|
||||
|
||||
|
||||
var escapeMap = {
|
||||
"<": "<",
|
||||
">": ">",
|
||||
'"': """,
|
||||
"'": "'",
|
||||
"&": "&"
|
||||
};
|
||||
|
||||
|
||||
function escapeFn (s) {
|
||||
return escapeMap[s];
|
||||
}
|
||||
|
||||
|
||||
function escapeHTML (content) {
|
||||
return toString(content)
|
||||
.replace(/&(?![\w#]+;)|[<>"']/g, escapeFn);
|
||||
};
|
||||
|
||||
|
||||
var isArray = Array.isArray || function(obj) {
|
||||
return ({}).toString.call(obj) === '[object Array]';
|
||||
};
|
||||
|
||||
|
||||
function each (data, callback) {
|
||||
if (isArray(data)) {
|
||||
for (var i = 0, len = data.length; i < len; i++) {
|
||||
callback.call(data, data[i], i, data);
|
||||
}
|
||||
} else {
|
||||
for (i in data) {
|
||||
callback.call(data, data[i], i);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function resolve (from, to) {
|
||||
var DOUBLE_DOT_RE = /(\/)[^/]+\1\.\.\1/;
|
||||
var dirname = ('./' + from).replace(/[^/]+$/, "");
|
||||
var filename = dirname + to;
|
||||
filename = filename.replace(/\/\.\//g, "/");
|
||||
while (filename.match(DOUBLE_DOT_RE)) {
|
||||
filename = filename.replace(DOUBLE_DOT_RE, "/");
|
||||
}
|
||||
return filename;
|
||||
};
|
||||
|
||||
|
||||
var utils = template.utils = {
|
||||
|
||||
$helpers: {},
|
||||
|
||||
$include: function (filename, data, from) {
|
||||
filename = resolve(from, filename);
|
||||
return renderFile(filename, data);
|
||||
},
|
||||
|
||||
$string: toString,
|
||||
|
||||
$escape: escapeHTML,
|
||||
|
||||
$each: each
|
||||
|
||||
};
|
||||
|
||||
|
||||
var helpers = template.helpers = utils.$helpers;
|
||||
|
||||
|
||||
function renderFile (filename, data) {
|
||||
var fn = template.get(filename) || showDebugInfo({
|
||||
filename: filename,
|
||||
name: 'Render Error',
|
||||
message: 'Template not found'
|
||||
});
|
||||
return data ? fn(data) : fn;
|
||||
};
|
||||
|
||||
|
||||
function compile (filename, fn) {
|
||||
|
||||
if (typeof fn === 'string') {
|
||||
var string = fn;
|
||||
fn = function () {
|
||||
return new String(string);
|
||||
};
|
||||
}
|
||||
|
||||
var render = cache[filename] = function (data) {
|
||||
try {
|
||||
return new fn(data, filename) + '';
|
||||
} catch (e) {
|
||||
return showDebugInfo(e)();
|
||||
}
|
||||
};
|
||||
|
||||
render.prototype = fn.prototype = utils;
|
||||
render.toString = function () {
|
||||
return fn + '';
|
||||
};
|
||||
|
||||
return render;
|
||||
};
|
||||
|
||||
|
||||
function showDebugInfo (e) {
|
||||
|
||||
var type = "{Template Error}";
|
||||
var message = e.stack || '';
|
||||
|
||||
if (message) {
|
||||
// 利用报错堆栈信息
|
||||
message = message.split('\n').slice(0,2).join('\n');
|
||||
} else {
|
||||
// 调试版本,直接给出模板语句行
|
||||
for (var name in e) {
|
||||
message += "<" + name + ">\n" + e[name] + "\n\n";
|
||||
}
|
||||
}
|
||||
|
||||
return function () {
|
||||
if (typeof console === "object") {
|
||||
console.error(type + "\n\n" + message);
|
||||
}
|
||||
return type;
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
template.get = function (filename) {
|
||||
return cache[filename.replace(/^\.\//, '')];
|
||||
};
|
||||
|
||||
|
||||
template.helper = function (name, helper) {
|
||||
helpers[name] = helper;
|
||||
};
|
||||
|
||||
|
||||
define(function(){return template;});
|
||||
|
||||
|
||||
|
||||
}()
|
||||
@@ -0,0 +1,8 @@
|
||||
/*TMODJS:{"version":2,"md5":"42c38c47514173e8894d3110bc76222a"}*/
|
||||
define(function(require){return require('../template')('test-pc/hello', function($data,$filename
|
||||
/**/) {
|
||||
'use strict';var $utils=this,$helpers=$utils.$helpers,$escape=$utils.$escape,name=$data.name,$out='';$out+='<h1>hello,';
|
||||
$out+=$escape(name);
|
||||
$out+='</h1> <p>哈哈哈哈</p>';
|
||||
return new String($out);
|
||||
});});
|
||||
@@ -0,0 +1,8 @@
|
||||
/*TMODJS:{"version":3,"md5":"82a0633ce39bc9927db661a771415017"}*/
|
||||
template('test/hello',function($data,$filename
|
||||
/**/) {
|
||||
'use strict';var $utils=this,$helpers=$utils.$helpers,$escape=$utils.$escape,name=$data.name,$out='';$out+='<h1>hello,';
|
||||
$out+=$escape(name);
|
||||
$out+='</h1> <p>哈哈哈哈!</p>';
|
||||
return new String($out);
|
||||
});
|
||||
@@ -0,0 +1,12 @@
|
||||
/*TMODJS:{"version":6,"md5":"aeea77e5d0c9b342c59243600f9ed4a8"}*/
|
||||
define(function(require){return require('../template')('toyotacamry/result', function($data,$filename
|
||||
/**/) {
|
||||
'use strict';var $utils=this,$helpers=$utils.$helpers,$escape=$utils.$escape,picType=$data.picType,title=$data.title,conclusion=$data.conclusion,$out='';$out+='<div class="result-box ';
|
||||
$out+=$escape(picType);
|
||||
$out+='"> <div class="result-main"> <h1><img src="';
|
||||
$out+=$escape(title);
|
||||
$out+='"></h1> <p>测试结果:';
|
||||
$out+=$escape(conclusion);
|
||||
$out+='</p> </div> </div>';
|
||||
return new String($out);
|
||||
});});
|
||||
@@ -0,0 +1,12 @@
|
||||
/*TMODJS:{"version":1,"md5":"aeea77e5d0c9b342c59243600f9ed4a8"}*/
|
||||
define(function(require){return require('../template')('toyotacamry2/result', function($data,$filename
|
||||
/**/) {
|
||||
'use strict';var $utils=this,$helpers=$utils.$helpers,$escape=$utils.$escape,picType=$data.picType,title=$data.title,conclusion=$data.conclusion,$out='';$out+='<div class="result-box ';
|
||||
$out+=$escape(picType);
|
||||
$out+='"> <div class="result-main"> <h1><img src="';
|
||||
$out+=$escape(title);
|
||||
$out+='"></h1> <p>测试结果:';
|
||||
$out+=$escape(conclusion);
|
||||
$out+='</p> </div> </div>';
|
||||
return new String($out);
|
||||
});});
|
||||
Vendored
BIN
Binary file not shown.
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,53 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
html,body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%
|
||||
}
|
||||
|
||||
/*清除浮动*/
|
||||
.cl:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
height: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
.cl {
|
||||
zoom: 1;
|
||||
}
|
||||
.clear {
|
||||
clear:both;
|
||||
display:inline;
|
||||
}
|
||||
|
||||
/*显示隐藏*/
|
||||
.show{display:block;}
|
||||
.hide{display:none;}
|
||||
|
||||
/*左右浮动*/
|
||||
.fl,.z{float:left;}
|
||||
.fr,.y{float:right;}
|
||||
|
||||
/*字体抗锯齿*/
|
||||
.thin {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/*单行文字超出显示省略号*/
|
||||
.ell {
|
||||
overflow:hidden;
|
||||
word-wrap:normal;
|
||||
white-space:nowrap;
|
||||
text-overflow:ellipsis;
|
||||
word-break:keep-all;
|
||||
-ms-text-overflow:ellipsis;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,135 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-09 18:52:31
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
/*全局样式*/
|
||||
*{margin:0; padding:0;}
|
||||
table{border-collapse:collapse; border-spacing:0;}
|
||||
fieldset,img{border:0;}
|
||||
address,caption,cite,code,dfn,em,var,i{font-style:normal; font-weight:normal;}
|
||||
ul,ol,li{list-style:none;}
|
||||
h1,h2,h3,h4,h5,h6{font-weight:normal;}
|
||||
html {font-size: 62.5%}
|
||||
input,textarea {outline:none;resize:none;}
|
||||
pre,p{ white-space: -webkit-pre-wrap;white-space: -moz-pre-wrap; white-space: pre-wrap; word-wrap: break-word;}
|
||||
a {-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-focus-ring-color: rgba(0, 0, 0, 0);outline: none;border: none;text-decoration:none;}
|
||||
a:hover{ }
|
||||
body {font-size:1.2rem;font-family:"Microsoft Yahei";color:#666;background-color: #fff}
|
||||
|
||||
|
||||
div {
|
||||
/*width: 1rem;
|
||||
height: 0.4rem;*/
|
||||
font-size: 12px; // 默认写上dpr为1的fontSize
|
||||
}
|
||||
|
||||
[data-dpr="2"] div {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
[data-dpr="3"] div {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
$norm=750;
|
||||
transformRem(v)
|
||||
(v/$norm*10)rem
|
||||
|
||||
/*清除浮动*/
|
||||
.cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
|
||||
.cl { zoom: 1; }
|
||||
.clear {clear:both;display:inline;}
|
||||
|
||||
/*显示隐藏*/
|
||||
.show{display:block;}
|
||||
.hide{display:none;}
|
||||
|
||||
/*左右浮动*/
|
||||
.fl,.z{float:left;}
|
||||
.fr,.y{float:right;}
|
||||
|
||||
/*字体抗锯齿*/
|
||||
.thin {-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
|
||||
|
||||
/*单行文字超出显示省略号*/
|
||||
.ell {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
|
||||
|
||||
/*遮罩*/
|
||||
.pop-mark {
|
||||
width:100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
opacity: .4;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
/*loading*/
|
||||
.load-icon-box {
|
||||
width: 110px;
|
||||
height: 30px;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
margin-left: -55px;
|
||||
margin-top: -15px;
|
||||
z-index: 101;
|
||||
}
|
||||
|
||||
.load-icon .loader:before,
|
||||
.load-icon .loader:after,
|
||||
.load-icon .loader {
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
-webkit-animation: load-icon 1.8s infinite ease-in-out;
|
||||
animation: load-icon 1.8s infinite ease-in-out;
|
||||
}
|
||||
.load-icon .loader {
|
||||
position: relative;
|
||||
margin-top: -30px;
|
||||
text-indent: -9999em;
|
||||
-webkit-animation-delay: -0.32s;
|
||||
animation-delay: -0.32s;
|
||||
}
|
||||
.load-icon .loader:before {
|
||||
left: 40px;
|
||||
-webkit-animation-delay: -0.16s;
|
||||
animation-delay: -0.16s;
|
||||
}
|
||||
.load-icon .loader:after {
|
||||
left: 80px;
|
||||
}
|
||||
.load-icon .loader:before,
|
||||
.loader:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
@-webkit-keyframes load-icon {
|
||||
0%,
|
||||
80%,
|
||||
100% {
|
||||
box-shadow: 0 2.5em 0 -1.3em #ffffff;
|
||||
}
|
||||
40% {
|
||||
box-shadow: 0 2.5em 0 0 #FFF;
|
||||
}
|
||||
}
|
||||
@keyframes load-icon {
|
||||
0%,
|
||||
80%,
|
||||
100% {
|
||||
box-shadow: 0 2.5em 0 -1.3em #ffffff;
|
||||
}
|
||||
40% {
|
||||
box-shadow: 0 2.5em 0 0 #FFF;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
@import '../../lib/phone/animate.styl';
|
||||
|
||||
$close='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK4AAACuCAYAAACvDDbuAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAATmSURBVHhe7d2xilxlGMfhiBJE1KQwlSm9IlstbNPYCLKlpXdgoa3YayWClY1gIaSTBRsvwBsw8f/ufF8kbjaZOfOdmXPOPg8cVnZn3vOdfX+EIMnmDgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAALMnTp08vnjx58m0+vt4+tVn1jO1ZL9qnWKNaYK4rW4+3nq09YyfeNarF7fb3n63GW8/0v2iv5HOft5ewBtnZtWi7rcVbz/KiaLt87VF7KUuWXd0YbbeVePMMb7ws2k68C5cdvTLabu3x5ux38wzfXz3MHsS7UNnNF7sV7W+t8ebMB0XbiXdhspMvd6s53NrizVknRduJdyGyiM/aTiZbS7w541HRdpnxcRvJuWQJD3Ndtp1MtvR4c7ZR0V7W96yN5ZxqEbWQtpvJMmOR8eZMot2qWkiux21Hk2XGouLNWUS7dVnMg1ybiTdnEO1tkQVtIt7ce1S0j3O938ayZFnUquPNPd/MvUdF+6CNZQ1qYbW4tsPJMuOk8eZeb+WeP1/d/Aj17PU9aGNZk1pcLbDtcrLMOEm8uYdo2akF1iLbTifLjFnjzWzR8rxaZC207XayzJgl3swULS9WC63Fth1PlhlD480s0fJytdhacNv1ZJkxJN7MEC37qQXXotvOJ8uMo+LNe0XLYbLv97LsX3ern25qvHnPkGjjN9HeMln6vXPEm9eO+pW2zn6vjeU2qcWfMt687h3RMkQFcIp487VR9xEtOxXCnPHmc6JlHhXEHPHmv0XLvCqMkfHmEi2nUYEMiu070XJSFcqI6I4lWg5WwZwz3tz7l3wQLYercM4Rb+5Z/6/3rXYMOFwCeruFdBKiZZgK6RTxipbhKqg54xUts6mw5ohXtMyuAhsZr2g5mYR2P9ffFd6Rasb9Nhbmk9CG/ISZrs2628bDeBXYyGi7zPwxH/x2gfES1izRdpnt97qMlaBmjbYTL8NUSAnqh6uyTkC8HK0CaiGdlHiZrMI5R7SdeDlYBXPOaDvxsrcKZUS0mfF1rqP/SGSdJde77XhwXQIZ9XMPvsqH13L5O2fMq8IYFNlVtG3syLni5XkVxBzRdvmceBmrQpgz2i5fEy9jVACniLbLa8TLcWrxp4y2y2vFyzRZ+qgf7vxNPuwdbZf3iJfDDIx2rx8tepO8d1S8v9cztbFsUS0415L+DYhR8fpx+ltVi60Ft11PlhlDou0yS7y8WC20Ftt2PFlmDI22y0zx8rws8mGuP9puJ8uMWaLtMlu87GSBFe1l2+lkmTFrtF3uMeoP+Ih3rbK4VUXb5V7iva2ysFVG2+WeI+N92MayZLWoXKuNtsu9R8V7Wd+TNpYlyoI+yPVn29lkmXHWaLucQbxbl8VUtH+1XU2WGYuItstZxLtVWcgmo+1yJvFuTRax6Wi7nE28W5JdfLJbyXRLj7bLGY+ON+//J9eHbSTnlEU8ans52Fqi7XLWyfG2aD9qo1iCKfGuLdouZz44XtEu2CHxrjXaLmffO17RrkAW9Gnb143WHm2XZ3hlvKJdkezrYre267YSbZdnuTFe0a5Q9nYt3q1F2+WZrsUr2hXL/p7Fu9Vouzzbs3hFuwHZ48XWo+1avD+JFgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA4Gh37vwLBlyXuf9Wrg4AAAAASUVORK5CYII=';
|
||||
|
||||
/*遮罩*/
|
||||
.pop-mark {
|
||||
width:100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
opacity: .4;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.dialog-pop {
|
||||
position: fixed;
|
||||
box-sizing:border-box;
|
||||
background-color: #fff;
|
||||
border-radius: transformRem(6);
|
||||
padding: transformRem(50) transformRem(30) transformRem(30);
|
||||
color: #777;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
text-align: center;
|
||||
max-width: 90%;
|
||||
margin-left: -40%;
|
||||
z-index: 101;
|
||||
box-shadow: #666 0 0 transformRem(60);
|
||||
&>.dialog-content {
|
||||
line-height: transformRem(40);
|
||||
font-size: transformRem(30);
|
||||
}
|
||||
&>.dialog-btn {
|
||||
padding-top: transformRem(50);
|
||||
&>button {
|
||||
width: transformRem(160);
|
||||
height: transformRem(60);
|
||||
box-sizing:border-box;
|
||||
background-color: #0fadf2;
|
||||
border-radius: transformRem(10);
|
||||
color: #fff;
|
||||
font-size: transformRem(30);
|
||||
border: none;
|
||||
&:active {
|
||||
background-color: #0c96f9;
|
||||
}
|
||||
}
|
||||
&>.dialog-no {
|
||||
margin-right: transformRem(10);
|
||||
}
|
||||
}
|
||||
&>.dialog-close {
|
||||
width: transformRem(60);
|
||||
height: transformRem(60);
|
||||
position: absolute;
|
||||
right: transformRem(-20);
|
||||
top: transformRem(-20);
|
||||
border-radius: transformRem(30);
|
||||
color: #fff;
|
||||
border: none;
|
||||
font-size: transformRem(40);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-position: center;
|
||||
background-color: #3c3c3c;
|
||||
background-image: url($close);
|
||||
&:active {
|
||||
background-color: #d24445;
|
||||
}
|
||||
}
|
||||
}
|
||||
Vendored
BIN
Binary file not shown.
Vendored
BIN
Binary file not shown.
Vendored
+3340
File diff suppressed because it is too large.
Load diff
Executable
+5
@@ -0,0 +1,5 @@
|
||||
/*!
|
||||
* WeUI v1.1.2 (https://github.com/weui/weui)
|
||||
* Copyright 2017 Tencent, Inc.
|
||||
* Licensed under the MIT license
|
||||
*/html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{line-height:1.6;font-family:-apple-system-font,Helvetica Neue,sans-serif}*{margin:0;padding:0}a img{border:0}a{text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}@font-face{font-weight:400;font-style:normal;font-family:weui;src:url('data:application/octet-stream;base64,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 truncated
|
||||
File diff suppressed because it is too large.
Load diff
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,3 @@
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
var dialog = require('../../script/extends/phone/dialog');
|
||||
@@ -0,0 +1,5 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
Reference in new issue
Block a user