mbui.define([], function (exports) {
var doc = document, query = 'querySelectorAll', claname = 'getElementsByClassName', S = function (s) {
return doc[query](s);
};
var template = {
warning: function (text) {
//警告提示
return `
${text}
`;
},
error: function (text) {
//失败提示
return `
${text}
`;
},
toast: function (text) {
//轻提示
return ``;
},
loading: function (text) {
//轻提示
return ``;
},
success: function (text) {
//轻提示
return ``;
}
}
//默认配置
var config = {
type: 1,
shade: true,
shadeClose: false,
fixed: true
};
var ready = {
extend: function (obj) {
var newobj = JSON.parse(JSON.stringify(config));
for (var i in obj) {
newobj[i] = obj[i];
}
return newobj;
},
timer: {}, end: {}
};
//点触事件
ready.touch = function (elem, fn) {
elem.addEventListener('click', function (e) {
fn.call(this, e);
}, false);
};
var index = 0, classs = ['mbui-layer'], Layer = function (options) {
var that = this;
that.config = ready.extend(options);
that.view();
};
Layer.prototype.view = function () {
var that = this, config = that.config, layerbox = doc.createElement('div');
that.id = layerbox.id = classs[0] + index;
layerbox.setAttribute('class', classs[0] + ' ' + classs[0] + (config.type || 0));
layerbox.setAttribute('index', index);
//标题区域
var title = (function () {
var titype = typeof config.title === 'object';
return config.title
? '' : '';
}());
//按钮区域
var button = (function () {
typeof config.btn === 'string' && (config.btn = [config.btn]);
var btns = (config.btn || []).length, btndom;
if (btns === 0 || !config.btn) {
return '';
}
btndom = '' + config.btn[0] + ' '
if (btns === 2) {
btndom = '' + config.btn[1] + ' ' + config.btn[0] + ' ';
}
return '';
}());
if (!config.fixed) {
config.top = config.hasOwnProperty('top') ? config.top : 100;
config.style = config.style || '';
config.style += ' top:' + (doc.body.scrollTop + config.top) + 'px';
}
if (config.type === 0) {
config.shade = false;
let content = template[config.template];
layerbox.innerHTML = content(config.content);
}
if (config.type === 2) {
config.content = '
';
}
if (config.type === 3) {
config.className = 'modal-view top';
config.content = '
';
}
if (config.type === 4) {
config.className = 'modal-actionsheet bottom';
}
if (config.type === 5) {
config.className = 'modal-view top';
}
if (config.type > 0) {
layerbox.innerHTML = (config.shade ? '
' : '')
+ ''
+ '
'
+ '
'
+ title
+ '
' + config.content + '
'
+ button
+ '
'
+ '
'
+ '
';
}
document.body.appendChild(layerbox);
var elem = that.elem = S('#' + that.id)[0];
config.success && config.success(elem,index);
that.index = index++;
that.action(config, elem);
};
Layer.prototype.action = function (config, elem) {
var that = this;
//自动关闭
if (config.time && config.time > 0) {
ready.timer[that.index] = setTimeout(function () {
layer.close(that.index);
}, config.time * 1000);
}
//确认取消
var btn = function () {
var type = this.getAttribute('types');
if (type == 0) {
config.no && config.no();
layer.close(that.index);
} else {
config.yes ? config.yes(that.index) : layer.close(that.index);
}
};
if (config.btn) {
var btns = elem[claname]('modal-footer')[0].children, btnlen = btns.length;
for (var ii = 0; ii < btnlen; ii++) {
ready.touch(btns[ii], btn);
}
}
//点遮罩关闭
if (config.shade && config.shadeClose) {
var shade = elem[claname]('mbui-layershade')[0];
ready.touch(shade, function () {
layer.close(that.index, config.end);
});
}
config.end && (ready.end[that.index] = config.end);
};
var layer = {
v: '1.0',
index: index,
//核心方法
open: function (options) {
var o = new Layer(options || {});
return o.index;
},
alert: function (txt) {
layer.open({
type: 1,
title: '提示',
content: txt,
btn: ['确定']
});
},
confirm: function (txt, fun) {
layer.open({
type: 1,
title: '温馨提示',
content: txt,
btn: ['确定', '取消'],
yes: function (index) {
fun ? fun(index) : layer.close(index);
}
});
},
prompt: function (title,fun,txt) {
layer.open({
type: 2,
title: title,
content: txt,
btn: ['确定', '取消'],
yes: function (index) {
let val = $('#prompt' + index).val();
fun ? fun(val,index) : layer.close(index);
}
});
},
textarea: function (title,fun,txt) {
layer.open({
type: 3,
title: title,
content: txt,
btn: ['确定', '取消'],
yes: function (index) {
let val = $('#textarea' + index).val();
fun ? fun(val,index) : layer.close(index);
}
});
},
msg: function (txt = '', time = 3, template = 'toast') {
let msg = layer.open({
type: 0,
content: txt,
template: template,
time: time
});
return msg;
},
success: function (txt) {
layer.msg(txt, 3, 'success');
},
warning: function (txt) {
layer.msg(txt, 3, 'warning');
},
error: function (txt) {
layer.msg(txt, 3, 'error');
},
loading: function (txt) {
let loading = layer.msg(txt, 3, 'loading');
return loading;
},
photo: function (url) {
var $image = $('');
$('body').append($image);
$image.fadeIn();
$image.click(function () {
$(this).fadeOut(function () {
$(this).remove();
});
});
},
close: function (index) {
var ibox = S('#' + classs[0] + index)[0];
if (!ibox) return;
ibox.innerHTML = '';
doc.body.removeChild(ibox);
clearTimeout(ready.timer[index]);
delete ready.timer[index];
typeof ready.end[index] === 'function' && ready.end[index]();
delete ready.end[index];
},
//关闭所有layer层
closeAll: function () {
var boxs = doc[claname](classs[0]);
for (var i = 0, len = boxs.length; i < len; i++) {
layer.close((boxs[0].getAttribute('index') | 0));
}
},
copy:function(content) {
var save = function(e){
e.clipboardData.setData('text/plain', content);
e.preventDefault();
}
document.addEventListener('copy', save);
document.execCommand('copy');
document.removeEventListener('copy',save);
if (content != '') {
layer.msg('复制成功');
}
}
};
// 输出接口
exports('layer', layer);
});