From cda9c115283be8e4e224f6036ba07e5eca243289 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Wed, 31 Mar 2021 17:37:40 +0200
Subject: refactor tile forms into own files. add full-width marquee support

---
 .../views/tile/forms/tile.form.element.video.js    | 101 +++++++++++++++++++++
 1 file changed, 101 insertions(+)
 create mode 100644 frontend/app/views/tile/forms/tile.form.element.video.js

(limited to 'frontend/app/views/tile/forms/tile.form.element.video.js')

diff --git a/frontend/app/views/tile/forms/tile.form.element.video.js b/frontend/app/views/tile/forms/tile.form.element.video.js
new file mode 100644
index 0000000..7220aa9
--- /dev/null
+++ b/frontend/app/views/tile/forms/tile.form.element.video.js
@@ -0,0 +1,101 @@
+import React from 'react'
+
+import {
+  TextInput, Slider,
+  Select, Checkbox,
+} from 'app/common'
+
+import { VIDEO_STYLES } from './tile.constants'
+
+export default function TileVideoForm({ tile, errorFields, parent }) {
+  return (
+    <div>
+      <div className='row imageUrl'>
+        <TextInput
+          title=""
+          placeholder='http://'
+          name="url"
+          required
+          data={tile.settings}
+          error={errorFields.has('url')}
+          onChange={parent.handleVideoChange}
+          autoComplete="off"
+        />
+      </div>
+      <div className='row pair with_checkbox'>
+        <Select
+          name='video_style'
+          selected={tile.settings.video_style || 'none'}
+          options={VIDEO_STYLES}
+          title=''
+          onChange={parent.handleSettingsSelect}
+        />
+        <Checkbox
+          label="Loop"
+          name="loop"
+          checked={tile.settings.loop}
+          onChange={parent.handleSettingsSelect}
+          autoComplete="off"
+        />
+      </div>
+      <div className='row pair'>
+        <Checkbox
+          label="Muted"
+          name="muted"
+          className='short'
+          checked={tile.settings.muted}
+          onChange={parent.handleSettingsSelect}
+        />
+        <Checkbox
+          label="Autoadvance"
+          name="autoadvance"
+          className='short'
+          checked={tile.settings.autoadvance}
+          onChange={parent.handleSettingsSelect}
+        />
+      </div>
+      {!tile.settings.muted && (
+        <Slider
+          title='Volume'
+          name='volume'
+          value={('volume' in tile.settings) ? tile.settings.volume : 1.0}
+          onChange={parent.handleSettingsSelect}
+          min={0.0}
+          max={1.0}
+          step={0.01}
+        />
+      )}
+      {tile.settings.loop && (
+        <div className='row'>
+          <Checkbox
+            label="Loop section?"
+            className='short'
+            name="loop_section"
+            checked={tile.settings.loop_section}
+            onChange={parent.handleSettingsSelect}
+          />
+        </div>
+      )}
+      {tile.settings.loop && tile.settings.loop_section && (
+        <div className='row pair'>
+          <TextInput
+            title="From"
+            placeholder='0:00'
+            name="loop_start"
+            data={tile.settings}
+            onChange={parent.handleSettingsChange}
+            autoComplete="off"
+          />
+          <TextInput
+            title="To"
+            placeholder='0:00'
+            name="loop_end"
+            data={tile.settings}
+            onChange={parent.handleSettingsChange}
+            autoComplete="off"
+          />
+        </div>
+      )}
+    </div>
+  )
+}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2