Add script view

extensions/web-base/www/app/utils.js

@@ -127,6 +127,26 @@ function hsvToRgb(h, s, v) {
   return 'rgb(' + Math.floor(r * 255) + ',' + Math.floor(g * 255) + ',' + Math.floor(b * 255) + ')';
 }
 
+function parseRgb(v) {
+  var parts = /^#?(\w\w)(\w\w)(\w\w)$/.exec(v);
+  return parts ? {
+    r: parseInt(parts[1], 16),
+    g: parseInt(parts[2], 16),
+    b: parseInt(parts[3], 16)
+  } : null;
+}
+
+function toHex(v) {
+  var h = (v & 0xff).toString(16);
+  return h.length == 1 ? '0' + h : h;
+}
+function formatRgb(r, g, b) {
+  if (typeof r === 'object') {
+    return parseRgb(r.r, r.g, r.b);
+  }
+  return "#" + toHex(r) + toHex(g) + toHex(b);
+}
+
 function hashString(value) {
   var hash = 0;
   if (typeof value === 'string') {
@@ -190,6 +210,14 @@ function getJson(response) {
   return response.json();
 }
 
+function getResponseJson(response) {
+  return response.json();
+}
+
+function getResponseText(response) {
+  return response.text();
+}
+
 function rejectIfNotOk(response) {
   if (response.ok) {
     return response;

extensions/web-scripts/script-blockly.xml

@@ -1,4 +1,4 @@
-<app-page id="scriptsBlockly" title="Scripts Editor">
+<app-page id="scriptsBlockly" title="Blocks Editor">
   <template slot="bar-middle">
     <h1 v-if="newName === false" v-on:click="newName = name">{{ name }}</h1>
     <div v-else>
@@ -9,7 +9,7 @@
   </template>
   <template slot="bar-right">
     <input v-on:change="uploadThenSave" type="file" accept=".xml" ref="uploadInput" style="display: none;" />
-    <button v-on:click="onDelete().then(function(){ app.replacePage('scripts'); })" title="Delete"><i class="fa fa-trash"></i>&nbsp;Delete</button>
+    <button v-on:click="onDelete()" title="Delete"><i class="fa fa-trash"></i>&nbsp;Delete</button>
     <button v-on:click="onApply()" title="Save then reload"><i class="fas fa-redo"></i></button>
     <button v-on:click="onTest()" title="Test"><i class="fas fa-vial"></i></button>
     <button v-on:click="onPoll()" title="Poll"><i class="far fa-bell"></i></button>

extensions/web-scripts/script-editor.xml

@@ -1,4 +1,4 @@
-<app-page id="scriptsEditor" title="Scripts Editor">
+<app-page id="scriptsEditor" title="Lua Editor">
   <template slot="bar-middle">
     <h1 v-if="newName === false" v-on:click="newName = name">{{ name }}</h1>
     <div v-else>
@@ -8,13 +8,11 @@
     </div>
   </template>
   <template slot="bar-right">
-    <button v-on:click="onDelete().then(function(){ app.replacePage('scripts'); })" title="Delete"><i class="fa fa-trash"></i>&nbsp;Delete</button>
+    <button v-on:click="onDelete()" title="Delete"><i class="fa fa-trash"></i>&nbsp;Delete</button>
     <button v-on:click="onApply()" title="Save then reload"><i class="fas fa-redo"></i></button>
-    <button v-on:click="onTest()" title="Test"><i class="fas fa-vial"></i></button>
-    <button v-on:click="onPoll()" title="Poll"><i class="far fa-bell"></i></button>
     <button v-on:click="onSave" title="Save"><i class="far fa-save"></i></button>
   </template>
   <article class="content">
-    <textarea v-model="text" spellcheck="false" wrap="off" style="height:  100%; width:  100%; border: none; margin: 0px; padding: 0px; resize: none; font-size: 1.6rem;" placeholder="Enter your Lua script here"></textarea>
+    <textarea v-model="text" spellcheck="false" wrap="off" class="full" placeholder="Enter your Lua script here"></textarea>
   </article>
 </app-page>

extensions/web-scripts/script-view.xml

@@ -0,0 +1,18 @@
+<app-page id="scriptsView" title="View Editor">
+  <template slot="bar-middle">
+    <h1 v-if="newName === false" v-on:click="newName = name">{{ name }}</h1>
+    <div v-else>
+      <input v-model="newName" type="text" placeholder="Script name">
+      <button v-on:click="onRename()" title="Apply"><i class="fas fa-check"></i></button>
+      <button v-on:click="newName = false" title="Cancel"><i class="fa fa-window-close"></i></button>
+    </div>
+  </template>
+  <template slot="bar-right">
+    <button v-on:click="onDelete()" title="Delete"><i class="fa fa-trash"></i>&nbsp;Delete</button>
+    <button v-on:click="onApply()" title="Save then reload"><i class="fas fa-redo"></i></button>
+    <button v-on:click="onSave" title="Save"><i class="far fa-save"></i></button>
+  </template>
+  <article class="content">
+    <textarea v-model="text" spellcheck="false" wrap="off" class="full"></textarea>
+  </article>
+</app-page>

extensions/web-scripts/scripts-add.xml

@@ -0,0 +1,12 @@
+<app-page id="scripts-add" title="Add Script">
+  <template slot="bar-right">
+    <button v-on:click="app.back()" title="Close"><i class="fa fa-window-close"></i></button>
+  </template>
+  <article>
+    <section>
+      <button v-on:click="newBlocks"><i class="fa fa-plus"></i>&nbsp;Add Blocks</button>
+      <button v-on:click="newView"><i class="fa fa-plus"></i>&nbsp;Add View</button>
+      <button v-on:click="newScript"><i class="fa fa-plus"></i>&nbsp;Add Script</button>
+    </section>
+  </article>
+</app-page>

extensions/web-scripts/scripts.xml

@@ -1,15 +1,12 @@
 <app-page id="scripts" title="Scripts">
   <template slot="bar-right">
-    <button v-on:click="newScript" title="Create"><i class="fa fa-plus"></i></button>
+    <button v-on:click="onNew" title="Add"><i class="fa fa-plus"></i></button>
   </template>
   <article class="cards">
     <div class="card" v-for="script in scripts">
       <div class="bar">
         <p>{{ script.name }}</p>
         <div>
-          <!--
-          <button v-if="script.hasBlocks" v-on:click="onTransform(script)"><i class="fas fa-recycle"></i>&nbsp;Lua</button>
-          -->
           <button v-on:click="reloadScript(script)"><i class="fas fa-redo"></i>&nbsp;Reload</button>
           <button v-on:click="pollScript(script)"><i class="far fa-bell"></i>&nbsp;Poll</button>
           <button v-on:click="openScript(script)"><i class="fas fa-edit"></i>&nbsp;Open</button>
@@ -19,7 +16,7 @@
       <p><input type="checkbox" v-model="script.active" v-on:click="activateScript(script)" /> Active</p>
     </div>
     <section>
-      <button v-on:click="newScript"><i class="fa fa-plus"></i>&nbsp;Add</button>
+      <button v-on:click="onNew"><i class="fa fa-plus"></i>&nbsp;Add</button>
     </section>
   </article>
 </app-page>