/**
* Created by carlos on 2015/5/19.
* 1、Qalert 页面提示插件,可以传入对应参数修改提示的位置和css
* 2、QloadingCover 页面加载提示插件。 $.QloadingCover.options 可以改变默认属性
* 3、setPosition 方法可以单独调用可以设置对象的位置,注意是position:fixed
* 4、Qmodal 页面弹出框插件,默认ios样式
* 5、Q_confirm 确定提示,类似于js中的confirm
* 6、Q_alert 提示,类似于js中的alert
* 7、Qstorage 本地缓存方法
*/
(function ($) {
$.fn.Qalert = function(params){
var defaults = {
text:'alert页面', //文本信息
duration:3000, //显示时间长度
position:'bottom', //显示的提示框的位置:top、middle、bottom
space:50, //与上下边框的间隔距离,只有当top和bottom时候生效
debug:false, //是否显示debug调试信息,主要是定位信息
css:{ //alert的提示框的css
color:'#ffffff',
background:'#222222',
padding:'10px 15px',
"border-radius":'5px',
"font-size":'14px'
}
};
var Qthis=$(this);
var options = params || defaults;
var Q_alert = $('');
Q_alert.css(options.css||defaults.css);
Q_alert.css({display:'none',"text-shadow":"none"});
Q_alert.html(options.text||defaults.text);
Qthis.append(Q_alert);
Q_alert.setPosition({
position:options.position||defaults.position,
space:options.space||defaults.space,
debug:options.debug||defaults.debug
});
Q_alert.fadeIn();
setTimeout(function(){
Q_alert.fadeOut();
Q_alert.remove();
},options.duration||defaults.duration)
};
$.fn.setPosition = function(poss){
// poss = {
// position:'bottom',
// space:20,
// debug:false
// }
init(poss,this);
function init(poss,obj){
var Pthis = $(obj);
var Pthis_W = Pthis.outerWidth(true);
var Pthis_H = Pthis.outerHeight(true);
var win_W = $(window).width();
var win_H = $(window).height();
var obj_left = null, obj_top = null;
obj_left = (win_W - Pthis_W)/2;
if(poss.position == "middle"){
obj_top = (win_H - Pthis_H)/2;
}
else if(poss.position == 'top'){
obj_top = poss.space;
}
else{
obj_top = win_H - Pthis_H - poss.space;
}
Pthis.css({"position":"fixed","z-index":10000,"left":obj_left,"top":obj_top});
if(poss.debug){
console.log("提示框宽度:"+Pthis_W,"提示框高度:"+Pthis_H);
console.log("屏幕宽度:"+win_W,"屏幕高度:"+win_H);
console.log("提示框距离左边:"+obj_left,"提示框距离上边:"+obj_top);
}
}
};
$.QloadingCover = function(action,params,sign){
params = params || {};
sign = sign || 'loadingCover';
if(action=='show') $.QloadingCover.sign = sign;
var defaults = {
text:"加载中", //显示文本
showText:true, //是否显示文本
customContent:"", //当showText和showImage同时为false,此项自定义内容生效
imageUrl:'', //图片url
imageAuto:true, //图片原大小显示,默认为true
imageWidth:50, //图片宽度,当imageAuto=为false时生效
imageHeight:50, //图片高度,当imageAuto=为false时生效
showImage:false, //是否显示图片,默认为false
debug:false, //是否显示debug调试信息,主要是定位信息
zIndex:9999, //cover的z层高度
coverColor:'#3A3A3A', //cover的颜色
coverOpacity:0.5, //cover的透明度
close:false, //点击非提示框是否关闭,默认false
css:{ //loading的提示框的css
color:'#ffffff',
background:'#222222',
padding:'10px 15px',
"border-radius":'5px',
"font-size":'14px'
}
};
var options = $.QloadingCover.options; //改变默认属性
defaults = $.extend({},defaults,options,params);
if(action=="show"){
var Qcover = createCover();
if($('#Qloadingbox').length>0){$('#Qloadingbox').remove();}
var Qloadingbox = $('
');
$('body').append(Qcover,Qloadingbox);
Qloadingbox.css('display','none');
Qloadingbox.css(GetResultValue('css'));
Qloadingbox.css({display:'none',"text-shadow":"none","z-index":GetResultValue('zIndex')+1,"text-align":'center'});
if(GetResultValue('showImage')){
var img = $('
');
if(!GetResultValue('imageAuto')){img.css({width:GetResultValue('imageWidth')+'px',height:GetResultValue('imageHeight')+'px'});}
img.css({"margin-bottom":"5px"});
img.attr('src',GetResultValue('imageUrl'));
Qloadingbox.append(img);
}
if(GetResultValue('showText')){
var span = $('
');
span.html(GetResultValue('text'));
if(GetResultValue('showImage')) Qloadingbox.append('
');
Qloadingbox.append(span);
}
if(!GetResultValue('showText')&&!GetResultValue('showImage')){
Qloadingbox.append(GetResultValue('customContent'));
}
Qloadingbox.setPosition({position:'middle',space:0,debug:GetResultValue('debug')});
$(window).resize(function(){
$('#Qloadingbox').setPosition({position:'middle',space:0,debug:GetResultValue('debug')})
});
$('body').css('overflow','hidden');
Qcover.fadeIn();
Qloadingbox.fadeIn();
initCover(Qcover, Qloadingbox);
return Qloadingbox;
}
else if(action=="hide"){
if($.QloadingCover.sign!=sign) return;
var Qcover = $('#Qcover');
var Qloadingbox = $('#Qloadingbox');
$('body').css('overflow','auto');
Qcover.fadeOut();
Qloadingbox.fadeOut();
}
else{
console.log('action is invalid');
}
function initCover(c,l){
if(GetResultValue('close')){
closeCover(c,l);
}
}
function closeCover(c,l){
c.bind('click',function(e){
c.fadeOut();
l.fadeOut();
$('body').css('overflow','auto');
});
}
function createCover(){
this.coverWidth = $(window).width();
this.coverHeight = $(document).height();
if($('#Qcover').length>0){$('#Qcover').remove();}
this.cover = $('');
this.coverOpacity = GetResultValue('coverOpacity');
this.cover.css({
"position":"absolute",
"width":this.coverWidth,
"height":this.coverHeight,
"z-index":GetResultValue('zIndex'),
filter:'alpha(opacity='+this.coverOpacity*10+')',
"-moz-opacity":this.coverOpacity,
"-khtml-opacity": this.coverOpacity,
"opacity": this.coverOpacity,
"background":GetResultValue('coverColor'),
"top":0,
"left":0,
"display":"none"
});
return this.cover;
}
function GetResultValue(name){
return defaults[name];
}
};
$.Qmodal = function(action,params,sign){
params = params || {};
sign = sign || 'modal';
var defaults = {
theme:"ios", //默认样式ios
showHead:false, //是否显示头部,默认false
showBtn:false, //是否显示按钮,默认false
btnVertical:false, //按钮是否垂直布局,默认false
headText:"modal提示", //头部显示文字
headColor:"#2C73DF", //头部文字颜色
contentHtml:"
", //要显示的内容html
close:false, //点击非提示框是否关闭,默认false
modalWidth:"75%" //modal的宽度设置
};
var defaultBtns = [{
name:"取消",
fun:modalCancel
},{
name:"确定",
fun:modalSubmit
}];
defaults.btns = defaultBtns; //showBtn为true时默认按钮
var ios = { //ios皮肤样式
background:"#EFEFEF",
overflow:"hidden",
"-webkit-border-radius": "4px",
"-moz-border-radius": "4px",
"border-radius":'4px',
"-webkit-box-shadow": "#666 3px 3px 5px",
"-moz-box-shadow": "#666 3px 3px 5px",
"box-shadow":"#666 3px 3px 5px"
};
defaults = $.extend({},defaults,params);
ios.width = defaults.modalWidth;
defaults.showText = false;
defaults.showImage = false;
defaults.css = eval(defaults.theme);
var headstyle = {
'overflow':'hidden',
'padding':'8px 10px',
'text-align': 'left',
'font-size':'1.1em',
'color':defaults.headColor,
'border-bottom':'2px solid '+defaults.headColor
};
var Qmodal_html = $('
');
Qmodal_html.html(defaults.contentHtml);
var Qmodal_box = $('
');
if(defaults.showHead){
var Qmodal_head = $('
');
var Qmodal_head_text = $('');
Qmodal_head_text.html(defaults.headText);
Qmodal_head.css(headstyle);
Qmodal_head.append(Qmodal_head_text);
Qmodal_box.append(Qmodal_head);
}
Qmodal_box.append(Qmodal_html);
var td_style = {
"text-align":"center",
"padding":"10px 0",
"border":"1px solid #C9C9C9",
"font-size":"0.8em"
};
if(defaults.showBtn){
var Qmodal_foot = $('