LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues 95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

Development #287

Merged
bones7242 merged 58 commits from development into master 2017-12-11 20:53:02 +01:00
Conversation 0 Commits 58 Files changed 39 +107 -99
3 changed files with 107 additions and 99 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit 4a62c011bd - Show all commits

98
public/assets/js/showFunctions.js
View file

@ -1,4 +1,8 @@
const showFunctions = { const showFunctions = {
state: {},
setState: function(key, value) {
this.state[key] = value;
},
addPlayPauseToVideo: function () { addPlayPauseToVideo: function () {
const that = this; const that = this;
const video = document.getElementById('video-asset'); const video = document.getElementById('video-asset');
@ -22,5 +26,99 @@ const showFunctions = {
else{ else{
video.pause(); video.pause();
} }
},
showAsset: function () {
this.hideAssetStatus();
this.showAssetHolder();
if (!this.state.src) {
return console.log('error: src is not set')
}
if (!this.state.contentType) {
return console.log('error: contentType is not set')
}
if (this.state.contentType === 'video/mp4') {
this.showVideo();
} else {
this.showImage();
}
},
showVideo: function () {
console.log('showing video', this.state.src);
const video = document.getElementById('video-asset');
const source = document.createElement('source');
source.setAttribute('src', this.state.src);
video.appendChild(source);
video.play();
},
showImage: function () {
console.log('showing image', this.state.src);
const asset = document.getElementById('image-asset');
asset.setAttribute('src', this.state.src);
},
hideAssetStatus: function () {
const assetStatus = document.getElementById('asset-status');
assetStatus.hidden = true;
},
showAssetHolder: function () {
const assetHolder = document.getElementById('asset-holder');
assetHolder.hidden = false;
},
showSearchMessage: function () {
const searchMessage = document.getElementById('searching-message');
searchMessage.hidden = false;
},
showFailureMessage: function (msg) {
console.log(msg);
const searchMessage = document.getElementById('searching-message');
const failureMessage = document.getElementById('failure-message');
const errorMessage = document.getElementById('error-message');
searchMessage.hidden = true;
failureMessage.hidden = false;
errorMessage.innerText = msg;
},
checkClaimAvailability: function () {
const that = this;
const uri = `/api/local-file-available/${this.state.claimName}/${this.state.claimId}`;
const xhr = new XMLHttpRequest();
console.log(`checking local availability for ${this.state.claimName}#${this.state.claimId}`)
xhr.open("GET", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.response);
if (xhr.status == 200) {
if (response.message === true) {
console.log('local asset is available on spee.ch')
that.showAsset();
} else {
that.showSearchMessage();
that.getAsset()
}
} else {
console.log('get failed:', response);
that.showFailureMessage('Well this sucks, but we can\'t seem to phone home');
} }
} }
};
xhr.send();
},
getAsset: function() {
const that = this;
const uri = `/api/get-claim/${this.state.claimName}/${this.state.claimId}`;
const xhr = new XMLHttpRequest();
console.log(`getting ${this.state.claimName}#${this.state.claimId}`)
xhr.open("GET", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.response);
if (xhr.status == 200) {
console.log('get returned successfully', response);
that.showAsset();
} else {
console.log('get failed:', response);
that.showFailureMessage(`${response.message}`);
}
}
};
xhr.send();
},
};

103
views/partials/asset.handlebars
View file

@ -21,101 +21,12 @@
<script type="text/javascript"> <script type="text/javascript">
const getAssetFunctions = { showFunctions.setState('src', '{{claimInfo.name}}', '{{claimInfo.claimId}}', '{{claimInfo.fileExt}}');
showAsset: function () { showFunctions.setState('claimName', '{{claimInfo.name}}');
this.hideAssetStatus(); showFunctions.setState('claimId', '{{claimInfo.claimId}}');
this.showAssetHolder(); showFunctions.setState('fileExt', '{{claimInfo.fileExt}}');
{{#ifConditional claimInfo.contentType '===' 'video/mp4'}} showFunctions.setState('contentType', '{{claimInfo.contentType}}');
this.showVideo(); console.log(showFunctions.state);
{{else}} showFunctions.checkClaimAvailability();
this.showImage();
{{/ifConditional}}
},
showVideo: function () {
console.log('showing video');
const video = document.getElementById('video-asset');
const source = document.createElement('source');
source.setAttribute('src', '/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}');
video.appendChild(source);
video.play();
},
showImage: function () {
console.log('showing image');
const asset = document.getElementById('image-asset');
asset.setAttribute('src', "/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}");
},
hideAssetStatus: function () {
const assetStatus = document.getElementById('asset-status');
assetStatus.hidden = true;
},
showAssetHolder: function () {
const assetHolder = document.getElementById('asset-holder');
assetHolder.hidden = false;
},
showSearchMessage: function () {
const searchMessage = document.getElementById('searching-message');
searchMessage.hidden = false;
},
showFailureMessage: function (msg) {
console.log(msg);
const searchMessage = document.getElementById('searching-message');
const failureMessage = document.getElementById('failure-message');
const errorMessage = document.getElementById('error-message');
searchMessage.hidden = true;
failureMessage.hidden = false;
errorMessage.innerText = msg;
},
checkClaimAvailability: function (claimName, claimId) {
console.log(`checking local availability for ${claimName}#${claimId}`)
var uri = `/api/local-file-available/${claimName}/${claimId}`;
var xhr = new XMLHttpRequest();
var that = this;
xhr.open("GET", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.response);
if (xhr.status == 200) {
if (response.message === true) {
console.log('local asset is available on spee.ch')
that.showAsset();
} else {
that.showSearchMessage();
that.getAsset(claimName, claimId)
}
} else {
console.log('get failed:', response);
that.showFailureMessage('Well this sucks, but we can\'t seem to phone home');
}
} else {
console.log('xhr.readyState', xhr.readyState);
}
};
xhr.send();
},
getAsset: function(claimName, claimId) {
console.log(`getting ${claimName}#${claimId}`)
var uri = `/api/get-claim/${claimName}/${claimId}`;
var xhr = new XMLHttpRequest();
var that = this;
xhr.open("GET", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.response);
if (xhr.status == 200) {
console.log('get returned successfully', response);
that.showAsset();
} else {
console.log('get failed:', response);
that.showFailureMessage(`${response.message}`);
}
} else {
console.log('xhr.readyState', xhr.readyState);
}
};
xhr.send();
},
}
getAssetFunctions.checkClaimAvailability('{{claimInfo.name}}', '{{claimInfo.claimId}}');
</script> </script>

1
views/partials/video.handlebars
View file

@ -6,6 +6,5 @@
</video> </video>
<script type="text/javascript"> <script type="text/javascript">
showFunctions.addPlayPauseToVideo(); showFunctions.addPlayPauseToVideo();
</script> </script>