How to use dialog method in redwood

Best JavaScript code snippet using redwood

dwz.dialog.js

Source:dwz.dialog.js Github

copy

Full Screen

1/**2 * @author Roger Wu3 * reference:dwz.drag.js, dwz.dialogDrag.js, dwz.resize.js, dwz.taskBar.js4 */5(function($){6 $.pdialog = {7 _op:{height:300, width:580, minH:40, minW:50, total:20, max:false, mask:false, resizable:true, drawable:true, maxable:true,minable:true,fresh:true},8 _current:null,9 _zIndex:42,10 getCurrent:function(){11 return this._current;12 },13 reload:function(url, options){14 var op = $.extend({data:{}, dialogId:"", callback:null}, options);15 var dialog = (op.dialogId && $("body").data(op.dialogId)) || this._current;16 if (dialog){17 var jDContent = dialog.find(".dialogContent");18 jDContent.ajaxUrl({19 type:"POST", url:url, data:op.data, callback:function(response){20 jDContent.find("[layoutH]").layoutH(jDContent);21 $(".pageContent", dialog).width($(dialog).width()-14);22 $(":button.close", dialog).click(function(){23 $.pdialog.close(dialog);24 return false;25 });26 if ($.isFunction(op.callback)) op.callback(response);27 }28 });29 }30 },31 //打开一个层32 open:function(url, dlgid, title, options) {33 var op = $.extend({},$.pdialog._op, options);34 var dialog = $("body").data(dlgid);35 //重复打开一个层36 if(dialog) {37 if(dialog.is(":hidden")) {38 dialog.show();39 }40 if(op.fresh || url != $(dialog).data("url")){41 dialog.data("url",url);42 dialog.find(".dialogHeader").find("h1").html(title);43 this.switchDialog(dialog);44 var jDContent = dialog.find(".dialogContent");45 jDContent.ajaxUrl({46 type:options.type||'GET', url:url, data:options.data || {}, callback:function(){47 jDContent.find("[layoutH]").layoutH(jDContent);48 $(".pageContent", dialog).width($(dialog).width()-14);49 $("button.close", dialog).click(function(){50 $.pdialog.close(dialog);51 return false;52 });53 }54 });55 }56 57 } else { //打开一个全新的层58 59 $("body").append(DWZ.frag["dialogFrag"]);60 dialog = $(">.dialog:last-child", "body");61 dialog.data("id",dlgid);62 dialog.data("url",url);63 if(options.close) dialog.data("close",options.close);64 if(options.param) dialog.data("param",options.param);65 ($.fn.bgiframe && dialog.bgiframe());66 67 dialog.find(".dialogHeader").find("h1").html(title);68 $(dialog).css("zIndex", ($.pdialog._zIndex+=2));69 $("div.shadow").css("zIndex", $.pdialog._zIndex - 3).show();70 $.pdialog._init(dialog, options);71 $(dialog).click(function(){72 $.pdialog.switchDialog(dialog);73 });74 75 if(op.resizable)76 dialog.jresize();77 if(op.drawable)78 dialog.dialogDrag();79 $("a.close", dialog).click(function(event){ 80 $.pdialog.close(dialog);81 return false;82 });83 if (op.maxable) {84 $("a.maximize", dialog).show().click(function(event){85 $.pdialog.switchDialog(dialog);86 $.pdialog.maxsize(dialog);87 dialog.jresize("destroy").dialogDrag("destroy");88 return false;89 });90 } else {91 $("a.maximize", dialog).hide();92 }93 $("a.restore", dialog).click(function(event){94 $.pdialog.restore(dialog);95 dialog.jresize().dialogDrag();96 return false;97 });98 if (op.minable) {99 $("a.minimize", dialog).show().click(function(event){100 $.pdialog.minimize(dialog);101 return false;102 });103 } else {104 $("a.minimize", dialog).hide();105 }106 $("div.dialogHeader a", dialog).mousedown(function(){107 return false;108 });109 $("div.dialogHeader", dialog).dblclick(function(){110 if($("a.restore",dialog).is(":hidden"))111 $("a.maximize",dialog).trigger("click");112 else113 $("a.restore",dialog).trigger("click");114 });115 if(op.max) {116// $.pdialog.switchDialog(dialog);117 $.pdialog.maxsize(dialog);118 dialog.jresize("destroy").dialogDrag("destroy");119 }120 $("body").data(dlgid, dialog);121 $.pdialog._current = dialog;122 $.pdialog.attachShadow(dialog);123 //load data124 var jDContent = $(".dialogContent",dialog);125 jDContent.ajaxUrl({126 type:options.type||'GET', url:url, data:options.data || {}, callback:function(){127 jDContent.find("[layoutH]").layoutH(jDContent);128 $(".pageContent", dialog).width($(dialog).width()-14);129 $("button.close", dialog).click(function(){130 $.pdialog.close(dialog);131 return false;132 });133 }134 });135 }136 if (op.mask) {137 $(dialog).css("zIndex", 1000);138 $("a.minimize",dialog).hide();139 $(dialog).data("mask", true);140 $("#dialogBackground").show();141 }else {142 //add a task to task bar143 if(op.minable) $.taskBar.addDialog(dlgid,title);144 }145 },146 /**147 * 切换当前层148 * @param {Object} dialog149 */150 switchDialog:function(dialog) {151 var index = $(dialog).css("zIndex");152 $.pdialog.attachShadow(dialog);153 if($.pdialog._current) {154 var cindex = $($.pdialog._current).css("zIndex");155 $($.pdialog._current).css("zIndex", index);156 $(dialog).css("zIndex", cindex);157 $("div.shadow").css("zIndex", cindex - 1);158 $.pdialog._current = dialog;159 }160 $.taskBar.switchTask(dialog.data("id"));161 },162 /**163 * 给当前层附上阴隐层164 * @param {Object} dialog165 */166 attachShadow:function(dialog) {167 var shadow = $("div.shadow");168 if(shadow.is(":hidden")) shadow.show();169 shadow.css({170 top: parseInt($(dialog)[0].style.top) - 2,171 left: parseInt($(dialog)[0].style.left) - 4,172 height: parseInt($(dialog).height()) + 8,173 width: parseInt($(dialog).width()) + 8,174 zIndex:parseInt($(dialog).css("zIndex")) - 1175 });176 $(".shadow_c", shadow).children().andSelf().each(function(){177 $(this).css("height", $(dialog).outerHeight() - 4);178 });179 },180 _init:function(dialog, options) {181 var op = $.extend({}, this._op, options);182 var height = op.height>op.minH?op.height:op.minH;183 var width = op.width>op.minW?op.width:op.minW;184 if(isNaN(dialog.height()) || dialog.height() < height){185 $(dialog).height(height+"px");186 $(".dialogContent",dialog).height(height - $(".dialogHeader", dialog).outerHeight() - $(".dialogFooter", dialog).outerHeight() - 6);187 }188 if(isNaN(dialog.css("width")) || dialog.width() < width) {189 $(dialog).width(width+"px");190 }191 192 var iTop = ($(window).height()-dialog.height())/2;193 dialog.css({194 left: ($(window).width()-dialog.width())/2,195 top: iTop > 0 ? iTop : 0196 });197 },198 /**199 * 初始化半透明层200 * @param {Object} resizable201 * @param {Object} dialog202 * @param {Object} target203 */204 initResize:function(resizable, dialog,target) {205 $("body").css("cursor", target + "-resize");206 resizable.css({207 top: $(dialog).css("top"),208 left: $(dialog).css("left"),209 height:$(dialog).css("height"),210 width:$(dialog).css("width")211 });212 resizable.show();213 },214 /**215 * 改变阴隐层216 * @param {Object} target217 * @param {Object} options218 */219 repaint:function(target,options){220 var shadow = $("div.shadow");221 if(target != "w" && target != "e") {222 shadow.css("height", shadow.outerHeight() + options.tmove);223 $(".shadow_c", shadow).children().andSelf().each(function(){224 $(this).css("height", $(this).outerHeight() + options.tmove);225 });226 }227 if(target == "n" || target =="nw" || target == "ne") {228 shadow.css("top", options.otop - 2);229 }230 if(options.owidth && (target != "n" || target != "s")) {231 shadow.css("width", options.owidth + 8);232 }233 if(target.indexOf("w") >= 0) {234 shadow.css("left", options.oleft - 4);235 }236 },237 /**238 * 改变左右拖动层的高度239 * @param {Object} target240 * @param {Object} tmove241 * @param {Object} dialog242 */243 resizeTool:function(target, tmove, dialog) {244 $("div[class^='resizable']", dialog).filter(function(){245 return $(this).attr("tar") == 'w' || $(this).attr("tar") == 'e';246 }).each(function(){247 $(this).css("height", $(this).outerHeight() + tmove);248 });249 },250 /**251 * 改变原始层的大小252 * @param {Object} obj253 * @param {Object} dialog254 * @param {Object} target255 */256 resizeDialog:function(obj, dialog, target) {257 var oleft = parseInt(obj.style.left);258 var otop = parseInt(obj.style.top);259 var height = parseInt(obj.style.height);260 var width = parseInt(obj.style.width);261 if(target == "n" || target == "nw") {262 tmove = parseInt($(dialog).css("top")) - otop;263 } else {264 tmove = height - parseInt($(dialog).css("height"));265 }266 $(dialog).css({left:oleft,width:width,top:otop,height:height});267 $(".dialogContent", dialog).css("width", (width-12) + "px");268 $(".pageContent", dialog).css("width", (width-14) + "px");269 if (target != "w" && target != "e") {270 var content = $(".dialogContent", dialog);271 content.css({height:height - $(".dialogHeader", dialog).outerHeight() - $(".dialogFooter", dialog).outerHeight() - 6});272 content.find("[layoutH]").layoutH(content);273 $.pdialog.resizeTool(target, tmove, dialog);274 }275 $.pdialog.repaint(target, {oleft:oleft,otop: otop,tmove: tmove,owidth:width});276 277 $(window).trigger(DWZ.eventType.resizeGrid);278 },279 close:function(dialog) {280 if(typeof dialog == 'string') dialog = $("body").data(dialog);281 var close = dialog.data("close");282 var go = true;283 if(close && $.isFunction(close)) {284 var param = dialog.data("param");285 if(param && param != ""){286 param = DWZ.jsonEval(param);287 go = close(param);288 } else {289 go = close();290 }291 if(!go) return;292 }293 294 $(dialog).hide();295 $("div.shadow").hide();296 if($(dialog).data("mask")){297 $("#dialogBackground").hide();298 } else{299 if ($(dialog).data("id")) $.taskBar.closeDialog($(dialog).data("id"));300 }301 $("body").removeData($(dialog).data("id"));302 $(dialog).trigger(DWZ.eventType.pageClear).remove();303 },304 closeCurrent:function(){305 this.close($.pdialog._current);306 },307 checkCloseCurrent:function(json){308 if (!json) return;309 if (json[DWZ.keys.statusCode] == DWZ.statusCode.timeout310 || (json[DWZ.keys.statusCode] == DWZ.statusCode.error && "closeCurrentDialog" == json.callbackType) ) {311 this.closeCurrent();312 }313 },314 maxsize:function(dialog) {315 $(dialog).data("original",{316 top:$(dialog).css("top"),317 left:$(dialog).css("left"),318 width:$(dialog).css("width"),319 height:$(dialog).css("height")320 });321 $("a.maximize",dialog).hide();322 $("a.restore",dialog).show();323 var iContentW = $(window).width();324 var iContentH = $(window).height() - 34;325 $(dialog).css({top:"0px",left:"0px",width:iContentW+"px",height:iContentH+"px"});326 $.pdialog._resizeContent(dialog,iContentW,iContentH);327 },328 restore:function(dialog) {329 var original = $(dialog).data("original");330 var dwidth = parseInt(original.width);331 var dheight = parseInt(original.height);332 $(dialog).css({333 top:original.top,334 left:original.left,335 width:dwidth,336 height:dheight337 });338 $.pdialog._resizeContent(dialog,dwidth,dheight);339 $("a.maximize",dialog).show();340 $("a.restore",dialog).hide();341 $.pdialog.attachShadow(dialog);342 },343 minimize:function(dialog){344 $(dialog).hide();345 $("div.shadow").hide();346 var task = $.taskBar.getTask($(dialog).data("id"));347 $(".resizable").css({348 top: $(dialog).css("top"),349 left: $(dialog).css("left"),350 height:$(dialog).css("height"),351 width:$(dialog).css("width")352 }).show().animate({top:$(window).height()-60,left:task.position().left,width:task.outerWidth(),height:task.outerHeight()},250,function(){353 $(this).hide();354 $.taskBar.inactive($(dialog).data("id"));355 });356 },357 _resizeContent:function(dialog,width,height) {358 var content = $(".dialogContent", dialog);359 content.css({width:(width-12) + "px",height:height - $(".dialogHeader", dialog).outerHeight() - $(".dialogFooter", dialog).outerHeight() - 6});360 content.find("[layoutH]").layoutH(content);361 $(".pageContent", dialog).css("width", (width-14) + "px");362 363 $(window).trigger(DWZ.eventType.resizeGrid);364 }365 };...

Full Screen

Full Screen

dropdown.test.js

Source:dropdown.test.js Github

copy

Full Screen

1/**2 * Copyright © Magento, Inc. All rights reserved.3 * See COPYING.txt for license details.4 */5/* eslint-disable max-nested-callbacks */6define([7 'jquery',8 'mage/dropdown'9], function ($) {10 'use strict';11 describe('Test for mage/dropdown jQuery plugin', function () {12 it('check if dialog opens when the triggerEvent is triggered', function () {13 var opener = $('<div/>'),14 dialog = $('<div/>');15 dialog.dropdownDialog({16 'triggerEvent': 'click',17 'triggerTarget': opener18 });19 opener.trigger('click');20 expect(dialog.dropdownDialog('isOpen')).toBeTruthy();21 dialog.dropdownDialog('destroy');22 dialog.dropdownDialog({23 'triggerEvent': null,24 'triggerTarget': opener25 });26 opener.trigger('click');27 expect(dialog.dropdownDialog('isOpen')).toBeFalsy();28 dialog.dropdownDialog('destroy');29 });30 it('check if a specified class is added to the trigger', function () {31 var opener = $('<div/>'),32 dialog = $('<div/>');33 dialog.dropdownDialog({34 'triggerClass': 'active',35 'triggerTarget': opener36 });37 dialog.dropdownDialog('open');38 expect(opener.hasClass('active')).toBeTruthy();39 dialog.dropdownDialog('close');40 dialog.dropdownDialog('destroy');41 dialog.dropdownDialog({42 'triggerClass': null,43 'triggerTarget': opener44 });45 dialog.dropdownDialog('open');46 expect(opener.hasClass('active')).toBeFalsy();47 dialog.dropdownDialog('close');48 dialog.dropdownDialog('destroy');49 });50 it('check if a specified class is added to the element which the dialog appends to', function () {51 var parent = $('<div/>'),52 dialog = $('<div/>');53 dialog.dropdownDialog({54 'parentClass': 'active',55 'appendTo': parent56 });57 dialog.dropdownDialog('open');58 expect(parent.hasClass('active')).toBeTruthy();59 dialog.dropdownDialog('close');60 dialog.dropdownDialog('destroy');61 dialog.dropdownDialog({62 'parentClass': null,63 'appendTo': parent64 });65 dialog.dropdownDialog('open');66 expect(parent.hasClass('active')).toBeFalsy();67 dialog.dropdownDialog('close');68 dialog.dropdownDialog('destroy');69 });70 it('check if a specified class is added to the element that becomes dialog', function () {71 var dialog = $('<div/>'),72 content;73 dialog.dropdownDialog({74 'dialogContentClass': 'active'75 });76 content = $('.ui-dialog-content');77 dialog.dropdownDialog('open');78 expect(content.hasClass('active')).toBeTruthy();79 dialog.dropdownDialog('close');80 dialog.dropdownDialog('destroy');81 dialog.dropdownDialog({82 'dialogContentClass': null83 });84 dialog.dropdownDialog('open');85 expect(content.hasClass('active')).toBeFalsy();86 dialog.dropdownDialog('close');87 dialog.dropdownDialog('destroy');88 });89 it('check if a specified class is added to dialog', function () {90 var dialog = $('<div/>'),91 uiClass = '.ui-dialog',92 ui;93 dialog.dropdownDialog({94 'defaultDialogClass': 'custom'95 });96 ui = $(uiClass);97 expect(ui.hasClass('custom')).toBeTruthy();98 expect(ui.hasClass('mage-dropdown-dialog')).toBeFalsy();99 dialog.dropdownDialog('destroy');100 dialog.dropdownDialog({});101 ui = $(uiClass);102 expect(ui.hasClass('mage-dropdown-dialog')).toBeTruthy();103 dialog.dropdownDialog('destroy');104 });105 it('check if the specified trigger actually opens the dialog', function () {106 var opener = $('<div/>'),107 dialog = $('<div/>');108 dialog.dropdownDialog({109 'triggerTarget': opener110 });111 opener.trigger('click');112 expect(dialog.dropdownDialog('isOpen')).toBeTruthy();113 dialog.dropdownDialog('close');114 dialog.dropdownDialog('destroy');115 dialog.dropdownDialog({116 'triggerTarget': null117 });118 opener.trigger('click');119 expect(dialog.dropdownDialog('isOpen')).toBeFalsy();120 dialog.dropdownDialog('destroy');121 });122 it('check if the dialog gets closed when clicking outside of it', function () {123 var container = $('<div/>'),124 outside = $('<div/>').attr('id', 'outside').appendTo(container),125 dialog = $('<div/>').attr('id', 'dialog').appendTo(container);126 container.appendTo('body');127 dialog.dropdownDialog({128 'closeOnClickOutside': true129 });130 dialog.dropdownDialog('open');131 outside.trigger('click');132 expect(dialog.dropdownDialog('isOpen')).toBeFalsy();133 dialog.dropdownDialog('destroy');134 dialog.dropdownDialog({135 'closeOnClickOutside': false136 });137 dialog.dropdownDialog('open');138 outside.trigger('click');139 expect(dialog.dropdownDialog('isOpen')).toBeTruthy();140 dialog.dropdownDialog('destroy');141 });142 it('check if the dialog gets closed when mouse leaves the dialog area', function () {143 var container = $('<div/>'),144 dialog = $('<div/>').attr('id', 'dialog').appendTo(container);145 $('<div/>').attr('id', 'outside').appendTo(container);146 $('<div/>').attr('id', 'opener').appendTo(container);147 container.appendTo('body');148 jasmine.clock().install();149 dialog.dropdownDialog({150 'closeOnMouseLeave': true151 });152 dialog.dropdownDialog('open');153 dialog.trigger('mouseenter');154 expect(dialog.dropdownDialog('isOpen')).toBeTruthy();155 dialog.trigger('mouseleave');156 jasmine.clock().tick(10);157 expect(dialog.dropdownDialog('isOpen')).toBeFalsy();158 dialog.dropdownDialog('destroy');159 jasmine.clock().uninstall();160 });161 it('check if the dialog does not close when mouse leaves the dialog area', function () {162 var container = $('<div/>'),163 dialog = $('<div/>').attr('id', 'dialog').appendTo(container);164 $('<div/>').attr('id', 'outside').appendTo(container);165 $('<div/>').attr('id', 'opener').appendTo(container);166 container.appendTo('body');167 jasmine.clock().install();168 dialog.dropdownDialog({169 'closeOnMouseLeave': false170 });171 dialog.dropdownDialog('open');172 dialog.trigger('mouseenter');173 dialog.trigger('mouseleave');174 jasmine.clock().tick(10);175 expect(dialog.dropdownDialog('isOpen')).toBeTruthy();176 dialog.dropdownDialog('destroy');177 jasmine.clock().uninstall();178 });179 it('check if the dialog gets closed with the specified delay', function (done) {180 var container = $('<div/>'),181 dialog = $('<div/>').attr('id', 'dialog').appendTo(container);182 $('<div/>').attr('id', 'outside').appendTo(container);183 $('<div/>').attr('id', 'opener').appendTo(container);184 container.appendTo('body');185 dialog.dropdownDialog({186 'timeout': 5187 });188 dialog.dropdownDialog('open');189 dialog.trigger('mouseenter');190 dialog.trigger('mouseleave');191 expect(dialog.dropdownDialog('isOpen')).toBeTruthy();192 setTimeout(function () {193 expect(dialog.dropdownDialog('isOpen')).toBeFalsy();194 dialog.dropdownDialog('destroy');195 done();196 }, 6);197 });198 /*199 * jQuery ui version 1.9.2 belongs to the adminhtml.200 *201 * This test will fail on backend since backend's jquery.ui will202 * add ui-dialog-titlebar class anyway on create.203 */204 if ($.ui.version !== '1.9.2') {205 it('check if the title bar is prevented from being created', function () {206 var dialog = $('<div/>'),207 uiClass = '.ui-dialog',208 ui;209 dialog.dropdownDialog({210 'createTitleBar': true211 });212 ui = $(uiClass);213 expect(ui.find('.ui-dialog-titlebar').length > 0).toBeTruthy();214 dialog.dropdownDialog('destroy');215 dialog.dropdownDialog({216 'createTitleBar': false217 });218 ui = $(uiClass);219 expect(ui.find('.ui-dialog-titlebar').length <= 0).toBeTruthy();220 dialog.dropdownDialog('destroy');221 });222 }223 it('check if the position function gets disabled', function () {224 var dialog = $('<div/>'),225 uiClass = '.ui-dialog',226 ui;227 dialog.dropdownDialog({228 'autoPosition': false229 });230 ui = $(uiClass);231 dialog.dropdownDialog('open');232 expect(ui.css('top') === 'auto').toBeTruthy();233 dialog.dropdownDialog('destroy');234 dialog.dropdownDialog({235 'autoPosition': true236 });237 ui = $(uiClass);238 dialog.dropdownDialog('open');239 expect(ui.css('top') !== '0px').toBeTruthy();240 dialog.dropdownDialog('destroy');241 });242 it('check if the size function gets disabled', function () {243 var dialog = $('<div/>'),244 uiClass = '.ui-dialog',245 ui;246 dialog.dropdownDialog({247 'autoSize': true,248 'width': '300'249 });250 ui = $(uiClass);251 dialog.dropdownDialog('open');252 expect(ui.css('width') === '300px').toBeTruthy();253 dialog.dropdownDialog('destroy');254 dialog.dropdownDialog({255 'autoSize': false,256 'width': '300'257 });258 ui = $(uiClass);259 dialog.dropdownDialog('open');260 expect(ui.css('width') === '300px').toBeFalsy();261 dialog.dropdownDialog('destroy');262 });263 });...

Full Screen

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run redwood automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful