okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

some fixes

Browse source
This commit is contained in:
booploops 2022-02-24 04:58:32 -08:00
parent 7a8cdf483b
commit 80f78edbf3
4 changed files with 157 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/renderer/index.js
View file

@ -1575,10 +1575,10 @@ const app = new Vue({
//this.getTypeFromID("artist",id,isLibrary,query) //this.getTypeFromID("artist",id,isLibrary,query)
}, },
followArtistById(id, follow) { followArtistById(id, follow) {
if (follow && !this.followingArist(id)) { if (follow && !this.followingArtist(id)) {
this.cfg.home.followedArtists.push(id) this.cfg.home.followedArtists.push(id)
} else { } else {
let index = this.cfg.home.followedArtists.indexOf(this.item.id) let index = this.cfg.home.followedArtists.indexOf(id)
if (index > -1) { if (index > -1) {
this.cfg.home.followedArtists.splice(index, 1) this.cfg.home.followedArtists.splice(index, 1)
} }

4
src/renderer/views/components/artist-chip.ejs
View file

@ -6,8 +6,8 @@
<div class="artist-chip__name"> <div class="artist-chip__name">
<span>{{ item.attributes.name }}</span> <span>{{ item.attributes.name }}</span>
</div> </div>
<button @click="$root.followArtist(item.id, true)" title="Follow" v-if="!$root.followingArtist(item.id)" class="artist-chip__follow codicon codicon-add"></button> <button @click="$root.followArtistById(item.id, true)" title="Follow" v-if="!$root.followingArtist(item.id)" class="artist-chip__follow codicon codicon-add"></button>
<button @click="$root.followArtist(item.id, false)" title="Following" v-else class="artist-chip__follow codicon codicon-check"></button> <button @click="$root.followArtistById(item.id, false)" title="Following" v-else class="artist-chip__follow codicon codicon-check"></button>
</div> </div>
</script> </script>

172
src/renderer/views/pages/cider-playlist.ejs
View file

@ -32,24 +32,30 @@
{{data.attributes ? (data.attributes.name ?? {{data.attributes ? (data.attributes.name ??
(data.attributes.title ?? '') ?? '') : ''}} (data.attributes.title ?? '') ?? '') : ''}}
</div> </div>
<div class="playlist-name" v-show="nameEditing"><input type="text" spellcheck="false" <div class="playlist-name" v-show="nameEditing"><input type="text"
spellcheck="false"
class="nameEdit" class="nameEdit"
v-model="data.attributes.name" v-model="data.attributes.name"
@blur="editPlaylist" @blur="editPlaylist"
@change="editPlaylist" @change="editPlaylist"
@keydown.enter="editPlaylist"/></div> @keydown.enter="editPlaylist"/>
</div>
<div class="playlist-artist item-navigate" <div class="playlist-artist item-navigate"
v-if="getArtistName(data) != '' && !useArtistChip" v-if="getArtistName(data) != '' && !useArtistChip"
@click="data.attributes && data.attributes.artistName ? app.searchAndNavigate(data,'artist') : ''"> @click="data.attributes && data.attributes.artistName ? app.searchAndNavigate(data,'artist') : ''">
{{getArtistName(data)}} {{getArtistName(data)}}
</div> </div>
<artist-chip v-if="useArtistChip" :item="data.relationships.artists.data[0]"></artist-chip> <artist-chip v-if="useArtistChip"
<div class="playlist-desc" v-if="data.attributes.description && (data.attributes.description.standard || data.attributes.description.short)"> :item="data.relationships.artists.data[0]"></artist-chip>
<div v-if="data.attributes.description.short" class="content" v-html="data.attributes.description.short"></div> <div class="playlist-desc"
<div v-else-if="data.attributes.description.standard" class="content" v-html="data.attributes.description.standard"></div> v-if="data.attributes.description && (data.attributes.description.standard || data.attributes.description.short)">
<div v-if="data.attributes.description.short" class="content"
v-html="data.attributes.description.short"></div>
<div v-else-if="data.attributes.description.standard" class="content"
v-html="data.attributes.description.standard"></div>
<button v-if="data.attributes.description.short" class="more-btn" <button v-if="data.attributes.description.short" class="more-btn"
@click="editorialNotesExpanded = !editorialNotesExpanded"> @click="editorialNotesExpanded = !editorialNotesExpanded">
{{app.getLz('term.showMore')}} {{app.getLz('term.showMore')}}
</button> </button>
</div> </div>
</div> </div>
@ -58,26 +64,31 @@
<div class="playlist-desc-expanded"> <div class="playlist-desc-expanded">
<div class="content" <div class="content"
v-html="((data.attributes.editorialNotes) ? (data.attributes.editorialNotes.standard ?? (data.attributes.editorialNotes.short ?? '') ) : (data.attributes.description ? (data.attributes.description.standard ?? (data.attributes.description.short ?? '')) : ''))"></div> v-html="((data.attributes.editorialNotes) ? (data.attributes.editorialNotes.standard ?? (data.attributes.editorialNotes.short ?? '') ) : (data.attributes.description ? (data.attributes.description.standard ?? (data.attributes.description.short ?? '')) : ''))"></div>
<button class="more-btn" @click="editorialNotesExpanded = !editorialNotesExpanded">{{app.getLz('term.showLess')}} <button class="more-btn" @click="editorialNotesExpanded = !editorialNotesExpanded">
{{app.getLz('term.showLess')}}
</button> </button>
</div> </div>
</template> </template>
<div class="playlist-controls" v-observe-visibility="{callback: isHeaderVisible}"> <div class="playlist-controls" v-observe-visibility="{callback: isHeaderVisible}">
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;" <button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
@click="app.mk.shuffleMode = 0; play()"> <img class="md-ico-play"> @click="app.mk.shuffleMode = 0; play()"><img class="md-ico-play">
{{app.getLz('term.play')}} {{app.getLz('term.play')}}
</button> </button>
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;" <button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
@click="app.mk.shuffleMode = 1;play()"> <img class="md-ico-shuffle"> @click="app.mk.shuffleMode = 1;play()"><img class="md-ico-shuffle">
{{app.getLz('term.shuffle')}} {{app.getLz('term.shuffle')}}
</button> </button>
<button class="md-btn md-btn-icon" style="min-width: 180px;" v-if="inLibrary!=null && confirm!=true" <button class="md-btn md-btn-icon" style="min-width: 180px;"
@click="confirmButton()"> <img :class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'"> v-if="inLibrary!=null && confirm!=true"
{{ (!inLibrary) ? app.getLz('action.addToLibrary') : app.getLz("action.removeFromLibrary") }} @click="confirmButton()"><img
:class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'">
{{ (!inLibrary) ? app.getLz('action.addToLibrary') :
app.getLz("action.removeFromLibrary") }}
</button> </button>
<button class="md-btn md-btn-icon" style="min-width: 180px;" v-if="confirm==true" <button class="md-btn md-btn-icon" style="min-width: 180px;" v-if="confirm==true"
@click="(!inLibrary) ? addToLibrary(data.attributes.playParams.id.toString()) : removeFromLibrary(data.attributes.playParams.id.toString()) "> <img :class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'"> @click="(!inLibrary) ? addToLibrary(data.attributes.playParams.id.toString()) : removeFromLibrary(data.attributes.playParams.id.toString()) ">
{{app.getLz('term.confirm')}} <img :class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'">
{{app.getLz('term.confirm')}}
</button> </button>
<button class="more-btn-round" style="float:right;" @click="menu"> <button class="more-btn-round" style="float:right;" @click="menu">
<div class="svg-icon"></div> <div class="svg-icon"></div>
@ -91,7 +102,8 @@
</div> </div>
</div> </div>
<div class="floating-header" :style="{opacity: (headerVisible ? 0 : 1),'pointer-events': (headerVisible ? 'none' : '')}"> <div class="floating-header"
:style="{opacity: (headerVisible ? 0 : 1),'pointer-events': (headerVisible ? 'none' : '')}">
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<h3>{{data.attributes ? (data.attributes.name ?? <h3>{{data.attributes ? (data.attributes.name ??
@ -100,20 +112,24 @@
<div class="col-auto flex-center"> <div class="col-auto flex-center">
<div> <div>
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;" <button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
@click="app.mk.shuffleMode = 0; play()"> <img class="md-ico-play"> @click="app.mk.shuffleMode = 0; play()"><img class="md-ico-play">
{{app.getLz('term.play')}} {{app.getLz('term.play')}}
</button> </button>
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;" <button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
@click="app.mk.shuffleMode = 1;play()"> <img class="md-ico-shuffle"> @click="app.mk.shuffleMode = 1;play()"><img class="md-ico-shuffle">
{{app.getLz('term.shuffle')}} {{app.getLz('term.shuffle')}}
</button> </button>
<button class="md-btn md-btn-icon" style="min-width: 180px;" v-if="inLibrary!=null && confirm!=true" <button class="md-btn md-btn-icon" style="min-width: 180px;"
@click="confirmButton()"> <img :class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'"> v-if="inLibrary!=null && confirm!=true"
{{ (!inLibrary) ? app.getLz('action.addToLibrary') : app.getLz("action.removeFromLibrary") }} @click="confirmButton()"><img
:class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'">
{{ (!inLibrary) ? app.getLz('action.addToLibrary') :
app.getLz("action.removeFromLibrary") }}
</button> </button>
<button class="md-btn md-btn-icon" style="min-width: 180px;" v-if="confirm==true" <button class="md-btn md-btn-icon" style="min-width: 180px;" v-if="confirm==true"
@click="(!inLibrary) ? addToLibrary(data.attributes.playParams.id.toString()) : removeFromLibrary(data.attributes.playParams.id.toString()) "> <img :class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'"> @click="(!inLibrary) ? addToLibrary(data.attributes.playParams.id.toString()) : removeFromLibrary(data.attributes.playParams.id.toString()) ">
{{app.getLz('term.confirm')}} <img :class="(!inLibrary) ? 'md-ico-add' : 'md-ico-remove'">
{{app.getLz('term.confirm')}}
</button> </button>
</div> </div>
</div> </div>
@ -129,7 +145,9 @@
<div style="width:100%"> <div style="width:100%">
<draggable :sort="data.attributes.canEdit && data.type == 'library-playlists'" <draggable :sort="data.attributes.canEdit && data.type == 'library-playlists'"
v-model="data.relationships.tracks.data" @start="drag=true" @end="drag=false;put()"> v-model="data.relationships.tracks.data" @start="drag=true" @end="drag=false;put()">
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index" :showIndex="true" :showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')" <mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()" :context-ext="buildContextMenu()"
v-for="(item,index) in data.relationships.tracks.data"></mediaitem-list-item> v-for="(item,index) in data.relationships.tracks.data"></mediaitem-list-item>
</draggable> </draggable>
@ -157,22 +175,25 @@
style="width: 50%;"> style="width: 50%;">
{{data.attributes.copyright}} {{data.attributes.copyright}}
</div> </div>
<template v-if="(data.attributes?.playParams?.kind ?? data.type ?? '').includes('album') && data.relationships.catalog != null && data.relationships.catalog != null && data.relationships.catalog.data.length > 0"> <template
<div class="playlist-time showExtended item-navigate" style="color:#fa586a; font-weight: bold" @click="app.routeView(data.relationships.catalog.data[0])"> v-if="(data.attributes?.playParams?.kind ?? data.type ?? '').includes('album') && data.relationships.catalog != null && data.relationships.catalog != null && data.relationships.catalog.data.length > 0">
<div class="playlist-time showExtended item-navigate" style="color:#fa586a; font-weight: bold"
@click="app.routeView(data.relationships.catalog.data[0])">
{{$root.getLz("action.showAlbum")}} {{$root.getLz("action.showAlbum")}}
</div> </div>
</template> </template>
<hr> <hr>
<template v-if="typeof data.meta != 'undefined'"> <template v-if="typeof data.meta != 'undefined'">
<div v-for="view in data.meta.views.order" v-if="data.views[view].data.length != 0"> <div v-for="view in data.meta.views.order" v-if="data.views[view].data.length != 0">
<div class="row" > <div class="row">
<div class="col"> <div class="col">
<h3>{{ data.views[view].attributes.title }}</h3> <h3>{{ data.views[view].attributes.title }}</h3>
</div> </div>
</div> </div>
<div class="row" > <div class="row">
<div class="col"> <div class="col">
<mediaitem-scroller-horizontal :items="data.views[view].data"></mediaitem-scroller-horizontal> <mediaitem-scroller-horizontal
:items="data.views[view].data"></mediaitem-scroller-horizontal>
</div> </div>
</div> </div>
</div> </div>
@ -300,11 +321,12 @@
} }
let kind = this.data.attributes.playParams.kind ?? this.data.type ?? ''; let kind = this.data.attributes.playParams.kind ?? this.data.type ?? '';
const truekind = (!kind.endsWith("s")) ? (kind + "s") : kind; const truekind = (!kind.endsWith("s")) ? (kind + "s") : kind;
app.mk.api.v3.music(`v1/me/library/${truekind}/${id.toString()}`,{}, app.mk.api.v3.music(`v1/me/library/${truekind}/${id.toString()}`, {},
{ {
fetchOptions: { fetchOptions: {
method: "DELETE" method: "DELETE"
}}) }
})
this.inLibrary = false this.inLibrary = false
this.confirm = false this.confirm = false
}, },
@ -344,18 +366,18 @@
if (!this.data.attributes.canEdit) { if (!this.data.attributes.canEdit) {
return return
} }
console.log('sds',this.convert()) console.log('sds', this.convert())
await app.mk.api.v3.music( await app.mk.api.v3.music(
`/v1/me/library/playlists/${this.data.attributes.playParams.id}/tracks`, `/v1/me/library/playlists/${this.data.attributes.playParams.id}/tracks`,
{}, {},
{ {
fetchOptions: { fetchOptions: {
method: "PUT", method: "PUT",
body: JSON.stringify({ body: JSON.stringify({
data: this.convert() data: this.convert()
}) })
}
} }
}
) )
}, },
async remove() { async remove() {
@ -391,7 +413,7 @@
}) })
}, },
menu(event) { menu(event) {
app.showMenuPanel({ let menuItems = {
items: { items: {
"share": { "share": {
name: app.getLz('term.share'), name: app.getLz('term.share'),
@ -420,9 +442,34 @@
app.copyToClipboard(res.data.data[0].attributes.url) app.copyToClipboard(res.data.data[0].attributes.url)
}) })
} }
} },
"follow": {
name: app.getLz('action.follow'),
icon: "./assets/feather/plus-circle.svg",
hidden: false,
action: () => {
app.followArtistById(this.data.id, true)
}
},
"unfollow": {
name: app.getLz('action.unfollow'),
icon: "./assets/feather/x-circle.svg",
hidden: true,
action: () => {
app.followArtistById(this.data.id, false)
}
},
} }
}, event) }
if(app.followingArtist(this.data.id)){
menuItems.items.follow.hidden = true
menuItems.items.unfollow.hidden = false
} else {
menuItems.items.follow.hidden = false
menuItems.items.unfollow.hidden = true
}
app.showMenuPanel(menuItems, event)
}, },
getItemParent: function (data) { getItemParent: function (data) {
kind = data.attributes.playParams.kind; kind = data.attributes.playParams.kind;
@ -435,13 +482,13 @@
if (date == null || date === "") return ""; if (date == null || date === "") return "";
switch (date) { switch (date) {
case this.data.attributes.releaseDate: case this.data.attributes.releaseDate:
prefix = this.app.getLz('term.time.released')+ ' ' prefix = this.app.getLz('term.time.released') + ' '
break; break;
case this.data.attributes.lastModifiedDate: case this.data.attributes.lastModifiedDate:
prefix = this.app.getLz('term.time.updated')+ ' ' prefix = this.app.getLz('term.time.updated') + ' '
break; break;
case this.data.attributes.dateAdded: case this.data.attributes.dateAdded:
prefix = this.app.getLz('term.time.added')+ ' ' prefix = this.app.getLz('term.time.added') + ' '
break; break;
} }
let month, year; let month, year;
@ -451,13 +498,22 @@
// date = releaseDate.getDate(); // date = releaseDate.getDate();
// year = releaseDate.getFullYear(); // year = releaseDate.getFullYear();
let formatted = '' let formatted = ''
try {formatted = new Intl.DateTimeFormat(this.app.cfg.general.language?.replace('_','-') ?? 'en-US', {day:'numeric',month: 'long', year: 'numeric'}).format(releaseDate);} try {
catch(e){ formatted = new Intl.DateTimeFormat(this.app.cfg.general.language?.replace('_', '-') ?? 'en-US', {
day: 'numeric',
month: 'long',
year: 'numeric'
}).format(releaseDate);
} catch (e) {
// use the format in json instead // use the format in json instead
if (this.app.getLz('date.format') != null){ if (this.app.getLz('date.format') != null) {
formatted = new this.app.getLz('date.format').replace("${d}", releaseDate.getDate()).replace("${m}", releaseDate.getMonth()).replace("${y}", releaseDate.getFullYear()); formatted = new this.app.getLz('date.format').replace("${d}", releaseDate.getDate()).replace("${m}", releaseDate.getMonth()).replace("${y}", releaseDate.getFullYear());
} else { } else {
formatted = new Intl.DateTimeFormat('en-US', {day:'numeric',month: 'long', year: 'numeric'}).format(releaseDate); formatted = new Intl.DateTimeFormat('en-US', {
day: 'numeric',
month: 'long',
year: 'numeric'
}).format(releaseDate);
} }
} }
return prefix + formatted return prefix + formatted
@ -483,7 +539,7 @@
let query = (this.data ?? app.showingPlaylist).relationships.tracks.data.map(item => new MusicKit.MediaItem(item)); let query = (this.data ?? app.showingPlaylist).relationships.tracks.data.map(item => new MusicKit.MediaItem(item));
app.mk.stop().then(function () { app.mk.stop().then(function () {
app.mk.setQueue({[truekind]: [id] , parameters : {l : app.mklang}}).then(function () { app.mk.setQueue({[truekind]: [id], parameters: {l: app.mklang}}).then(function () {
app.mk.play().then(function () { app.mk.play().then(function () {
if (query.length > 100) { if (query.length > 100) {
let u = query.slice(100); let u = query.slice(100);

45
src/renderer/views/pages/playlist-inline.ejs
View file

@ -49,10 +49,12 @@
@keydown.enter="editPlaylist"/> @keydown.enter="editPlaylist"/>
</div> </div>
<div class="playlist-artist item-navigate" <div class="playlist-artist item-navigate"
v-if="getArtistName(data) != ''" v-if="getArtistName(data) != '' && !useArtistChip"
@click="data.attributes && data.attributes.artistName ? app.searchAndNavigate(data,'artist') : ''"> @click="data.attributes && data.attributes.artistName ? app.searchAndNavigate(data,'artist') : ''">
{{getArtistName(data)}} {{getArtistName(data)}}
</div> </div>
<artist-chip v-if="useArtistChip"
:item="data.relationships.artists.data[0]"></artist-chip>
<div class="playlist-desc" <div class="playlist-desc"
v-if="data.attributes.description && (data.attributes.description.standard || data.attributes.description.short)"> v-if="data.attributes.description && (data.attributes.description.standard || data.attributes.description.short)">
<div v-if="data.attributes.description.short" class="content" <div v-if="data.attributes.description.short" class="content"
@ -242,7 +244,8 @@
app: this.$root, app: this.$root,
itemBadges: [], itemBadges: [],
badgesRequested: false, badgesRequested: false,
headerVisible: true headerVisible: true,
useArtistChip: false
} }
}, },
mounted: function () { mounted: function () {
@ -292,10 +295,11 @@
setTimeout(() => this.confirm = false, 3000); setTimeout(() => this.confirm = false, 3000);
}, },
getArtistName(data) { getArtistName(data) {
console.log(data.attributes)
if (data.attributes.artistName) { if (data.attributes.artistName) {
this.useArtistChip = true
return data.attributes.artistName return data.attributes.artistName
} else if (data.attributes.artist) { } else if (data.attributes.artist) {
this.useArtistChip = true
return data.attributes.artist.attributes.name return data.attributes.artist.attributes.name
} else if (data.attributes.curatorName) { } else if (data.attributes.curatorName) {
return data.attributes.curatorName return data.attributes.curatorName
@ -333,7 +337,7 @@
this.confirm = false this.confirm = false
}, },
async removeFromLibrary(id) { async removeFromLibrary(id) {
const params = {"fields[somgs]": "inLibrary", "fields[albums]": "inLibrary", "relate": "library"}; const params = {"fields[songs]": "inLibrary", "fields[albums]": "inLibrary", "relate": "library"};
var id = this.data.id ?? this.data.attributes.playParams.id var id = this.data.id ?? this.data.attributes.playParams.id
const res = await app.mkapi(this.data.attributes.playParams.kind ?? this.data.type, this.data.attributes.playParams.isLibrary ?? false, this.data.attributes.playParams.id ?? this.data.id, params); const res = await app.mkapi(this.data.attributes.playParams.kind ?? this.data.type, this.data.attributes.playParams.isLibrary ?? false, this.data.attributes.playParams.id ?? this.data.id, params);
if (res.data.data[0] && res.data.data[0].relationships && res.data.data[0].relationships.library && res.data.data[0].relationships.library.data && res.data.data[0].relationships.library.data.length > 0) { if (res.data.data[0] && res.data.data[0].relationships && res.data.data[0].relationships.library && res.data.data[0].relationships.library.data && res.data.data[0].relationships.library.data.length > 0) {
@ -433,7 +437,7 @@
}) })
}, },
menu(event) { menu(event) {
app.showMenuPanel({ let menuItems = {
items: { items: {
"share": { "share": {
name: app.getLz('term.share'), name: app.getLz('term.share'),
@ -462,9 +466,34 @@
app.copyToClipboard(res.data.data[0].attributes.url) app.copyToClipboard(res.data.data[0].attributes.url)
}) })
} }
} },
"follow": {
name: app.getLz('action.follow'),
icon: "./assets/feather/plus-circle.svg",
hidden: false,
action: () => {
app.followArtistById(this.data.id, true)
}
},
"unfollow": {
name: app.getLz('action.unfollow'),
icon: "./assets/feather/x-circle.svg",
hidden: true,
action: () => {
app.followArtistById(this.data.id, false)
}
},
} }
}, event) }
if(app.followingArtist(this.data.id)){
menuItems.items.follow.hidden = true
menuItems.items.unfollow.hidden = false
} else {
menuItems.items.follow.hidden = false
menuItems.items.unfollow.hidden = true
}
app.showMenuPanel(menuItems, event)
}, },
getItemParent: function (data) { getItemParent: function (data) {
kind = data.attributes.playParams.kind; kind = data.attributes.playParams.kind;
@ -534,7 +563,7 @@
let query = (this.data ?? app.showingPlaylist).relationships.tracks.data.map(item => new MusicKit.MediaItem(item)); let query = (this.data ?? app.showingPlaylist).relationships.tracks.data.map(item => new MusicKit.MediaItem(item));
app.mk.stop().then(function () { app.mk.stop().then(function () {
app.mk.setQueue({[truekind]: [id] , parameters : {l : app.mklang}}).then(function () { app.mk.setQueue({[truekind]: [id], parameters: {l: app.mklang}}).then(function () {
app.mk.play().then(function () { app.mk.play().then(function () {
if (query.length > 100) { if (query.length > 100) {
let u = query.slice(100); let u = query.slice(100);