1/*** 2* Global javascript HTML markup utility methods 3***/ 4 5(function (PxlUtil) { 6 $.extend(PxlUtil.Base.prototype, { 7 //HTML Markup Area 8 GetHTMLInput: function (id, classes, value, customAttributes) 9 { 10 var tmpl = "<input tabindex= '-1' id='{{{id}}}' class='{{{classes}}}' value='{{{value}}}' {{{customAttributes}}}></input>"; 11 return Mustache.render(tmpl, { id: id, classes: classes, value: value, customAttributes: customAttributes }); 12 }, 13 14 GetHTMLInputWithPlaceholder: function (id, classes, placeholder, value, customAttributes) { 15 var tmpl = "<input id='{{{id}}}' class='{{{classes}}}' placeholder='{{{placeholder}}}' value='{{{value}}}' {{{customAttributes}}}></input>"; 16 return Mustache.render(tmpl, { id: id, classes: classes, placeholder: placeholder, value: value, customAttributes : customAttributes }); 17 }, 18 19 GetHTMLColourPicker: function (id, classes, colour) { 20 var tmpl = "<input id='{{{id}}}' class='{{{classes}}}' value='{{{colour}}}'></input>"; 21 return Mustache.render(tmpl, { id: id, classes: classes, colour: colour }); 22 }, 23 24 GetHTMLDiv: function (id, classes, controls, customAttributes) { 25 var tmpl = "<div id='{{{id}}}' class='{{{classes}}}' {{{customAttributes}}}>{{{controls}}}</div>"; 26 return Mustache.render(tmpl, { id: id, classes: classes, controls: controls, customAttributes: customAttributes }); 27 }, 28 29 GetHTMLImage: function (id, classes, source, customAttributes) { 30 var tmpl = "<image id='{{{id}}}' class='{{{classes}}}' src='{{{source}}}' {{{customAttributes}}}>"; 31 return Mustache.render(tmpl, { id: id, classes: classes, source: source, customAttributes: customAttributes }); 32 }, 33 GetButtonWithIcon: function (id, checkboxCss, icon, checked, onClickEvent, customAttributes) { 34 35 var tmpl = "<div id='{{{id}}}' class='checkbox-with-icon {{{checkboxCss}}}' {{{checked}}} onClick='{{{onClickEvent}}}' {{{customAttributes}}}>"; 36 37 if (checked) { 38 tmpl += "<div id='{{{id}}}_icon' class='{{{icon}}}' />"; 39 } else { 40 tmpl += "<div id='{{{id}}}_icon' class='{{{icon}}}' style='display:none;' />"; 41 } 42 43 tmpl += "</div>"; 44 45 return Mustache.render(tmpl, { id: id, checkboxCss: checkboxCss, checked: checked, icon: icon, onClickEvent: onClickEvent, customAttributes: customAttributes }); 46 }, 47 48 GetButtonWithoutIcon: function (id, checkboxCss, onClickEvent, colourHex, isEditing, customAttributes) 49 { 50 var tmpl = "<div id='{{{id}}}' class='checkbox-with-icon {{{checkboxCss}}}' currentColour='{{{colourHex}}}' onClick='{{{onClickEvent}}}' {{{customAttributes}}}>"; 51 tmpl += '<svg id="{{{id}}}" width="24" height="24">'; 52 53 if (isEditing) { 54 tmpl += '<rect width="24" height="24" style="fill:{{{colourHex}}};stroke-width:4;stroke:rgb(255,255,255);">'; 55 } else { 56 tmpl += '<rect width="24" height="24" style="fill:{{{colourHex}}};">'; 57 } 58 59 tmpl += '</svg>'; 60 tmpl += "</div>"; 61 62 return Mustache.render(tmpl, { id: id, checkboxCss: checkboxCss, onClickEvent: onClickEvent, colourHex: colourHex, customAttributes: customAttributes }); 63 }, 64 65 GetHTMLTextArea: function (id, classes, text) { 66 var tmpl = "<textarea id='{{{id}}}' class='{{classes}}' autocapitalize='off' autocorrect='off' >{{{text}}}</textarea>"; 67 68 var userAgent = navigator.userAgent.toLowerCase(); // this is user agent that detects if we are using an android device . 69 var isAndroid = userAgent.indexOf("android") > -1; // this will be true if we are on an android device , otherwise false . 70 if (isAndroid && id.toString().indexOf("URL") > -1) { // if we are on an android device and we are generating the html content for the weblink ( contains the word URL), render the information through an input tag to allow chrome to supp
70ort autocapitalization off 71 72 tmpl = "<input id='{{{id}}}' class='{{classes}}' autocapitalize='off' autocorrect='off' value='{{{text}}}' ></input>"; 73 } 74 75 return Mustache.render(tmpl, { id: id, classes: classes, text: text }); 76 }, 77 78 GetHTMLUnorderedList: function (id, unorderedListClass, listItems) 79 { 80 var unorderedListTmpl = 81 "<ul id ='{{{ID}}}'class='{{{LIST_CLASS}}}'>\ 82 {{{LIST_ITEMS}}}\ 83 </ul>"; 84 85 var listItemsMarkup = ''; 86 87 var listItmeTmpl = 88 "<li>{{{ITEM_TEXT}}}</li>"; 89 90 for (var i = 0; i < listItems.length; i++) 91 { 92 listItemsMarkup += Mustache.render(listItmeTmpl, { ITEM_TEXT: listItems[i]}); 93 } 94 95 return Mustache.render(unorderedListTmpl, { LIST_CLASS: unorderedListClass, ID: id, LIST_ITEMS: listItemsMarkup }); 96 }, 97 98 GetHTMLTextAreaWithPlaceholder: function (id, classes, placeholder, customAttributes) { 99 var tmpl = "<textarea id='{{{id}}}' class='{{classes}}' autocorrect='off' autocapitalize='off' autocomplete='off' placeholder='{{{placeholder}}}' {{{customAttributes}}}></textarea>"; 100 101 var userAgent = navigator.userAgent.toLowerCase(); // this is user agent that detects if we are using an android device . 102 var isAndroid = userAgent.indexOf("android") > -1; // this will be true if we are on an android device this is true , otherwise false . 103 if (isAndroid && id.toString().indexOf("URL") > -1) { // if we are on an android device and we are generating the html content for the weblink ( contains the word URL) , render the information through an input tag to allow chrome to support autocapitalization off 104 105 tmpl = "<input id='{{{id}}}' class='{{classes}}' autocorrect='off' autocapitalize='off' autocomplete='off' placeholder='{{{placeholder}}}' {{{customAttributes}}}></input>"; 106 } 107 108 return Mustache.render(tmpl, { id: id, classes: classes, placeholder: placeholder, customAttributes: customAttributes }); 109 }, 110 111 GetHTMLLabel: function (id, classes, text, forElement, title, additionalAttributes) { 112 var tmpl = "<label id='{{id}}' class='{{{classes}}}' for='{{{forElement}}}' title='{{{title}}}' {{{additionalAttributes}}}>{{{text}}}</label>"; 113 return Mustache.render(tmpl, { id: id, classes: classes, text: text, forElement: forElement, title: title, additionalAttributes: additionalAttributes }); 114 }, 115 116 GetHTMLLabelWithoutFor: function (id, classes, text, additionalAttributes) { 117 var tmpl = "<label id='{{id}}' class='{{{classes}}}' {{{additionalAttributes}}}>{{{text}}}</label>"; 118 return Mustache.render(tmpl, { id: id, classes: classes, text: text, additionalAttributes: additionalAttributes }); 119 }, 120 GetBlackoutOverlay: function (id) { 121 return PxlViewer.util.GetHTMLDiv("overlay_" + id, "blackoutOverlay", ""); 122 }, 123 GetMandatoryFieldLabel: function (id, classes, forElement) 124 { 125 var tmpl = "<label id='mandatoryField_{{id}}' class='mandatoryField {{{classes}}}' for='{{{forElement}}}' title='{{{title}}}'>*</label>"; 126 127 return Mustache.render(tmpl, { id: id, classes: classes, forElement: forElement}); 128 }, 129 130 GetHTMLHyperLink: function (id, classes, url) { 131 var tmpl = "<div id='{{{id}}}' class='{{{classes}}}' href='{{{url}}}'></div>"; 132 return Mustache.render(tmpl, { id: id, classes: classes, url: url }); 133 }, 134 135 GetHTMLHyperLinkToolTip: function (id, classes, url, toolTip) { 136 var tmpl = "<div> <a id='{{{id}}}' class='{{{classes}}}' href='{{{url}}}' title='{{{toolTip}}}'/> </div>"; 137 return Mustache.render(tmpl, { id: id, classes: classes, url: url, toolTip:toolTip }) 138 }, 139 140 GetHTMLDivButton: function (id, classes, text, onclickEvent, additionalAttributes) { 141 var tmpl = "<div id='{{{id}}}' class='{{{classes}}}' onclick='{{{onclickEvent}}}' {{{additionalAttributes}}}>{{{text}}}</div>"; 142 return Mustache.render(tmpl, { id: id, classes: classes, onclickEvent: oncl
142ickEvent, text: text, additionalAttributes: additionalAttributes }); 143 }, 144 145 GetHTMLjQueryUIButton: function (id, classes, text, customAttributes) 146 { 147 var jQueryUIButtonDefaultClasses = ' ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only'; 148 var tmpl = "<div id='{{{id}}}' class='{{{classes}}}' {{{customAttributes}}}>{{{text}}}</div>"; 149 return Mustache.render(tmpl, { id : id, classes : classes + jQueryUIButtonDefaultClasses, text : text, customAttributes : customAttributes }); 150 }, 151 152 GetToggleSwitch: function (id, checked, switchClass) { 153 var checkedText = "checked"; 154 if (!checked) 155 checkedText = ""; 156 var theid = "myonoffswitch_" + id; 157 var tmpl = "<div class='onoffswitch {{{switchClass}}}'>\ 158 <input type='checkbox' name='{{{theid}}}' class='onoffswitch-checkbox hidden' id='{{{theid}}}' {{{checkedText}}}>\ 159 <label class='onoffswitch-label' for='{{{theid}}}'>\ 160 <span class='onoffswitch-inner'></span>\ 161 <span class='onoffswitch-switch'></span>\ 162 </label>\ 163 </div>"; 164 return Mustache.render(tmpl, { theid: theid, checkedText: checkedText, switchClass: switchClass }); 165 }, 166 167 GetToggleSwitchWithOutFor: function (id, checked, switchClass) { 168 var checkedText = "checked"; 169 if (!checked) 170 checkedText = ""; 171 //note there is not FOR inthe label HTML 172 var theid = "myonoffswitch_" + id; 173 var tmpl = "<div class='onoffswitch {{{switchClass}}}'>\ 174 <input type='checkbox' name='{{{theid}}}' class='onoffswitch-checkbox hidden' id='{{{theid}}}' {{{checkedText}}}>\ 175 <label class='onoffswitch-label'>\ 176 <span class='onoffswitch-inner'></span>\ 177 <span class='onoffswitch-switch'></span>\ 178 </label>\ 179 </div>"; 180 return Mustache.render(tmpl, { theid: theid, checkedText: checkedText, switchClass: switchClass }); 181 }, 182 183 CreateCustomDialog: function (id, headerText, message, acceptButtonTxt, acceptButtonOnClickEvent, declineButtonTxt, declinButtonOnClickEvent) { 184 var closeDialogEvent = ' window.activeImageWindow.annotations._closeCustomDialog(' + id + ');'; 185 var headerLabel = this.GetHTMLLabel('dialogHeaderLabel_' + id, 'dialogHeaderLabel', headerText); 186 var headerContent = this.GetHTMLDiv('dialogHeaderDiv_' + id, 'dialogHeaderDiv', headerLabel); 187 188 var messageLabel = this.GetHTMLLabel('dialogMessageLabel_' + id, 'dialogMessageLabel', message); 189 190 var acceptBtn = this.GetHTMLDivButton('acceptDialogBtn_' + id, 'cutomDialogBtn', acceptButtonTxt, acceptButtonOnClickEvent + closeDialogEvent); 191 var cancelBtn = ''; 192 193 if (!PxlUtilGeneric.IsNullOrEmpty(declineButtonTxt) || !PxlUtilGeneric.IsNullOrEmpty(declinButtonOnClickEvent)) { 194 declineButtonTxt = (PxlUtilGeneric.IsNullOrEmpty(declineButtonTxt) ? PXL_CORE_Keywords_Cancel : declineButtonTxt); 195 cancelBtn = this.GetHTMLDivButton('declineDialogBtn_' + id, 'cutomDialogBtn', declineButtonTxt, declinButtonOnClickEvent + closeDialogEvent); 196 } 197 var customDialogDiv = this.GetHTMLDiv('customDialog_' + id, 'customDialog', headerContent + messageLabel + cancelBtn + acceptBtn); 198 return customDialogDiv; 199 }, 200 201 GetBlackoutOverlay: function (id) { 202 return PxlViewer.util.GetHTMLDiv("overlay_" + id, "blackoutOverlay", ""); 203 }, 204 205 206 GetSlider: function (id, cssClass, defaultValue, min, max, onChangeEvent) { 207 var tmpl = "<div id='{{{id}}}' onChange='{{{onChangeEvent}}}' sliderValue='{{{defaultValue}}}' minValue='{{{min}}}' maxValue='{{{max}}}' class='{{{cssClass}}}'></div>"; 208 var renderedSlider = Mustache.render(tmpl, { id: id, cssClass: cssClass, defaultValue: defaultValue, onChangeEvent: onCh
208angeEvent, min: min, max: max }); 209 return this.GetHTMLDiv("sliderControlPanel_" + id, "sliderControl", renderedSlider); 210 }, 211 212 GetToggleSwitchPanelWithLabel: function (id, checked, labelText, panelCss, switchCss, labelCSS) { 213 var switchLbl = this.GetHTMLLabel("switchLabel" + id, labelCSS, labelText); 214 var toggleSwitch = this.GetToggleSwitch(id, checked, switchCss); 215 var switchPanel = this.GetHTMLDiv("switchPanel_" + id, panelCss, switchLbl + toggleSwitch); 216 return switchPanel; 217 }, 218 219 GetToggleSwitchPanelWithLabelButNoFOR: function (id, checked, labelText, panelCss, switchCss, labelCSS) { 220 var switchLbl = this.GetHTMLLabel("switchLabel" + id, labelCSS, labelText); 221 var toggleSwitch = this.GetToggleSwitchWithOutFor(id, checked, switchCss); 222 var switchPanel = this.GetHTMLDiv("switchPanel_" + id, panelCss, switchLbl + toggleSwitch); 223 return switchPanel; 224 }, 225 226 GetSliderPanel: function (id, panelClass, iconClass, textBoxClass, sliderClass, defaultValue, min, max, onChangeEvent) { 227 var sliderIcon = iconClass != "" ? this.GetHTMLDiv("sliderIcon_" + id, "SliderIcon " + iconClass, "") : ""; 228 var sliderControl = this.GetSlider("sliderControl_" + id, sliderClass, defaultValue, min, max, onChangeEvent); 229 var sliderTxtBox = this.GetHTMLInput("sliderTextBox", textBoxClass, defaultValue, onChangeEvent); 230 var sliderPanel = this.GetHTMLDiv("sliderPanel_" + id, panelClass, sliderIcon + sliderControl + sliderTxtBox); 231 return sliderPanel; 232 }, 233 234 GetLoadingPanel: function (id, labelText, cssClass) { 235 var loadingLabel = this.GetHTMLLabel("loadingLbl" + id, "loadingLbl", labelText); 236 var loadingIcon = this.GetHTMLDiv("loadingSpinner" + id, "loadingIcon", ""); 237 var loadingPanel = this.GetHTMLDiv("loadingPanel_" + id, "loadingPanel " + cssClass, loadingLabel + loadingIcon); 238 return loadingPanel; 239 }, 240 241 GetUnavailablePanel: function (id, header, message, onCloseEvent, cssClass) { 242 var unavailableHeader = this.GetHTMLLabel("unavailablePnlHeader_" + id, "unavailableHeader", header); 243 var unavailableMessage = this.GetHTMLLabel("unavailablePnlMessage_" + id, "unavailableMessage", message); 244 var closeBtn = onCloseEvent != null ? this.GetHTMLDivButton("unavailablePnlBtn_" + id, "unavailableBtn", PXL_CORE_Keywords_Close, onCloseEvent) : ''; 245 var unavailablePnl = this.GetHTMLDiv("unavailablePanel_" + id, cssClass, unavailableHeader + unavailableMessage + closeBtn); 246 return unavailablePnl; 247 }, 248 /** 249 * Gets HTML for a standard dropdown (select list) 250 * @param {string} id ID to be assigned to dropdown list 251 * @param {string} options 252 * @param {string} cssClass (optional) 253 * @param {string} selected (optional) 254 * @param {string} customAttributes (optional) 255 * @param {string} customValueTag (optional) 256 * @param {string} customKeyTag (optional) 257 * @param {object} staticOptions (optional) 258 * @returns {string} html of dropdown 259 */ 260 GetDropDownList: function (id, options, cssClass, selected, customAttributes, customValueTag, customKeyTag, staticOptions) 261 { 262 cssClass = (cssClass == undefined ? null : cssClass); 263 selected = (selected == undefined ? false : selected); 264 var dropDownTemplate = "<select id ='{{{ID}}}' class ='{{{CLASS}}}' {{{customAttributes}}}> {{{OPTIONS}}} </select>"; 265 var dropDownOptionTemplate = "<option key='{{{KEY}}}' value='{{{VALUE}}}' {{{SELECTED}}}> {{{KEY}}} </option>"; 266 var dropDownOptions = ""; 267 dropDownOptions += (staticOptions != undefined && staticOptions != null ? staticOptions : {}); 268 for (var i = 0; i < options.length; i++) { 269 var value = (!PxlUtilGeneric.IsNullOrEmpty(customValueTag) ? options[i][customValueTag] : options[i].Value); 270 dropDownOptions += Mustache.render(dropDownOptionTemplate, 271 { 272 VALUE: value, 273 KEY: (!PxlUtilGeneric.IsNullOrEmpty(customKeyTag) ? options[i][customKeyTag] : options[i].Key), 274 SELECTED: (selected != null && value == selected ? 'selected' : '') 275 }); 276 } 277 278 return Mustache.render(dropDownTemplate, 279 { 280 ID: id, 281 CLASS: cssClass, 282 OPTIONS: dropDownOptions, 283 customAttributes: customAttributes 284 }); 285 }, 286 //END HTML Markup Area 287 288 //HTML Util Notification Area 289 insertSpanAfterElementByID: function (id, classes, text, idElement) 290 { 291 if (!$('#' + id).length) 292 $("<span id='" + id + "' class='" + classes + "'>
292" + text + "</span>").insertAfter("#" + idElement); 293 }, 294 removeElementByID: function (id) { 295 $('#' + id).remove(); 296 }, 297 //END HTML Util Notification Area 298 /// <summary> 299 /// this hides the element's children and adds a spinner until the next content is loaded 300 /// </summary> 301 hideElementChildrenAndPlaceSpinner : function(elementidentifier) { 302 $(elementidentifier).addClass("hiddenPanelContentsAndSpinner"); 303 }, 304 305 /// <summary> 306 /// reverses the effects of hideElementChildrenAndPlaceSpinner 307 /// </summary> 308 showHiddenElementChildrenAndPlaceSpinner : function(elementidentifier) { 309 $(elementidentifier).removeClass("hiddenPanelContentsAndSpinner"); 310 }, 311 /// <summary> 312 /// This will lower the opacity of the row to 0.2 313 /// and then disable the sub elements so they cannot be clicked. 314 /// This is in response to DEV-3019 and a playback with LW 08/12/2015 315 /// </summary> 316 /// <param name="tableRowElement">This is the element for the tablerow</param> 317 /// <param name="replaceWithSpinnerElement">if not undefined then replace this image element with the spinner</param> 318 deletingTableRowEvent: function(tableRowElement, replaceWithSpinnerElement) 319 { 320 $(tableRowElement).fadeTo("0", "0.2").find('*').attr('disabled', true).click(function (e) { e.preventDefault(); }); 321 if (typeof replaceWithSpinnerElement != "undefined") { 322 var imageelement = $(tableRowElement).find(replaceWithSpinnerElement); 323 $(imageelement).attr("tmpImageHolder", $(imageelement).attr("src")).attr("src", "/images/spinner.gif"); 324 } 325 }, 326 /// <summary> 327 /// This is the inverse of deleteingTableRowEvent above, 328 /// in the event there is an error will undo the changes to the row. 329 /// </summary> 330 /// <param name="tableRowElement">This is the element for the tablerow</param> 331 /// <param name="replaceWithSpinnerElement">if not undefined then replace this element with the spinner</param> 332 undoDeletingTableRowEvent: function (tableRowElement, replaceWithSpinnerElement) { 333 $(tableRowElement).fadeTo("0", "1").find('*').attr('disabled', false).unbind("click"); 334 if (typeof replaceWithSpinnerElement != "undefined") { 335 var imageelement = $(tableRowElement).find(replaceWithSpinnerElement); 336 $(imageelement).attr("src", $(imageelement).attr("tmpImageHolder")); 337 } 338 }, 339 /// <summary> 340 /// Displays a waiting spinner to the page 341 /// </summary> 342 displayWaitingDialog: function () { 343 if ($("#waiting").length == 0) { 344 // add the waiting dialog to the page if it does not already exist 345 var template = "<div id=\"waiting\" style=\"display: none;\" title=\"Processing\">" + 346 "<div style=\"text-align: center\">" + 347 "<p>Please Wait</p>" + 348 "<img src=\"../images/spinnerLarge.gif\" />" + 349 "</div>" + 350 "</div>"; 351 $(template).appendTo("body").dialog(); 352 } else { 353 $("#waiting").dialog(); 354 } 355 }, 356 /** 357 * This adds renders a 358 * @param {} jsonResponseObject 359 * @returns {} 360 */ 361 DisplayAndLoadDataTableFromJSON: function (jsonResponseObject) { 362 if (jsonResponseObject != null && jsonResponseObject.Headers != null) { 363 var tmpl = "<table id=\"{{ID}}\" class=\"display {{CSS}}\" cellspacing=\"0\" width=\"100%\">\ 364 <thead>\ 365 <tr>\ 366 {{#headersection}}\ 367 <th class=\"{{Classes}}\">{{{Header}}}</th>\ 368 {{/headersection}}\ 369 </tr>\ 370 </thead>\ 371 </table>"; 372 var tableHTML = Mustache.render(tmpl, { ID: jsonResponseObject.ID, CSS: jsonResponseObject.Classes, headersection: jsonResponseObject.Headers }); 373 $("#" + jsonResponseObject.AttachElement).append(tableHTML); 374 return $("#" + jsonResponseObject.ID).dataTable(jsonResponseObject.dataTableOptions); 375 } 376 return null; 377 }, 378 /** 379 * Generic Alert bus message to the user. 380 * @param {} title - What appears in the title header fro the dialog. 381 * @param {} msg - The contents of the dialog, this can be html. 382 * @param {object} [addtionalProperties] 383 * { 384 * dialogId - define the id of the dialog, (default 'confirmDialog'). 385 * dialogClass - optional class for the dialog. 386 * width, - optional width of the dialog (default 500). 387 * okFunction, - what function will execute on clicking OK. 388 * modalOkText - the text to be displayed on the modal ok button. 389 * okButtonCss, - the css for the ok button. 390 * cancelFunction - What dunction will execure on clicking cancel. 391 * customButtons - Define all the buttons, this will override the 392 * modalOkText,okFunction,cancelFunction properties. 393 * } 394 */ 395 jqAlert: function (title, msg, addtionalProperties) { 396 addtionalProperties = this._setupDialogAdditionalPropertiesDefaultsChecks(addtionalProperties); 397 if (addtionalProperties.customButtons == null) { 398 addtionalProperties.customButtons = [ 399 { 400 'text': (addtionalProperties.modalOkText != null ? addtionalProperties.modalOkText : PXL_CORE_Keywords_OK), 401 "click": function() { 402 if (typeof addtionalProperties.okFunction == 'function') { 403 addtionalProperties.okFunction(); 404 } 405 $(this).dialog("close"); 406 },
407 'class': 'modalOkButton' + (addtionalProperties.okButtonCss != null ? ' ' + addtionalProperties.okButtonCss : '') 408 } 409 ]; 410 } 411 412 return this.jqConfirm(title, msg, addtionalProperties); 413 }, 414 /** 415 * This launches a jQuery confirmation dialog. 416 * @param {string} title - What appears in the title header fro the dialog. 417 * @param {string} msg - The contents of the dialog, this can be html. 418 * @param {object} [addtionalProperties] 419 * { 420 * dialogId - define the id of the dialog, (default 'confirmDialog'). 421 * dialogClass - optional class for the dialog. 422 * okFunction, - what function will execute on clicking OK. 423 * modalOkText - the text to be displayed on the modal ok button. 424 * modalCancelText, - what function will execute on clicking OK. 425 * cancelButtonCss, - css property for the cancel. 426 * width, - optional width of the dialog (default 500). 427 * height - optional height of the dialog 428 * okFunction, - what function will execute on clicking OK. 429 * cancelFunction - What dunction will execure on clicking cancel. 430 * customButtons - Define all the buttons, this will override the 431 * modalOkText,okFunction,cancelFunction properties. 432 * draggable 433 * } 434 */ 435 jqConfirm: function (title, msg, addtionalProperties) { 436 addtionalProperties = this._setupDialogAdditionalPropertiesDefaultsChecks(addtionalProperties); 437 $('#' + addtionalProperties.dialogId).remove(); 438 $('body').append('<div id="' + addtionalProperties.dialogId + '"' + 439 (addtionalProperties.dialogClass ? ' class="' + addtionalProperties.dialogClass + '"' : '') + 440 '><div class="message"></div></div>'); 441 // overrride the defult buttons 442 if (addtionalProperties.customButtons == null) { 443 addtionalProperties.customButtons = [ 444 { 445 text: (addtionalProperties.modalOkText != null ? addtionalProperties.modalOkText : PXL_CORE_Keywords_OK), 446 'class': 'modalOkButton ' + addtionalProperties.okButtonCss, 447 click: function() { 448 if (typeof addtionalProperties.okFunction == 'function') { 449 addtionalProperties.okFunction(); 450 } 451 $(this).dialog('close'); 452 } 453 }, 454 { 455 text: (addtionalProperties.modalCancelText != null ? addtionalProperties.modalCancelText : PXL_CORE_Keywords_Cancel), 456 'class': 'modalCancelButton ' + addtionalProperties.cancelButtonCss, 457 click: function() { 458 if (typeof addtionalProperties.cancelFunction == '' + 459 'function') { 460 addtionalProperties.cancelFunction(); 461 } 462 $(this).dialog('close'); 463 } 464 } 465 ]; 466 } 467 var imageLibraryInstance = $('#' + addtionalProperties.dialogId + '').dialog({ 468 buttons: addtionalProperties.customButtons, 469 title: title, 470 close: function (event, ui) 471 { 472 addtionalProperties.cancelFunction(); 473 $(this).dialog('close'); 474 }, 475 autoOpen: addtionalProperties.autoOpen, 476 modal: true, 477 width: addtionalProperties.width, 478 height: addtionalProperties.height, 479 draggable: addtionalProperties.draggable, 480 resizable: addtionalProperties.resizable, 481 open: addtionalProperties.open, 482 cancelFunction: addtionalProperties.cancelFunction 483 }); 484 $('#' + addtionalProperties.dialogId + ' .message').html(msg); 485 486 // detect ESCAPE key press to close dialog box 487 $(document).keyup(function (e) 488 { 489 if (e.keyCode == 27) 490 { 491 if (typeof imageLibraryInstance === 'object') 492 { 493 imageLibraryInstance.dialog('close'); 494 } 495 } 496 }); 497 return false; 498 }, 499 /** 500 * Checks the default properties, if the object is null then it creates an empty one and populates it's properties 501 * @param {object} [addtionalProperties] the properties object passed to this object 502 * @returns {object} addtionalProperties object with the default properties set 503 * @private 504 */ 505 _setupDialogAdditionalPropertiesDefaultsChecks: function (addtionalProperties) { 506 if (typeof addtionalProperties == 'undefined') { 507 addtionalProperties = {}; 508 } 509 if (addtionalProperties.autoOpen == null) { 510 addtionalProperties.autoOpen = true; 511 } 512 if (addtionalProperties.dialogId == null) { 513 addtionalProperties.dialogId = 'confirmDialog'; 514 } 515 if (addtionalProperties.draggable == null) { 516 addtionalProperties.draggable = false; 517 } 518 if (addtionalProperties.resizable == null) { 519 addtionalProperties.resizable = false; 520 } 521 if (addtionalProperties.width == null) { 522 addtionalProperties.width = 500; 523 } 524 if (addtionalProperties.open == null) { 525 addtionalProperties.open = nullfunction; 526 } 527 if (addtionalProperties.cancelFunction == null) 528 { 529 addtionalProperties.cancelFunction = nullfunction; 530 } 531 return addtionalProperties; 532 } 533 });
534}(PxlUtil)); 535 536PxlUtilGeneric = new PxlUtil();
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.