mumuki-laboratory 7.4.1 → 7.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b6e6b25c694e8a00a86fcf06f05f35ab974c9602230eba187884aa16bfdb7168
-  data.tar.gz: 2648860bd2387704e371d55cb08696dd82b419ee87fbf2df395017aadf7aeccc
+  metadata.gz: 56fcb30522c5c040911bbfc58f2f6e522aa5983f09b09d76cad1e60c8bd2efdd
+  data.tar.gz: aeec9a44afdf74ea1d21e9f6b4bb548f12c22f7db55fa6470b478372ba7efcb5
 SHA512:
-  metadata.gz: 371db2b5ab6ac40992b65373f2f06a269f022bd6c269c1da24ce26cb1f9c1b7b23049b9994403189d66ea6cf5d56160b2ac452679728c1ace52c295bbb64d4d3
-  data.tar.gz: 07bdd0405cb1903d7eaf5508d963ef8fa89ed57ad30bfc8023b831c1146d7060a60cf95b1b1cc13a1518e71119cfa76df4ea4f9666c4cb3eb86e41821d7dd5d1
+  metadata.gz: a98ee53e368aefbfc98cb99f8f4164c4e43d0e3c0be8e06c04cf39f48d4b78edf4ef5afaec4bdf94bd341121e0616c38f1ca9419eed8ae530fd395c5a75fd2b6
+  data.tar.gz: 8c17f74141875921e42b6e8972d37c9c3e53d81646223e83a647c6d5e1f2a14acde33da7ff00b4f80c88a3ffe411378daacbf8580fd44f75efde2a510f971297

data/README.md

@@ -178,6 +178,12 @@ which are granted to be safe and stable.
 
 * `mumuki.bridge.Laboratory`
   * `.runTests`
+* `mumuki.editor`
+  * `formatContent`
+  * `reset`
+  * `toggleFullscreen`
+* `mumuki.elipsis`
+  * `replaceHtml`
 * `mumuki.kids`
   * `registerBlocksAreaScaler`
   * `registerStateScaler`
@@ -185,6 +191,9 @@ which are granted to be safe and stable.
   * `scaleBlocksArea`
   * `scaleState`
   * `showResult`
+* `mumuki.renderers`
+  * `SpeechBubbleRenderer`
+  * `renderSpeechBubbleResultItem`
 * `mumuki.locale`
 * `mumuki.MultipleScenarios`
   * `scenarios`
@@ -200,22 +209,29 @@ which are granted to be safe and stable.
 
 ### Bridge Response Format
 
-```json
+```javascript
 {
-  "status": "failed",
-  "guide_finished_by_solution": false,
-  "class_for_progress_list_item":"progress-list-item text-center danger active",
-  "html":"...",
-  "title_html":"...",
-  "button_html":"...",
-  "expectations_html":"...",
-  "remaining_attempts_html":null,
-  "test_results":[
-      {
-        "title":null,
-        "status":"failed",
-        "result":"..."
-      }
+  "status": "passed|passed_with_warnings|failed",
+  "guide_finished_by_solution": "boolean",
+  "class_for_progress_list_item": "string",
+  "html": "string",
+  "remaining_attempts_html": "string" ,
+  "title_html": "string",                         // kids-only
+  "button_html": "string",                        // kids-only
+  "expectations": [                               // kids-only
+    {
+      "status": "passed|failed",
+      "explanation": "string"
+    }
+  ],
+  "tips": [ "string" ],                           // kids-only
+  "test_results": [                               // kids-only
+    {
+      "title": "string",
+      "status": "passed|failed",
+      "result": "string",
+      "summary": "string"
+    }
   ]
 }
 ```
@@ -463,7 +479,7 @@ POST /organization/:id/courses/
 
 ```json
 {
-   "name":"....",
+   "name": "....",
 }
 ```
 
@@ -539,7 +555,7 @@ Sample response body:
 ```json
 {
   "organizations": [
-    { "name": "academy", "contact_email": "a@a.com", "locale": "es-AR", "login_methods": ["facebook"], "books": ["libro"], "public": true, "logo_url":"http://..." },
+    { "name": "academy", "contact_email": "a@a.com", "locale": "es-AR", "login_methods": ["facebook"], "books": ["libro"], "public": true, "logo_url": "http://..." },
     { "name": "alcal", "contact_email": "b@b.com", "locale": "en-US", "login_methods": ["facebook", "github"], "books": ["book"], "public": false }
   ]
 }
@@ -555,7 +571,7 @@ get /organizations/:name
 Sample response body:
 
 ```json
-{ "name": "academy", "contact_email": "a@a.com", "locale": "es-AR", "login_methods": ["facebook"], "books": ["libro"], "public": true, "logo_url":"http://..." }
+{ "name": "academy", "contact_email": "a@a.com", "locale": "es-AR", "login_methods": ["facebook"], "books": ["libro"], "public": true, "logo_url": "http://..." }
 ```
 **Minimal permission**: `janitor` of the organization.
 

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

@@ -23,6 +23,14 @@ var mumuki = mumuki || {};
     })
   }
 
+  function formatContent() {
+    mumuki.page.editors.each(function (_, editor) {
+      editor.setSelection({line: 0, ch: 0}, {line: editor.lineCount()})
+      editor.indentSelection("smart")
+      editor.setSelection({line: 0})
+    });
+  }
+
   function toggleFullscreen() {
     $('body').toggleClass('fullscreen');
     $('.editor-resize .fa-stack-1x').toggleClass('fa-expand').toggleClass('fa-compress');
@@ -61,7 +69,9 @@ var mumuki = mumuki || {};
   }
 
   mumuki.editor = mumuki.editor || {};
+  mumuki.editor.reset = resetEditor;
   mumuki.editor.toggleFullscreen = toggleFullscreen;
+  mumuki.editor.formatContent = formatContent;
   mumuki.editor.indentWithSpaces = indentWithSpaces;
   mumuki.editor.syncContent = syncContent;
 
@@ -75,12 +85,19 @@ var mumuki = mumuki || {};
     updateCodeMirrorLanguage();
     onSelectUpdateCodeMirror();
 
-    $('.editor-reset').click(function () {
-      resetEditor();
+    $('.editor-reset').click(function (event) {
+      event.stopPropagation();
+      const selection = confirm(this.getAttribute('data-confirm'));
+      if(selection) resetEditor();
     });
+
     $('.editor-resize').click(function () {
       toggleFullscreen();
     });
+
+    $('.editor-format').click(function (){
+      formatContent();
+    });
   });
 
 }(mumuki));

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

@@ -0,0 +1,31 @@
+// This module defines three client-side-only special sections, and allows them to be replaced
+// by adding the `mu-elipsis` class, or by calling `mumuki.elipsis()`:
+//
+// * <elipsis-for-student@ ...code... @elipsis-for-student>                     : replaces code with an elipsis
+// * <hidden-for-student@ ...code... @hidden-for-student>                       : completely hides code
+// * <description-for-student[...text...]@ ...code... @description-for-student> : replaces code a message sourrounded by elipsis
+//
+//
+// This module assumes the strings are already markdown-like escaped code strings, not plain code
+(function (mumuki) {
+
+  function elipsis(code) {
+    return code
+      .replace(/&lt;elipsis-for-student@[\s\S]*?@elipsis-for-student&gt;/g, ' ... ')
+      .replace(/&lt;hidden-for-student@[\s\S]*?@hidden-for-student&gt;/g, '')
+      .replace(/&lt;description-for-student\[([^\]]*)\]@[\s\S]*?@description-for-student&gt;/g, ' ... $1 ... ');
+  }
+
+  mumuki.elipsis = elipsis;
+  mumuki.elipsis.replaceHtml = () => {
+    let $elipsis = $('.mu-elipsis');
+    $elipsis.each((it, e) =>  {
+      let $e = $(e);
+      $e.html(mumuki.elipsis($e.html()));
+    })
+  };
+
+  mumuki.load(() => {
+    mumuki.elipsis.replaceHtml();
+  });
+})(mumuki);

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

@@ -0,0 +1,17 @@
+var mumuki = mumuki || {};
+
+(function (mumuki) {
+  // When using Turbolinks, intervals loaded inside <body> aren't destroyed on page changes
+  // Use this function instead if you want the behaviour of a regular setInterval
+  mumuki.setInterval = function (intervalFunction, milliseconds) {
+    const interval = setInterval.apply(this, [intervalFunction, milliseconds]);
+
+    // Using one to avoid calling clearInterval on every page chance.
+    $(document).one('turbolinks:before-cache turbolinks:before-render', function () {
+      clearInterval(interval);
+    });
+
+    return interval;
+  }.bind(this);
+
+}(mumuki));

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

@@ -169,28 +169,17 @@ mumuki.load(function () {
       $bubble.find('.mu-kids-character-speech-bubble-failed').hide();
       $bubble.find('.mu-kids-discussion-link').remove();
       Object.keys(mumuki.kids.resultAction).forEach($bubble.removeClass.bind($bubble));
-      mumuki.kids._getOverlay().hide();
+      mumuki.kids._getOverlay().hide()
     },
 
     _showMessageOnCharacterBubble: function (data) {
-      var $bubble = mumuki.kids._getCharacterBubble();
-      $bubble.find('.mu-kids-character-speech-bubble-tabs').hide();
-      $bubble.find('.mu-kids-character-speech-bubble-normal').hide();
-      $bubble.find('.mu-kids-character-speech-bubble-failed').show().html(data.title_html);
-      $bubble.addClass(data.status);
-      if (data.status === 'passed_with_warnings') {
-        $bubble.find('.mu-kids-character-speech-bubble-failed').append(data.expectations_html);
-      }
-      if (this._shouldDisplayDiscussionsLink(data.status)) {
-        $bubble.append(discussionsLinkHtml);
-      }
+      const renderer = new mumuki.renderers.SpeechBubbleRenderer(mumuki.kids._getCharacterBubble());
+      renderer.setDiscussionsLinkHtml(discussionsLinkHtml);
+      renderer.setResponseData(data);
+      renderer.render();
       mumuki.kids._getOverlay().show();
     },
 
-    _shouldDisplayDiscussionsLink: function (status) {
-      return ['failed', 'passed_with_warnings'].some(it => it === status);
-    },
-
     _showOnSuccessPopup: function (data) {
       mumuki.kids._updateSubmissionResult(data.html);
       mumuki.presenterCharacter.playAnimation('success_l', mumuki.kids._getCharacterImage());
@@ -313,7 +302,7 @@ mumuki.load(function () {
     });
 
     if (paragraphCount > 1) {
-      nextSpeechBlinking = setInterval(() => $nextSpeech.fadeTo('slow', 0.1).fadeTo('slow', 1.0), 1000);
+      nextSpeechBlinking = mumuki.setInterval(() => $nextSpeech.fadeTo('slow', 0.1).fadeTo('slow', 1.0), 1000);
     }
 
     $nextSpeech.click(showNextParagraph);

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

@@ -45,7 +45,7 @@ mumuki.load(function () {
       });
     },
     setMessagesInterval: function () {
-      setInterval(Chat.getMessages, 60000);
+      mumuki.setInterval(Chat.getMessages, 60000);
     },
     submitMessagesForm: function (url, readUrl, errorUrl) {
       var $container = $('.mu-view-messages');

data/app/assets/javascripts/mumuki_laboratory/application/speech-bubble-renderer.js

@@ -0,0 +1,99 @@
+((mumuki)=> {
+
+  function renderSpeechBubbleResultItem(item) {
+    return `
+        <div class="results-item">
+          <ul class="results-list">
+            <li>${item}</li>
+          </ul>
+        </div>`;
+  }
+
+  // A mumuki.renderers.SpeechBubbleRenderer allows to configure a kids speech bubble
+  // with the data of a test response from bridge
+  class SpeechBubbleRenderer {
+    constructor($bubble) {
+      this.$bubble = $bubble;
+      this.$failedArea = $bubble.find('.mu-kids-character-speech-bubble-failed');
+    }
+
+    _chooseResultItem() {
+      if (this._responseStatus() !== 'passed' && this._hasTips()) {
+        this._appendFirstTip()
+      } else if (this._responseStatus() === 'failed') {
+        this._appendFirstFailedTestResultSummary();
+      } else if (this._responseStatus() === 'passed_with_warnings') {
+        this._appendFirstExpectationResult();
+      }
+    }
+
+    _appendFirstFailedTestResultSummary() {
+      const failedTestResult = this._failedTestResults()[0]
+      if (failedTestResult && failedTestResult.summary) {
+        this._appendResultItem(mumuki.renderers.renderSpeechBubbleResultItem(failedTestResult.summary));
+      }
+    }
+
+    _appendFirstExpectationResult() {
+      this._appendResultItem(mumuki.renderers.renderSpeechBubbleResultItem(this.responseData.expectations[0].explanation));
+    }
+
+    _appendFirstTip() {
+      this._appendResultItem(mumuki.renderers.renderSpeechBubbleResultItem(this.responseData.tips[0]));
+    }
+
+    _appendResultItem(item) {
+      this._addClass('with-result-item');
+      this.$failedArea.append(item);
+    }
+
+    _addClass(klass) {
+      this.$bubble.addClass(klass);
+    }
+
+    _appendDiscussionsLinkHtml() {
+      if (this._shouldDisplayDiscussionsLink()) {
+        this.$bubble.append(this.discussionsLinkHtml);
+      }
+    }
+
+    _shouldDisplayDiscussionsLink() {
+      return ['failed', 'passed_with_warnings'].some(it => it === this._responseStatus());
+    }
+
+    _responseStatus() {
+      return this.responseData.status;
+    }
+
+    _hasTips() {
+      return this.responseData.tips && this.responseData.tips.length
+    }
+
+    _failedTestResults() {
+      return this.responseData.test_results.filter((it) => it.status === 'failed');
+    }
+
+    setDiscussionsLinkHtml(discussionsLinkHtml) {
+      this.discussionsLinkHtml = discussionsLinkHtml;
+    }
+
+    setResponseData(responseData) {
+      this.responseData = responseData;
+    }
+
+    // Entry point of the renderer. It just updates the UI, not returning anything
+    // Configure the renderer with `setDiscussionsLinkHtml` and `setResponseData` first.
+    render() {
+      this.$bubble.find('.mu-kids-character-speech-bubble-tabs').hide();
+      this.$bubble.find('.mu-kids-character-speech-bubble-normal').hide();
+      this.$failedArea.show().html(this.responseData.title_html);
+      this._addClass(this._responseStatus());
+      this._chooseResultItem();
+      this._appendDiscussionsLinkHtml();
+    }
+  }
+
+  mumuki.renderers = mumuki.renderers || {};
+  mumuki.renderers.SpeechBubbleRenderer = SpeechBubbleRenderer;
+  mumuki.renderers.renderSpeechBubbleResultItem = renderSpeechBubbleResultItem;
+})(mumuki)

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

@@ -8,7 +8,7 @@ var mumuki = mumuki || {};
     var duration = moment.duration(diffTime, 'milliseconds');
     var intervalDuration = 1000;
 
-    var interval = setInterval(function () {
+    var interval = mumuki.setInterval(function () {
       duration = moment.utc(duration - intervalDuration);
       if(duration.valueOf() <= 0) {
         clearInterval(interval);

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

@@ -6,6 +6,7 @@ $da-font-path: asset-path('assets');
 @import "codemirror/codemirror.min";
 @import "codemirror/show-hint.min";
 @import "application/vendor";
+@import "application/locked";
 @import "application/tooltip";
 @import "application/hovers";
 @import "application/mixins";

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

@@ -107,10 +107,6 @@ h1 {
   margin-bottom: 20px;
 }
 
-.chapter {
-  margin: 35px 0;
-}
-
 pre {
   font-size: 14px;
   line-height: 1.4;

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

@@ -0,0 +1,29 @@
+.chapter-container {
+  position: relative;
+}
+
+.chapter {
+  position: relative;
+
+  margin: 35px 0;
+  padding-bottom: 15px;
+
+  &.mu-locked {
+    opacity: 20%;
+
+    user-select: none;
+    pointer-events: none;
+  }
+}
+
+.mu-lock {
+  position: absolute;
+
+  width: 100%;
+  height: 100%;
+
+  transform: translateY(20%);
+
+  top: 0px;
+  left: 0px;
+}

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

@@ -13,25 +13,6 @@ $multifile-inactive-tab-border-color: #ECF0F1;
   max-height: none;
 }
 
-.submission-reset {
-  padding: 5px;
-  cursor: pointer;
-}
-
-.editor-resize {
-  position: absolute;
-  padding: 5px;
-  cursor: pointer;
-  z-index: 10;
-  top: 0;
-  right: 0;
-  font-size: 0.5em;
-  &.multiple-files {
-    top: 43px;
-  }
-}
-
-
 body:not(.fullscreen) {
   .CodeMirror-wrap,
   .CodeMirror-scroll {
@@ -69,10 +50,6 @@ body.fullscreen {
       overflow-y: scroll;
       overflow-x: auto;
     }
-    .submission-reset,
-    .editor-resize {
-      margin-right: 15px;
-    }
   }
 }