mumuki-laboratory 8.6.1 → 9.0.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 824e346e9d3113f3b3d48c8ed7e23c846e26a54fb5ed7e4c4bb5a9307323b4d7
-  data.tar.gz: e28b9bdf65007abda370a36b760adeaf7989ab9e4c94c52ebaa09bcd3f14fb79
+  metadata.gz: c79de66ab1c8248e5715cd1e54ac8e4b1e426fb26bc0a69b35539ba19eb954da
+  data.tar.gz: 39cbfb28e86a6ae64f5a1164731d472ca65be3bec82d9f1ed6f159273512b078
 SHA512:
-  metadata.gz: 46a32c31bb80eca3fa50fc45c37875a36894cf3fbc2192f339c138763afeac44a811ab336650460a7e7f150323601d92cab90c91e967668916462d21026eb72a
-  data.tar.gz: c9ecc5bd9523a72129d3914317fa29c596038b99f3733de72fc71c27b5c1be3295d9f79ddff39d3cf39c8cfb22bd873581442c4c9121680cdd68901990a11b54
+  metadata.gz: ed9430f79c8f92f7b02264aa84f7dc757a7ff05915fcdd17e93a5fe4b7aaac5cfd0d87fadec66ce0d4ac204cd270f08fafc1550a986bd367314f5e7130c360d4
+  data.tar.gz: 8669d687ca7f70178cab77c25f698eef49a58eb74957ed274c73fe6fdf0c6f9139c5963f5c57b08a92ed874a97c6b648030c1be87cd34b107cb831db156e0113

data/app/assets/javascripts/mumuki_laboratory/application/certificate.js

@@ -0,0 +1,17 @@
+mumuki.load(() => {
+  scaleCertificate();
+  mumuki.resize(scaleCertificate);
+
+  function scaleCertificate() {
+    const $certPreview = $('.certificate-preview');
+    const $muCertificate = $('.mu-certificate-box');
+    $muCertificate.css('transform', 'scale(1)');
+
+    const scaleWidth = $muCertificate.width() / $certPreview.width();
+    $muCertificate.css({
+      'transform': `scale(${1 / scaleWidth})`,
+      'transform-origin': `0 0`,
+    });
+    $certPreview.height($muCertificate.height());
+  }
+});

data/app/assets/javascripts/mumuki_laboratory/application/faqs.js

@@ -0,0 +1,90 @@
+mumuki.faqs = class {
+
+  constructor() {
+    this.faqs = $('.mu-faqs');
+    this.topHierarchyElem = "H2";
+  }
+
+  // ================
+  // == Public API ==
+  // ================
+
+  /**
+   * Actually setup the faqs page
+   */
+  load() {
+    if(!this.faqs) return;
+    this._createFaqsGroups();
+    this._createNavbar();
+  }
+
+  // =================
+  // == Private API ==
+  // =================
+
+  _createNavbar() {
+    const $faqsNavbar = $(".mu-faqs-navbar nav ul");
+    $('.mu-faqs-group').each((_index, faqGroup) => {
+      const $navItem = this._createNavbarItem($faqsNavbar, faqGroup)
+      const $faqGroup = $(faqGroup);
+      this._configureClickFor($navItem, $faqGroup, $faqsNavbar)
+    });
+  }
+
+  _createNavbarItem($faqsNavbar, faqGroup) {
+    const $navItem = $(`<li><a href="#${faqGroup.id}">`)
+      .html(`${faqGroup.querySelector('h2').textContent}`);
+    $faqsNavbar.append($navItem);
+    return $navItem;
+  }
+
+  _configureClickFor($navItem, $faqGroup, $faqsNavbar) {
+    $navItem.click(function(e){
+      e.preventDefault();
+      $faqsNavbar.find('li').removeClass('active');
+      $navItem.addClass('active');
+      $('html, body').animate({scrollTop: $faqGroup.offset().top}, 1000);
+    });
+  }
+
+  _createFaqsGroups() {
+    const elemsGroups = this._buildFaqsGroups();
+    elemsGroups.forEach((group, index) => {
+      $(group).wrapAll(`<div class='mu-faqs-group' id='mu-faqs-group-${index}'>`);
+    });
+    this._createFaqsIcons();
+  }
+
+  _createFaqsIcons() {
+    const $faqIcon = $('<i class="mu-faqs-group-icon fa fa-plus">');
+    $faqIcon.click(function(e){
+      const $elem = $(this);
+      $elem.toggleClass('fa-plus fa-minus');
+      $elem.closest('.mu-faqs-group').toggleClass('active');
+    })
+    $('.mu-faqs-group').prepend($faqIcon);
+  }
+
+  _buildFaqsGroups() {
+    let newGroup = [];
+    let elemsGroups = [];
+    let previousNodeName;
+    $(".mu-faqs-content").children().each((index, elem) => {
+      if(elem.nodeName === this.topHierarchyElem && newGroup.length) {
+        elemsGroups.push(newGroup);
+        newGroup = [];
+      }
+      newGroup.push(elem);
+      previousNodeName = elem.nodeName
+    });
+
+    elemsGroups.push(newGroup);
+
+    return elemsGroups;
+  }
+
+};
+
+mumuki.load(() => {
+  new mumuki.faqs().load();
+});

data/app/assets/javascripts/mumuki_laboratory/application/organization.js

@@ -0,0 +1,32 @@
+ mumuki.organization = {
+
+  /**
+   * The current organization's id
+   *
+   * @type {number?}
+   * */
+  _id: null,
+
+  /**
+   * The current organization's id
+   *
+   * @type {number?}
+   * */
+  get id() {
+    return this._id;
+  },
+
+  /**
+   * Set global current organization information
+   */
+  load() {
+    const $muOrganizationId = $('#mu-organization-id');
+    if ($muOrganizationId.length) {
+      this._id = $muOrganizationId.val();
+    } else {
+      this._id = null;
+    }
+  }
+};
+
+mumuki.load(() => mumuki.organization.load());

data/app/assets/javascripts/mumuki_laboratory/application/submissions-store.js

@@ -94,7 +94,7 @@ mumuki.SubmissionsStore = (() => {
     }
 
     _keyFor(exerciseId) {
-      return `/exercise/${exerciseId}/submission`;
+      return `/organization/${mumuki.organization.id}/user/${mumuki.user.id}/exercise/${exerciseId}/submission`;
     }
   }();
 

data/app/assets/javascripts/mumuki_laboratory/application/user.js

@@ -1,9 +1,53 @@
+ mumuki.user = {
+
+  /**
+   * The current user's id
+   *
+   * @type {number?}
+   * */
+  _id: null,
+
+  /**
+   * The current user's id
+   *
+   * @type {number?}
+   * */
+  get id() {
+    return this._id;
+  },
+
+  /**
+   * Set global current user information
+   */
+  load() {
+    const $muUserId = $('#mu-user-id');
+    if ($muUserId.length) {
+      this._id = $muUserId.val();
+    } else {
+      this._id = null;
+    }
+  }
+};
+
 mumuki.load(() => {
-  var hash = document.location.hash;
-  if (hash) {
-    $(".nav-tabs a[data-target='" + hash + "']").tab('show');
+  const $userMenuHeader = $('.mu-user-menu-header');
+  let onUserProfile = document.querySelector('.mu-profile-info') !== null;
+
+  $userMenuHeader.click(() => {
+    $('.mu-user-menu-items').toggleClass('hidden-sm-screen');
+    $('#mu-user-menu-header-icon').toggleClass('fa-chevron-up fa-chevron-down');
+  });
+
+  if (onUserProfile) {
+    $userMenuHeader.click();
   }
-  $('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
-    window.location.hash = $(e.target).attr('data-target');
+
+  $('.mu-user-menu-item .active').click((e) => {
+    if (onUserProfile) {
+      e.preventDefault();
+      $userMenuHeader.click();
+    }
   });
+
+  mumuki.user.load()
 });

data/app/assets/stylesheets/mumuki_laboratory/application/_layout.scss

@@ -122,6 +122,9 @@ hr {
 
 /* TODO: move to mumuki-styles */
 .mu-inline-block-left {
+  display: flex;
+  align-items: center;
+
   margin-left: 15px;
 }
 

data/app/assets/stylesheets/mumuki_laboratory/application/_modules.scss

@@ -1,6 +1,7 @@
 @import "modules/avatar";
 @import "modules/book_header";
 @import "modules/breadcrumb";
+@import "modules/certificate";
 @import "modules/checkboxes";
 @import "modules/console";
 @import "modules/content_show";
@@ -10,6 +11,7 @@
 @import "modules/editor";
 @import "modules/exercise_assignment";
 @import "modules/exercise_results";
+@import "modules/faqs";
 @import "modules/flash";
 @import "modules/gs-board";
 @import "modules/guide_corollary";
@@ -27,4 +29,5 @@
 @import "modules/terms";
 @import "modules/timer";
 @import "modules/upload";
+@import "modules/user_menu";
 @import "modules/user_profile";

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_certificate.scss

@@ -0,0 +1,33 @@
+.mu-certificate {
+  border: 1px solid $mu-color-dark-separator;
+}
+
+.mu-certificate-name {
+  margin-top: 0;
+  margin-bottom: 1em;
+}
+
+.mu-certificate-data {
+  margin-top: 30px;
+}
+
+.mu-certificate-buttons {
+  margin-bottom: 30px;
+}
+
+.mu-certificate-download-btn {
+  height: 35px;
+  padding: 0;
+  width: 157px;
+  border: none;
+}
+.mu-certificate-download-btn-icon {
+  border-right: 1px solid darken($mu-color-complementary, 10%);
+  padding: 8px 6px 9px 6px;
+  width: 35px;
+}
+.mu-certificate-download-btn-text {
+  display: inline-block;
+  width: 115px;
+  text-align: center;
+}

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_content_show.scss

@@ -1,3 +1,16 @@
-.chapter-description {
-  display: inline-block;
+.mu-chapter-description p {
+  display: inline-block
+}
+
+.mu-content-title-icons {
+  display: flex;
+  align-items: center;
+
+  font-size: 150%;
+  margin-left: 15px;
+  margin-right: 15px;
+
+  i {
+    margin-left: 5px;
+  }
 }

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_faqs.scss

@@ -0,0 +1,84 @@
+.mu-faqs-container {
+  position: relative;
+  display: table;
+  width: 100%;
+
+  .mu-faqs-content {
+    padding-top: 50px;
+
+    width: 100%;
+
+    @media (min-width: 768px) {
+      width: 75%;
+      float: right;
+    }
+
+    .mu-faqs-group {
+      padding: 32px;
+      box-shadow: 0 0.375em 2.8125em 0 #d2d5d9;
+      margin-bottom: 32px;
+
+      @media (max-width: 767px) {
+        &:not(.active) {
+          h3, p {
+            display: none
+          }
+          h2 {
+            margin-bottom: 0px;
+          }
+        }
+      }
+
+      h2 {
+        margin-top: 0;
+        margin-bottom: 20px;
+      }
+
+      h3 {
+        color: #1A94A3; // should be $brand-secondary
+        margin-top: 40px;
+      }
+
+      .mu-faqs-group-icon {
+        float: right;
+        margin-top: 10px;
+        cursor: pointer;
+        display: none;
+        @media (max-width: 767px) {
+          display: unset;
+        }
+      }
+    }
+  }
+
+  .mu-faqs-navbar {
+    top: 0;
+    position: sticky;
+    width: 25%;
+    padding-top: 50px;
+
+    ul {
+      border-left: 1px solid $mu-color-disabled;
+      list-style: none;
+      padding-left: 0px;
+      li {
+        padding: 8px 10px 8px 15px;
+        cursor: pointer;
+        &.active {
+          border-left: 3px solid transparent;
+          border-color: darken($brand-primary, 5%);
+          margin-left: -3px;
+        }
+        a {
+          color: $brand-primary;
+          &:hover {
+            text-decoration: none;
+          }
+          @media (min-width: $container-lg) {
+            font-size: 1.1em;
+          }
+        }
+      }
+    }
+  }
+}

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_medal.scss

@@ -28,7 +28,7 @@
       left: 20px;
       top: 17px;
 
-      margin-right: 30px;
+      margin-right: 40px;
       margin-bottom: 15px;
     }
 

data/app/assets/stylesheets/mumuki_laboratory/application/modules/_user_menu.scss

@@ -0,0 +1,63 @@
+.mu-user-menu {
+  display: flex;
+  margin-top: 25px;
+}
+
+.mu-user-menu-content {
+  flex-grow: 1;
+}
+
+.mu-user-menu-header {
+  font-size: 15px;
+  color: $mu-color-disabled;
+  text-transform: uppercase;
+  padding-left: 2px;
+  cursor: pointer;
+
+  @media only screen and (min-width: $screen-md-min) {
+    padding-left: 15px;
+    cursor: auto;
+
+    i {
+      display: none;
+    }
+
+    span {
+      padding-left: 0px;
+    }
+  }
+}
+
+.mu-user-menu-items {
+  margin-top: 30px;
+
+  &.hidden-sm-screen {
+    @media only screen and (max-width: $screen-sm-max) {
+      display: none;
+    }
+  }
+}
+
+.mu-user-menu-item {
+  font-size: 17px;
+  margin-bottom: 5px;
+
+  a {
+    color: $brand-primary;
+    &.active {
+      font-weight: bold;
+    }
+  }
+}
+
+.mu-user-menu-divider {
+  &.vertical {
+    border-left: 2px solid $mu-color-separator;
+  }
+
+  &.horizontal {
+    border-top: 2px solid $mu-color-separator;
+
+    margin: 25px 0;
+  }
+}