📄 tabs.js
字号:
Class("linb.UI.Tabs", ["linb.UI", "linb.absList","linb.absValue"],{
Instance:{
_setCtrlValue:function(value){
this.each(function(profile){
var id=profile.domId,
box = profile.boxing(),
uiv = box.getUIValue(),
properties = profile.properties,
itemId = profile.getSubIdByItemId(uiv),
temp,t
;
if(uiv && profile.getSubIdByItemId(uiv)){
profile.getSubNodes(['ITEM','BOX'],itemId).tagClass('-checked',false);
if(box.KEY!='linb.UI.Tabs'||properties.hasPanel)
// hide pane
box.getPanel(uiv).hide();
}
itemId = profile.getSubIdByItemId(value);
if(itemId){
profile.getSubNodes(['ITEM','BOX'],itemId).tagClass('-checked');
if(box.KEY!='linb.UI.Tabs'||properties.hasPanel){
// show pane
box.getPanel(value).show('auto',profile.getSubNode('LIST').offsetHeight()+'px');
t=profile.root.cssSize();
//reset width and height
linb.UI.$tryResize(profile, parseInt(t.width)||null, parseInt(t.height)||null, false, value);
//dynamic render
if(properties.dynRender){
var arr=profile.children,a=[];
_.arr.each(arr,function(o){
if(o[1]==value && !o[0]['parent:'+profile.$id]){
a.push(o[0]);
o[0]['parent:'+profile.$id]=1;
}
});
if(a.length)
box.append(linb.UI.pack(a),value);
}
}
}
});
},
append:function(target,subId){
var p=this.get(0).properties;
if(subId=subId||p.$UIvalue||p.value)
arguments.callee.upper.call(this, target, subId);
return this;
},
getCurPanel:function(){
var profile = this.get(0);
return this.getPanel(profile.properties.$UIvalue);
},
// get pane in page views
getPanel:function(subId){
var profile = this.get(0);
return profile.getSubNodeByItemId('PANEL', subId);
},
////
addPanel:function(para, children, item){
var i={}, id = item&&item.id;
if(!id){
var items = this.getItems();
if(items.length)
id = items[items.length-1].id;
}
_.merge(i, {
caption:para.caption,
image:para.image,
closeBtn:para.closeBtn || false,
landBtn:para.landBtn || false,
optBtn:para.optBtn || false,
imagePos:para.imagePos,
dragKey:para.dragKey,
dropKeys:para.dropKeys,
id : para.id || para.tag || _.id()
});
this.insertItems([i], id);
var arr=[];
_.arr.each(children,function(o){
arr.push(o[0]);
});
this.append(linb.UI.pack(arr,false), i.id);
},
removePanel:function(domId){
var self=this,
item = self.getItemByDom(domId);
return self.removeItems([item.id]);
},
getPanelPara:function(domId){
var profile=this.get(0),
pp=profile.properties,
item = profile.getItemByDom(domId),
para = _.clone(item);
if(!para.dragKey)para.dragKey=pp.dragKey;
if(!para.dropKeys)para.dropKeys=pp.dropKeys;
return para;
},
getPanelChildren:function(domId){
var profile=this.get(0),
id = profile.getItemIdByDom(domId),
arr=[];
if(id)
_.arr.each(profile.children,function(o){
if(o[1]==id)arr.push(o);
});
return arr;
},
////
fireItemClickEvent:function(subId){
this.getSubNodeByItemId('ITEM', subId).onMousedown();
return this;
},
/* insert some views to pageView widgets
arr: hash(view properties) or array of hash
before: views will insert before it, string
*/
_afterInsertItems:function(profile, data, base, before){
var box=profile.box,obj,v,pp=profile.properties;
if(pp.hasPanel && (obj=profile.getSubNode(profile.keys.BOX||profile.keys.KEY))){
obj.append(_.str.toDom(profile.buildItems('panels', data)));
if(!(v=this.getUIValue()))
this.fireItemClickEvent((v=pp.items[0]) && (v=v.id));
var t=profile.domNode.style;
linb.UI.$tryResize(profile, parseInt(t.width)||null, parseInt(t.height)||null, false,v);
}
},
/* remove some views from pageView
arr: array for id
*/
removeItems:function(arr){
var self=this,
obj,serialId;
if(!_.isArr(arr))arr=[arr];
self.each(function(profile){
if(profile.properties.hasPanel)
_.arr.each(arr,function(o){
// get ui serial id
serialId=profile.getSubIdByItemId(o);
if(serialId && !(obj = profile.getSubNode('PANEL', serialId) ).isEmpty() ){
// remove ui
obj.remove();
}
});
});
arguments.callee.upper.apply(self,arguments);
self.each(function(profile){
if(!profile.boxing().getUIValue()){
var i;
profile.boxing().fireItemClickEvent((i=profile.properties.items[0]) && i.id);
}
if(profile.properties.hasPanel)
linb.UI.$tryResize(profile, profile.root.width(), profile.root.height(), false, profile.boxing().getUIValue());
});
return self;
},
clearItems:function(){
var self=this;
self.each(function(profile){
if(profile.properties.hasPanel)
profile.getSubNode('PANEL',true).remove();
});
self.setValue(null,true);
arguments.callee.upper.apply(self,arguments);
return self;
},
markItemCaption:function(subId, mark, force){
var profile = this.get(0);
subId=profile.getItemByItemId(subId);
if((subId._dirty !=mark) || force){
var id = subId.id,
caption = profile.getItemByItemId(id).caption;
profile.getSubNodeByItemId('CAPTION', id).html(
profile.getItemByItemId(id).caption=mark?('*'+caption):caption.replace(/^\*/,'')
).css('fontStyle',mark?'italic':'normal');
subId._dirty=mark;
}
return this;
}
},
Static:{
Templates:{
tagName : 'div',
style:'{_style};',
LIST:{
$order:0,
tagName : 'div',
ITEMS:{
tagName : 'div',
text:"{items}",
style:'{HAlign}'
}
},
PNAELS:{
$order:1,
tagName:'text',
text:'{panels}'
},
$dynamic:{
items:{
ITEM:{
className:'{itemClass} {disabled}',
style:'{itemStyle}',
ITEMI:{
ITEMC:{
HANDLE:{
tagName: 'a',
href :"{href}",
tabindex: '{_tabindex}',
IBWRAP:{
tagName:'div',
style:"white-space:nowrap;",
RULER:{},
ICON:{
style:'background:url({image}) transparent no-repeat {imagePos};{iconDisplay}',
className:'ui-icon',
$order:0
},
CAPTION:{
text: '{caption}',
$order:1
},
CMDS:{
$order:2,
OPT:{
$order:1,
className:'uicmd-opt',
style:'{_opt}'
},
LAND:{
className:'uicmd-land',
style:'{landDisplay}',
$order:1
},
CLOSE:{
className:'uicmd-close ',
style:'{closeDisplay}',
$order:2
}
}
}
}
}
}
}
},
panels:{
PANEL:{
tagName : 'div',
className:'uibg-base',
text:linb.UI.$childTag
}
}
}
},
Appearances:{
KEY:{
position:'absolute',
overflow:'hidden'
},
LIST:{
position:'relative'
},
ITEMS:{
padding:'0 4px 2px 0',
position:'relative',
background: linb.UI.$bg('line.gif', 'repeat-x center bottom')
},
ITEM:{
$order:0,
'font-family': '"Verdana", "Helvetica", "sans-serif"',
cursor:'pointer',
'padding-right':'6px',
'vertical-align':'top',
background: linb.UI.$bg('button.gif', 'no-repeat right -540px', true)
},
'ITEM-mouseover':{
$order:1,
'background-position' : 'right -690px'
},
'ITEM-mousedown, ITEM-checked':{
$order:2,
'background-position' : 'right -840px',
'border-bottom':'solid 1px #FAD600;'
},
ITEMI:{
$order:0,
'padding-left':'6px',
//keep this same with ITEM
'vertical-align':'top',
background: linb.UI.$bg('button.gif', 'no-repeat left -640px',true)
},
'ITEM-mouseover ITEMI':{
$order:1,
'background-position' : 'left -790px'
},
'ITEM-mousedown ITEMI, ITEM-checked ITEMI':{
$order:2,
'background-position' : 'left -940px'
},
ITEMC:{
$order:0,
padding:'5px 0 3px 0',
//keep this same with ITEM
'vertical-align':'top',
'text-align': 'center',
background: linb.UI.$bg('button.gif', 'repeat-x left -590px',true)
},
'ITEM-mouseover ITEMC':{
$order:1,
'background-position' : 'left -740px'
},
'ITEM-mousedown ITEMC, ITEM-checked ITEMC':{
$order:2,
'background-position' : 'left -890px'
},
HANDLE:{
display:linb.$inlineBlock,
zoom:linb.browser.ie6?1:null,
cursor:'pointer',
'vertical-align':'middle',
'font-size':'12px'
},
RULER:{
height:'18px',
width:'1px',
'vertical-align':'middle'
},
PANEL:{
position:'absolute',
visibility:'hidden',
top:'-10000px',
left:'-10000px',
width:'100%',
overflow:'auto'
},
CAPTION:{
'vertical-align':'middle'
},
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -