diff --git a/Web/Presenters/templates/Audio/player.xml b/Web/Presenters/templates/Audio/player.xml
index 2dc9a709..75bf78b9 100644
--- a/Web/Presenters/templates/Audio/player.xml
+++ b/Web/Presenters/templates/Audio/player.xml
@@ -3,7 +3,7 @@
{php $isAvailable = $audio->isAvailable()}
{php $performers = $audio->getPerformers()}
{php $editable = isset($thisUser) && $audio->canBeModifiedBy($thisUser)}
-
+
diff --git a/Web/routes.yml b/Web/routes.yml
index 86e7665e..7fd0cfe7 100644
--- a/Web/routes.yml
+++ b/Web/routes.yml
@@ -203,6 +203,8 @@ routes:
handler: "Audio->list"
- url: "/audio{num}/listen"
handler: "Audio->listen"
+ - url: "/audio{num}_{num}"
+ handler: "Audio->aloneAudio"
- url: "/audios/search"
handler: "Audio->search"
- url: "/audios/newPlaylist"
diff --git a/Web/static/css/audios.css b/Web/static/css/audios.css
index bbb29989..23e5912a 100644
--- a/Web/static/css/audios.css
+++ b/Web/static/css/audios.css
@@ -34,7 +34,7 @@
box-shadow: 1px 0px 8px 0px rgba(34, 60, 80, 0.2);
position: sticky;
top: 0px;
- z-index: 1;
+ z-index: 10;
}
/* for search */
diff --git a/Web/static/css/dialog.css b/Web/static/css/dialog.css
index 81f7248a..4423920e 100644
--- a/Web/static/css/dialog.css
+++ b/Web/static/css/dialog.css
@@ -139,7 +139,7 @@ body.dimmed > .dimmer #absolute_territory {
}
.miniplayer {
- position: absolute;
+ position: fixed;
background: rgba(54, 54, 54, 0.95);
border-radius: 3px;
min-width: 299px;
diff --git a/Web/static/css/main.css b/Web/static/css/main.css
index afeb2c12..06fb0686 100644
--- a/Web/static/css/main.css
+++ b/Web/static/css/main.css
@@ -3859,3 +3859,36 @@ hr {
.tippy-box[data-animation='up_down'][data-state='visible'] {
inset: auto auto 0px 0px;
}
+
+.ctx_place {
+ position: relative;
+}
+
+#ctx_menu {
+ position: absolute;
+ z-index: 100;
+ background: #f7f7f7;
+ border: 1px solid #d8d8d8;
+ display: flex;
+ flex-direction: column;
+ min-width: 185px;
+}
+
+#ctx_menu a {
+ padding: 6px 6px 6px 26px;
+ color: black;
+ position: relative;
+}
+
+#ctx_menu a:hover {
+ background: #e9e9e9;
+}
+
+#ctx_menu a.pressed::before {
+ content: '✓';
+ display: inline-block;
+ position: absolute;
+ left: 9px;
+ top: 3px;
+ font-size: 15px;
+}
diff --git a/Web/static/js/al_music.js b/Web/static/js/al_music.js
index e8918a3b..36737acf 100644
--- a/Web/static/js/al_music.js
+++ b/Web/static/js/al_music.js
@@ -217,7 +217,7 @@ window.player = new class {
form_data.append('context_entity', this.context.object.entity_id)
break
case 'classic_search_context':
- // todo rifictir
+ // tidi riwriti
form_data.append('context', this.context.object.name)
form_data.append('context_entity', JSON.stringify({
'order': this.context.object.order,
@@ -228,6 +228,9 @@ window.player = new class {
'query': this.context.object.query,
}))
break
+ case 'alone_audio':
+ form_data.append('context', this.context.object.name)
+ form_data.append('context_entity', this.context.object.entity_id)
}
form_data.append('page', page)
@@ -395,6 +398,7 @@ window.player = new class {
async shuffle() {
this.tracks.sort(() => Math.random() - 0.59)
await this.setTrack(this.tracks.at(0).id)
+ this.play()
}
isAtAudiosPage() {
@@ -447,7 +451,7 @@ window.player = new class {
this.__updateFace()
}
} else {
- this.ajClose()
+ this.ajClose(false)
this.is_closed = false
if(this.tracks.length < 1) {
if(window.__current_page_audio_context) {
@@ -622,9 +626,12 @@ window.player = new class {
}
}
- ajClose() {
+ ajClose(pause = true) {
this.is_closed = true
- this.pause()
+ if(pause) {
+ this.pause()
+ }
+
u('#ajax_audio_player').addClass('hidden')
}
@@ -637,7 +644,7 @@ window.player = new class {
const previous_time_x = localStorage.getItem('audio.lastX') ?? 100
const previous_time_y = localStorage.getItem('audio.lastY') ?? scrollY
const miniplayer_template = u(`
-
+
@@ -691,7 +698,7 @@ window.player = new class {
$('#ajax_audio_player').draggable({
cursor: 'grabbing',
containment: 'window',
- cancel: '#aj_player_track .selectableTrack, #aj_player_volume .selectableTrack',
+ cancel: '#aj_player_track, #aj_player_volume, #aj_player_buttons',
stop: function(e) {
if(window.player.ajaxPlayer.length > 0) {
const left = parseInt(window.player.ajaxPlayer.nodes[0].style.left)
@@ -1022,6 +1029,127 @@ u(document).on("drop", '.audiosContainer', function(e) {
}
})
+u(document).on('contextmenu', '.bigPlayer, .audioEmbed, #ajax_audio_player', (e) => {
+ e.preventDefault()
+
+ u('#ctx_menu').remove()
+ const ctx_type = u(e.target).closest('.bigPlayer, #ajax_audio_player').length > 0 ? 'main_player' : 'mini_player'
+ const parent = e.target.closest('.ctx_place')
+ if(!parent) {
+ return
+ }
+
+ const rect = parent.getBoundingClientRect()
+ let x, y;
+ let rx = rect.x + window.scrollX, ry = rect.y + window.scrollY
+ x = e.pageX - rx
+ y = e.pageY - ry
+
+ const ctx_u = u(`
+
+ `)
+ u(parent).append(ctx_u)
+ ctx_u.find('#audio_ctx_copy').on('click', async (e) => {
+ if(ctx_type == 'main_player') {
+ if(window.player.current_track_id == 0) {
+ makeError(tr('copy_link_to_audio_error_not_selected_track'), 'Red', 4000, 80)
+ return
+ }
+
+ const url = location.origin + `/audio${window.openvk.current_id}_${window.player.current_track_id}`
+ await copyToClipboard(url)
+ } else {
+ const url = location.origin + `/audio${window.openvk.current_id}_${u(e.target).closest('.audioEmbed').attr('data-realid')}`
+ await copyToClipboard(url)
+ }
+ })
+ ctx_u.find('#audio_ctx_repeat').on('click', () => {
+ if(window.player.current_track_id == 0) {
+ return
+ }
+
+ if(!window.player.audioPlayer.loop) {
+ window.player.audioPlayer.loop = true
+ window.player.uiPlayer.find('.repeatButton').addClass('pressed')
+ } else {
+ window.player.audioPlayer.loop = false
+ window.player.uiPlayer.find('.repeatButton').removeClass('pressed')
+ }
+ })
+ ctx_u.find('#audio_ctx_shuffle').on('click', async () => {
+ if(window.player.current_track_id == 0) {
+ return
+ }
+
+ await window.player.shuffle()
+ })
+ ctx_u.find('#audio_ctx_mute').on('click', async () => {
+ if(window.player.current_track_id == 0) {
+ return
+ }
+
+ window.player.uiPlayer.find('.deviceButton').toggleClass('pressed')
+ window.player.audioPlayer.muted = window.player.uiPlayer.find('.deviceButton').hasClass('pressed')
+ })
+ ctx_u.find('#audio_ctx_add_to_group').on('click', async () => {
+ if(ctx_type == 'main_player') {
+ if(window.player.current_track_id == 0) {
+ return
+ }
+
+ __showAudioAddDialog(window.player.current_track_id)
+ } else {
+ __showAudioAddDialog(Number(u(e.target).closest('.audioEmbed').attr('data-realid')))
+ }
+ })
+ ctx_u.find('#audio_ctx_add_to_playlist').on('click', async () => {
+ if(ctx_type == 'main_player') {
+ if(window.player.current_track_id == 0) {
+ return
+ }
+
+ __showAudioAddDialog(window.player.current_track_id, 'playlist')
+ } else {
+ __showAudioAddDialog(Number(u(e.target).closest('.audioEmbed').attr('data-realid')), 'playlist')
+ }
+ })
+ ctx_u.find('#audio_ctx_play_next').on('click', (ev) => {
+ const current_id = window.player.current_track_id
+ const move_id = Number(u(e.target).closest('.audioEmbed').attr('data-realid'))
+ if(current_id == 0) {
+ return
+ }
+
+ if(current_id == move_id) {
+ return
+ }
+
+ const current_index = window.player.__findTrack(current_id, true)
+ const next_track = window.player.__findTrack(move_id)
+ const next_track_player = u(`.audioEmbed[data-realid='${window.player.nextTrack.id}']`)
+ const moving_track_player = u(`.audioEmbed[data-realid='${move_id}']`)
+
+ window.player.tracks.splice(current_index + 1, 0, next_track)
+ if(next_track_player.length > 0 && moving_track_player.length > 0) {
+ next_track_player.nodes[0].outerHTML = moving_track_player.nodes[0].outerHTML + next_track_player.nodes[0].outerHTML
+ moving_track_player.remove()
+ }
+ })
+})
+
u(document).on("click", ".musicIcon.edit-icon", (e) => {
const player = e.target.closest(".audioEmbed")
const id = Number(player.dataset.realid)
@@ -1241,9 +1369,7 @@ $(document).on("click", ".musicIcon.remove-icon-group", (e) => {
})
})
-$(document).on("click", ".musicIcon.add-icon-group", async (ev) => {
- let current_tab = 'club';
- const id = Number(ev.target.dataset.id)
+function __showAudioAddDialog(id, current_tab = 'club') {
const body = `
@@ -1437,12 +1563,16 @@ $(document).on("click", ".musicIcon.add-icon-group", async (ev) => {
u("#_addAudioAdditional").on("click", ".mb_tab a", async (e) => {
await switchTab(u(e.target).closest('.mb_tab').attr('data-name'))
})
-
+
u("#_addAudioAdditional").on("click", "input[name='add_to']", async (e) => {
if(u(`input[name='add_to']:checked`).length > 10) {
e.preventDefault()
}
})
+}
+$(document).on("click", ".musicIcon.add-icon-group", async (ev) => {
+ const id = Number(ev.target.dataset.id)
+ __showAudioAddDialog(id)
})
$(document).on("click", ".musicIcon.add-icon", (e) => {
diff --git a/Web/static/js/al_wall.js b/Web/static/js/al_wall.js
index c0c1ebf5..9bb74e92 100644
--- a/Web/static/js/al_wall.js
+++ b/Web/static/js/al_wall.js
@@ -436,7 +436,7 @@ async function OpenVideo(video_arr = [], init_player = true)
u('.miniplayer').remove()
})
- $('.miniplayer').draggable({cursor: 'grabbing', containment: 'body', cancel: '.miniplayer-body'})
+ $('.miniplayer').draggable({cursor: 'grabbing', containment: 'window', cancel: '.miniplayer-body'})
$('.miniplayer').resizable({
maxHeight: 2000,
maxWidth: 3000,
@@ -2405,14 +2405,15 @@ function setStatusEditorShown(shown) {
document.getElementById("status_editor").style.display = shown ? "block" : "none";
}
-document.addEventListener("click", event => {
+u(document).on('click', (event) => {
+ u('#ctx_menu').remove()
if(u('#status_editor').length < 1) {
return
}
if(!event.target.closest("#status_editor") && !event.target.closest("#page_status_text"))
setStatusEditorShown(false);
-});
+})
u(document).on('click', '#page_status_text', (e) => {
setStatusEditorShown(true)
diff --git a/Web/static/js/messagebox.js b/Web/static/js/messagebox.js
index 349d39e8..f2c04d63 100644
--- a/Web/static/js/messagebox.js
+++ b/Web/static/js/messagebox.js
@@ -102,12 +102,14 @@ class CMessageBox {
u('body').removeClass('dimmed')
u('html').attr('style', 'overflow-y:scroll')
this.getNode().attr('style', 'display: none;')
+ this.hidden = true
}
reveal() {
u('body').addClass('dimmed')
u('html').attr('style', 'overflow-y:hidden')
this.getNode().attr('style', 'display: block;')
+ this.hidden = false
}
static toggleLoader() {
diff --git a/Web/static/js/router.js b/Web/static/js/router.js
index 4f9e9039..1e327b31 100644
--- a/Web/static/js/router.js
+++ b/Web/static/js/router.js
@@ -48,7 +48,13 @@ window.router = new class {
}
__closeMsgs() {
- window.messagebox_stack.forEach(msg => msg.close())
+ window.messagebox_stack.forEach(msg => {
+ if(msg.hidden) {
+ return
+ }
+
+ msg.close()
+ })
}
__appendPage(parsed_content) {
@@ -218,6 +224,11 @@ u(document).on('click', 'a', async (e) => {
return
}
+ if(target.download != null) {
+ console.log('AJAX | Skipped because its download')
+ return
+ }
+
if(!dom_url || dom_url == '#' || dom_url.indexOf('javascript:') != -1) {
console.log('AJAX | Skipped because its anchor or function call')
return
@@ -307,8 +318,7 @@ u(document).on('submit', 'form', async (e) => {
history.pushState({'from_router': 1}, '', __new_url)
}
-
- console.log(form_res)
+
window.router.__appendPage(parsed_content)
await window.router.__integratePage()
diff --git a/Web/static/js/utils.js b/Web/static/js/utils.js
index 88fe012b..84d3325e 100644
--- a/Web/static/js/utils.js
+++ b/Web/static/js/utils.js
@@ -222,3 +222,19 @@ function serializeForm(form)
return fd
}
+
+async function copyToClipboard(text) {
+ let fallback = () => {
+ prompt(text);
+ }
+
+ if(typeof navigator.clipboard == "undefined") {
+ fallback()
+ } else {
+ try {
+ await navigator.clipboard.writeText(text)
+ } catch(e) {
+ fallback()
+ }
+ }
+}
diff --git a/locales/en.strings b/locales/en.strings
index 5789074f..b164a4c8 100644
--- a/locales/en.strings
+++ b/locales/en.strings
@@ -995,9 +995,16 @@
"repeat_tip" = "Repeat";
"shuffle_tip" = "Shuffle";
"mute_tip" = "Mute";
+"mute_tip_noun" = "Muted";
"playlist_hide_from_search" = "Unlisted";
"confirm_deleting_audio" = "Do you sure want to delete this audio?";
+"copy_link_to_audio" = "Copy link to clipboard";
+"copy_link_to_audio_error_not_selected_track" = "Track was not selected";
+"audio_ctx_add_to_group" = "Add to group";
+"audio_ctx_add_to_playlist" = "Add to playlist";
+"audio_ctx_play_next" = "Play next";
+
/* Notifications */
"feedback" = "Feedback";
diff --git a/locales/ru.strings b/locales/ru.strings
index c06e7cde..4d49fd2e 100644
--- a/locales/ru.strings
+++ b/locales/ru.strings
@@ -950,9 +950,16 @@
"repeat_tip" = "Повторение";
"shuffle_tip" = "Перемешать";
"mute_tip" = "Заглушить";
+"mute_tip_noun" = "Заглушено";
"playlist_hide_from_search" = "Не показывать в поиске";
"confirm_deleting_audio" = "Вы действительно хотите полностью удалить аудиозапись?";
+"copy_link_to_audio" = "Копировать ссылку на аудио";
+"copy_link_to_audio_error_not_selected_track" = "Трек не выбран";
+"audio_ctx_add_to_group" = "Добавить в группу";
+"audio_ctx_add_to_playlist" = "Добавить в плейлист";
+"audio_ctx_play_next" = "Воспроизвести следующим";
+
/* Notifications */
"feedback" = "Ответы";
@@ -1380,12 +1506,12 @@ $(document).on("click", ".musicIcon.add-icon-group", async (ev) => {
-
+
-
+
${ovk_proc_strtr(escapeHtml(el.title), 100)}