sync
authorjohn <john@roojs.com>
Tue, 11 Sep 2018 09:30:59 +0000 (17:30 +0800)
committerjohn <john@roojs.com>
Tue, 11 Sep 2018 09:30:59 +0000 (17:30 +0800)
Roo/bootstrap/CheckBox.js
less/roojs-bootstrap/checkbox.less
roojs-bootstrap-debug.js
roojs-bootstrap.js

index 8fc536b..ec0d284 100644 (file)
@@ -55,7 +55,6 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input,  {
     weight : false,
     inline: false,
     tooltip : '',
-    useFontAwesome : false,
     
     getAutoCreate : function()
     {
@@ -235,6 +234,10 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input,  {
                 html: this.boxLabel
             };
             
+            if(this.useFontAwesomeCheckBox) {
+                boxLabelCfg.cls = 'box-label fa-checkbox'
+            }
+            
             if(this.tooltip){
                 boxLabelCfg.tooltip = this.tooltip;
             }
index 7737fc2..2f0f69a 100644 (file)
     -ms-user-select: none;
     user-select: none;
 }
-.checkbox label::before {
-    content: "";
-    display: inline-block;
-    position: absolute;
-    width: 17px;
-    height: 17px;
-    left: 0;
-    margin-left: -20px;
-    border: 1px solid @gray-light;
-    border-radius: 3px;
-    background-color: @body-bg;
-    -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
-    -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
-    transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }
 .checkbox label::after {
     display: inline-block;
     position: absolute;
 .checkbox input[type="checkbox"] {
     display: none; }
 .checkbox input[type="checkbox"]:checked + label::after {
-    font-family: 'Font Awesome 5 Free';
-    font-weight: 900; 
-    content: "\f00c"; }
+    font-size: 18px;
+    padding-top: 0px;
+    font-family: 'Font Awesome 5 Free 400';
+    font-weight: 900;
+    color: @brand-success;
+    content: "\f14a"; }
+.checkbox input[type="checkbox"]:not(:checked) + label::after {
+    font-size: 18px;
+    padding-top: 0px;
+    font-family: 'Font Awesome 5 Free 400';
+    font-weight: 900;
+    content: "\f0c8"; }
+
 .checkbox input[type="checkbox"]:disabled + label {
     opacity: 0.65; }
 .checkbox input[type="checkbox"]:disabled + label::before {
index 033c8c1..e7313a1 100644 (file)
@@ -20402,6 +20402,7 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input,  {
     weight : false,
     inline: false,
     tooltip : '',
+    useFontAwesomeCheckBox : false,
     
     getAutoCreate : function()
     {
@@ -20581,6 +20582,10 @@ Roo.extend(Roo.bootstrap.CheckBox, Roo.bootstrap.Input,  {
                 html: this.boxLabel
             };
             
+            if(this.useFontAwesomeCheckBox) {
+                boxLabelCfg.cls = 'box-label fa-checkbox'
+            }
+            
             if(this.tooltip){
                 boxLabelCfg.tooltip = this.tooltip;
             }
index 6a502e7..57684b5 100644 (file)
@@ -840,22 +840,23 @@ break;case 13:if(typeof(this.vIndex)!='undefined'&&!isNaN(this.vIndex)){this.set
 }this.hide();break;case 16:case 17:case 18:break;default:this.hide();}},remove:function(){this.picker().remove();}});Roo.apply(Roo.bootstrap.MonthField,{content:{tag:'tbody',cn:[{tag:'tr',cn:[{tag:'td',colspan:'7'}]}]},dates:{en:{months:["January","February","March","April","May","June","July","August","September","October","November","December"],monthsShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]}
 }});Roo.apply(Roo.bootstrap.MonthField,{template:{tag:'div',cls:'datepicker dropdown-menu roo-dynamic',cn:[{tag:'div',cls:'datepicker-months',cn:[{tag:'table',cls:'table-condensed',cn:[Roo.bootstrap.DateField.content]}]}]}});
 // Roo/bootstrap/CheckBox.js
-Roo.bootstrap.CheckBox=function(A){Roo.bootstrap.CheckBox.superclass.constructor.call(this,A);this.addEvents({check:true,click:true});};Roo.extend(Roo.bootstrap.CheckBox,Roo.bootstrap.Input,{inputType:'checkbox',inputValue:1,valueOff:0,boxLabel:false,checked:false,weight:false,inline:false,tooltip:'',getAutoCreate:function(){var A=(!this.labelAlign)?this.parentLabelAlign():this.labelAlign;
+Roo.bootstrap.CheckBox=function(A){Roo.bootstrap.CheckBox.superclass.constructor.call(this,A);this.addEvents({check:true,click:true});};Roo.extend(Roo.bootstrap.CheckBox,Roo.bootstrap.Input,{inputType:'checkbox',inputValue:1,valueOff:0,boxLabel:false,checked:false,weight:false,inline:false,tooltip:'',useFontAwesomeCheckBox:false,getAutoCreate:function(){var A=(!this.labelAlign)?this.parentLabelAlign():this.labelAlign;
 var id=Roo.id();var B={};B.cls='form-group '+this.inputType;if(this.inline){B.cls+=' '+this.inputType+'-inline';}var C={tag:'input',id:id,type:this.inputType,value:this.inputValue,cls:'roo-'+this.inputType,placeholder:this.placeholder||''};if(this.inputType!='radio'){var D={tag:'input',type:'hidden',cls:'roo-hidden-value',value:this.checked?this.inputValue:this.valueOff}
 ;}if(this.weight){B.cls+=" "+this.inputType+"-"+this.weight;}if(this.disabled){C.disabled=true;}if(this.checked){C.checked=this.checked;}if(this.name){C.name=this.name;if(this.inputType!='radio'){D.name=this.name;C.name='_hidden_'+this.name;}}if(this.size){C.cls+=' input-'+this.size;
 }var E=this;['xs','sm','md','lg'].map(function(H){if(E[H]){B.cls+=' col-'+H+'-'+E[H];}});var F=C;if(this.before||this.after){F={cls:'input-group',cn:[]};if(this.before){F.cn.push({tag:'span',cls:'input-group-addon',html:this.before});}F.cn.push(C);if(this.inputType!='radio'){F.cn.push(D);
 }if(this.after){F.cn.push({tag:'span',cls:'input-group-addon',html:this.after});}}if(A==='left'&&this.fieldLabel.length){B.cn=[{tag:'label','for':id,cls:'control-label',html:this.fieldLabel},{cls:"",cn:[F]}];if(this.labelWidth>12){B.cn[0].style="width: "+this.labelWidth+'px';
 }if(this.labelWidth<13&&this.labelmd==0){this.labelmd=this.labelWidth;}if(this.labellg>0){B.cn[0].cls+=' col-lg-'+this.labellg;B.cn[1].cls+=' col-lg-'+(12-this.labellg);}if(this.labelmd>0){B.cn[0].cls+=' col-md-'+this.labelmd;B.cn[1].cls+=' col-md-'+(12-this.labelmd);
 }if(this.labelsm>0){B.cn[0].cls+=' col-sm-'+this.labelsm;B.cn[1].cls+=' col-sm-'+(12-this.labelsm);}if(this.labelxs>0){B.cn[0].cls+=' col-xs-'+this.labelxs;B.cn[1].cls+=' col-xs-'+(12-this.labelxs);}}else if(this.fieldLabel.length){B.cn=[{tag:this.boxLabel?'span':'label','for':id,cls:'control-label box-input-label',html:this.fieldLabel}
-,F];}else{B.cn=[F];}if(this.boxLabel){var G={tag:'label',cls:'box-label',html:this.boxLabel};if(this.tooltip){G.tooltip=this.tooltip;}B.cn.push(G);}if(this.inputType!='radio'){B.cn.push(D);}return B;},inputEl:function(){return this.el.select('input.roo-'+this.inputType,true).first();
-},hiddenEl:function(){return this.el.select('input.roo-hidden-value',true).first();},labelEl:function(){return this.el.select('label.control-label',true).first();},label:function(){return this.labelEl();},boxLabelEl:function(){return this.el.select('label.box-label',true).first();
-},initEvents:function(){this.inputEl().on('click',this.onClick,this);if(this.boxLabel){this.el.select('label.box-label',true).first().on('click',this.onClick,this);}this.startValue=this.getValue();if(this.groupId){Roo.bootstrap.CheckBox.register(this);}},onClick:function(e){if(this.fireEvent('click',this,e)!==false){this.setChecked(!this.checked);
-}},setChecked:function(A,B){this.startValue=this.getValue();if(this.inputType=='radio'){Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){e.dom.checked=false;});this.inputEl().dom.checked=true;this.inputEl().dom.value=this.inputValue;
-if(B!==true){this.fireEvent('check',this,true);}this.validate();return;}this.checked=A;this.inputEl().dom.checked=A;this.hiddenEl().dom.value=A?this.inputValue:this.valueOff;if(B!==true){this.fireEvent('check',this,A);}this.validate();},getValue:function(){if(this.inputType=='radio'){return this.getGroupValue();
-}return this.hiddenEl().dom.value;},getGroupValue:function(){if(typeof(this.el.up('form').child('input[name='+this.name+']:checked',true))=='undefined'){return '';}return this.el.up('form').child('input[name='+this.name+']:checked',true).value;},setValue:function(v,A){if(this.inputType=='radio'){this.setGroupValue(v,A);
-return;}this.setChecked(((typeof(v)=='undefined')?this.checked:(String(v)===String(this.inputValue))),A);this.validate();},setGroupValue:function(v,A){this.startValue=this.getValue();Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){e.dom.checked=false;
-if(e.dom.value==v){e.dom.checked=true;}});if(A!==true){this.fireEvent('check',this,true);}this.validate();return;},validate:function(){if(this.getVisibilityEl().hasClass('hidden')){return true;}if(this.disabled||(this.inputType=='radio'&&this.validateRadio())||(this.inputType=='checkbox'&&this.validateCheckbox())){this.markValid();
-return true;}this.markInvalid();return false;},validateRadio:function(){if(this.getVisibilityEl().hasClass('hidden')){return true;}if(this.allowBlank){return true;}var A=false;Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){if(!e.dom.checked){return;
+,F];}else{B.cn=[F];}if(this.boxLabel){var G={tag:'label',cls:'box-label',html:this.boxLabel};if(this.useFontAwesomeCheckBox){G.cls='box-label fa-checkbox'}if(this.tooltip){G.tooltip=this.tooltip;}B.cn.push(G);}if(this.inputType!='radio'){B.cn.push(D);}return B;
+},inputEl:function(){return this.el.select('input.roo-'+this.inputType,true).first();},hiddenEl:function(){return this.el.select('input.roo-hidden-value',true).first();},labelEl:function(){return this.el.select('label.control-label',true).first();},label:function(){return this.labelEl();
+},boxLabelEl:function(){return this.el.select('label.box-label',true).first();},initEvents:function(){this.inputEl().on('click',this.onClick,this);if(this.boxLabel){this.el.select('label.box-label',true).first().on('click',this.onClick,this);}this.startValue=this.getValue();
+if(this.groupId){Roo.bootstrap.CheckBox.register(this);}},onClick:function(e){if(this.fireEvent('click',this,e)!==false){this.setChecked(!this.checked);}},setChecked:function(A,B){this.startValue=this.getValue();if(this.inputType=='radio'){Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){e.dom.checked=false;
+});this.inputEl().dom.checked=true;this.inputEl().dom.value=this.inputValue;if(B!==true){this.fireEvent('check',this,true);}this.validate();return;}this.checked=A;this.inputEl().dom.checked=A;this.hiddenEl().dom.value=A?this.inputValue:this.valueOff;if(B!==true){this.fireEvent('check',this,A);
+}this.validate();},getValue:function(){if(this.inputType=='radio'){return this.getGroupValue();}return this.hiddenEl().dom.value;},getGroupValue:function(){if(typeof(this.el.up('form').child('input[name='+this.name+']:checked',true))=='undefined'){return '';
+}return this.el.up('form').child('input[name='+this.name+']:checked',true).value;},setValue:function(v,A){if(this.inputType=='radio'){this.setGroupValue(v,A);return;}this.setChecked(((typeof(v)=='undefined')?this.checked:(String(v)===String(this.inputValue))),A);
+this.validate();},setGroupValue:function(v,A){this.startValue=this.getValue();Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){e.dom.checked=false;if(e.dom.value==v){e.dom.checked=true;}});if(A!==true){this.fireEvent('check',this,true);
+}this.validate();return;},validate:function(){if(this.getVisibilityEl().hasClass('hidden')){return true;}if(this.disabled||(this.inputType=='radio'&&this.validateRadio())||(this.inputType=='checkbox'&&this.validateCheckbox())){this.markValid();return true;
+}this.markInvalid();return false;},validateRadio:function(){if(this.getVisibilityEl().hasClass('hidden')){return true;}if(this.allowBlank){return true;}var A=false;Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){if(!e.dom.checked){return;
 }A=true;return false;});return A;},validateCheckbox:function(){if(!this.groupId){return (this.getValue()==this.inputValue||this.allowBlank)?true:false;}var A=Roo.bootstrap.CheckBox.get(this.groupId);if(!A){return false;}var r=false;for(var i in A){if(A[i].el.isVisible(true)){r=false;
 break;}r=true;}for(var i in A){if(r){break;}r=(A[i].getValue()==A[i].inputValue)?true:false;}return r;},markValid:function(){var A=this;this.fireEvent('valid',this);var B=Roo.bootstrap.FieldLabel.get(this.name+'-group');if(this.groupId){B=Roo.bootstrap.FieldLabel.get(this.groupId+'-group');
 }if(B){B.markValid();}if(this.inputType=='radio'){Roo.each(this.el.up('form').select('input[name='+this.name+']',true).elements,function(e){e.findParent('.form-group',false,true).removeClass([A.invalidClass,A.validClass]);e.findParent('.form-group',false,true).addClass(A.validClass);