mumuki-laboratory 7.12.1 → 8.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e025a36f6aa947e6a39b8372e2a0f257d473143a9c5bef32575885fcf375312b
-  data.tar.gz: 81428a5522e48781ed29cde5b8f2c219f3388a8d36e1ae466f91ee412e69b246
+  metadata.gz: d366cf0d6d349759281213746e2c6a6f1a998db2d07efa9dc45b02480487108e
+  data.tar.gz: 0c890e15fa8b8f3164372b7c8f6844b17e85ded1686bb1c4d0947d9a08b7cd6a
 SHA512:
-  metadata.gz: 374aec02893b3e31880b6bb3bbaf1031e0c2b567ee1b25b8d03bb7a30bda810aa72f5ff9974d70cab6637cede23a8e734e95ec5e9a1357d14772300e64a0fc6f
-  data.tar.gz: 70637e35aa57f98661f78f787a15e181ed4737d4b1d3080adcf06e90f4564e5cec9b642055106cccf6ae29fbaa90b1695367c7ac424c89b225166f80ab007557
+  metadata.gz: 4ff7d88d695024cbd9feac650c31b77055291f280791b262ddf6c6477f54a2e7ef0d858bbe4668594e88b755dd5ab1934ac7b8acc045acf02360ddae9dca8d7f
+  data.tar.gz: 555cfdee07fa9e97d62507360fda991dfd6bf16668093d6af44ab6f6ee79dcf22ab57aaf08d49a2e434767bd3a7dadfb8316321b22d3efa0e0b0f19f5ad7c1e0

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

@@ -113,7 +113,7 @@ mumuki.bridge = (() => {
      * @returns {SubmissionResult}
      */
     _preRenderResult(result) {
-      result.class_for_progress_list_item = mumuki.renderers.progressListItemClassForStatus(result.status, true)
+      result.class_for_progress_list_item = mumuki.renderers.progressListItemClassForStatus(result.status, true);
       return result;
     }
   }

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

@@ -36,7 +36,7 @@ mumuki.Button = class {
       e.preventDefault();
       main();
     };
-    this.$button.on('click', this.main)
+    this.$button.on('click', this.main);
   }
 
   // ==============
@@ -80,7 +80,7 @@ mumuki.Button = class {
 
     this.enable();
 
-    this.$button.on('click', this.main)
+    this.$button.on('click', this.main);
   }
 
   // =============

data/app/assets/javascripts/mumuki_laboratory/application/codemirror-builder.js

@@ -38,7 +38,7 @@
             mumuki.editor.toggleFullscreen();
           },
           'Tab': function (cm) {
-            mumuki.editor.indentWithSpaces(cm)
+            mumuki.editor.indentWithSpaces(cm);
           }
         }
       });
@@ -53,7 +53,7 @@
           'Cmd-Enter': submitMessage,
           'Ctrl-Enter': submitMessage,
           'Tab': function (cm) {
-            mumuki.editor.indentWithSpaces(cm)
+            mumuki.editor.indentWithSpaces(cm);
           }
         }
       });

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

@@ -23,14 +23,14 @@ mumuki.page.editors = [];
   function resetEditor() {
     mumuki.page.dynamicEditors.forEach(function (e) {
       setDefaultContent(e, $('#default_content').val());
-    })
+    });
   }
 
   function formatContent() {
     mumuki.page.editors.each(function (_, editor) {
-      editor.setSelection({line: 0, ch: 0}, {line: editor.lineCount()})
-      editor.indentSelection("smart")
-      editor.setSelection({line: 0})
+      editor.setSelection({line: 0, ch: 0}, {line: editor.lineCount()});
+      editor.indentSelection("smart");
+      editor.setSelection({line: 0});
     });
   }
 
@@ -56,7 +56,7 @@ mumuki.page.editors = [];
     if (language !== undefined) {
       mumuki.page.dynamicEditors.forEach(function (e) {
         setEditorLanguage(e, language);
-      })
+      });
     }
   }
 

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

@@ -32,7 +32,7 @@
   function clearConsole() {
     $('.jquery-console-message-error').remove();
     $('.jquery-console-message-value').remove();
-    $('.jquery-console-prompt-box:not(:last)').remove()
+    $('.jquery-console-prompt-box:not(:last)').remove();
   }
 
   class QueryConsole {
@@ -134,7 +134,7 @@
         url: self._requestUrl,
         type: 'POST',
         data: self._requestData
-      })
+      });
     }
     get _requestUrl() {
       return this.console.endpoint;

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

@@ -34,33 +34,33 @@ mumuki.load(() => {
     },
     token: new mumuki.CsrfToken(),
     tokenRequest: function (data) {
-      return $.ajax(Forum.token.newRequest(data))
+      return $.ajax(Forum.token.newRequest(data));
     },
     discussionPost: function (url) {
       return Forum.tokenRequest({
         url: url,
         method: 'POST',
         xhrFields: {withCredentials: true}
-      })
+      });
     },
     discussionSubscription: function (url) {
-      Forum.discussionPostAndToggle(url, $subscriptionSpans)
+      Forum.discussionPostAndToggle(url, $subscriptionSpans);
     },
     discussionUpvote: function (url) {
-      Forum.discussionPostAndToggle(url, $upvoteSpans)
+      Forum.discussionPostAndToggle(url, $upvoteSpans);
     },
     discussionPostAndToggle: function (url, elem) {
-      Forum.discussionPost(url).done(Forum.toggleButton(elem))
+      Forum.discussionPost(url).done(Forum.toggleButton(elem));
     },
     discussionMessageToggleApprove: function (url, elem) {
       Forum.discussionPost(url).done(function () {
         elem.toggleClass("selected");
-      })
+      });
     },
     discussionMessageToggleNotActuallyAQuestion: function (url, elem) {
       Forum.discussionPost(url).done(function () {
         elem.toggleClass("selected");
-      })
+      });
     },
     discussionsToggleCheckbox: function (elem) {
       const key = elem.attr('name');

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

@@ -99,6 +99,6 @@ mumuki.editors = {
    * @param {CustomEditorSource} source
    */
   addCustomSource(source) {
-    mumuki.CustomEditor.addSource(source)
+    mumuki.CustomEditor.addSource(source);
   }
 };

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

@@ -21,7 +21,7 @@ mumuki.elipsis = (() => {
     $elipsis.each((it, e) =>  {
       let $e = $(e);
       $e.html(mumuki.elipsis($e.html()));
-    })
+    });
   };
 
   mumuki.load(() => {

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

@@ -34,7 +34,7 @@ mumuki.events = {
    */
   fire(eventName, value = null) {
     if (this._handlers[eventName]) {
-      this._handlers[eventName].forEach(it => it(value))
+      this._handlers[eventName].forEach(it => it(value));
     }
   },
 
@@ -48,4 +48,4 @@ mumuki.events = {
       this._handlers[eventName] = [];
     }
   }
-}
+};

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

@@ -63,6 +63,6 @@ mumuki.exercise = {
       this._current = null;
     }
   }
-}
+};
 
-mumuki.load(() => mumuki.exercise.load())
+mumuki.load(() => mumuki.exercise.load());

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

@@ -5,9 +5,22 @@ mumuki.gamification = (() => {
     static get CONSTANT_TERM()          { return -125; }
   }
 
+  class DummyLevelProgression {
+    setExpMessage() {}
+
+    registerLevelUpAction() {}
+
+    registerGainedExperienceAction() {}
+
+    updateLevel() {}
+  }
+
   class LevelProgression {
     constructor(currentExp) {
       this.currentExp = currentExp;
+      this.lastEarnedExp = 0;
+      this._levelUpAction = this.defaultLevelUpAction;
+      this._gainedExperienceAction = this.defaultGainedExperienceAction;
     }
 
     expToLevelUp() {
@@ -38,8 +51,8 @@ mumuki.gamification = (() => {
       return Math.floor((-b + Math.sqrt(Math.pow(b, 2) - 4 * a * (c - exp))) / (2 * a));
     }
 
-    triggersLevelChange(exp) {
-      return this.levelFor(exp) !== this.currentLevel();
+    triggersLevelChange(newExp) {
+      return this.levelFor(this.currentExp + newExp) !== this.currentLevel();
     }
 
     currentLevelProgress() {
@@ -50,23 +63,97 @@ mumuki.gamification = (() => {
       return this.expFor(this.currentLevel());
     }
 
-    setExpMessage(exp) {
-      let expGained = exp - this.currentExp;
+    exercisesToNextLevel() {
+      return Math.ceil(this.expToLevelUp() / 100);
+    }
+
+    setExpMessage(data) {
+      const exp = data.current_exp;
+      this.lastEarnedExp = exp - this.currentExp;
+
+      if (this.lastEarnedExp > 0) {
+        this.levelUpActionIfLevelUp(data.level_up_html);
+        this._gainedExperienceAction();
 
-      if (expGained > 0) {
         this.currentExp = exp;
-        $('#mu-exp-points').html(expGained);
-        $('#mu-level-number').html(this.currentLevel());
+        this.updateLevel();
+      }
+    }
+
+    defaultGainedExperienceAction() {
+      $('#mu-exp-points').html(this.lastEarnedExp);
+      $('#mu-exp-earned-message').removeClass('hidden');
+    }
+
+    defaultLevelUpAction(_levelUpHtml) {
+      $('#mu-level-up').modal();
+    }
+
+    registerLevelUpAction(action) {
+      this._levelUpAction = action;
+    }
+
+    registerGainedExperienceAction(action) {
+      this._gainedExperienceAction = action;
+    }
+
+    levelUpActionIfLevelUp(levelUpHtml) {
+      if (this.triggersLevelChange(this.lastEarnedExp)) {
+        this._levelUpAction(levelUpHtml);
       }
     }
+
+    animateExperienceCounter(selector) {
+      mumuki.animateNumberCounter(selector, this.lastEarnedExp);
+    }
+
+    updateLevel() {
+      $('#mu-solve-more-exercises span').text(this.exercisesToNextLevel());
+      $('.mu-level-number').html(this.currentLevel());
+
+      this.updateTooltip();
+      this.animateProgressIfAny();
+    }
+
+    updateTooltip() {
+      const $muLevelTooltip = $('.mu-level-tooltip');
+
+      $muLevelTooltip.attr("data-original-title", `${$muLevelTooltip.attr("level")} ${this.currentLevel()}`);
+      $muLevelTooltip.attr("title", "");
+    }
+
+    animateProgressIfAny() {
+      const $muLevelProgress = $('#mu-level-progress');
+      if (this.currentLevelProgress() === 0) {
+        $muLevelProgress.attr("display", "none");
+      }
+
+      $muLevelProgress.animate(
+        {'progress': this.currentLevelProgress() * 250},
+        {
+          step: function(progress) {
+            let pattern = progress + ", 999";
+            $(this).attr("stroke-dasharray", pattern);
+          },
+          duration: 1000
+        });
+    }
   }
 
   function _setUpCurrentLevelProgression() {
-    mumuki.gamification._currentLevelProgression = new LevelProgression(currentExp());
+    if (_gamificationEnabled()) {
+      mumuki.gamification.currentLevelProgression = new LevelProgression(currentExp());
+    } else {
+      mumuki.gamification.currentLevelProgression = new DummyLevelProgression();
+    }
+  }
+
+  function _gamificationEnabled() {
+    return $('#mu-current-exp').length;
   }
 
   function currentExp() {
-    return $('#mu-current-exp').val();
+    return parseInt($('#mu-current-exp').val());
   }
 
   return {
@@ -75,11 +162,12 @@ mumuki.gamification = (() => {
 
     _setUpCurrentLevelProgression,
 
-    /** @type {LevelProgression} */
-    _currentLevelProgression: null
+    /** @type {LevelProgression|DummyLevelProgression} */
+    currentLevelProgression: null
   };
 })();
 
 mumuki.load(() => {
   mumuki.gamification._setUpCurrentLevelProgression();
+  mumuki.gamification.currentLevelProgression.updateLevel();
 });

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

@@ -7,7 +7,7 @@ mumuki.onInputsReady = (() => {
 			if ($(inputsSelector).length === 0) return;
 
 			callback(event);
-		})
+		});
 	}
 
 	return onInputsReady;

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

@@ -21,9 +21,20 @@ mumuki.Kids = class {
     this.$stateImage = $('.mu-kids-state-image');
     this.$contextModal = $('#mu-kids-context');
     this.$resultsModal = $('#kids-results');
+    this.resultsCarrousel = new mumuki.ModalCarrousel('.mu-kids-results-carrousel');
     this.$resultsAbortedModal = $('#kids-results-aborted');
     this.$bubbleCharacterAnimation = $('.mu-kids-character-animation');
     this.$submissionResult =  $('.submission-results');
+    mumuki.gamification.currentLevelProgression.registerLevelUpAction(this.levelUpAction);
+    mumuki.gamification.currentLevelProgression.registerGainedExperienceAction(this.gainedExperienceAction);
+  }
+
+  gainedExperienceAction() {
+    mumuki.gamification.currentLevelProgression.animateExperienceCounter('.mu-kids-results .mu-experience');
+  }
+
+  levelUpAction(levelUpHtml) {
+    $('.mu-kids-results-carrousel').append(levelUpHtml);
   }
 
   showContext() {
@@ -50,11 +61,11 @@ mumuki.Kids = class {
   // ==================
 
   _showSuccessPopup() {
-    this._mustImplementThisMethod()
+    this._mustImplementThisMethod();
   }
 
   _showFailurePopup() {
-    this._mustImplementThisMethod()
+    this._mustImplementThisMethod();
   }
 
   // ====================
@@ -74,7 +85,7 @@ mumuki.Kids = class {
   }
 
   onSubmissionResultModalOpen(_data) {
-    // SubClasses may override this method
+    this.resultsCarrousel.show();
   }
 
   // =================
@@ -82,9 +93,10 @@ mumuki.Kids = class {
   // =================
 
   _openSubmissionResultModal(data) {
-    this.$resultsModal.modal({ backdrop: 'static', keyboard: false })
-    this.$resultsModal.find('.modal-header').first().html(data.title_html)
-    this.$resultsModal.find('.modal-footer').first().html(data.button_html)
+    this.$resultsModal.modal({ backdrop: 'static', keyboard: false });
+    this.$resultsModal.find('.modal-header').first().html(data.title_html);
+    mumuki.gamification.currentLevelProgression.setExpMessage(data);
+    this.$resultsModal.find('.modal-footer').first().html(data.button_html);
     $('.mu-close-modal').click(() => this.$resultsModal.modal('hide'));
     this.onSubmissionResultModalOpen(data);
   }
@@ -129,7 +141,7 @@ mumuki.Kids = class {
   // ============
 
   _mustImplementThisMethod() {
-    throw new Error('TODO: implement method')
+    throw new Error('TODO: implement method');
   }
 
   // ============
@@ -202,4 +214,4 @@ mumuki.Kids = class {
     $blockSvg.height($blocks.height());
   }
 
-}
+};

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

@@ -10,7 +10,7 @@ mumuki.load(() => {
 
     initialize() {
       super.initialize();
-      this.$contextModalButton = new mumuki.Button($('#mu-kids-context .mu-kindergarten-modal-button.mu-close'));
+      this.$contextModalButton = new mumuki.Button($('#mu-kids-context .mu-kids-modal-button.mu-close'));
 
       this.resultActions.passed = this._showSuccessPopup.bind(this);
       this.resultActions.passed_with_warnings = this._showSuccessPopup.bind(this);
@@ -29,10 +29,9 @@ mumuki.load(() => {
     // ================
 
     showNonAbortedPopup(data, animation_name) {
-      data.guide_finished_by_solution = false;
       this.$submissionResult.html(data.title_html);
-      this.$resultsModal.find('.modal-content').removeClass().addClass('modal-content').addClass(data.status);
-      super.showNonAbortedPopup(data, animation_name, 1000);
+      this.$resultsModal.find('.modal-content').removeClass().addClass('modal-content kindergarten').addClass(data.status);
+      super.showNonAbortedPopup(data, animation_name);
     }
 
     showAbortedPopup(data) {
@@ -72,6 +71,11 @@ mumuki.load(() => {
     // == Called by the runner ==
     // ==========================
 
+    showResult(data) {
+      data.guide_finished_by_solution = false;
+      super.showResult(data);
+    }
+
     restart() {
       mumuki.presenterCharacter.playAnimation('talk', this.$bubbleCharacterAnimation);
     }
@@ -99,27 +103,27 @@ mumuki.load(() => {
           this._action('play', 'stop', true, (speech) => {
             mumuki.presenterCharacter.playAnimation('talk', mumuki.kids.$bubbleCharacterAnimation);
             speech.speak(msg);
-          })
+          });
         },
         stop() {
-          this._action('stop', 'play', false, (speech) => speech.cancel())
+          this._action('stop', 'play', false, (speech) => speech.cancel());
         },
         _action(add, remove, isPlaying, callback) {
           callback(window.speechSynthesis);
-          const $button = $('.mu-kindergarten-play-description')
+          const $button = $('.mu-kindergarten-play-description');
           $button.find(`.mu-kindergarten-${add}`).addClass('hidden');
           $button.find(`.mu-kindergarten-${remove}`).removeClass('hidden');
           this._isPlaying = isPlaying;
         },
         verifyBrowserSupport() {
           if (!window.speechSynthesis) {
-            const $button = $('.mu-kindergarten-play-description')
+            const $button = $('.mu-kindergarten-play-description');
             $button.prop('disabled', true);
             $button.css('cursor', 'not-allowed');
-            this._action('play', 'stop', false)
+            this._action('play', 'stop', false);
           }
         }
-      }
+      };
 
     }
 
@@ -139,56 +143,11 @@ mumuki.load(() => {
           const $hintMedia = $('.mu-kindergarten-hint-media');
           if (!$hintMedia.get(0)) $button.addClass('hidden');
         },
-      }
+      };
     }
 
     get context() {
-      return {
-        showContext() {
-          mumuki.kids.showContext();
-          this._showFirstSlideImage();
-        },
-        nextSlide() {
-          this._clickButton('next');
-        },
-        prevSlide() {
-          this._clickButton('prev');
-        },
-        _imageSlides() {
-          return $('.mu-kindergarten-context-image-slides');
-        },
-        _activeSlideImage() {
-          return this._imageSlides().find('.active');
-        },
-        _clickButton(prevOrNext) {
-          this._activeSlideImage().removeClass('active')[prevOrNext]().addClass('active');
-          this.showNextOrCloseButton();
-          this._hidePreviousButtonIfFirstImage();
-        },
-        showNextOrCloseButton() {
-          const $next = $('.mu-kindergarten-modal-button.mu-next');
-          const $close = $('.mu-kindergarten-modal-button.mu-close');
-          const isLastChild = this._activeSlideImage().is(':last-child');
-          this._addClassIf($next, 'hidden', () => isLastChild);
-          this._addClassIf($close, 'hidden', () => !isLastChild);
-        },
-        _hidePreviousButtonIfFirstImage() {
-          const $prev = $('.mu-kindergarten-modal-button.mu-previous');
-          this._addClassIf($prev, 'hidden', () => this._activeSlideImage().is(':first-child'))
-        },
-        _showFirstSlideImage() {
-          this._imageSlides().find('img').each((i, el) => this._addClassIf($(el), 'active', () => i === 0))
-          this.showNextOrCloseButton();
-          this._hidePreviousButtonIfFirstImage();
-        },
-        _addClassIf(element, clazz, criteria) {
-          if (criteria()) {
-            element.addClass(clazz)
-          } else {
-            element.removeClass(clazz);
-          }
-        }
-      }
+      return new mumuki.ModalCarrousel('.mu-kindergarten-context-image-slides', () => mumuki.kids.showContext());
     }
 
   }