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

fixed video player and image src issue

Browse source
This commit is contained in:
bill bittner 2017-11-29 09:10:40 -08:00
parent cf7ffeb783
commit cb62f0858c
3 changed files with 41 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
public/assets/css/general.css
View file

@ -298,10 +298,6 @@ a, a:visited {
color: red;
}
.info-message-placeholder {
}
/* INPUT FIELDS */
/* blocks */
@ -349,14 +345,6 @@ option {
cursor: pointer;
}
#claim-name-input {
}
#input-success-claim-name {
}
.span--relative {
position: relative;
}

53
views/partials/asset.handlebars
View file

@ -1,7 +1,8 @@
<div id="asset-display-component">
<p id="search-message" hidden="true">We're currently combing the blockchain for your asset!</p>
<p id="searching-message" hidden="true">We're currently combing the blockchain for your asset!</p>
<p id="in-progress-message" hidden="true"></p>
<p id="failure-message" hidden="true"></p>
<div id="asset-holder" hidden="true">
<div id="asset-holder">
{{#ifConditional claimInfo.contentType '===' 'video/mp4'}}
{{> video}}
{{else}}
@ -14,21 +15,46 @@
const getAssetFunctions = {
showAsset: function () {
const searchMessage = document.getElementById('search-message');
const assetHolder = document.getElementById('asset-holder');
const asset = document.getElementById('asset');
searchMessage.hidden = true;
assetHolder.hidden = false;
asset.setAttribute('src', `/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}`);
this.hideMessages();
{{#ifConditional claimInfo.contentType '===' 'video/mp4'}}
this.showVideo();
{{else}}
this.showImage();
{{/ifConditional}}
},
showSearchMessage: function (msg) {
console.log(msg);
const searchMessage = document.getElementById('search-message');
showVideo: function () {
console.log('showing video');
const video = document.getElementById('video-player');
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('asset');
asset.setAttribute('src', "/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}");
},
hideMessages: function () {
const searchMessage = document.getElementById('searching-message');
const inProgressMessage = document.getElementById('in-progress-message');
searchMessage.hidden = true;
inProgressMessage.hidden = true;
},
showSearchMessage: function () {
const searchMessage = document.getElementById('searching-message');
searchMessage.hidden = false;
},
showInProgressMessage: function (msg) {
const searchMessage = document.getElementById('searching-message');
const inProgressMessage = document.getElementById('in-progress-message');
searchMessage.hidden = true;
inProgressMessage.hidden = false;
inProgressMessage.innerText = msg;
},
showFailureMessage: function (msg) {
console.log(msg);
const searchMessage = document.getElementById('search-message');
const searchMessage = document.getElementById('searching-message');
const failureMessage = document.getElementById('failure-message');
searchMessage.hidden = true;
failureMessage.hidden = false;
@ -78,7 +104,8 @@
that.showAsset();
} else {
console.log('lbrynet is still downloading the asset');
setTimeout(getAsset, 5000);
that.showInProgressMessage(response.message);
setTimeout(that.getAsset, 5000);
}
} else {
console.log('get failed:', response);

2
views/partials/image.handlebars
View file

@ -1 +1 @@
<img id="asset" class="asset" />
<img id="asset" class="asset"/>