lone-cloud/huegasm
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Adding support for song artwork

Browse source
This commit is contained in:
Egor 2015-10-14 09:40:10 -07:00
parent 3f3466aa6f
commit e77be11dec
4 changed files with 48 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
app/pods/components/music-tab/component.js
View file

@ -27,7 +27,14 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
this.get('notify').alert({html: this.get('scUserNotSupportedHtml')}); this.get('notify').alert({html: this.get('scUserNotSupportedHtml')});
} else if(result.kind === 'track') { } else if(result.kind === 'track') {
if(result.streamable === true){ if(result.streamable === true){
this.get('playQueue').pushObject({url: result.stream_url + '?client_id=' + this.get('SC_CLIENT_ID'), fileName: result.title + ' - ' + result.user.username, artist: result.user.username, artistUrl: result.user.permalink_url, title: result.title, artworkUrl: result.artwork_url, fromSoundCloud: true }); var picture = null;
if(result.artwork_url){
picture = result.artwork_url;
}
this.get('playQueue').pushObject({url: result.stream_url + '?client_id=' + this.get('SC_CLIENT_ID'), fileName: result.title + ' - ' + result.user.username, artist: result.user.username, artistUrl: result.user.permalink_url, title: result.title, artworkUrl: result.artwork_url, picture: picture });
// make sure to init the first song // make sure to init the first song
if(this.get('playQueue').length > 0 && this.get('playQueuePointer') === -1){ if(this.get('playQueue').length > 0 && this.get('playQueuePointer') === -1){
this.send('goToSong', 0, true); this.send('goToSong', 0, true);
@ -314,8 +321,19 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
var self = this, var self = this,
playQueue = this.get('playQueue'), playQueue = this.get('playQueue'),
updatePlayQueue = function(){ updatePlayQueue = function(){
var tags = ID3.getAllTags("local"); var tags = ID3.getAllTags("local"),
playQueue.pushObject({filename: this.name.replace(/\.[^/.]+$/, ""), url: URL.createObjectURL(this), artist: tags.artist, title: tags.title }); picture = null;
if(tags.picture){
var base64String = "";
for (var i = 0; i < tags.picture.data.length; i++) {
base64String += String.fromCharCode(tags.picture.data[i]);
}
picture = "data:" + tags.picture.format + ";base64," + window.btoa(base64String);
}
playQueue.pushObject({filename: this.name.replace(/\.[^/.]+$/, ""), url: URL.createObjectURL(this), artist: tags.artist, title: tags.title, picture: picture });
ID3.clearAll(); ID3.clearAll();
@ -331,7 +349,8 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
if(file.type.startsWith('audio')) { if(file.type.startsWith('audio')) {
ID3.loadTags("local", updatePlayQueue.bind(file),{ ID3.loadTags("local", updatePlayQueue.bind(file),{
dataReader: new FileAPIReader(file) dataReader: new FileAPIReader(file),
tags: ['title', 'artist', 'album', 'track', 'picture']
}); });
} }
} }

30
app/pods/components/music-tab/template.hbs
View file

@ -69,21 +69,27 @@
{{/if}} {{/if}}
{{#each playQueue as |item index|}} {{#each playQueue as |item index|}}
<div <div class="playlistItem cursorPointer {{if (eq index playQueuePointer) "active"}} {{if dragging "hidden"}}" {{action "goToSong" index true bubbles=false}}>
class="playlistItem cursorPointer {{if (eq index playQueuePointer) "active"}} {{if dragging "hidden"}}" {{action "goToSong" index true bubbles=false}}> {{#if item.picture}}
{{#if item.title}} <img class="albumArt" src={{item.picture}}>
<p>{{item.title}}</p> {{/if}}
<div class="songArtist">
{{#if item.artistUrl}} <div class="songInfo">
<a href="#" {{action "gotoURL" item.artistUrl bubbles=false}}>{{item.artist}}</a> {{#if item.title}}
<p>{{item.title}}</p>
<div class="songArtist">
{{#if item.artistUrl}}
<a href="#" {{action "gotoURL" item.artistUrl bubbles=false}}>{{item.artist}}</a>
{{else}}
{{item.artist}}
{{/if}}
</div>
{{else}} {{else}}
{{item.artist}} {{item.filename}}
{{/if}} {{/if}}
</div> </div>
{{else}}
{{item.filename}} <div data-toggle="tooltip" data-placement="bottom auto" data-title="Remove" class="audioRemoveButton cursorPointer bootstrapTooltip" {{action "removeAudio" index bubbles=false}}>{{paper-icon icon="close"}}
{{/if}}
<div data-toggle="tooltip" data-placement="bottom auto" data-title="Remove from playlist" container="body" class="audioRemoveButton cursorPointer bootstrapTooltip" {{action "removeAudio" index bubbles=false}}>{{paper-icon icon="close"}}
</div> </div>
</div> </div>
{{/each}} {{/each}}

6
app/styles/app.scss
View file

@ -652,6 +652,12 @@ md-switch.md-default-theme.md-checked .md-thumb {
p { p {
margin: 0; margin: 0;
} }
.albumArt {
height: 60px;
}
.songInfo {
display: inline-block;
}
} }
.playlistItem.active { .playlistItem.active {

2
config/environment.js
View file

@ -24,7 +24,7 @@ module.exports = function(environment) {
'script-src': "'self' connect.soundcloud.com", 'script-src': "'self' connect.soundcloud.com",
'font-src': "'self' fonts.gstatic.com", 'font-src': "'self' fonts.gstatic.com",
'connect-src': "'self' *", 'connect-src': "'self' *",
'img-src': "'self' data:", 'img-src': "'self' *.sndcdn.com data:",
'media-src': "'self' api.soundcloud.com *.sndcdn.com blob:", 'media-src': "'self' api.soundcloud.com *.sndcdn.com blob:",
'style-src': "'self' 'unsafe-inline' fonts.googleapis.com", 'style-src': "'self' 'unsafe-inline' fonts.googleapis.com",
'object-src': "'self' connect.soundcloud.com", 'object-src': "'self' connect.soundcloud.com",