Skip to content

Commit efaba23

Browse files
badaixbadaix
committed
Clean up
1 parent 01f0e7d commit efaba23

File tree

3 files changed

+13
-168
lines changed

3 files changed

+13
-168
lines changed

‎changelog.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
### Features
66

77
- Show client name in Client settings
8-
- Snapweb be installed as PWA
8+
- PWA ready
99

1010
### Bugfixes
1111

@@ -14,7 +14,7 @@
1414

1515
### General
1616

17-
- Switch from Create React App (deprecated) to Vite
17+
- Switch from the deprecated Create React App (CRA) to Vite
1818

1919
_Johannes Pohl <snapweb@badaix.de> Sat, 24 Feb 2024 00:13:37 +0200_
2020

‎src/components/SnapWeb.tsx

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,10 @@ export default function SnapWeb(props: SnapWebProps) {
113113
}
114114

115115
function updateMediaSession() {
116+
// https://developers.google.com/web/updates/2017/02/media-session
117+
// https://github.com/googlechrome/samples/tree/gh-pages/media-session
118+
// https://googlechrome.github.io/samples/media-session/audio.html
119+
// https://developer.mozilla.org/en-US/docs/Web/API/MediaSession/setActionHandler#seekto
116120
console.debug('updateMediaSession');
117121
if (!snapstreamRef.current)
118122
return;
@@ -147,17 +151,20 @@ export default function SnapWeb(props: SnapWebProps) {
147151
if (properties.playbackStatus !== undefined) {
148152
if (properties.playbackStatus === "playing") {
149153
console.debug('updateMediaSession: playing');
150-
audioRef.current.play();
154+
if (audioRef.current.paused)
155+
audioRef.current.play();
151156
play_state = "playing";
152157
}
153158
else if (properties.playbackStatus === "paused") {
154159
console.debug('updateMediaSession: paused');
155-
audioRef.current.pause();
160+
if (!audioRef.current.paused)
161+
audioRef.current.pause();
156162
play_state = "paused";
157163
}
158164
else if (properties.playbackStatus === "stopped") {
159165
console.debug('updateMediaSession: stopped');
160-
audioRef.current.pause();
166+
if (!audioRef.current.paused)
167+
audioRef.current.pause();
161168
play_state = "none";
162169
}
163170
}

‎src/snapcontrol.ts

Lines changed: 1 addition & 163 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
// let audio: HTMLAudioElement = document.createElement('audio');
2-
31
namespace Snapcast {
42

53
export class Host {
@@ -204,7 +202,7 @@ namespace Snapcast {
204202
this.groups = []
205203
for (const jgroup of json.groups)
206204
this.groups.push(new Group(jgroup));
207-
const jsnapserver: any = json.server.snapserver;
205+
const jsnapserver: any = json.server.snapserver;
208206
this.server = { host: new Host(json.server.host), snapserver: { controlProtocolVersion: jsnapserver.controlProtocolVersion, name: jsnapserver.name, protocolVersion: jsnapserver.protocolVersion, version: jsnapserver.version } };
209207
this.streams = []
210208
for (const jstream of json.streams) {
@@ -297,180 +295,23 @@ class SnapControl {
297295
return true;
298296
case 'Group.OnStreamChanged':
299297
this.getGroup(notification.params.id).stream_id = notification.params.stream_id;
300-
this.updateProperties(notification.params.stream_id);
301298
return true;
302299
case 'Stream.OnUpdate':
303300
stream = this.getStream(notification.params.id);
304301
stream.fromJson(notification.params.stream);
305-
this.updateProperties(stream.id);
306302
return true;
307303
case 'Server.OnUpdate':
308304
this.server.fromJson(notification.params.server);
309-
// this.updateProperties(this.getMyStreamId());
310305
return true;
311306
case 'Stream.OnProperties':
312307
stream = this.getStream(notification.params.id);
313308
stream.properties.fromJson(notification.params.properties);
314-
// if (this.onStreamChange) {
315-
// this.onStreamChange(stream.id);
316-
// }
317-
// if (this.getMyStreamId() === stream.id)
318-
// this.updateProperties(stream.id);
319309
return true;
320310
default:
321311
return false;
322312
}
323313
}
324314

325-
public updateProperties(_stream_id: string) {
326-
}
327-
// if (!('mediaSession' in navigator)) {
328-
// console.log('updateProperties: mediaSession not supported');
329-
// return;
330-
// }
331-
332-
// if (stream_id !== this.getMyStreamId()) {
333-
// console.log('updateProperties: not my stream id: ' + stream_id + ', mine: ' + this.getMyStreamId());
334-
// return;
335-
// }
336-
337-
// let props!: Properties;
338-
// let metadata!: Metadata;
339-
// try {
340-
// props = this.getStreamFromClient(SnapStream.getClientId()).properties;
341-
// metadata = this.getStreamFromClient(SnapStream.getClientId()).properties.metadata;
342-
// }
343-
// catch (e) {
344-
// console.log('updateProperties failed: ' + e);
345-
// return;
346-
// }
347-
348-
// https://developers.google.com/web/updates/2017/02/media-session
349-
// https://github.com/googlechrome/samples/tree/gh-pages/media-session
350-
// https://googlechrome.github.io/samples/media-session/audio.html
351-
// https://developer.mozilla.org/en-US/docs/Web/API/MediaSession/setActionHandler#seekto
352-
// console.log('updateProperties: ', props);
353-
// let play_state: MediaSessionPlaybackState = "none";
354-
// if (props.playbackStatus != undefined) {
355-
// if (props.playbackStatus == "playing") {
356-
// audio.play();
357-
// play_state = "playing";
358-
// }
359-
// else if (props.playbackStatus == "paused") {
360-
// audio.pause();
361-
// play_state = "paused";
362-
// }
363-
// else if (props.playbackStatus == "stopped") {
364-
// audio.pause();
365-
// play_state = "none";
366-
// }
367-
// }
368-
369-
// let mediaSession = navigator.mediaSession!;
370-
// mediaSession.playbackState = play_state;
371-
// console.log('updateProperties playbackState: ', navigator.mediaSession!.playbackState);
372-
// // if (props.canGoNext == undefined || !props.canGoNext!)
373-
// mediaSession.setActionHandler('play', () => {
374-
// props.canPlay ?
375-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'play' }) : null
376-
// });
377-
// mediaSession.setActionHandler('pause', () => {
378-
// props.canPause ?
379-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'pause' }) : null
380-
// });
381-
// mediaSession.setActionHandler('previoustrack', () => {
382-
// props.canGoPrevious ?
383-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'previous' }) : null
384-
// });
385-
// mediaSession.setActionHandler('nexttrack', () => {
386-
// props.canGoNext ?
387-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'next' }) : null
388-
// });
389-
// try {
390-
// mediaSession.setActionHandler('stop', () => {
391-
// props.canControl ?
392-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'stop' }) : null
393-
// });
394-
// } catch (error) {
395-
// console.log('Warning! The "stop" media session action is not supported.');
396-
// }
397-
398-
// let defaultSkipTime: number = 10; // Time to skip in seconds by default
399-
// mediaSession.setActionHandler('seekbackward', (event: MediaSessionActionDetails) => {
400-
// let offset: number = (event.seekOffset || defaultSkipTime) * -1;
401-
// if (props.position != undefined)
402-
// Math.max(props.position! + offset, 0);
403-
// props.canSeek ?
404-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'seek', params: { 'offset': offset } }) : null
405-
// });
406-
407-
// mediaSession.setActionHandler('seekforward', (event: MediaSessionActionDetails) => {
408-
// let offset: number = event.seekOffset || defaultSkipTime;
409-
// if ((metadata.duration != undefined) && (props.position != undefined))
410-
// Math.min(props.position! + offset, metadata.duration!);
411-
// props.canSeek ?
412-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'seek', params: { 'offset': offset } }) : null
413-
// });
414-
415-
// try {
416-
// mediaSession.setActionHandler('seekto', (event: MediaSessionActionDetails) => {
417-
// let position: number = event.seekTime || 0;
418-
// if (metadata.duration != undefined)
419-
// Math.min(position, metadata.duration!);
420-
// props.canSeek ?
421-
// this.sendRequest('Stream.Control', { id: stream_id, command: 'setPosition', params: { 'position': position } }) : null
422-
// });
423-
// } catch (error) {
424-
// console.log('Warning! The "seekto" media session action is not supported.');
425-
// }
426-
427-
// if ((metadata.duration != undefined) && (props.position != undefined) && (props.position! <= metadata.duration!)) {
428-
// if ('setPositionState' in mediaSession) {
429-
// console.log('Updating position state: ' + props.position! + '/' + metadata.duration!);
430-
// mediaSession.setPositionState!({
431-
// duration: metadata.duration!,
432-
// playbackRate: 1.0,
433-
// position: props.position!
434-
// });
435-
// }
436-
// }
437-
// else {
438-
// mediaSession.setPositionState!({
439-
// duration: 0,
440-
// playbackRate: 1.0,
441-
// position: 0
442-
// });
443-
// }
444-
445-
446-
// console.log('updateMetadata: ', metadata);
447-
// // https://github.com/Microsoft/TypeScript/issues/19473
448-
// let title: string = metadata.title || "Unknown Title";
449-
// let artist: string = (metadata.artist != undefined) ? metadata.artist.join(', ') : "Unknown Artist";
450-
// let album: string = metadata.album || "";
451-
// let artwork: Array<MediaImage> = [{ src: 'snapcast-512.png', sizes: '512x512', type: 'image/png' }];
452-
// if (metadata.artUrl != undefined) {
453-
// artwork = [
454-
// { src: metadata.artUrl!, sizes: '96x96', type: 'image/png' },
455-
// { src: metadata.artUrl!, sizes: '128x128', type: 'image/png' },
456-
// { src: metadata.artUrl!, sizes: '192x192', type: 'image/png' },
457-
// { src: metadata.artUrl!, sizes: '256x256', type: 'image/png' },
458-
// { src: metadata.artUrl!, sizes: '384x384', type: 'image/png' },
459-
// { src: metadata.artUrl!, sizes: '512x512', type: 'image/png' },
460-
// ]
461-
// } // || 'snapcast-512.png';
462-
// console.log('Metadata title: ' + title + ', artist: ' + artist + ', album: ' + album + ", artwork: " + artwork);
463-
// navigator.mediaSession!.metadata = new MediaMetadata({
464-
// title: title,
465-
// artist: artist,
466-
// album: album,
467-
// artwork: artwork
468-
// });
469-
470-
// mediaSession.setActionHandler('seekbackward', function () { });
471-
// mediaSession.setActionHandler('seekforward', function () { });
472-
// }
473-
474315
public getClient(client_id: string): Snapcast.Client {
475316
const client = this.server.getClient(client_id);
476317
if (client == null) {
@@ -581,7 +422,6 @@ class SnapControl {
581422

582423
public setStream(group_id: string, stream_id: string) {
583424
this.getGroup(group_id).stream_id = stream_id;
584-
this.updateProperties(stream_id);
585425
this.sendRequest('Group.SetStream', { id: group_id, stream_id: stream_id });
586426
}
587427

@@ -625,9 +465,7 @@ class SnapControl {
625465
if (is_response) {
626466
if (json_msg.id === this.status_req_id) {
627467
this.server = new Snapcast.Server(json_msg.result.server);
628-
// this.updateProperties(this.getMyStreamId());
629468
refresh = true;
630-
// show();
631469
}
632470
}
633471
else {

0 commit comments

Comments
 (0)