Stop inlining Youtube videos for now

This commit is contained in:
Jonathan Cremin 2015-01-13 01:06:37 +00:00
parent c6681ae436
commit 1965a8787d
10 changed files with 66 additions and 58 deletions

View file

@ -113,7 +113,7 @@ module.exports.search = function(data) {
return request.get(apiRoot + path).promise().then(function(res) {
if (!res.body.data[0]) {
var matches = album.match(/^[^\(\[]+/);
if (matches[0] && matches[0] != album) {
if (matches && matches[0] && matches[0] != album) {
var cleanedData = JSON.parse(JSON.stringify(data));
if (type == "album") {
cleanedData.name = matches[0].trim();

View file

@ -88,7 +88,7 @@ module.exports.search = function(data) {
return request.get(apiRoot + path).promise().then(function(res) {
if (!res.body.data[0]) {
var matches = album.match(/^[^\(\[]+/);
if (matches[0] && matches[0] != album) {
if (matches && matches[0] && matches[0] != album) {
var cleanedData = JSON.parse(JSON.stringify(data));
if (type == "album") {
cleanedData.name = matches[0].trim();

View file

@ -113,7 +113,7 @@ module.exports.search = function(data) {
if (!result.entries) {
var matches = album.match(/^[^\(\[]+/);
if (matches[0] && matches[0] != album) {
if (matches && matches[0] && matches[0] != album) {
var cleanedData = JSON.parse(JSON.stringify(data));
if (type == "album") {
cleanedData.name = matches[0].trim();

View file

@ -97,7 +97,7 @@ module.exports.search = function(data) {
if (!result.results[0]) {
var matches = album.match(/^[^\(\[]+/);
if (matches[0] && matches[0] != album) {
if (matches && matches[0] && matches[0] != album) {
var cleanedData = JSON.parse(JSON.stringify(data));
if (type == "album") {
cleanedData.name = matches[0].trim();

View file

@ -37,44 +37,60 @@ module.exports.parseUrl = function(url) {
module.exports.lookupId = function(id, type) {
var path = "/videos?part=snippet%2Cstatus%2CtopicDetails&id=" + id + "&key=" + credentials.key;
var path = "/videos?part=snippet%2CtopicDetails&id=" + id + "&key=" + credentials.key;
return request.get(apiRoot + path).promise().then(function(res) {
var item = res.body.items[0];
if (item.topicDetails.topicIds) {
var promises = [];
var match = {
id: id,
service: "youtube",
name: item.snippet.title,
type: "track",
album: {name: ""},
streamUrl: "https://youtu.be/" + id,
purchaseUrl: null,
artwork: {
small: item.snippet.thumbnails.medium.url,
large: item.snippet.thumbnails.high.url,
}
};
item.topicDetails.topicIds.forEach(function(topicId) {
promises.push(freebase.get(topicId).then(function(topic) {
return (topic.property["/music/recording/song"] ? topic : (topic.property["/music/recording/tracks"] ? topic : false));
if (topic.property["/type/object/type"].values.some(function(value) {
return value.text == "Musical Artist";
})) {
match.artist = {name: topic.property["/type/object/name"].values[0].text};
} else if (topic.property["/type/object/type"].values.some(function(value) {
return value.text == "Musical Recording";
})) {
if (!match.name) {
match.album = {name: topic.property["/music/recording/releases"].values[0].text};
match.name = topic.property["/type/object/name"].values[0].text;
match.type = "track";
}
} else if (topic.property["/type/object/type"].values.some(function(value) {
return value.text == "Musical Album";
})) {
match.name = topic.property["/type/object/name"].values[0].text;
match.type = "album";
}
}, function(err) {
console.log(err)
}));
})
return Promise.all(promises).then(function(topics) {
for (var key in topics) {
var topic = topics[key];
if (topic) {
return {
id: id,
service: "youtube",
type: "track",
name: topic.property['/music/recording/song'] ? topic.property['/music/recording/song'].values[0].text : topic.property["/music/recording/tracks"].values[0].text,
artist: {name: topic.property['/music/recording/artist'].values[0].text},
album: {name: ""},
streamUrl: "https://youtu.be/" + id,
purchaseUrl: null,
artwork: {
small: item.snippet.thumbnails.medium.url,
large: item.snippet.thumbnails.high.url,
}
}
}
}
});
return Promise.all(promises).then(function() {
return match;
}, function(err) {
console.log(err)
return {service: "youtube"};
});
} else {
return {service: "youtube"};
}
}, function(res) {
}, function(err) {
console.log(err)
return {service: "youtube"};
});
};
@ -112,5 +128,8 @@ module.exports.search = function(data) {
}
};
}
}, function(err) {
console.log(err)
return {service: "youtube"};
});
};

BIN
public/images/logo-128.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7 KiB

BIN
public/images/youtube.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

View file

@ -171,6 +171,17 @@ h3 {
opacity: 0.7;
font-weight: bold;
}
.youtube {
position: absolute;
font-weight: bold;
bottom: 65px;
left: 25px;
right: 25px;
padding: 10px;
opacity: 0.85;
background: #fff;
color: #FE4365;
}
.loading-wrap {
position: absolute;
top: 0;left: 0;

View file

@ -15,7 +15,7 @@ module.exports = React.createClass({
<head>
<meta charSet="utf-8" />
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<title>Match Audio</title>
<title>{this.props.shares ? "Listen to " + this.props.shares[0].name + " by " + this.props.shares[0].artist.name + " on Match Audio": "Match Audio"}</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#FE4365" />
@ -26,7 +26,7 @@ module.exports = React.createClass({
<meta name="twitter:image:src" property="og:image" content={image} />
<meta property="og:url" content={shareUrl} />
<link rel="shortcut icon" href="/images/favicon.png" />
<link rel="icon" sizes="512x512" href="/images/logo-512.png" />
<link rel="icon" sizes="512x512" href="/images/logo-128.png" />
<link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="/stylesheets/style.css" />

View file

@ -44,7 +44,11 @@ var MusicItem = React.createClass({
<div className={"service" + (this.props.inc == 0 ? " source-service" : "")}>
<div className="matching-from hidden-xs">{this.props.inc == 0 ? "Found matches using this link": ""}</div>
<a href={this.props.item.streamUrl || this.props.item.purchaseUrl}>
<div className="artwork" style={{backgroundImage: "url("+this.props.item.artwork.small+")"}}></div>
<div className="artwork" style={{backgroundImage: "url("+this.props.item.artwork.small+")"}}>
</div>
<div className={this.props.item.service == "youtube" && this.props.inc > 0 ? "youtube" : ""}>
{this.props.item.service == "youtube" && this.props.inc > 0 ? this.props.item.name : ""}
</div>
</a>
<div className="service-link">
<a href={this.props.item.streamUrl || this.props.item.purchaseUrl}>
@ -59,28 +63,6 @@ var MusicItem = React.createClass({
});
var VideoItem = React.createClass({
render: function() {
if (this.props.item.id) {
return (
<div className="col-md-6 col-xs-12">
<div className={"service" + (this.props.inc == 0 ? " source-service" : "")}>
<div className="matching-from hidden-xs">{this.props.inc == 0 ? "Found matches using this link": ""}</div>
<div className="js-video widescreen">
<iframe width="100%" src={"//www.youtube.com/embed/" + this.props.item.id} frameBorder="0" allowFullScreen></iframe>
</div>
<a href={"https://www.youtube.com/results?search_query=" + this.props.items[0].name + " " + this.props.items[0].artist.name}>More Youtube matches</a>
</div>
</div>
);
} else {
return (<div />);
}
}
});
module.exports = React.createClass({
mixins: [ Router.State ],
@ -202,11 +184,7 @@ module.exports = React.createClass({
</div>
<div className="row">
{this.state.shares.map(function(item, i){
if (item.service == "youtube") {
return (<VideoItem items={this.state.shares} item={item} inc={i} key={i} />);
} else {
return (<MusicItem items={this.state.shares} item={item} inc={i} key={i} />);
}
return (<MusicItem items={this.state.shares} item={item} inc={i} key={i} />);
}.bind(this))}
</div>
</div>