From 852b4d626cddac12fa8097be6bcff183f228bf52 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Thu, 18 May 2017 23:26:05 +0200
Subject: okpush

---
 lib/okpush/templates/partials/inputs.liquid | 395 ++++++++++++++++++++++++++++
 1 file changed, 395 insertions(+)
 create mode 100644 lib/okpush/templates/partials/inputs.liquid

(limited to 'lib/okpush/templates/partials/inputs.liquid')

diff --git a/lib/okpush/templates/partials/inputs.liquid b/lib/okpush/templates/partials/inputs.liquid
new file mode 100644
index 0000000..60466de
--- /dev/null
+++ b/lib/okpush/templates/partials/inputs.liquid
@@ -0,0 +1,395 @@
+{% for pair in resource.spec %}
+  {% assign name = pair[0] %}
+  {% assign spec = pair[1] %}
+  {% assign type = spec.type %}
+
+  <div class="property {{type}} {% if spec.hidden %}hidden{% endif %}"
+       data-name="{{name}}">
+    <label for="{{name}}">{{name | capitalize}}</label>
+
+    {% if type == 'string' %}
+      <input
+        name="{{name}}" type="text" value="{{spec.value | escape}}">
+    {% elsif type == 'text' %}
+      <textarea
+        name="{{name}}">{{spec.value | escape}}</textarea>
+    {% elsif type == 'number' %}
+      <input
+        type="number"
+        name="{{name}}" value="{{spec.value | escape}}">
+    {% elsif type == 'enum' or type == 'foreign-key' %}
+      <select
+        name="{{name}}">
+        {% for option in spec.options %}
+          {% if option.length == 2 %}
+            <option value="{{option[0]}}" {% if option[0] == spec.value %}selected{% endif %}>{{option[1] | capitalize}}</option>
+          {% else %}
+            <option value="{{option}}" {% if option == spec.value %}selected{% endif %}>{{option | capitalize}}</option>
+          {% endif %}
+        {% endfor %}
+      </select>
+    {% elsif type == 'video' %}
+      <div class="video group {% if spec.value.url %}loaded{% endif %}">
+        <input name="{{name}}[url]" type="text" value="{{spec.value.url}}" class="url" placeholder="Enter a video URL">
+        <input name="{{name}}[type]" type="hidden" value="{{spec.value.type}}" class="video-type" hidden>
+        <input name="{{name}}[token]" type="hidden" value="{{spec.value.token}}" class="video-token" hidden>
+        <input name="{{name}}[width]" value="{{spec.value.width}}" type="hidden" class="video-width" hidden>
+        <input name="{{name}}[height]" value="{{spec.value.height}}" type="hidden" class="video-height" hidden>
+        <label>Title</label>
+        <input name="{{name}}[title]" type="text" value="{{spec.value.title | escape}}" class="video-title">
+        <label>Thumbnail</label>
+        <input name="{{name}}[thumb]" type="text" value="{{spec.value.thumb | escape}}" class="video-thumb">
+      </div>
+    {% elsif type == 'image' %}
+      <div class="image group {% if spec.value.uri %}loaded{% endif %}">
+        <div class="fields">
+          <div class="add-image-button">
+            <input type="file" accept="image/*">
+            <button>+ Add image</button>
+          </div>
+          <input class="add-url" type="text" placeholder="+ Add URL">
+        </div>
+        <div class="image-element">
+          <input class="uri" type="hidden" name="{{name}}[uri]" value="{{spec.value.uri}}">
+          <textarea class="caption" name="{{name}}[caption]">{{spec.value.caption | escape}}</textarea>
+          <input type="hidden" name="{{name}}[width]" value="{{spec.value.width}}" class="image-width">
+          <input type="hidden" name="{{name}}[height]" value="{{spec.value.height}}" class="image-height">
+          <img src="{{spec.value.uri}}" alt="{{spec.value.caption | escape}}">
+          <button class="remove">x</button>
+        </div>
+      </div>
+
+    {% elsif type == 'date' %}
+
+      <div class="date">
+        <input name="{{name}}"
+               type="date"
+               {% if spec.value %}
+                 value="{{spec.value | date: '%Y-%m-%d'}}"
+               {% endif %}
+               >
+      </div>
+
+    {% elsif type == 'flag' %}
+
+      <div class="flag">
+        <input name="{{name}}"
+               type="checkbox"
+               {% if spec.value %}
+                checked="true"
+               {% endif %}
+               value="true">
+      </div>
+
+    {% elsif type == 'tag-list' %}
+      <div class="tag-list">
+        <input name="{{name}}"
+               value="{{spec.value | escape}}"
+               placeholder="Enter a comma separated list of tags.">
+      </div>
+
+    {% elsif type == 'link-list' %}
+      <div class="link-list group">
+        <ol class="links">
+          {% for link in spec.value %}
+            <li>
+              <div class="handle"></div>
+              <input
+                  name="{{name}}[{{forloop.index0}}][text]"
+                  value="{{link.text | escape}}"
+                  type="text"
+                  class="link-input link-text">
+              <input
+                  name="{{name}}[{{forloop.index0}}][uri]"
+                  value="{{link.uri | escape}}"
+                  type="text"
+                  class="link-input link-uri">
+              <button class="remove-link-btn btn">
+                -
+              </button>
+            </li>
+          {% endfor %}
+        </ol>
+        
+        <div class="handle"></div>
+        <input type="text"
+               class="link-input-new link-text"
+               placeholder="{% if spec.textLabel %}{{ spec.textLabel }}{% else %}Link text{% endif %}">
+        <input type="text"
+               class="link-input-new link-uri"
+               placeholder="{% if spec.linkLabel %}{{ spec.linkLabel }}{% else %}http://www.example.com{% endif %}">
+        <button class="add-link-btn btn">+</button>
+
+        <script type="text/html" class="link-template">
+          <li>
+            <div class="handle"></div>
+            <input
+                name="{{name}}[][text]"
+                value=""
+                type="text"
+                placeholder="{% if spec.textLabel %}{{ spec.textLabel }}{% else %}Link text{% endif %}"
+                class="link-input link-text">
+            <input
+                name="{{name}}[][uri]"
+                value=""
+                type="text"
+                placeholder="{% if spec.linkLabel %}{{ spec.linkLabel }}{% else %}http://www.example.com{% endif %}"
+                class="link-input link-uri">
+            <button class="remove-link-btn btn">
+              -
+            </button>
+          </li>
+        </script>
+
+      </div>
+
+    {% elsif type == 'media-list' or type == 'media' %}
+      <div class="media-list group loaded">
+        <div class="fields">
+          <div class="add-image-button">
+            <input type="file" multiple>
+            <button>+ Add media</button>
+          </div>
+          <input class="add-url" type="text" placeholder="+ Add Image/Video/Link URL">
+        </div>
+
+        <script type="text/html" class="image-template">
+          <li class="image-element">
+            <label>Caption</label>
+            <input class="uri" type="hidden" name="{{name}}[][uri]" value="">
+            <textarea class="caption" name="{{name}}[][caption]"></textarea>
+            <input type="hidden" name="{{name}}[][type]" value="image">
+            <input type="hidden" name="{{name}}[][width]" class="image-width" hidden>
+            <input type="hidden" name="{{name}}[][height]" class="image-height" hidden>
+            <img>
+            <button class="remove">x</button>
+          </li>
+        </script>
+
+        <script type="text/html" class="video-template">
+          <li class="video-element">
+            <div style="float: left">
+            <input name="{{name}}[][type]" type="hidden" class="video-type" hidden>
+            <input name="{{name}}[][token]" type="hidden" class="video-token" hidden>
+            <input name="{{name}}[][uri]" type="hidden" class="video-uri" hidden>
+            <input name="{{name}}[][width]" type="hidden" class="video-width" hidden>
+            <input name="{{name}}[][height]" type="hidden" class="video-height" hidden>
+            <label>Caption</label>
+            <input name="{{name}}[][title]" type="text" class="video-title">
+            <label>Thumbnail</label>
+            <input name="{{name}}[][thumb]" type="text" class="video-thumb">
+            <span class="checkboxes">
+              <input name="{{name}}[][autoplay]" value="{{image.autoplay}}" type="checkbox" class="video-autoplay flag">
+              <label>Autoplay</label>
+              <input name="{{name}}[][loop]" value="{{image.loop}}" type="checkbox" class="video-loop flag">
+              <label>Loop</label>
+            </span>
+            </div>
+            <img>
+            <button class="remove">x</button>
+          </li>
+        </script>
+
+        <script type="text/html" class="audio-template">
+          <li class="audio-element">
+            <div style="float: left">
+            <input name="{{name}}[][type]" type="hidden" class="audio-type" hidden>
+            <input name="{{name}}[][token]" type="hidden" class="audio-token" hidden>
+            <input name="{{name}}[][uri]" type="hidden" class="audio-uri" hidden>
+            <input name="{{name}}[][duration]" value="{{image.duration}}" type="hidden" class="audio-duration" hidden>
+            <label>Caption</label>
+            <input name="{{name}}[][title]" type="text" class="audio-title">
+            <label>Thumbnail</label>
+            <input name="{{name}}[][thumb]" type="text" class="audio-thumb">
+            </div>
+            <img>
+            <button class="remove">x</button>
+          </li>
+        </script>
+
+        <script type="text/html" class="link-template">
+          <li class="link-element">
+            <input class="uri" type="text" name="{{name}}[][uri]" value="">
+            <textarea class="caption" name="{{name}}[][caption]" placeholder="Caption"></textarea>
+            <input type="hidden" name="{{name}}[][type]" value="link">
+            <button class="remove">x</button>
+          </li>
+        </script>
+        
+        <ol>
+          {% for image in spec.value %}
+            {% if image.type and (image.type == "vimeo" or image.type == "youtube" or image.type == "video") %}
+              <li class="video-element">
+                <div style="float: left">
+                <input name="{{name}}[{{forloop.index0}}][type]" value="{{image.type}}" type="hidden" class="video-type" hidden>
+                <input name="{{name}}[{{forloop.index0}}][token]" value="{{image.token}}" type="hidden" class="video-token" hidden>
+                <input name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}" type="hidden" class="video-uri" hidden>
+                <input name="{{name}}[{{forloop.index0}}][width]" value="{{image.width}}" type="hidden" class="video-width" hidden>
+                <input name="{{name}}[{{forloop.index0}}][height]" value="{{image.height}}" type="hidden" class="video-height" hidden>
+                <label>Caption</label>
+                <input name="{{name}}[{{forloop.index0}}][title]" value="{{image.title | escape}}" type="text" class="video-title">
+                <label>Thumbnail</label>
+                <input name="{{name}}[{{forloop.index0}}][thumb]" value="{{image.thumb}}" type="text" class="video-thumb">
+                <span class="checkboxes">
+                  <input name="{{name}}[{{forloop.index0}}][autoplay]" value="true" {% if image.autoplay == "true" %}checked="true"{% endif %} type="checkbox" class="flag video-autoplay">
+                  <label>Autoplay</label>
+                  <input name="{{name}}[{{forloop.index0}}][loop]" value="true" {% if image.loop == "true" %}checked="true"{% endif %} type="checkbox" class="flag video-loop">
+                  <label>Loop</label>
+                </span>
+                </div>
+                <img src="{{image.thumb}}">
+                <button class="remove">x</button>
+              </li>
+            {% elsif image.type and (image.type == "audio" or image.type == "soundcloud") %}
+              <li class="audio-element">
+                <div style="float: left">
+                <input name="{{name}}[{{forloop.index0}}][type]" value="{{image.type}}" type="hidden" class="audio-type" hidden>
+                <input name="{{name}}[{{forloop.index0}}][token]" value="{{image.token}}" type="hidden" class="audio-token" hidden>
+                <input name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}" type="hidden" class="audio-uri" hidden>
+                <input name="{{name}}[{{forloop.index0}}][duration]" value="{{image.duration}}" type="hidden" class="audio-duration" hidden>
+                <label>Caption</label>
+                <input name="{{name}}[{{forloop.index0}}][title]" value="{{image.title | escape}}" type="text" class="audio-title">
+                <label>Thumbnail</label>
+                <input name="{{name}}[{{forloop.index0}}][thumb]" value="{{image.thumb}}" type="text" class="audio-thumb">
+                </div>
+                <img src="{{image.thumb}}">
+                <button class="remove">x</button>
+              </li>
+            {% elsif image.type and image.type == "link" %}
+              <li class="link-element">
+                <input class="uri" type="text" name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}">
+                <textarea class="caption" name="{{name}}[{{forloop.index0}}][caption]" placeholder="Caption">{{image.caption | escape}}</textarea>
+                <input type="hidden" name="{{name}}[{{forloop.index0}}][type]" value="link">
+                <button class="remove">x</button>
+              </li>
+            {% else %}
+              <li class="image-element">
+                <label>Caption</label>
+                <input type="hidden" name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}">
+                <input name="{{name}}[{{forloop.index0}}][width]" value="{{image.width}}" type="hidden" class="image-width" hidden>
+                <input name="{{name}}[{{forloop.index0}}][height]" value="{{image.height}}" type="hidden" class="image-height" hidden>
+                <textarea class="caption" name="{{name}}[{{forloop.index0}}][caption]">{{image.caption | escape}}</textarea>
+                <input type="hidden" name="{{name}}[{{forloop.index0}}][type]" value="image">
+                <img src="{{image.uri}}" alt="{{image.caption | strip_html}}">
+                <button class="remove">x</button>
+              </li>
+            {% endif %}
+          {% endfor %}
+        </ol>
+      </div>
+    {% elsif type == 'captioned-image-list' or type == 'gallery' %}
+      <div class="image-list group loaded">
+        <div class="fields">
+          <div class="add-image-button">
+            <input type="file" accept="image/*" multiple>
+            <button>+ Add images</button>
+          </div>
+          <input class="add-url" type="text" placeholder="+ Add URL">
+        </div>
+
+        <script type="text/html" class="image-template">
+          <li class="image-element">
+            <input class="uri" type="hidden" name="{{name}}[][uri]" value="">
+            <input type="hidden" name="{{name}}[][width]" class="image-width" hidden>
+            <input type="hidden" name="{{name}}[][height]" class="image-height" hidden>
+            <textarea class="caption" name="{{name}}[][caption]"></textarea>
+            <img>
+            <button class="remove">x</button>
+          </li>
+        </script>
+
+        <ol>
+          {% for image in spec.value %}
+            <li class="image-element">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][width]" value="{{image.width}}" class="image-width">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][height]" value="{{image.height}}" class="image-height">
+              <textarea class="caption" name="{{name}}[{{forloop.index0}}][caption]">{{image.caption | escape}}</textarea>
+              <img src="{{image.uri}}" alt="{{image.caption | strip_html}}">
+              <button class="remove">x</button>
+            </li>
+          {% endfor %}
+        </ol>
+      </div>
+    {% elsif type == 'double-captioned-image-list' %}
+      <div class="image-list group loaded">
+        <div class="fields">
+          <div class="add-image-button">
+            <input type="file" accept="image/*" multiple>
+            <button>+ Add images</button>
+          </div>
+          <input class="add-url" type="text" placeholder="+ Add URL">
+        </div>
+
+        <script type="text/html" class="image-template">
+          <li class="image-element">
+            <img>
+            <button class="remove">x</button>
+            <input class="uri" type="hidden" name="{{name}}[][uri]" value="">
+            <input type="hidden" name="{{name}}[][width]" class="image-width">
+            <input type="hidden" name="{{name}}[][height]" class="image-height">
+            <input class="caption" name="{{name}}[][label]" placeholder="Name">
+            <input class="caption" name="{{name}}[][caption]" placeholder="Email">
+          </li>
+        </script>
+
+        <ol>
+          {% for image in spec.value %}
+            <li class="image-element">
+              <img src="{{image.uri}}" alt="{{image.caption | strip_html}}">
+              <button class="remove">x</button>
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][width]" value="{{image.width}}" class="image-width">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][height]" value="{{image.height}}" class="image-height">
+              <input class="caption" name="{{name}}[{{forloop.index0}}][label]" value="{{image.label | escape}}" placeholder="Name">
+              <input class="caption" name="{{name}}[{{forloop.index0}}][caption]" value="{{image.caption | escape}}"  placeholder="Email">
+            </li>
+          {% endfor %}
+        </ol>
+      </div>
+    {% elsif type == 'triple-captioned-image-list' %}
+      <div class="image-list group loaded">
+        <div class="fields">
+          <div class="add-image-button">
+            <input type="file" accept="image/*" multiple>
+            <button>+ Add images</button>
+          </div>
+          <input class="add-url" type="text" placeholder="+ Add URL">
+        </div>
+
+        <script type="text/html" class="image-template">
+          <li class="image-element">
+            <img>
+            <button class="remove">x</button>
+            <input class="uri" type="hidden" name="{{name}}[][uri]" value="">
+            <input type="hidden" name="{{name}}[][width]" class="image-width">
+            <input type="hidden" name="{{name}}[][height]" class="image-height">
+            <input class="caption" name="{{name}}[][label]" placeholder="Label">
+            <input class="caption" name="{{name}}[][caption]" placeholder="Caption">
+            <input class="caption" name="{{name}}[][code]" placeholder="Code">
+          </li>
+        </script>
+
+        <ol>
+          {% for image in spec.value %}
+            <li class="image-element">
+              <img src="{{image.uri}}" alt="{{image.caption | strip_html}}">
+              <button class="remove">x</button>
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][uri]" value="{{image.uri}}">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][width]" value="{{image.width}}" class="image-width">
+              <input type="hidden" name="{{name}}[{{forloop.index0}}][height]" value="{{image.height}}" class="image-height">
+              <input class="caption" name="{{name}}[{{forloop.index0}}][label]" value="{{image.label | escape}}" placeholder="Label">
+              <input class="caption" name="{{name}}[{{forloop.index0}}][caption]" value="{{image.caption | escape}}"  placeholder="Caption">
+              <input class="caption" name="{{name}}[{{forloop.index0}}][code]" value="{{image.code | escape}}"  placeholder="Code">
+            </li>
+          {% endfor %}
+        </ol>
+      </div>
+    {% elsif type == 'meta' %}
+      <input class="hidden" type="hidden" name="{{name}}" value="{{spec.value}}">
+    {% else %}
+      <p><pre style="color: red">Admin template doesn't support '{{type}}' properties!</pre></p>
+    {% endif %}
+  </div>
+
+{% endfor %}
-- 
cgit v1.2.3-70-g09d2