Setup UI - Support client-side validator (jQuery)

diff --git a/setup/res/installer.js b/setup/res/installer.js
new file mode 100644 (file)
index 0000000..801c34c
--- /dev/null
+++ b/setup/res/installer.js
@@ -0,0 +1,31 @@
+(function($){
+  /**
+   * Enable or disable an error message.
+   *
+   * <p id="my-error-message">The world is one fire.</p>
+   * Ex: $('#my-error-message').toggleError(false)
+   *
+   * @param bool isError
+   */
+  $.fn.toggleError = function (isError) {
+    this.toggleClass('install-validate-ok', !isError)
+      .toggleClass('install-validate-bad', isError)
+      .toggleClass('error', isError);
+
+    var errors = $('.install-validate-bad');
+    $('#install_button').prop('disabled', errors.length > 0);
+    return this;
+  };
+
+  /**
+   * Ex: $('.watch-these').useValidator(function(){
+   *   $('#some-error-message').toggleError(booleanExpression);
+   * })
+   * @param cb
+   */
+  $.fn.useValidator = function(cb) {
+    cb();
+    this.on('change', cb);
+    return this;
+  };
+})($);
\ No newline at end of file

diff --git a/setup/res/template.css b/setup/res/template.css
index 240843a602521773cd97f0d2c211f216813e8add..5a2b3ea1060896e84c97e6e4337fa3f7852e78b8 100644 (file)
--- a/setup/res/template.css
+++ b/setup/res/template.css
@@ -130,6 +130,13 @@ body {
   font-size: 80%;
 }
 
+.civicrm-setup-body .install-validate-ok {
+  display: none;
+}
+
+.civicrm-setup-body .install-validate-bad {
+}
+
 .civicrm-setup-body .reqTable {
   border-collapse: collapse;
   width: 100%;
@@ -223,6 +230,10 @@ body {
 .civicrm-setup-body input[type=submit]:hover {
   background: #60A237;
 }
+.civicrm-setup-body input[type=submit]:disabled {
+  background: #888;
+  cursor: not-allowed;
+}
 
 .civicrm-setup-body .settingsTable input[type=text] { width: 80%; }
 

diff --git a/setup/src/Setup/UI/SetupController.php b/setup/src/Setup/UI/SetupController.php
index 74fd0d434157fa3ecabbb860ec82dd706db27a98..a0434fa401b51b6e449bf71e3588d18d89b6afa8 100644 (file)
--- a/setup/src/Setup/UI/SetupController.php
+++ b/setup/src/Setup/UI/SetupController.php
@@ -191,6 +191,7 @@ class SetupController implements SetupControllerInterface {
     $r->body = $body;
     $r->assets = [
       ['type' => 'script-url', 'url' => $this->getUrl('jquery.js')],
+      ['type' => 'script-url', 'url' => $this->urls['res'] . "installer.js"],
       ['type' => 'script-code', 'code' => 'window.csj$ = jQuery.noConflict();'],
       ['type' => 'style-url', 'url' => $this->urls['res'] . "template.css"],
       ['type' => 'style-url', 'url' => $this->getUrl('font-awesome.css')],