add 3rd party radio station support #689

also add disabled property for next button
This commit is contained in:
yazninja 2022-05-24 01:09:23 +08:00
parent de692c9dc8
commit eedf9304da
6 changed files with 78 additions and 7 deletions

View file

@ -0,0 +1,45 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="100%"
height="100%"
viewBox="0 0 34 34"
version="1.1"
xml:space="preserve"
style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"
id="svg10"
sodipodi:docname="stop.svg"
inkscape:version="1.1.2 (b8e25be833, 2022-02-05)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs14" /><sodipodi:namedview
id="namedview12"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:snap-object-midpoints="false"
inkscape:zoom="24.205882"
inkscape:cx="17"
inkscape:cy="17.020656"
inkscape:window-width="1920"
inkscape:window-height="1009"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:current-layer="svg10"><inkscape:grid
type="xygrid"
id="grid1236" /></sodipodi:namedview>
<rect
style="fill:#ffffff;fill-opacity:1"
id="rect871"
width="18.01215"
height="19.375456"
x="7.9939251"
y="7.3122721"
ry="2.3134873" /></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View file

@ -1590,6 +1590,12 @@ input[type=checkbox][switch]:checked:active::before {
background-image: url("./assets/repeatOne.svg");
}
.playback-button.stop {
background-image: url('./assets/cider-icons/stop.svg');
background-size: 38px;
background-position: center;
}
.playback-button.pause {
background-image: url('./assets/cider-icons/pause.svg');
background-size: 38px;
@ -1613,6 +1619,15 @@ input[type=checkbox][switch]:checked:active::before {
background-size: 60%;
background-position: center;
}
.playback-button.disabled {
opacity: 0.25 !important;
pointer-events: none;
transform: none !important;
&:hover{
background-color: transparent !important;
transform: none !important;
}
}
.playback-button {
&.navigation {

View file

@ -658,6 +658,7 @@ const app = new Vue({
}
this.mk._bag.features['seamless-audio-transitions'] = this.cfg.audio.seamless_audio
this.mk._bag.features["broadcast-radio"] = true
this.mk._services.apiManager.store.storekit._restrictedEnabled = false
// API Fallback
if (!this.chrome.userinfo) {
@ -1801,6 +1802,12 @@ const app = new Vue({
app.skipToPreviousItem()
}
},
isDisabled() {
if(!app.mk.nowPlayingItem || app.mk.nowPlayingItem.attributes.playParams.kind == 'radioStation' || app.mk.queue._position + 1 == app.mk.queue.length) {
return true;
}
return false;
},
async getNowPlayingItemDetailed(target) {
try {
let u = await app.mkapi(app.mk.nowPlayingItem.playParams.kind,

View file

@ -66,14 +66,16 @@
<button class="playback-button previous" @click="prevButton()"
:title="$root.getLz('term.previous')" v-b-tooltip.hover></button>
</div>
<div class="app-chrome-item">
<button class="playback-button pause" @click="mk.pause()" v-if="mk.isPlaying"
<<div class="app-chrome-item display--large">
<button class="playback-button stop" @click="mk.stop()" v-if="mk.isPlaying && mk.nowPlayingItem.attributes.playParams.kind == 'radioStation'"
:title="$root.getLz('term.stop')" v-b-tooltip.hover></button>
<button class="playback-button pause" @click="mk.pause()" v-else-if="mk.isPlaying"
:title="$root.getLz('term.pause')" v-b-tooltip.hover></button>
<button class="playback-button play" @click="mk.play()" v-else
:title="$root.getLz('term.play')" v-b-tooltip.hover></button>
</div>
<div class="app-chrome-item">
<button class="playback-button next" @click="skipToNextItem()"
<div class="app-chrome-item display--large">
<button class="playback-button next" @click="skipToNextItem()" :class="isDisabled() && 'disabled'"
:title="$root.getLz('term.next')" v-b-tooltip.hover></button>
</div>
<div class="app-chrome-item">

View file

@ -47,13 +47,15 @@
:title="$root.getLz('term.previous')" v-b-tooltip.hover></button>
</div>
<div class="app-chrome-item display--large">
<button class="playback-button pause" @click="mk.pause()" v-if="mk.isPlaying"
<button class="playback-button stop" @click="mk.stop()" v-if="mk.isPlaying && mk.nowPlayingItem.attributes.playParams.kind == 'radioStation'"
:title="$root.getLz('term.stop')" v-b-tooltip.hover></button>
<button class="playback-button pause" @click="mk.pause()" v-else-if="mk.isPlaying"
:title="$root.getLz('term.pause')" v-b-tooltip.hover></button>
<button class="playback-button play" @click="mk.play()" v-else
:title="$root.getLz('term.play')" v-b-tooltip.hover></button>
</div>
<div class="app-chrome-item display--large">
<button class="playback-button next" @click="skipToNextItem()"
<button class="playback-button next" @click="skipToNextItem()" :class="isDisabled() && 'disabled'"
:title="$root.getLz('term.next')" v-b-tooltip.hover></button>
</div>
<div class="app-chrome-item display--large">

View file

@ -98,7 +98,7 @@
async mounted() {
await this.getBadges()
if (typeof this.item.attributes.playParams == "object") {
if (this.item.attributes.playParams.kind.includes("radioStation") && (this.item.attributes.playParams.streamingKind == 1 || this.item.attributes.playParams.streamingKind == 2)) {
if (this.item.attributes.playParams.kind.includes("radioStation") && (this.item.attributes.playParams.streamingKind == 1)) {
this.unavailable = true
}
} else {