From 2bc99b7dee0ac5430b6e8eb552f220a94e81a850 Mon Sep 17 00:00:00 2001
From: Tatu Tarvainen <tatu.tarvainen@solita.fi>
Date: Mon, 15 Jan 2024 16:40:33 +0200
Subject: [PATCH] Add example with slider to set time

---
 src/LiveWeb-Examples/LWAnalogClock.class.st | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/LiveWeb-Examples/LWAnalogClock.class.st b/src/LiveWeb-Examples/LWAnalogClock.class.st
index 55ee880..4001788 100644
--- a/src/LiveWeb-Examples/LWAnalogClock.class.st
+++ b/src/LiveWeb-Examples/LWAnalogClock.class.st
@@ -23,6 +23,22 @@ LWAnalogClock class >> exampleThreeOClock [
 	^ aLWAnalogClock class new time: (Time hour: 15 minute: 7 second: 20)
 ]
 
+{ #category : #'as yet unclassified' }
+LWAnalogClock class >> exampleWithSlider [ 
+  <lwExample: 'Slider to set any time of day'>
+	| aLWAnalogClock range |
+		aLWAnalogClock := self new time: (Time seconds: 0).
+		range := LWBlockContainer new block: [ :h | 
+			h div: {#width->'100%'} with: [
+				 h input: { #value -> 0. #width -> '100%'.
+ 								#type -> 'range'. #min -> 0. #max -> 43200.
+								#style -> 'display: inline-block; width: 100%;'.
+ 								#oninput -> (Js call: [ :v | aLWAnalogClock time: (Time seconds: v asInteger) ] with: 'window.event.target.value')}] ].
+	^ LWContainer new
+		add: aLWAnalogClock;
+		add: range; yourself
+]
+
 { #category : #initialization }
 LWAnalogClock >> initialize [ 
   super initialize.