From 4adca0d7bd319d3facf22aeea34fb6f2d728e628 Mon Sep 17 00:00:00 2001 From: Alan Date: Wed, 27 Dec 2023 11:32:38 +0800 Subject: [PATCH] fix #7846 - password entry item - with option show pass --- Roo/form/Password.js | 55 ++++ Roo/form/TextField.js | 3 +- buildSDK/dependancy_ui.txt | 1 + css/form.css | 22 ++ css/roojs.css | 2 +- docs/.roobuilder.jcfg | 13 + .../Roo_bootstrap_form_MultiLineTag.js.html | 240 ++++++++++++++++++ .../src/Roo_htmleditor_FilterHashLink.js.html | 36 +++ .../Roo.bootstrap.form.MultiLineTag.json | 65 +++++ .../Roo.htmleditor.FilterHashLink.json | 32 +++ examples/bootstrap/.roobuilder.jcfg | 13 + examples/grid/.roobuilder.jcfg | 13 + examples/test.html | 26 ++ examples/test.js | 6 + roojs-all.js | 7 +- roojs-debug.js | 57 ++++- roojs-ui-debug.js | 57 ++++- roojs-ui.js | 7 +- 18 files changed, 649 insertions(+), 6 deletions(-) create mode 100644 Roo/form/Password.js create mode 100644 docs/.roobuilder.jcfg create mode 100644 docs/src/Roo_bootstrap_form_MultiLineTag.js.html create mode 100644 docs/src/Roo_htmleditor_FilterHashLink.js.html create mode 100644 docs/symbols/Roo.bootstrap.form.MultiLineTag.json create mode 100644 docs/symbols/Roo.htmleditor.FilterHashLink.json create mode 100644 examples/bootstrap/.roobuilder.jcfg create mode 100644 examples/grid/.roobuilder.jcfg create mode 100644 examples/test.html create mode 100644 examples/test.js diff --git a/Roo/form/Password.js b/Roo/form/Password.js new file mode 100644 index 0000000000..aac10697c6 --- /dev/null +++ b/Roo/form/Password.js @@ -0,0 +1,55 @@ +Roo.form.Password = function(config){ + Roo.form.Password.superclass.constructor.call(this, config); + + this.inputType = 'password'; +}; + +Roo.extend(Roo.form.Password, Roo.form.TextField, { + onRender : function(ct, position) + { + Roo.form.Password.superclass.onRender.call(this, ct, position); + + this.parentEl().addClass('form-password'); + + this.wrap = this.el.wrap({ + cls : 'password-wrap' + }); + + this.toggle = this.wrap.createChild({ + tag : 'Button', + cls : 'password-toggle' + }); + + + this.toggleEl().addClass('password-hidden'); + + this.toggleEl().on('click', this.onToggleClick, this);; + }, + + parentEl : function() + { + return this.el.findParent('.x-form-element', 5, true); + }, + + toggleEl: function() + { + return this.parentEl().select('button.password-toggle',true).first(); + }, + + onToggleClick : function(e) + { + var input = this.el; + var toggle = this.toggleEl(); + + toggle.removeClass(['password-visible', 'password-hidden']); + + if(input.attr('type') == 'password') { + input.attr('type', 'text'); + toggle.addClass('password-visible'); + } + else { + input.attr('type', 'password'); + toggle.addClass('password-hidden'); + } + } +}); \ No newline at end of file diff --git a/Roo/form/TextField.js b/Roo/form/TextField.js index de50897fa2..c4e292c7bb 100644 --- a/Roo/form/TextField.js +++ b/Roo/form/TextField.js @@ -325,7 +325,8 @@ Roo.extend(Roo.form.TextField, Roo.form.Field, { return; } - if(isSelectAll && event.getCharCode() > 31){ // backspace and delete key + // skip handling paste + if(isSelectAll && event.getCharCode() > 31 && !(event.ctrlKey && event.getCharCode() == 86)){ // backspace and delete key event.preventDefault(); // this is very hacky as keydown always get's upper case. diff --git a/buildSDK/dependancy_ui.txt b/buildSDK/dependancy_ui.txt index 16b1cc4023..38d8b582a4 100644 --- a/buildSDK/dependancy_ui.txt +++ b/buildSDK/dependancy_ui.txt @@ -83,6 +83,7 @@ Roo.menu.ColorMenu Roo.form.TextItem Roo.form.Field Roo.form.TextField +Roo.form.Password Roo.form.Hidden Roo.form.TriggerField Roo.form.TextArea diff --git a/css/form.css b/css/form.css index a9dfbc1c78..d22dfbbd10 100644 --- a/css/form.css +++ b/css/form.css @@ -73,6 +73,28 @@ padding-top: 2px; padding-bottom: 2px; } + +.form-password .password-wrap { + display: flex; + width: 200px; +} + +.form-password .password-toggle { + width: 17px; + border: 1px solid #9ab; + border-left: none; + background-repeat: no-repeat; + background-position: center; + background-size: contain; +} + +.form-password .password-visible { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAnUExURUdwTDExMTAwMDExMTMzMzExMTExMTAwMDAwMDIyMjIyMjAwMDIyMtDcR4EAAAAMdFJOUwDfIO86ksUQf1ivcKwSZ8wAAABaSURBVBjTY2AYcMB4Bg4EUDlMMtZgFezNBxUY2GXOSDgwMDA1nzlWwMB6cOKZw2lpNmcyZQIYmI0YvEAaljAoA/UoMLAedXGJCQCxQKYfYWDwMYBZJQDBlAMAlfIjX/5EzDQAAAAASUVORK5CYII=') !important; +} + +.form-password .password-hidden { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAtUExURUdwTDAwMDAwMDExMTExMTExMTExMTIyMjExMTAwMDAwMDIyMjIyMjAwMDIyMm633p8AAAAOdFJOUwAgEN9BwKGQzzB/YO9gZ/nLrQAAAK1JREFUGNOdzzEKwkAUhOF1QcUUsiBaiVikDnqBLSy0E71AULAOFp4jeALxJIIXEc0mEhH+M/jW6AF0qvmqN0+pPzOz5ebbu0jWVW9ZD2fe6FBMwpSz7zXLUQ+buKGggVO6MClbwYCn0ixO5IKETAU8IgoBXGcJeRsEMdkB8oi7YM6zDqMLN0GTshYXxrISaMtWm6C6o/qUkzBmrD4T/LZ9tbTnsfz+ME3d7of3X1WUUZSrxwjQAAAAAElFTkSuQmCC') !important; +} /* on our demo's this is far to small diff --git a/css/roojs.css b/css/roojs.css index 0d6197fee4..6538844b00 100644 --- a/css/roojs.css +++ b/css/roojs.css @@ -1,7 +1,7 @@ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';} .roo-el-mask{z-index:20000;position:absolute;top:0;left:0;-moz-opacity:.5;opacity:.50;filter:alpha(opacity=50);background-color:#CCC;width:100%;height:100%;zoom:1;}.roo-el-mask-msg{position:absolute;z-index:20000;border:4px double #557;background-color:#fff;}.roo-el-mask-msg div{font:bold 13px "sans serif",tahoma,verdana,helvetica;z-index:20001;padding:4px 15px;color:#557;}.roo-align-right{text-align:right;}.x-body-masked{overflow:hidden!important;}.x-body-masked select,.ext-masked object,.ext-masked embed{visibility:hidden;}.roo-ie .roo-shim{filter:alpha(opacity=0);}.roo-shim{position:absolute;left:0;top:0 visibility:hidden;overflow:hidden;}.x-hidden{position:absolute;top:0;left:0;visibility:hidden;display:none;} .x-tabs-body{background:#fff;}.x-tabs-wrap{border-bottom:1px solid #6593cf;padding-top:2px;}.x-tabs-strip-wrap{width:100%;}.x-tabs-wrap table{position:relative;top:0;left:0;}.x-tabs-strip td{padding:0;}.x-tabs-strip a,.x-tabs-strip span,.x-tabs-strip em{display:block;}.x-tabs-strip a{text-decoration:none!important;-moz-outline:none;outline:none;cursor:pointer;}.x-tabs-strip .x-tabs-text{font:bold 11px tahoma,arial,helvetica;color:#666;overflow:hidden;white-space:nowrap;cursor:pointer;text-overflow:ellipsis;}.x-tabs-strip .on .x-tabs-text{cursor:default;color:#083772;}.x-tabs-strip .disabled .x-tabs-text{cursor:default;color:#aaa;}.x-tabs-strip .x-tabs-inner{padding:4px 10px;}.x-tabs-strip .on .x-tabs-right{background:url(../images/default/tabs/tab-sprite.gif) no-repeat right 0;}.x-tabs-strip .on .x-tabs-left{background:url(../images/default/tabs/tab-sprite.gif) no-repeat 0 -100px;}.x-tabs-strip .x-tabs-right{background:url(../images/default/tabs/tab-sprite.gif) no-repeat right -50px;padding-right:1px;}.x-tabs-strip .x-tabs-left{background:url(../images/default/tabs/tab-sprite.gif) no-repeat 0 -150px;}.x-tabs-strip a{position:relative;top:1px;left:0;}.x-tabs-strip .on a{position:relative;}.x-tabs-strip .x-tabs-closable .x-tabs-inner{padding-right:22px;position:relative;}.x-tabs-strip .x-tabs-closable .close-icon{line-height:1px;font-size:1px;background-image:url(../images/default/layout/layout-sprite.gif);background-repeat:no-repeat;background-position:50% -60px;display:block;position:absolute;right:5px;top:4px;width:12px;height:11px;cursor:pointer;}.x-tabs-strip .on .close-icon{background-image:url(../images/default/layout/layout-sprite.gif);background-repeat:no-repeat;background-position:50% -60px;}.x-tabs-strip .x-tabs-closable .close-over{background-image:url(../images/default/layout/layout-sprite.gif);background-repeat:no-repeat;background-position:50% -72px;}.x-tabs-bottom .x-tabs-wrap{border-top:1px solid #6593cf;border-bottom:0 none;padding-top:0;padding-bottom:2px;}.x-tabs-bottom .x-tabs-strip .x-tabs-right{background:url(../images/default/tabs/tab-btm-inactive-right-bg.gif) no-repeat bottom left;}.x-tabs-bottom .x-tabs-strip .x-tabs-left{background:url(../images/default/tabs/tab-btm-inactive-left-bg.gif) no-repeat bottom right;}.x-tabs-bottom .x-tabs-strip .on .x-tabs-right{background:url(../images/default/tabs/tab-btm-right-bg.gif) no-repeat bottom left;}.x-tabs-bottom .x-tabs-strip .on .x-tabs-left{background:url(../images/default/tabs/tab-btm-left-bg.gif) no-repeat bottom right;}.x-tabs-bottom .x-tabs-strip a{position:relative;top:0;left:0;}.x-tabs-bottom .x-tabs-strip .on a{margin-top:-1px;}.x-tabs-bottom .x-tabs-strip .on .x-tab-inner{padding-top:5px;} -.x-form{margin:5px;}.x-form-item label{clear:left;display:block;float:left;padding-left:0;padding-right:3px;padding-bottom:3px;padding-top:3px;position:relative;z-index:2;}.x-form-displayfield{padding-top:3px;}.x-form-label-right label{text-align:right;}.x-form-label-top .x-form-item label{clear:none;float:none;display:inline;position:static;margin-bottom:2px;width:auto;}.x-form-item,.x-form-text,.x-combo-list,.x-form fieldset legend{font:normal 11px tahoma,verdana,helvetica;}.x-form-item{display:block;margin-bottom:4px;}.x-form-element{padding-left:100px;position:relative;}.x-form-field{margin:0;}.x-form-text{height:18px;line-height:18px;vertical-align:middle;background:url(../images/default/form/bg.gif) repeat-x 0 0;padding-left:2px;padding-right:2px;padding-top:2px;padding-bottom:2px;}.x-form-item .x-form-text{height:14px;}.x-form-text,.x-form-textarea,.x-html-editor-wrap{border:solid 1px black;}.x-form-field-wrap{position:relative;whitespace:nowrap;}.roo-ie .roo-strict .x-form-text,.roo-ie .x-form-text{padding-top:0;padding-bottom:0;margin-top:-1px;height:22px;}.roo-ie .x-toolbar .x-form-text{padding-top:0;padding-left:2px;height:18px!important;}.roo-ie .x-form-date-trigger,.roo-ie .x-form-arrow-trigger{margin:0;margin-top:1px;height:20px!important;}.roo-gecko .roo-strict .x-form-text{height:18px;}.roo-gecko .x-form-item .x-form-text{height:16px;}.roo-gecko .x-form-text{height:18px;padding-top:2px;padding-bottom:0;}.x-form-empty-field{color:#666;}.x-form-invalid-icon{display:block;position:absolute;top:0;left:0;height:16px;width:16px;visibility:hidden;background:url(../images/default/tree/drop-no.gif) no-repeat 0 0;}.x-form-invalid{background:#ff0 url(../images/default/grid/invalid_line.gif) repeat-x 0 16px;border:1px solid red!important;}textarea.x-form-invalid{background:none;}.x-form-clear-left,.x-form-clear,{font-size:0;height:0;line-height:0;overflow:hidden;}.x-form-clear-left{clear:left;}.x-form-clear{clear:both;}.x-form-column{float:left;margin:0;padding:0;overflow:hidden;width:47%;}.x-form fieldset{border:1px solid #ccc;padding-top:7px;padding-left:12px;padding-bottom:7px;margin-bottom:9px;}.roo-ie .x-form fieldset{float:left;}.x-form fieldset legend{font-weight:bold;}.x-form-cb-label{clear:none!important;float:none!important;;display:inline!important;;margin-left:4px;}.x-form-field-wrap .x-form-trigger{cursor:pointer;border-left:0 solid;position:absolute;background:url(../images/default/combo/arrow.gif);background-repeat:no-repeat;background-position:center;}.x-form .x-form-btns-ct .x-form-btns-center{text-align:center;}.x-form .x-form-btns-ct .x-form-btns-center table{margin:0 auto;}.x-form .x-form-btns-ct .x-form-btns td.x-form-btn-td{padding:3px;}.x-form .x-form-btns-ct .x-form-btns td{border:0;padding:0;}.x-form .x-form-btns-ct .x-btn{clear:none;float:right;}.x-form-grow-sizer{position:absolute;top:-10000px;left:-10000px;visibility:hidden;} +.x-form{margin:5px;}.x-form-item label{clear:left;display:block;float:left;padding-left:0;padding-right:3px;padding-bottom:3px;padding-top:3px;position:relative;z-index:2;}.x-form-displayfield{padding-top:3px;}.x-form-label-right label{text-align:right;}.x-form-label-top .x-form-item label{clear:none;float:none;display:inline;position:static;margin-bottom:2px;width:auto;}.x-form-item,.x-form-text,.x-combo-list,.x-form fieldset legend{font:normal 11px tahoma,verdana,helvetica;}.x-form-item{display:block;margin-bottom:4px;}.x-form-element{padding-left:100px;position:relative;}.x-form-field{margin:0;}.x-form-text{height:18px;line-height:18px;vertical-align:middle;background:url(../images/default/form/bg.gif) repeat-x 0 0;padding-left:2px;padding-right:2px;padding-top:2px;padding-bottom:2px;}.form-password .password-wrap{display:flex;width:200px;}.form-password .password-toggle{width:17px;border:1px solid #9ab;border-left:none;background-repeat:no-repeat;background-position:center;background-size:contain;}.form-password .password-visible{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAnUExURUdwTDExMTAwMDExMTMzMzExMTExMTAwMDAwMDIyMjIyMjAwMDIyMtDcR4EAAAAMdFJOUwDfIO86ksUQf1ivcKwSZ8wAAABaSURBVBjTY2AYcMB4Bg4EUDlMMtZgFezNBxUY2GXOSDgwMDA1nzlWwMB6cOKZw2lpNmcyZQIYmI0YvEAaljAoA/UoMLAedXGJCQCxQKYfYWDwMYBZJQDBlAMAlfIjX/5EzDQAAAAASUVORK5CYII=')!important;}.form-password .password-hidden{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAtUExURUdwTDAwMDAwMDExMTExMTExMTExMTIyMjExMTAwMDAwMDIyMjIyMjAwMDIyMm633p8AAAAOdFJOUwAgEN9BwKGQzzB/YO9gZ/nLrQAAAK1JREFUGNOdzzEKwkAUhOF1QcUUsiBaiVikDnqBLSy0E71AULAOFp4jeALxJIIXEc0mEhH+M/jW6AF0qvmqN0+pPzOz5ebbu0jWVW9ZD2fe6FBMwpSz7zXLUQ+buKGggVO6MClbwYCn0ixO5IKETAU8IgoBXGcJeRsEMdkB8oi7YM6zDqMLN0GTshYXxrISaMtWm6C6o/qUkzBmrD4T/LZ9tbTnsfz+ME3d7of3X1WUUZSrxwjQAAAAAElFTkSuQmCC')!important;}.x-form-item .x-form-text{height:14px;}.x-form-text,.x-form-textarea,.x-html-editor-wrap{border:solid 1px black;}.x-form-field-wrap{position:relative;whitespace:nowrap;}.roo-ie .roo-strict .x-form-text,.roo-ie .x-form-text{padding-top:0;padding-bottom:0;margin-top:-1px;height:22px;}.roo-ie .x-toolbar .x-form-text{padding-top:0;padding-left:2px;height:18px!important;}.roo-ie .x-form-date-trigger,.roo-ie .x-form-arrow-trigger{margin:0;margin-top:1px;height:20px!important;}.roo-gecko .roo-strict .x-form-text{height:18px;}.roo-gecko .x-form-item .x-form-text{height:16px;}.roo-gecko .x-form-text{height:18px;padding-top:2px;padding-bottom:0;}.x-form-empty-field{color:#666;}.x-form-invalid-icon{display:block;position:absolute;top:0;left:0;height:16px;width:16px;visibility:hidden;background:url(../images/default/tree/drop-no.gif) no-repeat 0 0;}.x-form-invalid{background:#ff0 url(../images/default/grid/invalid_line.gif) repeat-x 0 16px;border:1px solid red!important;}textarea.x-form-invalid{background:none;}.x-form-clear-left,.x-form-clear,{font-size:0;height:0;line-height:0;overflow:hidden;}.x-form-clear-left{clear:left;}.x-form-clear{clear:both;}.x-form-column{float:left;margin:0;padding:0;overflow:hidden;width:47%;}.x-form fieldset{border:1px solid #ccc;padding-top:7px;padding-left:12px;padding-bottom:7px;margin-bottom:9px;}.roo-ie .x-form fieldset{float:left;}.x-form fieldset legend{font-weight:bold;}.x-form-cb-label{clear:none!important;float:none!important;;display:inline!important;;margin-left:4px;}.x-form-field-wrap .x-form-trigger{cursor:pointer;border-left:0 solid;position:absolute;background:url(../images/default/combo/arrow.gif);background-repeat:no-repeat;background-position:center;}.x-form .x-form-btns-ct .x-form-btns-center{text-align:center;}.x-form .x-form-btns-ct .x-form-btns-center table{margin:0 auto;}.x-form .x-form-btns-ct .x-form-btns td.x-form-btn-td{padding:3px;}.x-form .x-form-btns-ct .x-form-btns td{border:0;padding:0;}.x-form .x-form-btns-ct .x-btn{clear:none;float:right;}.x-form-grow-sizer{position:absolute;top:-10000px;left:-10000px;visibility:hidden;} .x-btn{font:normal 8pt tahoma,verdan,arial,helvetica;white-space:nowrap;text-decoration:none!important;color:black!important;-moz-user-select:none;-khtml-user-select:none;cursor:pointer;vertical-align:middle;text-align:center;border:0 none;}.x-btn em{font-weight:normal;font-style:normal;}.x-toolbar .x-btn-left,.x-toolbar .x-btn-right,.x-btn-left,.x-btn-right{font-size:1px;line-height:1px;width:3px;}.x-btn-left i .x-btn-right i{display:block;overflow:hidden;width:3px;line-height:1px;font-size:1px;}.x-btn-left,.x-btn-center,.x-btn-right{background-image:url(../images/default/basic-dialog/btn-sprite.gif);background-repeat:no-repeat;height:21px;vertical-align:middle;}.x-btn-left{background-position:0 0;}.x-btn-right{background-position:0 -21px;}.x-btn-center{background-position:0 -42px;background-repeat:repeat-x;width:auto;padding:0 5px;}.x-btn-clear .x-btn-center .x-btn-text{width:16px;height:16px;background:url(../images/default/basic-dialog/btn-clear.gif) no-repeat 0 0;}.x-btn-icon .x-btn-text{width:16px;}.x-btn-over .x-btn-left{background-position:0 -63px;}.x-btn-over .x-btn-right{background-position:0 -84px;}.x-btn-over .x-btn-center{background-position:0 -105px;}.x-btn-click .x-btn-left{background-position:0 -63px;}.x-btn-click .x-btn-right{background-position:0 -84px;}.x-btn-click .x-btn-center{background-position:0 -126px;}.x-btn .x-btn-disabled{cursor:default;}.x-btn-disabled .x-btn-center{color:gray;}.x-btn button{font-size:11px;background:none no-repeat scroll 0 0 transparent;cursor:pointer;margin:0;outline:none;color:-moz-use-text-color;overflow:visible;width:auto;border:0 none;}.x-btn-left i,.x-btn-right i{display:block;width:3px;}.roo-gecko .x-btn button{padding-left:0;padding-right:0;}.x-btn-text-icon .x-btn-center .x-btn-text{background-position:0 2px;background:none no-repeat scroll 0 0 transparent;padding:1px 0 1px 18px;}button.x-btn-menu-arrow-el{display:block;background:url(../images/default/grid/sort_desc.gif) no-repeat scroll left 7px;}.x-btn-text-icon .x-btn-with-menu .x-btn-center em{display:block;background:url(../images/default/grid/sort_desc.gif) no-repeat scroll right 6px;}.x-btn-with-menu .x-btn-center em{display:block;padding-right:14px;}.x-btn-pressed .x-btn-center .x-btn-text{padding:0 0 2px 0;} .x-toolbar{background:url(../images/default/toolbar/gray-bg.gif) repeat-x 0 0;border-top:1px solid #cbc7b8;border-bottom:1px solid #cbc7b8;display:block;position:relative;padding:1px;}.x-toolbar td,.x-toolbar span,.x-toolbar input,.x-toolbar div,.x-toolbar select,.x-toolbar label{font:normal 11px tahoma,verdana,helvetica;white-space:nowrap;line-height:normal;}.x-toolbar td{vertical-align:middle;}.x-toolbar .x-btn-center{padding:0;}.x-toolbar .x-btn-with-menu .x-btn-center em{padding-right:14px;}.x-toolbar .ytb-text{padding:2px;}.x-toolbar .x-btn-click .x-btn-center,.x-toolbar .x-btn-pressed .x-btn-center,.x-toolbar .x-btn-active .x-btn-center,.x-toolbar .x-btn-over .x-btn-center,.x-toolbar .x-btn-click .x-btn-left,.x-toolbar .x-btn-pressed .x-btn-left,.x-toolbar .x-btn-active .x-btn-left,.x-toolbar .x-btn-over .x-btn-left,.x-toolbar .x-btn-click .x-btn-right,.x-toolbar .x-btn-pressed .x-btn-right,.x-toolbar .x-btn-active .x-btn-right,.x-toolbar .x-btn-over .x-btn-right{background-repeat:no-repeat;background-image:url(../images/default/basic-dialog/btn-sprite.gif);}.x-toolbar .x-btn-click .x-btn-center,.x-toolbar .x-btn-pressed .x-btn-center,.x-toolbar .x-btn-active .x-btn-center{background-position:0 -42px;background-repeat:repeat-x;}.x-toolbar .x-btn-over .x-btn-center{background-position:0 -105px;background-repeat:repeat-x;}.x-toolbar .x-btn-click .x-btn-left,.x-toolbar .x-btn-pressed .x-btn-left,.x-toolbar .x-btn-active .x-btn-left{background-position:0 0;}.x-toolbar .x-btn-over .x-btn-left{background-position:0 -63px;}.x-toolbar .x-btn-click .x-btn-right,.x-toolbar .x-btn-pressed .x-btn-right,.x-toolbar .x-btn-active .x-btn-right{background-position:0 -21px;}.x-toolbar .x-btn-over .x-btn-right{background-position:0 -84px;}.x-toolbar .x-form-text{height:14px;}.roo-gecko .x-toolbar .x-form-text{height:16px;}.x-menu{background:white url(../images/default/menu/menu-bg.gif) repeat-y 0 0;font:normal 11px arial,tahoma,verdana,helvetica;border:1px solid black;margin-top:2px;margin-left:2px;max-height:95%;overflow-y:auto;}.x-menu-plain{background:none;}.x-menu-plain .x-menu-list-item .x-color-palette,.x-menu-plain .x-menu-list-item .x-date-picker{margin-left:4px;margin-right:0;}.x-menu-focus{position:absolute;left:0;top:-5px;width:0;height:0;}.x-menu-list{border:1px solid white;}.x-menu li{line-height:100%;}.x-menu-list-item{-moz-user-select:none;display:block;white-space:nowrap;}.x-menu-item{color:#333;display:block;line-height:15px;outline:none;padding:3px 21px 3px 3px;text-decoration:none;white-space:nowrap;}.x-menu-item-active{background-color:#ABC9C2;}.x-menu li.x-menu-sep-li{font-size:1px;line-height:1px;background:#ccc;display:block;height:1px;margin:3px 3px 3px 32px;}.x-menu-item-icon{background-position:center center;border:0;width:16px;height:16px;padding:0;margin:0 11px 0 0;vertical-align:middle;}.x-menu-list-item .x-menu-item-arrow{background:url(../images/default/grid/page-next.gif) no-repeat right 2px;}.x-item-disabled .x-menu-item,.x-item-disabled{color:#ccc;cursor:default!important;}.x-menu-check-item .x-menu-item-icon{background:url(../images/default/menu/chk-sprite.gif) no-repeat 0 0;width:16px;height:16px;}.x-menu-item-checked .x-menu-item-icon{background-position:0 -16px;width:16px;height:16px;}.x-toolbar .x-tb-button-disabled .x-tb-button-inner{color:gray;cursor:default;}.x-toolbar .ytb-sep{background-image:url(../images/default/grid/grid-split.gif);background-position:center center;background-repeat:no-repeat;border:0 none;cursor:default;display:block;font-size:1px;height:16px;margin:0 2px;overflow:hidden;width:4px;}.x-tabs-strip-wrap .x-toolbar{background:none!important;}.x-tab-strip-toolbar{width:100%;} .x-resizable-handle{position:absolute;z-index:100;font-size:1px;line-height:6px;overflow:hidden;background:white;filter:alpha(opacity=0);opacity:0;zoom:1;}.x-resizable-handle-east{width:6px;cursor:e-resize;right:0;top:0;height:100%;margin-right:-1px;}.x-resizable-handle-south{width:100%;cursor:s-resize;left:0;bottom:0;height:6px;margin-bottom:-1px;}.x-resizable-handle-west{width:6px;cursor:w-resize;left:0;top:0;height:100%;}.x-resizable-handle-north{width:100%;cursor:n-resize;left:0;top:0;height:6px;}.x-resizable-handle-southeast{width:6px;cursor:se-resize;right:0;bottom:0;height:6px;z-index:101;}.x-resizable-handle-northwest{width:6px;cursor:nw-resize;left:0;top:0;height:6px;z-index:101;}.x-resizable-handle-northeast{width:6px;cursor:ne-resize;right:0;top:0;height:6px;z-index:101;}.x-resizable-handle-southwest{width:6px;cursor:sw-resize;left:0;bottom:0;height:6px;z-index:101;}.x-resizable-over .x-resizable-handle,.x-resizable-pinned .x-resizable-handle{filter:alpha(opacity=100);opacity:1;}.x-resizable-over .x-resizable-handle-east,.x-resizable-pinned .x-resizable-handle-east{background:url("../images/default/sizer/e-handle.gif");background-position:left;}.x-resizable-over .x-resizable-handle-west,.x-resizable-pinned .x-resizable-handle-west{background:url("../images/default/sizer/e-handle.gif");background-position:left;}.x-resizable-over .x-resizable-handle-south,.x-resizable-pinned .x-resizable-handle-south{background:url("../images/default/sizer/s-handle.gif");background-position:top;}.x-resizable-over .x-resizable-handle-north,.x-resizable-pinned .x-resizable-handle-north{background:url("../images/default/sizer/s-handle.gif");background-position:top;}.x-resizable-over .x-resizable-handle-southeast,.x-resizable-pinned .x-resizable-handle-southeast{background:url("../images/default/sizer/corners-sprite.gif");background-position:top left;}.x-resizable-over .x-resizable-handle-northwest,.x-resizable-pinned .x-resizable-handle-northwest{background:url("../images/default/sizer/corners-sprite.gif");background-position:bottom right;}.x-resizable-over .x-resizable-handle-northeast,.x-resizable-pinned .x-resizable-handle-northeast{background:url("../images/default/sizer/corners-sprite.gif");background-position:bottom left;}.x-resizable-over .x-resizable-handle-southwest,.x-resizable-pinned .x-resizable-handle-southwest{background:url("../images/default/sizer/corners-sprite.gif");background-position:top right;}.x-resizable-proxy{border:1px dashed #6593cf;position:absolute;overflow:hidden;visibility:hidden;left:0;top:0;z-index:1001;}.x-resizable-overlay{width:100%;height:100%;display:none;position:absolute;left:0;top:0;background:white;z-index:20000;-moz-opacity:0;opacity:0;filter:alpha(opacity=0);border:1px solid red;} diff --git a/docs/.roobuilder.jcfg b/docs/.roobuilder.jcfg new file mode 100644 index 0000000000..7eb9152e8c --- /dev/null +++ b/docs/.roobuilder.jcfg @@ -0,0 +1,13 @@ +{ + "name" : "docs", + "xtype" : "Roo", + "fn" : "79298568326b85a8da690463c6b3fdfd", + "runhtml" : "", + "rootURL" : "http://localhost/", + "base_template" : "bootstrap.builder.html", + "html_gen" : "", + "DBTYPE" : "", + "DBNAME" : "", + "DBUSERNAME" : "", + "DBPASSWORD" : "" +} \ No newline at end of file diff --git a/docs/src/Roo_bootstrap_form_MultiLineTag.js.html b/docs/src/Roo_bootstrap_form_MultiLineTag.js.html new file mode 100644 index 0000000000..59f6ef73be --- /dev/null +++ b/docs/src/Roo_bootstrap_form_MultiLineTag.js.html @@ -0,0 +1,240 @@ +Roo/bootstrap/form/MultiLineTag.js/** + * + * @class Roo.bootstrap.form.MultiLineTag + * @param {Object} config The config object + * + */ + +Roo.bootstrap.form.MultiLineTag = function(config){ + Roo.bootstrap.form.MultiLineTag.superclass.constructor.call(this, config); + + this.addEvents({ + /** + * @event beforeload + * Fires before a request is made for a new data object. If the beforeload handler returns false + * the load action will be canceled. + * @param {Roo.boostrap.form.MultiLineTag} this + * @param {Store} store + * @param {Object} options The loading options that were specified (see {@link #load} for details) + */ + beforeload : true + }); +}; + +Roo.extend(Roo.bootstrap.form.MultiLineTag, Roo.bootstrap.form.Input, { + tagRows : [], + minimumRow : 2, + + // for combo box + displayField : '', + valueField : '', + placeholder : '', + queryParam : '', + listWidth : 300, + minChars : 2, + + // for combo box store + url : undefined, + fields : [], + + + + getAutoCreate : function() + { + var config = { + cls : 'roo-multi-line-tag form-group' + }; + + config = this.getAutoCreateLabel( config, { + cls : 'roo-multi-line-tag-container' + } ); + + return config; + }, + + initEvents : function() + { + this.tagRows = []; + + for (var i = 0; i < this.minimumRow; i++) { + this.addTagRow(); + } + }, + + addTagRow : function() + { + var _this = this; + + var comboBox = Roo.factory({ + xns: Roo.bootstrap.form, + xtype : 'ComboBox', + editable : true, + triggerAction: 'all', + minChars: _this.minChars, + displayField: _this.displayField, + valueField : _this.valueField, + listWidth: _this.listWidth, + placeholder : _this.placeholder, + queryParam : _this.queryParam, + store : { + xns : Roo.data, + xtype : 'Store', + listeners : { + beforeload : function(_self, options) + { + _this.fireEvent('beforeload', _this, _self, options); + } + }, + proxy : { + xns : Roo.data, + xtype : 'HttpProxy', + method : 'GET', + url : _this.url + }, + reader : { + xns : Roo.data, + xtype : 'JsonReader', + fields : _this.fields + } + }, + listeners : { + 'render' : function (_self) { + _self.inputEl().on('keyup', function(e) { + if(_this.shouldAutoAddTagRow()) { + _this.addTagRow(); + } + }); + _self.inputEl().on('change', function(e) { + _this.fireEvent('change', _this, _this.getValue(), false); + _this.showHideRemoveBtn(); + + }); + }, + 'select' : function(_self, record, index) { + _this.fireEvent('change', _this, _this.getValue(), false); + } + } + }); + + var button = Roo.factory({ + xns : Roo.bootstrap, + xtype : 'Button', + html : '-' + }); + + var row = { + xns : Roo.bootstrap, + xtype : 'Row', + items : [ + comboBox, + button + ], + listeners : { + 'render' : function (_self) { + this.inputCb = comboBox; + this.removeBtn = button; + + this.removeBtn.on('click', function() { + _this.removeTagRow(_self); + _this.fireEvent('change', _this, _this.getValue(), false); + }); + } + } + }; + this.tagRows.push(this.addxtype(row)); + + _this.showHideRemoveBtn(); + }, + + // a new tags should be added automatically when all existing tags are not empty + shouldAutoAddTagRow : function() + { + var ret = true; + + Roo.each(this.tagRows, function(r) { + if(r.inputCb.getRawValue() == '') { + ret = false; + } + }); + + return ret; + }, + + removeTagRow : function(row) + { + row.destroy(); + this.tagRows.splice(this.tagRows.indexOf(row), 1); + this.showHideRemoveBtn(); + }, + + // hide all remove buttons if there are {minimumRow} or less tags + // hide the remove button for empty tag + showHideRemoveBtn : function() + { + var _this = this; + + Roo.each(this.tagRows, function (r) { + + r.removeBtn.show(); + + if(_this.tagRows.length <= _this.minimumRow || r.inputCb.getRawValue() == '') { + r.removeBtn.hide(); + } + }); + }, + + getValue : function() + { + var _this = this; + var tags = []; + Roo.each(_this.tagRows, function(r) { + var value = r.inputCb.getRawValue(); + if(value != '') { + var tag = {}; + tag[_this.valueField] = r.inputCb.getRawValue(); + tags.push(tag); + } + }); + + return JSON.stringify(tags); + }, + + setValue : function(json) + { + + // remove all old tags + var oldTotal = this.tagRows.length; + + for(var i = 0; i < oldTotal; i ++) { + this.removeTagRow(this.tagRows[0]); + } + + // empty tag if invalid json + var arr = []; + + try { + // set new tags + arr = JSON.parse(json); + } + catch {} + + for (var i = 0; i < arr.length; i ++) { + this.addTagRow(); + this.tagRows[i].inputCb.setRawValue(arr[i][this.valueField]); + } + + // always add one extra empty tag + this.addTagRow(); + + // add empty tags until there are {minimumRow} tags + while(this.tagRows.length < this.minimumRow) { + this.addTagRow(); + } + + }, + + getChildContainer : function() + { + return Roo.select('.roo-multi-line-tag-container', true).elements[0]; + } +}); \ No newline at end of file diff --git a/docs/src/Roo_htmleditor_FilterHashLink.js.html b/docs/src/Roo_htmleditor_FilterHashLink.js.html new file mode 100644 index 0000000000..0a7158bb4f --- /dev/null +++ b/docs/src/Roo_htmleditor_FilterHashLink.js.html @@ -0,0 +1,36 @@ +Roo/htmleditor/FilterHashLink.js/** + * @class Roo.htmleditor.FilterHashLink + * remove hash link + * @constructor + * Run a new Hash Link Filter + * @param {Object} config Configuration options + */ + + Roo.htmleditor.FilterHashLink = function(cfg) + { + // no need to apply config. + // this.walk(cfg.node); + this.searchTag(cfg.node); + } + + Roo.extend(Roo.htmleditor.FilterHashLink, Roo.htmleditor.Filter, + { + + tag : 'A', + + + replaceTag : function(node) + { + for(var i = 0; i < node.attributes.length; i ++) { + var a = node.attributes[i]; + + if(a.name.toLowerCase() == 'href' && a.value.startsWith('#')) { + this.removeNodeKeepChildren(node); + } + } + + return false; + + } + + }); \ No newline at end of file diff --git a/docs/symbols/Roo.bootstrap.form.MultiLineTag.json b/docs/symbols/Roo.bootstrap.form.MultiLineTag.json new file mode 100644 index 0000000000..a721eae2fe --- /dev/null +++ b/docs/symbols/Roo.bootstrap.form.MultiLineTag.json @@ -0,0 +1,65 @@ +{ + "name" : "Roo.bootstrap.form.MultiLineTag", + "augments" : [], + "childClasses" : { }, + "tree_children" : [], + "tree_parent" : [], + "desc" : "", + "isSingleton" : false, + "isStatic" : false, + "isBuiltin" : false, + "isAbstract" : false, + "isBuilderTop" : false, + "memberOf" : "MultiLineTag", + "example" : "", + "deprecated" : "", + "since" : "", + "see" : "", + "params" : [ + { + "name" : "config", + "type" : "Object", + "desc" : "The config object", + "isOptional" : false + } + ], + "returns" : [], + "throws" : "", + "requires" : "", + "config" : [], + "methods" : [], + "events" : [ + { + "name" : "beforeload", + "type" : "function", + "desc" : "Fires before a request is made for a new data object. If the beforeload handler returns false\nthe load action will be canceled.", + "sig" : "function (_self, store, options)\n{\n\n}", + "memberOf" : "", + "example" : "", + "deprecated" : "", + "since" : "", + "see" : "", + "params" : [ + { + "name" : "this", + "type" : "Roo.boostrap.form.MultiLineTag", + "desc" : "", + "isOptional" : false + }, + { + "name" : "store", + "type" : "Store", + "desc" : "", + "isOptional" : false + }, + { + "name" : "options", + "type" : "Object", + "desc" : "The loading options that were specified (see {@link #load} for details)", + "isOptional" : false + } + ], + "returns" : [] + } + ] +} \ No newline at end of file diff --git a/docs/symbols/Roo.htmleditor.FilterHashLink.json b/docs/symbols/Roo.htmleditor.FilterHashLink.json new file mode 100644 index 0000000000..89ab35b512 --- /dev/null +++ b/docs/symbols/Roo.htmleditor.FilterHashLink.json @@ -0,0 +1,32 @@ +{ + "name" : "Roo.htmleditor.FilterHashLink", + "augments" : [], + "childClasses" : { }, + "tree_children" : [], + "tree_parent" : [], + "desc" : "remove hash link", + "isSingleton" : false, + "isStatic" : false, + "isBuiltin" : false, + "isAbstract" : false, + "isBuilderTop" : false, + "memberOf" : "FilterHashLink", + "example" : "", + "deprecated" : "", + "since" : "", + "see" : "", + "params" : [ + { + "name" : "config", + "type" : "Object", + "desc" : "Configuration options", + "isOptional" : false + } + ], + "returns" : [], + "throws" : "", + "requires" : "", + "config" : [], + "methods" : [], + "events" : [] +} \ No newline at end of file diff --git a/examples/bootstrap/.roobuilder.jcfg b/examples/bootstrap/.roobuilder.jcfg new file mode 100644 index 0000000000..c65a2d1573 --- /dev/null +++ b/examples/bootstrap/.roobuilder.jcfg @@ -0,0 +1,13 @@ +{ + "name" : "bootstrap", + "xtype" : "Roo", + "fn" : "81b47aefdd9bd542aa5119aab347a526", + "runhtml" : " \n\n \n\n \n\n \n\n\n \n\n", + "rootURL" : "http://localhost/", + "base_template" : "bootstrap4.builder.html", + "html_gen" : "", + "DBTYPE" : "", + "DBNAME" : "", + "DBUSERNAME" : "", + "DBPASSWORD" : "" +} \ No newline at end of file diff --git a/examples/grid/.roobuilder.jcfg b/examples/grid/.roobuilder.jcfg new file mode 100644 index 0000000000..8c0e97bd0b --- /dev/null +++ b/examples/grid/.roobuilder.jcfg @@ -0,0 +1,13 @@ +{ + "name" : "grid", + "xtype" : "Roo", + "fn" : "db691fdb52c694f15ed3f26bbe8a4b39", + "runhtml" : "", + "rootURL" : "http://localhost/", + "base_template" : "", + "html_gen" : "", + "DBTYPE" : "", + "DBNAME" : "", + "DBUSERNAME" : "", + "DBPASSWORD" : "" +} \ No newline at end of file diff --git a/examples/test.html b/examples/test.html new file mode 100644 index 0000000000..a7ce7a63e6 --- /dev/null +++ b/examples/test.html @@ -0,0 +1,26 @@ + + + + + Test + + + + + + + + + + +

Test

+
+
+abc +

1122

+

+33 +
+b + + diff --git a/examples/test.js b/examples/test.js new file mode 100644 index 0000000000..d6a71d2291 --- /dev/null +++ b/examples/test.js @@ -0,0 +1,6 @@ +Roo.onReady(function() { + new Roo.htmleditor.FilterHashLink({ node : document.body }); + new Roo.htmleditor.FilterParagraph({ node : document.body }); + new Roo.htmleditor.FilterLongBr({ node : document.body }); + new Roo.htmleditor.FilterSpan({ node : document.body }); +}); \ No newline at end of file diff --git a/roojs-all.js b/roojs-all.js index d2b49a3cab..23dba23356 100644 --- a/roojs-all.js +++ b/roojs-all.js @@ -1681,7 +1681,12 @@ return false;}if(this.vtype){var vt=Roo.form.VTypes;if(!vt[this.vtype](A,this)){ }else if(d.createTextRange){var C=d.createTextRange();C.moveStart("character",A);C.moveEnd("character",v.length-B);C.select();}}},autoSize:function(){if(!this.grow||!this.rendered){return;}if(!this.metrics){this.metrics=Roo.util.TextMetrics.createInstance(this.el); }var el=this.el;var v=el.dom.value;var d=document.createElement('div');d.appendChild(document.createTextNode(v));v=d.innerHTML;d=null;v+=" ";var w=Math.min(this.growMax,Math.max(this.metrics.getWidth(v)+10,this.growMin));this.el.setWidth(w);this.fireEvent("autosize",this,w); },SafariOnKeyDown:function(A){var B=false;if(this.el.dom.selectionEnd>0){B=(this.el.dom.selectionEnd-this.el.dom.selectionStart-this.getValue().length==0)?true:false;}if(((A.getKey()==8||A.getKey()==46)&&this.getValue().length==1)){A.preventDefault();this.setValue(''); -return;}if(B&&A.getCharCode()>31){A.preventDefault();var cc=String.fromCharCode(A.getCharCode());this.setValue(A.shiftKey?cc:cc.toLowerCase());}}}); +return;}if(B&&A.getCharCode()>31&&!(A.ctrlKey&&A.getCharCode()==86)){A.preventDefault();var cc=String.fromCharCode(A.getCharCode());this.setValue(A.shiftKey?cc:cc.toLowerCase());}}}); +// Roo/form/Password.js +Roo.form.Password=function(A){Roo.form.Password.superclass.constructor.call(this,A);this.inputType='password';};Roo.extend(Roo.form.Password,Roo.form.TextField,{onRender:function(ct,A){Roo.form.Password.superclass.onRender.call(this,ct,A);this.parentEl().addClass('form-password'); +this.wrap=this.el.wrap({cls:'password-wrap'});this.toggle=this.wrap.createChild({tag:'Button',cls:'password-toggle'});this.toggleEl().addClass('password-hidden');this.toggleEl().on('click',this.onToggleClick,this);;},parentEl:function(){return this.el.findParent('.x-form-element',5,true); +},toggleEl:function(){return this.parentEl().select('button.password-toggle',true).first();},onToggleClick:function(e){var A=this.el;var B=this.toggleEl();B.removeClass(['password-visible','password-hidden']);if(A.attr('type')=='password'){A.attr('type','text'); +B.addClass('password-visible');}else{A.attr('type','password');B.addClass('password-hidden');}}}); // Roo/form/Hidden.js Roo.form.Hidden=function(A){Roo.form.Hidden.superclass.constructor.call(this,A);};Roo.extend(Roo.form.Hidden,Roo.form.TextField,{fieldLabel:'',inputType:'hidden',width:50,allowBlank:true,labelSeparator:'',hidden:true,itemCls:'x-form-item-display-none'}); // Roo/form/TriggerField.js diff --git a/roojs-debug.js b/roojs-debug.js index 3b51d8ab1b..14f49601de 100644 --- a/roojs-debug.js +++ b/roojs-debug.js @@ -41434,7 +41434,8 @@ Roo.extend(Roo.form.TextField, Roo.form.Field, { return; } - if(isSelectAll && event.getCharCode() > 31){ // backspace and delete key + // skip handling paste + if(isSelectAll && event.getCharCode() > 31 && !(event.ctrlKey && event.getCharCode() == 86)){ // backspace and delete key event.preventDefault(); // this is very hacky as keydown always get's upper case. @@ -41447,6 +41448,60 @@ Roo.extend(Roo.form.TextField, Roo.form.Field, { } + } +});Roo.form.Password = function(config){ + Roo.form.Password.superclass.constructor.call(this, config); + + this.inputType = 'password'; +}; + +Roo.extend(Roo.form.Password, Roo.form.TextField, { + onRender : function(ct, position) + { + Roo.form.Password.superclass.onRender.call(this, ct, position); + + this.parentEl().addClass('form-password'); + + this.wrap = this.el.wrap({ + cls : 'password-wrap' + }); + + this.toggle = this.wrap.createChild({ + tag : 'Button', + cls : 'password-toggle' + }); + + + this.toggleEl().addClass('password-hidden'); + + this.toggleEl().on('click', this.onToggleClick, this);; + }, + + parentEl : function() + { + return this.el.findParent('.x-form-element', 5, true); + }, + + toggleEl: function() + { + return this.parentEl().select('button.password-toggle',true).first(); + }, + + onToggleClick : function(e) + { + var input = this.el; + var toggle = this.toggleEl(); + + toggle.removeClass(['password-visible', 'password-hidden']); + + if(input.attr('type') == 'password') { + input.attr('type', 'text'); + toggle.addClass('password-visible'); + } + else { + input.attr('type', 'password'); + toggle.addClass('password-hidden'); + } } });/* * Based on: diff --git a/roojs-ui-debug.js b/roojs-ui-debug.js index 51956f7183..7d38d19f63 100644 --- a/roojs-ui-debug.js +++ b/roojs-ui-debug.js @@ -16932,7 +16932,8 @@ Roo.extend(Roo.form.TextField, Roo.form.Field, { return; } - if(isSelectAll && event.getCharCode() > 31){ // backspace and delete key + // skip handling paste + if(isSelectAll && event.getCharCode() > 31 && !(event.ctrlKey && event.getCharCode() == 86)){ // backspace and delete key event.preventDefault(); // this is very hacky as keydown always get's upper case. @@ -16945,6 +16946,60 @@ Roo.extend(Roo.form.TextField, Roo.form.Field, { } + } +});Roo.form.Password = function(config){ + Roo.form.Password.superclass.constructor.call(this, config); + + this.inputType = 'password'; +}; + +Roo.extend(Roo.form.Password, Roo.form.TextField, { + onRender : function(ct, position) + { + Roo.form.Password.superclass.onRender.call(this, ct, position); + + this.parentEl().addClass('form-password'); + + this.wrap = this.el.wrap({ + cls : 'password-wrap' + }); + + this.toggle = this.wrap.createChild({ + tag : 'Button', + cls : 'password-toggle' + }); + + + this.toggleEl().addClass('password-hidden'); + + this.toggleEl().on('click', this.onToggleClick, this);; + }, + + parentEl : function() + { + return this.el.findParent('.x-form-element', 5, true); + }, + + toggleEl: function() + { + return this.parentEl().select('button.password-toggle',true).first(); + }, + + onToggleClick : function(e) + { + var input = this.el; + var toggle = this.toggleEl(); + + toggle.removeClass(['password-visible', 'password-hidden']); + + if(input.attr('type') == 'password') { + input.attr('type', 'text'); + toggle.addClass('password-visible'); + } + else { + input.attr('type', 'password'); + toggle.addClass('password-hidden'); + } } });/* * Based on: diff --git a/roojs-ui.js b/roojs-ui.js index 3e156bc258..e6a506f687 100644 --- a/roojs-ui.js +++ b/roojs-ui.js @@ -734,7 +734,12 @@ return false;}if(this.vtype){var vt=Roo.form.VTypes;if(!vt[this.vtype](A,this)){ }else if(d.createTextRange){var C=d.createTextRange();C.moveStart("character",A);C.moveEnd("character",v.length-B);C.select();}}},autoSize:function(){if(!this.grow||!this.rendered){return;}if(!this.metrics){this.metrics=Roo.util.TextMetrics.createInstance(this.el); }var el=this.el;var v=el.dom.value;var d=document.createElement('div');d.appendChild(document.createTextNode(v));v=d.innerHTML;d=null;v+=" ";var w=Math.min(this.growMax,Math.max(this.metrics.getWidth(v)+10,this.growMin));this.el.setWidth(w);this.fireEvent("autosize",this,w); },SafariOnKeyDown:function(A){var B=false;if(this.el.dom.selectionEnd>0){B=(this.el.dom.selectionEnd-this.el.dom.selectionStart-this.getValue().length==0)?true:false;}if(((A.getKey()==8||A.getKey()==46)&&this.getValue().length==1)){A.preventDefault();this.setValue(''); -return;}if(B&&A.getCharCode()>31){A.preventDefault();var cc=String.fromCharCode(A.getCharCode());this.setValue(A.shiftKey?cc:cc.toLowerCase());}}}); +return;}if(B&&A.getCharCode()>31&&!(A.ctrlKey&&A.getCharCode()==86)){A.preventDefault();var cc=String.fromCharCode(A.getCharCode());this.setValue(A.shiftKey?cc:cc.toLowerCase());}}}); +// Roo/form/Password.js +Roo.form.Password=function(A){Roo.form.Password.superclass.constructor.call(this,A);this.inputType='password';};Roo.extend(Roo.form.Password,Roo.form.TextField,{onRender:function(ct,A){Roo.form.Password.superclass.onRender.call(this,ct,A);this.parentEl().addClass('form-password'); +this.wrap=this.el.wrap({cls:'password-wrap'});this.toggle=this.wrap.createChild({tag:'Button',cls:'password-toggle'});this.toggleEl().addClass('password-hidden');this.toggleEl().on('click',this.onToggleClick,this);;},parentEl:function(){return this.el.findParent('.x-form-element',5,true); +},toggleEl:function(){return this.parentEl().select('button.password-toggle',true).first();},onToggleClick:function(e){var A=this.el;var B=this.toggleEl();B.removeClass(['password-visible','password-hidden']);if(A.attr('type')=='password'){A.attr('type','text'); +B.addClass('password-visible');}else{A.attr('type','password');B.addClass('password-hidden');}}}); // Roo/form/Hidden.js Roo.form.Hidden=function(A){Roo.form.Hidden.superclass.constructor.call(this,A);};Roo.extend(Roo.form.Hidden,Roo.form.TextField,{fieldLabel:'',inputType:'hidden',width:50,allowBlank:true,labelSeparator:'',hidden:true,itemCls:'x-form-item-display-none'}); // Roo/form/TriggerField.js -- 2.39.2