mumuki-laboratory 7.10.5 → 7.11.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 14e1de394e31aa3018f8d66df21561874095da64afdfb255a6fcef6189568695
-  data.tar.gz: 91c9503ff88706237d9e32e0fd1ab22b8f6ba571f47d10e54b01e46ab7a66e35
+  metadata.gz: d0c77cebf0a256067e6efb7ddedae850ca3814d7b725e6cefeb97d5e6c3138eb
+  data.tar.gz: 615167b22bf23364403a9cf08d5145d82016cc5bbec63105597e9336e237a021
 SHA512:
-  metadata.gz: 177dca452ef3b4a6f64eb117559eac3509ffefdf09c2c7e6fc4a85ecb0500f710d9bfbc15e30756a4288f87eac81c01befadc5d201de9b7ae73a0ca8f8f4b06b
-  data.tar.gz: 6823c871a44ffd808592b3bfc407081784c0df77ea2062acabb9e2e6b70be87d97cb8d84c47d1de7a1b00abcaf9a14e7c9b446a55a9dfaff74af83714dac72b3
+  metadata.gz: 20880cefe1e04d4211805e23fb59c3601747ad5e7d6136ac3dcf0128fe8b7fcda7e83444fb8a7029857bb9d092a456141a9c5a29e932995cb824a6f6fd9ee53a
+  data.tar.gz: 315d127e5cec996dacae62360c427391ae46a20a59d7f403eef164f030ddf78a5854a93eb2fe11362851f8558136d88b327982b1e4ffb80cf377e18337b8c15c

data/README.md

@@ -132,16 +132,35 @@ rails s
 ## Running tests
 
 ```bash
-bundle exec rspec
+# Run all tests
+bundle exec rake
+
+# Run only web tests (i.e. Capybara and Teaspoon)
+bundle exec rake spec:web
+```
+
+## Running Capybara tests with Selenium
+
+The Capybara config of this project supports running tests on Firefox, Chrome and Safari via Selenium. The [`webdrivers`](https://github.com/titusfortner/webdrivers) gem automatically installs (and updates) all the necessary Selenium webdrivers.
+
+By default, Capybara tests will run with the default dummy-driver (Rack test). If you want to run on a real browser, you should set `MUMUKI_SELENIUM_DRIVER` variable to `firefox`, `chrome` or `safari`. Also, a Rake task to run just the Capybara tests is available.
+
+Some examples:
+
+```bash
+# Run web tests, using Firefox
+MUMUKI_SELENIUM_DRIVER=firefox bundle exec rake spec:web
+
+# Run Capybara tests on Chrome
+MUMUKI_SELENIUM_DRIVER=chrome bundle exec rake spec:web:capybara
 ```
 
 ## Running JS tests
 
-> You need first to download [geckodriver](https://github.com/mozilla/geckodriver/releases/download/v0.27.0/geckodriver-v0.27.0-linux64.tar.gz), uncrompress
-> it and add it to your path
+The [`webdrivers`](https://github.com/titusfortner/webdrivers) gem also works with Teaspoon, no need to install anything manually. By default tests run on Firefox, but this behavior can be changed by setting `MUMUKI_SELENIUM_DRIVER` (see section above).
 
 ```bash
-MOZ_HEADLESS=1 bundle exec rake teaspoon
+bundle exec rake spec:web:teaspoon
 ```
 
 ## Running `eslint`
@@ -278,7 +297,8 @@ which are granted to be safe and stable.
   "status": "passed|passed_with_warnings|failed",
   "guide_finished_by_solution": "boolean",
   "html": "string",
-  "remaining_attempts_html": "string" ,
+  "remaining_attempts_html": "string",
+  "current_exp": "integer",
   "title_html": "string",                         // kids-only
   "button_html": "string",                        // kids-only
   "expectations": [                               // kids-only

data/Rakefile

@@ -25,7 +25,7 @@ require 'rspec/core'
 require 'rspec/core/rake_task'
 
 desc "Run all specs in spec directory (excluding plugin specs)"
-RSpec::Core::RakeTask.new(:spec => 'app:db:test:prepare')
+RSpec::Core::RakeTask.new
 
 desc "Force development environment, required by javascript specs"
 task :development do
@@ -33,8 +33,15 @@ task :development do
   ENV['RAILS_ENV'] = 'development'
 end
 
+RSpec::Core::RakeTask.new('spec:web:capybara') do |t|
+  t.pattern = 'spec/features/*_spec.rb'
+end
+
 desc "Run the javascript specs"
-task teaspoon: [:development, "app:teaspoon"]
+task 'spec:web:teaspoon': [:development, "app:teaspoon"]
+
+desc "Run all the web-related tests"
+task 'spec:web': ['spec:web:capybara', 'spec:web:teaspoon']
 
 task default: :spec
 

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

@@ -22,11 +22,32 @@
  */
 
 /**
- * @typedef {{
- *  "solution[content]"?:string,
- *  solution?: Solution,
- *  client_result?: SubmissionClientResult
- * }} Submission
+ * Contents of a submission expressed in the form of params
+ * generated and accepted by laboratory HTTP Controllers
+ *
+ * @typedef {{"solution[content]":string}} ClassicContents
+ */
+
+/**
+ * Contents of a submission expressed as an object
+ * that are created programatically
+ *
+ * @typedef {{solution: Solution}} ProgramaticContents
+ */
+
+/**
+ * Contents of a multifile submission expressed as dictionary of keys in the form
+ * `solution[content[the-filename-goes-here]]`
+ *
+ * @typedef {object} MutifileContents
+ */
+
+/**
+ * @typedef {ClassicContents|ProgramaticContents|MutifileContents} Contents
+ */
+
+/**
+ * @typedef {Contents & {client_result?: SubmissionClientResult}} Submission
  */
 
 /**

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

@@ -0,0 +1,85 @@
+mumuki.gamification = (() => {
+  class Formula {
+    static get QUADRATIC_COEFFICIENT()  { return 25; }
+    static get LINEAR_COEFFICIENT()     { return 100; }
+    static get CONSTANT_TERM()          { return -125; }
+  }
+
+  class LevelProgression {
+    constructor(currentExp) {
+      this.currentExp = currentExp;
+    }
+
+    expToLevelUp() {
+      return this.baseExpNextLevel() - this.currentExp;
+    }
+
+    baseExpNextLevel() {
+      return this.expFor(this.currentLevel() + 1);
+    }
+
+    expFor(level) {
+      const ax2 = Formula.QUADRATIC_COEFFICIENT * Math.pow(level, 2);
+      const bx = Formula.LINEAR_COEFFICIENT * level;
+      const c = Formula.CONSTANT_TERM;
+
+      return ax2 + bx + c;
+    }
+
+    currentLevel() {
+      return this.levelFor(this.currentExp);
+    }
+
+    levelFor(exp) {
+      const a = Formula.QUADRATIC_COEFFICIENT;
+      const b = Formula.LINEAR_COEFFICIENT;
+      const c = Formula.CONSTANT_TERM;
+
+      return Math.floor((-b + Math.sqrt(Math.pow(b, 2) - 4 * a * (c - exp))) / (2 * a));
+    }
+
+    triggersLevelChange(exp) {
+      return this.levelFor(exp) !== this.currentLevel();
+    }
+
+    currentLevelProgress() {
+      return (this.currentExp - this.baseExpCurrentLevel()) / (this.baseExpNextLevel() - this.baseExpCurrentLevel());
+    }
+
+    baseExpCurrentLevel() {
+      return this.expFor(this.currentLevel());
+    }
+
+    setExpMessage(exp) {
+      let expGained = exp - this.currentExp;
+
+      if (expGained > 0) {
+        this.currentExp = exp;
+        $('#mu-exp-points').html(expGained);
+        $('#mu-level-number').html(this.currentLevel());
+      }
+    }
+  }
+
+  function _setUpCurrentLevelProgression() {
+    mumuki.gamification._currentLevelProgression = new LevelProgression(currentExp());
+  }
+
+  function currentExp() {
+    return $('#mu-current-exp').val();
+  }
+
+  return {
+    Formula,
+    LevelProgression,
+
+    _setUpCurrentLevelProgression,
+
+    /** @type {LevelProgression} */
+    _currentLevelProgression: null
+  };
+})();
+
+mumuki.load(() => {
+  mumuki.gamification._setUpCurrentLevelProgression();
+});

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

@@ -1,12 +1,13 @@
 mumuki.load(function() {
   let $userForm = $("#mu-user-form");
   let $userAvatar = $('#mu-user-avatar');
-  let $editButton = $('#mu-edit-profile-btn');
+  let $editButton = $('.mu-edit-profile-btn');
   let $avatarPicker = $('#mu-avatar-picker');
-  let $avatarItem = $('.mu-avatar-item');
+  let $avatarItem = $('.mu-avatar-item:not(.mu-locked)');
 
   let userImage = "";
   let avatarId = "";
+  let avatarType = "";
 
   let originalData = $userForm.serialize();
   let originalProfilePicture = $userAvatar.attr('src');
@@ -15,14 +16,18 @@ mumuki.load(function() {
     toggleEditButtonIfThereAreChanges();
   });
 
-  $avatarItem.on('click', function() {
-    $userAvatar.attr('src', $(this).attr('src'));
-    $avatarPicker.modal('hide');
+  $avatarItem.on('keypress click', function(e) {
+    onClickOrSpacebarOrEnter($(this), e, function() {
+      $userAvatar.attr('src', $(this).attr('src'));
+      $avatarPicker.modal('hide');
 
-    const clickedAvatarId = $(this).attr('mu-avatar-id');
-    avatarId = clickedAvatarId || "";
+      const clickedAvatarId = $(this).attr('mu-avatar-id');
+      const clickedAvatarType = $(this).attr('type');
+      avatarId = clickedAvatarId || "";
+      avatarType = clickedAvatarType || "";
 
-    toggleEditButtonIfThereAreChanges();
+      toggleEditButtonIfThereAreChanges();
+    });
   });
 
   function toggleEditButtonIfThereAreChanges() {
@@ -41,18 +46,20 @@ mumuki.load(function() {
 
   const avatarChanged = () => $userAvatar.attr('src') !== originalProfilePicture;
 
-  $('#mu-user-image').on('click', function(){
-    userImage = $userAvatar.attr('src');
+  $('#mu-user-image').on('keypress click', function(e){
+    onClickOrSpacebarOrEnter($(this), e, function() {
+      userImage = $userAvatar.attr('src');
+    });
   });
 
   $userForm.on('submit', function(){
     if (userImage) {
       setImageUrl($(this), userImage);
-      setAvatarId($(this), "");
+      setAvatarIdAndType($(this), "", "");
     }
 
     if (avatarId) {
-      setAvatarId($(this), avatarId);
+      setAvatarIdAndType($(this), avatarId, avatarType);
     }
   });
 
@@ -60,12 +67,20 @@ mumuki.load(function() {
     form.append(`<input type="hidden" name="user[image_url]" value="${url}"/>`);
   }
 
-  function setAvatarId(form, id) {
-    form.append(`<input type="hidden" name="user[avatar_id]" value=${id}/>`);
+  function setAvatarIdAndType(form, id, type) {
+    form.append(`<input type="hidden" name="user[avatar_id]" value="${id}"/>`);
+    form.append(`<input type="hidden" name="user[avatar_type]" value="${type}"/>`);
   }
 
-  $("#mu-edit-avatar-icon").on('click', function(){
-    $avatarPicker.modal();
+  $("#mu-edit-avatar-icon").on('keypress click', function(e) {
+    onClickOrSpacebarOrEnter($(this), e, function() {
+      $avatarPicker.modal();
+    });
   });
 
+  function onClickOrSpacebarOrEnter(element, e, func) {
+    if (e.which === 13 || e.which === 32 || e.type === 'click') {
+      func.apply(element);
+    }
+  }
 });

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

@@ -26,6 +26,7 @@ mumuki.submission = (() => {
       this.submissionsResultsArea.html(data.html);
       data.status === 'aborted' ? this.error(submitButton) : submitButton.enable();
       mumuki.updateProgressBarAndShowModal(data);
+      mumuki.gamification._currentLevelProgression.setExpMessage(data.current_exp);
     }
     error(submitButton) {
       this.submissionsResultsArea.html('');

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

@@ -53,7 +53,7 @@ mumuki.SubmissionsStore = (() => {
     }
 
      /**
-     * Extract the submission's solution content
+     * Extract the submission's solution content, expressed as a string
      *
      * @param {Submission} submission
      * @returns {string}
@@ -61,8 +61,13 @@ mumuki.SubmissionsStore = (() => {
     submissionSolutionContent(submission) {
       if (submission.solution) {
         return submission.solution.content;
-      } else {
+      } else if (submission['solution[content]'] !== undefined) {
         return submission['solution[content]'];
+      } else {
+        return JSON.stringify(
+          Object
+            .entries(submission)
+            .filter(([key, _]) => key.startsWith('solution[content[')));
       }
     }
 

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

@@ -13,9 +13,7 @@
       margin: 30px auto;
       max-height: 350px;
       &.error-code-img {
-        margin-top: -80px;
-        margin-left: 0;
-        margin-bottom: 0;
+        margin: 0;
         min-height: 310px;
         max-height: 500px;
         width: calc(100%);

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

@@ -1,9 +1,9 @@
 @import "modules/avatar";
 @import "modules/book_header";
 @import "modules/breadcrumb";
-@import "modules/chapter_show";
 @import "modules/checkboxes";
 @import "modules/console";
+@import "modules/content_show";
 @import "modules/datepicker";
 @import "modules/discussion";
 @import "modules/dropdown";
@@ -17,6 +17,7 @@
 @import "modules/kids";
 @import "modules/kindergarten";
 @import "modules/kids_results";
+@import "modules/medal";
 @import "modules/modal";
 @import "modules/organization_chooser";
 @import "modules/overlap";

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

@@ -12,6 +12,16 @@
   position: relative;
   top: 100px;
   right: 15px;
+
+  &:hover {
+    outline: none;
+    opacity: 0.5;
+  }
+
+  &:focus {
+    outline: none;
+    opacity: 0.5;
+  }
 }
 
 .mu-avatar-list {
@@ -38,4 +48,15 @@
     box-shadow: -3px 3px 10px -3px $mu-color-primary;
     transform: scale(1.025);
   }
+
+  &:focus {
+    outline: none;
+    box-shadow: -3px 3px 10px -3px $mu-color-primary;
+    transform: scale(1.025);
+  }
+  
+  &.mu-locked {
+    filter: grayscale(100%);
+    cursor: default;
+  }
 }

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

@@ -0,0 +1,48 @@
+.mu-medal {
+  &.outline {
+    position: absolute;
+
+    &.content {
+      height: 75px;
+
+      margin-left: 10px;
+    }
+
+    &.corollary {
+      height: 150px;
+
+      margin-left: auto;
+      margin-right: auto;
+      left: 0;
+      right: 0;
+    }
+  }
+
+  &.inlay {
+    position: relative;
+    border-radius: 50%;
+
+    &.content {
+      height: 55px;
+
+      left: 20px;
+      top: 17px;
+
+      margin-right: 30px;
+      margin-bottom: 15px;
+    }
+
+    &.corollary {
+      height: 107px;
+
+      display: block;
+      top: 35px;
+
+      margin: 0 auto 20px;
+    }
+  }
+
+  &.unacquired {
+    filter: grayscale(100%);
+  }
+}