Development

src/adonisjs/public/player/env/index.html

@@ -99,8 +99,14 @@
 						<a href="/player/case/?id=4d28a7d1-11fe-42ed-9665-201a487f2275&room=2dcc1f39-85e6-4cfe-9539-58145f6cc98b" class="d-flex flex-column align-items-center justify-content-center home-author-box-content home-author-case-box" target="_blank">
 							<img src="/player/env/images/mutantes-introducao.png" width="300px">
 						</a>
+						<a href="/player/case/index-cell.html?id=cdc0bd04-c48e-42e0-a3eb-218655d522bf&room=2dcc1f39-85e6-4cfe-9539-58145f6cc98b" class="d-flex flex-column align-items-center justify-content-center home-author-box-content home-author-case-box" target="_blank">
+							<img src="/player/env/images/mutantes-autor-1.png" width="300px">
+						</a>
+						<a href="/player/case/index-cell.html?id=65b373b3-9b72-484b-93b7-31a1a37583f9&room=2dcc1f39-85e6-4cfe-9539-58145f6cc98b" class="d-flex flex-column align-items-center justify-content-center home-author-box-content home-author-case-box" target="_blank">
+							<img src="/player/env/images/mutantes-autor-2.png" width="300px">
+						</a>
 						<a href="/player/case/index-cell.html?id=d8831fe7-e030-48a5-bcc6-162749bdc076&room=2dcc1f39-85e6-4cfe-9539-58145f6cc98b" class="d-flex flex-column align-items-center justify-content-center home-author-box-content home-author-case-box" target="_blank">
-							<img src="/player/env/images/mutantes-autor.png" width="300px">
+							<img src="/player/env/images/mutantes-avancado.png" width="300px">
 						</a>
 					</div>
 	        <div class="d-flex h-50 w-100" id="home-btn-container">

src/adonisjs/public/player/js/player.js

@@ -490,13 +490,25 @@ class PlayerManager {
       element => element.type == 'field' && element.field == 'block_types')
     blocks = (blocks != null) ? blocks.value : null
 
+    let sliders = content.find(
+      element => element.type == 'field' && element.field == 'sliders')
+    sliders = (sliders != null) ? sliders.value : null
+
+    console.log('=== sliders')
+    console.log(sliders)
+
+    let mode = content.find(
+      element => element.type == 'field' && element.field == 'script_mode')
+    mode = (mode != null) ? mode.value : null
+
     AuthorCellManager.instance.start(
       {name: this._currentKnot,
        types: types,
        blocks: blocks,
        source: knot,
-       buttonTypes: ''},
-      null, null, false, '/dccs/')
+       buttonTypes: '',
+       sliders: sliders},
+      mode, null, false, '/dccs/')
   }
 
   presentNote (knot) {

src/adonisjs/public/templates/compact/case/cell_editor_sliders-dynamic.md

@@ -0,0 +1,5 @@
+# Presentation (cell_editor_sliders) #
+
+___ Template ___
+
+* template: compact/case/cell_editor_sliders

src/adonisjs/public/templates/compact/case/cell_editor_sliders-static.md

@@ -0,0 +1,8 @@
+___ Flow ___
+
+* Sequential:
+  * _sequential_
+
+___ Data ___
+
+* theme: compact(green)

src/adonisjs/public/templates/compact/case/cell_mutant-dynamic.md

@@ -0,0 +1,5 @@
+# Presentation (cell_mutant) #
+
+___ Template ___
+
+* template: compact/case/cell_mutant

src/adonisjs/public/templates/compact/case/cell_mutant-static.md

@@ -0,0 +1,8 @@
+___ Flow ___
+
+* Sequential:
+  * _sequential_
+
+___ Data ___
+
+* theme: compact(green)

src/adonisjs/public/templates/compact/case/cell_mutant_sliders-dynamic.md

@@ -0,0 +1,5 @@
+# Presentation (cell_mutant_sliders) #
+
+___ Template ___
+
+* template: compact/case/cell_mutant_sliders

src/adonisjs/public/templates/compact/case/cell_mutant_sliders-static.md

@@ -0,0 +1,8 @@
+___ Flow ___
+
+* Sequential:
+  * _sequential_
+
+___ Data ___
+
+* theme: compact(green)

src/adonisjs/public/templates/labs/lab_5-dynamic.md

@@ -0,0 +1,92 @@
+# Tarefa 1 #
+
+<h1>Compondo em Escalas</h1>
+<h1>Componentes e REST</h1>
+<h2>Tarefa 1</h2>
+
+{{explica
+* Escolha uma API do TheMealDB que não sejam as duas abordadas no vídeo (`search.php` e `categories.php`) e monte uma chamada no Postman.
+}}
+
+{{figura1
+<h2>Coloque a figura com a captura do aplicativo funcionando.</h2>
+}}
+
+<br>
+
+<code>
+{{codigo1
+Escreva o resultado retornado em JSON (máximo 15 linhas).
+}}
+</code>
+
+<br>
+
+# Tarefa 2 #
+
+<h2>Tarefa 2</h2>
+
+{{explica
+* Adapte o App desenvolvido no vídeo "Compondo em Escalas / Componentes e REST" para explorar o serviço que você usou na Tarefa 1.
+}}
+
+{{figura1
+<h2>Coloque a figura com a captura do aplicativo funcionando.</h2>
+}}
+
+<br>
+
+{{figura2
+<h2>Coloque a figura com a captura da hierarquia de componentes visuais (composite).</h2>
+}}
+
+<br>
+
+{{figura3
+<h2>Coloque a figura com a captura dos scripts em box programming.</h2>
+}}
+
+# Apres 1 #
+
+<h2>Apresentação do Resultado da Tarefa 1</h2>
+
+Você deve capturar:
+* a tela do Postman apresentando a chamada, os parâmetros preenchidos e o resultado retornado;
+* o JSON que retornou da chamada - se o JSON tiver mais do que 15 linhas, recorte linhas significativas.
+
+![Postman Screen](template_fix/labs/lab5/postman-screen.png)
+
+<code>
+{
+  "meals": [
+    {
+      "idMeal": "52771",
+      "strMeal": "Spicy Arrabiata Penne",
+      "strInstructions": "Bring a large pot...",
+      "strMealThumb": "https://www.themealdb.com/...",
+      "strTags": "Pasta,Curry",
+      "strCreativeCommonsConfirmed": null,
+      "dateModified": null
+    }
+  ]
+}
+</code>
+
+# Apres 2 #
+
+<h2>Apresentação do Resultado da Tarefa 2</h2>
+
+Você deve capturar:
+* a tela do aplicativo apresentando o resultado final - pode ser do emulador ou do celular;
+* a hierarquia de componentes visuais (padrão composite);
+* todos os scripts do app (na forma de caixinhas).
+
+As figuras são colocadas de forma separada (como no exemplo abaixo). Coloque figuras em que as coisas fiquem legíveis, mesmo que a figura fique grande. Exemplo:
+
+![Result Screen](template_fix/labs/lab5/ai-screen.png)
+![Composite Tree](template_fix/labs/lab5/ai-tree.png)
+![Script](template_fix/labs/lab5/ai-script.png)
+
+___ Template ___
+
+* template: labs/lab_5

src/adonisjs/public/templates/labs/lab_5-static.md

@@ -0,0 +1,8 @@
+___ Flow ___
+
+* Sequential:
+  * _sequential_
+
+___ Data ___
+
+* theme: simple(blue)

src/adonisjs/public/templates/templates.json

@@ -39,6 +39,13 @@
     "path": "labs/lab_4",
     "icon": "labs/labs.png",
     "scope": "case",
+    "environment": "development"},
+"Lab 5":
+   {"questId": "labs",
+    "description": "Lab 5.",
+    "path": "labs/lab_5",
+    "icon": "labs/labs.png",
+    "scope": "case",
     "environment": "jacinto"},
 "Zombie":
     {"questId": "zombie",

src/adonisjs/public/themes/compact/cell_editor_sliders.html

@@ -0,0 +1,65 @@
+<div class="d-flex panel-label">
+  <div class="col-3">
+    <div id="editor-button">
+       <dcc-button topic="control/editor/switch" label="EDITOR" xstyle="in">
+       </dcc-button>
+    </div>
+    <div id="execute-button">
+       <dcc-button topic="control/editor/switch" label="OPERAÇÃO" xstyle="in">
+       </dcc-button>
+    </div>
+  </div>
+  <div id="operation-panel" class="d-flex col-3">
+    <div id="play-button" class="control-button">
+      <dcc-button label="Play" topic="control/space/play"
+                   image="images/icon/play.svg"></dcc-button>
+    </div>
+    <div id="stop-button" class="control-button">
+      <dcc-button label="Stop" topic="control/space/stop"
+                   image="images/icon/stop.svg"></dcc-button>
+    </div>
+    <div id="restart-button" class="control-button">
+      <dcc-button label="Restart" topic="control/space/restart"
+                   image="images/icon/restart.svg"></dcc-button>
+    </div>
+    <div id="next-button" class="control-button">
+      <dcc-button label="Next" topic="state/next"
+                   image="images/icon/step.svg"></dcc-button>
+    </div>
+  </div>
+  <span id="stage-label" class="col-3"><label for="stage-field">Estágio</label>
+       <select id="stage-field" name="stage-field">
+         <option value="01_movement_h">Movimento Horizontal</option>
+         <option value="02_revert">Reverte</option>
+         <option value="03_movement_v">Movimento Vertical</option>
+         <option value="04_eat">Come</option>
+         <option value="05_reproduction">Reprodução</option>
+         <option value="06_die">Morre</option>
+         <option value="07_free">Estilo Livre</option>
+       </select>
+  </span>
+  <div class="col-3">
+     <dcc-button topic="control/editor/finish" label="***TERMINAR***" xstyle="in"
+        style="font-size:32px;border:1px solid;border-radius:.5rem;border-color:lightred;padding:.5rem .5rem;background-color:red;color:white"
+        disabled>
+       <subscribe-dcc topic="control/finish/enable" map="enable"></subscribe-dcc>
+       <subscribe-dcc topic="control/finish/disable" map="disable"></subscribe-dcc>
+     </dcc-button>
+     &nbsp;&nbsp;
+     <span id="source-name">Result</span>
+  </div>
+</div>
+<div id="action-panels" class="d-flex h-100 mb-3">
+  <div id="composition-block" class="d-flex col-6 flex-column align-items-stretch">
+     <div>
+        <div id="render-panel">{knot}</div>
+     </div>
+     <div id="rules-panel"></div>
+  </div>
+  <div id="customize-block" class="d-flex col-6 flex-column align-items-stretch">
+     <div class="h-100 w-100" style="padding-left:.800rem">
+        <div class="styt-pul-main h-100 w-100" id="types-panel"></div>
+     </div>
+  </div>
+</div>
+<div id="xml-toolbox"></div>

src/adonisjs/public/themes/compact/cell_mutant.html

@@ -0,0 +1,75 @@
+<div class="d-flex panel-label">
+  <div class="col-3">
+    <div id="editor-button">
+       <dcc-button topic="control/editor/switch" label="EDITOR" xstyle="in">
+       </dcc-button>
+    </div>
+    <div id="execute-button">
+       <dcc-button topic="control/editor/switch" label="OPERAÇÃO" xstyle="in">
+       </dcc-button>
+    </div>
+  </div>
+  <div id="operation-panel" class="d-flex col-3">
+    <div id="play-button" class="control-button">
+      <dcc-button label="Play" topic="control/space/play"
+                   image="images/icon/play.svg"></dcc-button>
+    </div>
+    <div id="stop-button" class="control-button">
+      <dcc-button label="Stop" topic="control/space/stop"
+                   image="images/icon/stop.svg"></dcc-button>
+    </div>
+    <div id="restart-button" class="control-button">
+      <dcc-button label="Restart" topic="control/space/restart"
+                   image="images/icon/restart.svg"></dcc-button>
+    </div>
+    <div id="next-button" class="control-button">
+      <dcc-button label="Next" topic="state/next"
+                   image="images/icon/step.svg"></dcc-button>
+    </div>
+  </div>
+  <span id="stage-label" class="col-3"><label for="stage-field">Estágio</label>
+       <select id="stage-field" name="stage-field">
+         <option value="01_duplication">Duplicação</option>
+         <option value="02_death">Morte</option>
+         <option value="03_mutation_1_2">Mutação 1 para 2</option>
+         <option value="04_mutation_2_3">Mutação 2 para 3</option>
+         <option value="05_mutation_3_4">Mutação 3 para 4</option>
+         <option value="06_mutation_4_5">Mutação 4 para 5</option>
+         <option value="07_movement">Movimento</option>
+         <option value="08_free">Estilo Livre</option>
+       </select>
+  </span>
+  <div class="col-3">
+     <dcc-button topic="control/editor/finish" label="***TERMINAR***" xstyle="in"
+        style="font-size:32px;border:1px solid;border-radius:.5rem;border-color:lightred;padding:.5rem .5rem;background-color:red;color:white"
+        disabled>
+       <subscribe-dcc topic="control/finish/enable" map="enable"></subscribe-dcc>
+       <subscribe-dcc topic="control/finish/disable" map="disable"></subscribe-dcc>
+     </dcc-button>
+     &nbsp;&nbsp;
+     <span id="source-name">Result</span>
+  </div>
+</div>
+<div id="action-panels" class="d-flex h-100 mb-3">
+  <div id="composition-block" class="d-flex col-6 flex-column align-items-stretch">
+     <div>
+        <div id="render-panel">{knot}</div>
+        <div id="types-panel"></div>
+     </div>
+     <div id="rules-panel"></div>
+  </div>
+  <div id="script-block" class="d-flex col-6 flex-column align-items-stretch">
+     <div class="sty-navigation-expansion">
+         <dcc-button id="button-expand-script" topic="control/script/expand" label="Expand" image="images/icon/icon-expansion-left.svg"></dcc-button>
+         <dcc-button id="button-retract-script" topic="control/script/retract" label="Retract" image="images/icon/icon-expansion-right.svg"></dcc-button>
+     </div>
+     <div class="sty-navigation-expansion">
+         <dcc-button id="button-retract-cells" topic="control/cells/retract" label="Expand" image="images/icon/icon-expansion-left.svg"></dcc-button>
+         <dcc-button id="button-expand-cells" topic="control/cells/expand" label="Retract" image="images/icon/icon-expansion-right.svg"></dcc-button>
+     </div>
+     <div class="h-100 w-100" style="padding-left:.800rem">
+        <div class="h-100 w-100" id="script-panel"></div>
+     </div>
+  </div>
+</div>
+<div id="xml-toolbox"></div>