Moved to app confirm dialog.

app/assets/javascripts/app/controllers/_application_controller.coffee

@@ -684,7 +684,7 @@ class App.ControllerModal extends App.Controller
     'submit form':                        'submit'
     'click .js-submit:not(.is-disabled)': 'submit'
     'click .js-cancel':                   'cancel'
-    'click .js-close':                    'close'
+    'click .js-close':                    'cancel'
 
   className: 'modal fade'
 
@@ -765,6 +765,7 @@ class App.ControllerModal extends App.Controller
       'hidden.bs.modal': =>
         @onClosed()
         $('.modal').remove()
+      'dismiss.bs.modal': @onCancel
 
     if @closeOnAnyClick
       @el.on('click', =>

app/assets/javascripts/app/controllers/_application_controller_generic.coffee

@@ -291,6 +291,22 @@ class App.ControllerGenericDestroyConfirm extends App.ControllerModal
         @close()
     )
 
+class App.ControllerConfirm extends App.ControllerModal
+  buttonClose: true
+  buttonCancel: true
+  buttonSubmit: 'yes'
+  buttonClass: 'btn--danger'
+  head: 'Confirm'
+  small: true
+
+  content: ->
+    App.i18n.translateContent(@message)
+
+  onSubmit: =>
+    @close()
+    if @callback
+      @callback()
+
 class App.ControllerDrox extends App.Controller
   constructor: (params) ->
     super

app/assets/javascripts/app/controllers/maintenance.coffee

@@ -36,16 +36,24 @@ class Index extends App.ControllerContent
 
   setMode: (e) =>
     value = @modeSetting.prop('checked')
-    if value && !confirm('Sure?')
+    callback = ->
-      @modeSetting.prop('checked', false)
+      App.Setting.set('maintenance_mode', value)
+      App.WebSocket.send(
+        event:'maintenance'
+        data:
+          type: 'mode'
+          on: value
+      )
+    if value
+      new App.ControllerConfirm(
+        message: 'Sure?'
+        callback: callback
+        onCancel: =>
+          @modeSetting.prop('checked', false)
+        container: @el.closest('.content')
+      )
       return value
-    App.Setting.set('maintenance_mode', value)
+    callback()
-    App.WebSocket.send(
-      event:'maintenance'
-      data:
-        type: 'mode'
-        on: value
-    )
 
   setLogin: (e) =>
     value = @loginSetting.prop('checked')

app/assets/javascripts/app/lib/bootstrap/modal.js

@@ -149,6 +149,10 @@
     if (this.isShown && this.options.keyboard) {
       $(window).on('keydown.dismiss.bs.modal', $.proxy(function (e) {
         e.which == 27 && this.hide()
+        // 2016-08-21: added event to capture esc for cancel
+        e = $.Event('dismiss.bs.modal')
+        this.$element.trigger(e)
+        // -
       }, this))
     } else if (!this.isShown) {
       $(window).off('keydown.dismiss.bs.modal')

test/browser/maintenance_test.rb

@@ -272,9 +272,15 @@ class MaintenanceTest < TestCase
     )
 
     # check warning
-    alert = browser1.switch_to.alert
+    watch_for(
-    #alert.dismiss()
+      browser: browser1,
-    alert.accept()
+      css: '#content .modal .modal-header',
+      value: 'confirm',
+    )
+    click(
+      browser: browser1,
+      css: '#content .modal .js-submit',
+    )
 
     watch_for(
       browser: browser2,
@@ -352,10 +358,17 @@ class MaintenanceTest < TestCase
       type:     'on',
       no_check: true,
     )
+
     # check warning
-    alert = browser1.switch_to.alert
+    watch_for(
-    #alert.dismiss()
+      browser: browser1,
-    alert.accept()
+      css: '#content .modal .modal-header',
+      value: 'confirm',
+    )
+    click(
+      browser: browser1,
+      css: '#content .modal .js-submit',
+    )
 
     watch_for(
       browser: browser2,