ソースを参照

* FIXED #121 *
* More controls on confirm dialog, REFS #105 *
* Added I18N example *

Dante 10 年 前
コミット
9caace1112

+ 3 - 0
changelog.txt

@@ -1,7 +1,10 @@
 LASTEST NOT RELEASED
 ------------------------------
 * FIXED #102 *
+* FIXED #121 *
 * Implemented modal-sm, REFS #105 *
+* More controls on confirm dialog, REFS #105 *
+* Added I18N example *
 
 V1.34.1
 ------------------------------

+ 44 - 17
dist/js/bootstrap-dialog.js

@@ -204,6 +204,7 @@
     BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_DANGER] = 'Danger';
     BootstrapDialog.DEFAULT_TEXTS['OK'] = 'OK';
     BootstrapDialog.DEFAULT_TEXTS['CANCEL'] = 'Cancel';
+    BootstrapDialog.DEFAULT_TEXTS['CONFIRM'] = 'Confirmation';
 
     BootstrapDialog.SIZE_NORMAL = 'size-normal';
     BootstrapDialog.SIZE_SMALL = 'size-small';
@@ -975,7 +976,10 @@
             this.getModal().on('hidden.bs.modal', {dialog: this}, function(event) {
                 var dialog = event.data.dialog;
                 dialog.isModalEvent(event) && typeof dialog.options.onhidden === 'function' && dialog.options.onhidden(dialog);
-                dialog.isAutodestroy() && $(this).remove();
+                if (dialog.isAutodestroy()) {
+                    delete BootstrapDialog.dialogs[dialog.getId()];
+                    $(this).remove();
+                }
                 BootstrapDialog.moveFocus();
             });
 
@@ -1073,9 +1077,6 @@
             return this;
         },
         close: function() {
-            if (this.isAutodestroy()) {
-                delete BootstrapDialog.dialogs[this.getId()];
-            }
             this.getModal().modal('hide');
             this.setOpened(false);
 
@@ -1125,7 +1126,8 @@
             type: BootstrapDialog.TYPE_PRIMARY,
             title: null,
             message: null,
-            closable: true,
+            closable: false,
+            draggable: false,
             buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
             callback: null
         };
@@ -1135,8 +1137,6 @@
         } else {
             options = $.extend(true, defaultOptions, {
                 message: arguments[0],
-                closable: false,
-                buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
                 callback: typeof arguments[1] !== 'undefined' ? arguments[1] : null
             });
         }
@@ -1146,6 +1146,7 @@
             title: options.title,
             message: options.message,
             closable: options.closable,
+            draggable: options.draggable,
             data: {
                 callback: options.callback
             },
@@ -1166,27 +1167,53 @@
     /**
      * Confirm window
      *
-     * @param {type} message
-     * @param {type} callback
      * @returns the created dialog instance
      */
-    BootstrapDialog.confirm = function(message, callback) {
-        return new BootstrapDialog({
-            title: 'Confirmation',
-            message: message,
+    BootstrapDialog.confirm = function() {
+        var options = {};
+        var defaultOptions = {
+            type: BootstrapDialog.TYPE_PRIMARY,
+            title: null,
+            message: null,
             closable: false,
+            draggable: false,
+            btnCancelLabel: BootstrapDialog.DEFAULT_TEXTS.CANCEL,
+            btnOKLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
+            btnOKClass: null,
+            callback: null
+        };
+        if (typeof arguments[0] === 'object' && arguments[0].constructor === {}.constructor) {
+            options = $.extend(true, defaultOptions, arguments[0]);
+        } else {
+            options = $.extend(true, defaultOptions, {
+                message: arguments[0],
+                closable: false,
+                buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
+                callback: typeof arguments[1] !== 'undefined' ? arguments[1] : null
+            });
+        }
+        if (options.btnOKClass === null) {
+            options.btnOKClass = ['btn', options.type.split('-')[1]].join('-');
+        }
+
+        return new BootstrapDialog({
+            type: options.type,
+            title: options.title,
+            message: options.message,
+            closable: options.closable,
+            draggable: options.draggable,
             data: {
-                'callback': callback
+                callback: options.callback
             },
             buttons: [{
-                    label: BootstrapDialog.DEFAULT_TEXTS.CANCEL,
+                    label: options.btnCancelLabel,
                     action: function(dialog) {
                         typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(false);
                         dialog.close();
                     }
                 }, {
-                    label: BootstrapDialog.DEFAULT_TEXTS.OK,
-                    cssClass: 'btn-primary',
+                    label: options.btnOKLabel,
+                    cssClass: options.btnOKClass,
                     action: function(dialog) {
                         typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(true);
                         dialog.close();

ファイルの差分が大きいため隠しています
+ 1 - 1
dist/js/bootstrap-dialog.min.js


+ 44 - 17
examples/assets/bootstrap-dialog/js/bootstrap-dialog.js

@@ -204,6 +204,7 @@
     BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_DANGER] = 'Danger';
     BootstrapDialog.DEFAULT_TEXTS['OK'] = 'OK';
     BootstrapDialog.DEFAULT_TEXTS['CANCEL'] = 'Cancel';
+    BootstrapDialog.DEFAULT_TEXTS['CONFIRM'] = 'Confirmation';
 
     BootstrapDialog.SIZE_NORMAL = 'size-normal';
     BootstrapDialog.SIZE_SMALL = 'size-small';
@@ -975,7 +976,10 @@
             this.getModal().on('hidden.bs.modal', {dialog: this}, function(event) {
                 var dialog = event.data.dialog;
                 dialog.isModalEvent(event) && typeof dialog.options.onhidden === 'function' && dialog.options.onhidden(dialog);
-                dialog.isAutodestroy() && $(this).remove();
+                if (dialog.isAutodestroy()) {
+                    delete BootstrapDialog.dialogs[dialog.getId()];
+                    $(this).remove();
+                }
                 BootstrapDialog.moveFocus();
             });
 
@@ -1073,9 +1077,6 @@
             return this;
         },
         close: function() {
-            if (this.isAutodestroy()) {
-                delete BootstrapDialog.dialogs[this.getId()];
-            }
             this.getModal().modal('hide');
             this.setOpened(false);
 
@@ -1125,7 +1126,8 @@
             type: BootstrapDialog.TYPE_PRIMARY,
             title: null,
             message: null,
-            closable: true,
+            closable: false,
+            draggable: false,
             buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
             callback: null
         };
@@ -1135,8 +1137,6 @@
         } else {
             options = $.extend(true, defaultOptions, {
                 message: arguments[0],
-                closable: false,
-                buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
                 callback: typeof arguments[1] !== 'undefined' ? arguments[1] : null
             });
         }
@@ -1146,6 +1146,7 @@
             title: options.title,
             message: options.message,
             closable: options.closable,
+            draggable: options.draggable,
             data: {
                 callback: options.callback
             },
@@ -1166,27 +1167,53 @@
     /**
      * Confirm window
      *
-     * @param {type} message
-     * @param {type} callback
      * @returns the created dialog instance
      */
-    BootstrapDialog.confirm = function(message, callback) {
-        return new BootstrapDialog({
-            title: 'Confirmation',
-            message: message,
+    BootstrapDialog.confirm = function() {
+        var options = {};
+        var defaultOptions = {
+            type: BootstrapDialog.TYPE_PRIMARY,
+            title: null,
+            message: null,
             closable: false,
+            draggable: false,
+            btnCancelLabel: BootstrapDialog.DEFAULT_TEXTS.CANCEL,
+            btnOKLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
+            btnOKClass: null,
+            callback: null
+        };
+        if (typeof arguments[0] === 'object' && arguments[0].constructor === {}.constructor) {
+            options = $.extend(true, defaultOptions, arguments[0]);
+        } else {
+            options = $.extend(true, defaultOptions, {
+                message: arguments[0],
+                closable: false,
+                buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
+                callback: typeof arguments[1] !== 'undefined' ? arguments[1] : null
+            });
+        }
+        if (options.btnOKClass === null) {
+            options.btnOKClass = ['btn', options.type.split('-')[1]].join('-');
+        }
+
+        return new BootstrapDialog({
+            type: options.type,
+            title: options.title,
+            message: options.message,
+            closable: options.closable,
+            draggable: options.draggable,
             data: {
-                'callback': callback
+                callback: options.callback
             },
             buttons: [{
-                    label: BootstrapDialog.DEFAULT_TEXTS.CANCEL,
+                    label: options.btnCancelLabel,
                     action: function(dialog) {
                         typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(false);
                         dialog.close();
                     }
                 }, {
-                    label: BootstrapDialog.DEFAULT_TEXTS.OK,
-                    cssClass: 'btn-primary',
+                    label: options.btnOKLabel,
+                    cssClass: options.btnOKClass,
                     action: function(dialog) {
                         typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(true);
                         dialog.close();

ファイルの差分が大きいため隠しています
+ 1 - 1
examples/assets/bootstrap-dialog/js/bootstrap-dialog.min.js


+ 47 - 61
examples/index.html

@@ -829,7 +829,8 @@
             title: 'WARNING',
             message: 'Warning! No Banana!',
             type: BootstrapDialog.TYPE_WARNING, // <-- Default value is BootstrapDialog.TYPE_PRIMARY
-            closable: true, // <-- Default value is true
+            closable: true, // <-- Default value is false
+            draggable: true, // <-- Default value is false
             buttonLabel: 'Roar! Why!', // <-- Default value is 'OK',
             callback: function(result) {
                 // result will be true if button was click, while it will be false if users close the dialog directly.
@@ -858,68 +859,53 @@
         });
         -->
     </div>
+
+    <a name="advanced-confirm-window"></a>
+    <h3>Just like what we have done in alert, we can control confirm dialog more.</h3>
+    <div class="source-code runnable">
+        <!--
+        BootstrapDialog.confirm({
+            title: 'WARNING',
+            message: 'Warning! Drop your banana?',
+            type: BootstrapDialog.TYPE_WARNING, // <-- Default value is BootstrapDialog.TYPE_PRIMARY
+            closable: true, // <-- Default value is false
+            draggable: true, // <-- Default value is false
+            btnCancelLabel: 'Do not drop it!', // <-- Default value is 'Cancel',
+            btnOKLabel: 'Drop it!', // <-- Default value is 'OK',
+            btnOKClass: 'btn-warning', // <-- If you didn't specify it, dialog type will be used,
+            callback: function(result) {
+                // result will be true if button was click, while it will be false if users close the dialog directly.
+                if(result) {
+                    alert('Yup.');
+                }else {
+                    alert('Nope.');
+                }
+            }
+        });
+        -->
+    </div>
     
-    <h3>Source code of the shortcut methods above</h3>
-    <p>
-        I mean you can write your own handy stuff :)
-    </p>
-    <div class="source-code">
+    <a name="i18n-message"></a>
+    <h3>I18N</h3>
+    <p>BootstrapDialog has prepared for i18n purpose, you can write something into a .js file to restore default texts and reference the file after loading BootstrapDialog, see below an example.</p>
+    <p>Refresh the page to restore texts after running this example.</p>
+    <div class="source-code runnable">
         <!--
-        /**
-         * Alert window
-         * 
-         * @param {type} message
-         * @param {type} callback
-         * @returns {undefined}
-         */
-        BootstrapDialog.alert = function(message, callback) {
-            new BootstrapDialog({
-                message: message,
-                data: {
-                    'callback': callback
-                },
-                closable: false,
-                buttons: [{
-                        label: 'OK',
-                        action: function(dialog) {
-                            typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(true);
-                            dialog.close();
-                        }
-                    }]
-            }).open();
-        };
-
-        /**
-         * Confirm window
-         * 
-         * @param {type} message
-         * @param {type} callback
-         * @returns {undefined}
-         */
-        BootstrapDialog.confirm = function(message, callback) {
-            new BootstrapDialog({
-                title: 'Confirmation',
-                message: message,
-                closable: false,
-                data: {
-                    'callback': callback
-                },
-                buttons: [{
-                        label: 'Cancel',
-                        action: function(dialog) {
-                            typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(false);
-                            dialog.close();
-                        }
-                    }, {
-                        label: 'OK',
-                        cssClass: 'btn-primary',
-                        action: function(dialog) {
-                            typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(true);
-                            dialog.close();
-                        }
-                    }]
-            }).open();
-        };
+        /** Contents of file i18n-zh_cn.js **/
+        BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_DEFAULT] = '信息';
+        BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_INFO] = '信息';
+        BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_PRIMARY] = '信息';
+        BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_SUCCESS] = '成功';
+        BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_WARNING] = '警告';
+        BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_DANGER] = '错误';
+        BootstrapDialog.DEFAULT_TEXTS['OK'] = '确认';
+        BootstrapDialog.DEFAULT_TEXTS['CANCEL'] = '取消';
+        BootstrapDialog.DEFAULT_TEXTS['CONFIRM'] = '确认';
+        
+        // <script src="js/bootstrap-dialog.js"></script>
+        // <script src="js/i18n-zh_cn.js.js"></script>
+        BootstrapDialog.alert('Hello');
+        BootstrapDialog.confirm('Hello');
         -->
     </div>
     

+ 44 - 17
src/js/bootstrap-dialog.js

@@ -204,6 +204,7 @@
     BootstrapDialog.DEFAULT_TEXTS[BootstrapDialog.TYPE_DANGER] = 'Danger';
     BootstrapDialog.DEFAULT_TEXTS['OK'] = 'OK';
     BootstrapDialog.DEFAULT_TEXTS['CANCEL'] = 'Cancel';
+    BootstrapDialog.DEFAULT_TEXTS['CONFIRM'] = 'Confirmation';
 
     BootstrapDialog.SIZE_NORMAL = 'size-normal';
     BootstrapDialog.SIZE_SMALL = 'size-small';
@@ -975,7 +976,10 @@
             this.getModal().on('hidden.bs.modal', {dialog: this}, function(event) {
                 var dialog = event.data.dialog;
                 dialog.isModalEvent(event) && typeof dialog.options.onhidden === 'function' && dialog.options.onhidden(dialog);
-                dialog.isAutodestroy() && $(this).remove();
+                if (dialog.isAutodestroy()) {
+                    delete BootstrapDialog.dialogs[dialog.getId()];
+                    $(this).remove();
+                }
                 BootstrapDialog.moveFocus();
             });
 
@@ -1073,9 +1077,6 @@
             return this;
         },
         close: function() {
-            if (this.isAutodestroy()) {
-                delete BootstrapDialog.dialogs[this.getId()];
-            }
             this.getModal().modal('hide');
             this.setOpened(false);
 
@@ -1125,7 +1126,8 @@
             type: BootstrapDialog.TYPE_PRIMARY,
             title: null,
             message: null,
-            closable: true,
+            closable: false,
+            draggable: false,
             buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
             callback: null
         };
@@ -1135,8 +1137,6 @@
         } else {
             options = $.extend(true, defaultOptions, {
                 message: arguments[0],
-                closable: false,
-                buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
                 callback: typeof arguments[1] !== 'undefined' ? arguments[1] : null
             });
         }
@@ -1146,6 +1146,7 @@
             title: options.title,
             message: options.message,
             closable: options.closable,
+            draggable: options.draggable,
             data: {
                 callback: options.callback
             },
@@ -1166,27 +1167,53 @@
     /**
      * Confirm window
      *
-     * @param {type} message
-     * @param {type} callback
      * @returns the created dialog instance
      */
-    BootstrapDialog.confirm = function(message, callback) {
-        return new BootstrapDialog({
-            title: 'Confirmation',
-            message: message,
+    BootstrapDialog.confirm = function() {
+        var options = {};
+        var defaultOptions = {
+            type: BootstrapDialog.TYPE_PRIMARY,
+            title: null,
+            message: null,
             closable: false,
+            draggable: false,
+            btnCancelLabel: BootstrapDialog.DEFAULT_TEXTS.CANCEL,
+            btnOKLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
+            btnOKClass: null,
+            callback: null
+        };
+        if (typeof arguments[0] === 'object' && arguments[0].constructor === {}.constructor) {
+            options = $.extend(true, defaultOptions, arguments[0]);
+        } else {
+            options = $.extend(true, defaultOptions, {
+                message: arguments[0],
+                closable: false,
+                buttonLabel: BootstrapDialog.DEFAULT_TEXTS.OK,
+                callback: typeof arguments[1] !== 'undefined' ? arguments[1] : null
+            });
+        }
+        if (options.btnOKClass === null) {
+            options.btnOKClass = ['btn', options.type.split('-')[1]].join('-');
+        }
+
+        return new BootstrapDialog({
+            type: options.type,
+            title: options.title,
+            message: options.message,
+            closable: options.closable,
+            draggable: options.draggable,
             data: {
-                'callback': callback
+                callback: options.callback
             },
             buttons: [{
-                    label: BootstrapDialog.DEFAULT_TEXTS.CANCEL,
+                    label: options.btnCancelLabel,
                     action: function(dialog) {
                         typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(false);
                         dialog.close();
                     }
                 }, {
-                    label: BootstrapDialog.DEFAULT_TEXTS.OK,
-                    cssClass: 'btn-primary',
+                    label: options.btnOKLabel,
+                    cssClass: options.btnOKClass,
                     action: function(dialog) {
                         typeof dialog.getData('callback') === 'function' && dialog.getData('callback')(true);
                         dialog.close();