123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>The source code</title>
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
- <style type="text/css">
- .highlight { display: block; background-color: #ddd; }
- </style>
- <script type="text/javascript">
- function highlight() {
- document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
- }
- </script>
- </head>
- <body onload="prettyPrint(); highlight();">
- <pre class="prettyprint lang-js"><span id='Ext-window-MessageBox'>/**
- </span> * Utility class for generating different styles of message boxes. The singleton instance, Ext.MessageBox
- * alias `Ext.Msg` can also be used.
- *
- * Note that a MessageBox is asynchronous. Unlike a regular JavaScript `alert` (which will halt
- * browser execution), showing a MessageBox will not cause the code to stop. For this reason, if you have code
- * that should only run *after* some user feedback from the MessageBox, you must use a callback function
- * (see the `function` parameter for {@link #method-show} for more details).
- *
- * Basic alert
- *
- * @example
- * Ext.Msg.alert('Status', 'Changes saved successfully.');
- *
- * Prompt for user data and process the result using a callback
- *
- * @example
- * Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
- * if (btn == 'ok'){
- * // process text value and close...
- * }
- * });
- *
- * Show a dialog using config options
- *
- * @example
- * Ext.Msg.show({
- * title:'Save Changes?',
- * msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?',
- * buttons: Ext.Msg.YESNOCANCEL,
- * icon: Ext.Msg.QUESTION
- * });
- */
- Ext.define('Ext.window.MessageBox', {
- extend: 'Ext.window.Window',
- requires: [
- 'Ext.toolbar.Toolbar',
- 'Ext.form.field.Text',
- 'Ext.form.field.TextArea',
- 'Ext.form.field.Display',
- 'Ext.button.Button',
- 'Ext.layout.container.Anchor',
- 'Ext.layout.container.HBox',
- 'Ext.ProgressBar'
- ],
- alias: 'widget.messagebox',
- <span id='Ext-window-MessageBox-property-OK'> /**
- </span> * @property
- * Button config that displays a single OK button
- */
- OK : 1,
- <span id='Ext-window-MessageBox-property-YES'> /**
- </span> * @property
- * Button config that displays a single Yes button
- */
- YES : 2,
- <span id='Ext-window-MessageBox-property-NO'> /**
- </span> * @property
- * Button config that displays a single No button
- */
- NO : 4,
- <span id='Ext-window-MessageBox-property-CANCEL'> /**
- </span> * @property
- * Button config that displays a single Cancel button
- */
- CANCEL : 8,
- <span id='Ext-window-MessageBox-property-OKCANCEL'> /**
- </span> * @property
- * Button config that displays OK and Cancel buttons
- */
- OKCANCEL : 9,
- <span id='Ext-window-MessageBox-property-YESNO'> /**
- </span> * @property
- * Button config that displays Yes and No buttons
- */
- YESNO : 6,
- <span id='Ext-window-MessageBox-property-YESNOCANCEL'> /**
- </span> * @property
- * Button config that displays Yes, No and Cancel buttons
- */
- YESNOCANCEL : 14,
- <span id='Ext-window-MessageBox-property-INFO'> /**
- </span> * @property
- * The CSS class that provides the INFO icon image
- */
- INFO : Ext.baseCSSPrefix + 'message-box-info',
- <span id='Ext-window-MessageBox-property-WARNING'> /**
- </span> * @property
- * The CSS class that provides the WARNING icon image
- */
- WARNING : Ext.baseCSSPrefix + 'message-box-warning',
- <span id='Ext-window-MessageBox-property-QUESTION'> /**
- </span> * @property
- * The CSS class that provides the QUESTION icon image
- */
- QUESTION : Ext.baseCSSPrefix + 'message-box-question',
- <span id='Ext-window-MessageBox-property-ERROR'> /**
- </span> * @property
- * The CSS class that provides the ERROR icon image
- */
- ERROR : Ext.baseCSSPrefix + 'message-box-error',
- // hide it by offsets. Windows are hidden on render by default.
- hideMode: 'offsets',
- closeAction: 'hide',
- resizable: false,
- title: '&#160;',
- width: 600,
- height: 500,
- minWidth: 250,
- maxWidth: 600,
- minHeight: 110,
- maxHeight: 500,
- constrain: true,
- cls: Ext.baseCSSPrefix + 'message-box',
- layout: {
- type: 'vbox',
- align: 'stretch'
- },
- <span id='Ext-window-MessageBox-property-defaultTextHeight'> /**
- </span> * @property
- * The default height in pixels of the message box's multiline textarea if displayed.
- */
- defaultTextHeight : 75,
- <span id='Ext-window-MessageBox-property-minProgressWidth'> /**
- </span> * @property
- * The minimum width in pixels of the message box if it is a progress-style dialog. This is useful
- * for setting a different minimum width than text-only dialogs may need.
- */
- minProgressWidth : 250,
- <span id='Ext-window-MessageBox-property-minPromptWidth'> /**
- </span> * @property
- * The minimum width in pixels of the message box if it is a prompt dialog. This is useful
- * for setting a different minimum width than text-only dialogs may need.
- */
- minPromptWidth: 250,
- //<locale type="object">
- <span id='Ext-window-MessageBox-property-buttonText'> /**
- </span> * @property
- * An object containing the default button text strings that can be overriden for localized language support.
- * Supported properties are: ok, cancel, yes and no. Generally you should include a locale-specific
- * resource file for handling language support across the framework.
- * Customize the default text like so:
- *
- * Ext.window.MessageBox.buttonText.yes = "oui"; //french
- */
- buttonText: {
- ok: 'OK',
- yes: 'Yes',
- no: 'No',
- cancel: 'Cancel'
- },
- //</locale>
- buttonIds: [
- 'ok', 'yes', 'no', 'cancel'
- ],
- //<locale type="object">
- titleText: {
- confirm: 'Confirm',
- prompt: 'Prompt',
- wait: 'Loading...',
- alert: 'Attention'
- },
- //</locale>
- iconHeight: 35,
- makeButton: function(btnIdx) {
- var btnId = this.buttonIds[btnIdx];
- return new Ext.button.Button({
- handler: this.btnCallback,
- itemId: btnId,
- scope: this,
- text: this.buttonText[btnId],
- minWidth: 75
- });
- },
- btnCallback: function(btn) {
- var me = this,
- value,
- field;
- if (me.cfg.prompt || me.cfg.multiline) {
- if (me.cfg.multiline) {
- field = me.textArea;
- } else {
- field = me.textField;
- }
- value = field.getValue();
- field.reset();
- }
- // Important not to have focus remain in the hidden Window; Interferes with DnD.
- btn.blur();
- me.hide();
- me.userCallback(btn.itemId, value, me.cfg);
- },
- hide: function() {
- var me = this;
- me.dd.endDrag();
- me.progressBar.reset();
- me.removeCls(me.cfg.cls);
- me.callParent(arguments);
- },
- initComponent: function() {
- var me = this,
- baseId = me.id,
- i, button,
- tbLayout;
- me.title = '&#160;';
- me.topContainer = new Ext.container.Container({
- layout: 'hbox',
- style: {
- padding: '10px',
- overflow: 'hidden'
- },
- items: [
- me.iconComponent = new Ext.Component({
- cls: me.baseCls + '-icon',
- width: 50,
- height: me.iconHeight
- }),
- me.promptContainer = new Ext.container.Container({
- flex: 1,
- layout: {
- type: 'anchor'
- },
- items: [
- me.msg = new Ext.form.field.Display({
- id: baseId + '-displayfield',
- cls: me.baseCls + '-text'
- }),
- me.textField = new Ext.form.field.Text({
- id: baseId + '-testfield',
- anchor: '100%',
- enableKeyEvents: true,
- listeners: {
- keydown: me.onPromptKey,
- scope: me
- }
- }),
- me.textArea = new Ext.form.field.TextArea({
- id: baseId + '-textarea',
- anchor: '100%',
- height: 75
- })
- ]
- })
- ]
- });
- me.progressBar = new Ext.ProgressBar({
- id: baseId + '-progressbar',
- margins: '0 10 0 10'
- });
- me.items = [me.topContainer, me.progressBar];
- // Create the buttons based upon passed bitwise config
- me.msgButtons = [];
- for (i = 0; i < 4; i++) {
- button = me.makeButton(i);
- me.msgButtons[button.itemId] = button;
- me.msgButtons.push(button);
- }
- me.bottomTb = new Ext.toolbar.Toolbar({
- id: baseId + '-toolbar',
- ui: 'footer',
- dock: 'bottom',
- layout: {
- pack: 'center'
- },
- items: [
- me.msgButtons[0],
- me.msgButtons[1],
- me.msgButtons[2],
- me.msgButtons[3]
- ]
- });
- me.dockedItems = [me.bottomTb];
- // Get control at Toolbar's finishedLayout call and snag the contentWidth to contribute to our auto width calculation
- tbLayout = me.bottomTb.getLayout();
- tbLayout.finishedLayout = Ext.Function.createInterceptor(tbLayout.finishedLayout, function(ownerContext) {
- me.tbWidth = ownerContext.getProp('contentWidth');
- });
- me.on('close', me.onClose, me);
- me.callParent();
- },
-
- onClose: function(){
- var btn = this.header.child('[type=close]');
- // Give a temporary itemId so it can act like the cancel button
- btn.itemId = 'cancel';
- this.btnCallback(btn);
- delete btn.itemId;
- },
- onPromptKey: function(textField, e) {
- var me = this,
- blur;
- if (e.keyCode === Ext.EventObject.RETURN || e.keyCode === 10) {
- if (me.msgButtons.ok.isVisible()) {
- blur = true;
- me.msgButtons.ok.handler.call(me, me.msgButtons.ok);
- } else if (me.msgButtons.yes.isVisible()) {
- me.msgButtons.yes.handler.call(me, me.msgButtons.yes);
- blur = true;
- }
- if (blur) {
- me.textField.blur();
- }
- }
- },
- reconfigure: function(cfg) {
- var me = this,
- buttons = 0,
- hideToolbar = true,
- initialWidth = me.maxWidth,
- oldButtonText = me.buttonText,
- i;
- // Restore default buttonText before reconfiguring.
- me.updateButtonText();
- cfg = cfg || {};
- me.cfg = cfg;
- if (cfg.width) {
- initialWidth = cfg.width;
- }
- // Default to allowing the Window to take focus.
- delete me.defaultFocus;
- // clear any old animateTarget
- me.animateTarget = cfg.animateTarget || undefined;
- // Defaults to modal
- me.modal = cfg.modal !== false;
- // Show the title
- if (cfg.title) {
- me.setTitle(cfg.title||'&#160;');
- }
- // Extract button configs
- if (Ext.isObject(cfg.buttons)) {
- me.buttonText = cfg.buttons;
- buttons = 0;
- } else {
- me.buttonText = cfg.buttonText || me.buttonText;
- buttons = Ext.isNumber(cfg.buttons) ? cfg.buttons : 0;
- }
- // Apply custom-configured buttonText
- // Infer additional buttons from the specified property names in the buttonText object
- buttons = buttons | me.updateButtonText();
- // Restore buttonText. Next run of reconfigure will restore to prototype's buttonText
- me.buttonText = oldButtonText;
- // During the on render, or size resetting layouts, and in subsequent hiding and showing, we need to
- // suspend layouts, and flush at the end when the Window's children are at their final visibility.
- Ext.suspendLayouts();
- me.hidden = false;
- if (!me.rendered) {
- me.width = initialWidth;
- me.render(Ext.getBody());
- } else {
- me.setSize(initialWidth, me.maxHeight);
- }
- // Hide or show the close tool
- me.closable = cfg.closable && !cfg.wait;
- me.header.child('[type=close]').setVisible(cfg.closable !== false);
- // Hide or show the header
- if (!cfg.title && !me.closable) {
- me.header.hide();
- } else {
- me.header.show();
- }
- // Default to dynamic drag: drag the window, not a ghost
- me.liveDrag = !cfg.proxyDrag;
- // wrap the user callback
- me.userCallback = Ext.Function.bind(cfg.callback ||cfg.fn || Ext.emptyFn, cfg.scope || Ext.global);
- // Hide or show the icon Component
- me.setIcon(cfg.icon);
- // Hide or show the message area
- if (cfg.msg) {
- me.msg.setValue(cfg.msg);
- me.msg.show();
- } else {
- me.msg.hide();
- }
- // flush the layout here to pick up
- // height adjustments on the msg field
- Ext.resumeLayouts(true);
- Ext.suspendLayouts();
- // Hide or show the input field
- if (cfg.prompt || cfg.multiline) {
- me.multiline = cfg.multiline;
- if (cfg.multiline) {
- me.textArea.setValue(cfg.value);
- me.textArea.setHeight(cfg.defaultTextHeight || me.defaultTextHeight);
- me.textArea.show();
- me.textField.hide();
- me.defaultFocus = me.textArea;
- } else {
- me.textField.setValue(cfg.value);
- me.textArea.hide();
- me.textField.show();
- me.defaultFocus = me.textField;
- }
- } else {
- me.textArea.hide();
- me.textField.hide();
- }
- // Hide or show the progress bar
- if (cfg.progress || cfg.wait) {
- me.progressBar.show();
- me.updateProgress(0, cfg.progressText);
- if(cfg.wait === true){
- me.progressBar.wait(cfg.waitConfig);
- }
- } else {
- me.progressBar.hide();
- }
- // Hide or show buttons depending on flag value sent.
- for (i = 0; i < 4; i++) {
- if (buttons & Math.pow(2, i)) {
- // Default to focus on the first visible button if focus not already set
- if (!me.defaultFocus) {
- me.defaultFocus = me.msgButtons[i];
- }
- me.msgButtons[i].show();
- hideToolbar = false;
- } else {
- me.msgButtons[i].hide();
- }
- }
- // Hide toolbar if no buttons to show
- if (hideToolbar) {
- me.bottomTb.hide();
- } else {
- me.bottomTb.show();
- }
- Ext.resumeLayouts(true);
- },
- <span id='Ext-window-MessageBox-method-updateButtonText'> /**
- </span> * @private
- * Set button text according to current buttonText property object
- * @return {Number} The buttons bitwise flag based upon the button IDs specified in the buttonText property.
- */
- updateButtonText: function() {
- var me = this,
- buttonText = me.buttonText,
- buttons = 0,
- btnId,
- btn;
- for (btnId in buttonText) {
- if (buttonText.hasOwnProperty(btnId)) {
- btn = me.msgButtons[btnId];
- if (btn) {
- if (me.cfg && me.cfg.buttonText) {
- buttons = buttons | Math.pow(2, Ext.Array.indexOf(me.buttonIds, btnId));
- }
- if (btn.text != buttonText[btnId]) {
- btn.setText(buttonText[btnId]);
- }
- }
- }
- }
- return buttons;
- },
- <span id='Ext-window-MessageBox-method-show'> /**
- </span> * Displays a new message box, or reinitializes an existing message box, based on the config options passed in. All
- * display functions (e.g. prompt, alert, etc.) on MessageBox call this function internally, although those calls
- * are basic shortcuts and do not support all of the config options allowed here.
- *
- * Example usage:
- *
- * Ext.Msg.show({
- * title: 'Address',
- * msg: 'Please enter your address:',
- * width: 300,
- * buttons: Ext.Msg.OKCANCEL,
- * multiline: true,
- * fn: saveAddress,
- * animateTarget: 'addAddressBtn',
- * icon: Ext.window.MessageBox.INFO
- * });
- *
- * @param {Object} config The following config options are supported:
- *
- * @param {String/Ext.dom.Element} config.animateTarget
- * An id or Element from which the message box should animate as it opens and closes.
- *
- * @param {Number} [config.buttons=false]
- * A bitwise button specifier consisting of the sum of any of the following constants:
- *
- * - Ext.MessageBox.OK
- * - Ext.MessageBox.YES
- * - Ext.MessageBox.NO
- * - Ext.MessageBox.CANCEL
- *
- * Some common combinations have already been predefined:
- *
- * - Ext.MessageBox.OKCANCEL
- * - Ext.MessageBox.YESNO
- * - Ext.MessageBox.YESNOCANCEL
- *
- * Or false to not show any buttons.
- *
- * This may also be specified as an object hash containing custom button text in the same format as the
- * {@link #buttonText} config. Button IDs present as property names will be made visible.
- *
- * @param {Boolean} config.closable
- * False to hide the top-right close button (defaults to true). Note that progress and wait dialogs will ignore this
- * property and always hide the close button as they can only be closed programmatically.
- *
- * @param {String} config.cls
- * A custom CSS class to apply to the message box's container element
- *
- * @param {Number} [config.defaultTextHeight=75]
- * The default height in pixels of the message box's multiline textarea if displayed.
- *
- * @param {Function} config.fn
- * A callback function which is called when the dialog is dismissed either by clicking on the configured buttons, or
- * on the dialog close button, or by pressing the return button to enter input.
- *
- * Progress and wait dialogs will ignore this option since they do not respond to user actions and can only be
- * closed programmatically, so any required function should be called by the same code after it closes the dialog.
- * Parameters passed:
- *
- * @param {String} config.fn.buttonId The ID of the button pressed, one of:
- *
- * - ok
- * - yes
- * - no
- * - cancel
- *
- * @param {String} config.fn.text Value of the input field if either `prompt` or `multiline` is true
- * @param {Object} config.fn.opt The config object passed to show.
- *
- * @param {Object} config.buttonText
- * An object containing string properties which override the system-supplied button text values just for this
- * invocation. The property names are:
- *
- * - ok
- * - yes
- * - no
- * - cancel
- *
- * @param {Object} config.scope
- * The scope (`this` reference) in which the function will be executed.
- *
- * @param {String} config.icon
- * A CSS class that provides a background image to be used as the body icon for the dialog.
- * One can use a predefined icon class:
- *
- * - Ext.MessageBox.INFO
- * - Ext.MessageBox.WARNING
- * - Ext.MessageBox.QUESTION
- * - Ext.MessageBox.ERROR
- *
- * or use just any `'custom-class'`. Defaults to empty string.
- *
- * @param {String} config.iconCls
- * The standard {@link Ext.window.Window#iconCls} to add an optional header icon (defaults to '')
- *
- * @param {Number} config.maxWidth
- * The maximum width in pixels of the message box (defaults to 600)
- *
- * @param {Number} config.minWidth
- * The minimum width in pixels of the message box (defaults to 100)
- *
- * @param {Boolean} config.modal
- * False to allow user interaction with the page while the message box is displayed (defaults to true)
- *
- * @param {String} config.msg
- * A string that will replace the existing message box body text (defaults to the XHTML-compliant non-breaking space
- * character '&#160;')
- *
- * @param {Boolean} config.multiline
- * True to prompt the user to enter multi-line text (defaults to false)
- *
- * @param {Boolean} config.progress
- * True to display a progress bar (defaults to false)
- *
- * @param {String} config.progressText
- * The text to display inside the progress bar if progress = true (defaults to '')
- *
- * @param {Boolean} config.prompt
- * True to prompt the user to enter single-line text (defaults to false)
- *
- * @param {Boolean} config.proxyDrag
- * True to display a lightweight proxy while dragging (defaults to false)
- *
- * @param {String} config.title
- * The title text
- *
- * @param {String} config.value
- * The string value to set into the active textbox element if displayed
- *
- * @param {Boolean} config.wait
- * True to display a progress bar (defaults to false)
- *
- * @param {Object} config.waitConfig
- * A {@link Ext.ProgressBar#wait} config object (applies only if wait = true)
- *
- * @param {Number} config.width
- * The width of the dialog in pixels
- *
- * @return {Ext.window.MessageBox} this
- */
- show: function(cfg) {
- var me = this;
- me.reconfigure(cfg);
- me.addCls(cfg.cls);
- me.doAutoSize();
- // Set the flag, so that the parent show method performs the show procedure that we need.
- // ie: animation from animTarget, onShow processing and focusing.
- me.hidden = true;
- me.callParent();
- return me;
- },
- onShow: function() {
- this.callParent(arguments);
- this.center();
- },
- doAutoSize: function() {
- var me = this,
- headerVisible = me.header.rendered && me.header.isVisible(),
- footerVisible = me.bottomTb.rendered && me.bottomTb.isVisible(),
- width,
- height;
- if (!Ext.isDefined(me.frameWidth)) {
- me.frameWidth = me.el.getWidth() - me.body.getWidth();
- }
- // Allow per-invocation override of minWidth
- me.minWidth = me.cfg.minWidth || Ext.getClass(this).prototype.minWidth;
- // Width must be max of titleWidth, message+icon width, and total button width
- width = Math.max(
- headerVisible ? me.header.getMinWidth() : 0, // title width
- me.cfg.width || me.msg.getWidth() + me.iconComponent.getWidth() + 25, // msg + icon width + topContainer's layout padding */
- (footerVisible ? me.tbWidth : 0)// total button width
- );
- height = (headerVisible ? me.header.getHeight() : 0) +
- me.topContainer.getHeight() +
- me.progressBar.getHeight() +
- (footerVisible ? me.bottomTb.getHeight() + me.bottomTb.el.getMargin('tb') : 0);
- me.setSize(width + me.frameWidth, height + me.frameWidth);
- return me;
- },
- updateText: function(text) {
- this.msg.setValue(text);
- return this.doAutoSize(true);
- },
- <span id='Ext-window-MessageBox-method-setIcon'> /**
- </span> * Adds the specified icon to the dialog. By default, the class 'x-messagebox-icon' is applied for default
- * styling, and the class passed in is expected to supply the background image url. Pass in empty string ('')
- * to clear any existing icon. This method must be called before the MessageBox is shown.
- * The following built-in icon classes are supported, but you can also pass in a custom class name:
- *
- * Ext.window.MessageBox.INFO
- * Ext.window.MessageBox.WARNING
- * Ext.window.MessageBox.QUESTION
- * Ext.window.MessageBox.ERROR
- *
- * @param {String} icon A CSS classname specifying the icon's background image url, or empty string to clear the icon
- * @return {Ext.window.MessageBox} this
- */
- setIcon : function(icon) {
- var me = this;
- me.iconComponent.removeCls(me.messageIconCls);
- if (icon) {
- me.iconComponent.show();
- me.iconComponent.addCls(Ext.baseCSSPrefix + 'dlg-icon');
- me.iconComponent.addCls(me.messageIconCls = icon);
- } else {
- me.iconComponent.removeCls(Ext.baseCSSPrefix + 'dlg-icon');
- me.iconComponent.hide();
- }
- return me;
- },
- <span id='Ext-window-MessageBox-method-updateProgress'> /**
- </span> * Updates a progress-style message box's text and progress bar. Only relevant on message boxes
- * initiated via {@link Ext.window.MessageBox#progress} or {@link Ext.window.MessageBox#wait},
- * or by calling {@link Ext.window.MessageBox#method-show} with progress: true.
- *
- * @param {Number} [value=0] Any number between 0 and 1 (e.g., .5)
- * @param {String} [progressText=''] The progress text to display inside the progress bar.
- * @param {String} [msg] The message box's body text is replaced with the specified string (defaults to undefined
- * so that any existing body text will not get overwritten by default unless a new value is passed in)
- * @return {Ext.window.MessageBox} this
- */
- updateProgress : function(value, progressText, msg){
- this.progressBar.updateProgress(value, progressText);
- if (msg){
- this.updateText(msg);
- }
- return this;
- },
- onEsc: function() {
- if (this.closable !== false) {
- this.callParent(arguments);
- }
- },
- <span id='Ext-window-MessageBox-method-confirm'> /**
- </span> * Displays a confirmation message box with Yes and No buttons (comparable to JavaScript's confirm).
- * If a callback function is passed it will be called after the user clicks either button,
- * and the id of the button that was clicked will be passed as the only parameter to the callback
- * (could also be the top-right close button, which will always report as "cancel").
- *
- * @param {String} title The title bar text
- * @param {String} msg The message box body text
- * @param {Function} [fn] The callback function invoked after the message box is closed.
- * See {@link #method-show} method for details.
- * @param {Object} [scope=window] The scope (`this` reference) in which the callback is executed.
- * @return {Ext.window.MessageBox} this
- */
- confirm: function(cfg, msg, fn, scope) {
- if (Ext.isString(cfg)) {
- cfg = {
- title: cfg,
- icon: this.QUESTION,
- msg: msg,
- buttons: this.YESNO,
- callback: fn,
- scope: scope
- };
- }
- return this.show(cfg);
- },
- <span id='Ext-window-MessageBox-method-prompt'> /**
- </span> * Displays a message box with OK and Cancel buttons prompting the user to enter some text (comparable to JavaScript's prompt).
- * The prompt can be a single-line or multi-line textbox. If a callback function is passed it will be called after the user
- * clicks either button, and the id of the button that was clicked (could also be the top-right
- * close button, which will always report as "cancel") and the text that was entered will be passed as the two parameters to the callback.
- *
- * @param {String} title The title bar text
- * @param {String} msg The message box body text
- * @param {Function} [fn] The callback function invoked after the message box is closed.
- * See {@link #method-show} method for details.
- * @param {Object} [scope=window] The scope (`this` reference) in which the callback is executed.
- * @param {Boolean/Number} [multiline=false] True to create a multiline textbox using the defaultTextHeight
- * property, or the height in pixels to create the textbox/
- * @param {String} [value=''] Default value of the text input element
- * @return {Ext.window.MessageBox} this
- */
- prompt : function(cfg, msg, fn, scope, multiline, value){
- if (Ext.isString(cfg)) {
- cfg = {
- prompt: true,
- title: cfg,
- minWidth: this.minPromptWidth,
- msg: msg,
- buttons: this.OKCANCEL,
- callback: fn,
- scope: scope,
- multiline: multiline,
- value: value
- };
- }
- return this.show(cfg);
- },
- <span id='Ext-window-MessageBox-method-wait'> /**
- </span> * Displays a message box with an infinitely auto-updating progress bar. This can be used to block user
- * interaction while waiting for a long-running process to complete that does not have defined intervals.
- * You are responsible for closing the message box when the process is complete.
- *
- * @param {String} msg The message box body text
- * @param {String} [title] The title bar text
- * @param {Object} [config] A {@link Ext.ProgressBar#wait} config object
- * @return {Ext.window.MessageBox} this
- */
- wait : function(cfg, title, config){
- if (Ext.isString(cfg)) {
- cfg = {
- title : title,
- msg : cfg,
- closable: false,
- wait: true,
- modal: true,
- minWidth: this.minProgressWidth,
- waitConfig: config
- };
- }
- return this.show(cfg);
- },
- <span id='Ext-window-MessageBox-method-alert'> /**
- </span> * Displays a standard read-only message box with an OK button (comparable to the basic JavaScript alert prompt).
- * If a callback function is passed it will be called after the user clicks the button, and the
- * id of the button that was clicked will be passed as the only parameter to the callback
- * (could also be the top-right close button, which will always report as "cancel").
- *
- * @param {String} title The title bar text
- * @param {String} msg The message box body text
- * @param {Function} [fn] The callback function invoked after the message box is closed.
- * See {@link #method-show} method for details.
- * @param {Object} [scope=window] The scope (<code>this</code> reference) in which the callback is executed.
- * @return {Ext.window.MessageBox} this
- */
- alert: function(cfg, msg, fn, scope) {
- if (Ext.isString(cfg)) {
- cfg = {
- title : cfg,
- msg : msg,
- buttons: this.OK,
- fn: fn,
- scope : scope,
- minWidth: this.minWidth
- };
- }
- return this.show(cfg);
- },
- <span id='Ext-window-MessageBox-method-progress'> /**
- </span> * Displays a message box with a progress bar.
- *
- * You are responsible for updating the progress bar as needed via {@link Ext.window.MessageBox#updateProgress}
- * and closing the message box when the process is complete.
- *
- * @param {String} title The title bar text
- * @param {String} msg The message box body text
- * @param {String} [progressText=''] The text to display inside the progress bar
- * @return {Ext.window.MessageBox} this
- */
- progress : function(cfg, msg, progressText){
- if (Ext.isString(cfg)) {
- cfg = {
- title: cfg,
- msg: msg,
- progress: true,
- progressText: progressText
- };
- }
- return this.show(cfg);
- }
- }, function() {
- <span id='Ext-MessageBox'> /**
- </span> * @class Ext.MessageBox
- * @alternateClassName Ext.Msg
- * @extends Ext.window.MessageBox
- * @singleton
- * Singleton instance of {@link Ext.window.MessageBox}.
- */
- Ext.MessageBox = Ext.Msg = new this();
- });</pre>
- </body>
- </html>
|