Skip to content

M
mui
Commit 003cc9c7 authored by hbcui1984's avatar hbcui1984
Browse files
Options

编译至mui v1.1.1

parent 3d43667e
Show whitespace changes
Inline Side-by-side
Showing with 196 additions and 83 deletions
dist/css/mui.css
View file @ 003cc9c7
/*! /*!
* ===================================================== * =====================================================
* Mui v1.1.0 (https://github.com/dcloudio/mui) * Mui v1.1.1 (https://github.com/dcloudio/mui)
* ===================================================== * =====================================================
*/ */
...@@ -320,6 +320,7 @@ a:active { ...@@ -320,6 +320,7 @@ a:active {
display: -webkit-box; display: -webkit-box;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important; white-space: normal !important;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
......
dist/css/mui.min.css
View file @ 003cc9c7
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/js/mui.js
View file @ 003cc9c7
/*! /*!
* ===================================================== * =====================================================
* Mui v1.1.0 (https://github.com/dcloudio/mui) * Mui v1.1.1 (https://github.com/dcloudio/mui)
* ===================================================== * =====================================================
*/ */
/** /**
...@@ -303,7 +303,7 @@ var mui = (function(document, undefined) { ...@@ -303,7 +303,7 @@ var mui = (function(document, undefined) {
return result; return result;
}; };
$.regesterHandler = function(type, handler) { $.registerHandler = function(type, handler) {
var handlers = $[type]; var handlers = $[type];
if (!handlers) { if (!handlers) {
handlers = []; handlers = [];
...@@ -751,7 +751,7 @@ var mui = (function(document, undefined) { ...@@ -751,7 +751,7 @@ var mui = (function(document, undefined) {
* @returns {$.gestures} * @returns {$.gestures}
*/ */
$.registerGesture = function(gesture) { $.registerGesture = function(gesture) {
return $.regesterHandler('gestures', gesture); return $.registerHandler('gestures', gesture);
}; };
/** /**
...@@ -809,18 +809,17 @@ var mui = (function(document, undefined) { ...@@ -809,18 +809,17 @@ var mui = (function(document, undefined) {
} }
}); });
}; };
var touch = {};
var detectTouchStart = function(event) { var detectTouchStart = function(event) {
$.gestures.stoped = false; $.gestures.stoped = false;
var now = Date.now(); var now = Date.now();
var point = event.touches ? event.touches[0] : event; var point = event.touches ? event.touches[0] : event;
touch = { $.gestures.touch = {
target: event.target, target: event.target,
lastTarget: (touch.lastTarget ? touch.lastTarget : null), lastTarget: ($.gestures.touch && $.gestures.touch.lastTarget ? $.gestures.touch.lastTarget : null),
startTime: now, startTime: now,
touchTime: 0, touchTime: 0,
flickStartTime: now, flickStartTime: now,
lastTapTime: (touch.lastTapTime ? touch.lastTapTime : 0), lastTapTime: ($.gestures.touch && $.gestures.touch.lastTapTime ? $.gestures.touch.lastTapTime : 0),
start: { start: {
x: point.pageX, x: point.pageX,
y: point.pageY y: point.pageY
...@@ -841,18 +840,22 @@ var mui = (function(document, undefined) { ...@@ -841,18 +840,22 @@ var mui = (function(document, undefined) {
lastDeltaY: 0, lastDeltaY: 0,
angle: '', angle: '',
direction: '', direction: '',
lockDirection: false,
startDirection: '',
distance: 0, distance: 0,
drag: false, drag: false,
swipe: false, swipe: false,
hold: false,
gesture: event gesture: event
}; };
detect(event, touch); detect(event, $.gestures.touch);
}; };
var detectTouchMove = function(event) { var detectTouchMove = function(event) {
if ($.gestures.stoped) { if ($.gestures.stoped) {
return; return;
} }
var touch = $.gestures.touch;
if (event.target != touch.target) { if (event.target != touch.target) {
return; return;
} }
...@@ -882,6 +885,7 @@ var mui = (function(document, undefined) { ...@@ -882,6 +885,7 @@ var mui = (function(document, undefined) {
if ($.gestures.stoped) { if ($.gestures.stoped) {
return; return;
} }
var touch = $.gestures.touch;
if (event.target != touch.target) { if (event.target != touch.target) {
return; return;
} }
...@@ -1016,22 +1020,21 @@ var mui = (function(document, undefined) { ...@@ -1016,22 +1020,21 @@ var mui = (function(document, undefined) {
* @returns {undefined} * @returns {undefined}
*/ */
(function($, name) { (function($, name) {
var last_direction = false;
var handle = function(event, touch) { var handle = function(event, touch) {
switch (event.type) { switch (event.type) {
case $.EVENT_MOVE: case $.EVENT_MOVE:
if (touch.direction) { //drag if (touch.direction) { //drag
//修正direction //修正direction
//默认锁定单向drag(后续可能需要额外配置支持) //默认锁定单向drag(后续可能需要额外配置支持)
if (!last_direction) { if (touch.lockDirection && touch.startDirection) {
last_direction = touch.direction; if (touch.startDirection && touch.startDirection !== touch.direction) {
} else if (last_direction && last_direction !== touch.direction) { if (touch.startDirection === 'up' || touch.startDirection === 'down') {
if (last_direction === 'up' || last_direction === 'down') {
touch.direction = touch.deltaY < 0 ? 'up' : 'down'; touch.direction = touch.deltaY < 0 ? 'up' : 'down';
} else { } else {
touch.direction = touch.deltaX < 0 ? 'left' : 'right'; touch.direction = touch.deltaX < 0 ? 'left' : 'right';
} }
} }
}
if (!touch.drag) { if (!touch.drag) {
touch.drag = true; touch.drag = true;
$.trigger(event.target, name + 'start', touch); $.trigger(event.target, name + 'start', touch);
...@@ -1045,7 +1048,6 @@ var mui = (function(document, undefined) { ...@@ -1045,7 +1048,6 @@ var mui = (function(document, undefined) {
if (touch.drag) { if (touch.drag) {
$.trigger(event.target, name + 'end', touch); $.trigger(event.target, name + 'end', touch);
} }
last_direction = false;
break; break;
} }
}; };
...@@ -1130,18 +1132,59 @@ var mui = (function(document, undefined) { ...@@ -1130,18 +1132,59 @@ var mui = (function(document, undefined) {
} }
}; };
/** /**
* mui gesture drag * mui gesture longtap
*/ */
$.registerGesture({ $.registerGesture({
name : name, name: name,
index : 10, index: 10,
handle : handle, handle: handle,
options : { options: {
holdTimeout : 500, holdTimeout: 500,
holdThreshold : 2 holdThreshold: 2
} }
}); });
})(mui, 'longtap'); })(mui, 'longtap');
/**
* mui gesture hold
* @param {type} $
* @param {type} name
* @returns {undefined}
*/
(function($, name) {
var timer;
var handle = function(event, touch) {
var options = this.options;
switch (event.type) {
case $.EVENT_START:
clearTimeout(timer);
timer = setTimeout(function() {
touch.hold = true;
$.trigger(event.target, name, touch);
}, options.holdTimeout);
break;
case $.EVENT_MOVE:
break;
case $.EVENT_END:
case $.EVENT_CANCEL:
clearTimeout(timer);
if (touch.hold) {
$.trigger(event.target, 'release', touch);
}
break;
}
};
/**
* mui gesture hold
*/
$.registerGesture({
name: name,
index: 10,
handle: handle,
options: {
holdTimeout: 0
}
});
})(mui, 'hold');
/** /**
* mui.init * mui.init
* @param {type} $ * @param {type} $
...@@ -1202,7 +1245,7 @@ var mui = (function(document, undefined) { ...@@ -1202,7 +1245,7 @@ var mui = (function(document, undefined) {
* @param {function} init * @param {function} init
*/ */
$.registerInit = function(init) { $.registerInit = function(init) {
return $.regesterHandler('inits', init); return $.registerHandler('inits', init);
}; };
$(function() { $(function() {
if ($.os.ios) { if ($.os.ios) {
...@@ -1603,6 +1646,18 @@ var mui = (function(document, undefined) { ...@@ -1603,6 +1646,18 @@ var mui = (function(document, undefined) {
if ($.os.ios && $.options.statusBarBackground) { if ($.os.ios && $.options.statusBarBackground) {
plus.navigator.setStatusBarBackground($.options.statusBarBackground); plus.navigator.setStatusBarBackground($.options.statusBarBackground);
} }
if($.os.android&&parseFloat($.os.version) < 4.4){
//解决Android平台4.4版本以下，resume后，父窗体标题延迟渲染的问题；
if(plus.webview.currentWebview().parent()==null){
document.addEventListener("resume", function() {
var body = document.body;
body.style.display = 'none';
setTimeout(function() {
body.style.display = '';
}, 10);
});
}
}
}); });
} else { } else {
if (subpages.length > 0) { if (subpages.length > 0) {
...@@ -1650,7 +1705,7 @@ var mui = (function(document, undefined) { ...@@ -1650,7 +1705,7 @@ var mui = (function(document, undefined) {
* @returns {$.gestures} * @returns {$.gestures}
*/ */
$.registerBack = function(back) { $.registerBack = function(back) {
return $.regesterHandler('backs', back); return $.registerHandler('backs', back);
}; };
/** /**
* default * default
...@@ -1670,8 +1725,8 @@ var mui = (function(document, undefined) { ...@@ -1670,8 +1725,8 @@ var mui = (function(document, undefined) {
* 后退 * 后退
*/ */
$.back = function() { $.back = function() {
if (typeof $.options.back === 'function') { if (typeof $.options.beforeback === 'function') {
if ($.options.back() === false) { if ($.options.beforeback() === false) {
return; return;
} }
} }
...@@ -1687,7 +1742,7 @@ var mui = (function(document, undefined) { ...@@ -1687,7 +1742,7 @@ var mui = (function(document, undefined) {
}); });
window.addEventListener('swiperight', function(e) { window.addEventListener('swiperight', function(e) {
var detail = e.detail; var detail = e.detail;
if ($.options.swipeBack === true && Math.abs(detail.angle)< 3) { if ($.options.swipeBack === true && Math.abs(detail.angle) < 3) {
$.back(); $.back();
} }
}); });
...@@ -2680,6 +2735,18 @@ var mui = (function(document, undefined) { ...@@ -2680,6 +2735,18 @@ var mui = (function(document, undefined) {
this.reLayout(); this.reLayout();
$.trigger(this.wrapper, 'beforescrollstart', this); $.trigger(this.wrapper, 'beforescrollstart', this);
}, },
_getDirectionByAngle: function(angle) {
if (angle < -80 && angle > -100) {
return 'up';
} else if (angle >= 80 && angle < 100) {
return 'down';
} else if (angle >= 170 || angle <= -170) {
return 'left';
} else if (angle >= -35 && angle <= 10) {
return 'right';
}
return null;
},
_drag: function(e) { _drag: function(e) {
// if (this.needReset) { // if (this.needReset) {
// e.stopPropagation(); //disable parent drag(nested scroller) // e.stopPropagation(); //disable parent drag(nested scroller)
...@@ -2698,18 +2765,38 @@ var mui = (function(document, undefined) { ...@@ -2698,18 +2765,38 @@ var mui = (function(document, undefined) {
} }
} }
var isPreventDefault = isReturn = false; var isPreventDefault = isReturn = false;
var direction = this._getDirectionByAngle(detail.angle);
if (detail.direction === 'left' || detail.direction === 'right') { if (detail.direction === 'left' || detail.direction === 'right') {
if (this.options.scrollX) { if (this.options.scrollX) {
isPreventDefault = true; isPreventDefault = true;
if (!this.moved) { //识别角度
if (direction !== 'left' && direction !== 'right') {
isReturn = true;
} else {
$.gestures.touch.lockDirection = true; //锁定方向
$.gestures.touch.startDirection = detail.direction;
}
}
} else if (this.options.scrollY && !this.moved) { } else if (this.options.scrollY && !this.moved) {
isReturn = true; isReturn = true;
} }
} else if (detail.direction === 'up' || detail.direction === 'down') { } else if (detail.direction === 'up' || detail.direction === 'down') {
if (this.options.scrollY) { if (this.options.scrollY) {
isPreventDefault = true; isPreventDefault = true;
// if (!this.moved) { //识别角度,竖向滚动似乎没必要进行小角度验证
// if (direction !== 'up' && direction !== 'down') {
// isReturn = true;
// }
// }
if (!this.moved) {
$.gestures.touch.lockDirection = true; //锁定方向
$.gestures.touch.startDirection = detail.direction;
}
} else if (this.options.scrollX && !this.moved) { } else if (this.options.scrollX && !this.moved) {
isReturn = true; isReturn = true;
} }
} else {
isReturn = true;
} }
if (isPreventDefault) { if (isPreventDefault) {
e.stopPropagation(); //阻止冒泡(scroll类嵌套) e.stopPropagation(); //阻止冒泡(scroll类嵌套)
...@@ -2723,9 +2810,15 @@ var mui = (function(document, undefined) { ...@@ -2723,9 +2810,15 @@ var mui = (function(document, undefined) {
} else { } else {
e.stopPropagation(); //move期间阻止冒泡(scroll嵌套) e.stopPropagation(); //move期间阻止冒泡(scroll嵌套)
} }
var deltaX = 0;
var deltaX = detail.deltaX - detail.lastDeltaX; var deltaY = 0;
var deltaY = detail.deltaY - detail.lastDeltaY; if (!this.moved) { //start
deltaX = detail.deltaX;
deltaY = detail.deltaY;
} else { //move
deltaX = detail.deltaX - detail.lastDeltaX;
deltaY = detail.deltaY - detail.lastDeltaY;
}
var absDeltaX = Math.abs(detail.deltaX); var absDeltaX = Math.abs(detail.deltaX);
var absDeltaY = Math.abs(detail.deltaY); var absDeltaY = Math.abs(detail.deltaY);
if (absDeltaX > absDeltaY + this.options.directionLockThreshold) { if (absDeltaX > absDeltaY + this.options.directionLockThreshold) {
...@@ -3588,17 +3681,20 @@ var mui = (function(document, undefined) { ...@@ -3588,17 +3681,20 @@ var mui = (function(document, undefined) {
$.trigger(this.wrapper, 'scrollend', this); $.trigger(this.wrapper, 'scrollend', this);
}, },
_flick: function(e) { _flick: function(e) {
if (!this.moved) { //无moved
return;
}
var detail = e.detail; var detail = e.detail;
var direction = detail.direction; var direction = detail.direction;
this._clearRequestAnimationFrame(); this._clearRequestAnimationFrame();
this.isInTransition = true; this.isInTransition = true;
if (direction === 'up' || direction === 'down') { // if (direction === 'up' || direction === 'down') {
this.resetPosition(this.options.bounceTime); // this.resetPosition(this.options.bounceTime);
return; // return;
} // }
if (e.type === 'flick') { if (e.type === 'flick') {
if (detail.touchTime < 200) { //flick，太容易触发，额外校验一下touchtime if (detail.touchTime < 200) { //flick，太容易触发，额外校验一下touchtime
this.x = this._getPage((this.slideNumber + (direction === 'left' ? 1 : -1)), true).x; this.x = this._getPage((this.slideNumber + (direction === 'right' ? -1 : 1)), true).x;
} }
this.resetPosition(this.options.bounceTime); this.resetPosition(this.options.bounceTime);
} else if (e.type === 'dragend' && !detail.flick) { } else if (e.type === 'dragend' && !detail.flick) {
...@@ -3614,6 +3710,9 @@ var mui = (function(document, undefined) { ...@@ -3614,6 +3710,9 @@ var mui = (function(document, undefined) {
//当slider处于隐藏状态时，导致snap计算是错误的，临时先这么判断一下，后续要考虑解决所有scroll在隐藏状态下初始化属性不正确的问题 //当slider处于隐藏状态时，导致snap计算是错误的，临时先这么判断一下，后续要考虑解决所有scroll在隐藏状态下初始化属性不正确的问题
var currentPage = this.pages[this.loop ? 1 : 0]; var currentPage = this.pages[this.loop ? 1 : 0];
currentPage = currentPage || this.pages[0]; currentPage = currentPage || this.pages[0];
if (!currentPage) {
return;
}
this.currentPage = currentPage[0]; this.currentPage = currentPage[0];
this.slideNumber = 0; this.slideNumber = 0;
} else { } else {
......
dist/js/mui.min.js
View file @ 003cc9c7
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/hello-mui/css/mui.min.css
View file @ 003cc9c7
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/hello-mui/examples/info.html
View file @ 003cc9c7
...@@ -9,8 +9,6 @@ ...@@ -9,8 +9,6 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css"> <link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style> <style>
header.mui-bar{ header.mui-bar{
display: none; display: none;
...@@ -53,13 +51,15 @@ ...@@ -53,13 +51,15 @@
</p> </p>
<p>更多详细介绍，请到<a href="http://dcloudio.github.io/mui">mui官网</a>查看；</p> <p>更多详细介绍，请到<a href="http://dcloudio.github.io/mui">mui官网</a>查看；</p>
<h4>版本介绍</h4> <h4>版本介绍</h4>
<p>当前版本为1.1.0，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p> <p>当前版本为1.1.1，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p>
<h4>License</h4> <h4>License</h4>
<p> <p>
mui遵循MIT License，源码已提交至Github，<a href="https://github.com/dcloudio/mui">点击查看</a>; mui遵循MIT License，源码已提交至Github，<a href="https://github.com/dcloudio/mui">点击查看</a>;
</p> </p>
</div> </div>
</div> </div>
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
mui.init(); mui.init();
//处理点击事件，需要打开原生浏览器 //处理点击事件，需要打开原生浏览器
......
examples/hello-mui/index-menu.html
View file @ 003cc9c7
...@@ -7,7 +7,6 @@ ...@@ -7,7 +7,6 @@
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="css/mui.min.css"> <link rel="stylesheet" href="css/mui.min.css">
<script src="js/mui.min.js"></script>
<style type="text/css"> <style type="text/css">
body,.mui-content{ body,.mui-content{
background-color: #333; background-color: #333;
...@@ -45,38 +44,38 @@ ...@@ -45,38 +44,38 @@
<div class="title" style="margin-bottom: 25px;">mui典型控件</div> <div class="title" style="margin-bottom: 25px;">mui典型控件</div>
<ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted" style="color: #ddd;"> <ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted" style="color: #ddd;">
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/buttons.html"> <a class="mui-navigate-right" href="examples/tableviews-with-swipe.html">
按钮（button） 滑动删除
</a> </a>
</li> </li>
<li class="mui-table-view-cell"> <!--<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/slider-table-default.html"> <a class="mui-navigate-right" href="examples/list-long.html">
图文表格（gallery table） 千行列表
</a> </a>
</li> </li>-->
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/input.html"> <a class="mui-navigate-right" href="examples/pullrefresh.html">
输入框（input） 下拉刷新
</a> </a>
</li> </li>
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/media-list.html"> <a class="mui-navigate-right" open-type="common" href="examples/offcanvas-drag-left.html">
图文列表（media list） 侧滑导航
</a> </a>
</li> </li>
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/popovers.html"> <a class="mui-navigate-right" href="examples/switches.html">
弹出菜单（popover） 开关控件
</a> </a>
</li> </li>
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/switches.html"> <a class="mui-navigate-right" href="examples/range.html">
开关（switch） 滑块控件
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
<script src="js/mui.min.js"></script>
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
//关于backbutton和menubutton两个按键的说明，在iOS平台不存在，故需隐藏 //关于backbutton和menubutton两个按键的说明，在iOS平台不存在，故需隐藏
if(!mui.os.android){ if(!mui.os.android){
...@@ -92,20 +91,34 @@ ...@@ -92,20 +91,34 @@
}) })
mui('.mui-table-view').on('tap', 'a', function() { mui('.mui-table-view').on('tap', 'a', function() {
var id = this.getAttribute("href"); var id = this.getAttribute("href");
if (subWebview == null) { var type = this.getAttribute("open-type");
if(type=="common"){
mui.openWindow({
id: id,
url: this.href,
waiting: {
autoShow: false
}
});
}else{
var href = this.href;
if(~href.indexOf('pullrefresh')){
plus.webview.getWebviewById("pullrefresh-main").show('slide-in-right', 150);
}else{
template = plus.webview.getWebviewById("default-main"); template = plus.webview.getWebviewById("default-main");
//获得共用子webview
subWebview = template.children()[0]; subWebview = template.children()[0];
}
//判断是否显示右上角menu图标；
var showMenu = ~id.indexOf('popovers.html')?true:false;
var title = this.innerText; var title = this.innerText;
mui.fire(template,'updateHeader',{title:title,showMenu:showMenu}); //通知模板修改标题，并显示隐藏右上角图标；
if(subWebview.getURL()==this.href){ mui.fire(template,'updateHeader',{title:title,showMenu:false});
subWebview.show(); if (subWebview.getURL() != this.href) {
}else{
subWebview.loadURL(this.href); subWebview.loadURL(this.href);
} else {
subWebview.show();
} }
template.show('slide-in-right', 150); template.show('slide-in-right', 150);
}
}
}); });
/** /**
......
examples/hello-mui/js/mui.min.js
View file @ 003cc9c7
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment