add opacity slider and properly debounce it

1 files changed, 14 insertions, 1 deletions

diff --git a/frontend/views/page/components/tile.form.js b/frontend/views/page/components/tile.form.js
index d4913fe..09fa57f 100644
--- a/frontend/views/page/components/tile.form.js
+++ b/frontend/views/page/components/tile.form.js
@@ -5,7 +5,10 @@ import { Link } from 'react-router-dom'
 
 import { session } from '../../../session'
 
-import { TextInput, NumberInput, ColorInput, Select, LabelDescription, TextArea, Checkbox, SubmitButton, Loader } from '../../../common'
+import {
+  TextInput, NumberInput, ColorInput, Slider,
+  Select, LabelDescription, TextArea, Checkbox,
+  SubmitButton, Loader } from '../../../common'
 import { preloadImage } from '../../../util'
 
 import * as tileActions from '../../tile/tile.actions'
@@ -325,6 +328,16 @@ class TileForm extends Component {
 
           {this.renderLinkForm()}
 
+          <Slider
+            title='Opacity'
+            name='opacity'
+            value={temporaryTile.settings.opacity}
+            onChange={this.handleSettingsSelect.bind(this)}
+            min={0}
+            max={1}
+            step={0.01}
+          />
+
           <div className='row buttons'>
             <SubmitButton
               title={submitTitle}