Mercurial > code > home > repos > light9
comparison web/ascoltami/Light9AscoltamiUi.ts @ 2448:2ce77421c0b7
put a big time display on ascoltami
author | drewp@bigasterisk.com |
---|---|
date | Mon, 03 Jun 2024 16:35:49 -0700 |
parents | 06da5db2fafe |
children |
comparison
equal
deleted
inserted
replaced
2447:361c612e3c60 | 2448:2ce77421c0b7 |
---|---|
67 } | 67 } |
68 | 68 |
69 th { | 69 th { |
70 text-align: right; | 70 text-align: right; |
71 } | 71 } |
72 #bigTime { | |
73 color: green; | |
74 font-size: 60pt; | |
75 } | |
72 `, | 76 `, |
73 ]; | 77 ]; |
74 | 78 |
75 constructor() { | 79 constructor() { |
76 super(); | 80 super(); |
115 render() { | 119 render() { |
116 return html` | 120 return html` |
117 <h1>ascoltami on ${this.host}</h1> | 121 <h1>ascoltami on ${this.host}</h1> |
118 | 122 |
119 <span><rdfdb-synced-graph></rdfdb-synced-graph></span> | 123 <span><rdfdb-synced-graph></rdfdb-synced-graph></span> |
120 <div id="mainRow"> | 124 <div id="mainRow"> |
125 <div> | |
121 <light9-song-listing | 126 <light9-song-listing |
122 @selectsong=${(ev: any) => { | 127 @selectsong=${(ev: any) => { |
123 this.selectedSong = ev.detail.song; | 128 this.selectedSong = ev.detail.song; |
124 }} | 129 }} |
125 .selectedSong=${this.selectedSong} | 130 .selectedSong=${this.selectedSong} |
126 ></light9-song-listing> | 131 ></light9-song-listing> |
132 <div id="bigTime">t=${this.playerTime.toFixed(1)}</div> | |
133 </div> | |
127 <div> | 134 <div> |
128 <light9-ascoltami-timeline .playerState=${this.playerState} .playerTime=${this.playerTime}></light9-ascoltami-timeline> | 135 <light9-ascoltami-timeline .playerState=${this.playerState} .playerTime=${this.playerTime}></light9-ascoltami-timeline> |
129 <div> | 136 <div> |
130 <button ?disabled=${this.selectedSong == null} @click=${this.onLoadSelected}>Change to and play selected <span class="keyCap">l</span></button> | 137 <button ?disabled=${this.selectedSong == null} @click=${this.onLoadSelected}>Change to and play selected <span class="keyCap">l</span></button> |
131 <button ?disabled=${false} @click=${this.onCmdZero}>Seek to zero <span class="keyCap">z</span></button> | 138 <button ?disabled=${false} @click=${this.onCmdZero}>Seek to zero <span class="keyCap">z</span></button> |