Skip to content

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

编译至0.7.0版本

parent e2ec6bd3
Show whitespace changes
Inline Side-by-side
Showing with 1217 additions and 1287 deletions
examples/hello-mui/css/mui.min.css
View file @ 2b5313c1
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/hello-mui/examples/accordion.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -123,6 +129,6 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/ajax.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -129,4 +135,5 @@
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/badges.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -54,4 +60,5 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/buttons-with-badges.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -46,4 +52,5 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/buttons-with-block.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -49,4 +55,5 @@
}
</style>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/buttons-with-fabs.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -93,4 +99,5 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/buttons-with-icons.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -69,5 +75,7 @@
</button>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/buttons.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -88,4 +94,5 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/cards.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -48,5 +54,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/checkbox.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -55,5 +61,7 @@
</form>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/dialog.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -83,5 +89,7 @@
padding: 20px 10px ;
}
</style>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/forms-with-group-and-labels.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -61,5 +67,7 @@
</form>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/forms-with-group.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -42,5 +48,7 @@
</form>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/forms.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -53,5 +59,7 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/grid-default.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -84,5 +90,7 @@
}
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/grid-pagination.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -237,13 +243,18 @@
var slider = document.getElementById('Gallery');
var group = slider.querySelector('.mui-slider-group');
var items = mui('.mui-slider-item', group);
//克隆第一个节点
var first = items[0].cloneNode(true);
first.classList.add('mui-slider-item-duplicate');
//克隆最后一个节点
var last = items[items.length - 1].cloneNode(true);
last.classList.add('mui-slider-item-duplicate');
function toggleLoop(toggle) {
if (toggle) {
//处理是否循环逻辑，若支持循环，需支持两点：
//1、在.mui-slider-group节点上增加.mui-slider-loop类
//2、重复增加2个循环节点，图片顺序变为：N、1、2...N、1
function toggleLoop(loop) {
if (loop) {
group.classList.add('mui-slider-loop');
group.insertBefore(last, group.firstChild);
group.appendChild(first);
......@@ -254,12 +265,14 @@
}
}
//按下“循环”按钮的处理逻辑；
document.getElementById('Gallery_Toggle').addEventListener('toggle', function(e) {
var detail = e.detail;
toggleLoop(detail.isActive);
var loop = e.detail.isActive;
toggleLoop(loop);
});
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/icons.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -196,4 +202,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/info.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -45,7 +51,7 @@
</p>
<p>更多详细介绍，请到<a href="http://dcloudio.github.io/mui">mui官网</a>查看；</p>
<h4>版本介绍</h4>
<p>当前版本为0.6.0，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p>
<p>当前版本为0.6.1，可到<a href="https://github.com/dcloudio/mui">Github</a>上获取最新版本。</p>
<h4>License</h4>
<p>
mui遵循MIT License，源码已提交至Github，<a href="https://github.com/dcloudio/mui">点击查看</a>;
......@@ -82,4 +88,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/inputs.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -38,7 +44,18 @@
<div class="mui-input-row mui-search">
<input id="search" type="search" class="mui-input-speech mui-input-clear" placeholder="带语音输入的搜索框">
</div>
<div class="mui-input-row mui-input-range">
<label>slider</label>
<input type="range" min="0" max="100">
</div>
<div class="mui-input-row">
<label>Switch</label>
<div class="mui-switch mui-active">
<div class="mui-switch-handle"></div>
</div>
</div>
<form class="mui-input-group">
<div class="mui-input-row">
<label>Input</label>
<input type="text" placeholder="普通输入框">
......@@ -76,4 +93,5 @@
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/iscroll.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -109,5 +115,7 @@
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/list-triplex-row.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -115,5 +121,7 @@
</li>
</ul>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/list-with-input.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -75,5 +81,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/modals.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -41,5 +47,7 @@
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/oa-contact-list.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -56,5 +62,7 @@
<script type="text/javascript" charset="utf-8">
mui.init({optimize:false,swipeBack: true});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/oa-contact-main.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -73,5 +79,7 @@
});
mui.init({optimize:false,swipeBack: false});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/oa-grid.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -134,5 +140,7 @@
</ul>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/oa-missives-detail.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -100,5 +106,7 @@
<span id="item4mobile" class="mui-control-content">Item 4</span>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/offcanvas-left-plus-main.html
View file @ 2b5313c1
......@@ -15,6 +15,7 @@
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
......@@ -189,4 +190,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/offcanvas-plus-menu.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -78,4 +84,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/offcanvas-right-plus-main.html
View file @ 2b5313c1
......@@ -189,4 +189,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/offcanvas-with-left.html
View file @ 2b5313c1
......@@ -156,22 +156,26 @@
var offCanvasContainer = document.querySelector('.mui-off-canvas-wrap');
var offCanvasInnerContainer = offCanvasContainer.querySelector('.mui-inner-wrap');
var offCanvas = mui('#offCanvas');
//按下“整体滑动”开关后的执行逻辑
document.getElementById('switch').addEventListener('toggle', function(event) {
if (event.detail.isActive) { //整体滑动时，侧滑菜单在inner-wrap内
if (event.detail.isActive) {
//整体滑动时，侧滑菜单在inner-wrap内
offCanvasInnerContainer.insertBefore(offCanvas[0], offCanvasInnerContainer.firstElementChild);
} else { //仅主内容滑动时，侧滑菜单在off-canvas-wrap内
} else {
//仅主内容滑动时，侧滑菜单在off-canvas-wrap内
offCanvasContainer.insertBefore(offCanvas[0], offCanvasContainer.firstElementChild)
}
});
//按下“显示侧滑菜单”按钮后的执行逻辑
document.getElementById('offCanvasShow').addEventListener('tap', function() {
//offCanvas.offCanvas('toggle')//toggle or show;
offCanvas.offCanvas('show');
});
//按下“关闭侧滑菜单”按钮后的执行逻辑
document.getElementById('offCanvasHide').addEventListener('tap', function() {
//offCanvas.offCanvas('toggle')//toggle or hide;
offCanvas.offCanvas('hide');
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/offcanvas-with-right.html
View file @ 2b5313c1
......@@ -266,5 +266,7 @@
offCanvas.offCanvas('hide');
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pagination.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -242,5 +248,7 @@
padding: 10px;
}
</style>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/popovers-with-actionsheet.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -60,4 +66,5 @@
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/popovers-with-cross-webviews-popover.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -96,5 +102,7 @@
});
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/popovers-with-cross-webviews.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -41,5 +47,7 @@
});
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/popovers-with-js-call.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -79,4 +85,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/popovers.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -49,4 +55,5 @@
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/preload-mixwebview-content.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -55,5 +61,7 @@
}
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/preload-mixwebview-main.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -38,5 +44,7 @@
}
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/preload-webview-with-openwindow.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -66,5 +72,7 @@
}, 2000);
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/preload-webview.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -66,5 +72,7 @@
}, 2000);
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/preload.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -103,4 +109,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pull-refresh-content-custom.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html, body, .mui-content {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>
<title>Hello H5+</title>
<script type="text/javascript" charset="utf-8">
var ws=null,wo=null;
// 扩展API加载完毕，现在可以正常调用扩展API
function plusReady(){
// 获取自身窗口
ws=plus.webview.currentWebview();
wo=ws.opener();
}
// 判断扩展API是否准备，否则监听"plusready"事件
if(window.plus){
plusReady();
}else{
document.addEventListener("plusready",plusReady,false);
}
// DOM构建完成获取列表元素
var list=null;
document.addEventListener("DOMContentLoaded",function(){
list=document.getElementById("list");
});
// 刷新页面
function onRefresh(){
setTimeout(function(){
if(list){
var item=document.createElement("li");
item.innerHTML="<span>New Item "+(new Date())+"</span>";
list.insertBefore(item,list.firstChild);
}
ws.endPullToRefresh();
wo.evalJS("pullReset()");
},2000);
}
</script>
<link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8"/>
<style type="text/css">
li {
padding: 1em;
border-bottom: 1px solid #eaeaea;
}
li:active {
background: #f4f4f4;
}
</style>
</head>
<body>
<ul id="list" style="list-style:none;margin:0;padding:0;">
<li><span onclick="alert('ok');">Initializ List Item 1</span></li>
<li><span>Initializ List Item 2</span></li>
<li><span>Initializ List Item 3</span></li>
<li><span>Initializ List Item 4</span></li>
<li><span>Initializ List Item 5</span></li>
<li><span>Initializ List Item 6</span></li>
<li><span>Initializ List Item 7</span></li>
<li><span>Initializ List Item 8</span></li>
<li><span>Initializ List Item 9</span></li>
<li><span>Initializ List Item 10</span></li>
</ul>
</body>
</html>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pulldown-with-plus-content-custom.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<script type="text/javascript" charset="utf-8">
var ws = null,wo = null;
mui.plusReady(function(){
// 获取自身窗口
ws = plus.webview.currentWebview();
wo = ws.opener();
});
// DOM构建完成获取列表元素
var list = null;
document.addEventListener("DOMContentLoaded", function() {
list = document.getElementById("list");
});
// 刷新页面
function onRefresh() {
setTimeout(function() {
if (list) {
var item = document.createElement("li");
item.innerHTML = "<span>New Item " + (new Date()) + "</span>";
list.insertBefore(item, list.firstChild);
}
ws.endPullToRefresh();
wo.evalJS("pullReset()");
}, 2000);
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.insertBefore(li, table.firstChild);
}
ws.endPullToRefresh();
wo.evalJS("pullReset()");
}, 1000);
}
// mui.init({
// swipeBack: false,
// optimize: false,
// pullRefresh: {
// container: '.mui-content-padded',
// up: {
// contentrefresh: '正在加载...',
// callback: pullupRefresh
// }
// }
// });
/**
* 上拉加载具体业务实现
*/
function pullupRefresh(callback) {
setTimeout(function() {
callback(); //refresh completed
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.appendChild(li);
}
}, 1500);
}
</script>
<div class="mui-content">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 6
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 5
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 4
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 3
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 2
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 1
</a>
</li>
</ul>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pulldown-with-plus-main-custom.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<script type="text/javascript" charset="utf-8">
var list;
// 扩展API加载完毕，现在可以正常调用扩展API
function init() {
list = plus.webview.create("pulldown-with-plus-content-custom.html", "pulldown-with-plus-content-custom.html", {
top: "48px",
bottom: "0px",
bounce: "vertical"
});
plus.webview.currentWebview().append(list);
// 实现列表可下拉刷新
list.addEventListener("dragBounce", onPullStateChange, false);
list.setBounce({
position: {
top: "100px"
},
changeoffset: {
top: "50px"
}
});
}
mui.plusReady(init);
// DOMContentLoaded事件处理
var etext = null,eicon = null;
document.addEventListener("DOMContentLoaded", function() {
etext = document.getElementById("text");
eicon = document.getElementById("icon");
}, false);
// 下拉状态改变
function onPullStateChange(e) {
switch (e.status) {
case "beforeChangeOffset": //下拉可刷新状态
pull1();
break;
case "afterChangeOffset": //松开可刷新状态
pull2();
break;
case "dragEndAfterChangeOffset": //正在刷新状态
list.evalJS("onRefresh();");
pull3();
break;
default:
break;
}
}
function pull1() {
etext.textContent = "下拉可刷新";
eicon.style.webkitTransition = "all 0.3s ease-in";
eicon.style.webkitTransform = "rotate(0deg)";
}
function pull2() {
etext.textContent = "释放立即刷新";
eicon.style.webkitTransition = "all 0.3s ease-in";
eicon.style.webkitTransform = "rotate(180deg)";
}
function pull3() {
etext.textContent = "正在刷新...";
eicon.src = "../images/pull_fresh.png";
eicon.style.webkitAnimation = "spin 1s infinite linear";
}
function pullReset() {
etext.textContent = "下拉可刷新";
eicon.src = "../images/pull_arrow.png";
eicon.style.webkitTransition = "";
eicon.style.webkitTransform = "";
eicon.style.webkitAnimation = "";
}
</script>
<style type="text/css">
#pull {
width: 24px;
height: 100%;
display: inline-block;
margin: 0 1em;
}
#icon {
height: 24px;
vertical-align: middle;
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
</style>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">自定义下拉刷新</h1>
</header>
<div class="mui-content">
<div style="text-align:center;height:44px;line-height:44px;">
<div id="pull">
<img id="icon" src="../images/pull_arrow.png" />
</div><font id="text">下拉可刷新</font>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pulldown.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">下拉刷新</h1>
</header>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 1
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 2
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 3
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 4
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 5
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 6
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 7
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 8
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 9
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 10
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 11
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 12
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 13
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 14
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 15
</a>
</li>
</ul>
</div>
</div>
<script>
mui.init({
swipeBack: false,
pullRefresh: {
container: '#pullrefresh',
down: {
callback: pulldownRefresh
}
}
});
/**
* 下拉刷新具体业务实现
*/
function pulldownRefresh() {
var self = this;
setTimeout(function() {
self.endPulldownToRefresh(); //refresh completed
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.insertBefore(li, table.firstElementChild);
}
}, 2000);
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pullrefresh-content.html
View file @ 2b5313c1
......@@ -12,18 +12,76 @@
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
html,
body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
var ws = null,wo = null;
mui.plusReady(function() {
// 获取自身窗口
ws = plus.webview.currentWebview();
wo = ws.opener();
});
mui.init({
swipeBack: false,
pullRefresh: {
container: '#pullrefresh',
down: {
callback: pulldownRefresh
},
up: {
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
// 刷新页面
function pulldownRefresh() {
var self = this;
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.insertBefore(li, table.firstChild);
}
if (mui.os.plus && mui.os.android) {
ws.endPullToRefresh();
wo.evalJS("pullReset()");
} else {
self.endPulldownToRefresh(); //refresh completed
}
}, 1000);
}
var count = 0;
/**
* 上拉加载具体业务实现
*/
function pullupRefresh() {
var self = this;
setTimeout(function() {
self.endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.appendChild(li);
}
}, 1000);
}
</script>
</head>
<body>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
......@@ -103,57 +161,8 @@
</li>
</ul>
</div>
</div>
<script>
mui.init({
swipeBack: false,
pullRefresh: {
container: '#pullrefresh',
down: {
callback: pulldownRefresh
},
up: {
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
/**
* 下拉刷新具体业务实现
*/
function pulldownRefresh() {
var self = this;
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
//下拉刷新，新纪录插到最前面；
table.insertBefore(li, table.firstChild);
}
self.endPulldownToRefresh(); //refresh completed
}, 1500);
}
var count = 0;
/**
* 上拉加载具体业务实现
*/
function pullupRefresh() {
var self = this;
setTimeout(function() {
self.endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.appendChild(li);
}
}, 1500);
}
</script>
</body>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pullrefresh-down-content.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<ul id='list' class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 6
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 5
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 4
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 3
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 2
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item 1
</a>
</li>
</ul>
</div>
</div>
<script>
mui.init({
pullRefresh: {
container: '#pullrefresh',
down: {
callback: pulldownRefresh
}
}
});
function pulldownRefresh() {
var self = this;
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 3; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.insertBefore(li, table.firstChild);
}
//refresh completed 这行代码必须调用
self.endPulldownToRefresh();
}, 1000);
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pullrefresh-down-main.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-back mui-pull-left"></a>
<h1 class="mui-title">下拉刷新</h1>
</header>
<script>
mui.init({
subpages : [{
id : 'pullrefresh-down-content',
url : 'pullrefresh-down-content.html',
styles : {
top : '48px',
bottom: "0px"
}
}]
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pullrefresh-main.html
View file @ 2b5313c1
......@@ -12,9 +12,31 @@
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
html,
body {
background-color: #efeff4;
}
#pull{
text-align: left;
}
/*#pull {
width: 24px;
height: 100%;
display: inline-block;
margin: 0 1em;
}
#icon {
height: 24px;
vertical-align: middle;
}*/
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
</style>
<script>
mui.init();
......@@ -22,23 +44,98 @@
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-back mui-pull-left"></a>
<h1 class="mui-title">下拉刷新、上拉加载</h1>
</header>
<script>
mui.init({
subpages : [{
id : 'pullrefresh-content',
url : 'pullrefresh-content.html',
styles : {
top : '48px',
bottom: "0px"
}
}]
<script type="text/javascript" charset="utf-8">
var list;
// 扩展API加载完毕，现在可以正常调用扩展API
function init() {
list = plus.webview.create("pullrefresh-content.html", "pullrefresh-content.html", {
top: "48px",
bottom: "0px",
bounce: "vertical"
});
</script>
</body>
plus.webview.currentWebview().append(list);
if (mui.os.plus && mui.os.android) {
// 实现列表可下拉刷新
list.addEventListener("dragBounce", onPullStateChange, false);
list.setBounce({
position: {
top: "100px"
},
changeoffset: {
top: "50px"
}
});
}
}
mui.plusReady(init);
// DOMContentLoaded事件处理
var etext = null,
eicon = null;
document.addEventListener("DOMContentLoaded", function() {
etext = document.getElementById("text");
eicon = document.getElementById("icon");
}, false);
// 下拉状态改变
function onPullStateChange(e) {
switch (e.status) {
case "beforeChangeOffset": //下拉可刷新状态
pull1();
break;
case "afterChangeOffset": //松开可刷新状态
pull2();
break;
case "dragEndAfterChangeOffset": //正在刷新状态
list.evalJS("pulldownRefresh();");
pull3();
break;
default:
break;
}
}
function pull1() {
etext.innerText = "下拉可以刷新";
eicon.className = 'mui-pull-loading mui-icon mui-icon-pulldown';
eicon.style.webkitTransition = "all 0.3s ease-in";
eicon.style.webkitTransform = "rotate(0deg)";
}
function pull2() {
etext.innerText = "释放立即刷新";
eicon.className = 'mui-pull-loading mui-icon mui-icon-pulldown';
eicon.style.webkitTransition = "all 0.3s ease-in";
eicon.style.webkitTransform = "rotate(180deg)";
}
function pull3() {
etext.innerText = "正在刷新...";
eicon.className = 'mui-pull-loading mui-icon mui-icon-spinner-cycle';
eicon.style.webkitAnimation = "spin 1s infinite linear";
}
function pullReset() {
etext.innerText = "下拉可刷新";
eicon.style.webkitTransition = "";
eicon.style.webkitTransform = "";
eicon.style.webkitAnimation = "";
}
</script>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">下拉刷新&上拉加载</h1>
</header>
<div class="mui-content">
<div class="mui-pull-top-pocket">
<div class="mui-pull">
<div id="icon" class="mui-pull-loading mui-icon mui-icon-pulldown"></div>
<div id="text" class="mui-pull-caption">下拉可以刷新</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/pullup.html deleted 100644 → 0
View file @ e2ec6bd3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<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-status-bar-style" content="black">
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,body {
background-color: #efeff4;
}
</style>
<script>
mui.init();
</script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">上拉加载</h1>
</header>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view mui-table-view-chevron">
</ul>
</div>
</div>
<script>
mui.init({
swipeBack: false,
pullRefresh: {
container: '#pullrefresh',
up: {
contentdown: '上拉显示更多',
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
var count = 0;
/**
* 上拉加载具体业务实现
*/
function pullupRefresh() {
var self = this;
setTimeout(function() {
self.endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i + 15; i < len; i++) {
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '<a class="mui-navigate-right">Item ' + (i + 1) + '</a>';
table.appendChild(li);
}
}, 600);
}
//页面初始化时，自动执行一次上拉加载
(function($) {
if ($.os.plus && $.os.android) {
$.ready(function() {
$.plusReady(function() {
$('#pullrefresh').pullRefresh().pullupLoading();
});
})
} else {
$.ready(function() {
$('#pullrefresh').pullRefresh().pullupLoading();
});
}
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/radio.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -57,5 +63,7 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/range.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -98,5 +104,7 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/scroll-native.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -250,6 +256,6 @@
</ul>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/scroll.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -75,4 +81,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/slider-default.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -98,6 +104,6 @@
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/slider-table-default.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -64,4 +70,5 @@
</style>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/slider-table-pagination.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -81,4 +87,5 @@
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/slider-with-title.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -22,12 +28,11 @@
</head>
<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>
<h1 class="mui-title">图片轮播</h1>
</header>
<div class="mui-content">
</header>
<div class="mui-content">
<ul class="mui-table-view mui-table-view-chevron">
<li id="switch" class="mui-table-view-cell">
定时轮播
......@@ -84,8 +89,8 @@
<div class="mui-indicator"></div>
</div>
</div>
</div>
<script>
</div>
<script>
var slider = mui("#slider");
document.getElementById("switch").addEventListener('toggle', function(e) {
if (e.detail.isActive) {
......@@ -98,6 +103,7 @@
});
}
});
</script>
</body>
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/speech.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -71,4 +77,5 @@
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/switches.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -25,7 +31,7 @@
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">开关（Toggles）</h1>
<h1 class="mui-title">开关（switch）</h1>
</header>
<div class="mui-content">
<div class="mui-content-padded">
......@@ -97,5 +103,7 @@
});
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-webview-main.html
View file @ 2b5313c1
......@@ -88,5 +88,7 @@
activeTab = targetTab;
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-webview-subpage-chat.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -36,5 +42,7 @@
mui.currentWebview.opener().evalJS("mui.back()");
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-webview-subpage-contact.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -36,5 +42,7 @@
mui.currentWebview.opener().evalJS("mui.back()");
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-webview-subpage-map.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -36,5 +42,7 @@
mui.currentWebview.opener().evalJS("mui.back()");
}
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-webview-subpage-phone.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -30,5 +36,7 @@
margin: 50% auto;
}
</style>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-with-segmented-control.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -139,5 +145,7 @@
});
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tab-with-viewpagerindicator.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -162,5 +168,7 @@
});
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tabbar-labels-only.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -41,5 +47,7 @@
查看地图
</a>
</nav>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tabbar-with-submenus.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -52,5 +58,7 @@
<li class="mui-table-view-cell"><a href="#">行业新闻</a></li>
</ul>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tabbar.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -65,5 +71,7 @@
<h3>查看地图</h3>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableview-image-left.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -75,5 +81,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableview-image-right.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -75,5 +81,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableview-with-images-and-chevrons.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -74,5 +80,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews-with-badges-and-chevrons.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -57,5 +63,7 @@
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews-with-badges.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -41,5 +47,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews-with-chevrons.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -53,5 +59,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews-with-collapses.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -67,5 +73,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews-with-swipe.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -33,36 +39,16 @@
.mui-table-view .mui-table-view-cell {
padding-right: 0;
}
.oa-task-cell.mui-table .mui-table-cell, .oa-contact-cell.mui-table .mui-table-cell {
.mui-table .mui-table-cell, .oa-contact-cell.mui-table .mui-table-cell {
padding: 11px 0;
vertical-align: middle;
}
.oa-task-cell, .oa-contact-cell {
.oa-contact-cell {
position: relative;
margin: -11px 0;
}
.oa-task-time {
width: 15%;
}
.oa-task-status {
width: 30%;
-webkit-transition: width .4s;
transition: width .4s;
}
.oa-task-time span, .oa-task-status, .oa-task-action {
text-align: center;
}
.oa-task-cell.mui-table .mui-table-cell.oa-task-content {
width: 55%;
padding-left: 15px;
}
.oa-task-time-start, .oa-task-time-end {
display: block;
width: 50px;
}
.oa-contact-avatar {
width: 75px;
}
......@@ -80,11 +66,12 @@
}
/*左拖，右拖，超出该区域宽度后，释放触发slideleft,slideright事件*/
/*重要：该样式定制拉出的功能图标区域的width(必须)*/
.oa-task-action {
background-color: #527fdc;
color: white;
.mui-slider-cell .mui-swipe-delete{
color: #fff;
background-color: #ff3b30;
text-align: center;
line-height: 44px;
width: 25%;
line-height: 64px;
}
/*左拖拉出，右拖关闭菜单*/
/*重要：该样式定制拉出的功能菜单区域的margin-left(必须,该值是功能菜单距离mui-slider-cell左侧的位置)*/
......@@ -105,6 +92,15 @@
width: 40%;
}
.mui-slider-handle.mui-table{
margin: -11px 0;
}
.mui-slider-handle .mui-table-cell{
line-height: 22px;
}
.mui-table-view-cell>.mui-slider-cell>.mui-slider-right {
top: 0px;
bottom: 0px;
......@@ -115,145 +111,93 @@
<h1 class="mui-title">滑动触发列表项菜单</h1>
</header>
<div class="mui-content">
<h5 class="mui-content-padded">拖拽(滑动)显示功能按钮，点击按钮触发事件</h5>
<ul id="OA_task_1" class="mui-table-view mui-table-view-striped mui-table-view-slider">
<h5 class="mui-content-padded" style="margin: 35px 10px 15px 10px;">拖拽(滑动)显示功能按钮，点击按钮触发事件</h5>
<ul id="OA_task_1" class="mui-table-view mui-table-view-slider">
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
<div class="mui-slider-right oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
<div class="mui-slider-right mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="mui-slider-handle oa-task-cell mui-table">
<div class="oa-task-time mui-table-cell">
<span class="oa-task-time-start">9:00</span><span class="oa-task-time-end mui-h6">10:00</span>
</div>
<div class="oa-task-content mui-table-cell">
<h4 class="mui-ellipsis">左拖(左滑)</h4>
<p class="mui-h6 mui-ellipsis">
一会议室
</p>
</div>
<div class="oa-task-status mui-table-cell">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-slider-handle mui-table">
<div class="mui-table-cell">
左滑显示删除按钮
</div>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
<div class="mui-slider-left oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
</div>
<div class="mui-slider-handle oa-task-cell mui-table">
<div class="oa-task-time mui-table-cell">
<span class="oa-task-time-start">9:00</span><span class="oa-task-time-end mui-h6">10:00</span>
</div>
<div class="oa-task-content mui-table-cell">
<h4 class="mui-ellipsis">右拖(右滑)</h4>
<p class="mui-h6 mui-ellipsis">
一会议室
</p>
<div class="mui-slider-left mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="oa-task-status mui-table-cell">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-slider-handle mui-table">
<div class="mui-table-cell">
右滑显示删除按钮
</div>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
<div class="mui-slider-left oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
</div>
<div class="mui-slider-right oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
<div class="mui-slider-left mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="mui-slider-handle oa-task-cell mui-table">
<div class="oa-task-time mui-table-cell">
<span class="oa-task-time-start">9:00</span><span class="oa-task-time-end mui-h6">10:00</span>
<div class="mui-slider-right mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="oa-task-content mui-table-cell">
<h4 class="mui-ellipsis">左右拖拽(滑动)</h4>
<p class="mui-h6 mui-ellipsis">
一会议室
</p>
</div>
<div class="oa-task-status mui-table-cell">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-slider-handle mui-table">
<div class="mui-table-cell">
左右滑动均可显示删除按钮
</div>
</div>
</div>
</li>
</ul>
<h5 class="mui-content-padded">拖拽显示功能图标，释放后还原，自动触发事件</h5>
<ul id="OA_task_2" class="mui-table-view mui-table-view-striped mui-table-view-slider">
<h5 class="mui-content-padded" style="margin: 15px 10px;">拖拽(滑动)显示操作图标，释放后还原，自动触发事件</h5>
<ul id="OA_task_2" class="mui-table-view mui-table-view-slider">
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
<div class="mui-slider-right mui-bounce oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
<div class="mui-slider-right mui-bounce mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="mui-slider-handle oa-task-cell mui-table">
<div class="oa-task-time mui-table-cell">
<span class="oa-task-time-start">9:00</span><span class="oa-task-time-end mui-h6">10:00</span>
</div>
<div class="oa-task-content mui-table-cell">
<h4 class="mui-ellipsis">左拖</h4>
<p class="mui-h6 mui-ellipsis">
一会议室
</p>
</div>
<div class="oa-task-status mui-table-cell">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-slider-handle mui-table">
<div class="mui-table-cell">
左滑自动触发删除
</div>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
<div class="mui-slider-left mui-bounce oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
</div>
<div class="mui-slider-handle oa-task-cell mui-table">
<div class="oa-task-time mui-table-cell">
<span class="oa-task-time-start">10:00</span><span class="oa-task-time-end mui-h6">10:30</span>
<div class="mui-slider-left mui-bounce mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="oa-task-content mui-table-cell">
<h4 class="mui-ellipsis">右拖</h4>
<p class="mui-h6 mui-ellipsis">
海淀区皂君庙乙2号院4号楼
</p>
</div>
<div class="oa-task-status mui-table-cell">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-slider-handle mui-table">
<div class="mui-table-cell">
右滑自动触发删除
</div>
</div>
</div>
</li>
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
<div class="mui-slider-left mui-bounce oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
</div>
<div class="mui-slider-right mui-bounce oa-task-action mui-table-cell mui-disabled">
<span class="mui-icon mui-icon-close"></span>
</div>
<div class="mui-slider-handle oa-task-cell mui-table">
<div class="oa-task-time mui-table-cell">
<span class="oa-task-time-start">9:00</span><span class="oa-task-time-end mui-h6">10:00</span>
<div class="mui-slider-left mui-bounce mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="oa-task-content mui-table-cell">
<h4 class="mui-ellipsis">左右拖拽</h4>
<p class="mui-h6 mui-ellipsis">
一会议室
</p>
<div class="mui-slider-right mui-bounce mui-table-cell mui-disabled mui-swipe-delete">
删除
</div>
<div class="oa-task-status mui-table-cell">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-slider-handle mui-table">
<div class="mui-table-cell">
左右滑动均可自动触发删除
</div>
</div>
</div>
</li>
</ul>
<h5 class="mui-content-padded">左拖拉出，右拖关闭功能菜单</h5>
<h5 class="mui-content-padded" style="margin: 15px 10px;">左拖拉出，右拖关闭功能菜单</h5>
<ul id="OA_contact" class="mui-table-view mui-table-view-striped mui-table-view-condensed">
<li class="mui-table-view-cell">
<div class="mui-slider-cell">
......@@ -328,11 +272,13 @@
</div>
<script>
(function($) {
var btnArray = ['确认','取消'];
$('#OA_task_1').on('tap', '.oa-task-action', function() {
//第一个demo，拖拽后显示操作图标，点击操作图标删除元素；
$('#OA_task_1').on('tap', '.mui-swipe-delete', function() {
var cell = this.parentNode.parentNode;
cell.parentNode.removeChild(cell);
});
var btnArray = ['确认','取消'];
//第二个demo，向左拖拽后显示操作图标，释放后自动触发的业务逻辑
$('#OA_task_2').on('slideleft', '.mui-table-view-cell', function(event) {
var elem = this;
mui.confirm('确认删除该条记录？','Hello MUI',btnArray,function(e){
......@@ -341,6 +287,7 @@
}
});
});
//第二个demo，向右拖拽后显示操作图标，释放后自动触发的业务逻辑
$('#OA_task_2').on('slideright', '.mui-table-view-cell', function(event) {
var elem = this;
mui.confirm('确认删除该条记录？','Hello MUI',btnArray,function(e){
......@@ -351,5 +298,7 @@
});
})(mui);
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews-with-switches.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -57,5 +63,7 @@
</ul>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/tableviews.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -47,5 +53,7 @@
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/template.html
View file @ 2b5313c1
......@@ -10,18 +10,59 @@
<link rel="stylesheet" href="../css/mui.min.css">
<script src="../js/mui.min.js"></script>
<script src="../js/app.js"></script>
<style>
html,
body {
background-color: #efeff4;
}
.mui-fadein {
/*-webkit-animation: fadein 0.1s;
animation: fadein 0.1s;*/
opacity: 1;
}
.mui-fadeout {
opacity: 0;
}
@keyframes fadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeout {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes fadeout {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a id="back" class="mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title"></h1>
<a id="back" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 id="title" class="mui-title"></h1>
</header>
<div class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
......@@ -30,12 +71,19 @@
</div>
</body>
<script>
mui.init({
swipeBack: false
});
document.getElementById("back").addEventListener('tap', function() {
plus.webview.currentWebview().hide('auto');
});
// var title = document.getElementById("title");
// var subWebview = null;
// document.getElementById("back").addEventListener('touchend', function() {
// plus.webview.currentWebview().hide('auto');
// setTimeout(function () {
// title.className = 'mui-title mui-fadeout';
// if(subWebview==null){
// subWebview = plus.webview.getWebviewById("template_sub");
// }
// subWebview.hide("none");
// },200);
//
// });
</script>
</html>
\ No newline at end of file
examples/hello-mui/examples/titlebar-with-buttons.html
View file @ 2b5313c1
......@@ -15,6 +15,9 @@
html,body {
background-color: #efeff4;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -40,5 +43,7 @@
mui.alert('你刚点了按钮');
});
</script>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/titlebar-with-icons.html
View file @ 2b5313c1
......@@ -15,6 +15,9 @@
html,body {
background-color: #efeff4;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -28,5 +31,7 @@
<a class="mui-icon mui-icon-bars mui-pull-right"></a>
<h1 class="mui-title">导航条包含图标</h1>
</header>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/titlebar-with-search.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -28,5 +34,7 @@
<input type="search" class="mui-pull-right" placeholder="search">
<h1 class="mui-title">带搜索框的导航栏</h1>
</header>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/titlebar-with-text-and-icons.html
View file @ 2b5313c1
......@@ -15,6 +15,9 @@
html,body {
background-color: #efeff4;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -40,5 +43,7 @@
</button>
<h1 class="mui-title">导航条同时包含文字和图标</h1>
</header>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/titlebar.html
View file @ 2b5313c1
......@@ -15,6 +15,9 @@
html,body {
background-color: #efeff4;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -27,5 +30,7 @@
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">导航栏</h1>
</header>
</body>
</html>
\ No newline at end of file
examples/hello-mui/examples/typography.html
View file @ 2b5313c1
......@@ -15,6 +15,12 @@
html,body {
background-color: #efeff4;
}
header.mui-bar{
display: none;
}
.mui-bar-nav~.mui-content{
padding: 0;
}
</style>
<script>
mui.init();
......@@ -45,5 +51,7 @@
</p>
</div>
</div>
</body>
</html>
\ No newline at end of file
examples/hello-mui/index.html
View file @ 2b5313c1
......@@ -31,8 +31,20 @@
}
}]
});
var subWebview=null,template=null;
document.getElementById('info').addEventListener('tap', function() {
mui.openWindow({url:'examples/info.html', id:'info'});
if(subWebview==null){
subWebview = plus.webview.getWebviewById("template_sub");
template = plus.webview.getWebviewById("demoTemplate");
}
// subWebview.hide();
subWebview.loadURL('examples/info.html');
var title = "关于";
template.evalJS("with(document.getElementById('title')){innerHTML='" + title + "';className='mui-title mui-fadein';};");
template.show('slide-in-right', 150);
});
mui.plusReady(function() {
......
examples/hello-mui/js/app.js
View file @ 2b5313c1
......@@ -4,6 +4,35 @@
optimize: true,
swipeBack: true
});
var back = $.back;
var templateWebview = null;
var subWebview = null;
var getTemplateWebview = function() {
if (templateWebview == null) {
templateWebview = plus.webview.getWebviewById("demoTemplate");
}
return templateWebview;
}
var getSubWebview = function() {
if (subWebview == null) {
subWebview = plus.webview.getWebviewById("template_sub");
}
return subWebview;
}
$.back = function() {
var current = plus.webview.currentWebview();
if (current.id === 'demoTemplate') { //模板主页面
getTemplateWebview().hide('auto');
setTimeout(function() {
document.getElementById("title").className = 'mui-title mui-fadeout';
getSubWebview().hide("none");
}, 200);
} else if (current.id === 'template_sub') {
getTemplateWebview().evalJS('mui.back();');
} else {
back();
}
}
})(mui);
/**
......
examples/hello-mui/js/mui.min.js
View file @ 2b5313c1
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/hello-mui/js/mui.tpl.js
View file @ 2b5313c1
/*!
* =====================================================
* Mui v0.6.0 (https://github.com/dcloudio/mui)
* Mui v0.7.0 (https://github.com/dcloudio/mui)
* =====================================================
*/
/*!
......
examples/hello-mui/js/mui.tpl.min.js
View file @ 2b5313c1
/*!
* =====================================================
* Mui v0.6.0 (https://github.com/dcloudio/mui)
* Mui v0.7.0 (https://github.com/dcloudio/mui)
* =====================================================
*/
!function(a,b){"function"==typeof define&&define.amd?define([],b):"object"==typeof exports?module.exports=b():a.Handlebars=a.Handlebars||b()}(this,function(){var a=function(){"use strict";function a(a){this.string=a}var b;return a.prototype.toString=function(){return""+this.string},b=a}(),b=function(a){"use strict";function b(a){return i[a]}function c(a){for(var b=1;b<arguments.length;b++)for(var c in arguments[b])Object.prototype.hasOwnProperty.call(arguments[b],c)&&(a[c]=arguments[b][c]);return a}function d(a){return a instanceof h?a.toString():null==a?"":a?(a=""+a,k.test(a)?a.replace(j,b):a):a+""}function e(a){return a||0===a?n(a)&&0===a.length?!0:!1:!0}function f(a,b){return(a?a+".":"")+b}var g={},h=a,i={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#x27;","`":"&#x60;"},j=/[&<>"'`]/g,k=/[&<>"'`]/;g.extend=c;var l=Object.prototype.toString;g.toString=l;var m=function(a){return"function"==typeof a};m(/x/)&&(m=function(a){return"function"==typeof a&&"[object Function]"===l.call(a)});var m;g.isFunction=m;var n=Array.isArray||function(a){return a&&"object"==typeof a?"[object Array]"===l.call(a):!1};return g.isArray=n,g.escapeExpression=d,g.isEmpty=e,g.appendContextPath=f,g}(a),c=function(){"use strict";function a(a,b){var d;b&&b.firstLine&&(d=b.firstLine,a+=" - "+d+":"+b.firstColumn);for(var e=Error.prototype.constructor.call(this,a),f=0;f<c.length;f++)this[c[f]]=e[c[f]];d&&(this.lineNumber=d,this.column=b.firstColumn)}var b,c=["description","fileName","lineNumber","message","name","number","stack"];return a.prototype=new Error,b=a}(),d=function(a,b){"use strict";function c(a,b){this.helpers=a||{},this.partials=b||{},d(this)}function d(a){a.registerHelper("helperMissing",function(){if(1===arguments.length)return void 0;throw new g("Missing helper: '"+arguments[arguments.length-1].name+"'")}),a.registerHelper("blockHelperMissing",function(b,c){var d=c.inverse,e=c.fn;if(b===!0)return e(this);if(b===!1||null==b)return d(this);if(k(b))return b.length>0?(c.ids&&(c.ids=[c.name]),a.helpers.each(b,c)):d(this);if(c.data&&c.ids){var g=q(c.data);g.contextPath=f.appendContextPath(c.data.contextPath,c.name),c={data:g}}return e(b,c)}),a.registerHelper("each",function(a,b){if(!b)throw new g("Must pass iterator to #each");var c,d,e=b.fn,h=b.inverse,i=0,j="";if(b.data&&b.ids&&(d=f.appendContextPath(b.data.contextPath,b.ids[0])+"."),l(a)&&(a=a.call(this)),b.data&&(c=q(b.data)),a&&"object"==typeof a)if(k(a))for(var m=a.length;m>i;i++)c&&(c.index=i,c.first=0===i,c.last=i===a.length-1,d&&(c.contextPath=d+i)),j+=e(a[i],{data:c});else for(var n in a)a.hasOwnProperty(n)&&(c&&(c.key=n,c.index=i,c.first=0===i,d&&(c.contextPath=d+n)),j+=e(a[n],{data:c}),i++);return 0===i&&(j=h(this)),j}),a.registerHelper("if",function(a,b){return l(a)&&(a=a.call(this)),!b.hash.includeZero&&!a||f.isEmpty(a)?b.inverse(this):b.fn(this)}),a.registerHelper("unless",function(b,c){return a.helpers["if"].call(this,b,{fn:c.inverse,inverse:c.fn,hash:c.hash})}),a.registerHelper("with",function(a,b){l(a)&&(a=a.call(this));var c=b.fn;if(f.isEmpty(a))return b.inverse(this);if(b.data&&b.ids){var d=q(b.data);d.contextPath=f.appendContextPath(b.data.contextPath,b.ids[0]),b={data:d}}return c(a,b)}),a.registerHelper("log",function(b,c){var d=c.data&&null!=c.data.level?parseInt(c.data.level,10):1;a.log(d,b)}),a.registerHelper("lookup",function(a,b){return a&&a[b]})}var e={},f=a,g=b,h="2.0.0";e.VERSION=h;var i=6;e.COMPILER_REVISION=i;var j={1:"<= 1.0.rc.2",2:"== 1.0.0-rc.3",3:"== 1.0.0-rc.4",4:"== 1.x.x",5:"== 2.0.0-alpha.x",6:">= 2.0.0-beta.1"};e.REVISION_CHANGES=j;var k=f.isArray,l=f.isFunction,m=f.toString,n="[object Object]";e.HandlebarsEnvironment=c,c.prototype={constructor:c,logger:o,log:p,registerHelper:function(a,b){if(m.call(a)===n){if(b)throw new g("Arg not supported with multiple helpers");f.extend(this.helpers,a)}else this.helpers[a]=b},unregisterHelper:function(a){delete this.helpers[a]},registerPartial:function(a,b){m.call(a)===n?f.extend(this.partials,a):this.partials[a]=b},unregisterPartial:function(a){delete this.partials[a]}};var o={methodMap:{0:"debug",1:"info",2:"warn",3:"error"},DEBUG:0,INFO:1,WARN:2,ERROR:3,level:3,log:function(a,b){if(o.level<=a){var c=o.methodMap[a];"undefined"!=typeof console&&console[c]&&console[c].call(console,b)}}};e.logger=o;var p=o.log;e.log=p;var q=function(a){var b=f.extend({},a);return b._parent=a,b};return e.createFrame=q,e}(b,c),e=function(a,b,c){"use strict";function d(a){var b=a&&a[0]||1,c=m;if(b!==c){if(c>b){var d=n[c],e=n[b];throw new l("Template was precompiled with an older version of Handlebars than the current runtime. Please update your precompiler to a newer version ("+d+") or downgrade your runtime to an older version ("+e+").")}throw new l("Template was precompiled with a newer version of Handlebars than the current runtime. Please update your runtime to a newer version ("+a[1]+").")}}function e(a,b){if(!b)throw new l("No environment passed to template");if(!a||!a.main)throw new l("Unknown template object: "+typeof a);b.VM.checkRevision(a.compiler);var c=function(c,d,e,f,g,h,i,j,m){g&&(f=k.extend({},f,g));var n=b.VM.invokePartial.call(this,c,e,f,h,i,j,m);if(null==n&&b.compile){var o={helpers:h,partials:i,data:j,depths:m};i[e]=b.compile(c,{data:void 0!==j,compat:a.compat},b),n=i[e](f,o)}if(null!=n){if(d){for(var p=n.split("\n"),q=0,r=p.length;r>q&&(p[q]||q+1!==r);q++)p[q]=d+p[q];n=p.join("\n")}return n}throw new l("The partial "+e+" could not be compiled when running in runtime-only mode")},d={lookup:function(a,b){for(var c=a.length,d=0;c>d;d++)if(a[d]&&null!=a[d][b])return a[d][b]},lambda:function(a,b){return"function"==typeof a?a.call(b):a},escapeExpression:k.escapeExpression,invokePartial:c,fn:function(b){return a[b]},programs:[],program:function(a,b,c){var d=this.programs[a],e=this.fn(a);return b||c?d=f(this,a,e,b,c):d||(d=this.programs[a]=f(this,a,e)),d},data:function(a,b){for(;a&&b--;)a=a._parent;return a},merge:function(a,b){var c=a||b;return a&&b&&a!==b&&(c=k.extend({},b,a)),c},noop:b.VM.noop,compilerInfo:a.compiler},e=function(b,c){c=c||{};var f=c.data;e._setup(c),!c.partial&&a.useData&&(f=i(b,f));var g;return a.useDepths&&(g=c.depths?[b].concat(c.depths):[b]),a.main.call(d,b,d.helpers,d.partials,f,g)};return e.isTop=!0,e._setup=function(c){c.partial?(d.helpers=c.helpers,d.partials=c.partials):(d.helpers=d.merge(c.helpers,b.helpers),a.usePartial&&(d.partials=d.merge(c.partials,b.partials)))},e._child=function(b,c,e){if(a.useDepths&&!e)throw new l("must pass parent depths");return f(d,b,a[b],c,e)},e}function f(a,b,c,d,e){var f=function(b,f){return f=f||{},c.call(a,b,a.helpers,a.partials,f.data||d,e&&[b].concat(e))};return f.program=b,f.depth=e?e.length:0,f}function g(a,b,c,d,e,f,g){var h={partial:!0,helpers:d,partials:e,data:f,depths:g};if(void 0===a)throw new l("The partial "+b+" could not be found");return a instanceof Function?a(c,h):void 0}function h(){return""}function i(a,b){return b&&"root"in b||(b=b?o(b):{},b.root=a),b}var j={},k=a,l=b,m=c.COMPILER_REVISION,n=c.REVISION_CHANGES,o=c.createFrame;return j.checkRevision=d,j.template=e,j.program=f,j.invokePartial=g,j.noop=h,j}(b,c,d),f=function(a,b,c,d,e){"use strict";var f,g=a,h=b,i=c,j=d,k=e,l=function(){var a=new g.HandlebarsEnvironment;return j.extend(a,g),a.SafeString=h,a.Exception=i,a.Utils=j,a.escapeExpression=j.escapeExpression,a.VM=k,a.template=function(b){return k.template(b,a)},a},m=l();return m.create=l,m["default"]=m,f=m}(d,a,c,b,e),g=function(a){"use strict";function b(a){a=a||{},this.firstLine=a.first_line,this.firstColumn=a.first_column,this.lastColumn=a.last_column,this.lastLine=a.last_line}var c,d=a,e={ProgramNode:function(a,c,d){b.call(this,d),this.type="program",this.statements=a,this.strip=c},MustacheNode:function(a,c,d,f,g){if(b.call(this,g),this.type="mustache",this.strip=f,null!=d&&d.charAt){var h=d.charAt(3)||d.charAt(2);this.escaped="{"!==h&&"&"!==h}else this.escaped=!!d;this.sexpr=a instanceof e.SexprNode?a:new e.SexprNode(a,c),this.id=this.sexpr.id,this.params=this.sexpr.params,this.hash=this.sexpr.hash,this.eligibleHelper=this.sexpr.eligibleHelper,this.isHelper=this.sexpr.isHelper},SexprNode:function(a,c,d){b.call(this,d),this.type="sexpr",this.hash=c;var e=this.id=a[0],f=this.params=a.slice(1);this.isHelper=!(!f.length&&!c),this.eligibleHelper=this.isHelper||e.isSimple},PartialNode:function(a,c,d,e,f){b.call(this,f),this.type="partial",this.partialName=a,this.context=c,this.hash=d,this.strip=e,this.strip.inlineStandalone=!0},BlockNode:function(a,c,d,e,f){b.call(this,f),this.type="block",this.mustache=a,this.program=c,this.inverse=d,this.strip=e,d&&!c&&(this.isInverse=!0)},RawBlockNode:function(a,c,f,g){if(b.call(this,g),a.sexpr.id.original!==f)throw new d(a.sexpr.id.original+" doesn't match "+f,this);c=new e.ContentNode(c,g),this.type="block",this.mustache=a,this.program=new e.ProgramNode([c],{},g)},ContentNode:function(a,c){b.call(this,c),this.type="content",this.original=this.string=a},HashNode:function(a,c){b.call(this,c),this.type="hash",this.pairs=a},IdNode:function(a,c){b.call(this,c),this.type="ID";for(var e="",f=[],g=0,h="",i=0,j=a.length;j>i;i++){var k=a[i].part;if(e+=(a[i].separator||"")+k,".."===k||"."===k||"this"===k){if(f.length>0)throw new d("Invalid path: "+e,this);".."===k?(g++,h+="../"):this.isScoped=!0}else f.push(k)}this.original=e,this.parts=f,this.string=f.join("."),this.depth=g,this.idName=h+this.string,this.isSimple=1===a.length&&!this.isScoped&&0===g,this.stringModeValue=this.string},PartialNameNode:function(a,c){b.call(this,c),this.type="PARTIAL_NAME",this.name=a.original},DataNode:function(a,c){b.call(this,c),this.type="DATA",this.id=a,this.stringModeValue=a.stringModeValue,this.idName="@"+a.stringModeValue},StringNode:function(a,c){b.call(this,c),this.type="STRING",this.original=this.string=this.stringModeValue=a},NumberNode:function(a,c){b.call(this,c),this.type="NUMBER",this.original=this.number=a,this.stringModeValue=Number(a)},BooleanNode:function(a,c){b.call(this,c),this.type="BOOLEAN",this.bool=a,this.stringModeValue="true"===a},CommentNode:function(a,c){b.call(this,c),this.type="comment",this.comment=a,this.strip={inlineStandalone:!0}}};return c=e}(c),h=function(){"use strict";var a,b=function(){function a(){this.yy={}}var b={trace:function(){},yy:{},symbols_:{error:2,root:3,program:4,EOF:5,program_repetition0:6,statement:7,mustache:8,block:9,rawBlock:10,partial:11,CONTENT:12,COMMENT:13,openRawBlock:14,END_RAW_BLOCK:15,OPEN_RAW_BLOCK:16,sexpr:17,CLOSE_RAW_BLOCK:18,openBlock:19,block_option0:20,closeBlock:21,openInverse:22,block_option1:23,OPEN_BLOCK:24,CLOSE:25,OPEN_INVERSE:26,inverseAndProgram:27,INVERSE:28,OPEN_ENDBLOCK:29,path:30,OPEN:31,OPEN_UNESCAPED:32,CLOSE_UNESCAPED:33,OPEN_PARTIAL:34,partialName:35,param:36,partial_option0:37,partial_option1:38,sexpr_repetition0:39,sexpr_option0:40,dataName:41,STRING:42,NUMBER:43,BOOLEAN:44,OPEN_SEXPR:45,CLOSE_SEXPR:46,hash:47,hash_repetition_plus0:48,hashSegment:49,ID:50,EQUALS:51,DATA:52,pathSegments:53,SEP:54,$accept:0,$end:1},terminals_:{2:"error",5:"EOF",12:"CONTENT",13:"COMMENT",15:"END_RAW_BLOCK",16:"OPEN_RAW_BLOCK",18:"CLOSE_RAW_BLOCK",24:"OPEN_BLOCK",25:"CLOSE",26:"OPEN_INVERSE",28:"INVERSE",29:"OPEN_ENDBLOCK",31:"OPEN",32:"OPEN_UNESCAPED",33:"CLOSE_UNESCAPED",34:"OPEN_PARTIAL",42:"STRING",43:"NUMBER",44:"BOOLEAN",45:"OPEN_SEXPR",46:"CLOSE_SEXPR",50:"ID",51:"EQUALS",52:"DATA",54:"SEP"},productions_:[0,[3,2],[4,1],[7,1],[7,1],[7,1],[7,1],[7,1],[7,1],[10,3],[14,3],[9,4],[9,4],[19,3],[22,3],[27,2],[21,3],[8,3],[8,3],[11,5],[11,4],[17,3],[17,1],[36,1],[36,1],[36,1],[36,1],[36,1],[36,3],[47,1],[49,3],[35,1],[35,1],[35,1],[41,2],[30,1],[53,3],[53,1],[6,0],[6,2],[20,0],[20,1],[23,0],[23,1],[37,0],[37,1],[38,0],[38,1],[39,0],[39,2],[40,0],[40,1],[48,1],[48,2]],performAction:function(a,b,c,d,e,f){var g=f.length-1;switch(e){case 1:return d.prepareProgram(f[g-1].statements,!0),f[g-1];case 2:this.$=new d.ProgramNode(d.prepareProgram(f[g]),{},this._$);break;case 3:this.$=f[g];break;case 4:this.$=f[g];break;case 5:this.$=f[g];break;case 6:this.$=f[g];break;case 7:this.$=new d.ContentNode(f[g],this._$);break;case 8:this.$=new d.CommentNode(f[g],this._$);break;case 9:this.$=new d.RawBlockNode(f[g-2],f[g-1],f[g],this._$);break;case 10:this.$=new d.MustacheNode(f[g-1],null,"","",this._$);break;case 11:this.$=d.prepareBlock(f[g-3],f[g-2],f[g-1],f[g],!1,this._$);break;case 12:this.$=d.prepareBlock(f[g-3],f[g-2],f[g-1],f[g],!0,this._$);break;case 13:this.$=new d.MustacheNode(f[g-1],null,f[g-2],d.stripFlags(f[g-2],f[g]),this._$);break;case 14:this.$=new d.MustacheNode(f[g-1],null,f[g-2],d.stripFlags(f[g-2],f[g]),this._$);break;case 15:this.$={strip:d.stripFlags(f[g-1],f[g-1]),program:f[g]};break;case 16:this.$={path:f[g-1],strip:d.stripFlags(f[g-2],f[g])};break;case 17:this.$=new d.MustacheNode(f[g-1],null,f[g-2],d.stripFlags(f[g-2],f[g]),this._$);break;case 18:this.$=new d.MustacheNode(f[g-1],null,f[g-2],d.stripFlags(f[g-2],f[g]),this._$);break;case 19:this.$=new d.PartialNode(f[g-3],f[g-2],f[g-1],d.stripFlags(f[g-4],f[g]),this._$);break;case 20:this.$=new d.PartialNode(f[g-2],void 0,f[g-1],d.stripFlags(f[g-3],f[g]),this._$);break;case 21:this.$=new d.SexprNode([f[g-2]].concat(f[g-1]),f[g],this._$);break;case 22:this.$=new d.SexprNode([f[g]],null,this._$);break;case 23:this.$=f[g];break;case 24:this.$=new d.StringNode(f[g],this._$);break;case 25:this.$=new d.NumberNode(f[g],this._$);break;case 26:this.$=new d.BooleanNode(f[g],this._$);break;case 27:this.$=f[g];break;case 28:f[g-1].isHelper=!0,this.$=f[g-1];break;case 29:this.$=new d.HashNode(f[g],this._$);break;case 30:this.$=[f[g-2],f[g]];break;case 31:this.$=new d.PartialNameNode(f[g],this._$);break;case 32:this.$=new d.PartialNameNode(new d.StringNode(f[g],this._$),this._$);break;case 33:this.$=new d.PartialNameNode(new d.NumberNode(f[g],this._$));break;case 34:this.$=new d.DataNode(f[g],this._$);break;case 35:this.$=new d.IdNode(f[g],this._$);break;case 36:f[g-2].push({part:f[g],separator:f[g-1]}),this.$=f[g-2];break;case 37:this.$=[{part:f[g]}];break;case 38:this.$=[];break;case 39:f[g-1].push(f[g]);break;case 48:this.$=[];break;case 49:f[g-1].push(f[g]);break;case 52:this.$=[f[g]];break;case 53:f[g-1].push(f[g])}},table:[{3:1,4:2,5:[2,38],6:3,12:[2,38],13:[2,38],16:[2,38],24:[2,38],26:[2,38],31:[2,38],32:[2,38],34:[2,38]},{1:[3]},{5:[1,4]},{5:[2,2],7:5,8:6,9:7,10:8,11:9,12:[1,10],13:[1,11],14:16,16:[1,20],19:14,22:15,24:[1,18],26:[1,19],28:[2,2],29:[2,2],31:[1,12],32:[1,13],34:[1,17]},{1:[2,1]},{5:[2,39],12:[2,39],13:[2,39],16:[2,39],24:[2,39],26:[2,39],28:[2,39],29:[2,39],31:[2,39],32:[2,39],34:[2,39]},{5:[2,3],12:[2,3],13:[2,3],16:[2,3],24:[2,3],26:[2,3],28:[2,3],29:[2,3],31:[2,3],32:[2,3],34:[2,3]},{5:[2,4],12:[2,4],13:[2,4],16:[2,4],24:[2,4],26:[2,4],28:[2,4],29:[2,4],31:[2,4],32:[2,4],34:[2,4]},{5:[2,5],12:[2,5],13:[2,5],16:[2,5],24:[2,5],26:[2,5],28:[2,5],29:[2,5],31:[2,5],32:[2,5],34:[2,5]},{5:[2,6],12:[2,6],13:[2,6],16:[2,6],24:[2,6],26:[2,6],28:[2,6],29:[2,6],31:[2,6],32:[2,6],34:[2,6]},{5:[2,7],12:[2,7],13:[2,7],16:[2,7],24:[2,7],26:[2,7],28:[2,7],29:[2,7],31:[2,7],32:[2,7],34:[2,7]},{5:[2,8],12:[2,8],13:[2,8],16:[2,8],24:[2,8],26:[2,8],28:[2,8],29:[2,8],31:[2,8],32:[2,8],34:[2,8]},{17:21,30:22,41:23,50:[1,26],52:[1,25],53:24},{17:27,30:22,41:23,50:[1,26],52:[1,25],53:24},{4:28,6:3,12:[2,38],13:[2,38],16:[2,38],24:[2,38],26:[2,38],28:[2,38],29:[2,38],31:[2,38],32:[2,38],34:[2,38]},{4:29,6:3,12:[2,38],13:[2,38],16:[2,38],24:[2,38],26:[2,38],28:[2,38],29:[2,38],31:[2,38],32:[2,38],34:[2,38]},{12:[1,30]},{30:32,35:31,42:[1,33],43:[1,34],50:[1,26],53:24},{17:35,30:22,41:23,50:[1,26],52:[1,25],53:24},{17:36,30:22,41:23,50:[1,26],52:[1,25],53:24},{17:37,30:22,41:23,50:[1,26],52:[1,25],53:24},{25:[1,38]},{18:[2,48],25:[2,48],33:[2,48],39:39,42:[2,48],43:[2,48],44:[2,48],45:[2,48],46:[2,48],50:[2,48],52:[2,48]},{18:[2,22],25:[2,22],33:[2,22],46:[2,22]},{18:[2,35],25:[2,35],33:[2,35],42:[2,35],43:[2,35],44:[2,35],45:[2,35],46:[2,35],50:[2,35],52:[2,35],54:[1,40]},{30:41,50:[1,26],53:24},{18:[2,37],25:[2,37],33:[2,37],42:[2,37],43:[2,37],44:[2,37],45:[2,37],46:[2,37],50:[2,37],52:[2,37],54:[2,37]},{33:[1,42]},{20:43,27:44,28:[1,45],29:[2,40]},{23:46,27:47,28:[1,45],29:[2,42]},{15:[1,48]},{25:[2,46],30:51,36:49,38:50,41:55,42:[1,52],43:[1,53],44:[1,54],45:[1,56],47:57,48:58,49:60,50:[1,59],52:[1,25],53:24},{25:[2,31],42:[2,31],43:[2,31],44:[2,31],45:[2,31],50:[2,31],52:[2,31]},{25:[2,32],42:[2,32],43:[2,32],44:[2,32],45:[2,32],50:[2,32],52:[2,32]},{25:[2,33],42:[2,33],43:[2,33],44:[2,33],45:[2,33],50:[2,33],52:[2,33]},{25:[1,61]},{25:[1,62]},{18:[1,63]},{5:[2,17],12:[2,17],13:[2,17],16:[2,17],24:[2,17],26:[2,17],28:[2,17],29:[2,17],31:[2,17],32:[2,17],34:[2,17]},{18:[2,50],25:[2,50],30:51,33:[2,50],36:65,40:64,41:55,42:[1,52],43:[1,53],44:[1,54],45:[1,56],46:[2,50],47:66,48:58,49:60,50:[1,59],52:[1,25],53:24},{50:[1,67]},{18:[2,34],25:[2,34],33:[2,34],42:[2,34],43:[2,34],44:[2,34],45:[2,34],46:[2,34],50:[2,34],52:[2,34]},{5:[2,18],12:[2,18],13:[2,18],16:[2,18],24:[2,18],26:[2,18],28:[2,18],29:[2,18],31:[2,18],32:[2,18],34:[2,18]},{21:68,29:[1,69]},{29:[2,41]},{4:70,6:3,12:[2,38],13:[2,38],16:[2,38],24:[2,38],26:[2,38],29:[2,38],31:[2,38],32:[2,38],34:[2,38]},{21:71,29:[1,69]},{29:[2,43]},{5:[2,9],12:[2,9],13:[2,9],16:[2,9],24:[2,9],26:[2,9],28:[2,9],29:[2,9],31:[2,9],32:[2,9],34:[2,9]},{25:[2,44],37:72,47:73,48:58,49:60,50:[1,74]},{25:[1,75]},{18:[2,23],25:[2,23],33:[2,23],42:[2,23],43:[2,23],44:[2,23],45:[2,23],46:[2,23],50:[2,23],52:[2,23]},{18:[2,24],25:[2,24],33:[2,24],42:[2,24],43:[2,24],44:[2,24],45:[2,24],46:[2,24],50:[2,24],52:[2,24]},{18:[2,25],25:[2,25],33:[2,25],42:[2,25],43:[2,25],44:[2,25],45:[2,25],46:[2,25],50:[2,25],52:[2,25]},{18:[2,26],25:[2,26],33:[2,26],42:[2,26],43:[2,26],44:[2,26],45:[2,26],46:[2,26],50:[2,26],52:[2,26]},{18:[2,27],25:[2,27],33:[2,27],42:[2,27],43:[2,27],44:[2,27],45:[2,27],46:[2,27],50:[2,27],52:[2,27]},{17:76,30:22,41:23,50:[1,26],52:[1,25],53:24},{25:[2,47]},{18:[2,29],25:[2,29],33:[2,29],46:[2,29],49:77,50:[1,74]},{18:[2,37],25:[2,37],33:[2,37],42:[2,37],43:[2,37],44:[2,37],45:[2,37],46:[2,37],50:[2,37],51:[1,78],52:[2,37],54:[2,37]},{18:[2,52],25:[2,52],33:[2,52],46:[2,52],50:[2,52]},{12:[2,13],13:[2,13],16:[2,13],24:[2,13],26:[2,13],28:[2,13],29:[2,13],31:[2,13],32:[2,13],34:[2,13]},{12:[2,14],13:[2,14],16:[2,14],24:[2,14],26:[2,14],28:[2,14],29:[2,14],31:[2,14],32:[2,14],34:[2,14]},{12:[2,10]},{18:[2,21],25:[2,21],33:[2,21],46:[2,21]},{18:[2,49],25:[2,49],33:[2,49],42:[2,49],43:[2,49],44:[2,49],45:[2,49],46:[2,49],50:[2,49],52:[2,49]},{18:[2,51],25:[2,51],33:[2,51],46:[2,51]},{18:[2,36],25:[2,36],33:[2,36],42:[2,36],43:[2,36],44:[2,36],45:[2,36],46:[2,36],50:[2,36],52:[2,36],54:[2,36]},{5:[2,11],12:[2,11],13:[2,11],16:[2,11],24:[2,11],26:[2,11],28:[2,11],29:[2,11],31:[2,11],32:[2,11],34:[2,11]},{30:79,50:[1,26],53:24},{29:[2,15]},{5:[2,12],12:[2,12],13:[2,12],16:[2,12],24:[2,12],26:[2,12],28:[2,12],29:[2,12],31:[2,12],32:[2,12],34:[2,12]},{25:[1,80]},{25:[2,45]},{51:[1,78]},{5:[2,20],12:[2,20],13:[2,20],16:[2,20],24:[2,20],26:[2,20],28:[2,20],29:[2,20],31:[2,20],32:[2,20],34:[2,20]},{46:[1,81]},{18:[2,53],25:[2,53],33:[2,53],46:[2,53],50:[2,53]},{30:51,36:82,41:55,42:[1,52],43:[1,53],44:[1,54],45:[1,56],50:[1,26],52:[1,25],53:24},{25:[1,83]},{5:[2,19],12:[2,19],13:[2,19],16:[2,19],24:[2,19],26:[2,19],28:[2,19],29:[2,19],31:[2,19],32:[2,19],34:[2,19]},{18:[2,28],25:[2,28],33:[2,28],42:[2,28],43:[2,28],44:[2,28],45:[2,28],46:[2,28],50:[2,28],52:[2,28]},{18:[2,30],25:[2,30],33:[2,30],46:[2,30],50:[2,30]},{5:[2,16],12:[2,16],13:[2,16],16:[2,16],24:[2,16],26:[2,16],28:[2,16],29:[2,16],31:[2,16],32:[2,16],34:[2,16]}],defaultActions:{4:[2,1],44:[2,41],47:[2,43],57:[2,47],63:[2,10],70:[2,15],73:[2,45]},parseError:function(a){throw new Error(a)},parse:function(a){function b(){var a;return a=c.lexer.lex()||1,"number"!=typeof a&&(a=c.symbols_[a]||a),a}var c=this,d=[0],e=[null],f=[],g=this.table,h="",i=0,j=0,k=0;this.lexer.setInput(a),this.lexer.yy=this.yy,this.yy.lexer=this.lexer,this.yy.parser=this,"undefined"==typeof this.lexer.yylloc&&(this.lexer.yylloc={});var l=this.lexer.yylloc;f.push(l);var m=this.lexer.options&&this.lexer.options.ranges;"function"==typeof this.yy.parseError&&(this.parseError=this.yy.parseError);for(var n,o,p,q,r,s,t,u,v,w={};;){if(p=d[d.length-1],this.defaultActions[p]?q=this.defaultActions[p]:((null===n||"undefined"==typeof n)&&(n=b()),q=g[p]&&g[p][n]),"undefined"==typeof q||!q.length||!q[0]){var x="";if(!k){v=[];for(s in g[p])this.terminals_[s]&&s>2&&v.push("'"+this.terminals_[s]+"'");x=this.lexer.showPosition?"Parse error on line "+(i+1)+":\n"+this.lexer.showPosition()+"\nExpecting "+v.join(", ")+", got '"+(this.terminals_[n]||n)+"'":"Parse error on line "+(i+1)+": Unexpected "+(1==n?"end of input":"'"+(this.terminals_[n]||n)+"'"),this.parseError(x,{text:this.lexer.match,token:this.terminals_[n]||n,line:this.lexer.yylineno,loc:l,expected:v})}}if(q[0]instanceof Array&&q.length>1)throw new Error("Parse Error: multiple actions possible at state: "+p+", token: "+n);switch(q[0]){case 1:d.push(n),e.push(this.lexer.yytext),f.push(this.lexer.yylloc),d.push(q[1]),n=null,o?(n=o,o=null):(j=this.lexer.yyleng,h=this.lexer.yytext,i=this.lexer.yylineno,l=this.lexer.yylloc,k>0&&k--);break;case 2:if(t=this.productions_[q[1]][1],w.$=e[e.length-t],w._$={first_line:f[f.length-(t||1)].first_line,last_line:f[f.length-1].last_line,first_column:f[f.length-(t||1)].first_column,last_column:f[f.length-1].last_column},m&&(w._$.range=[f[f.length-(t||1)].range[0],f[f.length-1].range[1]]),r=this.performAction.call(w,h,j,i,this.yy,q[1],e,f),"undefined"!=typeof r)return r;t&&(d=d.slice(0,-1*t*2),e=e.slice(0,-1*t),f=f.slice(0,-1*t)),d.push(this.productions_[q[1]][0]),e.push(w.$),f.push(w._$),u=g[d[d.length-2]][d[d.length-1]],d.push(u);break;case 3:return!0}}return!0}},c=function(){var a={EOF:1,parseError:function(a,b){if(!this.yy.parser)throw new Error(a);this.yy.parser.parseError(a,b)},setInput:function(a){return this._input=a,this._more=this._less=this.done=!1,this.yylineno=this.yyleng=0,this.yytext=this.matched=this.match="",this.conditionStack=["INITIAL"],this.yylloc={first_line:1,first_column:0,last_line:1,last_column:0},this.options.ranges&&(this.yylloc.range=[0,0]),this.offset=0,this},input:function(){var a=this._input[0];this.yytext+=a,this.yyleng++,this.offset++,this.match+=a,this.matched+=a;var b=a.match(/(?:\r\n?|\n).*/g);return b?(this.yylineno++,this.yylloc.last_line++):this.yylloc.last_column++,this.options.ranges&&this.yylloc.range[1]++,this._input=this._input.slice(1),a},unput:function(a){var b=a.length,c=a.split(/(?:\r\n?|\n)/g);this._input=a+this._input,this.yytext=this.yytext.substr(0,this.yytext.length-b-1),this.offset-=b;var d=this.match.split(/(?:\r\n?|\n)/g);this.match=this.match.substr(0,this.match.length-1),this.matched=this.matched.substr(0,this.matched.length-1),c.length-1&&(this.yylineno-=c.length-1);var e=this.yylloc.range;return this.yylloc={first_line:this.yylloc.first_line,last_line:this.yylineno+1,first_column:this.yylloc.first_column,last_column:c?(c.length===d.length?this.yylloc.first_column:0)+d[d.length-c.length].length-c[0].length:this.yylloc.first_column-b},this.options.ranges&&(this.yylloc.range=[e[0],e[0]+this.yyleng-b]),this},more:function(){return this._more=!0,this},less:function(a){this.unput(this.match.slice(a))},pastInput:function(){var a=this.matched.substr(0,this.matched.length-this.match.length);return(a.length>20?"...":"")+a.substr(-20).replace(/\n/g,"")},upcomingInput:function(){var a=this.match;return a.length<20&&(a+=this._input.substr(0,20-a.length)),(a.substr(0,20)+(a.length>20?"...":"")).replace(/\n/g,"")},showPosition:function(){var a=this.pastInput(),b=new Array(a.length+1).join("-");return a+this.upcomingInput()+"\n"+b+"^"},next:function(){if(this.done)return this.EOF;this._input||(this.done=!0);var a,b,c,d,e;this._more||(this.yytext="",this.match="");for(var f=this._currentRules(),g=0;g<f.length&&(c=this._input.match(this.rules[f[g]]),!c||b&&!(c[0].length>b[0].length)||(b=c,d=g,this.options.flex));g++);return b?(e=b[0].match(/(?:\r\n?|\n).*/g),e&&(this.yylineno+=e.length),this.yylloc={first_line:this.yylloc.last_line,last_line:this.yylineno+1,first_column:this.yylloc.last_column,last_column:e?e[e.length-1].length-e[e.length-1].match(/\r?\n?/)[0].length:this.yylloc.last_column+b[0].length},this.yytext+=b[0],this.match+=b[0],this.matches=b,this.yyleng=this.yytext.length,this.options.ranges&&(this.yylloc.range=[this.offset,this.offset+=this.yyleng]),this._more=!1,this._input=this._input.slice(b[0].length),this.matched+=b[0],a=this.performAction.call(this,this.yy,this,f[d],this.conditionStack[this.conditionStack.length-1]),this.done&&this._input&&(this.done=!1),a?a:void 0):""===this._input?this.EOF:this.parseError("Lexical error on line "+(this.yylineno+1)+". Unrecognized text.\n"+this.showPosition(),{text:"",token:null,line:this.yylineno})},lex:function(){var a=this.next();return"undefined"!=typeof a?a:this.lex()},begin:function(a){this.conditionStack.push(a)},popState:function(){return this.conditionStack.pop()},_currentRules:function(){return this.conditions[this.conditionStack[this.conditionStack.length-1]].rules},topState:function(){return this.conditionStack[this.conditionStack.length-2]},pushState:function(a){this.begin(a)}};return a.options={},a.performAction=function(a,b,c,d){function e(a,c){return b.yytext=b.yytext.substr(a,b.yyleng-c)}switch(c){case 0:if("\\\\"===b.yytext.slice(-2)?(e(0,1),this.begin("mu")):"\\"===b.yytext.slice(-1)?(e(0,1),this.begin("emu")):this.begin("mu"),b.yytext)return 12;break;case 1:return 12;case 2:return this.popState(),12;case 3:return b.yytext=b.yytext.substr(5,b.yyleng-9),this.popState(),15;case 4:return 12;case 5:return e(0,4),this.popState(),13;case 6:return 45;case 7:return 46;case 8:return 16;case 9:return this.popState(),this.begin("raw"),18;case 10:return 34;case 11:return 24;case 12:return 29;case 13:return this.popState(),28;case 14:return this.popState(),28;case 15:return 26;case 16:return 26;case 17:return 32;case 18:return 31;case 19:this.popState(),this.begin("com");break;case 20:return e(3,5),this.popState(),13;case 21:return 31;case 22:return 51;case 23:return 50;case 24:return 50;case 25:return 54;case 26:break;case 27:return this.popState(),33;case 28:return this.popState(),25;case 29:return b.yytext=e(1,2).replace(/\\"/g,'"'),42;case 30:return b.yytext=e(1,2).replace(/\\'/g,"'"),42;case 31:return 52;case 32:return 44;case 33:return 44;case 34:return 43;case 35:return 50;case 36:return b.yytext=e(1,2),50;case 37:return"INVALID";case 38:return 5}},a.rules=[/^(?:[^\x00]*?(?=(\{\{)))/,/^(?:[^\x00]+)/,/^(?:[^\x00]{2,}?(?=(\{\{|\\\{\{|\\\\\{\{|$)))/,/^(?:\{\{\{\{\/[^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=[=}\s\/.])\}\}\}\})/,/^(?:[^\x00]*?(?=(\{\{\{\{\/)))/,/^(?:[\s\S]*?--\}\})/,/^(?:\()/,/^(?:\))/,/^(?:\{\{\{\{)/,/^(?:\}\}\}\})/,/^(?:\{\{(~)?>)/,/^(?:\{\{(~)?#)/,/^(?:\{\{(~)?\/)/,/^(?:\{\{(~)?\^\s*(~)?\}\})/,/^(?:\{\{(~)?\s*else\s*(~)?\}\})/,/^(?:\{\{(~)?\^)/,/^(?:\{\{(~)?\s*else\b)/,/^(?:\{\{(~)?\{)/,/^(?:\{\{(~)?&)/,/^(?:\{\{!--)/,/^(?:\{\{![\s\S]*?\}\})/,/^(?:\{\{(~)?)/,/^(?:=)/,/^(?:\.\.)/,/^(?:\.(?=([=~}\s\/.)])))/,/^(?:[\/.])/,/^(?:\s+)/,/^(?:\}(~)?\}\})/,/^(?:(~)?\}\})/,/^(?:"(\\["]|[^"])*")/,/^(?:'(\\[']|[^'])*')/,/^(?:@)/,/^(?:true(?=([~}\s)])))/,/^(?:false(?=([~}\s)])))/,/^(?:-?[0-9]+(?:\.[0-9]+)?(?=([~}\s)])))/,/^(?:([^\s!"#%-,\.\/;->@\[-\^`\{-~]+(?=([=~}\s\/.)]))))/,/^(?:\[[^\]]*\])/,/^(?:.)/,/^(?:$)/],a.conditions={mu:{rules:[6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38],inclusive:!1},emu:{rules:[2],inclusive:!1},com:{rules:[5],inclusive:!1},raw:{rules:[3,4],inclusive:!1},INITIAL:{rules:[0,1,38],inclusive:!0}},a}();return b.lexer=c,a.prototype=b,b.Parser=a,new a}();return a=b}(),i=function(a){"use strict";function b(a,b){return{left:"~"===a.charAt(2),right:"~"===b.charAt(b.length-3)}}function c(a,b,c,d,i,k){if(a.sexpr.id.original!==d.path.original)throw new j(a.sexpr.id.original+" doesn't match "+d.path.original,a);var l=c&&c.program,m={left:a.strip.left,right:d.strip.right,openStandalone:f(b.statements),closeStandalone:e((l||b).statements)};if(a.strip.right&&g(b.statements,null,!0),l){var n=c.strip;n.left&&h(b.statements,null,!0),n.right&&g(l.statements,null,!0),d.strip.left&&h(l.statements,null,!0),e(b.statements)&&f(l.statements)&&(h(b.statements),g(l.statements))}else d.strip.left&&h(b.statements,null,!0);return i?new this.BlockNode(a,l,b,m,k):new this.BlockNode(a,b,l,m,k)}function d(a,b){for(var c=0,d=a.length;d>c;c++){var i=a[c],j=i.strip;if(j){var k=e(a,c,b,"partial"===i.type),l=f(a,c,b),m=j.openStandalone&&k,n=j.closeStandalone&&l,o=j.inlineStandalone&&k&&l;j.right&&g(a,c,!0),j.left&&h(a,c,!0),o&&(g(a,c),h(a,c)&&"partial"===i.type&&(i.indent=/([ \t]+$)/.exec(a[c-1].original)?RegExp.$1:"")),m&&(g((i.program||i.inverse).statements),h(a,c)),n&&(g(a,c),h((i.inverse||i.program).statements))}}return a}function e(a,b,c){void 0===b&&(b=a.length);var d=a[b-1],e=a[b-2];return d?"content"===d.type?(e||!c?/\r?\n\s*?$/:/(^|\r?\n)\s*?$/).test(d.original):void 0:c}function f(a,b,c){void 0===b&&(b=-1);var d=a[b+1],e=a[b+2];return d?"content"===d.type?(e||!c?/^\s*?\r?\n/:/^\s*?(\r?\n|$)/).test(d.original):void 0:c}function g(a,b,c){var d=a[null==b?0:b+1];if(d&&"content"===d.type&&(c||!d.rightStripped)){var e=d.string;d.string=d.string.replace(c?/^\s+/:/^[ \t]*\r?\n?/,""),d.rightStripped=d.string!==e}}function h(a,b,c){var d=a[null==b?a.length-1:b-1];if(d&&"content"===d.type&&(c||!d.leftStripped)){var e=d.string;return d.string=d.string.replace(c?/\s+$/:/[ \t]+$/,""),d.leftStripped=d.string!==e,d.leftStripped}}var i={},j=a;return i.stripFlags=b,i.prepareBlock=c,i.prepareProgram=d,i}(c),j=function(a,b,c,d){"use strict";function e(a){return a.constructor===h.ProgramNode?a:(g.yy=k,g.parse(a))}var f={},g=a,h=b,i=c,j=d.extend;f.parser=g;var k={};return j(k,i,h),f.parse=e,f}(h,g,i,b),k=function(a,b){"use strict";function c(){}function d(a,b,c){if(null==a||"string"!=typeof a&&a.constructor!==c.AST.ProgramNode)throw new h("You must pass a string or Handlebars AST to Handlebars.precompile. You passed "+a);b=b||{},"data"in b||(b.data=!0),b.compat&&(b.useDepths=!0);var d=c.parse(a),e=(new c.Compiler).compile(d,b);return(new c.JavaScriptCompiler).compile(e,b)}function e(a,b,c){function d(){var d=c.parse(a),e=(new c.Compiler).compile(d,b),f=(new c.JavaScriptCompiler).compile(e,b,void 0,!0);return c.template(f)}if(null==a||"string"!=typeof a&&a.constructor!==c.AST.ProgramNode)throw new h("You must pass a string or Handlebars AST to Handlebars.compile. You passed "+a);b=b||{},"data"in b||(b.data=!0),b.compat&&(b.useDepths=!0);var e,f=function(a,b){return e||(e=d()),e.call(this,a,b)};return f._setup=function(a){return e||(e=d()),e._setup(a)},f._child=function(a,b,c){return e||(e=d()),e._child(a,b,c)},f}function f(a,b){if(a===b)return!0;if(i(a)&&i(b)&&a.length===b.length){for(var c=0;c<a.length;c++)if(!f(a[c],b[c]))return!1;return!0}}var g={},h=a,i=b.isArray,j=[].slice;return g.Compiler=c,c.prototype={compiler:c,equals:function(a){var b=this.opcodes.length;if(a.opcodes.length!==b)return!1;for(var c=0;b>c;c++){var d=this.opcodes[c],e=a.opcodes[c];if(d.opcode!==e.opcode||!f(d.args,e.args))return!1}for(b=this.children.length,c=0;b>c;c++)if(!this.children[c].equals(a.children[c]))return!1;return!0},guid:0,compile:function(a,b){this.opcodes=[],this.children=[],this.depths={list:[]},this.options=b,this.stringParams=b.stringParams,this.trackIds=b.trackIds;var c=this.options.knownHelpers;if(this.options.knownHelpers={helperMissing:!0,blockHelperMissing:!0,each:!0,"if":!0,unless:!0,"with":!0,log:!0,lookup:!0},c)for(var d in c)this.options.knownHelpers[d]=c[d];return this.accept(a)},accept:function(a){return this[a.type](a)},program:function(a){for(var b=a.statements,c=0,d=b.length;d>c;c++)this.accept(b[c]);return this.isSimple=1===d,this.depths.list=this.depths.list.sort(function(a,b){return a-b}),this},compileProgram:function(a){var b,c=(new this.compiler).compile(a,this.options),d=this.guid++;
......
examples/hello-mui/list.html
View file @ 2b5313c1
......@@ -13,6 +13,7 @@
<style type="text/css">
#list {
/*避免导航边框和列表背景边框重叠，看起来像两条边框似得；*/
margin-top: -1px;
}
</style>
......@@ -230,7 +231,7 @@
</a>
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/titlebar.html">
<a class="mui-navigate-right" open-type="common" href="examples/titlebar.html">
默认样式
</a>
</li>
......@@ -240,17 +241,17 @@
</a>
</li>-->
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/titlebar-with-buttons.html">
<a class="mui-navigate-right" open-type="common" href="examples/titlebar-with-buttons.html">
导航条包含按钮
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/titlebar-with-icons.html">
<a class="mui-navigate-right" open-type="common" href="examples/titlebar-with-icons.html">
导航条包含ICON
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/titlebar-with-text-and-icons.html">
<a class="mui-navigate-right" open-type="common" href="examples/titlebar-with-text-and-icons.html">
导航条同时包含文字和图标
</a>
</li>
......@@ -268,22 +269,22 @@
</a>
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/offcanvas-left-plus-main.html">
<a class="mui-navigate-right" open-type="common" href="examples/offcanvas-left-plus-main.html">
右滑菜单
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/offcanvas-right-plus-main.html">
<a class="mui-navigate-right" open-type="common" href="examples/offcanvas-right-plus-main.html">
左滑菜单
</a>
</li>
<li class="mui-table-view-cell ios-only">
<a class="mui-navigate-right" href="examples/offcanvas-with-left.html">
<a class="mui-navigate-right" open-type="common" href="examples/offcanvas-with-left.html">
可拖动式右滑菜单
</a>
</li>
<li class="mui-table-view-cell ios-only">
<a class="mui-navigate-right" href="examples/offcanvas-with-right.html">
<a class="mui-navigate-right" open-type="common" href="examples/offcanvas-with-right.html">
可拖动式左滑菜单
</a>
</li>
......@@ -323,55 +324,11 @@
</li>-->
</ul>
</li>
<li class="mui-table-view-cell mui-collapse" id="pull-refresh-h5">
<a class="mui-navigate-right" href="#">
pull to refresh（下拉刷新）
</a>
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell ">
<a class="mui-navigate-right" href="examples/pullrefresh-down-main.html">
下拉刷新
</a>
</li>
<li class="mui-table-view-cell ">
<a class="mui-navigate-right" href="examples/pullup.html">
上拉加载
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/pullrefresh-main.html">
同时支持下拉和上拉
</a>
</li>
</ul>
</li>
<li class="mui-table-view-cell mui-collapse" id="pull-refresh-pandora">
<a class="mui-navigate-right" href="#">
pull to refresh（下拉刷新）
</a>
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/pullrefresh-down-main.html">
下拉刷新默认样式
<a class="mui-navigate-right" open-type="common" href="examples/pullrefresh-main.html">
pull to refresh（下拉刷新&上拉加载）
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/pulldown-with-plus-main-custom.html">
下拉刷新自定义样式
</a>
</li>
<li class="mui-table-view-cell ">
<a class="mui-navigate-right" href="examples/pullup.html">
上拉加载
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/pullrefresh-main.html">
同时支持下拉和上拉
</a>
</li>
</ul>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/radio.html">
......@@ -419,7 +376,7 @@
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right" href="examples/tab-webview-main.html">
<a class="mui-navigate-right" open-type="common" href="examples/tab-webview-main.html">
webview模式
</a>
</li>
......@@ -518,62 +475,35 @@
</ul>
</div>
<script>
var limit = 3,
count = 0;
(function($) {
mui.init({
preloadLimit: limit, //同时并存的预加载窗口数量
preloadLimit: 3, //同时并存的预加载窗口数量
swipeBack: false,
});
(function($) {
$.plusReady(function() {
//初始化一级列表的预加载
$('#list>.mui-table-view-cell', document.body).each(function() {
//只预加载一级列表，二级列表在其展开时再预加载；
if (!this.classList.contains('mui-collapse')) {
var url = this.querySelector('a').getAttribute("href");
//预加载，默认使用url作为其id
plus.navigator.closeSplashscreen();
//预加载下拉刷新
$.preload({
url: url,
});
if (++count >= limit) {
return false;
}
}
id:"examples/pullrefresh-main.html",
url:"examples/pullrefresh-main.html"
});
//监听展开事件,预加载二级列表的前几个；
$('#list').on('expand', '.mui-collapse', function(e) {
count = 0;
$('.mui-table-view a', this).each(function() {
var url = this.getAttribute("href");
if (~url.indexOf('.html')) {
//单独处理侧滑导航的index
if (~url.indexOf('offcanvas-')) {
$.preload({
url: url,
styles: {
zindex: 9999
},
});
} else {
$.preload({
url: url,
});
}
if (++count >= limit) {
return false;
}
}
var template = plus.webview.create('examples/template.html', 'demoTemplate');
var subWebview = plus.webview.create('examples/accordion.html', 'template_sub', {
top: '48px',
bottom: '0px'
});
var waiting = null;
subWebview.addEventListener('loaded', function() {
setTimeout(function(){
subWebview.show();
},50);
});
// 关闭启动界面
plus.navigator.closeSplashscreen();
//下拉刷新两个平台有区别；
if ($.os.ios) {
document.getElementById('pull-refresh-pandora').style.display = "none";
} else if ($.os.android) {
document.getElementById('pull-refresh-h5').style.display = "none";
subWebview.hide();
template.append(subWebview);
if ($.os.android) {
var list = document.querySelectorAll('.ios-only');
if (list) {
for (var i = 0; i < list.length; i++) {
......@@ -581,43 +511,50 @@
}
}
}
});
/**
* 处理链接点击事件
*/
$.ready(function() {
$('body').on('tap', 'a', function(e) {
$('#list').on('tap', 'a', function() {
var id = this.getAttribute('href');
if (id) {
if (~id.indexOf('.html')) {
if (window.plus) {
//侧滑导航涉及Index问题，需要单独处理；
var type = this.getAttribute("open-type");
if(type=="common"){
if (~id.indexOf('offcanvas-')) {
$.openWindow({
mui.openWindow({
id: id,
url: this.href,
styles: {
zindex: 9999
},
preload: true
waiting:{
autoShow:false
}
});
} else {
$.openWindow({
} else if(~id.indexOf('pullrefresh')){
mui.openWindow({
id: id,
url: this.href,
preload: true
url: id,
preload:true
});
}else{
mui.openWindow({
id: id,
url: this.href,
waiting:{
autoShow:false
}
} else {
document.location.href = this.href;
});
}
} else {
if (typeof plus !== 'undefined') {
plus.runtime.openURL(id);
}else{
if (id&&~id.indexOf('.html')) {
var title = this.innerText;
template.evalJS("with(document.getElementById('title')){innerHTML='" + title + "';className='mui-title mui-fadein';};");
if(subWebview.getURL()==this.href){
subWebview.show();
}else{
subWebview.loadURL(this.href);
}
template.show('slide-in-right', 150);
}
}
});
});
})(mui);
......
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