Skip to content

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

编译至mui v2.4.0

parent 0cd36275
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 359 additions and 214 deletions
dist/css/mui.css
View file @ be7bd495
/*! /*!
* ===================================================== * =====================================================
* Mui v2.3.0 (https://github.com/dcloudio/mui) * Mui v2.4.0 (https://github.com/dcloudio/mui)
* ===================================================== * =====================================================
*/ */
...@@ -1954,6 +1954,10 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled, ...@@ -1954,6 +1954,10 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
background-color: #c8c7cc; background-color: #c8c7cc;
} }
.mui-table-view:before
{
top: -1px;
}
.mui-table-view-icon .mui-table-view-cell .mui-navigate-right .mui-icon .mui-table-view-icon .mui-table-view-cell .mui-navigate-right .mui-icon
{ {
...@@ -2068,8 +2072,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled, ...@@ -2068,8 +2072,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
padding: 11px 15px; padding: 11px 15px;
background-color: inherit;
-webkit-touch-callout: none; -webkit-touch-callout: none;
} }
.mui-table-view-cell:after .mui-table-view-cell:after
...@@ -3914,6 +3916,7 @@ select:focus ...@@ -3914,6 +3916,7 @@ select:focus
height: 100%; height: 100%;
vertical-align: top; vertical-align: top;
white-space: normal;
} }
.mui-slider .mui-slider-group .mui-slider-item > a:not(.mui-control-item) .mui-slider .mui-slider-group .mui-slider-item > a:not(.mui-control-item)
{ {
......
dist/css/mui.min.css
View file @ be7bd495
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/js/mui.js
View file @ be7bd495
/*! /*!
* ===================================================== * =====================================================
* Mui v2.3.0 (https://github.com/dcloudio/mui) * Mui v2.4.0 (https://github.com/dcloudio/mui)
* ===================================================== * =====================================================
*/ */
/** /**
...@@ -748,7 +748,8 @@ var mui = (function(document, undefined) { ...@@ -748,7 +748,8 @@ var mui = (function(document, undefined) {
} }
} }
var target = e.target; var target = e.target;
if (target.tagName && target.tagName === 'INPUT' && (target.type === 'text' || target.type === 'search' || target.type === 'number')) { //TODO 需考虑所有键盘弹起的情况
if (target.tagName && (target.tagName === 'TEXTAREA' || (target.tagName === 'INPUT' && (target.type === 'text' || target.type === 'search' || target.type === 'number')))) {
if (target.disabled || target.readOnly) { if (target.disabled || target.readOnly) {
return; return;
} }
...@@ -3440,7 +3441,6 @@ var mui = (function(document, undefined) { ...@@ -3440,7 +3441,6 @@ var mui = (function(document, undefined) {
} }
}, },
_start: function(e) { _start: function(e) {
e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
this.moved = this.needReset = false; this.moved = this.needReset = false;
this._transitionTime(); this._transitionTime();
if (this.isInTransition) { if (this.isInTransition) {
...@@ -4085,6 +4085,10 @@ var mui = (function(document, undefined) { ...@@ -4085,6 +4085,10 @@ var mui = (function(document, undefined) {
} }
}, },
_start: function(e) { _start: function(e) {
//仅下拉刷新在start阻止默认事件
if (e.touches && e.touches.length && e.touches[0].clientX > 30) {
e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
}
if (!this.loading) { if (!this.loading) {
this.pulldown = this.pullPocket = this.pullCaption = this.pullLoading = false this.pulldown = this.pullPocket = this.pullCaption = this.pullLoading = false
} }
...@@ -4638,6 +4642,7 @@ var mui = (function(document, undefined) { ...@@ -4638,6 +4642,7 @@ var mui = (function(document, undefined) {
var self = this; var self = this;
// document.addEventListener('plusscrollbottom', this); // document.addEventListener('plusscrollbottom', this);
window.addEventListener('dragup', self); window.addEventListener('dragup', self);
document.addEventListener("plusscrollbottom", self);
self.scrollInterval = window.setInterval(function() { self.scrollInterval = window.setInterval(function() {
if (self.isScroll && !self.loading) { if (self.isScroll && !self.loading) {
if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight) { if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight) {
...@@ -4705,7 +4710,7 @@ var mui = (function(document, undefined) { ...@@ -4705,7 +4710,7 @@ var mui = (function(document, undefined) {
// } // }
// } // }
self.isScroll = false; self.isScroll = false;
if (e.type === 'dragup') { if (e.type === 'dragup' || e.type === 'plusscrollbottom') {
self.isScroll = true; self.isScroll = true;
setTimeout(function() { setTimeout(function() {
self.isScroll = false; self.isScroll = false;
...@@ -5583,10 +5588,11 @@ var mui = (function(document, undefined) { ...@@ -5583,10 +5588,11 @@ var mui = (function(document, undefined) {
return element; return element;
}()); }());
var removeBackdropTimer;
var removeBackdrop = function(popover) { var removeBackdrop = function(popover) {
backdrop.setAttribute('style', 'opacity:0'); backdrop.setAttribute('style', 'opacity:0');
$.targets.popover = $.targets._popover = null; //reset $.targets.popover = $.targets._popover = null; //reset
setTimeout(function() { removeBackdropTimer = $.later(function() {
if (!popover.classList.contains(CLASS_ACTIVE) && backdrop.parentNode && backdrop.parentNode === document.body) { if (!popover.classList.contains(CLASS_ACTIVE) && backdrop.parentNode && backdrop.parentNode === document.body) {
document.body.removeChild(backdrop); document.body.removeChild(backdrop);
} }
...@@ -5611,6 +5617,7 @@ var mui = (function(document, undefined) { ...@@ -5611,6 +5617,7 @@ var mui = (function(document, undefined) {
}); });
var togglePopover = function(popover, anchor) { var togglePopover = function(popover, anchor) {
removeBackdropTimer && removeBackdropTimer.cancel(); //取消remove的timer
//remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove //remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove
popover.removeEventListener('webkitTransitionEnd', onPopoverShown); popover.removeEventListener('webkitTransitionEnd', onPopoverShown);
popover.removeEventListener('webkitTransitionEnd', onPopoverHidden); popover.removeEventListener('webkitTransitionEnd', onPopoverHidden);
...@@ -7011,8 +7018,16 @@ var mui = (function(document, undefined) { ...@@ -7011,8 +7018,16 @@ var mui = (function(document, undefined) {
}); });
self.input.addEventListener(changeEventName, function(event) { self.input.addEventListener(changeEventName, function(event) {
self.checkValue(); self.checkValue();
$.trigger(self, changeEventName, self.getValue());
}); });
}, },
/**
* 获取当前值
**/
getValue: function() {
var self = this;
return parseInt(self.input.value);
},
/** /**
* 验证当前值是法合法 * 验证当前值是法合法
**/ **/
......
dist/js/mui.min.js
View file @ be7bd495
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/hello-mui/css/mui.css
View file @ be7bd495
/*! /*!
* ===================================================== * =====================================================
* Mui v2.3.0 (https://github.com/dcloudio/mui) * Mui v2.4.0 (https://github.com/dcloudio/mui)
* ===================================================== * =====================================================
*/ */
...@@ -1954,6 +1954,10 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled, ...@@ -1954,6 +1954,10 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
background-color: #c8c7cc; background-color: #c8c7cc;
} }
.mui-table-view:before
{
top: -1px;
}
.mui-table-view-icon .mui-table-view-cell .mui-navigate-right .mui-icon .mui-table-view-icon .mui-table-view-cell .mui-navigate-right .mui-icon
{ {
...@@ -2068,8 +2072,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled, ...@@ -2068,8 +2072,6 @@ input[type='submit']:enabled:active, input[type='submit'].mui-active:enabled,
padding: 11px 15px; padding: 11px 15px;
background-color: inherit;
-webkit-touch-callout: none; -webkit-touch-callout: none;
} }
.mui-table-view-cell:after .mui-table-view-cell:after
...@@ -3914,6 +3916,7 @@ select:focus ...@@ -3914,6 +3916,7 @@ select:focus
height: 100%; height: 100%;
vertical-align: top; vertical-align: top;
white-space: normal;
} }
.mui-slider .mui-slider-group .mui-slider-item > a:not(.mui-control-item) .mui-slider .mui-slider-group .mui-slider-item > a:not(.mui-control-item)
{ {
......
examples/hello-mui/css/mui.min.css
View file @ be7bd495
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 @ be7bd495
...@@ -26,9 +26,9 @@ ...@@ -26,9 +26,9 @@
</style> </style>
</head> </head>
<body> <body>
<!--<header class="mui-bar mui-bar-nav"> <!--<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">关于</h1> <h1 class="mui-title">关于</h1>
</header>--> </header>-->
<div class="mui-content"> <div class="mui-content">
<div class="mui-content-padded"> <div class="mui-content-padded">
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</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>当前版本为2.3.0，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p> <p>当前版本为2.4.0，可到<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>;
......
examples/hello-mui/examples/lazyload-image.html
View file @ be7bd495
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Hello MUI</title> <title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<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">
<!--标准mui.css--> <!--标准mui.css-->
<link rel="stylesheet" href="../css/mui.min.css"> <link rel="stylesheet" href="../css/mui.min.css">
<!--App自定义的css--> <!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="../css/app.css"/> <link rel="stylesheet" type="text/css" href="../css/app.css" />
<style type="text/css"> <style type="text/css">
p{ p {
text-indent: 22px; text-indent: 22px;
} }
.des { .des {
margin: .5em 0; margin: .5em 0;
}
.des>li {
font-size: 14px;
color: #8f8f94;
} }
</style> .des>li {
</head> font-size: 14px;
color: #8f8f94;
<body> }
<header class="mui-bar mui-bar-nav"> </style>
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> </head>
<h1 class="mui-title">lazyload（延迟加载） </h1>
</header> <body>
<div class="mui-content"> <header class="mui-bar mui-bar-nav">
<div class="mui-content-padded"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<p>延迟加载的理念：页面初始化时，暂不加载处于屏幕可见区域之外的图片。该方案会有如下几大好处：</p> <h1 class="mui-title">lazyload（延迟加载） </h1>
<ul class="des"> </header>
<li>加快页面渲染速度</li> <div class="mui-content">
<li>提升页面滚动性能</li> <div class="mui-content-padded">
<li>默认不下载屏幕外的图片，减少网络流量</li> <p>延迟加载的理念：页面初始化时，暂不加载处于屏幕可见区域之外的图片。该方案会有如下几大好处：</p>
</ul> <ul class="des">
</div> <li>加快页面渲染速度</li>
<ul id="list" class="mui-table-view mui-table-view-chevron"> <li>提升页面滚动性能</li>
<li>默认不下载屏幕外的图片，减少网络流量</li>
</ul> </ul>
</div> </div>
</body> <ul id="list" class="mui-table-view mui-table-view-chevron">
<script src="../js/mui.min.js "></script>
<script src="../js/mui.lazyload.js"></script> </ul>
<script src="../js/mui.lazyload.img.js"></script> </div>
<script> </body>
mui.init(); <script src="../js/mui.min.js "></script>
var createFragment = function(count) { <script src="../js/mui.lazyload.js"></script>
var fragment = document.createDocumentFragment(); <script src="../js/mui.lazyload.img.js"></script>
var li; <script>
for (var i = 0; i < count; i++) { mui.init();
li = document.createElement('li'); var createFragment = function(count) {
li.className = 'mui-table-view-cell mui-media'; var fragment = document.createDocumentFragment();
li.innerHTML = '<a class="mui-navigate-right"><img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/'+(i%5+1)+'.jpg?version='+Math.random()*1000+'"><div class="mui-media-body">主标题<p class="mui-ellipsis">列表二级标题</p></div></a>'; var li;
fragment.appendChild(li); for (var i = 0; i < count; i++) {
} li = document.createElement('li');
return fragment; li.className = 'mui-table-view-cell mui-media';
}; li.innerHTML = '<a class="mui-navigate-right"><img class="mui-media-object mui-pull-left" data-lazyload="http://www.dcloud.io/hellomui/images/' + (i % 5 + 1) + '.jpg?version=' + Math.random() * 1000 + '"><div class="mui-media-body">主标题<p class="mui-ellipsis">列表二级标题</p></div></a>';
(function($) { fragment.appendChild(li);
var list = document.getElementById("list"); }
list.appendChild(createFragment(50)); return fragment;
$(document).imageLazyload({ };
placeholder: '../images/60x60.gif' (function($) {
}); var list = document.getElementById("list");
})(mui); list.appendChild(createFragment(50));
</script> $(document).imageLazyload({
placeholder: '../images/60x60.gif'
});
})(mui);
</script>
</html> </html>
\ No newline at end of file
examples/hello-mui/examples/numbox.html
View file @ be7bd495
...@@ -57,10 +57,10 @@ ...@@ -57,10 +57,10 @@
<h5 class="mui-content-padded">取值操作</h5> <h5 class="mui-content-padded">取值操作</h5>
<div class="mui-numbox"> <div class="mui-numbox">
<button class="mui-btn mui-numbox-btn-minus" type="button">-</button> <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
<input id="testBox" class="mui-numbox-input" type="number" /> <input id="box" class="mui-numbox-input" type="number" />
<button class="mui-btn mui-numbox-btn-plus" type="button">+</button> <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
</div> </div>
<button id="getValue" class="mui-btn" style="padding: 7px 12px;">取当前值</button> <button id="btn" class="mui-btn" style="padding: 7px 12px;">取当前值</button>
<h5 class="mui-content-padded">在行内</h5> 购买数量: <h5 class="mui-content-padded">在行内</h5> 购买数量:
<div class="mui-numbox"> <div class="mui-numbox">
<button class="mui-btn mui-numbox-btn-minus" type="button">-</button> <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
...@@ -99,17 +99,11 @@ ...@@ -99,17 +99,11 @@
</div> </div>
</div> </div>
<script src="../js/mui.min.js"></script> <script src="../js/mui.min.js"></script>
<script> <script>
(function($, doc) { mui.init();
$.init(); document.getElementById("btn").addEventListener('tap', function(event) {
$.plusReady(function() { mui.alert('当前值: ' + document.getElementById("box").value, null, "提示");
var btnGetValue = doc.querySelector('#getValue'); });
var boxTest = doc.querySelector('#testBox');
btnGetValue.addEventListener('click', function(event) {
plus.nativeUI.alert('当前值: ' + boxTest.value, null, "提示");
});
});
}(mui, document));
</script> </script>
</body> </body>
......
examples/hello-mui/examples/picker.html
View file @ be7bd495
...@@ -9,9 +9,9 @@ ...@@ -9,9 +9,9 @@
<link rel="stylesheet" href="../css/mui.min.css"> <link rel="stylesheet" href="../css/mui.min.css">
<!--App自定义的css--> <!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="../css/app.css" /> <link rel="stylesheet" type="text/css" href="../css/app.css" />
<!--<link href="../css/mui.picker.css" rel="stylesheet" /> <link href="../css/mui.picker.css" rel="stylesheet" />
<link href="../css/mui.poppicker.css" rel="stylesheet" />--> <link href="../css/mui.poppicker.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" /> <!--<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />-->
<style> <style>
.mui-btn { .mui-btn {
font-size: 16px; font-size: 16px;
...@@ -61,9 +61,9 @@ ...@@ -61,9 +61,9 @@
</div> </div>
</div> </div>
<script src="../js/mui.min.js"></script> <script src="../js/mui.min.js"></script>
<script src="../js/mui.picker.min.js"></script> <!--<script src="../js/mui.picker.min.js"></script>-->
<!--<script src="../js/mui.picker.js"></script> <script src="../js/mui.picker.js"></script>
<script src="../js/mui.poppicker.js"></script>--> <script src="../js/mui.poppicker.js"></script>
<script src="../js/city.data.js" type="text/javascript" charset="utf-8"></script> <script src="../js/city.data.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/city.data-3.js" type="text/javascript" charset="utf-8"></script> <script src="../js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
<script> <script>
......
examples/hello-mui/examples/setting.html
View file @ be7bd495
...@@ -112,9 +112,7 @@ ...@@ -112,9 +112,7 @@
.mui-table-view { .mui-table-view {
margin-top: 20px; margin-top: 20px;
} }
.mui-table-view:after {
height: 0;
}
.mui-table-view span.mui-pull-right { .mui-table-view span.mui-pull-right {
color: #999; color: #999;
} }
...@@ -215,7 +213,7 @@ ...@@ -215,7 +213,7 @@
</ul> </ul>
<ul class="mui-table-view mui-table-view-chevron"> <ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
<a href="#about" class="mui-navigate-right">关于MUI <i class="mui-pull-right update">V2.3.0</i></a> <a href="#about" class="mui-navigate-right">关于MUI <i class="mui-pull-right update">V2.4.0</i></a>
</li> </li>
</ul> </ul>
<ul class="mui-table-view"> <ul class="mui-table-view">
......
examples/hello-mui/examples/tab-webview-main.html
View file @ be7bd495
...@@ -46,8 +46,8 @@ ...@@ -46,8 +46,8 @@
mui.init(); mui.init();
var subpages = ['tab-webview-subpage-about.html', 'tab-webview-subpage-chat.html', 'tab-webview-subpage-contact.html', 'tab-webview-subpage-setting.html']; var subpages = ['tab-webview-subpage-about.html', 'tab-webview-subpage-chat.html', 'tab-webview-subpage-contact.html', 'tab-webview-subpage-setting.html'];
var subpage_style = { var subpage_style = {
top: '44px', top: '45px',
bottom: '50px' bottom: '51px'
}; };
var aniShow = {}; var aniShow = {};
......
examples/hello-mui/examples/tableviews-with-swipe.html
View file @ be7bd495
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<!--标准mui.css--> <!--标准mui.css-->
<link rel="stylesheet" href="../css/mui.min.css"> <link rel="stylesheet" href="../css/mui.min.css">
<!--App自定义的css--> <!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="../css/app.css"/> <link rel="stylesheet" type="text/css" href="../css/app.css" />
</head> </head>
<body> <body>
...@@ -91,11 +91,10 @@ ...@@ -91,11 +91,10 @@
<a class="mui-btn mui-btn-yellow mui-icon mui-icon-phone"></a> <a class="mui-btn mui-btn-yellow mui-icon mui-icon-phone"></a>
<a class="mui-btn mui-btn-red mui-icon mui-icon-email"></a> <a class="mui-btn mui-btn-red mui-icon mui-icon-email"></a>
</div> </div>
<div class="mui-slider-handle mui-table"> <div class="mui-slider-handle">
<div class="mui-table-cell"> <div class="mui-table-cell">
左滑显示多功能菜单 左滑显示多功能菜单
</div> </div>
</div> </div>
</li> </li>
<li class="mui-table-view-cell"> <li class="mui-table-view-cell">
...@@ -140,10 +139,14 @@ ...@@ -140,10 +139,14 @@
//第一个demo，拖拽后显示操作图标，点击操作图标删除元素； //第一个demo，拖拽后显示操作图标，点击操作图标删除元素；
$('#OA_task_1').on('tap', '.mui-btn', function(event) { $('#OA_task_1').on('tap', '.mui-btn', function(event) {
var elem = this; var elem = this;
var li = elem.parentNode.parentNode;
mui.confirm('确认删除该条记录？', 'Hello MUI', btnArray, function(e) { mui.confirm('确认删除该条记录？', 'Hello MUI', btnArray, function(e) {
if (e.index == 0) { if (e.index == 0) {
var li = elem.parentNode.parentNode;
li.parentNode.removeChild(li); li.parentNode.removeChild(li);
} else {
setTimeout(function() {
$.swipeoutClose(li);
}, 0);
} }
}); });
}); });
...@@ -154,6 +157,10 @@ ...@@ -154,6 +157,10 @@
mui.confirm('确认删除该条记录？', 'Hello MUI', btnArray, function(e) { mui.confirm('确认删除该条记录？', 'Hello MUI', btnArray, function(e) {
if (e.index == 0) { if (e.index == 0) {
elem.parentNode.removeChild(elem); elem.parentNode.removeChild(elem);
} else {
setTimeout(function() {
$.swipeoutClose(elem);
}, 0);
} }
}); });
}); });
...@@ -163,10 +170,15 @@ ...@@ -163,10 +170,15 @@
mui.confirm('确认删除该条记录？', 'Hello MUI', btnArray, function(e) { mui.confirm('确认删除该条记录？', 'Hello MUI', btnArray, function(e) {
if (e.index == 0) { if (e.index == 0) {
elem.parentNode.removeChild(elem); elem.parentNode.removeChild(elem);
} else {
setTimeout(function() {
$.swipeoutClose(elem);
}, 0);
} }
}); });
}); });
})(mui); })(mui);
</script> </script>
</body> </body>
</html> </html>
\ No newline at end of file
examples/hello-mui/examples/template.html
View file @ be7bd495
...@@ -81,27 +81,25 @@ ...@@ -81,27 +81,25 @@
} }
}); });
var contentWebview = null,self = null; var contentWebview = null,self = null;
var titleElem = document.getElementById("title");
mui.plusReady(function () { mui.plusReady(function () {
self = plus.webview.currentWebview(); self = plus.webview.currentWebview();
}); });
mui.back = function() { mui.back = function() {
var current = plus.webview.currentWebview(); self.hide('auto');
current.hide('auto');
setTimeout(function() { setTimeout(function() {
titleElem.className = 'mui-title mui-fadeout'; titleElem.className = 'mui-title mui-fadeout';
titleElem.innerText = ''; titleElem.innerText = '';
if(contentWebview==null){ if(contentWebview==null){
contentWebview = current.children()[0]; contentWebview = self.children()[0];
} }
contentWebview.hide("none"); contentWebview.hide("none");
}, 350); }, 350);
} }
var titleElem = document.getElementById("title")
var menu = document.getElementById("menu") var menuElem = document.getElementById("menu")
window.addEventListener("updateHeader", function(e) { window.addEventListener("updateHeader", function(e) {
var title = e.detail.title; var title = e.detail.title;
var showMenu = e.detail.showMenu; var showMenu = e.detail.showMenu;
var href = e.detail.target; var href = e.detail.target;
...@@ -132,7 +130,8 @@ ...@@ -132,7 +130,8 @@
} }
}); });
document.getElementById("menu").addEventListener('tap', function(e) {
menuElem.addEventListener('tap', function(e) {
e.stopPropagation(); e.stopPropagation();
if(contentWebview==null){ if(contentWebview==null){
contentWebview = plus.webview.currentWebview().children()[0]; contentWebview = plus.webview.currentWebview().children()[0];
...@@ -145,6 +144,16 @@ ...@@ -145,6 +144,16 @@
} }
contentWebview.evalJS('mui.scrollTo(0, 100)'); contentWebview.evalJS('mui.scrollTo(0, 100)');
}); });
mui.menu = function () {
console.log(menuElem.style.display);
if(menuElem.style.display !== "none"){
if(contentWebview==null){
contentWebview = plus.webview.currentWebview().children()[0];
}
contentWebview.evalJS('mui("#topPopover").popover("toggle")');
}
}
</script> </script>
</html> </html>
\ No newline at end of file
examples/hello-mui/js/mui.indexedlist.js
View file @ be7bd495
...@@ -174,4 +174,14 @@ ...@@ -174,4 +174,14 @@
} }
}); });
//mui(selector).indexedList 方式
$.fn.indexedList = function(options) {
//遍历选择的元素
this.each(function(i, element) {
if (element.indexedList) return;
element.indexedList = new IndexedList(element, options);
});
return this[0] ? this[0].indexedList : null;
};
})(mui, window, document); })(mui, window, document);
\ No newline at end of file
examples/hello-mui/js/mui.js
View file @ be7bd495
/*! /*!
* ===================================================== * =====================================================
* Mui v2.3.0 (https://github.com/dcloudio/mui) * Mui v2.4.0 (https://github.com/dcloudio/mui)
* ===================================================== * =====================================================
*/ */
/** /**
...@@ -748,7 +748,8 @@ var mui = (function(document, undefined) { ...@@ -748,7 +748,8 @@ var mui = (function(document, undefined) {
} }
} }
var target = e.target; var target = e.target;
if (target.tagName && target.tagName === 'INPUT' && (target.type === 'text' || target.type === 'search' || target.type === 'number')) { //TODO 需考虑所有键盘弹起的情况
if (target.tagName && (target.tagName === 'TEXTAREA' || (target.tagName === 'INPUT' && (target.type === 'text' || target.type === 'search' || target.type === 'number')))) {
if (target.disabled || target.readOnly) { if (target.disabled || target.readOnly) {
return; return;
} }
...@@ -3440,7 +3441,6 @@ var mui = (function(document, undefined) { ...@@ -3440,7 +3441,6 @@ var mui = (function(document, undefined) {
} }
}, },
_start: function(e) { _start: function(e) {
e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
this.moved = this.needReset = false; this.moved = this.needReset = false;
this._transitionTime(); this._transitionTime();
if (this.isInTransition) { if (this.isInTransition) {
...@@ -4085,6 +4085,10 @@ var mui = (function(document, undefined) { ...@@ -4085,6 +4085,10 @@ var mui = (function(document, undefined) {
} }
}, },
_start: function(e) { _start: function(e) {
//仅下拉刷新在start阻止默认事件
if (e.touches && e.touches.length && e.touches[0].clientX > 30) {
e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
}
if (!this.loading) { if (!this.loading) {
this.pulldown = this.pullPocket = this.pullCaption = this.pullLoading = false this.pulldown = this.pullPocket = this.pullCaption = this.pullLoading = false
} }
...@@ -4638,6 +4642,7 @@ var mui = (function(document, undefined) { ...@@ -4638,6 +4642,7 @@ var mui = (function(document, undefined) {
var self = this; var self = this;
// document.addEventListener('plusscrollbottom', this); // document.addEventListener('plusscrollbottom', this);
window.addEventListener('dragup', self); window.addEventListener('dragup', self);
document.addEventListener("plusscrollbottom", self);
self.scrollInterval = window.setInterval(function() { self.scrollInterval = window.setInterval(function() {
if (self.isScroll && !self.loading) { if (self.isScroll && !self.loading) {
if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight) { if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight) {
...@@ -4705,7 +4710,7 @@ var mui = (function(document, undefined) { ...@@ -4705,7 +4710,7 @@ var mui = (function(document, undefined) {
// } // }
// } // }
self.isScroll = false; self.isScroll = false;
if (e.type === 'dragup') { if (e.type === 'dragup' || e.type === 'plusscrollbottom') {
self.isScroll = true; self.isScroll = true;
setTimeout(function() { setTimeout(function() {
self.isScroll = false; self.isScroll = false;
...@@ -5583,10 +5588,11 @@ var mui = (function(document, undefined) { ...@@ -5583,10 +5588,11 @@ var mui = (function(document, undefined) {
return element; return element;
}()); }());
var removeBackdropTimer;
var removeBackdrop = function(popover) { var removeBackdrop = function(popover) {
backdrop.setAttribute('style', 'opacity:0'); backdrop.setAttribute('style', 'opacity:0');
$.targets.popover = $.targets._popover = null; //reset $.targets.popover = $.targets._popover = null; //reset
setTimeout(function() { removeBackdropTimer = $.later(function() {
if (!popover.classList.contains(CLASS_ACTIVE) && backdrop.parentNode && backdrop.parentNode === document.body) { if (!popover.classList.contains(CLASS_ACTIVE) && backdrop.parentNode && backdrop.parentNode === document.body) {
document.body.removeChild(backdrop); document.body.removeChild(backdrop);
} }
...@@ -5611,6 +5617,7 @@ var mui = (function(document, undefined) { ...@@ -5611,6 +5617,7 @@ var mui = (function(document, undefined) {
}); });
var togglePopover = function(popover, anchor) { var togglePopover = function(popover, anchor) {
removeBackdropTimer && removeBackdropTimer.cancel(); //取消remove的timer
//remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove //remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove
popover.removeEventListener('webkitTransitionEnd', onPopoverShown); popover.removeEventListener('webkitTransitionEnd', onPopoverShown);
popover.removeEventListener('webkitTransitionEnd', onPopoverHidden); popover.removeEventListener('webkitTransitionEnd', onPopoverHidden);
...@@ -7011,8 +7018,16 @@ var mui = (function(document, undefined) { ...@@ -7011,8 +7018,16 @@ var mui = (function(document, undefined) {
}); });
self.input.addEventListener(changeEventName, function(event) { self.input.addEventListener(changeEventName, function(event) {
self.checkValue(); self.checkValue();
$.trigger(self, changeEventName, self.getValue());
}); });
}, },
/**
* 获取当前值
**/
getValue: function() {
var self = this;
return parseInt(self.input.value);
},
/** /**
* 验证当前值是法合法 * 验证当前值是法合法
**/ **/
......
examples/hello-mui/js/mui.lazyload.img.js
View file @ be7bd495
...@@ -4,50 +4,94 @@ ...@@ -4,50 +4,94 @@
this._super(element, options); this._super(element, options);
}, },
_init: function() { _init: function() {
this.options.selector = 'img[data-lazyload]'; this.options.selector = '[data-lazyload]';
this._super(); this._super();
}, },
addElement: function(img) { _set: function(element, uri) {
if (element.tagName === 'IMG') {
element.src = uri;
} else {
element.style.backgroundImage = "url(" + uri + ")";
}
},
_hasPlaceholder: function(element) {
if (element.offsetWidth) {
if (element.tagName === 'IMG') {
return !!element.src;
} else {
return !!element.style.backgroundImage;
}
}
return false;
},
_addPlaceHolder: function(element) {
var self = this; var self = this;
var src = img.getAttribute('data-lazyload'); if (element.tagName === 'IMG') {
if (src) { self._counter++;
self.onPlaceHolder = self._createLoader(function(callback) { element.onload = function() {
var img = new Image(); self._counter--;
var placeholder = self.options.placeholder; self.addCallback(element, self.handle);
img.src = placeholder; this.onload = null;
img.onload = img.onerror = function() { };
callback(placeholder) self.onPlaceHolder(function(placeholder) {
}; self._set(element, placeholder);
}); });
if (img.offsetWidth) { } else {
self.addCallback(img, self.handle); element.style.backgroundImage = "url(" + self.options.placeholder + ")";
}
},
addElement: function(element) {
var self = this;
var uri = element.getAttribute('data-lazyload');
if (uri) {
if (self._hasPlaceholder(element)) {
self.addCallback(element, self.handle);
} else { } else {
self._counter++; self.onPlaceHolder = self._createLoader(function(callback) {
img.onload = function() { var img = new Image();
self._counter--; var placeholder = self.options.placeholder;
self.addCallback(img, self.handle); img.src = placeholder;
this.onload = null; img.onload = img.onerror = function() {
}; callback(placeholder);
if (!img.src) { };
self.onPlaceHolder(function(placeholder) { });
if (!img.src) { self._addPlaceHolder(element);
img.src = placeholder;
}
});
}
} }
return true; return true;
} }
return false; return false;
}, },
handle: function(img, key) { set: function(element, uri) {
var dataSrc = img.getAttribute('data-lazyload'); var self = this;
if (dataSrc && img.src != dataSrc) { var img = new Image();
img.src = dataSrc; img.onload = function() {
img.removeAttribute('data-lazyload'); self._set(element, uri);
img.parentNode.parentNode.setAttribute('data-lazyload', 'true'); $.trigger(self.element, 'success', {
element: element,
uri: uri
});
};
img.onerror = function() {
$.trigger(self.element, 'error', {
element: element,
uri: uri
});
};
img.src = uri;
element.removeAttribute('data-lazyload'); //只尝试一次，后续可能支持多次尝试
},
handle: function(element, key) {
var uri = element.getAttribute('data-lazyload');
if (uri) {
this.set(element, uri);
//element.parentNode.parentNode.setAttribute('data-lazyload', 'true'); //debug
} }
},
destroy: function() {
this._super();
this.element.removeAttribute('data-imageLazyload');
} }
}); });
$.fn.imageLazyload = function(options) { $.fn.imageLazyload = function(options) {
var lazyloadApis = []; var lazyloadApis = [];
......
examples/hello-mui/js/mui.locker.js
View file @ be7bd495
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
var styleHolder = doc.querySelector('head') || doc.querySelector('body'); var styleHolder = doc.querySelector('head') || doc.querySelector('body');
styleHolder.innerHTML += "<style>.mui-locker-holder{overflow:hidden;position:relative;padding:0px;}.mui-locker-holder canvas{width:100%;height:100%;}</style>"; styleHolder.innerHTML += "<style>.mui-locker-holder{overflow:hidden;position:relative;padding:0px;}.mui-locker-holder canvas{width:100%;height:100%;}</style>";
var times = 4; var times = 2;
function getElementLeft(element) {　　　　 function getElementLeft(element) {　　　　
var actualLeft = element.offsetLeft;　　　　 var actualLeft = element.offsetLeft;　　　　
...@@ -56,13 +56,11 @@ ...@@ -56,13 +56,11 @@
throw "构造 Locker 时缺少容器元素"; throw "构造 Locker 时缺少容器元素";
} }
self.holder = holder; self.holder = holder;
//避免重复初始化开始
if (self.holder.__locker_inited) return;
self.holder.__locker_inited = true;
//避免重复初始化结束
// //
self.options = options || {}; options = options || {};
self.options.callback = self.options.callback || self.options.done || $.noop; options.callback = options.callback || options.done || $.noop;
options.times = options.times || times;
self.options = options;
self.holder.innerHTML = '<canvas></canvas>'; self.holder.innerHTML = '<canvas></canvas>';
// //
self.holder.classList.add(lockerHolderClassName); self.holder.classList.add(lockerHolderClassName);
...@@ -80,11 +78,11 @@ ...@@ -80,11 +78,11 @@
self.CW = self.options.width || self.holder.offsetWidth || self.CW; self.CW = self.options.width || self.holder.offsetWidth || self.CW;
self.CH = self.options.height || self.holder.offsetHeight || self.CH; self.CH = self.options.height || self.holder.offsetHeight || self.CH;
//处理 “宽、高” 等数值, 全部扩大 times 倍 //处理 “宽、高” 等数值, 全部扩大 times 倍
self.R *= times; self.R *= self.options.times;
self.CW *= times; self.CW *= self.options.times;
self.CH *= times; self.CH *= self.options.times;
self.OffsetX *= times; self.OffsetX *= self.options.times;
self.OffsetY *= times; self.OffsetY *= self.options.times;
// //
canvas.width = self.CW; canvas.width = self.CW;
canvas.height = self.CH; canvas.height = self.CH;
...@@ -131,7 +129,7 @@ ...@@ -131,7 +129,7 @@
var pointIndex = _LinePointArr[i]; var pointIndex = _LinePointArr[i];
cxt.lineTo(_PointLocationArr[pointIndex].X, _PointLocationArr[pointIndex].Y); cxt.lineTo(_PointLocationArr[pointIndex].X, _PointLocationArr[pointIndex].Y);
} }
cxt.lineWidth = 2 * times; cxt.lineWidth = (self.options.lindeWidth || 2) * self.options.times;
cxt.strokeStyle = self.options.lineColor || "#999"; //连结线颜色 cxt.strokeStyle = self.options.lineColor || "#999"; //连结线颜色
cxt.stroke(); cxt.stroke();
cxt.closePath(); cxt.closePath();
...@@ -149,18 +147,18 @@ ...@@ -149,18 +147,18 @@
var Point = _PointLocationArr[i]; var Point = _PointLocationArr[i];
cxt.fillStyle = self.options.ringColor || "#888"; //圆圈边框颜色 cxt.fillStyle = self.options.ringColor || "#888"; //圆圈边框颜色
cxt.beginPath(); cxt.beginPath();
cxt.arc(Point.X, Point.Y, R, 0, Math.PI * times, true); cxt.arc(Point.X, Point.Y, R, 0, Math.PI * 2, true);
cxt.closePath(); cxt.closePath();
cxt.fill(); cxt.fill();
cxt.fillStyle = self.options.fillColor || "#f3f3f3"; //圆圈填充颜色 cxt.fillStyle = self.options.fillColor || "#f3f3f3"; //圆圈填充颜色
cxt.beginPath(); cxt.beginPath();
cxt.arc(Point.X, Point.Y, R - (2 * times), 0, Math.PI * times, true); cxt.arc(Point.X, Point.Y, R - ((self.options.ringWidth || 2) * self.options.times), 0, Math.PI * 2, true);
cxt.closePath(); cxt.closePath();
cxt.fill(); cxt.fill();
if (_LinePointArr.indexOf(i) >= 0) { if (_LinePointArr.indexOf(i) >= 0) {
cxt.fillStyle = self.options.pointColor || "#777"; //圆圈中心点颜色 cxt.fillStyle = self.options.pointColor || "#777"; //圆圈中心点颜色
cxt.beginPath(); cxt.beginPath();
cxt.arc(Point.X, Point.Y, R - (16 * times), 0, Math.PI * times, true); cxt.arc(Point.X, Point.Y, R - ((self.options.pointWidth || 16) * self.options.times), 0, Math.PI * 2, true);
cxt.closePath(); cxt.closePath();
cxt.fill(); cxt.fill();
} }
...@@ -190,8 +188,8 @@ ...@@ -190,8 +188,8 @@
//start //start
self._startHandler = function(e) { self._startHandler = function(e) {
e.point = event.changedTouches ? event.changedTouches[0] : event; e.point = event.changedTouches ? event.changedTouches[0] : event;
e.point.elementX = (e.point.pageX - getElementLeft(holder)) * times; e.point.elementX = (e.point.pageX - getElementLeft(holder)) * self.options.times;
e.point.elementY = (e.point.pageY - getElementTop(holder)) * times; e.point.elementY = (e.point.pageY - getElementTop(holder)) * self.options.times;
self.isPointSelect(e.point, linePoint); self.isPointSelect(e.point, linePoint);
isDown = true; isDown = true;
}; };
...@@ -201,8 +199,8 @@ ...@@ -201,8 +199,8 @@
if (!isDown) return; if (!isDown) return;
e.preventDefault(); e.preventDefault();
e.point = event.changedTouches ? event.changedTouches[0] : event; e.point = event.changedTouches ? event.changedTouches[0] : event;
e.point.elementX = (e.point.pageX - getElementLeft(holder)) * times; e.point.elementX = (e.point.pageX - getElementLeft(holder)) * self.options.times;
e.point.elementY = (e.point.pageY - getElementTop(holder)) * times; e.point.elementY = (e.point.pageY - getElementTop(holder)) * self.options.times;
var touches = e.point; var touches = e.point;
self.isPointSelect(touches, linePoint); self.isPointSelect(touches, linePoint);
cxt.clearRect(0, 0, self.CW, self.CH); cxt.clearRect(0, 0, self.CW, self.CH);
...@@ -215,8 +213,8 @@ ...@@ -215,8 +213,8 @@
//end //end
self._endHandler = function(e) { self._endHandler = function(e) {
e.point = event.changedTouches ? event.changedTouches[0] : event; e.point = event.changedTouches ? event.changedTouches[0] : event;
e.point.elementX = (e.point.pageX - getElementLeft(holder)) * times; e.point.elementX = (e.point.pageX - getElementLeft(holder)) * self.options.times;
e.point.elementY = (e.point.pageY - getElementTop(holder)) * times; e.point.elementY = (e.point.pageY - getElementTop(holder)) * self.options.times;
cxt.clearRect(0, 0, self.CW, self.CH); cxt.clearRect(0, 0, self.CW, self.CH);
self.draw(cxt, self.pointLocationArr, linePoint, null); self.draw(cxt, self.pointLocationArr, linePoint, null);
//事件数据 //事件数据
...@@ -276,8 +274,9 @@ ...@@ -276,8 +274,9 @@
$.fn.locker = function(options) { $.fn.locker = function(options) {
//遍历选择的元素 //遍历选择的元素
this.each(function(i, element) { this.each(function(i, element) {
if (element.locker) return;
if (options) { if (options) {
new Locker(element, options); element.locker = new Locker(element, options);
} else { } else {
var optionsText = element.getAttribute('data-locker-options'); var optionsText = element.getAttribute('data-locker-options');
var _options = optionsText ? JSON.parse(optionsText) : {}; var _options = optionsText ? JSON.parse(optionsText) : {};
...@@ -287,10 +286,10 @@ ...@@ -287,10 +286,10 @@
_options.pointColor = element.getAttribute('data-locker-point-color') || _options.pointColor; _options.pointColor = element.getAttribute('data-locker-point-color') || _options.pointColor;
_options.width = element.getAttribute('data-locker-width') || _options.width; _options.width = element.getAttribute('data-locker-width') || _options.width;
_options.height = element.getAttribute('data-locker-height') || _options.height; _options.height = element.getAttribute('data-locker-height') || _options.height;
new Locker(element, _options); element.locker = new Locker(element, _options);
} }
}); });
return this; return this[0] ? this[0].locker : null;
}; };
//自动处理 class='mui-locker' 的 dom //自动处理 class='mui-locker' 的 dom
......
examples/hello-mui/js/mui.min.js
View file @ be7bd495
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/hello-mui/js/mui.picker.all.js
View file @ be7bd495
...@@ -22,7 +22,9 @@ ...@@ -22,7 +22,9 @@
var platform = navigator.platform.toLowerCase(); var platform = navigator.platform.toLowerCase();
var userAgent = navigator.userAgent.toLowerCase(); var userAgent = navigator.userAgent.toLowerCase();
var isIos = userAgent.indexOf('iphone') > -1 && platform == 'iphone'; var isIos = (userAgent.indexOf('iphone') > -1 || userAgent.indexOf('ipad') > -1) &&
(platform.indexOf('iphone') > -1 || platform.indexOf('ipad') > -1);
//alert(isIos);
var Picker = $.Picker = function(holder, options) { var Picker = $.Picker = function(holder, options) {
var self = this; var self = this;
...@@ -371,7 +373,7 @@ ...@@ -371,7 +373,7 @@
}); });
} }
})(this.mui || this, window, document, undefined); })(window.mui || window, window, document, undefined);
//end //end
/** /**
* 弹出选择列表插件 * 弹出选择列表插件
......
examples/hello-mui/js/mui.picker.js
View file @ be7bd495
...@@ -22,7 +22,9 @@ ...@@ -22,7 +22,9 @@
var platform = navigator.platform.toLowerCase(); var platform = navigator.platform.toLowerCase();
var userAgent = navigator.userAgent.toLowerCase(); var userAgent = navigator.userAgent.toLowerCase();
var isIos = userAgent.indexOf('iphone') > -1 && platform == 'iphone'; var isIos = (userAgent.indexOf('iphone') > -1 || userAgent.indexOf('ipad') > -1) &&
(platform.indexOf('iphone') > -1 || platform.indexOf('ipad') > -1);
//alert(isIos);
var Picker = $.Picker = function(holder, options) { var Picker = $.Picker = function(holder, options) {
var self = this; var self = this;
...@@ -371,5 +373,5 @@ ...@@ -371,5 +373,5 @@
}); });
} }
})(this.mui || this, window, document, undefined); })(window.mui || window, window, document, undefined);
//end //end
\ No newline at end of file
examples/hello-mui/js/mui.picker.min.js
View file @ be7bd495
This diff is collapsed.
examples/hello-mui/js/mui.previewimage.js
View file @ be7bd495
...@@ -24,9 +24,6 @@ ...@@ -24,9 +24,6 @@
document.body.appendChild(div.firstElementChild); document.body.appendChild(div.firstElementChild);
el = document.getElementById(this.options.id); el = document.getElementById(this.options.id);
} }
//自动启用
$.options.gestureConfig.pinch = true;
$.options.gestureConfig.doubletap = true;
this.element = el; this.element = el;
this.scroller = this.element.querySelector($.classSelector('.slider-group')); this.scroller = this.element.querySelector($.classSelector('.slider-group'));
......
examples/hello-mui/js/mui.pullToRefresh.js
View file @ be7bd495
...@@ -36,6 +36,9 @@ ...@@ -36,6 +36,9 @@
contentrefresh: '正在加载...', contentrefresh: '正在加载...',
contentnomore: '没有更多数据了', contentnomore: '没有更多数据了',
callback: false callback: false
},
preventDefaultException: {
tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT)$/
} }
}, options); }, options);
this.stopped = this.isNeedRefresh = this.isDragging = false; this.stopped = this.isNeedRefresh = this.isDragging = false;
...@@ -45,8 +48,17 @@ ...@@ -45,8 +48,17 @@
this.initEvent(); this.initEvent();
}, },
_preventDefaultException: function(el, exceptions) {
for (var i in exceptions) {
if (exceptions[i].test(el[i])) {
return true;
}
}
return false;
},
initEvent: function() { initEvent: function() {
if ($.isFunction(this.options.down.callback)) { if ($.isFunction(this.options.down.callback)) {
this.element.addEventListener('touchstart', this);
this.element.addEventListener('drag', this); this.element.addEventListener('drag', this);
this.element.addEventListener('dragend', this); this.element.addEventListener('dragend', this);
} }
...@@ -60,6 +72,9 @@ ...@@ -60,6 +72,9 @@
}, },
handleEvent: function(e) { handleEvent: function(e) {
switch (e.type) { switch (e.type) {
case 'touchstart':
this.isInScroll && this._canPullDown() && e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
break;
case 'drag': case 'drag':
this._drag(e); this._drag(e);
break; break;
...@@ -127,7 +142,7 @@ ...@@ -127,7 +142,7 @@
if (self.loading) { if (self.loading) {
return; return;
} }
if (e && e.detail && e.detail.drag) { if (e && e.detail && $.gestures.session.drag) {
self.isDraggingUp = true; self.isDraggingUp = true;
} else { } else {
if (!self.isDraggingUp) { //scroll event if (!self.isDraggingUp) { //scroll event
...@@ -175,6 +190,11 @@ ...@@ -175,6 +190,11 @@
var detail = e.detail; var detail = e.detail;
if (!this.isDragging) { if (!this.isDragging) {
if (detail.direction === 'down' && this._canPullDown()) { if (detail.direction === 'down' && this._canPullDown()) {
if (document.querySelector('.' + CLASS_PULL_TOP_TIPS)) {
e.stopPropagation();
e.detail.gesture.preventDefault();
return;
}
this.isDragging = true; this.isDragging = true;
this.removing = false; this.removing = false;
this.startDeltaY = detail.deltaY; this.startDeltaY = detail.deltaY;
......
examples/hello-mui/js/mui.zoom.js
View file @ be7bd495
...@@ -26,6 +26,9 @@ ...@@ -26,6 +26,9 @@
zoom.zoomerStyle = zoom.zoomer && zoom.zoomer.style; zoom.zoomerStyle = zoom.zoomer && zoom.zoomer.style;
zoom.init = function() { zoom.init = function() {
//自动启用
$.options.gestureConfig.pinch = true;
$.options.gestureConfig.doubletap = true;
zoom.initEvents(); zoom.initEvents();
}; };
......
js/mui.class.scroll.js
View file @ be7bd495
...@@ -275,7 +275,6 @@ ...@@ -275,7 +275,6 @@
} }
}, },
_start: function(e) { _start: function(e) {
e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
this.moved = this.needReset = false; this.moved = this.needReset = false;
this._transitionTime(); this._transitionTime();
if (this.isInTransition) { if (this.isInTransition) {
......
js/mui.class.scroll.pullrefresh.js
View file @ be7bd495
...@@ -20,6 +20,10 @@ ...@@ -20,6 +20,10 @@
} }
}, },
_start: function(e) { _start: function(e) {
//仅下拉刷新在start阻止默认事件
if (e.touches && e.touches.length && e.touches[0].clientX > 30) {
e.target && !this._preventDefaultException(e.target, this.options.preventDefaultException) && e.preventDefault();
}
if (!this.loading) { if (!this.loading) {
this.pulldown = this.pullPocket = this.pullCaption = this.pullLoading = false this.pulldown = this.pullPocket = this.pullCaption = this.pullLoading = false
} }
......
js/mui.fixed.keyboard.js
View file @ be7bd495
...@@ -21,7 +21,8 @@ ...@@ -21,7 +21,8 @@
} }
} }
var target = e.target; var target = e.target;
if (target.tagName && target.tagName === 'INPUT' && (target.type === 'text' || target.type === 'search' || target.type === 'number')) { //TODO 需考虑所有键盘弹起的情况
if (target.tagName && (target.tagName === 'TEXTAREA' || (target.tagName === 'INPUT' && (target.type === 'text' || target.type === 'search' || target.type === 'number')))) {
if (target.disabled || target.readOnly) { if (target.disabled || target.readOnly) {
return; return;
} }
......
js/mui.number.js
View file @ be7bd495
...@@ -51,8 +51,16 @@ ...@@ -51,8 +51,16 @@
}); });
self.input.addEventListener(changeEventName, function(event) { self.input.addEventListener(changeEventName, function(event) {
self.checkValue(); self.checkValue();
$.trigger(self, changeEventName, self.getValue());
}); });
}, },
/**
* 获取当前值
**/
getValue: function() {
var self = this;
return parseInt(self.input.value);
},
/** /**
* 验证当前值是法合法 * 验证当前值是法合法
**/ **/
......
js/popovers.js
View file @ be7bd495
...@@ -78,10 +78,11 @@ ...@@ -78,10 +78,11 @@
return element; return element;
}()); }());
var removeBackdropTimer;
var removeBackdrop = function(popover) { var removeBackdrop = function(popover) {
backdrop.setAttribute('style', 'opacity:0'); backdrop.setAttribute('style', 'opacity:0');
$.targets.popover = $.targets._popover = null; //reset $.targets.popover = $.targets._popover = null; //reset
setTimeout(function() { removeBackdropTimer = $.later(function() {
if (!popover.classList.contains(CLASS_ACTIVE) && backdrop.parentNode && backdrop.parentNode === document.body) { if (!popover.classList.contains(CLASS_ACTIVE) && backdrop.parentNode && backdrop.parentNode === document.body) {
document.body.removeChild(backdrop); document.body.removeChild(backdrop);
} }
...@@ -106,6 +107,7 @@ ...@@ -106,6 +107,7 @@
}); });
var togglePopover = function(popover, anchor) { var togglePopover = function(popover, anchor) {
removeBackdropTimer && removeBackdropTimer.cancel(); //取消remove的timer
//remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove //remove一遍，以免来回快速切换，导致webkitTransitionEnd不触发，无法remove
popover.removeEventListener('webkitTransitionEnd', onPopoverShown); popover.removeEventListener('webkitTransitionEnd', onPopoverShown);
popover.removeEventListener('webkitTransitionEnd', onPopoverHidden); popover.removeEventListener('webkitTransitionEnd', onPopoverHidden);
......
js/pullrefresh.5+.js
View file @ be7bd495
...@@ -29,6 +29,7 @@ ...@@ -29,6 +29,7 @@
var self = this; var self = this;
// document.addEventListener('plusscrollbottom', this); // document.addEventListener('plusscrollbottom', this);
window.addEventListener('dragup', self); window.addEventListener('dragup', self);
document.addEventListener("plusscrollbottom", self);
self.scrollInterval = window.setInterval(function() { self.scrollInterval = window.setInterval(function() {
if (self.isScroll && !self.loading) { if (self.isScroll && !self.loading) {
if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight) { if (window.pageYOffset + window.innerHeight + 10 >= document.documentElement.scrollHeight) {
...@@ -96,7 +97,7 @@ ...@@ -96,7 +97,7 @@
// } // }
// } // }
self.isScroll = false; self.isScroll = false;
if (e.type === 'dragup') { if (e.type === 'dragup' || e.type === 'plusscrollbottom') {
self.isScroll = true; self.isScroll = true;
setTimeout(function() { setTimeout(function() {
self.isScroll = false; self.isScroll = false;
......
package.json
View file @ be7bd495
{ {
"name": "mui", "name": "mui",
"description": "Build mobile apps with simple HTML, CSS, and JS components.", "description": "Build mobile apps with simple HTML, CSS, and JS components.",
"version": "2.3.0", "version": "2.4.0",
"keywords": [ "keywords": [
"css", "css",
"fonts", "fonts",
......
sass/sliders.scss
View file @ be7bd495
...@@ -36,6 +36,7 @@ ...@@ -36,6 +36,7 @@
// -webkit-backface-visibility: hidden; // -webkit-backface-visibility: hidden;
position: relative; position: relative;
display: inline-block; display: inline-block;
white-space:normal;
width: 100%; width: 100%;
height: 100%; height: 100%;
font-size: 14px; font-size: 14px;
......
sass/table-views.scss
View file @ be7bd495
...@@ -13,6 +13,9 @@ ...@@ -13,6 +13,9 @@
// border-width: 1px 0px 1px 0px; // border-width: 1px 0px 1px 0px;
// border-style: solid; // border-style: solid;
@include hairline(double, #c8c7cc, 0); // Double grey border. @include hairline(double, #c8c7cc, 0); // Double grey border.
&:before{
top:-1px;//cell 高亮时，保证边框仍旧可见
}
} }
//.#{$namespace}table-view-striped>li:nth-child(odd){ //.#{$namespace}table-view-striped>li:nth-child(odd){
...@@ -83,7 +86,7 @@ ...@@ -83,7 +86,7 @@
position: relative; position: relative;
padding: 11px 15px; padding: 11px 15px;
overflow: hidden; overflow: hidden;
background-color: inherit; //background-color: inherit;//应该透明，否则会盖住ul的边框
@include hairline(single, #c8c7cc, 15px); // Single grey border with 15px offset. @include hairline(single, #c8c7cc, 15px); // Single grey border with 15px offset.
-webkit-touch-callout: none;//禁止长按出现打开菜单； -webkit-touch-callout: none;//禁止长按出现打开菜单；
&.#{$namespace}radio input[type=radio],&.#{$namespace}checkbox input[type=checkbox]{ &.#{$namespace}radio input[type=radio],&.#{$namespace}checkbox input[type=checkbox]{
......
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