From c3fae677247c171d616820f63a06609c27abacb3 Mon Sep 17 00:00:00 2001 From: Alan Knowles Date: Tue, 8 Jun 2021 16:47:49 +0800 Subject: [PATCH] Fix #6814 - Notification fadeout --- Roo/bootstrap/Alert.js | 37 +++++++++++++++----- Roo/bootstrap/Notification.js | 29 ++++++++++++++++ Roo/util/Clipboard.js | 38 ++++++++++++++++++++ buildSDK/dependancy_core.txt | 1 + docs/json/roodata.json | 25 +++++++++++++- docs/src/Roo_bootstrap_Alert.js.html | 37 +++++++++++++++----- docs/src/Roo_bootstrap_Menu.js.html | 50 +++++++++++++++++++-------- docs/src/Roo_util_Clipboard.js.html | 38 ++++++++++++++++++++ docs/symbols/Roo.bootstrap.Alert.json | 28 +++++++++++---- docs/symbols/Roo.bootstrap.Menu.json | 7 ++++ docs/symbols/Roo.util.Clipboard.json | 18 ++++++++++ docs/tree.json | 5 +++ roojs-all.js | 3 ++ roojs-bootstrap-debug.js | 37 +++++++++++++++----- roojs-bootstrap.js | 10 +++--- roojs-core-debug.js | 39 ++++++++++++++++++++- roojs-core.js | 3 ++ roojs-debug.js | 39 ++++++++++++++++++++- 18 files changed, 391 insertions(+), 53 deletions(-) create mode 100644 Roo/bootstrap/Notification.js create mode 100644 Roo/util/Clipboard.js create mode 100644 docs/src/Roo_util_Clipboard.js.html create mode 100644 docs/symbols/Roo.util.Clipboard.json diff --git a/Roo/bootstrap/Alert.js b/Roo/bootstrap/Alert.js index cf85568429..5d53882833 100644 --- a/Roo/bootstrap/Alert.js +++ b/Roo/bootstrap/Alert.js @@ -10,7 +10,10 @@ * @cfg {String} title The title of alert * @cfg {String} html The content of alert * @cfg {String} weight ( success | info | warning | danger ) - * @cfg {String} faicon font-awesomeicon + * @cfg {String} fa font-awesomeicon + * @cfg {Number} seconds default:-1 Number of seconds until it disapears (-1 means never.) + * @cfg {Boolean} close true to show a x closer + * * * @constructor * Create a new alert @@ -28,7 +31,10 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { title: '', html: '', weight: false, - faicon: false, + fa: false, + faicon: false, // BC + close : false, + getAutoCreate : function() { @@ -37,6 +43,13 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { tag : 'div', cls : 'alert', cn : [ + { + tag: 'button', + type : "button", + cls: "close", + html : '×', + style : this.close ? '' : 'display:none' + }, { tag : 'i', cls : 'roo-alert-icon' @@ -58,6 +71,9 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { if(this.faicon){ cfg.cn[0].cls += ' fa ' + this.faicon; } + if(this.fa){ + cfg.cn[0].cls += ' fa ' + this.fa; + } if(this.weight){ cfg.cls += ' alert-' + this.weight; @@ -69,38 +85,43 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { initEvents: function() { this.el.setVisibilityMode(Roo.Element.DISPLAY); + this.titleEl = this.el.select('.roo-alert-title',true).first(); + this.iconEl = this.el.select('.roo-alert-icon',true).first(); + if (this.seconds > 0) { + this.hide.defer(this.seconds, this); + } }, setTitle : function(str) { - this.el.select('.roo-alert-title',true).first().dom.innerHTML = str; + this.titleEl.dom.innerHTML = str; }, setText : function(str) { - this.el.select('.roo-alert-text',true).first().dom.innerHTML = str; + this.titleEl.dom.innerHTML = str; }, setWeight : function(weight) { if(this.weight){ - this.el.select('.alert',true).first().removeClass('alert-' + this.weight); + this.el.removeClass('alert-' + this.weight); } this.weight = weight; - this.el.select('.alert',true).first().addClass('alert-' + this.weight); + this.el.addClass('alert-' + this.weight); }, setIcon : function(icon) { if(this.faicon){ - this.el.select('.roo-alert-icon',true).first().removeClass(['fa', 'fa-' + this.faicon]); + this.alertEl.removeClass(['fa', 'fa-' + this.faicon]); } this.faicon = icon; - this.el.select('.roo-alert-icon',true).first().addClass(['fa', 'fa-' + this.faicon]); + this.alertEl.addClass(['fa', 'fa-' + this.faicon]); }, hide: function() diff --git a/Roo/bootstrap/Notification.js b/Roo/bootstrap/Notification.js new file mode 100644 index 0000000000..23161b26ea --- /dev/null +++ b/Roo/bootstrap/Notification.js @@ -0,0 +1,29 @@ +/*** + * + * + * A notificaiton using the alert mechanism + * + * ?? not complete.... + * + * Idea is a simple replacement to showing dialogs with data for stuff that is happening, but can disappear. + * + * eg. "Download should be starting" + * "XXX copied to clipboard" + * + * usage : + * Roo.bootstrap.Notification.alert( { html : xxxx , }) + */ + + + +Roo.bootstrap.Notification = { + + + alert : function( cfg ) + { + + + } + + +}; \ No newline at end of file diff --git a/Roo/util/Clipboard.js b/Roo/util/Clipboard.js new file mode 100644 index 0000000000..005fd04f9a --- /dev/null +++ b/Roo/util/Clipboard.js @@ -0,0 +1,38 @@ +/** + * @class Roo.util.Clipboard + * @static + * + * Clipboard UTILS + * + **/ +Roo.util.Clipboard = { + /** + * Writes a string to the clipboard - using the Clipboard API if https, otherwise using text area. + * @param {String} text to copy to clipboard + */ + write : function(text) { + // navigator clipboard api needs a secure context (https) + if (navigator.clipboard && window.isSecureContext) { + // navigator clipboard api method' + navigator.clipboard.writeText(text); + return ; + } + // text area method + var ta = document.createElement("textarea"); + ta.value = text; + // make the textarea out of viewport + ta.style.position = "fixed"; + ta.style.left = "-999999px"; + ta.style.top = "-999999px"; + document.body.appendChild(ta); + ta.focus(); + ta.select(); + document.execCommand('copy'); + (function() { + ta.remove(); + }).defer(100); + + } + +} + \ No newline at end of file diff --git a/buildSDK/dependancy_core.txt b/buildSDK/dependancy_core.txt index baec8d4f88..e3e91fa17b 100644 --- a/buildSDK/dependancy_core.txt +++ b/buildSDK/dependancy_core.txt @@ -60,6 +60,7 @@ Roo.util.Format Roo.MasterTemplate Roo.util.CSS Roo.util.ClickRepeater +Roo.util.Clipboard Roo.KeyNav Roo.KeyMap Roo.util.TextMetrics diff --git a/docs/json/roodata.json b/docs/json/roodata.json index 181ba3825e..3002d8493d 100644 --- a/docs/json/roodata.json +++ b/docs/json/roodata.json @@ -16164,6 +16164,12 @@ "desc" : "True if element can be rebuild from a HTML page", "memberOf" : "Roo.bootstrap.Component" }, + { + "name" : "close", + "type" : "Boolean", + "desc" : "true to show a x closer", + "memberOf" : "" + }, { "name" : "cls", "type" : "String", @@ -16189,7 +16195,7 @@ "memberOf" : "Roo.Component" }, { - "name" : "faicon", + "name" : "fa", "type" : "String", "desc" : "font-awesomeicon", "memberOf" : "" @@ -16221,6 +16227,12 @@ "desc" : "Specifies name attribute", "memberOf" : "Roo.bootstrap.Component" }, + { + "name" : "seconds", + "type" : "Number", + "desc" : "default:-1 Number of seconds until it disapears (-1 means never.)", + "memberOf" : "" + }, { "name" : "style", "type" : "String", @@ -37934,6 +37946,12 @@ "desc" : "which property holds the element that used for hide() / show() / disable() / enable()\ndefault is 'el' for forms you probably want to set this to fieldEl", "memberOf" : "Roo.Component" }, + { + "name" : "align", + "type" : "String", + "desc" : "default tl-bl? == below - how the menu should be aligned.", + "memberOf" : "" + }, { "name" : "allowDomMove", "type" : "Boolean", @@ -107549,6 +107567,11 @@ } ] }, + "Roo.util.Clipboard" : { + "props" : [], + "events" : [], + "methods" : [] + }, "Roo.util.DelayedTask" : { "props" : [], "events" : [], diff --git a/docs/src/Roo_bootstrap_Alert.js.html b/docs/src/Roo_bootstrap_Alert.js.html index 898babf639..4ce02be5a4 100644 --- a/docs/src/Roo_bootstrap_Alert.js.html +++ b/docs/src/Roo_bootstrap_Alert.js.html @@ -10,7 +10,10 @@ * @cfg {String} title The title of alert * @cfg {String} html The content of alert * @cfg {String} weight ( success | info | warning | danger ) - * @cfg {String} faicon font-awesomeicon + * @cfg {String} fa font-awesomeicon + * @cfg {Number} seconds default:-1 Number of seconds until it disapears (-1 means never.) + * @cfg {Boolean} close true to show a x closer + * * * @constructor * Create a new alert @@ -28,7 +31,10 @@ title: '', html: '', weight: false, - faicon: false, + fa: false, + faicon: false, // BC + close : false, + getAutoCreate : function() { @@ -37,6 +43,13 @@ tag : 'div', cls : 'alert', cn : [ + { + tag: 'button', + type : "button", + cls: "close", + html : '×', + style : this.close ? '' : 'display:none' + }, { tag : 'i', cls : 'roo-alert-icon' @@ -58,6 +71,9 @@ if(this.faicon){ cfg.cn[0].cls += ' fa ' + this.faicon; } + if(this.fa){ + cfg.cn[0].cls += ' fa ' + this.fa; + } if(this.weight){ cfg.cls += ' alert-' + this.weight; @@ -69,38 +85,43 @@ initEvents: function() { this.el.setVisibilityMode(Roo.Element.DISPLAY); + this.titleEl = this.el.select('.roo-alert-title',true).first(); + this.iconEl = this.el.select('.roo-alert-icon',true).first(); + if (this.seconds > 0) { + this.hide.defer(this.seconds, this); + } }, setTitle : function(str) { - this.el.select('.roo-alert-title',true).first().dom.innerHTML = str; + this.titleEl.dom.innerHTML = str; }, setText : function(str) { - this.el.select('.roo-alert-text',true).first().dom.innerHTML = str; + this.titleEl.dom.innerHTML = str; }, setWeight : function(weight) { if(this.weight){ - this.el.select('.alert',true).first().removeClass('alert-' + this.weight); + this.el.removeClass('alert-' + this.weight); } this.weight = weight; - this.el.select('.alert',true).first().addClass('alert-' + this.weight); + this.el.addClass('alert-' + this.weight); }, setIcon : function(icon) { if(this.faicon){ - this.el.select('.roo-alert-icon',true).first().removeClass(['fa', 'fa-' + this.faicon]); + this.alertEl.removeClass(['fa', 'fa-' + this.faicon]); } this.faicon = icon; - this.el.select('.roo-alert-icon',true).first().addClass(['fa', 'fa-' + this.faicon]); + this.alertEl.addClass(['fa', 'fa-' + this.faicon]); }, hide: function() diff --git a/docs/src/Roo_bootstrap_Menu.js.html b/docs/src/Roo_bootstrap_Menu.js.html index 69fbb6aa4e..4d1dfeb911 100644 --- a/docs/src/Roo_bootstrap_Menu.js.html +++ b/docs/src/Roo_bootstrap_Menu.js.html @@ -13,8 +13,9 @@ * @cfg {bool} hidden if the menu should be hidden when rendered. * @cfg {bool} stopEvent (true|false) Stop event after trigger press (default true) * @cfg {bool} isLink (true|false) the menu has link disable auto expand and collaspe (default false) - * @cfg {bool} hideTrigger (true|false) default false - hide the carret for trigger. - * + * @cfg {bool} hideTrigger (true|false) default false - hide the carret for trigger. + * @cfg {String} align default tl-bl? == below - how the menu should be aligned. + * @constructor * Create a new Menu * @param {Object} config The config object @@ -91,7 +92,7 @@ Roo.extend(Roo.bootstrap.Menu, Roo.bootstrap.Component, { /// html : false, - //align : '', + triggerEl : false, // is this set by component builder? -- it should really be fetched from parent()??? type: false, /** @@ -113,6 +114,8 @@ hideTrigger : false, + align : 'tl-bl?', + getChildContainer : function() { return this.el; @@ -124,7 +127,6 @@ // cfg.cn[1].cls += ' pull-right' //} - var cfg = { tag : 'ul', cls : 'dropdown-menu shadow' , @@ -275,8 +277,31 @@ if(!this.el){ this.render(); } + this.el.addClass('show'); // show otherwise we do not know how big we are.. + + var xy = this.el.getAlignToXY(el, pos); + + // bl-tl << left align below + // tl-bl << left align + + if(this.el.getWidth() + xy[0] >= Roo.lib.Dom.getViewWidth()){ + // if it goes to far to the right.. -> align left. + xy = this.el.getAlignToXY(el, this.align.replace('/l/g', 'r')) + } + if(xy[0] < 0){ + // was left align - go right? + xy = this.el.getAlignToXY(el, this.align.replace('/r/g', 'l')) + } - this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign), parentMenu, false); + // goes down the bottom + if(this.el.getHeight() + xy[1] >= Roo.lib.Dom.getViewHeight() || + xy[1] < 0 ){ + var a = this.align.replace('?', '').split('-'); + xy = this.el.getAlignToXY(el, a[1] + '-' + a[0] + '?') + + } + + this.showAt( xy , parentMenu, false); }, /** * Displays this menu at a specific xy position @@ -299,17 +324,13 @@ this.triggerEl.addClass('open'); this.el.addClass('show'); + + // reassign x when hitting right - if(this.el.getWidth() + xy[0] >= Roo.lib.Dom.getViewWidth()){ - xy[0] = xy[0] - this.el.getWidth() + this.triggerEl.getWidth(); - } - // reassign y when hitting bottom - if(this.el.getHeight() + xy[1] >= Roo.lib.Dom.getViewHeight()){ - xy[1] = xy[1] - this.el.getHeight() - this.triggerEl.getHeight(); - } + // reassign y when hitting bottom - // but the list may align on trigger left or trigger top... should it be a properity? + // but the list may align on trigger left or trigger top... should it be a properity? if(this.el.getStyle('top') != 'auto' && this.el.getStyle('top').slice(-1) != "%"){ this.el.setXY(xy); @@ -395,7 +416,8 @@ this.hide(); } else { Roo.log('show'); - this.show(this.triggerEl, '?', false); + + this.show(this.triggerEl, this.align, false); } if(this.stopEvent || e.getTarget().nodeName.toLowerCase() === 'i'){ diff --git a/docs/src/Roo_util_Clipboard.js.html b/docs/src/Roo_util_Clipboard.js.html new file mode 100644 index 0000000000..6240d74190 --- /dev/null +++ b/docs/src/Roo_util_Clipboard.js.html @@ -0,0 +1,38 @@ +Roo/util/Clipboard.js/** + * @class Roo.util.Clipboard + * @static + * + * Clipboard UTILS + * + **/ +Roo.util.Clipboard = { + /** + * Writes a string to the clipboard - using the Clipboard API if https, otherwise using text area. + * @param {String} text to copy to clipboard + */ + write : function(text) { + // navigator clipboard api needs a secure context (https) + if (navigator.clipboard && window.isSecureContext) { + // navigator clipboard api method' + navigator.clipboard.writeText(text); + return ; + } + // text area method + var ta = document.createElement("textarea"); + ta.value = text; + // make the textarea out of viewport + ta.style.position = "fixed"; + ta.style.left = "-999999px"; + ta.style.top = "-999999px"; + document.body.appendChild(ta); + ta.focus(); + ta.select(); + document.execCommand('copy'); + (function() { + ta.remove(); + }).defer(100); + + } + +} + \ No newline at end of file diff --git a/docs/symbols/Roo.bootstrap.Alert.json b/docs/symbols/Roo.bootstrap.Alert.json index 0f670d15d0..715be61df0 100644 --- a/docs/symbols/Roo.bootstrap.Alert.json +++ b/docs/symbols/Roo.bootstrap.Alert.json @@ -79,6 +79,20 @@ "memberOf" : "Roo.bootstrap.Alert", "values" : [] }, + { + "name" : "seconds", + "type" : "Number", + "desc" : "default:-1 Number of seconds until it disapears (-1 means never.)", + "memberOf" : "Roo.bootstrap.Alert", + "values" : [] + }, + { + "name" : "close", + "type" : "Boolean", + "desc" : "true to show a x closer", + "memberOf" : "Roo.bootstrap.Alert", + "values" : [] + }, { "name" : "style", "type" : "String", @@ -121,13 +135,6 @@ "memberOf" : "Roo.Component", "values" : [] }, - { - "name" : "faicon", - "type" : "String", - "desc" : "font-awesomeicon", - "memberOf" : "Roo.bootstrap.Alert", - "values" : [] - }, { "name" : "dataId", "type" : "string", @@ -147,6 +154,13 @@ "danger )" ] }, + { + "name" : "fa", + "type" : "String", + "desc" : "font-awesomeicon", + "memberOf" : "Roo.bootstrap.Alert", + "values" : [] + }, { "name" : "name", "type" : "string", diff --git a/docs/symbols/Roo.bootstrap.Menu.json b/docs/symbols/Roo.bootstrap.Menu.json index e02819f45b..62f07a38bf 100644 --- a/docs/symbols/Roo.bootstrap.Menu.json +++ b/docs/symbols/Roo.bootstrap.Menu.json @@ -65,6 +65,13 @@ "parent)" ] }, + { + "name" : "align", + "type" : "String", + "desc" : "default tl-bl? == below - how the menu should be aligned.", + "memberOf" : "Roo.bootstrap.Menu", + "values" : [] + }, { "name" : "hidden", "type" : "bool", diff --git a/docs/symbols/Roo.util.Clipboard.json b/docs/symbols/Roo.util.Clipboard.json new file mode 100644 index 0000000000..43df528217 --- /dev/null +++ b/docs/symbols/Roo.util.Clipboard.json @@ -0,0 +1,18 @@ +{ + "name" : "Roo.util.Clipboard", + "augments" : [], + "desc" : "Clipboard UTILS", + "isSingleton" : false, + "isStatic" : false, + "isBuiltin" : false, + "memberOf" : "Clipboard", + "example" : "", + "deprecated" : "", + "since" : "", + "see" : "", + "params" : [], + "returns" : [], + "config" : [], + "methods" : [], + "events" : [] +} \ No newline at end of file diff --git a/docs/tree.json b/docs/tree.json index b9e7054e6c..45b2d45645 100644 --- a/docs/tree.json +++ b/docs/tree.json @@ -1494,6 +1494,11 @@ "cn" : [], "is_class" : true }, + { + "name" : "Roo.util.Clipboard", + "cn" : [], + "is_class" : false + }, { "name" : "Roo.util.DelayedTask", "cn" : [], diff --git a/roojs-all.js b/roojs-all.js index 3c0949254a..e5313d0bc4 100644 --- a/roojs-all.js +++ b/roojs-all.js @@ -599,6 +599,9 @@ if(A<500){return 400;}else if(A<1700){return 320;}else if(A<2600){return 250;}el if(this.pressClass){this.el.removeClass(this.pressClass);}this.el.on("mouseover",this.handleMouseReturn,this);},handleMouseReturn:function(){this.el.un("mouseover",this.handleMouseReturn);if(this.pressClass){this.el.addClass(this.pressClass);}this.click(); },handleMouseUp:function(){clearTimeout(this.timer);this.el.un("mouseover",this.handleMouseReturn);this.el.un("mouseout",this.handleMouseOut);Roo.get(document).un("mouseup",this.handleMouseUp);this.el.removeClass(this.pressClass);this.fireEvent("mouseup",this); }}); +// Roo/util/Clipboard.js +Roo.util.Clipboard={write:function(A){if(navigator.clipboard&&window.isSecureContext){navigator.clipboard.writeText(A);return;}var ta=document.createElement("textarea");ta.value=A;ta.style.position="fixed";ta.style.left="-999999px";ta.style.top="-999999px"; +document.body.appendChild(ta);ta.focus();ta.select();document.execCommand('copy');(function(){ta.remove();}).defer(100);}}; // Roo/KeyNav.js Roo.KeyNav=function(el,A){this.el=Roo.get(el);Roo.apply(this,A);if(!this.disabled){this.disabled=true;this.enable();}};Roo.KeyNav.prototype={disabled:false,defaultEventAction:"stopEvent",forceKeyDown:false,prepareEvent:function(e){var k=e.getKey();var h=this.keyToHandler[k]; if(Roo.isSafari&&h&&k>=37&&k<=40){e.stopEvent();}},relay:function(e){var k=e.getKey();var h=this.keyToHandler[k];if(h&&this[h]){if(this.doRelay(e,this[h],h)!==true){e[this.defaultEventAction]();}}},doRelay:function(e,h,A){return h.call(this.scope||this,e); diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js index 6dff3ac4d0..d0da6a2875 100644 --- a/roojs-bootstrap-debug.js +++ b/roojs-bootstrap-debug.js @@ -29817,7 +29817,10 @@ Roo.apply(Roo.bootstrap.LocationPicker, { * @cfg {String} title The title of alert * @cfg {String} html The content of alert * @cfg {String} weight ( success | info | warning | danger ) - * @cfg {String} faicon font-awesomeicon + * @cfg {String} fa font-awesomeicon + * @cfg {Number} seconds default:-1 Number of seconds until it disapears (-1 means never.) + * @cfg {Boolean} close true to show a x closer + * * * @constructor * Create a new alert @@ -29835,7 +29838,10 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { title: '', html: '', weight: false, - faicon: false, + fa: false, + faicon: false, // BC + close : false, + getAutoCreate : function() { @@ -29844,6 +29850,13 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { tag : 'div', cls : 'alert', cn : [ + { + tag: 'button', + type : "button", + cls: "close", + html : '×', + style : this.close ? '' : 'display:none' + }, { tag : 'i', cls : 'roo-alert-icon' @@ -29865,6 +29878,9 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { if(this.faicon){ cfg.cn[0].cls += ' fa ' + this.faicon; } + if(this.fa){ + cfg.cn[0].cls += ' fa ' + this.fa; + } if(this.weight){ cfg.cls += ' alert-' + this.weight; @@ -29876,38 +29892,43 @@ Roo.extend(Roo.bootstrap.Alert, Roo.bootstrap.Component, { initEvents: function() { this.el.setVisibilityMode(Roo.Element.DISPLAY); + this.titleEl = this.el.select('.roo-alert-title',true).first(); + this.iconEl = this.el.select('.roo-alert-icon',true).first(); + if (this.seconds > 0) { + this.hide.defer(this.seconds, this); + } }, setTitle : function(str) { - this.el.select('.roo-alert-title',true).first().dom.innerHTML = str; + this.titleEl.dom.innerHTML = str; }, setText : function(str) { - this.el.select('.roo-alert-text',true).first().dom.innerHTML = str; + this.titleEl.dom.innerHTML = str; }, setWeight : function(weight) { if(this.weight){ - this.el.select('.alert',true).first().removeClass('alert-' + this.weight); + this.el.removeClass('alert-' + this.weight); } this.weight = weight; - this.el.select('.alert',true).first().addClass('alert-' + this.weight); + this.el.addClass('alert-' + this.weight); }, setIcon : function(icon) { if(this.faicon){ - this.el.select('.roo-alert-icon',true).first().removeClass(['fa', 'fa-' + this.faicon]); + this.alertEl.removeClass(['fa', 'fa-' + this.faicon]); } this.faicon = icon; - this.el.select('.roo-alert-icon',true).first().addClass(['fa', 'fa-' + this.faicon]); + this.alertEl.addClass(['fa', 'fa-' + this.faicon]); }, hide: function() diff --git a/roojs-bootstrap.js b/roojs-bootstrap.js index c4ff2bd321..b8dd8d8bc8 100644 --- a/roojs-bootstrap.js +++ b/roojs-bootstrap.js @@ -1259,11 +1259,11 @@ this.gMapContext.map.setCenter(this.gMapContext.marker.position);this.fireEvent( B.addressLine2="";return B;},setZoomLevel:function(A){this.gMapContext.map.setZoom(A);},show:function(){if(!this.el){return;}this.el.show();this.resize();this.fireEvent('show',this);},hide:function(){if(!this.el){return;}this.el.hide();this.fireEvent('hide',this); }});Roo.apply(Roo.bootstrap.LocationPicker,{OverlayView:function(A,B){B=B||{};this.setMap(A);}}); // Roo/bootstrap/Alert.js -Roo.bootstrap.Alert=function(A){Roo.bootstrap.Alert.superclass.constructor.call(this,A);};Roo.extend(Roo.bootstrap.Alert,Roo.bootstrap.Component,{title:'',html:'',weight:false,faicon:false,getAutoCreate:function(){var A={tag:'div',cls:'alert',cn:[{tag:'i',cls:'roo-alert-icon'} -,{tag:'b',cls:'roo-alert-title',html:this.title},{tag:'span',cls:'roo-alert-text',html:this.html}]};if(this.faicon){A.cn[0].cls+=' fa '+this.faicon;}if(this.weight){A.cls+=' alert-'+this.weight;}return A;},initEvents:function(){this.el.setVisibilityMode(Roo.Element.DISPLAY); -},setTitle:function(A){this.el.select('.roo-alert-title',true).first().dom.innerHTML=A;},setText:function(A){this.el.select('.roo-alert-text',true).first().dom.innerHTML=A;},setWeight:function(A){if(this.weight){this.el.select('.alert',true).first().removeClass('alert-'+this.weight); -}this.weight=A;this.el.select('.alert',true).first().addClass('alert-'+this.weight);},setIcon:function(A){if(this.faicon){this.el.select('.roo-alert-icon',true).first().removeClass(['fa','fa-'+this.faicon]);}this.faicon=A;this.el.select('.roo-alert-icon',true).first().addClass(['fa','fa-'+this.faicon]); -},hide:function(){this.el.hide();},show:function(){this.el.show();}}); +Roo.bootstrap.Alert=function(A){Roo.bootstrap.Alert.superclass.constructor.call(this,A);};Roo.extend(Roo.bootstrap.Alert,Roo.bootstrap.Component,{title:'',html:'',weight:false,fa:false,faicon:false,close:false,getAutoCreate:function(){var A={tag:'div',cls:'alert',cn:[{tag:'button',type:"button",cls:"close",html:'×',style:this.close?'':'display:none'} +,{tag:'i',cls:'roo-alert-icon'},{tag:'b',cls:'roo-alert-title',html:this.title},{tag:'span',cls:'roo-alert-text',html:this.html}]};if(this.faicon){A.cn[0].cls+=' fa '+this.faicon;}if(this.fa){A.cn[0].cls+=' fa '+this.fa;}if(this.weight){A.cls+=' alert-'+this.weight; +}return A;},initEvents:function(){this.el.setVisibilityMode(Roo.Element.DISPLAY);this.titleEl=this.el.select('.roo-alert-title',true).first();this.iconEl=this.el.select('.roo-alert-icon',true).first();if(this.seconds>0){this.hide.defer(this.seconds,this); +}},setTitle:function(A){this.titleEl.dom.innerHTML=A;},setText:function(A){this.titleEl.dom.innerHTML=A;},setWeight:function(A){if(this.weight){this.el.removeClass('alert-'+this.weight);}this.weight=A;this.el.addClass('alert-'+this.weight);},setIcon:function(A){if(this.faicon){this.alertEl.removeClass(['fa','fa-'+this.faicon]); +}this.faicon=A;this.alertEl.addClass(['fa','fa-'+this.faicon]);},hide:function(){this.el.hide();},show:function(){this.el.show();}}); // Roo/bootstrap/UploadCropbox.js Roo.bootstrap.UploadCropbox=function(A){Roo.bootstrap.UploadCropbox.superclass.constructor.call(this,A);this.addEvents({"beforeselectfile":true,"initial":true,"crop":true,"prepare":true,"exception":true,"beforeloadcanvas":true,"trash":true,"download":true,"footerbuttonclick":true,"resize":true,"rotate":true,"inspect":true,"upload":true,"arrange":true} );this.buttons=this.buttons||Roo.bootstrap.UploadCropbox.footer.STANDARD;};Roo.extend(Roo.bootstrap.UploadCropbox,Roo.bootstrap.Component,{emptyText:'Click to upload image',rotateNotify:'Image is too small to rotate',errorTimeout:3000,scale:0,baseScale:1,rotate:0,dragable:false,pinching:false,mouseX:0,mouseY:0,cropData:false,minWidth:300,minHeight:300,file:false,exif:{} diff --git a/roojs-core-debug.js b/roojs-core-debug.js index 56a6c4cb63..02931daa5c 100644 --- a/roojs-core-debug.js +++ b/roojs-core-debug.js @@ -14505,7 +14505,44 @@ Roo.extend(Roo.util.ClickRepeater, Roo.util.Observable, { this.el.removeClass(this.pressClass); this.fireEvent("mouseup", this); } -});/* +});/** + * @class Roo.util.Clipboard + * @static + * + * Clipboard UTILS + * + **/ +Roo.util.Clipboard = { + /** + * Writes a string to the clipboard - using the Clipboard API if https, otherwise using text area. + * @param {String} text to copy to clipboard + */ + write : function(text) { + // navigator clipboard api needs a secure context (https) + if (navigator.clipboard && window.isSecureContext) { + // navigator clipboard api method' + navigator.clipboard.writeText(text); + return ; + } + // text area method + var ta = document.createElement("textarea"); + ta.value = text; + // make the textarea out of viewport + ta.style.position = "fixed"; + ta.style.left = "-999999px"; + ta.style.top = "-999999px"; + document.body.appendChild(ta); + ta.focus(); + ta.select(); + document.execCommand('copy'); + (function() { + ta.remove(); + }).defer(100); + + } + +} + /* * Based on: * Ext JS Library 1.1.1 * Copyright(c) 2006-2007, Ext JS, LLC. diff --git a/roojs-core.js b/roojs-core.js index 9f53e2bc87..0d25211989 100644 --- a/roojs-core.js +++ b/roojs-core.js @@ -599,6 +599,9 @@ if(A<500){return 400;}else if(A<1700){return 320;}else if(A<2600){return 250;}el if(this.pressClass){this.el.removeClass(this.pressClass);}this.el.on("mouseover",this.handleMouseReturn,this);},handleMouseReturn:function(){this.el.un("mouseover",this.handleMouseReturn);if(this.pressClass){this.el.addClass(this.pressClass);}this.click(); },handleMouseUp:function(){clearTimeout(this.timer);this.el.un("mouseover",this.handleMouseReturn);this.el.un("mouseout",this.handleMouseOut);Roo.get(document).un("mouseup",this.handleMouseUp);this.el.removeClass(this.pressClass);this.fireEvent("mouseup",this); }}); +// Roo/util/Clipboard.js +Roo.util.Clipboard={write:function(A){if(navigator.clipboard&&window.isSecureContext){navigator.clipboard.writeText(A);return;}var ta=document.createElement("textarea");ta.value=A;ta.style.position="fixed";ta.style.left="-999999px";ta.style.top="-999999px"; +document.body.appendChild(ta);ta.focus();ta.select();document.execCommand('copy');(function(){ta.remove();}).defer(100);}}; // Roo/KeyNav.js Roo.KeyNav=function(el,A){this.el=Roo.get(el);Roo.apply(this,A);if(!this.disabled){this.disabled=true;this.enable();}};Roo.KeyNav.prototype={disabled:false,defaultEventAction:"stopEvent",forceKeyDown:false,prepareEvent:function(e){var k=e.getKey();var h=this.keyToHandler[k]; if(Roo.isSafari&&h&&k>=37&&k<=40){e.stopEvent();}},relay:function(e){var k=e.getKey();var h=this.keyToHandler[k];if(h&&this[h]){if(this.doRelay(e,this[h],h)!==true){e[this.defaultEventAction]();}}},doRelay:function(e,h,A){return h.call(this.scope||this,e); diff --git a/roojs-debug.js b/roojs-debug.js index 84a06ea9c1..ba91ad09ee 100644 --- a/roojs-debug.js +++ b/roojs-debug.js @@ -14505,7 +14505,44 @@ Roo.extend(Roo.util.ClickRepeater, Roo.util.Observable, { this.el.removeClass(this.pressClass); this.fireEvent("mouseup", this); } -});/* +});/** + * @class Roo.util.Clipboard + * @static + * + * Clipboard UTILS + * + **/ +Roo.util.Clipboard = { + /** + * Writes a string to the clipboard - using the Clipboard API if https, otherwise using text area. + * @param {String} text to copy to clipboard + */ + write : function(text) { + // navigator clipboard api needs a secure context (https) + if (navigator.clipboard && window.isSecureContext) { + // navigator clipboard api method' + navigator.clipboard.writeText(text); + return ; + } + // text area method + var ta = document.createElement("textarea"); + ta.value = text; + // make the textarea out of viewport + ta.style.position = "fixed"; + ta.style.left = "-999999px"; + ta.style.top = "-999999px"; + document.body.appendChild(ta); + ta.focus(); + ta.select(); + document.execCommand('copy'); + (function() { + ta.remove(); + }).defer(100); + + } + +} + /* * Based on: * Ext JS Library 1.1.1 * Copyright(c) 2006-2007, Ext JS, LLC. -- 2.39.2