+
diff --git a/Web/Presenters/templates/Audio/tabs.xml b/Web/Presenters/templates/Audio/tabs.xml
index 0d4eeeec..13ca9e7a 100644
--- a/Web/Presenters/templates/Audio/tabs.xml
+++ b/Web/Presenters/templates/Audio/tabs.xml
@@ -30,7 +30,6 @@
})
- {php $audioStatus = $fr->getCurrentAudioStatus()}
{$fr->getCanonicalName()}
{$audioStatus ? $audioStatus->getName() : tr("audios_count", $fr->getAudiosCollectionSize())}
diff --git a/Web/static/css/audios.css b/Web/static/css/audios.css
index 483586b1..a6c4a5f8 100644
--- a/Web/static/css/audios.css
+++ b/Web/static/css/audios.css
@@ -8,21 +8,12 @@
padding: 8px;
}
-.overflowedName {
- position: absolute;
- z-index: 99;
-}
-
.musicIcon {
background-image: url('/assets/packages/static/openvk/img/audios_controls.png');
background-repeat: no-repeat;
cursor: pointer;
}
-.musicIcon:hover {
- filter: brightness(99%);
-}
-
.musicIcon.pressed {
filter: brightness(150%);
}
@@ -177,6 +168,10 @@
font-size: 10px;
}
+.bigPlayer .paddingLayer .trackInfo .timer .elapsedTime {
+ cursor: pointer;
+}
+
.bigPlayer .paddingLayer .trackInfo .trackName {
overflow: hidden;
text-overflow: ellipsis;
@@ -194,6 +189,16 @@
cursor: pointer;
}
+.bigPlayer .paddingLayer .trackPanel .track .selectableTrack > div {
+ width: 95%;
+ position: relative;
+}
+
+.bigPlayer .paddingLayer .volumePanel .selectableTrack > div {
+ position: relative;
+ width:72%
+}
+
.audioEmbed .track > .selectableTrack, .bigPlayer .selectableTrack {
margin-top: 3px;
width: calc(100% - 8px);
@@ -220,7 +225,7 @@
.audioEntry.nowPlaying {
background: #606060;
- border: 1px solid #4f4f4f;
+ outline: 1px solid #4f4f4f;
box-sizing: border-box;
}
@@ -230,6 +235,7 @@
.audioEntry.nowPlaying:hover {
background: #4e4e4e !important;
+ border-radius: inherit !important;
}
.audioEntry.nowPlaying .performer a {
@@ -252,8 +258,28 @@
color: white !important;
}
-.audioEntry.nowPlaying .buttons .musicIcon, .audioEntry.nowPlaying .explicitMark {
- filter: brightness(187%) opacity(72%);
+.audioEntry.nowPlaying .explicitMark path {
+ fill: #ffffff;
+}
+
+.audioEntry.nowPlaying .buttons .musicIcon.edit-icon {
+ background-position: -152px -51px;
+}
+
+.audioEntry.nowPlaying .buttons .musicIcon.add-icon {
+ background-position: -94px -52px;
+}
+
+.audioEntry.nowPlaying .buttons .musicIcon.report-icon {
+ background-position: -66px -67px;
+}
+
+.audioEntry.nowPlaying .buttons .musicIcon.remove-icon-group {
+ background-position: -122px -67px;
+}
+
+.audioEntry.nowPlaying .buttons .musicIcon.remove-icon {
+ background-position: -108px -67px;
}
.audioEntry {
@@ -270,12 +296,16 @@
}
.audioEntry .subTracks {
- display: flex;
+ display: none;
padding-bottom: 5px;
padding-left: 8px;
padding-right: 12px;
}
+.audioEntry .subTracks.shown {
+ display: flex;
+}
+
.audioEntry .playerButton .playIcon {
background-image: url('/assets/packages/static/openvk/img/play_buttons.gif');
cursor: pointer;
@@ -296,16 +326,45 @@
height: 23px;
}
+.audioEntry .status .mediaInfo {
+ cursor: pointer;
+ display: flex;
+ width: 100%;
+}
+
+.overflowedName {
+ position: absolute;
+ z-index: 99;
+ width: 85% !important;
+}
+
.audioEntry .status strong {
color: #4C4C4C;
}
.audioEmbed .track {
- display: none;
- padding: 4px 0;
+ padding: 0px 0;
}
-.audioEmbed .track, .audioEmbed.playing .track {
+.audioEmbed .track .selectableTrack {
+ width: 100%;
+}
+
+.audioEmbed .track .selectableTrack .selectableTrackSlider {
+ position: relative;
+ width: calc(100% - 18px);
+}
+
+.audioEmbed .subTracks .lengthTrackWrapper {
+ width: 100%;
+}
+
+.audioEmbed .subTracks .volumeTrackWrapper {
+ width: 81px;
+ margin-left: 16px;
+}
+
+.audioEmbed.playing .track {
display: unset;
}
@@ -364,7 +423,7 @@
width: 12px;
height: 11px;
float: right;
- background-position: -67px -51px;
+ background-position: -50px -67px;
margin-top: 3px;
margin-right: 3px;
}
@@ -394,8 +453,6 @@
height: 11px;
float: right;
background-position: -122px -52px;
- margin-left: 3px;
- margin-right: 3px;
}
.audioEmbed .lyrics {
@@ -416,12 +473,12 @@
text-decoration: underline;
}
-.audioEmbed.withdrawn .status > *, .audioEmbed.processed .status > *, .audioEmbed.withdrawn .playerButton > *, .audioEmbed.processed .playerButton > * {
+.audioEmbed.withdrawn .status > *, .audioEmbed.processed .playerButton > *, .audioEmbed.withdrawn .playerButton > * {
pointer-events: none;
}
.audioEmbed.withdrawn {
- filter: opacity(0.8);
+ opacity: 0.8;
}
.playlistCover img {
@@ -535,6 +592,11 @@
background-repeat: no-repeat;
}
+.explicitMark path {
+ fill: #828a99;
+ fill-opacity: .7;
+}
+
.audioStatus span {
color: #2B587A;
}
diff --git a/Web/static/img/audios_controls.png b/Web/static/img/audios_controls.png
index bf21832a..632dc6e8 100644
Binary files a/Web/static/img/audios_controls.png and b/Web/static/img/audios_controls.png differ
diff --git a/Web/static/js/al_music.js b/Web/static/js/al_music.js
index f3027311..33fb20b0 100644
--- a/Web/static/js/al_music.js
+++ b/Web/static/js/al_music.js
@@ -747,24 +747,14 @@ function initPlayer(id, keys, url, length) {
document.querySelector('link[rel="icon"], link[rel="shortcut icon"]').setAttribute("href", "/assets/packages/static/openvk/img/favicons/favicon24_playing.png")
}
- u('.subTracks .lengthTrack').nodes.forEach(el => {
- if(el && (el.style.display == 'block' || el.style.display == '')) {
- const audioEmbed = el.closest('.audioEmbed')
-
- if(audioEmbed.dataset && Number(audioEmbed.dataset.realid) == Number(playerObject.dataset.realid)) {
- return
- }
-
- el.style.display = 'none'
- audioEmbed.querySelector('.volumeTrack').style.display = 'none'
- }
+ u('.subTracks').nodes.forEach(el => {
+ el.classList.remove('shown')
})
+ u(`#audioEmbed-${ id} .subTracks`).addClass('shown')
if(!$(`#audioEmbed-${ id}`).hasClass("havePlayed")) {
$(`#audioEmbed-${ id}`).addClass("havePlayed")
- $(`#audioEmbed-${ id} .track`).toggle()
-
$.post(`/audio${playerObject.dataset.realid}/listen`, {
hash: u("meta[name=csrf]").attr("value")
});
@@ -772,7 +762,7 @@ function initPlayer(id, keys, url, length) {
};
const hideTracks = () => {
- $(`#audioEmbed-${ id} .track`).toggle()
+ $(`#audioEmbed-${ id} .track`).removeClass('shown')
$(`#audioEmbed-${ id}`).removeClass("havePlayed")
}
@@ -810,7 +800,13 @@ function initPlayer(id, keys, url, length) {
hideTracks()
})
- u(`#audioEmbed-${ id} .lengthTrack > div`).on("click", (e) => {
+ u(`#audioEmbed-${ id} .lengthTrack > div`).on("click mouseup mousemove", (e) => {
+ if(e.type == "mousemove") {
+ let buttonsPresseed = _bsdnUnwrapBitMask(e.buttons)
+ if(!buttonsPresseed[0])
+ return;
+ }
+
let rect = document.querySelector("#audioEmbed-" + id + " .selectableTrack").getBoundingClientRect();
const width = e.clientX - rect.left;
const time = Math.ceil((width * length) / (rect.right - rect.left));
@@ -830,7 +826,7 @@ function initPlayer(id, keys, url, length) {
const width = e.clientX - rect.left;
const volume = (width * 1) / (rect.right - rect.left);
- audio.volume = volume;
+ audio.volume = Math.max(0, volume);
});
audio.volume = localStorage.volume ?? 0.75
@@ -963,23 +959,24 @@ $(document).on("click", ".musicIcon.edit-icon", (e) => {
u(".ovk-diag-body #_fullyDeleteAudio").on("click", (e) => {
u("body").removeClass("dimmed");
+ u(".ovk-diag-cont").remove();
document.querySelector("html").style.overflowY = "scroll"
- u(".ovk-diag-cont").remove();
-
- $.ajax({
- type: "POST",
- url: `/audio${id}/action?act=delete`,
- data: {
- hash: u("meta[name=csrf]").attr("value")
- },
- success: (response) => {
- if(response.success)
- u(player).remove()
- else
- fastError(response.flash.message)
- }
- });
+ MessageBox(tr('confirm'), tr('confirm_deleting_audio'), [tr('yes'), tr('no')], [() => {
+ $.ajax({
+ type: "POST",
+ url: `/audio${id}/action?act=delete`,
+ data: {
+ hash: u("meta[name=csrf]").attr("value")
+ },
+ success: (response) => {
+ if(response.success)
+ u(player).remove()
+ else
+ fastError(response.flash.message)
+ }
+ });
+ }, () => {Function.noop}])
})
})
@@ -992,7 +989,12 @@ $(document).on("click", ".title.withLyrics", (e) => {
$(document).on("click", ".musicIcon.remove-icon", (e) => {
e.stopImmediatePropagation()
- let id = e.currentTarget.dataset.id
+ const id = e.currentTarget.dataset.id
+ if(e.altKey) {
+ const player = e.target.closest('.audioEmbed')
+ player.querySelector('.add-icon-group').click()
+ return
+ }
let formdata = new FormData()
formdata.append("hash", u("meta[name=csrf]").attr("value"))
@@ -1029,7 +1031,7 @@ $(document).on("click", ".musicIcon.remove-icon-group", (e) => {
e.stopImmediatePropagation()
let id = e.currentTarget.dataset.id
-
+
let formdata = new FormData()
formdata.append("hash", u("meta[name=csrf]").attr("value"))
formdata.append("club", e.currentTarget.dataset.club)
@@ -1081,7 +1083,7 @@ $(document).on("click", ".musicIcon.add-icon-group", async (ev) => {
window.openvk.writeableClubs.forEach(el => {
document.querySelector("#addIconsWindow").insertAdjacentHTML("beforeend", `
-
+
`)
})
@@ -1108,7 +1110,12 @@ $(document).on("click", ".musicIcon.add-icon-group", async (ev) => {
})
$(document).on("click", ".musicIcon.add-icon", (e) => {
- let id = e.currentTarget.dataset.id
+ const id = e.currentTarget.dataset.id
+ if(e.altKey) {
+ const player = e.target.closest('.audioEmbed')
+ player.querySelector('.add-icon-group').click()
+ return
+ }
let formdata = new FormData()
formdata.append("hash", u("meta[name=csrf]").attr("value"))
@@ -1310,7 +1317,7 @@ $(document).on("click", "#_audioAttachment", (e) => {
})
})
-$(document).on("click", ".audioEmbed.processed", (e) => {
+$(document).on("click", ".audioEmbed.processed .playerButton", (e) => {
MessageBox(tr("error"), tr("audio_embed_processing"), [tr("ok")], [Function.noop])
})
diff --git a/Web/static/js/al_navigation.js b/Web/static/js/al_navigation.js
index 11101038..4af2ce27 100644
--- a/Web/static/js/al_navigation.js
+++ b/Web/static/js/al_navigation.js
@@ -58,7 +58,7 @@ u(`#search_box input[type='search']`).on('input', async (e) => {
const current_query = u(`#search_box input[type='search']`).nodes[0].value
const section = u(`#search_box select[name='section']`).nodes[0].value
let results = null
- if(/*query.length < 2 || */query != current_query || ['users', 'groups', 'videos'].indexOf(section) == -1) {
+ if(/*query.length < 2 || */query != current_query || ['users', 'groups', 'videos', 'audios_playlists'].indexOf(section) == -1) {
return
}
@@ -74,6 +74,9 @@ u(`#search_box input[type='search']`).on('input', async (e) => {
case 'videos':
results = await fetch(`/method/video.search?auth_mechanism=roaming&q=${query}&count=10&sort=4&extended=1`)
break
+ case 'audios_playlists':
+ results = await fetch(`/method/audio.searchAlbums?auth_mechanism=roaming&query=${query}&count=10`)
+ break
}
json_result = await results.json()
@@ -103,6 +106,13 @@ u(`#search_box input[type='search']`).on('input', async (e) => {
item['preview'] = item['photo_50']
})
break
+ case 'audios_playlists':
+ json_result['items'].forEach(item => {
+ item['name'] = item['title']
+ item['url'] = '/playlist' + item['owner_id'] + '_' + item['id']
+ item['preview'] = item['cover_url']
+ })
+ break
case 'videos':
const profiles = json_result['profiles']
const groups = json_result['groups']
@@ -126,7 +136,6 @@ u(`#search_box input[type='search']`).on('input', async (e) => {
u('#searchBoxFastTips').addClass('shown')
u('#searchBoxFastTips').html('')
- console.log(json_result)
json_result.items.forEach(item => {
u('#searchBoxFastTips').append(`
diff --git a/locales/ru.strings b/locales/ru.strings
index dcd5d733..a8b8fbd6 100644
--- a/locales/ru.strings
+++ b/locales/ru.strings
@@ -836,6 +836,7 @@
"my_playlists" = "Мои плейлисты";
"playlists" = "Плейлисты";
"audios_explicit" = "Содержит нецензурную лексику";
+"audios_unlisted" = "Скрыто из поиска";
"withdrawn" = "Изъято";
"deleted" = "Удалено";
"owner" = "Владелец";
@@ -906,6 +907,7 @@
"shuffle_tip" = "Перемешать";
"mute_tip" = "Заглушить";
"playlist_hide_from_search" = "Не показывать в поиске";
+"confirm_deleting_audio" = "Вы действительно хотите полностью удалить аудиозапись?";
/* Notifications */