MSFTMPP-372: Minor UI Improvements

microsoft · Mar 3, 2016 · 38aa5b1 · 38aa5b1
1 parent d8d07c2
commit 38aa5b1
Show file tree

Hide file tree

Showing 10 changed files with 46 additions and 30 deletions.
diff --git a/local/o365/classes/adminsetting/azuresetup.js b/local/o365/classes/adminsetting/azuresetup.js
@@ -91,7 +91,7 @@ $.fn.azuresetup = function(options) {
      * @return object jQuery object representing rendered box.
      */
     this.rendererrorbox = function(content) {
-        var box = $('<div></div>').addClass('alert-error local_o365_statusmessage');
+        var box = $('<div></div>').addClass('alert-error alert local_o365_statusmessage');
         box.append(opts.iconerror);
         box.append('<span style="inline-block">'+content+'</span>');
         return box;
@@ -104,7 +104,7 @@ $.fn.azuresetup = function(options) {
      * @return object jQuery object representing rendered box.
      */
     this.renderinfobox = function(content) {
-        var box = $('<div></div>').addClass('alert-info local_o365_statusmessage');
+        var box = $('<div></div>').addClass('alert-info alert local_o365_statusmessage');
         box.append(opts.iconinfo);
         box.append('<span style="inline-block">'+content+'</span>');
         return box;
@@ -117,7 +117,7 @@ $.fn.azuresetup = function(options) {
      * @return object jQuery object representing rendered box.
      */
     this.rendersuccessbox = function(content) {
-        var box = $('<div></div>').addClass('alert-success local_o365_statusmessage');
+        var box = $('<div></div>').addClass('alert-success alert local_o365_statusmessage');
         box.append(opts.iconsuccess);
         box.append('<span style="inline-block">'+content+'</span>');
         return box;

diff --git a/local/o365/classes/adminsetting/azuresetup.php b/local/o365/classes/adminsetting/azuresetup.php
@@ -93,7 +93,7 @@ public function output_html($data, $query = '') {
         } else {
             $icon = $OUTPUT->pix_icon('i/warning', 'prerequisite not complete', 'moodle');
             $message = \html_writer::tag('span', get_string('settings_detectperms_nocreds', 'local_o365'));
-            $settinghtml .= \html_writer::tag('div', $icon.$message, ['class' => 'alert-info local_o365_statusmessage']);
+            $settinghtml .= \html_writer::tag('div', $icon.$message, ['class' => 'alert-info alert local_o365_statusmessage']);
         }
 
         // Using a <script> tag here instead of $PAGE->requires->js() because using $PAGE object loads file too late.

diff --git a/local/o365/classes/adminsetting/detectoidc.php b/local/o365/classes/adminsetting/detectoidc.php
@@ -96,13 +96,13 @@ public function output_html($data, $query='') {
             $message = \html_writer::tag('span', get_string('settings_detectoidc_credsvalid', 'local_o365'));
             $linkstr = get_string('settings_detectoidc_credsvalid_link', 'local_o365');
             $link = \html_writer::link($settingspage, $linkstr, ['style' => 'margin-left: 1rem']);
-            $html = \html_writer::tag('div', $icon.$message.$link, ['class' => 'alert-success local_o365_statusmessage']);
+            $html = \html_writer::tag('div', $icon.$message.$link, ['class' => 'alert-success alert local_o365_statusmessage']);
         } else {
             $icon = $OUTPUT->pix_icon('t/delete', 'success', 'moodle');
             $message = \html_writer::tag('span', get_string('settings_detectoidc_credsinvalid', 'local_o365'));
             $linkstr = get_string('settings_detectoidc_credsinvalid_link', 'local_o365');
             $link = \html_writer::link($settingspage, $linkstr, ['style' => 'margin-left: 1rem']);
-            $html = \html_writer::tag('div', $icon.$message.$link, ['class' => 'alert-error local_o365_statusmessage']);
+            $html = \html_writer::tag('div', $icon.$message.$link, ['class' => 'alert-error alert local_o365_statusmessage']);
         }
         return format_admin_setting($this, $this->visiblename, $html, $this->description, true, '', null, $query);
     }

diff --git a/local/o365/classes/adminsetting/serviceresource.php b/local/o365/classes/adminsetting/serviceresource.php
@@ -62,12 +62,12 @@ public function output_html($data, $query = '') {
                 $icon = $OUTPUT->pix_icon('t/check', 'valid', 'moodle');
                 $strvalid = get_string('settings_serviceresourceabstract_valid', 'local_o365', $this->visiblename);
                 $statusmessage = \html_writer::tag('span', $strvalid, ['class' => 'statusmessage']);
-                $settinghtml .= \html_writer::div($icon.$statusmessage, 'alert-success local_o365_statusmessage');
+                $settinghtml .= \html_writer::div($icon.$statusmessage, 'alert-success alert local_o365_statusmessage');
             } else {
                 $icon = $OUTPUT->pix_icon('i/warning', 'valid', 'moodle');
                 $strnocreds = get_string('settings_serviceresourceabstract_empty', 'local_o365');
                 $statusmessage = \html_writer::tag('span', $strnocreds, ['class' => 'statusmessage']);
-                $settinghtml .= \html_writer::div($icon.$statusmessage, 'alert-info local_o365_statusmessage');
+                $settinghtml .= \html_writer::div($icon.$statusmessage, 'alert-info alert local_o365_statusmessage');
             }
 
             // Using a <script> tag here instead of $PAGE->requires->js() because using $PAGE object loads file too late.
@@ -105,7 +105,7 @@ public function output_html($data, $query = '') {
             $icon = $OUTPUT->pix_icon('i/warning', 'valid', 'moodle');
             $strnocreds = get_string('settings_serviceresourceabstract_nocreds', 'local_o365');
             $statusmessage = \html_writer::tag('span', $strnocreds, ['class' => 'statusmessage']);
-            $settinghtml .= \html_writer::div($icon.$statusmessage, 'alert-info local_o365_statusmessage');
+            $settinghtml .= \html_writer::div($icon.$statusmessage, 'alert-info alert local_o365_statusmessage');
         }
 
         return format_admin_setting($this, $this->visiblename, $settinghtml, $this->description);

diff --git a/local/o365/classes/adminsetting/sharepointlink.php b/local/o365/classes/adminsetting/sharepointlink.php
@@ -122,15 +122,15 @@ public function output_html($data, $query = '') {
         $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         $icon = $OUTPUT->pix_icon('t/delete', 'problem', 'moodle');
         $message = \html_writer::tag('span', get_string('settings_sharepointlink_status_invalid', 'local_o365'));
-        $messageattrs = ['class' => 'adminsetting_sharepointlink_status siteinvalid alert-error'];
+        $messageattrs = ['class' => 'adminsetting_sharepointlink_status siteinvalid alert alert-error'];
         $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         $icon = $OUTPUT->pix_icon('i/warning', 'warning', 'moodle');
         $message = \html_writer::tag('span', get_string('settings_sharepointlink_status_notempty', 'local_o365'));
-        $messageattrs = ['class' => 'adminsetting_sharepointlink_status sitenotempty alert-info'];
+        $messageattrs = ['class' => 'adminsetting_sharepointlink_status sitenotempty alert alert-info'];
         $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         $icon = $OUTPUT->pix_icon('t/check', 'success', 'moodle');
         $message = \html_writer::tag('span', get_string('settings_sharepointlink_status_valid', 'local_o365'));
-        $messageattrs = ['class' => 'adminsetting_sharepointlink_status sitevalid alert-success'];
+        $messageattrs = ['class' => 'adminsetting_sharepointlink_status sitevalid alert alert-success'];
         $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         $settinghtml .= \html_writer::end_tag('div', []);
 
@@ -148,13 +148,13 @@ public function output_html($data, $query = '') {
         } else if ($sitesinitialized === '1') {
             $icon = $OUTPUT->pix_icon('t/check', 'success', 'moodle');
             $message = \html_writer::tag('span', get_string('settings_sharepointlink_connected', 'local_o365'));
-            $messageattrs = ['class' => 'adminsetting_sharepointlink_message alert-success'];
+            $messageattrs = ['class' => 'adminsetting_sharepointlink_message alert alert-success'];
             $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         } else {
             // Error reported.
             $icon = $OUTPUT->pix_icon('i/warning', 'error', 'moodle');
             $message = \html_writer::tag('span', get_string('settings_sharepointlink_error', 'local_o365'));
-            $messageattrs = ['class' => 'adminsetting_sharepointlink_message alert-error'];
+            $messageattrs = ['class' => 'adminsetting_sharepointlink_message alert alert-error'];
             $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         }
         $settinghtml .= \html_writer::end_tag('div', []);

diff --git a/local/o365/classes/adminsetting/systemapiuser.php b/local/o365/classes/adminsetting/systemapiuser.php
@@ -103,14 +103,14 @@ public function output_html($data, $query='') {
             $message = \html_writer::tag('span', get_string('settings_systemapiuser_userset', 'local_o365', $setuser)).' ';
             $linkstr = get_string('settings_systemapiuser_change', 'local_o365');
             $message .= \html_writer::link($setuserurl, $linkstr, ['class' => 'btn', 'style' => 'margin-left: 0.5rem']);
-            $messageattrs = ['class' => 'local_o365_statusmessage alert-success'];
+            $messageattrs = ['class' => 'local_o365_statusmessage alert alert-success'];
             $icon = $OUTPUT->pix_icon('t/check', 'success', 'moodle');
             $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         } else {
             $message = \html_writer::tag('span', get_string('settings_systemapiuser_usernotset', 'local_o365')).' ';
             $linkstr = get_string('settings_systemapiuser_setuser', 'local_o365');
             $message .= \html_writer::link($setuserurl, $linkstr, ['class' => 'btn', 'style' => 'margin-left: 0.5rem']);
-            $messageattrs = ['class' => 'local_o365_statusmessage alert-info'];
+            $messageattrs = ['class' => 'local_o365_statusmessage alert alert-info'];
             $icon = $OUTPUT->pix_icon('i/warning', 'warning', 'moodle');
             $settinghtml .= \html_writer::tag('div', $icon.$message, $messageattrs);
         }

diff --git a/local/o365/classes/page/acp.php b/local/o365/classes/page/acp.php
@@ -28,6 +28,14 @@
  */
 class acp extends base {
 
+    /**
+     * Add base navbar for this page.
+     */
+    protected function add_navbar() {
+        global $PAGE;
+        $PAGE->navbar->add($this->title, new \moodle_url('/admin/settings.php?section=local_o365'));
+    }
+
     /**
      * Set the system API user.
      */
@@ -54,9 +62,9 @@ public function mode_healthcheck() {
 
             echo '<h5>'.$healthcheck->get_name().'</h5>';
             if ($result['result'] === true) {
-                echo '<div class="alert-success">'.$result['message'].'</div>';
+                echo '<div class="alert alert-success">'.$result['message'].'</div>';
             } else {
-                echo '<div class="alert-error">';
+                echo '<div class="alert alert-error">';
                 echo $result['message'];
                 if (isset($result['fixlink'])) {
                     echo '<br /><br />'.\html_writer::link($result['fixlink'], get_string('healthcheck_fixlink', 'local_o365'));
@@ -170,7 +178,7 @@ public function mode_usermatch() {
         echo \html_writer::empty_tag('br');
         if (!empty($SESSION->o365matcherrors)) {
             foreach ($SESSION->o365matcherrors as $error) {
-                echo \html_writer::div($error, 'alert-error local_o365_statusmessage');
+                echo \html_writer::div($error, 'alert-error alert local_o365_statusmessage');
             }
             $SESSION->o365matcherrors = [];
         }
@@ -273,7 +281,7 @@ public function mode_usermatch() {
             echo \html_writer::end_tag('table');
             $matchqueue->close();
         } else {
-            $msgclasses = 'alert-info local_o365_statusmessage';
+            $msgclasses = 'alert-info alert local_o365_statusmessage';
             echo \html_writer::div(get_string('acp_usermatch_matchqueue_empty', 'local_o365'), $msgclasses);
         }
         $this->standard_footer();

diff --git a/local/o365/classes/page/base.php b/local/o365/classes/page/base.php
@@ -51,10 +51,18 @@ public function __construct($url, $title, $context = null) {
         $PAGE->set_url($this->url);
         $PAGE->set_context($this->context);
         $PAGE->set_pagelayout('standard');
-        $PAGE->navbar->add($this->title, $this->url);
+        $this->add_navbar();
         $PAGE->set_title($this->title);
     }
 
+    /**
+     * Add base navbar for this page.
+     */
+    protected function add_navbar() {
+        global $PAGE;
+        $PAGE->navbar->add($this->title, $this->url);
+    }
+
     /**
      * Hook function run before the main page mode.
      *

diff --git a/local/o365/sass/styles.scss b/local/o365/sass/styles.scss
@@ -1,6 +1,7 @@
 .local_o365_statusmessage {
-    margin: 0.25rem 0;
-    padding: 0.5rem;
+    &.alert {
+        margin-bottom: 0.25rem;
+    }
     img {
         margin-right: 0.25rem;
     }

diff --git a/local/o365/styles.css b/local/o365/styles.css
@@ -1,10 +1,9 @@
-.local_o365_statusmessage {
-  margin: 0.25rem 0;
-  padding: 0.5rem; }
-  .local_o365_statusmessage img {
-    margin-right: 0.25rem; }
-  .local_o365_statusmessage span, .local_o365_statusmessage a {
-    vertical-align: middle; }
+.local_o365_statusmessage.alert {
+  margin-bottom: 0.25rem; }
+.local_o365_statusmessage img {
+  margin-right: 0.25rem; }
+.local_o365_statusmessage span, .local_o365_statusmessage a {
+  vertical-align: middle; }
 
 .adminsetting_sharepointlink_message, .adminsetting_sharepointlink_status {
   margin: 0 0 0.5rem 0;