mirror of
https://github.com/LBRYFoundation/lbry.com.git
synced 2025-08-23 17:47:26 +00:00
Cleanup and finishing up yt_sync features
This commit is contained in:
maximest-pierre
parent
10ff0aba39
commit
f0b971b6ad
5 changed files with 77 additions and 25 deletions
|
|
@ -5,6 +5,7 @@ Response::addJsAsset('/js/yt2/ScrollToPlugin.min.js');
|
|||
Response::addJsAsset('/js/yt2/app.js');
|
||||
Response::addJsAsset('/js/yt2/FormValidation.js');
|
||||
Response::addJsAsset('/js/yt2/SyncStatus.js');
|
||||
Response::addJsAsset('/js/yt2/youtube_video.js');
|
||||
$reward = LBRY::youtubeReward();
|
||||
Response::setMetaTitle("LBRY YouTube Partner Program");
|
||||
Response::setMetaDescription("Put your content on the blockchain, experience true content freedom, and earn rewards.");
|
||||
|
|
@ -75,28 +76,30 @@ Response::setMetaDescription("Put your content on the blockchain, experience tru
|
|||
<p>Take your peers and your audience with you. Create without limits.</p>
|
||||
<div class="boxes">
|
||||
<div class="box">
|
||||
<a href="https://spee.ch/ever-wonder-how-bitcoin-and-other" class="image" target="_blank">
|
||||
<img src="/img/youtube/01@2x.jpg">
|
||||
<div class="to-play"><span></span></div>
|
||||
</a>
|
||||
<div class="image" target="_blank">
|
||||
<div class="to-play" onclick="playVideo1()"><span></span></div>
|
||||
<video id="video1" width="100%" poster="/img/youtube/01@2x.jpg" src="https://spee.ch/1ac47b8b3def40a25850dc726a09ce23d09e7009/ever-wonder-how-bitcoin-and-other.mp4"/></video>
|
||||
</div>
|
||||
|
||||
<div class="text">
|
||||
<p>@3Blue1Brown</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<a href="https://spee.ch/3c96f32de285db6c04e80bd6f5fad573250541e9/casually-successful" class="image" target="_blank">
|
||||
<img src="/img/youtube/02@2x.jpg">
|
||||
<div class="to-play"><span></span></div>
|
||||
</a>
|
||||
<div class="image" target="_blank">
|
||||
<div class="to-play" onclick="playVideo2()"><span></span></div>
|
||||
<video id="video2" width="100%" poster="/img/youtube/02@2x.jpg" src="https://spee.ch/3c96f32de285db6c04e80bd6f5fad573250541e9/casually-successful.mp4"/></video>
|
||||
</div>
|
||||
|
||||
<div class="text">
|
||||
<p>@CasuallyExplained</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<a href="https://spee.ch/the-historical-elements-of-wolfenstein" class="image" target="_blank">
|
||||
<img src="/img/youtube/03@2x.jpg">
|
||||
<div class="to-play"><span></span></div>
|
||||
</a>
|
||||
<div class="image" target="_blank">
|
||||
<div class="to-play" onclick="playVideo3()"><span></span></div>
|
||||
<video id="video3" width="100%" poster="/img/youtube/03@2x.jpg" src="https://spee.ch/8958c5d573d71f5c2d0c1bfdf752737ce39744cb/the-historical-elements-of-wolfenstein.mp4"></video>
|
||||
</div>
|
||||
<div class="text">
|
||||
<p>@ColinsLastStand</p>
|
||||
</div>
|
||||
|
|
@ -136,6 +139,7 @@ Response::setMetaDescription("Put your content on the blockchain, experience tru
|
|||
<div class="zigzag"></div>
|
||||
<h1>Sync & Earn</h1>
|
||||
<p>LBRY offers a single-click sync process<br>for existing YouTubers</p>
|
||||
|
||||
<div class="button">
|
||||
<a href="https://api.lbry.io/yt/connect?type=sync&immediate_sync=true">Sync now</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,17 +2,19 @@
|
|||
<?php Response::setMetaTitle(__('YouTubers! Take back control.')) ?>
|
||||
<?php Response::setCssAssets(['/css/yt2.css']) ?>
|
||||
<?php Response::addJsAsset('/js/yt2/FormValidation.js')?>
|
||||
<?php Response::addJsAsset('/js/yt2/youtube_status.js') ?>
|
||||
<?php Response::addJsAsset('/js/yt2/youtube_video.js')?>
|
||||
<?php $statusResponse = LBRY::statusYoutube($token); ?>
|
||||
<?php $statusData = $statusResponse['data'] ?>
|
||||
<?php $isSyncAgreed = in_array($statusData['status'], ["syncing", "synced", "queued"]) ?>
|
||||
<?php $isSyncAgreed = false ?>
|
||||
<?php $isRewardClaimed = $statusData['is_reward_claimed'] ?? false ?>
|
||||
<main class="channel-settings">
|
||||
<?php echo View::render('acquisition/_youtube_header') ?>
|
||||
<section class="section channel pad-top">
|
||||
<div class="inner">
|
||||
<div class="content">
|
||||
<?php if (true): ?>
|
||||
<div id="email-google-plus-error" class="error">Your email address is set as xxx@plusgoogle.com.<br>If this is not your email address, please <span>change it below</span>.</div>
|
||||
<?php if (preg_match('/^[A-Za-z0-9._%+-]+@plusgoogle.com$/', $statusData['email'])): ?>
|
||||
<div id="email-google-plus-error" class="error">Your email address is set as <?php echo $statusData['email'];?>.<br>If this is not your email address, please <span id="scroll_email">change it below</span>.</div>
|
||||
<?php endif ?>
|
||||
<div class="zigzag"></div>
|
||||
<h1><?php echo $isSyncAgreed && $isRewardClaimed ? "You're all set!" : "Almost done!" ?></h1>
|
||||
|
|
@ -22,14 +24,15 @@
|
|||
<span>✓</span>
|
||||
<p>Confirm your channel</p>
|
||||
</li>
|
||||
<li class="disabled">
|
||||
<li class="<?php echo $isSyncAgreed? "" : "disabled" ?>">
|
||||
<span><?php echo $isSyncAgreed ? "✓" : "☐" ?></span>
|
||||
<p>Agree to sync</p>
|
||||
<p <?php echo $isSyncAgreed ? "hidden" : "" ?>>click <a id="scroll-sync" href="#">here</a> to agree to sync your content</p>
|
||||
</li>
|
||||
<li class="disabled">
|
||||
<li class="<?php echo $isRewardClaimed && $isSyncAgreed? "" : "disabled" ?>">
|
||||
<span><?php echo $isRewardClaimed ? "✓" : "☐" ?></span>
|
||||
<p>Claim your credits</p>
|
||||
<p>To get your credits, <a href="/get">download the app</a> and <a href="/faq/youtube">follow these instructions.</a></p>
|
||||
<p <?php echo ($isRewardClaimed === false && $isSyncAgreed === true)? "" : "hidden"?>>To get your credits, <a href="/get">download the app</a> and <a href="/faq/youtube">follow these instructions.</a></p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -49,17 +52,17 @@
|
|||
</div>
|
||||
<div class="block">
|
||||
<p>Subscribers<br>
|
||||
<span><?php echo $statusData['subscribers']?></span>
|
||||
<span><?php echo $statusData['subscribers'] === 0? "-": $statusData['subscribers']?></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="block">
|
||||
<p>Videos<br>
|
||||
<span><?php echo $statusData['videos']?></span>
|
||||
<span><?php echo $statusData['videos'] === 0? "-": $statusData['videos']?></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="block">
|
||||
<p>Expected Rewards<br>
|
||||
<span><?php echo $statusData['expected_reward']?></span>
|
||||
<span><?php echo $statusData['expected_reward'] === 0? "-": $statusData['expected_reward']?></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -89,10 +92,10 @@
|
|||
<div hidden id="email-error" class="error">Email is invalid or blank</div>
|
||||
<div hidden id="email-google-plus-error" class="error">Are you sure you want to use this email</div>
|
||||
</div>
|
||||
<div class="block full">
|
||||
<label for="sync-consent" class="block full">
|
||||
<input name="sync_consent" id="sync-consent" type="checkbox" <?php if($statusData['status'] == 'queued'): echo "checked"; endif;?> <?php if($statusData['status'] == 'syncing' || $statusData['status'] == 'synced'): echo "disabled "; echo "checked"; endif; ?>>I want to sync my content to the LBRY network and agree to <a href="/faq/youtube-terms">these terms</a>.
|
||||
<div hidden id="sync-consent-error" class="error">In order to continue, you must agree to sync.</div>
|
||||
</div>
|
||||
</label>
|
||||
<div class="block">
|
||||
<button type="submit" onClick="return submitEditForm()">Save Changes</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ function submitEditForm(){
|
|||
$('#email-error').show();
|
||||
event.preventDefault();
|
||||
}
|
||||
else(!validateEmailIsNotGooglePlus(email)){
|
||||
else if(!validateEmailIsNotGooglePlus(email)){
|
||||
|
||||
$('#email').addClass('error_form');
|
||||
if(is_first_time){
|
||||
|
|
@ -73,6 +73,6 @@ function validateYoutubeChannelUrl(youtube_channel_url){
|
|||
}
|
||||
|
||||
function validateEmailIsNotGooglePlus(email){
|
||||
var re = /^[A-Za-z0-9._%+-]+@(?!plusgoogle.com)[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/+g;
|
||||
var re = /^[A-Za-z0-9._%+-]+@(?!plusgoogle.com)[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/;
|
||||
return re.test(email);
|
||||
}
|
||||
14
web/js/yt2/youtube_status.js
Normal file
14
web/js/yt2/youtube_status.js
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
$("#scroll_email").click(function () {
|
||||
$('html, body').animate({
|
||||
scrollTop: $("#email").offset().top
|
||||
}, 2000);
|
||||
$('#email').select();
|
||||
$("#email").focus();
|
||||
|
||||
});
|
||||
|
||||
$("#scroll-sync").click(function () {
|
||||
$('html, body').animate({
|
||||
scrollTop: $("#sync-consent").offset().top
|
||||
}, 2000);
|
||||
});
|
||||
31
web/js/yt2/youtube_video.js
Normal file
31
web/js/yt2/youtube_video.js
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
|
||||
function playVideo1(){
|
||||
var myVideo = document.getElementById("video1");
|
||||
if (myVideo.paused){
|
||||
myVideo.play();
|
||||
}
|
||||
else{
|
||||
myVideo.pause();
|
||||
}
|
||||
}
|
||||
|
||||
function playVideo2(){
|
||||
var myVideo = document.getElementById("video2");
|
||||
if (myVideo.paused){
|
||||
myVideo.play();
|
||||
}
|
||||
else{
|
||||
myVideo.pause();
|
||||
}
|
||||
}
|
||||
|
||||
function playVideo3() {
|
||||
var myVideo = document.getElementById("video3");
|
||||
if (myVideo.paused) {
|
||||
myVideo.play();
|
||||
}
|
||||
else {
|
||||
myVideo.pause();
|
||||
}
|
||||
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue