secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Musicbrainz is out, Discogs is in

Browse Source
This commit is contained in:
James Barnsley
2019-09-05 15:18:16 +12:00
parent 6a7391d042
commit c55df548f1
17 changed files with 347 additions and 291 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/js/components/ArtistGrid.js
View File

@ -9,6 +9,7 @@ import GridItem from './GridItem';
import * as helpers from '../helpers';
import * as uiActions from '../services/ui/actions';
import * as lastfmActions from '../services/lastfm/actions';
import * as discogsActions from '../services/discogs/actions';
class ArtistGrid extends React.Component{
@ -46,6 +47,7 @@ class ArtistGrid extends React.Component{
item={artist}
show_source_icon={this.props.show_source_icon}
onClick={e => {this.props.history.push('/artist/'+encodeURIComponent(artist.uri))}}
discogsActions={this.props.discogsActions}
lastfmActions={this.props.lastfmActions}
onContextMenu={e => this.handleContextMenu(e,artist)}
/>
@ -69,7 +71,8 @@ const mapStateToProps = (state, ownProps) => {
const mapDispatchToProps = (dispatch) => {
return {
uiActions: bindActionCreators(uiActions, dispatch),
lastfmActions: bindActionCreators(lastfmActions, dispatch)
lastfmActions: bindActionCreators(lastfmActions, dispatch),
discogsActions: bindActionCreators(discogsActions, dispatch),
}
}

24
src/js/components/GridItem.js
View File

@ -8,30 +8,24 @@ import Thumbnail from './Thumbnail';
import ArtistSentence from './ArtistSentence';
export default class GridItem extends React.Component{
constructor(props){
super(props)
}
componentDidMount(){
if (this.props.item){
var item = this.props.item;
} else {
return;
}
const { discogsActions, lastfmActions, item } = this.props;
if (!item) return;
// If the item that has just been mounted doesn't have images,
// try fetching them from LastFM
if (!item.images && this.props.lastfmActions){
// try fetching them from LastFM or Discogs
if (!item.images && discogsActions){
switch (helpers.uriType(item.uri)){
case 'artist':
//this.props.lastfmActions.getArtist(item.uri, item.name);
if (discogsActions) {
discogsActions.getArtistImages(item.uri, item);
}
break;
case 'album':
if (item.artists && item.artists.length > 0){
this.props.lastfmActions.getAlbum(item.uri, item.artists[0].name, item.name, (item.mbid ? item.mbid : null));
if (lastfmActions && item.artists && item.artists.length > 0){
lastfmActions.getAlbum(item.uri, item.artists[0].name, item.name, (item.mbid ? item.mbid : null));
}
break;
}

5
src/js/components/List.js
View File

@ -9,6 +9,7 @@ import ListItem from './ListItem';
import * as helpers from '../helpers';
import * as uiActions from '../services/ui/actions';
import * as lastfmActions from '../services/lastfm/actions';
import * as discogsActions from '../services/discogs/actions';
class List extends React.Component{
@ -40,6 +41,7 @@ class List extends React.Component{
key={index}
item={item}
lastfmActions={this.props.lastfmActions}
discogsActions={this.props.discogsActions}
history={this.props.history}
link_prefix={this.props.link_prefix}
handleContextMenu={e => this.handleContextMenu(e, item)}
@ -62,7 +64,8 @@ const mapStateToProps = (state, ownProps) => {
const mapDispatchToProps = (dispatch) => {
return {
uiActions: bindActionCreators(uiActions, dispatch),
lastfmActions: bindActionCreators(lastfmActions, dispatch)
lastfmActions: bindActionCreators(lastfmActions, dispatch),
discogsActions: bindActionCreators(discogsActions, dispatch),
}
}

17
src/js/components/ListItem.js
View File

@ -18,24 +18,23 @@ export default class ListItem extends React.Component{
}
componentDidMount(){
if (this.props.item){
var item = this.props.item;
} else {
return;
}
const { item, lastfmActions, discogsActions } = this.props;
if (!item) return;
// If the item that has just been mounted doesn't have images,
// try fetching them from LastFM
if (!item.images && this.props.lastfmActions){
if (!item.images){
switch (helpers.uriType(item.uri)){
case 'artist':
//this.props.lastfmActions.getArtist(item.uri, item.name);
if (discogsActions) {
discogsActions.getArtistImages(item.uri, item);
}
break;
case 'album':
if (item.artists && item.artists.length > 0){
this.props.lastfmActions.getAlbum(item.uri, item.artists[0].name, item.name, (item.mbid ? item.mbid : null));
if (lastfmActions && item.artists && item.artists.length > 0){
lastfmActions.getAlbum(item.uri, item.artists[0].name, item.name, (item.mbid ? item.mbid : null));
}
break;
}

2
src/js/components/Parallax.js
View File

@ -70,7 +70,7 @@ export default class Parallax extends React.Component{
var style = {};
if (this.state.loaded && this.state.url){
style = {backgroundImage: 'url('+this.state.url+')'};
style = {backgroundImage: `url("${this.state.url}")`};
}
return (

64
src/js/services/musicbrainz/actions.js → src/js/services/discogs/actions.js
View File

@ -14,13 +14,19 @@ var sendRequest = (dispatch, endpoint, params) => {
return new Promise((resolve, reject) => {
const loader_key = helpers.generateGuid();
dispatch(uiActions.startLoading(loader_key, ',musicbrainz_'+endpoint));
dispatch(uiActions.startLoading(loader_key, ',discogs_'+endpoint));
let key = 'CXIwsVMAjrXIVitBWgqd';
let secret = 'KiEUfwKpebxRnEHlKoXnYIftJxeuqjTK';
var config = {
method: 'GET',
cache: true,
timeout: 30000,
url: 'https://musicbrainz.org/ws/2/'+endpoint+'?fmt=json&'+params
url: `https://api.discogs.com/${endpoint}?key=${key}&secret=${secret}&${params}`,
headers: {
'user-agent': 'Iris/1.0',
},
}
$.ajax(config).then(
@ -56,40 +62,46 @@ var sendRequest = (dispatch, endpoint, params) => {
})
}
export function findArtist(uri, artist){
return (dispatch, getState) => {
sendRequest(dispatch, 'artist', 'query=artist:'+artist.name)
.then(
response => {
console.log(response);
},
error => {
console.info("Musicbrainz: No results for artist '"+artist.name+"'");
export function findArtist(name){
return sendRequest(dispatch, 'artists/'+artist.mbid, 'inc=url-rels')
.then(
response => {
if (response){
const image_relations = response.relations.filter(rel => rel.type == "image");
if (image_relations) {
const updated_artist = {
uri: uri,
images: image_relations.map(relation =>
relation.url.resource.replace("File:","Special:FilePath/")
),
}
dispatch(coreActions.artistLoaded(updated_artist));
}
}
)
}
},
error => {
console.log(`Musicbrainz: No results for ${artist.mbid}`)
}
)
}
export function getArtist(uri, artist){
export function getArtistImages(uri, artist){
return (dispatch, getState) => {
sendRequest(dispatch, 'artist/'+artist.mbid, 'inc=url-rels')
sendRequest(dispatch, 'database/search', `query=${artist.name}`)
.then(
response => {
if (response){
const image_relations = response.relations.filter(rel => (rel['target-type'] === 'image'));
const images = image_relations.map(ir => ir.url.resource);
var artist = {
uri: uri,
images: images,
};
console.log(response);
console.log(image_relations);
dispatch(coreActions.artistLoaded(artist));
if (response.results && response.results[0].cover_image) {
const updated_artist = {
uri: uri,
images: [response.results[0].cover_image],
}
dispatch(coreActions.artistLoaded(updated_artist));
}
}
},
error => {
console.info("Musicbrainz: No results for artist '"+artist.uri+"'");
console.log(`Discogs: No results for ${artist.name}`)
}
)
}

3
src/js/services/lastfm/actions.js
View File

@ -1,6 +1,5 @@
var coreActions = require('../core/actions');
var musicbrainzActions = require('../musicbrainz/actions');
var uiActions = require('../ui/actions');
var helpers = require('../../helpers');
@ -253,7 +252,6 @@ export function getArtist(uri, artist, mbid = false){
if (response.artist){
var artist = {
uri: uri,
//images: response.artist.image,
mbid: response.artist.mbid,
biography: response.artist.bio.content,
biography_publish_date: response.artist.bio.published,
@ -262,7 +260,6 @@ export function getArtist(uri, artist, mbid = false){
};
dispatch(coreActions.artistLoaded(artist));
dispatch(musicbrainzActions.getArtist(uri, artist));
}
},
error => {

8
src/js/services/mopidy/middleware.js
View File

@ -12,7 +12,7 @@ var spotifyActions = require('../spotify/actions.js');
var pusherActions = require('../pusher/actions.js');
var googleActions = require('../google/actions.js');
var lastfmActions = require('../lastfm/actions.js');
var musicbrainzActions = require('../musicbrainz/actions.js');
var discogsActions = require('../discogs/actions.js');
const MopidyMiddleware = (function(){
@ -2150,10 +2150,14 @@ const MopidyMiddleware = (function(){
store.dispatch(coreActions.artistLoaded(artist));
// Load supprting information from LastFM and Musicbrainz
// Load supprting information from LastFM and Discogs
var existing_artist = store.getState().core.artists[artist.uri];
if (existing_artist) {
if (!existing_artist.images) {
store.dispatch(discogsActions.getArtistImages(artist.uri, artist));
}
// Get biography and other stats from LastFM
if (!existing_artist.biography){
// TODO: Move this condition into lastfmActions

15
src/js/services/musicbrainz/middleware.js
View File

@ -1,15 +0,0 @@
var helpers = require('./../../helpers');
var musicbrainzActions = require('./actions');
const MusicbrainzMiddleware = (function(){
return store => next => action => {
switch(action.type){
default:
return next(action);
}
}
})();
export default MusicbrainzMiddleware

7
src/js/services/musicbrainz/reducer.js
View File

@ -1,7 +0,0 @@
export default function reducer(musicbrainz = {}, action){
switch (action.type){
default:
return lastfm
}
}

35
src/js/views/User.js
View File

@ -97,20 +97,31 @@ class User extends React.Component{
<div className="view user-view preserve-3d">
<div className="intro preserve-3d">
<Parallax image={image} fixedHeight />
<Parallax image={image} blur />
<div className="liner">
<h1>{user.name}</h1>
<h2>
<ul className="details">
{!this.props.slim_mode ? <li className="source"><Icon type="fontawesome" name={helpers.sourceIcon(user.uri )} /></li> : null}
{user.playlists_total ? <li><NiceNumber value={user.playlists_total} /> playlists</li> : null}
{user.followers ? <li><NiceNumber value={user.followers} /> followers</li> : null}
{this.isMe() ? <li><span className="blue-text">You</span></li> : null}
</ul>
</h2>
<div className="actions">
<FollowButton className="primary" uri={user.uri} addText="Follow" removeText="Unfollow" />
<div className="heading">
<div className="heading__thumbnail">
<Thumbnail size="medium" circle canZoom image={image} />
</div>
<div className="heading__content">
<h1>{user.name}</h1>
<div className="heading__content__details">
<div className="actions">
<FollowButton className="primary" uri={user.uri} addText="Follow" removeText="Unfollow" />
</div>
<h2>
<ul className="details">
{!this.props.slim_mode ? <li className="source"><Icon type="fontawesome" name={helpers.sourceIcon(user.uri )} /></li> : null}
{user.playlists_total ? <li><NiceNumber value={user.playlists_total} /> playlists</li> : null}
{user.followers ? <li><NiceNumber value={user.followers} /> followers</li> : null}
{this.isMe() ? <li><span className="blue-text">You</span></li> : null}
</ul>
</h2>
</div>
</div>
</div>
</div>
</div>

26
src/scss/views/_user.scss
View File

@ -14,17 +14,23 @@
font-size: 4rem;
}
h2 {
padding-bottom: 25px;
}
}
}
.heading {
display: flex;
align-items: center;
.content-wrapper {
background: colour(dark_grey);
.light-theme & {
background: colour(white);
&__thumbnail {
width: 140px;
margin-right: 30px;
}
&__content {
padding-top: 20px;
&__details {
display: flex;
}
}
}
}
}