evan/deemixer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

hide cover images from screenreaders, preventing them to read random number-letter-combinations

Browse Source
This commit is contained in:
Fcnjd 2020-05-23 22:56:25 +02:00
parent 87e759a8bf
commit 75bdc7d6a0
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
public/index.html
View File

@ -104,7 +104,7 @@ <h2>Start searching!</h2>
<div v-if="section == 'TOP_RESULT'" class="top_result clickable" @click="handleClickTopResult" <div v-if="section == 'TOP_RESULT'" class="top_result clickable" @click="handleClickTopResult"
:data-id="results.allTab.TOP_RESULT[0].id"> :data-id="results.allTab.TOP_RESULT[0].id">
<div class="cover_container"> <div class="cover_container">
<img :src="results.allTab.TOP_RESULT[0].picture" <img aria-hidden="true" :src="results.allTab.TOP_RESULT[0].picture"
:class="(results.allTab.TOP_RESULT[0].type == 'artist' ? 'circle' : 'rounded') + ' coverart'" /> :class="(results.allTab.TOP_RESULT[0].type == 'artist' ? 'circle' : 'rounded') + ' coverart'" />
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="results.allTab.TOP_RESULT[0].link" @click.stop="addToQueue" :data-link="results.allTab.TOP_RESULT[0].link"
@ -124,7 +124,7 @@ <h2>Start searching!</h2>
<div v-else-if="section == 'TRACK'"> <div v-else-if="section == 'TRACK'">
<table class="tracks_table"> <table class="tracks_table">
<tr v-for="track in results.allTab.TRACK.data.slice(0, 6)" class="track_row"> <tr v-for="track in results.allTab.TRACK.data.slice(0, 6)" class="track_row">
<td style="width: 48px; text-align: center;"><img class="rounded coverart" <td aria-hidden="true" style="width: 48px; text-align: center;"><img class="rounded coverart"
:src="'https://e-cdns-images.dzcdn.net/images/cover/'+track.ALB_PICTURE+'/32x32-000000-80-0-0.jpg'"> :src="'https://e-cdns-images.dzcdn.net/images/cover/'+track.ALB_PICTURE+'/32x32-000000-80-0-0.jpg'">
</td> </td>
<td class="breakline inline-flex"> <td class="breakline inline-flex">
@ -148,7 +148,7 @@ <h2>Start searching!</h2>
<div v-for="release in results.allTab.ARTIST.data.slice(0, 10)" class="release clickable" <div v-for="release in results.allTab.ARTIST.data.slice(0, 10)" class="release clickable"
@click="artistView" :data-id="release.ART_ID"> @click="artistView" :data-id="release.ART_ID">
<div class="cover_container"> <div class="cover_container">
<img class="circle coverart" <img aria-hidden="true" class="circle coverart"
:src="'https://e-cdns-images.dzcdn.net/images/artist/' + release.ART_PICTURE + '/156x156-000000-80-0-0.jpg'"> :src="'https://e-cdns-images.dzcdn.net/images/artist/' + release.ART_PICTURE + '/156x156-000000-80-0-0.jpg'">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="'https://deezer.com/artist/'+release.ART_ID" @click.stop="addToQueue" :data-link="'https://deezer.com/artist/'+release.ART_ID"
@ -162,7 +162,7 @@ <h2>Start searching!</h2>
<div v-for="release in results.allTab.ALBUM.data.slice(0, 10)" class="release clickable" <div v-for="release in results.allTab.ALBUM.data.slice(0, 10)" class="release clickable"
@click="albumView" :data-id="release.ALB_ID"> @click="albumView" :data-id="release.ALB_ID">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" <img aria-hidden="true" class="rounded coverart"
:src="'https://e-cdns-images.dzcdn.net/images/cover/' + release.ALB_PICTURE + '/156x156-000000-80-0-0.jpg'"> :src="'https://e-cdns-images.dzcdn.net/images/cover/' + release.ALB_PICTURE + '/156x156-000000-80-0-0.jpg'">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="'https://deezer.com/album/'+release.ALB_ID" @click.stop="addToQueue" :data-link="'https://deezer.com/album/'+release.ALB_ID"
@ -180,7 +180,7 @@ <h2>Start searching!</h2>
<div v-for="release in results.allTab.PLAYLIST.data.slice(0, 10)" class="release clickable" <div v-for="release in results.allTab.PLAYLIST.data.slice(0, 10)" class="release clickable"
@click="playlistView" :data-id="release.PLAYLIST_ID"> @click="playlistView" :data-id="release.PLAYLIST_ID">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" <img aria-hidden="true" class="rounded coverart"
:src="'https://e-cdns-images.dzcdn.net/images/'+ release.PICTURE_TYPE +'/' + release.PLAYLIST_PICTURE + '/156x156-000000-80-0-0.jpg'"> :src="'https://e-cdns-images.dzcdn.net/images/'+ release.PICTURE_TYPE +'/' + release.PLAYLIST_PICTURE + '/156x156-000000-80-0-0.jpg'">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="'https://deezer.com/playlist/'+release.PLAYLIST_ID" @click.stop="addToQueue" :data-link="'https://deezer.com/playlist/'+release.PLAYLIST_ID"
@ -250,7 +250,7 @@ <h1>No Albums found</h1>
<div v-for="release in results.albumTab.data" class="release clickable" @click="albumView" <div v-for="release in results.albumTab.data" class="release clickable" @click="albumView"
:data-id="release.id"> :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.cover_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.cover_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -275,7 +275,7 @@ <h1>No Artists found</h1>
<div v-for="release in results.artistTab.data" class="release clickable" @click="artistView" <div v-for="release in results.artistTab.data" class="release clickable" @click="artistView"
:data-id="release.id"> :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="circle coverart" :src="release.picture_medium"> <img aria-hidden="true" class="circle coverart" :src="release.picture_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -297,7 +297,7 @@ <h1>No Playlists found</h1>
<div v-for="release in results.playlistTab.data" class="release clickable" @click="playlistView" <div v-for="release in results.playlistTab.data" class="release clickable" @click="playlistView"
:data-id="release.id"> :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.picture_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.picture_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -324,7 +324,7 @@ <h3 class="section_heading">Popular playlists</h3>
<div v-for="release in playlists" class="release clickable" @click="playlistView" <div v-for="release in playlists" class="release clickable" @click="playlistView"
:data-id="release.id"> :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.picture_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.picture_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -339,7 +339,7 @@ <h3 class="section_heading">Most streamed albums</h3>
<div class="release_grid"> <div class="release_grid">
<div v-for="release in albums" class="release clickable" @click="albumView" :data-id="release.id"> <div v-for="release in albums" class="release clickable" @click="albumView" :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.cover_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.cover_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -418,7 +418,7 @@ <h1>No Playlists found</h1>
<div v-for="release in playlists" class="release clickable" @click="playlistView" <div v-for="release in playlists" class="release clickable" @click="playlistView"
:data-id="release.id"> :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.picture_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.picture_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -429,7 +429,7 @@ <h1>No Playlists found</h1>
<div v-for="release in spotifyPlaylists" class="release clickable" @click="spotifyPlaylistView" <div v-for="release in spotifyPlaylists" class="release clickable" @click="spotifyPlaylistView"
:data-id="release.id"> :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.picture_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.picture_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -446,7 +446,7 @@ <h1>No Favorite Albums found</h1>
<div class="release_grid" v-if="albums.length > 0"> <div class="release_grid" v-if="albums.length > 0">
<div v-for="release in albums" class="release clickable" @click="albumView" :data-id="release.id"> <div v-for="release in albums" class="release clickable" @click="albumView" :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="rounded coverart" :src="release.cover_medium"> <img aria-hidden="true" class="rounded coverart" :src="release.cover_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>
@ -463,7 +463,7 @@ <h1>No Favorite Artist found</h1>
<div class="release_grid" v-if="artists.length > 0"> <div class="release_grid" v-if="artists.length > 0">
<div v-for="release in artists" class="release clickable" @click="artistView" :data-id="release.id"> <div v-for="release in artists" class="release clickable" @click="artistView" :data-id="release.id">
<div class="cover_container"> <div class="cover_container">
<img class="circle coverart" :src="release.picture_medium"> <img aria-hidden="true" class="circle coverart" :src="release.picture_medium">
<div role="button" aria-label="download" @contextmenu.prevent="openQualityModal" <div role="button" aria-label="download" @contextmenu.prevent="openQualityModal"
@click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i @click.stop="addToQueue" :data-link="release.link" class="download_overlay"><i
class="material-icons">get_app</i></div> class="material-icons">get_app</i></div>