audio decoding

gui.rkt

@@ -36,6 +36,7 @@
 
 (define rktplayer%
   (class wv-window%
+    (init-field [log-file #f])
     (inherit-field settings icon)
 
     (super-new
@@ -48,6 +49,8 @@
     
     (define closed #f)
     (define el-seeker #f)
+    (define el-volume #f)
+    (define el-vol-perc #f)
     (define el-library #f)
     (define el-playlist #f)
     (define el-at #f)
@@ -71,6 +74,12 @@
     (define current-at-seconds 0)
     (define current-length-seconds 0)
 
+    (define/public (update-volume)
+      (let ((el (send this element 'volume-percentage)))
+        (let ((percentage (send player get-volume)))
+          (send el set-innerHTML! (sprintf "%s %d%" (tr "Volume:") percentage)))
+        )
+      )
     
     (define (update-time at-seconds length-seconds)
       (let ((as (inexact->exact (round at-seconds)))
@@ -98,6 +107,7 @@
                 (send el-seeker set! (format "~a" seeker)))
               )
             )
+          (send this update-volume)
           )
         )
       )
@@ -232,6 +242,9 @@
         )
       )
 
+    (define/public (log-file! file)
+      (set log-file file))
+
     (define/public (drop-tab! tab-id tab-idx)
       (when (= current-tab tab-idx)
         (send this stop))
@@ -315,18 +328,39 @@
 
       (super page-loaded oke)
 
+      (let ((el (send this element 'log-file)))
+        (send el set-innerHTML! (format "~a" log-file)))
+
       (ww-connect 'play play-or-pause)
       (ww-connect 'stop stop)
       (ww-connect 'prev previous-track)
       (ww-connect 'next next-track)
       (ww-connect 'repeat repeat)
       (ww-connect 'volume volume)
+      (ww-connect 'devtools devtools)
 
       (set! el-seeker (send this element 'seek))
       (dbg-rktplayer "el-seeker: ~a" (send el-seeker get))
-      (let ((seek-reactor (make-delayed-reactor 0.3 (λ (percentage) (send this seek-to percentage)))))
+      (let ((seek-reactor (webview-delayed-reactor 0.3
+                              (λ (percentage)
+                                ;(displayln (format "el-seeker: ~a" percentage))
+                                (send this seek-to percentage)))))
         (send el-seeker on-change! seek-reactor))
 
+      (set! el-volume (send this element 'volume-range))
+      (set! el-vol-perc (send this element 'volume-perc))
+      (dbg-rktplayer "el-volume: ~a" (send el-volume get))
+      (let ((volume-reactor (webview-delayed-reactor 1.0
+                                (λ (volume-range)
+                                  (let ((percentage (* volume-range volume-range)))
+                                    (send this set-volume! percentage)))
+                                #:update (λ (val)
+                                           (let ((p (* val val)))
+                                             (send el-vol-perc set-innerHTML! (sprintf "%d%" p))
+                                             )))))
+        (send el-volume on-change! volume-reactor))
+                            
+
       (set! el-library (send this element 'library))
       (set! el-playlist (send this element 'tracks))
 
@@ -365,6 +399,7 @@
               )
         (update-track-nr current-track-nr)
         )
+      (send this update-volume)
       )
 
     (define/public (scroll-top id)
@@ -524,7 +559,20 @@
       )
 
     (define/public (volume)
-      (dbg-rktplayer "Volume")
+      (let* ((volume-meter (send this element 'volume-meter))
+             (volume-display (send volume-meter display))
+             )
+        (if (eq? volume-display 'block)
+            (send volume-meter display 'none)
+            (send volume-meter display 'block))
+        (send el-vol-perc set-innerHTML!
+              (sprintf "%d%" (send player get-volume)))
+        )
+      )
+
+    (define/public (set-volume! percentage)
+      (send player set-volume! percentage)
+      (send this update-volume)
       )
 
     (define/public (seek-to percentage)

gui/rktplayer.html

@@ -18,7 +18,13 @@
 		<div class="text-block"><span id="time" class="time">00:00:00</span></div>
 		<div class="text-block"><span id="totaltime" class="time">00:00:00</span></div>
 		<button id="repeat" class="command"><img id="repeat-img" src="buttons/repeat-off.svg" /></button>
-		<button id="volume" class="command"><img id="volume-img" src="buttons/volume-high.svg" /></button>
+		<button id="volume" class="command">
+			<img id="volume-img" src="buttons/volume-high.svg" />
+			<div id="volume-meter" class="volume-meter">
+				<div class="status"><span class="info" id="volume-perc"></span></div>
+				<input type="range" min="0" max="13" value="10" class="v-slider" id="volume-range" step="0.5" />
+			</div>
+		</button>
 	</div>
         <div class="hpane">
 	        <div class="music-info">
@@ -44,6 +50,11 @@
        </div>
        <div class="status">
 			<span class="info" id="bits"></span><span class="info" id="rate"></span><span class="info" id="channels"></span>
+			<div class="right">
+				<span class="info" id="volume-percentage"></span>
+				<span class="info" id="log-file"></span>
+				<button id="devtools" class="devtools"><img src="devtools.svg" /></button>
+			</div>
        </div>
   </div>
 </body>

gui/styles.css

@@ -29,11 +29,14 @@ button {
 	border-right: 1px solid #505050;
 }
 
-button:hover {
+button:hover, button.devtools:hover {
    background: #909090;
    transition: all 0.5s ease-in;
 }
 
+button.devtools {
+	background: black;
+}
 
 button.command {
 	margin: 0;
@@ -261,11 +264,70 @@ div.status {
 	border-left: 1px solid #505050;
 }
 
-div.status span.info {
+div.status div.right {
+	float: right;
+	margin-top: 0;
+	padding-top: 0;
+}
+
+div.status span.info, div.status div.right span.info {
 	padding-left: 5px;
 	padding-right: 5px;
 	border-right: 1px solid #505050;
 	color: #d0d0d0;
+	vertical-align: top;
+}
+
+button.devtools {
+	height: 1.6em;
+	height: 1.6em;
+	margin: 0;
+	padding: 0;
+	margin-top: 3px;
+}
+
+button.devtools img {
+	width: 100%;
+	height: 100%;
+	margin: 0;
+	padding: 0;
+}
+
+div.volume-meter {
+	display: none;
+	position: relative;
+	left: 0;
+	top: 0;
+	z-index: 1000;
+	background: #e0e0e0;
+	border: 1px solid #505050;
+	/*border-radius: 1em;*/
+	padding-top: 5px;
+	padding-bottom: 5px;
+}
+
+div.volume-meter div.status {
+	border: none;
+}
+
+div.volume-meter div.status span.info {
+	font-weight: bold;
+	color: black;
+	font-size: 80%;
+	border: none;
+	padding: 0;
+}
+
+div.volume-meter:hover {
+	background: #909090;
+    transition: all 0.5s ease-in;
+}
+
+input.v-slider {
+	writing-mode: vertical-lr;
+	direction: rtl;
 }
 
 
+
+       

player.rkt

@@ -30,6 +30,7 @@
     (define closing #f)
     (define pause #f)
     (define repeat-state 'no-repeat)
+    (define volume 100.0)
     
     (define ao-handle #f)
     (define flac-handle #f)
@@ -64,6 +65,8 @@
             )
           )
         )
+      (when (not (= (ao-volume ao-handle) volume))
+        (ao-set-volume! ao-handle volume))
       )
 
     (define (start-play-time-updater)
@@ -274,6 +277,15 @@
       (stop-and-clear)
       )
 
+    (define/public (set-volume! percentage)
+      (set! volume percentage)
+      (unless (eq? ao-handle #f)
+        (ao-set-volume! ao-handle volume))
+      )
+
+    (define/public (get-volume)
+      volume)
+
     (define/public (next)
       (if (= (send pl length) 0)
           #f

rktplayer.rkt

@@ -18,9 +18,6 @@
 (sl-log-to-file log-file)
 ;(sl-log-to-display)
 
-(displayln (format "Logging to file ~a" log-file))
-
-
 (define (my-file-getter url)
   (dbg-rktplayer "my-file-getter - url = ~a" url)
   (when (string-prefix? url "/")
@@ -45,12 +42,13 @@
                        [ini ini]
                        [file-getter my-file-getter]
                        ))
-         (window (new rktplayer% [wv-context context]))
          )
-    ;(send window devtools)
+    (let (
+         (window (new rktplayer% [wv-context context] [log-file log-file]))
+         )
     (webview-wait-for-quit)
     (webview-exit)
-    (exit)
+    (exit))
     )
   )
 

utils.rkt

@@ -71,6 +71,7 @@
          (timer (new timer% [notify-callback timeout-check] [interval 100]))
         )
     (λ (val)
+      (dbg-rktplayer "delayed reactor: ~a" val)
       (set! last-val val)
       (set! last-time (current-milliseconds))
       )))