show group on hover

1 files changed, 23 insertions, 2 deletions

diff --git a/frontend/app/views/tile/forms/tile.form.misc.js b/frontend/app/views/tile/forms/tile.form.misc.js
index fd72ad3..68b659c 100644
--- a/frontend/app/views/tile/forms/tile.form.misc.js
+++ b/frontend/app/views/tile/forms/tile.form.misc.js
@@ -5,9 +5,9 @@ import {
   Select, Checkbox, Slider,
 } from 'app/common'
 
-import { UNITS } from './tile.constants'
+import { UNITS, NO_POPUP } from './tile.constants'
 
-export default function TileMiscForm({ tile, parent }) {
+export default function TileMiscForm({ tile, parent, popupList }) {
   return (
     <div>
       <div className='row single'>
@@ -70,6 +70,7 @@ export default function TileMiscForm({ tile, parent }) {
           <TextInput
             title="Popup group"
             name="popup_group"
+            placeholder="Enter group name"
             data={tile.settings}
             onChange={parent.handleSettingsChange}
             autoComplete="off"
@@ -89,6 +90,7 @@ export default function TileMiscForm({ tile, parent }) {
           <TextInput
             title="Appear after"
             name="appear_after"
+            placeholder="0:00"
             data={tile.settings}
             onChange={parent.handleSettingsChange}
             autoComplete="off"
@@ -96,6 +98,25 @@ export default function TileMiscForm({ tile, parent }) {
         </div>
       )}
       <Checkbox
+        label="Show popup on hover"
+        name="show_popup_on_hover"
+        className='short'
+        checked={tile.settings.show_popup_on_hover}
+        onChange={parent.handleSettingsSelect}
+        autoComplete="off"
+      />
+      {tile.settings.show_popup_on_hover && (
+        <div className='row single'>
+          <Select
+            title="Popup"
+            name='on_hover_popup'
+            selected={tile.settings.on_hover_popup || NO_POPUP}
+            options={popupList}
+            onChange={parent.handleSettingsSelect}
+          />
+        </div>
+      )}
+      <Checkbox
         label="Hide on click"
         name="hide_on_click"
         className='short'