From: Alan Knowles Date: Wed, 20 Jan 2021 06:58:51 +0000 (+0800) Subject: sync X-Git-Url: http://git.roojs.org/?p=roojs1;a=commitdiff_plain;h=6687379e0b1cb0a7ea1a497a972b7b167be763c4 sync --- diff --git a/Roo/ContentPanel.js b/Roo/ContentPanel.js index 29f2a68ceb..86f40ea887 100644 --- a/Roo/ContentPanel.js +++ b/Roo/ContentPanel.js @@ -27,6 +27,7 @@ * @cfg {String/Object} params When used with {@link #url}, calls {@link #setUrl} with this value * @cfg {Boolean} loadOnce When used with {@link #url}, calls {@link #setUrl} with this value * @cfg {String} content Raw content to fill content panel with (uses setContent on construction.) + * @cfg {String} style Extra style to add to the content panel * @constructor * Create a new ContentPanel. @@ -64,6 +65,8 @@ Roo.ContentPanel = function(el, config, content){ {tag: "div", cls: "x-layout-inactive-content", id: config.id||el}, true); } } + + this.closable = false; this.loaded = false; this.active = false; diff --git a/Roo/Element.js b/Roo/Element.js index a55c6da3ea..69d4311b2f 100644 --- a/Roo/Element.js +++ b/Roo/Element.js @@ -113,12 +113,14 @@ if(opt.anim.isAnimated()){ El.prototype = { /** - * The element's default display mode (defaults to "") + * The element's default display mode (defaults to "") * @type String */ originalDisplay : "", - visibilityMode : 1, + + // note this is overridden in BS version.. + visibilityMode : 1, /** * The default unit to append to CSS values where a unit isn't provided (defaults to px). * @type String diff --git a/Roo/HtmlEditorCore.js b/Roo/HtmlEditorCore.js index cdf80e95cc..933d8cb434 100644 --- a/Roo/HtmlEditorCore.js +++ b/Roo/HtmlEditorCore.js @@ -160,10 +160,11 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { st = ''; - } else { - st = ''; + } else { + for (var i in this.stylesheets) { + st += ''; + } + } st += '';}else{st='';}st+=''; -var A='roo-htmleditor-body';if(this.bodyCls.length){A+=' '+this.bodyCls;}return ''+st+' ';},onRender:function(ct,A){var _t=this;this.el=this.owner.inputEl?this.owner.inputEl():this.owner.el; -this.el.dom.style.border='0 none';this.el.dom.setAttribute('tabIndex',-1);this.el.addClass('x-hidden hide');if(Roo.isIE){this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')}this.frameId=Roo.id();var B=this.owner.wrap.createChild({tag:'iframe',cls:'form-control',id:this.frameId,name:this.frameId,frameBorder:'no','src':Roo.SSL_SECURE_URL?Roo.SSL_SECURE_URL:"javascript:false"} -,this.el);this.iframe=B.dom;this.assignDocWin();this.doc.designMode='on';this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var C={run:function(){this.assignDocWin();if(this.doc.body||this.doc.readyState=='complete'){try{this.doc.designMode="on"; -}catch(e){return;}Roo.TaskMgr.stop(C);this.initEditor.defer(10,this);}},interval:10,duration:10000,scope:this};Roo.TaskMgr.start(C);},onResize:function(w,h){Roo.log('resize: '+w+','+h);if(!this.iframe){return;}if(typeof w=='number'){this.iframe.style.width=w+'px'; -}if(typeof h=='number'){this.iframe.style.height=h+'px';if(this.doc){(this.doc.body||this.doc.documentElement).style.height=(h-(this.iframePad*2))+'px';}}},toggleSourceEdit:function(A){this.sourceEditMode=A===true;if(this.sourceEditMode){Roo.get(this.iframe).addClass(['x-hidden','hide']); -}else{Roo.get(this.iframe).removeClass(['x-hidden','hide']);this.deferFocus();}},cleanHtml:function(A){A=String(A);if(A.length>5){if(Roo.isSafari){A=A.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,'');}}if(A==' '){A='';}return A; -},syncValue:function(){if(this.initialized){var bd=(this.doc.body||this.doc.documentElement);var A=bd.innerHTML;if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){A='
'+A+'
'; +});}else if(!this.stylesheets.length){st='';}else{for(var i in this.stylesheets){st+='';} +}st+='';var A='roo-htmleditor-body';if(this.bodyCls.length){A+=' '+this.bodyCls;}return ''+st+' '; +},onRender:function(ct,A){var _t=this;this.el=this.owner.inputEl?this.owner.inputEl():this.owner.el;this.el.dom.style.border='0 none';this.el.dom.setAttribute('tabIndex',-1);this.el.addClass('x-hidden hide');if(Roo.isIE){this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')} +this.frameId=Roo.id();var B=this.owner.wrap.createChild({tag:'iframe',cls:'form-control',id:this.frameId,name:this.frameId,frameBorder:'no','src':Roo.SSL_SECURE_URL?Roo.SSL_SECURE_URL:"javascript:false"},this.el);this.iframe=B.dom;this.assignDocWin();this.doc.designMode='on'; +this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var C={run:function(){this.assignDocWin();if(this.doc.body||this.doc.readyState=='complete'){try{this.doc.designMode="on";}catch(e){return;}Roo.TaskMgr.stop(C);this.initEditor.defer(10,this); +}},interval:10,duration:10000,scope:this};Roo.TaskMgr.start(C);},onResize:function(w,h){Roo.log('resize: '+w+','+h);if(!this.iframe){return;}if(typeof w=='number'){this.iframe.style.width=w+'px';}if(typeof h=='number'){this.iframe.style.height=h+'px';if(this.doc){(this.doc.body||this.doc.documentElement).style.height=(h-(this.iframePad*2))+'px'; +}}},toggleSourceEdit:function(A){this.sourceEditMode=A===true;if(this.sourceEditMode){Roo.get(this.iframe).addClass(['x-hidden','hide']);}else{Roo.get(this.iframe).removeClass(['x-hidden','hide']);this.deferFocus();}},cleanHtml:function(A){A=String(A);if(A.length>5){if(Roo.isSafari){A=A.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,''); +}}if(A==' '){A='';}return A;},syncValue:function(){if(this.initialized){var bd=(this.doc.body||this.doc.documentElement);var A=bd.innerHTML;if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){A='
'+A+'
'; }}A=this.cleanHtml(A);A=A.replace(/[\uD800-\uDBFF][\uDC00-\uDFFF]|[\u0080-\uFFFF]/g,function(B){var cc=B.charCodeAt();if(B.length==2){var C=B.charCodeAt(0)-0xD800;var D=B.charCodeAt(1)-0xDC00;cc=(C*0x400)+D+0x10000;}else if((cc>=0x4E00&&cc<0xA000)||(cc>=0x3400&&cc<0x4E00)||(cc>=0xf900&&cc<0xfb00)){return B; }return "&#"+cc+";";});if(this.owner.fireEvent('beforesync',this,A)!==false){this.el.dom.value=A;this.owner.fireEvent('sync',this,A);}}},pushValue:function(){if(this.initialized){var v=this.el.dom.value.trim();if(this.owner.fireEvent('beforepush',this,v)!==false){var d=(this.doc.body||this.doc.documentElement); d.innerHTML=v;this.cleanUpPaste();this.el.dom.value=d.innerHTML;this.owner.fireEvent('push',this,v);}}},deferFocus:function(){this.focus.defer(10,this);},focus:function(){if(this.win&&!this.sourceEditMode){this.win.focus();}else{this.el.focus();}},assignDocWin:function(){var A=this.iframe; @@ -1835,7 +1835,7 @@ var D=ss==1;var E=ee==-1;if(D&&E){return 0;}if(!D&&E){return 1;}if(D&&!E){return i>-1;i--){this.cleanUpChild(n.childNodes[i]);}},cleanUpChild:function(A){var ed=this;if(A.nodeName=="#text"){return;}if(A.nodeName=="#comment"){A.parentNode.removeChild(A);return;}var B=A.tagName.toLowerCase();if(this.black.indexOf(B)>-1&&this.clearUp){A.parentNode.removeChild(A); return;}var C=Roo.HtmlEditorCore.remove.indexOf(A.tagName.toLowerCase())>-1;if((!A.attributes||!A.attributes.length)&&B=='span'){C=true;}if(C){this.cleanUpChildren(A);while(A.childNodes.length){var cn=A.childNodes[0];A.removeChild(cn);A.parentNode.insertBefore(cn,A); }A.parentNode.removeChild(A);return;}if(!A.attributes||!A.attributes.length){this.cleanUpChildren(A);return;}function cleanAttr(n,v){if(v.match(/^\./)||v.match(/^\//)){return;}if(v.match(/^(http|https):\/\//)||v.match(/^mailto:/)||v.match(/^ftp:/)){return; -}if(v.match(/^#/)){return;}A.removeAttribute(n);}var D=this.cwhite;var E=this.cblack;function cleanStyle(n,v){if(v.match(/expression/)){A.removeAttribute(n);return;}var F=v.split(/;/);var G=[];Roo.each(F,function(p){p=p.replace(/^\s+/g,'').replace(/\s+$/g,''); +}if(v.match(/^#/)){return;}if(v.match(/^\{/)){return;}A.removeAttribute(n);}var D=this.cwhite;var E=this.cblack;function cleanStyle(n,v){if(v.match(/expression/)){A.removeAttribute(n);return;}var F=v.split(/;/);var G=[];Roo.each(F,function(p){p=p.replace(/^\s+/g,'').replace(/\s+$/g,''); if(!p.length){return true;}var l=p.split(':').shift().replace(/\s+/g,'');l=l.replace(/^\s+/g,'').replace(/\s+$/g,'');if(D.length&&E.indexOf(l)>-1){return true;}if(D.length&&D.indexOf(l)<0){return true;}G.push(p);return true;});if(G.length){A.setAttribute(n,G.join(';')); }else{A.removeAttribute(n);}}for(var i=A.attributes.length-1;i>-1;i--){var a=A.attributes[i];if(a.name.toLowerCase().substr(0,2)=='on'){A.removeAttribute(a.name);continue;}if(Roo.HtmlEditorCore.ablack.indexOf(a.name.toLowerCase())>-1){A.removeAttribute(a.name); continue;}if(Roo.HtmlEditorCore.aclean.indexOf(a.name.toLowerCase())>-1){cleanAttr(a.name,a.value);continue;}if(a.name=='style'){cleanStyle(a.name,a.value);continue;}if(a.name=='class'){if(a.value.match(/^Mso/)){A.removeAttribute('class');}if(a.value.match(/^body$/)){A.removeAttribute('class'); diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index 157945ee55..14e2331430 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -3,15 +3,17 @@ * */ -Roo.bootstrap.version = ( - function() { - var ret=3; - Roo.each(document.styleSheets, function(s) { - if ( s.href && s.href.match(/css-bootstrap4/)) { - ret=4; - } - }); - return ret; +Roo.bootstrap.version = ( function() { + var ret=3; + Roo.each(document.styleSheets, function(s) { + if ( s.href && s.href.match(/css-bootstrap4/)) { + ret=4; + } + }); + if (ret > 3) { + Roo.Element.prototype.visibilityMode = Roo.Element.DISPLAY; + } + return ret; })(); /* * Based on: * Ext JS Library 1.1.1 @@ -981,6 +983,7 @@ Roo.extend(Roo.bootstrap.ButtonGroup, Roo.bootstrap.Component, { * @cfg {Boolean} preventDefault default true (stop click event triggering the URL if it's a link.) * @cfg {Boolean} removeClass remove the standard class.. * @cfg {String} target (_self|_blank|_parent|_top|other) target for a href. + * @cfg {Boolean} grpup if parent is a btn group - then it turns it into a toogleGroup. * * @constructor * Create a new button @@ -995,11 +998,18 @@ Roo.bootstrap.Button = function(config){ // raw events /** * @event click - * When a butotn is pressed + * When a button is pressed * @param {Roo.bootstrap.Button} btn * @param {Roo.EventObject} e */ "click" : true, + /** + * @event dblclick + * When a button is double clicked + * @param {Roo.bootstrap.Button} btn + * @param {Roo.EventObject} e + */ + "dblclick" : true, /** * @event toggle * After the button has been toggles @@ -1036,6 +1046,7 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component, { removeClass: false, name: false, target: false, + group : false, pressed : null, @@ -1263,17 +1274,30 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component, { } - if (this.el.hasClass('roo-button')) { + if (this.el.hasClass('roo-button')) { + this.el.on('click', this.onClick, this); + this.el.on('dblclick', this.onDblClick, this); + } else { + this.el.select('.roo-button').on('click', this.onClick, this); + this.el.select('.roo-button').on('dblclick', this.onDblClick, this); + + } + // why? + if(this.removeClass){ this.el.on('click', this.onClick, this); - } else { - this.el.select('.roo-button').on('click', this.onClick, this); - } - - if(this.removeClass){ - this.el.on('click', this.onClick, this); - } - - this.el.enableDisplayMode(); + } + + if (this.group === true) { + if (this.pressed === false || this.pressed === true) { + // nothing + } else { + this.pressed = false; + this.setActive(this.pressed); + } + + } + + this.el.enableDisplayMode(); }, onClick : function(e) @@ -1287,6 +1311,25 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component, { e.preventDefault(); } + if (this.group) { + if (this.pressed) { + // do nothing - + return; + } + this.setActive(true); + var pi = this.parent().items; + for (var i = 0;i < pi.length;i++) { + if (this == pi[i]) { + continue; + } + if (pi[i].el.hasClass('roo-button')) { + pi[i].setActive(false); + } + } + this.fireEvent('click', this, e); + return; + } + if (this.pressed === true || this.pressed === false) { this.toggleActive(e); } @@ -1294,7 +1337,16 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component, { this.fireEvent('click', this, e); }, - + onDblClick: function(e) + { + if (this.disabled) { + return; + } + if(this.preventDefault){ + e.preventDefault(); + } + this.fireEvent('dblclick', this, e); + }, /** * Enables this button */ @@ -1326,8 +1378,8 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component, { */ toggleActive : function(e) { - this.setActive(!this.pressed); - this.fireEvent('toggle', this, e, !this.pressed); + this.setActive(!this.pressed); // this modifies pressed... + this.fireEvent('toggle', this, e, this.pressed); }, /** * get the current active state @@ -1897,6 +1949,7 @@ Roo.extend(Roo.bootstrap.Container, Roo.bootstrap.Component, { * @cfg {String} header_image src url of image. * @cfg {String|Object} header * @cfg {Number} header_size (0|1|2|3|4|5) H1 or H2 etc.. 0 indicates default + * @cfg {Number} header_weight (primary|secondary|success|info|warning|danger|light|dark) * * @cfg {String} title * @cfg {String} subtitle @@ -1914,7 +1967,7 @@ Roo.extend(Roo.bootstrap.Container, Roo.bootstrap.Component, { * @cfg {String} margin_y (0|1|2|3|4|5|auto) * * @cfg {String} padding (0|1|2|3|4|5) - * @cfg {String} padding_top (0|1|2|3|4|5) + * @cfg {String} padding_top (0|1|2|3|4|5)next_to_card * @cfg {String} padding_bottom (0|1|2|3|4|5) * @cfg {String} padding_left (0|1|2|3|4|5) * @cfg {String} padding_right (0|1|2|3|4|5) @@ -1950,11 +2003,13 @@ Roo.bootstrap.Card = function(config){ /** * @event drop * When a element a card is dropped - * @param {Roo.bootstrap.Element} this - * @param {Roo.Element} n the node being dropped? - * @param {Object} dd Drag and drop data - * @param {Roo.EventObject} e - * @param {Roo.EventObject} data the data passed via getDragData + * @param {Roo.bootstrap.Card} this + * + * + * @param {Roo.bootstrap.Card} move_card the card being dropped? + * @param {String} position 'above' or 'below' + * @param {Roo.bootstrap.Card} next_to_card What card position is relative to of 'false' for empty list. + */ 'drop' : true, /** @@ -2016,6 +2071,10 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { drop_group : false, childContainer : false, dropEl : false, /// the dom placeholde element that indicates drop location. + containerEl: false, // body container + bodyEl: false, // card-body + headerContainerEl : false, // + headerEl : false, layoutCls : function() { @@ -2035,7 +2094,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { ['', 'xs', 'sm', 'lg', 'xl'].forEach(function(v) { if (('' + t['display' + (v.length ? '_' : '') + v]).length) { - cls += ' d' + (v.length ? '-' : '') + v + '-' + t['margin' + (v.length ? '_' : '') + v] + cls += ' d' + (v.length ? '-' : '') + v + '-' + t['display' + (v.length ? '_' : '') + v] } }); @@ -2088,14 +2147,14 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { cfg.cls += ' bg-' + this.weight; } - cfg.cls += this.layoutCls(); + cfg.cls += ' ' + this.layoutCls(); var hdr = false; var hdr_ctr = false; if (this.header.length) { hdr = { tag : this.header_size > 0 ? 'h' + this.header_size : 'div', - cls : 'card-header', + cls : 'card-header ' + (this.header_weight ? 'bg-' + this.header_weight : ''), cn : [] }; cfg.cn.push(hdr); @@ -2103,7 +2162,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { } else { hdr = { tag : 'div', - cls : 'card-header d-none', + cls : 'card-header d-none ' + (this.header_weight ? 'bg-' + this.header_weight : ''), cn : [] }; cfg.cn.push(hdr); @@ -2245,8 +2304,8 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { initEvents: function() { - - this.bodyEl = this.getChildContainer(); + this.bodyEl = this.el.select('.card-body',true).first(); + this.containerEl = this.getChildContainer(); if(this.dragable){ this.dragZone = new Roo.dd.DragZone(this.getEl(), { containerScroll: true, @@ -2276,7 +2335,8 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { this.footerEl = this.el.select('.card-footer').first(); this.collapsableToggleEl = this.el.select('.roo-collapse-toggle'); - this.headerEl = this.el.select('.roo-card-header-ctr').first(); + this.headerContainerEl = this.el.select('.roo-card-header-ctr').first(); + this.headerEl = this.el.select('.card-header',true).first(); if (this.rotated) { this.el.addClass('roo-card-rotated'); @@ -2313,7 +2373,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { getTargetFromEvent : function(e, dragged_card_el) { var target = e.getTarget(); - while ((target !== null) && (target.parentNode != this.bodyEl.dom)) { + while ((target !== null) && (target.parentNode != this.containerEl.dom)) { target = target.parentNode; } @@ -2425,22 +2485,50 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { if (info === false) { return false; } - - if (this.fireEvent("drop", this, n, dd, e, data) === false) { + this.dropPlaceHolder('hide'); + + + + + + this.acceptCard(data.source, info.position, info.card, info.items_n); + return true; + + }, + firstChildCard : function() + { + for (var i = 0;i< this.items.length;i++) { + + if (!this.items[i].el.hasClass('card')) { + continue; + } + return this.items[i]; + } + return this.items.length ? this.items[this.items.length-1] : false; // don't try and put stuff after the cards... + }, + /** + * accept card + * + * - card.acceptCard(move_card, info.position, info.card, info.items_n); + */ + acceptCard : function(move_card, position, next_to_card ) + { + if (this.fireEvent("drop", this, move_card, position, next_to_card) === false) { return false; } - - this.dropPlaceHolder('hide'); - // do the dom manipulation first.. - var dom = data.source.el.dom; - dom.parentNode.removeChild(dom); + var to_items_n = next_to_card ? this.items.indexOf(next_to_card) : 0; + move_card.parent().removeCard(move_card); - if (info.card !== true) { - var cardel = info.card.el.dom; + + var dom = move_card.el.dom; + dom.style.width = ''; // clear with - which is set by drag. + + if (next_to_card !== false && next_to_card !== true && next_to_card.el.dom.parentNode) { + var cardel = next_to_card.el.dom; - if (info.position == 'above') { + if (position == 'above' ) { cardel.parentNode.insertBefore(dom, cardel); } else if (cardel.nextSibling) { cardel.parentNode.insertBefore(dom,cardel.nextSibling); @@ -2449,42 +2537,49 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { } } else { // card container??? - this.bodyEl.dom.append(dom); + this.containerEl.dom.append(dom); } //FIXME HANDLE card = true // add this to the correct place in items. - - // remove Card from items. - var old_parent = data.source.parent(); - - old_parent.items = old_parent.items.filter(function(e) { return e != data.source }); - + if (this.items.length) { var nitems = []; //Roo.log([info.items_n, info.position, this.items.length]); for (var i =0; i < this.items.length; i++) { - if (i == info.items_n && info.position == 'above') { - nitems.push(data.source); + if (i == to_items_n && position == 'above') { + nitems.push(move_card); } nitems.push(this.items[i]); - if (i == info.items_n && info.position == 'below') { - nitems.push(data.source); + if (i == to_items_n && position == 'below') { + nitems.push(move_card); } } this.items = nitems; Roo.log(this.items); } else { - this.items.push(data.source); + this.items.push(move_card); } - data.source.parentId = this.id; + move_card.parentId = this.id; return true; + + + }, + removeCard : function(c) + { + this.items = this.items.filter(function(e) { return e != c }); + + var dom = c.el.dom; + dom.parentNode.removeChild(dom); + dom.style.width = ''; // clear with - which is set by drag. + c.parentId = false; + }, /** Decide whether to drop above or below a View node. */ @@ -2493,7 +2588,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { if (dd) { return false; } - if (n == this.bodyEl.dom) { + if (n == this.containerEl.dom) { return "above"; } var t = Roo.lib.Dom.getY(n), b = t + n.offsetHeight; @@ -2545,7 +2640,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { dropPlaceHolder: function (action, info, data) { if (this.dropEl === false) { - this.dropEl = Roo.DomHelper.append(this.bodyEl, { + this.dropEl = Roo.DomHelper.append(this.containerEl, { cls : 'd-none' },true); } @@ -2570,7 +2665,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { } } else { // card container??? - this.bodyEl.dom.append(this.dropEl.dom); + this.containerEl.dom.append(this.dropEl.dom); } this.dropEl.addClass('d-block roo-card-dropzone'); @@ -2584,7 +2679,7 @@ Roo.extend(Roo.bootstrap.Card, Roo.bootstrap.Component, { }, setHeaderText: function(html) { - this.headerEl.dom.innerHTML = html; + this.headerContainerEl.dom.innerHTML = html; } @@ -4017,7 +4112,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component, { { // we will default to modal-body-overflow - might need to remove or make optional later. var bdy = { - cls : 'modal-body enable-modal-body-overflow ', + cls : 'modal-body ' + (this.fitwindow ? 'overflow-auto' : ''), html : this.html || '' }; @@ -4136,8 +4231,8 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component, { this.headerEditEl = this.headerEl.select('.form-control',true).first(); this.headerEl.on('click', function() { this.toggleHeaderInput(true) } , this); this.headerEditEl.on('keyup', function(e) { - if(e.isNavKeyPress()){ - this.toggleHeaderInput(false) + if([ e.RETURN , e.TAB , e.ESC ].indexOf(e.keyCode) > -1) { + this.toggleHeaderInput(false) } }, this); this.headerEditEl.on('blur', function(e) { @@ -4213,7 +4308,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component, { if (!this.rendered) { this.render(); } - + this.toggleHeaderInput(false); //this.el.setStyle('display', 'block'); this.el.removeClass('hideing'); this.el.dom.style.display='block'; @@ -4434,7 +4529,9 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component, { }, toggleHeaderInput : function(is_edit) { - + if (!this.editableTitle) { + return; // not editable. + } if (is_edit && this.is_header_editing) { return; // already editing.. } @@ -6509,6 +6606,142 @@ Roo.extend(Roo.bootstrap.NavSidebarItem, Roo.bootstrap.NavItem, { }); + /* + * - LGPL + * + * Breadcrumb Nav + * + */ +Roo.namespace('Roo.bootstrap.breadcrumb'); + + +/** + * @class Roo.bootstrap.breadcrumb.Nav + * @extends Roo.bootstrap.Component + * Bootstrap Breadcrumb Nav Class + * + * @children Roo.bootstrap.breadcrumb.Item + * + * @constructor + * Create a new breadcrumb.Nav + * @param {Object} config The config object + */ + + +Roo.bootstrap.breadcrumb.Nav = function(config){ + Roo.bootstrap.breadcrumb.Nav.superclass.constructor.call(this, config); + + +}; + +Roo.extend(Roo.bootstrap.breadcrumb.Nav, Roo.bootstrap.Component, { + + getAutoCreate : function() + { + + var cfg = { + tag: 'nav', + cn : [ + { + tag : 'ol', + cls : 'breadcrumb' + } + ] + + }; + + return cfg; + }, + + initEvents: function() + { + this.olEl = this.el.select('ol',true).first(); + }, + getChildContainer : function() + { + return this.olEl; + } + +}); + + /* + * - LGPL + * + * Breadcrumb Item + * + */ + + +/** + * @class Roo.bootstrap.breadcrumb.Nav + * @extends Roo.bootstrap.Component + * Bootstrap Breadcrumb Nav Class + * + * @children Roo.bootstrap.breadcrumb.Component + * @cfg {String} html the content of the link. + * @cfg {String} href where it links to if '#' is used the link will be handled by onClick. + * @cfg {Boolean} active is it active + + * + * @constructor + * Create a new breadcrumb.Nav + * @param {Object} config The config object + */ + +Roo.bootstrap.breadcrumb.Item = function(config){ + Roo.bootstrap.breadcrumb.Item.superclass.constructor.call(this, config); + this.addEvents({ + // img events + /** + * @event click + * The img click event for the img. + * @param {Roo.EventObject} e + */ + "click" : true + }); + +}; + +Roo.extend(Roo.bootstrap.breadcrumb.Item, Roo.bootstrap.Component, { + + href: false, + html : '', + + getAutoCreate : function() + { + + var cfg = { + tag: 'li', + cls : 'breadcrumb-item' + (this.active ? ' active' : '') + }; + if (this.href !== false) { + cfg.cn = [{ + tag : 'a', + href : this.href, + html : this.html + }]; + } else { + cfg.html = this.html; + } + + return cfg; + }, + + initEvents: function() + { + if (this.href) { + this.el.select('a', true).first().on('click',this.onClick, this) + } + + }, + onClick : function(e) + { + e.preventDefault(); + this.fireEvent('click',this, e); + } + +}); + /* * - LGPL * @@ -8241,6 +8474,9 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component, { record = ds.getAt(index); }else{ index = ds.indexOf(record); + if (index < 0) { + return; // should not happen - but seems to + } } this.insertRow(ds, index, true); this.autoSize(); @@ -8494,6 +8730,7 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component, { var tfd = this.getGridEl().select('tfoot', true).first(); var cw = ctr.getWidth(); + this.getGridEl().select('tfoot tr, tfoot td',true).setWidth(cw); if (tbd) { @@ -8507,7 +8744,8 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component, { cw -= barsize; } cw = Math.max(cw, this.totalWidth); - this.getGridEl().select('tr',true).setWidth(cw); + this.getGridEl().select('tbody tr',true).setWidth(cw); + // resize 'expandable coloumn? return; // we doe not have a view in this design.. @@ -10165,7 +10403,7 @@ Roo.form.VTypes = function(){ * @extends Roo.bootstrap.Component * Bootstrap Input class * @cfg {Boolean} disabled is it disabled - * @cfg {String} inputType button | checkbox | email | file | hidden | image | number | password | radio | range | reset | search | submit | text + * @cfg {String} (button|checkbox|email|file|hidden|image|number|password|radio|range|reset|search|submit|text) inputType * @cfg {String} name name of the input * @cfg {string} fieldLabel - the label associated * @cfg {string} placeholder - placeholder to put in text. @@ -10439,6 +10677,9 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { placeholder : this.placeholder || '', autocomplete : this.autocomplete || 'new-password' }; + if (this.inputType == 'file') { + input.style = 'overflow:hidden'; // why not in CSS? + } if(this.capture.length){ input.capture = this.capture; @@ -10517,7 +10758,7 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { inputblock.cn.push({ tag :'span', - cls : 'roo-input-before input-group-prepend input-group-text input-group-' + + cls : 'roo-input-before input-group-prepend input-group-' + (this.before.xtype == 'Button' ? 'btn' : 'addon') //?? what about checkboxes - that looks like a bit of a hack thought? }); } @@ -10536,7 +10777,7 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { inputblock.cn.push({ tag :'span', - cls : 'roo-input-after input-group-append input-group-text input-group-' + + cls : 'roo-input-after input-group-append input-group-' + (this.after.xtype == 'Button' ? 'btn' : 'addon') //?? what about checkboxes - that looks like a bit of a hack thought? }); } @@ -10551,11 +10792,8 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { cls : 'roo-required-indicator ' + (this.indicatorpos == 'right' ? 'right' : 'left') +'-indicator text-danger fa fa-lg fa-star', tooltip : 'This field is required' }; - if (Roo.bootstrap.version == 4) { - indicator = { - tag : 'i', - style : 'display-none' - }; + if (this.allowBlank ) { + indicator.style = this.allowBlank ? ' display:none' : ''; } if (align ==='left' && this.fieldLabel.length) { @@ -10640,11 +10878,14 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { } else if ( this.fieldLabel.length) { + + cfg.cn = [ { tag : 'i', cls : 'roo-required-indicator left-indicator text-danger fa fa-lg fa-star', - tooltip : 'This field is required' + tooltip : 'This field is required', + style : this.allowBlank ? ' display:none' : '' }, { tag: 'label', @@ -10658,7 +10899,7 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { ]; if(this.indicatorpos == 'right'){ - + cfg.cn = [ { tag: 'label', @@ -10669,7 +10910,8 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component, { { tag : 'i', cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star', - tooltip : 'This field is required' + tooltip : 'This field is required', + style : this.allowBlank ? ' display:none' : '' }, inputblock @@ -12100,7 +12342,7 @@ Roo.extend(Roo.bootstrap.TriggerField, Roo.bootstrap.Input, { { this.list = Roo.get(document.body).createChild({ tag: Roo.bootstrap.version == 4 ? 'div' : 'ul', - cls: 'typeahead typeahead-long dropdown-menu', + cls: 'typeahead typeahead-long dropdown-menu shadow', style: 'display:none' }); @@ -14658,6 +14900,7 @@ Roo.extend(Roo.data.ArrayReader, Roo.data.JsonReader, { * @cfg {Boolean} emptyResultText only for touch device * @cfg {String} triggerText multiple combobox trigger button text default 'Select' * @cfg {String} emptyTitle default '' + * @cfg {Number} width fixed with? experimental * @constructor * Create a new ComboBox. * @param {Object} config Configuration options @@ -14984,6 +15227,7 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { emptyResultText: 'Empty', triggerText : 'Select', emptyTitle : '', + width : false, // element that contains real text value.. (when hidden is used..) @@ -15207,7 +15451,9 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { if(this.labelWidth > 12){ labelCfg.style = "width: " + this.labelWidth + 'px'; } - + if(this.width * 1 > 0){ + contentCfg.style = "width: " + this.width + 'px'; + } if(this.labelWidth < 13 && this.labelmd == 0){ this.labelmd = this.labelWidth; } @@ -15722,7 +15968,10 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { }, // private - onResize: function(w, h){ + onResize: function(w, h) + { + + // Roo.bootstrap.ComboBox.superclass.onResize.apply(this, arguments); // // if(typeof w != 'number'){ @@ -16841,7 +17090,7 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { } var inputblock = { - cls : '', + cls : 'roo-combobox-wrap', cn : [ input ] @@ -16978,7 +17227,7 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { }, { - cls : '', + cls : 'roo-combobox-wrap ', cn: [ combobox ] @@ -17008,7 +17257,7 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { ] }, { - cls : "", + cls : "roo-combobox-wrap ", cn: [ combobox ] @@ -17025,7 +17274,7 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { if(this.labelWidth > 12){ labelCfg.style = "width: " + this.labelWidth + 'px'; } - + if(this.labelWidth < 13 && this.labelmd == 0){ this.labelmd = this.labelWidth; } @@ -17226,9 +17475,9 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { if(this.animate){ var _this = this; - (function(){ _this.touchViewEl.addClass('in'); }).defer(50); + (function(){ _this.touchViewEl.addClass(['in','show']); }).defer(50); }else{ - this.touchViewEl.addClass('in'); + this.touchViewEl.addClass(['in','show']); } if(this._touchViewMask){ @@ -17244,7 +17493,7 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, { hideTouchView : function() { - this.touchViewEl.removeClass('in'); + this.touchViewEl.removeClass(['in','show']); if(this.animate){ var _this = this; @@ -20172,6 +20421,7 @@ Roo.apply(Roo.bootstrap.TabGroup, { * @cfg {String} tabId unique tab ID (will be autogenerated if not set. - used to match TabItem to Panel) * @cfg {String} navId The Roo.bootstrap.NavGroup which triggers show hide () * @cfg {String} href click to link.. + * @cfg {Boolean} touchSlide if swiping slides tab to next panel (default off) * * * @constructor @@ -20211,7 +20461,7 @@ Roo.extend(Roo.bootstrap.TabPanel, Roo.bootstrap.Component, { tabId: false, navId : false, href : '', - + touchSlide : false, getAutoCreate : function(){ @@ -20256,7 +20506,7 @@ Roo.extend(Roo.bootstrap.TabPanel, Roo.bootstrap.Component, { this.el.on('click', this.onClick, this); - if(Roo.isTouch){ + if(Roo.isTouch && this.touchSlide){ this.el.on("touchstart", this.onTouchStart, this); this.el.on("touchmove", this.onTouchMove, this); this.el.on("touchend", this.onTouchEnd, this); @@ -21428,7 +21678,7 @@ Roo.apply(Roo.bootstrap.DateField, { template : { tag: 'div', - cls: 'datepicker dropdown-menu roo-dynamic', + cls: 'datepicker dropdown-menu roo-dynamic shadow', cn: [ { tag: 'div', @@ -23382,7 +23632,6 @@ Roo.extend(Roo.bootstrap.SecurePass, Roo.bootstrap.Input, { // private validateValue: function (value) { - if (!Roo.bootstrap.SecurePass.superclass.validateValue.call(this, value)) { return false; } @@ -23401,7 +23650,7 @@ Roo.extend(Roo.bootstrap.SecurePass, Roo.bootstrap.Input, { return true; } - if ('[\x21-\x7e]*'.match(value)) { + if (!value.match(/[\x21-\x7e]+/)) { this.markInvalid(this.errors.PwdBadChar); this.errorMsg = this.errors.PwdBadChar; return false; @@ -23706,10 +23955,11 @@ Roo.extend(Roo.HtmlEditorCore, Roo.Component, { st = ''; - } else { - st = ''; + } else { + for (var i in this.stylesheets) { + st += ''; + } + } st += '';}else{st='';}st+=''; -var A='roo-htmleditor-body';if(this.bodyCls.length){A+=' '+this.bodyCls;}return ''+st+' ';},onRender:function(ct,A){var _t=this;this.el=this.owner.inputEl?this.owner.inputEl():this.owner.el; -this.el.dom.style.border='0 none';this.el.dom.setAttribute('tabIndex',-1);this.el.addClass('x-hidden hide');if(Roo.isIE){this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')}this.frameId=Roo.id();var B=this.owner.wrap.createChild({tag:'iframe',cls:'form-control',id:this.frameId,name:this.frameId,frameBorder:'no','src':Roo.SSL_SECURE_URL?Roo.SSL_SECURE_URL:"javascript:false"} -,this.el);this.iframe=B.dom;this.assignDocWin();this.doc.designMode='on';this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var C={run:function(){this.assignDocWin();if(this.doc.body||this.doc.readyState=='complete'){try{this.doc.designMode="on"; -}catch(e){return;}Roo.TaskMgr.stop(C);this.initEditor.defer(10,this);}},interval:10,duration:10000,scope:this};Roo.TaskMgr.start(C);},onResize:function(w,h){Roo.log('resize: '+w+','+h);if(!this.iframe){return;}if(typeof w=='number'){this.iframe.style.width=w+'px'; -}if(typeof h=='number'){this.iframe.style.height=h+'px';if(this.doc){(this.doc.body||this.doc.documentElement).style.height=(h-(this.iframePad*2))+'px';}}},toggleSourceEdit:function(A){this.sourceEditMode=A===true;if(this.sourceEditMode){Roo.get(this.iframe).addClass(['x-hidden','hide']); -}else{Roo.get(this.iframe).removeClass(['x-hidden','hide']);this.deferFocus();}},cleanHtml:function(A){A=String(A);if(A.length>5){if(Roo.isSafari){A=A.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,'');}}if(A==' '){A='';}return A; -},syncValue:function(){if(this.initialized){var bd=(this.doc.body||this.doc.documentElement);var A=bd.innerHTML;if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){A='
'+A+'
'; +});}else if(!this.stylesheets.length){st='';}else{for(var i in this.stylesheets){st+='';} +}st+='';var A='roo-htmleditor-body';if(this.bodyCls.length){A+=' '+this.bodyCls;}return ''+st+' '; +},onRender:function(ct,A){var _t=this;this.el=this.owner.inputEl?this.owner.inputEl():this.owner.el;this.el.dom.style.border='0 none';this.el.dom.setAttribute('tabIndex',-1);this.el.addClass('x-hidden hide');if(Roo.isIE){this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')} +this.frameId=Roo.id();var B=this.owner.wrap.createChild({tag:'iframe',cls:'form-control',id:this.frameId,name:this.frameId,frameBorder:'no','src':Roo.SSL_SECURE_URL?Roo.SSL_SECURE_URL:"javascript:false"},this.el);this.iframe=B.dom;this.assignDocWin();this.doc.designMode='on'; +this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var C={run:function(){this.assignDocWin();if(this.doc.body||this.doc.readyState=='complete'){try{this.doc.designMode="on";}catch(e){return;}Roo.TaskMgr.stop(C);this.initEditor.defer(10,this); +}},interval:10,duration:10000,scope:this};Roo.TaskMgr.start(C);},onResize:function(w,h){Roo.log('resize: '+w+','+h);if(!this.iframe){return;}if(typeof w=='number'){this.iframe.style.width=w+'px';}if(typeof h=='number'){this.iframe.style.height=h+'px';if(this.doc){(this.doc.body||this.doc.documentElement).style.height=(h-(this.iframePad*2))+'px'; +}}},toggleSourceEdit:function(A){this.sourceEditMode=A===true;if(this.sourceEditMode){Roo.get(this.iframe).addClass(['x-hidden','hide']);}else{Roo.get(this.iframe).removeClass(['x-hidden','hide']);this.deferFocus();}},cleanHtml:function(A){A=String(A);if(A.length>5){if(Roo.isSafari){A=A.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,''); +}}if(A==' '){A='';}return A;},syncValue:function(){if(this.initialized){var bd=(this.doc.body||this.doc.documentElement);var A=bd.innerHTML;if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){A='
'+A+'
'; }}A=this.cleanHtml(A);A=A.replace(/[\uD800-\uDBFF][\uDC00-\uDFFF]|[\u0080-\uFFFF]/g,function(B){var cc=B.charCodeAt();if(B.length==2){var C=B.charCodeAt(0)-0xD800;var D=B.charCodeAt(1)-0xDC00;cc=(C*0x400)+D+0x10000;}else if((cc>=0x4E00&&cc<0xA000)||(cc>=0x3400&&cc<0x4E00)||(cc>=0xf900&&cc<0xfb00)){return B; }return "&#"+cc+";";});if(this.owner.fireEvent('beforesync',this,A)!==false){this.el.dom.value=A;this.owner.fireEvent('sync',this,A);}}},pushValue:function(){if(this.initialized){var v=this.el.dom.value.trim();if(this.owner.fireEvent('beforepush',this,v)!==false){var d=(this.doc.body||this.doc.documentElement); d.innerHTML=v;this.cleanUpPaste();this.el.dom.value=d.innerHTML;this.owner.fireEvent('push',this,v);}}},deferFocus:function(){this.focus.defer(10,this);},focus:function(){if(this.win&&!this.sourceEditMode){this.win.focus();}else{this.el.focus();}},assignDocWin:function(){var A=this.iframe; @@ -1035,7 +1049,7 @@ var D=ss==1;var E=ee==-1;if(D&&E){return 0;}if(!D&&E){return 1;}if(D&&!E){return i>-1;i--){this.cleanUpChild(n.childNodes[i]);}},cleanUpChild:function(A){var ed=this;if(A.nodeName=="#text"){return;}if(A.nodeName=="#comment"){A.parentNode.removeChild(A);return;}var B=A.tagName.toLowerCase();if(this.black.indexOf(B)>-1&&this.clearUp){A.parentNode.removeChild(A); return;}var C=Roo.HtmlEditorCore.remove.indexOf(A.tagName.toLowerCase())>-1;if((!A.attributes||!A.attributes.length)&&B=='span'){C=true;}if(C){this.cleanUpChildren(A);while(A.childNodes.length){var cn=A.childNodes[0];A.removeChild(cn);A.parentNode.insertBefore(cn,A); }A.parentNode.removeChild(A);return;}if(!A.attributes||!A.attributes.length){this.cleanUpChildren(A);return;}function cleanAttr(n,v){if(v.match(/^\./)||v.match(/^\//)){return;}if(v.match(/^(http|https):\/\//)||v.match(/^mailto:/)||v.match(/^ftp:/)){return; -}if(v.match(/^#/)){return;}A.removeAttribute(n);}var D=this.cwhite;var E=this.cblack;function cleanStyle(n,v){if(v.match(/expression/)){A.removeAttribute(n);return;}var F=v.split(/;/);var G=[];Roo.each(F,function(p){p=p.replace(/^\s+/g,'').replace(/\s+$/g,''); +}if(v.match(/^#/)){return;}if(v.match(/^\{/)){return;}A.removeAttribute(n);}var D=this.cwhite;var E=this.cblack;function cleanStyle(n,v){if(v.match(/expression/)){A.removeAttribute(n);return;}var F=v.split(/;/);var G=[];Roo.each(F,function(p){p=p.replace(/^\s+/g,'').replace(/\s+$/g,''); if(!p.length){return true;}var l=p.split(':').shift().replace(/\s+/g,'');l=l.replace(/^\s+/g,'').replace(/\s+$/g,'');if(D.length&&E.indexOf(l)>-1){return true;}if(D.length&&D.indexOf(l)<0){return true;}G.push(p);return true;});if(G.length){A.setAttribute(n,G.join(';')); }else{A.removeAttribute(n);}}for(var i=A.attributes.length-1;i>-1;i--){var a=A.attributes[i];if(a.name.toLowerCase().substr(0,2)=='on'){A.removeAttribute(a.name);continue;}if(Roo.HtmlEditorCore.ablack.indexOf(a.name.toLowerCase())>-1){A.removeAttribute(a.name); continue;}if(Roo.HtmlEditorCore.aclean.indexOf(a.name.toLowerCase())>-1){cleanAttr(a.name,a.value);continue;}if(a.name=='style'){cleanStyle(a.name,a.value);continue;}if(a.name=='class'){if(a.value.match(/^Mso/)){A.removeAttribute('class');}if(a.value.match(/^body$/)){A.removeAttribute('class'); @@ -1087,6 +1101,14 @@ i++){E.push(this.editor.btns[i]);}}this.xtype='NavSimplebar';for(var i=0;i{0}',this.placeholder||'');}else{this.markdownEl.dom.innerHTML=Roo.Markdown.toHtml(Roo.util.Format.htmlEncode(this.getValue())); +}this.markdownEl.on('click',this.toggleTextEdit,this);this.on('blur',this.toggleTextEdit,this);this.on('specialkey',this.resizeTextArea,this);},toggleTextEdit:function(){var sh=this.markdownEl.getHeight();this.inputEl().addClass('d-none');this.markdownEl.addClass('d-none'); +if(!this.editing){this.inputEl().setHeight(Math.min(500,Math.max(sh,(this.getValue().split("\n").length+1)*30)));this.inputEl().removeClass('d-none');this.inputEl().focus();this.editing=true;return;}this.updateMarkdown();this.markdownEl.removeClass('d-none'); +this.editing=false;return;},updateMarkdown:function(){if(this.getValue()==''){this.markdownEl.dom.innerHTML=String.format('{0}',this.placeholder||'');return;}this.markdownEl.dom.innerHTML=Roo.Markdown.toHtml(Roo.util.Format.htmlEncode(this.getValue())); +},resizeTextArea:function(){var sh=100;Roo.log([sh,this.getValue().split("\n").length*30]);this.inputEl().setHeight(Math.min(500,Math.max(sh,(this.getValue().split("\n").length+1)*30)));},setValue:function(A){Roo.bootstrap.TextArea.prototype.setValue.call(this,A); +if(!this.editing){this.updateMarkdown();}},focus:function(){if(!this.editing){this.toggleTextEdit();}}}); // Roo/bootstrap/Table/AbstractSelectionModel.js Roo.bootstrap.Table.AbstractSelectionModel=function(){this.locked=false;Roo.bootstrap.Table.AbstractSelectionModel.superclass.constructor.call(this);};Roo.extend(Roo.bootstrap.Table.AbstractSelectionModel,Roo.util.Observable,{init:function(A){this.grid=A;this.initEvents(); },lock:function(){this.locked=true;},unlock:function(){this.locked=false;},isLocked:function(){return this.locked;},initEvents:function(){}}); @@ -1183,13 +1205,15 @@ Roo.get(document).on('mouseout',this.leave,this);this.currentTip=new Roo.bootstr }}if(this.currentTip.el){this.currentTip.el.setVisibilityMode(Roo.Element.DISPLAY).hide();}if(!el||el.dom==document){return;}var B=el;if(!el.attr('tooltip')){if(!el.select("[tooltip]").elements.length){return;}B=el.select("[tooltip]").first();var xy=ev.getXY(); if(!B.getRegion().contains({top:xy[1],right:xy[0],bottom:xy[1],left:xy[0]})){return;}}this.currentEl=B;this.currentTip.bind(B);this.currentRegion=Roo.lib.Region.getRegion(A);this.currentTip.enter();},leave:function(ev){var A=ev.getTarget();if(!this.currentEl){return; }if(A!=this.currentEl.dom){return;}var xy=ev.getXY();if(this.currentRegion.contains(new Roo.lib.Region(xy[1],xy[0],xy[1],xy[0]))){return;}if(this.currentTip){this.currentTip.leave();}this.currentEl=false;},alignment:{'left':['r-l',[-2,0],'right'],'right':['l-r',[2,0],'left'],'bottom':['t-b',[0,2],'top'],'top':['b-t',[0,-2],'bottom']} -});Roo.extend(Roo.bootstrap.Tooltip,Roo.bootstrap.Component,{bindEl:false,delay:null,timeout:null,hoverState:null,placement:'bottom',alignment:false,getAutoCreate:function(){var A={cls:'tooltip',role:'tooltip',cn:[{cls:'tooltip-arrow'},{cls:'tooltip-inner'} -]};return A;},bind:function(el){this.bindEl=el;},enter:function(){if(this.timeout!=null){clearTimeout(this.timeout);}this.hoverState='in';if(!this.delay||!this.delay.show){this.show();return;}var _t=this;this.timeout=setTimeout(function(){if(_t.hoverState=='in'){_t.show(); -}},this.delay.show);},leave:function(){clearTimeout(this.timeout);this.hoverState='out';if(!this.delay||!this.delay.hide){this.hide();return;}var _t=this;this.timeout=setTimeout(function(){if(_t.hoverState=='out'){_t.hide();Roo.bootstrap.Tooltip.currentEl=false; -}},delay);},show:function(A){if(!this.el){this.render(document.body);}var B=A||this.bindEl.attr('tooltip')||this.bindEl.select("[tooltip]").first().attr('tooltip');this.el.select('.tooltip-inner',true).first().dom.innerHTML=B;this.el.removeClass(['fade','top','bottom','left','right','in']); -var C=typeof this.placement=='function'?this.placement.call(this,this.el,on_el):this.placement;var D=/\s?auto?\s?/i;var E=D.test(C);if(E){C=C.replace(D,'')||'top';}this.el.show();var p=this.getPosition();var F=this.el.getBox();if(E){}var G=this.alignment[C]; -var xy=this.el.getAlignToXY(this.bindEl,G[0],G[1]);if(C=='top'||C=='bottom'){if(xy[0]<0){C='right';}if(xy[0]+this.el.getWidth()>Roo.lib.Dom.getViewWidth()){C='left';}var H=Roo.select('body',true).first().getScroll();if(xy[1]>Roo.lib.Dom.getViewHeight()+H.top-this.el.getHeight()){C='top'; -}G=this.alignment[C];}this.el.alignTo(this.bindEl,G[0],G[1]);this.el.addClass(C);this.el.addClass('in fade');this.hoverState=null;if(this.el.hasClass('fade')){}},hide:function(){if(!this.el){return;}this.el.removeClass('in');}}); +});Roo.extend(Roo.bootstrap.Tooltip,Roo.bootstrap.Component,{bindEl:false,delay:null,timeout:null,hoverState:null,placement:'bottom',alignment:false,getAutoCreate:function(){var A={cls:'tooltip',role:'tooltip',cn:[{cls:'tooltip-arrow arrow'},{cls:'tooltip-inner'} +]};return A;},bind:function(el){this.bindEl=el;},initEvents:function(){this.arrowEl=this.el.select('.arrow',true).first();this.innerEl=this.el.select('.tooltip-inner',true).first();},enter:function(){if(this.timeout!=null){clearTimeout(this.timeout);}this.hoverState='in'; +if(!this.delay||!this.delay.show){this.show();return;}var _t=this;this.timeout=setTimeout(function(){if(_t.hoverState=='in'){_t.show();}},this.delay.show);},leave:function(){clearTimeout(this.timeout);this.hoverState='out';if(!this.delay||!this.delay.hide){this.hide(); +return;}var _t=this;this.timeout=setTimeout(function(){if(_t.hoverState=='out'){_t.hide();Roo.bootstrap.Tooltip.currentEl=false;}},delay);},show:function(A){if(!this.el){this.render(document.body);}var B=A||this.bindEl.attr('tooltip')||this.bindEl.select("[tooltip]").first().attr('tooltip'); +this.el.select('.tooltip-inner',true).first().dom.innerHTML=B;this.el.removeClass(['fade','top','bottom','left','right','in','bs-tooltip-top','bs-tooltip-bottom','bs-tooltip-left','bs-tooltip-right']);var C=typeof this.placement=='function'?this.placement.call(this,this.el,on_el):this.placement; +var D=/\s?auto?\s?/i;var E=D.test(C);if(E){C=C.replace(D,'')||'top';}this.el.show();var p=this.getPosition();var F=this.el.getBox();if(E){}var G=this.alignment[C];var xy=this.el.getAlignToXY(this.bindEl,G[0],G[1]);if(C=='top'||C=='bottom'){if(xy[0]<0){C='right'; +}if(xy[0]+this.el.getWidth()>Roo.lib.Dom.getViewWidth()){C='left';}var H=Roo.select('body',true).first().getScroll();if(xy[1]>Roo.lib.Dom.getViewHeight()+H.top-this.el.getHeight()){C='top';}G=this.alignment[C];this.arrowEl.setLeft((this.innerEl.getWidth()/2)-5); +}this.el.alignTo(this.bindEl,G[0],G[1]);this.el.addClass(C);this.el.addClass("bs-tooltip-"+C);this.el.addClass('in fade show');this.hoverState=null;if(this.el.hasClass('fade')){}},hide:function(){if(!this.el){return;}this.el.removeClass(['show','in']);}}); + // Roo/bootstrap/LocationPicker.js Roo.bootstrap.LocationPicker=function(A){Roo.bootstrap.LocationPicker.superclass.constructor.call(this,A);this.addEvents({initial:true,positionchanged:true,resize:true,show:true,hide:true,mapClick:true,mapRightClick:true,markerClick:true,markerRightClick:true,OverlayViewDraw:true,OverlayViewOnAdd:true,OverlayViewOnRemove:true,OverlayViewShow:true,OverlayViewHide:true,loadexception:true} );};Roo.extend(Roo.bootstrap.LocationPicker,Roo.bootstrap.Component,{gMapContext:false,latitude:0,longitude:0,zoom:15,mapTypeId:false,mapTypeControl:false,disableDoubleClickZoom:false,scrollwheel:true,streetViewControl:false,radius:0,locationName:'',draggable:true,enableAutocomplete:false,enableReverseGeocode:true,markerTitle:'',getAutoCreate:function(){var A={tag:'div',cls:'roo-location-picker'} @@ -1669,19 +1693,19 @@ this.split.el.setLeft(A.x+A.width);this.split.el.setTop(A.y);this.split.el.setHe Roo.namespace("Roo.bootstrap.panel"); // Roo/bootstrap/panel/Content.js Roo.bootstrap.panel.Content=function(A){this.tpl=A.tpl||false;var el=A.el;var B=A.content;if(A.autoCreate){el=Roo.id();}this.el=Roo.get(el);if(!this.el&&A&&A.autoCreate){if(typeof A.autoCreate=="object"){if(!A.autoCreate.id){A.autoCreate.id=A.id||el;}this.el=Roo.DomHelper.append(document.body,A.autoCreate,true); -}else{var C={tag:"div",cls:"roo-layout-inactive-content",id:A.id||el};if(A.html){C.html=A.html;}this.el=Roo.DomHelper.append(document.body,C,true);}}this.closable=false;this.loaded=false;this.active=false;if(A.toolbar&&!A.toolbar.el&&A.toolbar.xtype){this.toolbar=new A.toolbar.xns[A.toolbar.xtype](A.toolbar); -this.wrapEl=this.el;var ti=[];if(A.toolbar.items){ti=A.toolbar.items;delete A.toolbar.items;}var D=[];this.toolbar.render(this.wrapEl,'before');for(var i=0;i=0){var s=k.split('-');for(var i=0;i"+this.title[k]+"";}}else{t+=""+this.title[k]+"";}}return t;},setTitle:function(A){this.title=A;if(this.region){this.region.updatePanelTitle(this,A); }},isClosable:function(){return this.closable;},beforeSlide:function(){this.el.clip();this.resizeEl.clip();},afterSlide:function(){this.el.unclip();this.resizeEl.unclip();},refresh:function(){if(this.refreshDelegate){this.loaded=false;this.refreshDelegate(); }},destroy:function(){this.el.removeAllListeners();var A=document.createElement("span");A.appendChild(this.el.dom);A.innerHTML="";this.el.remove();this.el=null;},form:false,view:false,getChildContainer:function(){return this.getEl();}}); @@ -1691,7 +1715,8 @@ Roo.bootstrap.panel.Grid=function(A){this.wrapper=Roo.DomHelper.append(document. ,ti[i])));}this.toolbar.items=C;delete A.toolbar;}Roo.bootstrap.panel.Grid.superclass.constructor.call(this,A);A.grid.scrollBody=true;;A.grid.monitorWindowResize=false;A.grid.autoHeight=false;A.grid.autoWidth=false;this.grid=new A.grid.xns[A.grid.xtype](A.grid); if(A.background){this.on('activate',function(gp){if(!gp.grid.rendered){gp.grid.render(this.wrapper);gp.grid.getGridEl().replaceClass("roo-layout-inactive-content","roo-layout-component-panel");}});}else{this.grid.render(this.wrapper);this.grid.getGridEl().replaceClass("roo-layout-inactive-content","roo-layout-component-panel"); }if(this.footer&&!this.footer.el&&this.footer.xtype){var D=this.grid.getView().getFooterPanel(true);this.footer.dataSource=this.grid.dataSource;this.footer=Roo.factory(this.footer,Roo);this.footer.render(D);}};Roo.extend(Roo.bootstrap.panel.Grid,Roo.bootstrap.panel.Content,{getId:function(){return this.grid.id; -},getGrid:function(){return this.grid;},setSize:function(A,B){if(!this.ignoreResize(A,B)){var C=this.grid;var D=this.adjustForComponents(A,B);var E=C.getGridEl();E.setSize(D.width,D.height);C.autoSize();}},beforeSlide:function(){this.grid.getView().scroller.clip(); +},getGrid:function(){return this.grid;},setSize:function(A,B){if(!this.ignoreResize(A,B)){var C=this.grid;var D=this.adjustForComponents(A,B);var E=C.getGridEl();E.setSize(D.width,D.height);var F=C.getGridEl().select('tbody',true).first();var G=C.getGridEl().select('thead',true).first(); +var H=C.getGridEl().select('tfoot',true).first();if(H){D.height-=G.getHeight();}if(G){D.height-=G.getHeight();}F.setSize(D.width,D.height);var G=C.getGridEl().select('thead',true).first();C.autoSize();}},beforeSlide:function(){this.grid.getView().scroller.clip(); },afterSlide:function(){this.grid.getView().scroller.unclip();},destroy:function(){this.grid.destroy();delete this.grid;Roo.bootstrap.panel.Grid.superclass.destroy.call(this);}}); // Roo/bootstrap/panel/Nest.js Roo.bootstrap.panel.Nest=function(A){A.el=A.layout.getEl();Roo.bootstrap.panel.Nest.superclass.constructor.call(this,A);A.layout.monitorWindowResize=false;this.layout=A.layout;this.layout.getEl().addClass("roo-layout-nested-layout");this.layout.parent=this; diff --git a/roojs-core-debug.js b/roojs-core-debug.js index 189e93d749..b28a01e891 100644 --- a/roojs-core-debug.js +++ b/roojs-core-debug.js @@ -7127,12 +7127,14 @@ if(opt.anim.isAnimated()){ El.prototype = { /** - * The element's default display mode (defaults to "") + * The element's default display mode (defaults to "") * @type String */ originalDisplay : "", - visibilityMode : 1, + + // note this is overridden in BS version.. + visibilityMode : 1, /** * The default unit to append to CSS values where a unit isn't provided (defaults to px). * @type String @@ -11616,7 +11618,7 @@ Roo.extend(Roo.data.Connection, Roo.util.Observable, { var enctype = form.getAttribute("enctype"); if (o.formData) { - return this.doFormDataUpload(o,p,url); + return this.doFormDataUpload(o, url); } if(o.isUpload || (enctype && enctype.toLowerCase() == 'multipart/form-data')){ @@ -11625,6 +11627,16 @@ Roo.extend(Roo.data.Connection, Roo.util.Observable, { var f = Roo.lib.Ajax.serializeForm(form); p = p ? (p + '&' + f) : f; } + + if (!o.form && o.formData) { + o.formData = o.formData === true ? new FormData() : o.formData; + for (var k in o.params) { + o.formData.append(k,o.params[k]); + } + + return this.doFormDataUpload(o, url); + } + var hs = o.headers; if(this.defaultHeaders){ @@ -11802,11 +11814,17 @@ Roo.extend(Roo.data.Connection, Roo.util.Observable, { // this is a 'formdata version???' - doFormDataUpload : function(o, ps, url) + doFormDataUpload : function(o, url) { - var form = Roo.getDom(o.form); - form.enctype = form.encoding = 'multipart/form-data'; - var formData = o.formData === true ? new FormData(form) : o.formData; + var formData; + if (o.form) { + var form = Roo.getDom(o.form); + form.enctype = form.encoding = 'multipart/form-data'; + formData = o.formData === true ? new FormData(form) : o.formData; + } else { + formData = o.formData === true ? new FormData() : o.formData; + } + var cb = { success: this.handleResponse, @@ -11826,7 +11844,7 @@ Roo.extend(Roo.data.Connection, Roo.util.Observable, { //Roo.lib.Ajax.defaultPostHeader = null; Roo.lib.Ajax.useDefaultHeader = false; - this.transId = Roo.lib.Ajax.request( "POST", url, cb, o.formData, o); + this.transId = Roo.lib.Ajax.request( "POST", url, cb, formData, o); Roo.lib.Ajax.useDefaultHeader = true; diff --git a/roojs-core.js b/roojs-core.js index 09f0677bc5..038775b302 100644 --- a/roojs-core.js +++ b/roojs-core.js @@ -474,20 +474,20 @@ if(C!==-1){A=Roo.getDom(A);if(B){var d=this.elements[C];d.parentNode.insertBefor // Roo/data/Connection.js Roo.data.Connection=function(A){Roo.apply(this,A);this.addEvents({"beforerequest":true,"requestcomplete":true,"requestexception":true});Roo.data.Connection.superclass.constructor.call(this);};Roo.extend(Roo.data.Connection,Roo.util.Observable,{timeout:30000,autoAbort:false,disableCaching:true,request:function(o){if(this.fireEvent("beforerequest",this,o)!==false){var p=o.params; if(typeof p=="function"){p=p.call(o.scope||window,o);}if(typeof p=="object"){p=Roo.urlEncode(o.params);}if(this.extraParams){var A=Roo.urlEncode(this.extraParams);p=p?(p+'&'+A):A;}var B=o.url||this.url;if(typeof B=='function'){B=B.call(o.scope||window,o); -}if(o.form){var C=Roo.getDom(o.form);B=B||C.action;var D=C.getAttribute("enctype");if(o.formData){return this.doFormDataUpload(o,p,B);}if(o.isUpload||(D&&D.toLowerCase()=='multipart/form-data')){return this.doFormUpload(o,p,B);}var f=Roo.lib.Ajax.serializeForm(C); -p=p?(p+'&'+f):f;}var hs=o.headers;if(this.defaultHeaders){hs=Roo.apply(hs||{},this.defaultHeaders);if(!o.headers){o.headers=hs;}}var cb={success:this.handleResponse,failure:this.handleFailure,scope:this,argument:{options:o},timeout:o.timeout||this.timeout} -;var E=o.method||this.method||(p?"POST":"GET");if(E=='GET'&&(this.disableCaching&&o.disableCaching!==false)||o.disableCaching===true){B+=(B.indexOf('?')!=-1?'&':'?')+'_dc='+(new Date().getTime());}if(typeof o.autoAbort=='boolean'){if(o.autoAbort){this.abort(); -}}else if(this.autoAbort!==false){this.abort();}if((E=='GET'&&p)||o.xmlData){B+=(B.indexOf('?')!=-1?'&':'?')+p;p='';}Roo.lib.Ajax.useDefaultHeader=typeof(o.headers)=='undefined'||typeof(o.headers['Content-Type'])=='undefined';this.transId=Roo.lib.Ajax.request(E,B,cb,p,o); -Roo.lib.Ajax.useDefaultHeader==true;return this.transId;}else{Roo.callback(o.callback,o.scope,[o,null,null]);return null;}},isLoading:function(A){if(A){return Roo.lib.Ajax.isCallInProgress(A);}else{return this.transId?true:false;}},abort:function(A){if(A||this.isLoading()){Roo.lib.Ajax.abort(A||this.transId); -}},handleResponse:function(A){this.transId=false;var B=A.argument.options;A.argument=B?B.argument:null;this.fireEvent("requestcomplete",this,A,B);Roo.callback(B.success,B.scope,[A,B]);Roo.callback(B.callback,B.scope,[B,true,A]);},handleFailure:function(A,e){this.transId=false; -var B=A.argument.options;A.argument=B?B.argument:null;this.fireEvent("requestexception",this,A,B,e);Roo.callback(B.failure,B.scope,[A,B]);Roo.callback(B.callback,B.scope,[B,false,A]);},doFormUpload:function(o,ps,A){var id=Roo.id();var B=document.createElement('iframe'); -B.id=id;B.name=id;B.className='x-hidden';if(Roo.isIE){B.src=Roo.SSL_SECURE_URL;}document.body.appendChild(B);if(Roo.isIE){document.frames[id].name=id;}var C=Roo.getDom(o.form);C.target=id;C.method='POST';C.enctype=C.encoding='multipart/form-data';if(A){C.action=A; -}var D,hd;if(ps){D=[];ps=Roo.urlDecode(ps,false);for(var k in ps){if(ps.hasOwnProperty(k)){hd=document.createElement('input');hd.type='hidden';hd.name=k;hd.value=ps[k];C.appendChild(hd);D.push(hd);}}}function cb(){var r={responseText:'',responseXML:null}; -r.argument=o?o.argument:null;try{var F;if(Roo.isIE){F=B.contentWindow.document;}else{F=(B.contentDocument||window.frames[id].document);}if(F&&F.body){r.responseText=F.body.innerHTML;}if(F&&F.XMLDocument){r.responseXML=F.XMLDocument;}else{r.responseXML=F;} -}catch(e){}Roo.EventManager.removeListener(B,'load',cb,this);this.fireEvent("requestcomplete",this,r,o);Roo.callback(o.success,o.scope,[r,o]);Roo.callback(o.callback,o.scope,[o,true,r]);setTimeout(function(){document.body.removeChild(B);},100);}Roo.EventManager.on(B,'load',cb,this); -C.submit();if(D){for(var i=0,E=D.length;i'; - } else { - st = ''; + } else { + for (var i in this.stylesheets) { + st += ''; + } + } st += ''; - } else { - st = ''; + } else { + for (var i in this.stylesheets) { + st += ''; + } + } st += '';}else{st='';}st+=''; -var A='roo-htmleditor-body';if(this.bodyCls.length){A+=' '+this.bodyCls;}return ''+st+' ';},onRender:function(ct,A){var _t=this;this.el=this.owner.inputEl?this.owner.inputEl():this.owner.el; -this.el.dom.style.border='0 none';this.el.dom.setAttribute('tabIndex',-1);this.el.addClass('x-hidden hide');if(Roo.isIE){this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')}this.frameId=Roo.id();var B=this.owner.wrap.createChild({tag:'iframe',cls:'form-control',id:this.frameId,name:this.frameId,frameBorder:'no','src':Roo.SSL_SECURE_URL?Roo.SSL_SECURE_URL:"javascript:false"} -,this.el);this.iframe=B.dom;this.assignDocWin();this.doc.designMode='on';this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var C={run:function(){this.assignDocWin();if(this.doc.body||this.doc.readyState=='complete'){try{this.doc.designMode="on"; -}catch(e){return;}Roo.TaskMgr.stop(C);this.initEditor.defer(10,this);}},interval:10,duration:10000,scope:this};Roo.TaskMgr.start(C);},onResize:function(w,h){Roo.log('resize: '+w+','+h);if(!this.iframe){return;}if(typeof w=='number'){this.iframe.style.width=w+'px'; -}if(typeof h=='number'){this.iframe.style.height=h+'px';if(this.doc){(this.doc.body||this.doc.documentElement).style.height=(h-(this.iframePad*2))+'px';}}},toggleSourceEdit:function(A){this.sourceEditMode=A===true;if(this.sourceEditMode){Roo.get(this.iframe).addClass(['x-hidden','hide']); -}else{Roo.get(this.iframe).removeClass(['x-hidden','hide']);this.deferFocus();}},cleanHtml:function(A){A=String(A);if(A.length>5){if(Roo.isSafari){A=A.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,'');}}if(A==' '){A='';}return A; -},syncValue:function(){if(this.initialized){var bd=(this.doc.body||this.doc.documentElement);var A=bd.innerHTML;if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){A='
'+A+'
'; +});}else if(!this.stylesheets.length){st='';}else{for(var i in this.stylesheets){st+='';} +}st+='';var A='roo-htmleditor-body';if(this.bodyCls.length){A+=' '+this.bodyCls;}return ''+st+' '; +},onRender:function(ct,A){var _t=this;this.el=this.owner.inputEl?this.owner.inputEl():this.owner.el;this.el.dom.style.border='0 none';this.el.dom.setAttribute('tabIndex',-1);this.el.addClass('x-hidden hide');if(Roo.isIE){this.el.applyStyles('margin-top:-1px;margin-bottom:-1px;')} +this.frameId=Roo.id();var B=this.owner.wrap.createChild({tag:'iframe',cls:'form-control',id:this.frameId,name:this.frameId,frameBorder:'no','src':Roo.SSL_SECURE_URL?Roo.SSL_SECURE_URL:"javascript:false"},this.el);this.iframe=B.dom;this.assignDocWin();this.doc.designMode='on'; +this.doc.open();this.doc.write(this.getDocMarkup());this.doc.close();var C={run:function(){this.assignDocWin();if(this.doc.body||this.doc.readyState=='complete'){try{this.doc.designMode="on";}catch(e){return;}Roo.TaskMgr.stop(C);this.initEditor.defer(10,this); +}},interval:10,duration:10000,scope:this};Roo.TaskMgr.start(C);},onResize:function(w,h){Roo.log('resize: '+w+','+h);if(!this.iframe){return;}if(typeof w=='number'){this.iframe.style.width=w+'px';}if(typeof h=='number'){this.iframe.style.height=h+'px';if(this.doc){(this.doc.body||this.doc.documentElement).style.height=(h-(this.iframePad*2))+'px'; +}}},toggleSourceEdit:function(A){this.sourceEditMode=A===true;if(this.sourceEditMode){Roo.get(this.iframe).addClass(['x-hidden','hide']);}else{Roo.get(this.iframe).removeClass(['x-hidden','hide']);this.deferFocus();}},cleanHtml:function(A){A=String(A);if(A.length>5){if(Roo.isSafari){A=A.replace(/\sclass="(?:Apple-style-span|khtml-block-placeholder)"/gi,''); +}}if(A==' '){A='';}return A;},syncValue:function(){if(this.initialized){var bd=(this.doc.body||this.doc.documentElement);var A=bd.innerHTML;if(Roo.isSafari){var bs=bd.getAttribute('style');var m=bs?bs.match(/text-align:(.*?);/i):false;if(m&&m[1]){A='
'+A+'
'; }}A=this.cleanHtml(A);A=A.replace(/[\uD800-\uDBFF][\uDC00-\uDFFF]|[\u0080-\uFFFF]/g,function(B){var cc=B.charCodeAt();if(B.length==2){var C=B.charCodeAt(0)-0xD800;var D=B.charCodeAt(1)-0xDC00;cc=(C*0x400)+D+0x10000;}else if((cc>=0x4E00&&cc<0xA000)||(cc>=0x3400&&cc<0x4E00)||(cc>=0xf900&&cc<0xfb00)){return B; }return "&#"+cc+";";});if(this.owner.fireEvent('beforesync',this,A)!==false){this.el.dom.value=A;this.owner.fireEvent('sync',this,A);}}},pushValue:function(){if(this.initialized){var v=this.el.dom.value.trim();if(this.owner.fireEvent('beforepush',this,v)!==false){var d=(this.doc.body||this.doc.documentElement); d.innerHTML=v;this.cleanUpPaste();this.el.dom.value=d.innerHTML;this.owner.fireEvent('push',this,v);}}},deferFocus:function(){this.focus.defer(10,this);},focus:function(){if(this.win&&!this.sourceEditMode){this.win.focus();}else{this.el.focus();}},assignDocWin:function(){var A=this.iframe; @@ -943,7 +943,7 @@ var D=ss==1;var E=ee==-1;if(D&&E){return 0;}if(!D&&E){return 1;}if(D&&!E){return i>-1;i--){this.cleanUpChild(n.childNodes[i]);}},cleanUpChild:function(A){var ed=this;if(A.nodeName=="#text"){return;}if(A.nodeName=="#comment"){A.parentNode.removeChild(A);return;}var B=A.tagName.toLowerCase();if(this.black.indexOf(B)>-1&&this.clearUp){A.parentNode.removeChild(A); return;}var C=Roo.HtmlEditorCore.remove.indexOf(A.tagName.toLowerCase())>-1;if((!A.attributes||!A.attributes.length)&&B=='span'){C=true;}if(C){this.cleanUpChildren(A);while(A.childNodes.length){var cn=A.childNodes[0];A.removeChild(cn);A.parentNode.insertBefore(cn,A); }A.parentNode.removeChild(A);return;}if(!A.attributes||!A.attributes.length){this.cleanUpChildren(A);return;}function cleanAttr(n,v){if(v.match(/^\./)||v.match(/^\//)){return;}if(v.match(/^(http|https):\/\//)||v.match(/^mailto:/)||v.match(/^ftp:/)){return; -}if(v.match(/^#/)){return;}A.removeAttribute(n);}var D=this.cwhite;var E=this.cblack;function cleanStyle(n,v){if(v.match(/expression/)){A.removeAttribute(n);return;}var F=v.split(/;/);var G=[];Roo.each(F,function(p){p=p.replace(/^\s+/g,'').replace(/\s+$/g,''); +}if(v.match(/^#/)){return;}if(v.match(/^\{/)){return;}A.removeAttribute(n);}var D=this.cwhite;var E=this.cblack;function cleanStyle(n,v){if(v.match(/expression/)){A.removeAttribute(n);return;}var F=v.split(/;/);var G=[];Roo.each(F,function(p){p=p.replace(/^\s+/g,'').replace(/\s+$/g,''); if(!p.length){return true;}var l=p.split(':').shift().replace(/\s+/g,'');l=l.replace(/^\s+/g,'').replace(/\s+$/g,'');if(D.length&&E.indexOf(l)>-1){return true;}if(D.length&&D.indexOf(l)<0){return true;}G.push(p);return true;});if(G.length){A.setAttribute(n,G.join(';')); }else{A.removeAttribute(n);}}for(var i=A.attributes.length-1;i>-1;i--){var a=A.attributes[i];if(a.name.toLowerCase().substr(0,2)=='on'){A.removeAttribute(a.name);continue;}if(Roo.HtmlEditorCore.ablack.indexOf(a.name.toLowerCase())>-1){A.removeAttribute(a.name); continue;}if(Roo.HtmlEditorCore.aclean.indexOf(a.name.toLowerCase())>-1){cleanAttr(a.name,a.value);continue;}if(a.name=='style'){cleanStyle(a.name,a.value);continue;}if(a.name=='class'){if(a.value.match(/^Mso/)){A.removeAttribute('class');}if(a.value.match(/^body$/)){A.removeAttribute('class'); diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp077tbA.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp077tbA.scssc new file mode 100644 index 0000000000..6f5f01385c Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp077tbA.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp16WfxF.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp16WfxF.scssc new file mode 100644 index 0000000000..4e0df847ab Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp16WfxF.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp1Blnbm.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp1Blnbm.scssc new file mode 100644 index 0000000000..1e35daf64a Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp1Blnbm.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp4tfGes.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp4tfGes.scssc new file mode 100644 index 0000000000..e5e850a7b2 Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmp4tfGes.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpM8VMfj.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpM8VMfj.scssc new file mode 100644 index 0000000000..077f5d20e8 Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpM8VMfj.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpVvsZtB.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpVvsZtB.scssc new file mode 100644 index 0000000000..a93b6f11b0 Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpVvsZtB.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpeT_aV2.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpeT_aV2.scssc new file mode 100644 index 0000000000..20d28f933e Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpeT_aV2.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpgCKPeu.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpgCKPeu.scssc new file mode 100644 index 0000000000..0454a8c230 Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpgCKPeu.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpleYXht.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpleYXht.scssc new file mode 100644 index 0000000000..946d00fb0e Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpleYXht.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpm3C34t.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpm3C34t.scssc new file mode 100644 index 0000000000..f9720dc859 Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpm3C34t.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpvALq5X.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpvALq5X.scssc new file mode 100644 index 0000000000..975c62a03b Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpvALq5X.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpwNF9Ih.scssc b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpwNF9Ih.scssc new file mode 100644 index 0000000000..e85b02b49c Binary files /dev/null and b/scss/startbootstrap-sb-admin-2/.sass-cache/600d657f6ac2358f30ba6bc0ab4cd7ffb6194ced/tmpwNF9Ih.scssc differ diff --git a/scss/startbootstrap-sb-admin-2/_buttons.scss b/scss/startbootstrap-sb-admin-2/_buttons.scss new file mode 100644 index 0000000000..afcfc2044e --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_buttons.scss @@ -0,0 +1,52 @@ +.btn-circle { + border-radius: 100%; + height: 2.5rem; + width: 2.5rem; + font-size: 1rem; + display: inline-flex; + align-items: center; + justify-content: center; + &.btn-sm { + height: 1.8rem; + width: 1.8rem; + font-size: 0.75rem; + } + &.btn-lg { + height: 3.5rem; + width: 3.5rem; + font-size: 1.35rem; + } +} + +.btn-icon-split { + padding: 0; + overflow: hidden; + display: inline-flex; + align-items: stretch; + justify-content: center; + .icon { + background: fade-out($black, .85); + display: inline-block; + padding: $btn-padding-y $btn-padding-x; + } + .text { + display: inline-block; + padding: $btn-padding-y $btn-padding-x; + } + &.btn-sm { + .icon { + padding: $btn-padding-y-sm $btn-padding-x-sm; + } + .text { + padding: $btn-padding-y-sm $btn-padding-x-sm; + } + } + &.btn-lg { + .icon { + padding: $btn-padding-y-lg $btn-padding-x-lg; + } + .text { + padding: $btn-padding-y-lg $btn-padding-x-lg; + } + } +} diff --git a/scss/startbootstrap-sb-admin-2/_cards.scss b/scss/startbootstrap-sb-admin-2/_cards.scss new file mode 100644 index 0000000000..36337ddf46 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_cards.scss @@ -0,0 +1,36 @@ +// Custom Card Styling + +.card { + .card-header { + // Format Dropdowns in Card Headings + .dropdown { + line-height: 1; + .dropdown-menu { + line-height: 1.5; + } + } + } + // Collapsable Card Styling + .card-header[data-toggle="collapse"] { + text-decoration: none; + position: relative; + padding: 0.75rem 3.25rem 0.75rem 1.25rem; + &::after { + position: absolute; + right: 0; + top: 0; + padding-right: 1.725rem; + line-height: 51px; + font-weight: 900; + content: '\f107'; + font-family: 'Font Awesome 5 Free'; + color: $gray-400; + } + &.collapsed { + border-radius: $card-border-radius; + &::after { + content: '\f105'; + } + } + } +} diff --git a/scss/startbootstrap-sb-admin-2/_charts.scss b/scss/startbootstrap-sb-admin-2/_charts.scss new file mode 100644 index 0000000000..81248146d6 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_charts.scss @@ -0,0 +1,29 @@ +// Area Chart +.chart-area { + position: relative; + height: 10rem; + width: 100%; + @include media-breakpoint-up(md) { + height: 20rem; + } +} + +// Bar Chart +.chart-bar { + position: relative; + height: 10rem; + width: 100%; + @include media-breakpoint-up(md) { + height: 20rem; + } +} + +// Pie Chart +.chart-pie { + position: relative; + height: 15rem; + width: 100%; + @include media-breakpoint-up(md) { + height: calc(20rem - 43px) !important; + } +} diff --git a/scss/startbootstrap-sb-admin-2/_dropdowns.scss b/scss/startbootstrap-sb-admin-2/_dropdowns.scss new file mode 100644 index 0000000000..a2858e1ed7 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_dropdowns.scss @@ -0,0 +1,21 @@ +// Custom Dropdown Styling + +.dropdown { + .dropdown-menu { + font-size: $dropdown-font-size; + .dropdown-header { + @extend .text-uppercase; + font-weight: 800; + font-size: 0.65rem; + color: $gray-500; + } + } +} + +// Utility class to hide arrow from dropdown + +.dropdown.no-arrow { + .dropdown-toggle::after { + display: none; + } +} diff --git a/scss/startbootstrap-sb-admin-2/_error.scss b/scss/startbootstrap-sb-admin-2/_error.scss new file mode 100644 index 0000000000..66cbedc69c --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_error.scss @@ -0,0 +1,52 @@ +// Lucas Bebber's Glitch Effect +// Tutorial and CSS from CSS Tricks +// https://css-tricks.com/glitch-effect-text-images-svg/ + +.error { + color: $gray-800; + font-size: 7rem; + position: relative; + line-height: 1; + width: 12.5rem; +} +@keyframes noise-anim { + $steps: 20; + @for $i from 0 through $steps { + #{percentage($i*(1/$steps))} { + clip: rect(random(100)+px,9999px,random(100)+px,0); + } + } +} +.error:after { + content: attr(data-text); + position: absolute; + left: 2px; + text-shadow: -1px 0 $red; + top: 0; + color: $gray-800; + background: $gray-100; + overflow: hidden; + clip: rect(0,900px,0,0); + animation: noise-anim 2s infinite linear alternate-reverse; +} + +@keyframes noise-anim-2 { + $steps: 20; + @for $i from 0 through $steps { + #{percentage($i*(1/$steps))} { + clip: rect(random(100)+px,9999px,random(100)+px,0); + } + } +} +.error:before { + content: attr(data-text); + position: absolute; + left: -2px; + text-shadow: 1px 0 $blue; + top: 0; + color: $gray-800; + background: $gray-100; + overflow: hidden; + clip: rect(0,900px,0,0); + animation: noise-anim-2 3s infinite linear alternate-reverse; +} diff --git a/scss/startbootstrap-sb-admin-2/_footer.scss b/scss/startbootstrap-sb-admin-2/_footer.scss new file mode 100644 index 0000000000..99d9dcf28d --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_footer.scss @@ -0,0 +1,14 @@ +footer.sticky-footer { + padding: 2rem 0; + flex-shrink: 0; + .copyright { + line-height: 1; + font-size: 0.8rem; + } +} + +body.sidebar-toggled { + footer.sticky-footer { + width: 100%; + } +} diff --git a/scss/startbootstrap-sb-admin-2/_global.scss b/scss/startbootstrap-sb-admin-2/_global.scss new file mode 100644 index 0000000000..fa44c55f0f --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_global.scss @@ -0,0 +1,60 @@ +// Global component styles + +html { + position: relative; + min-height: 100%; +} + +body { + height: 100%; +} + +a { + &:focus { + outline: none; + } +} + +// Main page wrapper +#wrapper { + display: flex; + #content-wrapper { + background-color: $gray-100; + width: 100%; + overflow-x: hidden; + #content { + flex: 1 0 auto; + } + } +} + +// Set container padding to match gutter width instead of default 15px +.container, +.container-fluid { + padding-left: $grid-gutter-width; + padding-right: $grid-gutter-width; +} + +// Scroll to top button +.scroll-to-top { + position: fixed; + right: 1rem; + bottom: 1rem; + display: none; + width: 2.75rem; + height: 2.75rem; + text-align: center; + color: $white; + background: fade-out($gray-800, .5); + line-height: 46px; + &:focus, + &:hover { + color: white; + } + &:hover { + background: $gray-800; + } + i { + font-weight: 800; + } +} diff --git a/scss/startbootstrap-sb-admin-2/_login.scss b/scss/startbootstrap-sb-admin-2/_login.scss new file mode 100644 index 0000000000..4447a29a31 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_login.scss @@ -0,0 +1,50 @@ +// Pulling these images from Unsplash +// Toshi the dog from https://unsplash.com/@charlesdeluvio - what a funny dog... + +.bg-login-image { + background: url($login-image); + background-position: center; + background-size: cover; +} + +.bg-register-image { + background: url($register-image); + background-position: center; + background-size: cover; +} + +.bg-password-image { + background: url($password-image); + background-position: center; + background-size: cover; +} + +form.user { + + .custom-checkbox.small { + label { + line-height: 1.5rem; + } + } + + .form-control-user { + font-size: 0.8rem; + border-radius: 10rem; + padding: 1.5rem 1rem; + } + + .btn-user { + font-size: 0.8rem; + border-radius: 10rem; + padding: 0.75rem 1rem; + } + +} + +.btn-google { + @include button-variant($brand-google, $white); +} + +.btn-facebook { + @include button-variant($brand-facebook, $white); +} diff --git a/scss/startbootstrap-sb-admin-2/_mixins.scss b/scss/startbootstrap-sb-admin-2/_mixins.scss new file mode 100644 index 0000000000..8b13789179 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_mixins.scss @@ -0,0 +1 @@ + diff --git a/scss/startbootstrap-sb-admin-2/_navs.scss b/scss/startbootstrap-sb-admin-2/_navs.scss new file mode 100644 index 0000000000..af517b5199 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_navs.scss @@ -0,0 +1,3 @@ +@import "navs/global.scss"; +@import "navs/topbar.scss"; +@import "navs/sidebar.scss"; diff --git a/scss/startbootstrap-sb-admin-2/_utilities.scss b/scss/startbootstrap-sb-admin-2/_utilities.scss new file mode 100644 index 0000000000..bf50ba207d --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_utilities.scss @@ -0,0 +1,7 @@ +@import "utilities/animation.scss"; +@import "utilities/background.scss"; +@import "utilities/display.scss"; +@import "utilities/text.scss"; +@import "utilities/border.scss"; +@import "utilities/progress.scss"; +@import "utilities/rotate.scss"; diff --git a/scss/startbootstrap-sb-admin-2/_variables.scss b/scss/startbootstrap-sb-admin-2/_variables.scss new file mode 100644 index 0000000000..9afe3e2fc3 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/_variables.scss @@ -0,0 +1,81 @@ +// Override Bootstrap default variables here +// Do not edit any of the files in /vendor/bootstrap/scss/! + +// Color Variables +// Bootstrap Color Overrides + +$white: #fff !default; +$gray-100: #f8f9fc !default; +$gray-200: #eaecf4 !default; +$gray-300: #dddfeb !default; +$gray-400: #d1d3e2 !default; +$gray-500: #b7b9cc !default; +$gray-600: #858796 !default; +$gray-700: #6e707e !default; +$gray-800: #5a5c69 !default; +$gray-900: #3a3b45 !default; +$black: #000 !default; + +$blue: #4e73df !default; +$indigo: #6610f2 !default; +$purple: #6f42c1 !default; +$pink: #e83e8c !default; +$red: #e74a3b !default; +$orange: #fd7e14 !default; +$yellow: #f6c23e !default; +$green: #1cc88a !default; +$teal: #20c9a6 !default; +$cyan: #36b9cc !default; + +// Custom Colors +$brand-google: #ea4335 !default; +$brand-facebook: #3b5998 !default; + +// Set Contrast Threshold +$yiq-contrasted-threshold: 195 !default; + +// Typography +$body-color: $gray-600 !default; + +$font-family-sans-serif: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", 'Noto Color Emoji' !default; + +$font-weight-light: 300 !default; +// $font-weight-base: 400; +$headings-font-weight: 400 !default; + +// Shadows +$box-shadow-sm: 0 0.125rem 0.25rem 0 rgba($gray-900, .2) !default; +$box-shadow: 0 0.15rem 1.75rem 0 rgba($gray-900, .15) !default; +// $box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default; + +// Borders Radius +$border-radius: 0.35rem !default; +$border-color: darken($gray-200, 2%) !default; + +// Spacing Variables +// Change below variable if the height of the navbar changes +$topbar-base-height: 4.375rem !default; +// Change below variable to change the width of the sidenav +$sidebar-base-width: 14rem !default; +// Change below variable to change the width of the sidenav when collapsed +$sidebar-collapsed-width: 6.5rem !default; + +// Card +// $card-cap-bg: $gray-100 !default; << this makes all weights grey.. doesn tlook great. +$card-border-color: $border-color !default; + +// Adjust column spacing for symmetry +$spacer: 1rem !default; +$grid-gutter-width: $spacer * 1.5 !default; + +// Transitions +$transition-collapse: height .15s ease !default; + +// Dropdowns +$dropdown-font-size: 0.85rem !default; +$dropdown-border-color: $border-color !default; + +// Images ??? - fixme ? +$login-image: 'https://source.unsplash.com/K4mSJ7kc0As/600x800' !default; +$register-image: 'https://source.unsplash.com/Mv9hjnEUHR4/600x800' !default; +$password-image: 'https://source.unsplash.com/oWTW-jNGl9I/600x800' !default; diff --git a/scss/startbootstrap-sb-admin-2/navs/_global.scss b/scss/startbootstrap-sb-admin-2/navs/_global.scss new file mode 100644 index 0000000000..a52d8b84c2 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/navs/_global.scss @@ -0,0 +1,42 @@ +// Global styles for both custom sidebar and topbar compoments + +.sidebar, +.topbar { + .nav-item { + // Customize Dropdown Arrows for Navbar + &.dropdown { + .dropdown-toggle { + &::after { + width: 1rem; + text-align: center; + float: right; + vertical-align: 0; + border: 0; + font-weight: 900; + content: '\f105'; + font-family: 'Font Awesome 5 Free'; + } + } + &.show { + .dropdown-toggle::after { + content: '\f107'; + } + } + } + // Counter for nav links and nav link image sizing + .nav-link { + position: relative; + .badge-counter { + position: absolute; + transform: scale(0.7); + transform-origin: top right; + right: .25rem; + margin-top: -.25rem; + } + .img-profile { + height: 2rem; + width: 2rem; + } + } + } +} diff --git a/scss/startbootstrap-sb-admin-2/navs/_sidebar.scss b/scss/startbootstrap-sb-admin-2/navs/_sidebar.scss new file mode 100644 index 0000000000..03bbb669cd --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/navs/_sidebar.scss @@ -0,0 +1,477 @@ +// Sidebar +.sidebar { + width: $sidebar-collapsed-width; + min-height: 100vh; + + .nav-item { + position: relative; + + &:last-child { + margin-bottom: 1rem; + } + + .nav-link { + text-align: center; + padding: 0.75rem 1rem; + width: $sidebar-collapsed-width; + + span { + font-size: 0.65rem; + display: block; + } + } + + &.active { + .nav-link { + font-weight: 700; + } + } + + // Accordion + .collapse { + position: absolute; + left: calc(#{$sidebar-collapsed-width} + #{$grid-gutter-width} / 2); + z-index: 1; + top: 2px; + // Grow In Animation + @extend .animated--grow-in; + + .collapse-inner { + border-radius: $border-radius; + box-shadow: $box-shadow; + } + } + + .collapsing { + display: none; + transition: none; + } + + .collapse, + .collapsing { + .collapse-inner { + padding: .5rem 0; + min-width: 10rem; + font-size: $dropdown-font-size; + margin: 0 0 1rem 0; + + .collapse-header { + margin: 0; + white-space: nowrap; + padding: .5rem 1.5rem; + text-transform: uppercase; + font-weight: 800; + font-size: 0.65rem; + color: $gray-500; + } + + .collapse-item { + padding: 0.5rem 1rem; + margin: 0 0.5rem; + display: block; + color: $gray-900; + text-decoration: none; + border-radius: $border-radius; + white-space: nowrap; + + &:hover { + background-color: $gray-200; + } + + &:active { + background-color: $gray-300; + } + + &.active { + color: $primary; + font-weight: 700; + } + } + } + } + } + + #sidebarToggle { + width: 2.5rem; + height: 2.5rem; + text-align: center; + margin-bottom: 1rem; + cursor: pointer; + + &::after { + font-weight: 900; + content: '\f104'; + font-family: 'Font Awesome 5 Free'; + margin-right: 0.1rem; + } + + &:hover { + text-decoration: none; + } + + &:focus { + outline: none; + } + } + + &.toggled { + width: 0 !important; + overflow: hidden; + + #sidebarToggle::after { + content: '\f105'; + font-family: 'Font Awesome 5 Free'; + margin-left: 0.25rem; + } + + .sidebar-card { + display: none; + } + } + + .sidebar-brand { + height: $topbar-base-height; + text-decoration: none; + font-size: 1rem; + font-weight: 800; + padding: 1.5rem 1rem; + text-align: center; + text-transform: uppercase; + letter-spacing: 0.05rem; + z-index: 1; + + .sidebar-brand-icon i { + font-size: 2rem; + } + + .sidebar-brand-text { + display: none; + } + } + + hr.sidebar-divider { + margin: 0 1rem 1rem; + } + + .sidebar-heading { + text-align: center; + padding: 0 1rem; + font-weight: 800; + font-size: 0.65rem; + @extend .text-uppercase; + } + + .sidebar-card { + display: flex; + flex-direction: column; + align-items: center; + font-size: $font-size-sm; + border-radius: $border-radius; + color: fade-out($white, 0.2); + margin-left: 1rem; + margin-right: 1rem; + margin-bottom: 1rem; + padding: 1rem; + background-color: fade-out($black, 0.9); + .sidebar-card-illustration { + height: 3rem; + display: block; + } + .sidebar-card-title { + font-weight: bold; + } + p { + font-size: 0.75rem; + color: fade-out($white, 0.5); + } + } +} + +@include media-breakpoint-up(md) { + .sidebar { + width: $sidebar-base-width !important; + + .nav-item { + + // Accordion + .collapse { + position: relative; + left: 0; + z-index: 1; + top: 0; + animation: none; + + .collapse-inner { + border-radius: 0; + box-shadow: none; + } + } + + .collapsing { + display: block; + transition: $transition-collapse; + } + + .collapse, + .collapsing { + margin: 0 1rem; + } + + .nav-link { + display: block; + width: 100%; + text-align: left; + padding: 1rem; + width: $sidebar-base-width; + + i { + font-size: 0.85rem; + margin-right: 0.25rem; + } + + span { + font-size: 0.85rem; + display: inline; + } + + // Accordion Arrow Icon + &[data-toggle="collapse"] { + &::after { + width: 1rem; + text-align: center; + float: right; + vertical-align: 0; + border: 0; + font-weight: 900; + content: '\f107'; + font-family: 'Font Awesome 5 Free'; + } + + &.collapsed::after { + content: '\f105'; + } + } + } + } + + .sidebar-brand { + .sidebar-brand-icon i { + font-size: 2rem; + } + + .sidebar-brand-text { + display: inline; + } + } + + .sidebar-heading { + text-align: left; + } + + &.toggled { + overflow: visible; + width: $sidebar-collapsed-width !important; + + .nav-item { + + // Accordion + .collapse { + position: absolute; + left: calc(#{$sidebar-collapsed-width} + #{$grid-gutter-width} / 2); + z-index: 1; + top: 2px; + // Grow In Animation for Toggled State + animation-name: growIn; + animation-duration: 200ms; + animation-timing-function: transform cubic-bezier(.18, 1.25, .4, 1), opacity cubic-bezier(0, 1, .4, 1); + + .collapse-inner { + box-shadow: $box-shadow; + border-radius: $border-radius; + } + } + + .collapsing { + display: none; + transition: none; + } + + .collapse, + .collapsing { + margin: 0; + } + + &:last-child { + margin-bottom: 1rem; + } + + .nav-link { + text-align: center; + padding: 0.75rem 1rem; + width: $sidebar-collapsed-width; + + span { + font-size: 0.65rem; + display: block; + } + + i { + margin-right: 0; + } + + &[data-toggle="collapse"]::after { + display: none; + } + } + } + + .sidebar-brand { + .sidebar-brand-icon i { + font-size: 2rem; + } + + .sidebar-brand-text { + display: none; + } + } + + .sidebar-heading { + text-align: center; + } + } + } +} + +// Sidebar Color Variants + +// Sidebar Light +.sidebar-light { + .sidebar-brand { + color: $gray-700; + } + + hr.sidebar-divider { + border-top: 1px solid $gray-200; + } + + .sidebar-heading { + color: $gray-500; + } + + .nav-item { + .nav-link { + color: $gray-600; + + i { + color: $gray-400; + } + + &:active, + &:focus, + &:hover { + color: $gray-700; + + i { + color: $gray-700; + } + } + + // Accordion + &[data-toggle="collapse"]::after { + color: $gray-500; + } + } + + &.active { + .nav-link { + color: $gray-700; + + i { + color: $gray-700; + } + } + } + } + + // Color the sidebar toggler + #sidebarToggle { + background-color: $gray-200; + + &::after { + color: $gray-500; + } + + &:hover { + background-color: $gray-300; + } + } +} + +// Sidebar Dark +.sidebar-dark { + .sidebar-brand { + color: $white; + } + + hr.sidebar-divider { + border-top: 1px solid fade-out($white, 0.85); + } + + .sidebar-heading { + color: fade-out($white, 0.6); + } + + .nav-item { + .nav-link { + color: fade-out($white, 0.2); + + i { + color: fade-out($white, 0.7); + } + + &:active, + &:focus, + &:hover { + color: $white; + + i { + color: $white; + } + } + + // Accordion + &[data-toggle="collapse"]::after { + color: fade-out($white, 0.5); + } + } + + &.active { + .nav-link { + color: $white; + + i { + color: $white; + } + } + } + } + + // Color the sidebar toggler + #sidebarToggle { + background-color: fade-out($white, 0.8); + + &::after { + color: fade-out($white, 0.5); + } + + &:hover { + background-color: fade-out($white, 0.75); + } + } + + &.toggled { + #sidebarToggle::after { + color: fade-out($white, 0.5); + } + } +} \ No newline at end of file diff --git a/scss/startbootstrap-sb-admin-2/navs/_topbar.scss b/scss/startbootstrap-sb-admin-2/navs/_topbar.scss new file mode 100644 index 0000000000..fc506bd23f --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/navs/_topbar.scss @@ -0,0 +1,144 @@ +// Topbar +.topbar { + height: $topbar-base-height; + #sidebarToggleTop { + height: 2.5rem; + width: 2.5rem; + &:hover { + background-color: $gray-200; + } + &:active { + background-color: $gray-300; + } + } + .navbar-search { + width: 25rem; + input { + font-size: 0.85rem; + height: auto; + } + } + .topbar-divider { + width: 0; + border-right: 1px solid $border-color; + height: calc(#{$topbar-base-height} - 2rem); + margin: auto 1rem; + } + .nav-item { + .nav-link { + height: $topbar-base-height; + display: flex; + align-items: center; + padding: 0 0.75rem; + &:focus { + outline: none; + } + } + &:focus { + outline: none; + } + } + .dropdown { + position: static; + .dropdown-menu { + width: calc(100% - #{$grid-gutter-width}); + right: $grid-gutter-width / 2; + } + } + .dropdown-list { + padding: 0; + border: none; + overflow: hidden; + .dropdown-header { + background-color: $primary; + border: 1px solid $primary; + padding-top: 0.75rem; + padding-bottom: 0.75rem; + color: $white; + } + .dropdown-item { + white-space: normal; + padding-top: 0.5rem; + padding-bottom: 0.5rem; + border-left: 1px solid $border-color; + border-right: 1px solid $border-color; + border-bottom: 1px solid $border-color; + line-height: 1.3rem; + .dropdown-list-image { + position: relative; + height: 2.5rem; + width: 2.5rem; + img { + height: 2.5rem; + width: 2.5rem; + } + .status-indicator { + background-color: $gray-200; + height: 0.75rem; + width: 0.75rem; + border-radius: 100%; + position: absolute; + bottom: 0; + right: 0; + border: .125rem solid $white; + } + } + .text-truncate { + max-width: 10rem; + } + &:active { + background-color: $gray-200; + color: $gray-900; + } + } + } + @include media-breakpoint-up(sm) { + .dropdown { + position: relative; + .dropdown-menu { + width: auto; + right: 0; + } + } + .dropdown-list { + width: 20rem !important; + .dropdown-item { + .text-truncate { + max-width: 13.375rem; + } + } + } + } +} + +.topbar.navbar-dark { + .navbar-nav { + .nav-item { + .nav-link { + color: fade-out($white, 0.2); + &:hover { + color: $white; + } + &:active { + color: $white; + } + } + } + } +} + +.topbar.navbar-light { + .navbar-nav { + .nav-item { + .nav-link { + color: $gray-400; + &:hover { + color: $gray-500; + } + &:active { + color: $gray-600; + } + } + } + } +} diff --git a/scss/startbootstrap-sb-admin-2/sb-admin-2.scss b/scss/startbootstrap-sb-admin-2/sb-admin-2.scss new file mode 100644 index 0000000000..7fc86fdb9c --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/sb-admin-2.scss @@ -0,0 +1,20 @@ +// Import Custom SB Admin 2 Variables (Overrides Default Bootstrap Variables) +@import "variables.scss"; + +// Import Bootstrap +@import "../bootstrap/bootstrap.scss"; + +// Import Custom SB Admin 2 Mixins and Components +@import "mixins.scss"; +@import "global.scss"; +@import "utilities.scss"; + +// Custom Components +@import "dropdowns.scss"; +@import "navs.scss"; +@import "buttons.scss"; +@import "cards.scss"; +@import "charts.scss"; +@import "login.scss"; +@import "error.scss"; +@import "footer.scss"; diff --git a/scss/startbootstrap-sb-admin-2/utilities/_animation.scss b/scss/startbootstrap-sb-admin-2/utilities/_animation.scss new file mode 100644 index 0000000000..7a40d4d0c5 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_animation.scss @@ -0,0 +1,37 @@ +// Animation Utilities + +// Grow In Animation + +@keyframes growIn { + 0% { + transform: scale(0.9); + opacity: 0; + } + 100% { + transform: scale(1); + opacity: 1; + } +} + +.animated--grow-in { + animation-name: growIn; + animation-duration: 200ms; + animation-timing-function: transform cubic-bezier(.18,1.25,.4,1), opacity cubic-bezier(0,1,.4,1); +} + +// Fade In Animation + +@keyframes fadeIn { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } +} + +.animated--fade-in { + animation-name: fadeIn; + animation-duration: 200ms; + animation-timing-function: opacity cubic-bezier(0,1,.4,1); +} diff --git a/scss/startbootstrap-sb-admin-2/utilities/_background.scss b/scss/startbootstrap-sb-admin-2/utilities/_background.scss new file mode 100644 index 0000000000..b4ceff1895 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_background.scss @@ -0,0 +1,17 @@ +// Background Gradient Utilities + +@each $color, $value in $theme-colors { + .bg-gradient-#{$color} { + background-color: $value; + background-image: linear-gradient(180deg, $value 10%, darken($value, 15%) 100%); + background-size: cover; + } +} + +// Grayscale Background Utilities + +@each $level, $value in $grays { + .bg-gray-#{$level} { + background-color: $value !important; + } +} diff --git a/scss/startbootstrap-sb-admin-2/utilities/_border.scss b/scss/startbootstrap-sb-admin-2/utilities/_border.scss new file mode 100644 index 0000000000..cede0e4dd3 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_border.scss @@ -0,0 +1,7 @@ +@each $color, $value in $theme-colors { + @each $position in ['left', 'bottom'] { + .border-#{$position}-#{$color} { + border-#{$position}: .25rem solid $value !important; + } + } +} diff --git a/scss/startbootstrap-sb-admin-2/utilities/_display.scss b/scss/startbootstrap-sb-admin-2/utilities/_display.scss new file mode 100644 index 0000000000..410b9ad657 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_display.scss @@ -0,0 +1,4 @@ +// Overflow Hidden +.o-hidden { + overflow: hidden !important; +} diff --git a/scss/startbootstrap-sb-admin-2/utilities/_progress.scss b/scss/startbootstrap-sb-admin-2/utilities/_progress.scss new file mode 100644 index 0000000000..0c2eb63ec2 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_progress.scss @@ -0,0 +1,3 @@ +.progress-sm { + height: .5rem; +} diff --git a/scss/startbootstrap-sb-admin-2/utilities/_rotate.scss b/scss/startbootstrap-sb-admin-2/utilities/_rotate.scss new file mode 100644 index 0000000000..7e33d441a6 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_rotate.scss @@ -0,0 +1,7 @@ +.rotate-15 { + transform: rotate(15deg); +} + +.rotate-n-15 { + transform: rotate(-15deg); +} diff --git a/scss/startbootstrap-sb-admin-2/utilities/_text.scss b/scss/startbootstrap-sb-admin-2/utilities/_text.scss new file mode 100644 index 0000000000..4fb78afb40 --- /dev/null +++ b/scss/startbootstrap-sb-admin-2/utilities/_text.scss @@ -0,0 +1,54 @@ +// Grayscale Text Utilities + +.text-xs { + font-size: .7rem; +} + +.text-lg { + font-size: 1.2rem; +} + +.text-gray-100 { + color: $gray-100 !important; +} + +.text-gray-200 { + color: $gray-200 !important; +} + +.text-gray-300 { + color: $gray-300 !important; +} + +.text-gray-400 { + color: $gray-400 !important; +} + +.text-gray-500 { + color: $gray-500 !important; +} + +.text-gray-600 { + color: $gray-600 !important; +} + +.text-gray-700 { + color: $gray-700 !important; +} + +.text-gray-800 { + color: $gray-800 !important; +} + +.text-gray-900 { + color: $gray-900 !important; +} + +.icon-circle { + height: 2.5rem; + width: 2.5rem; + border-radius: 100%; + display: flex; + align-items: center; + justify-content: center; +}