LBRYFoundation/lbry.com
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbry.com.git synced 2025-08-23 17:47:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Cleanup and finishing up yt_sync features

Browse source
This commit is contained in:
maximest-pierre 2018-03-19 22:29:30 -04:00
parent 10ff0aba39
commit f0b971b6ad
5 changed files with 77 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
view/template/acquisition/youtube.php
View file

@ -5,6 +5,7 @@ Response::addJsAsset('/js/yt2/ScrollToPlugin.min.js');
Response::addJsAsset('/js/yt2/app.js'); Response::addJsAsset('/js/yt2/app.js');
Response::addJsAsset('/js/yt2/FormValidation.js'); Response::addJsAsset('/js/yt2/FormValidation.js');
Response::addJsAsset('/js/yt2/SyncStatus.js'); Response::addJsAsset('/js/yt2/SyncStatus.js');
Response::addJsAsset('/js/yt2/youtube_video.js');
$reward = LBRY::youtubeReward(); $reward = LBRY::youtubeReward();
Response::setMetaTitle("LBRY YouTube Partner Program"); Response::setMetaTitle("LBRY YouTube Partner Program");
Response::setMetaDescription("Put your content on the blockchain, experience true content freedom, and earn rewards."); 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> <p>Take your peers and your audience with you. Create without limits.</p>
<div class="boxes"> <div class="boxes">
<div class="box"> <div class="box">
<a href="https://spee.ch/ever-wonder-how-bitcoin-and-other" class="image" target="_blank"> <div class="image" target="_blank">
<img src="/img/youtube/01@2x.jpg"> <div class="to-play" onclick="playVideo1()"><span></span></div>
<div class="to-play"><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>
</a> </div>
<div class="text"> <div class="text">
<p>@3Blue1Brown</p> <p>@3Blue1Brown</p>
</div> </div>
</div> </div>
<div class="box"> <div class="box">
<a href="https://spee.ch/3c96f32de285db6c04e80bd6f5fad573250541e9/casually-successful" class="image" target="_blank"> <div class="image" target="_blank">
<img src="/img/youtube/02@2x.jpg"> <div class="to-play" onclick="playVideo2()"><span></span></div>
<div class="to-play"><span></span></div> <video id="video2" width="100%" poster="/img/youtube/02@2x.jpg" src="https://spee.ch/3c96f32de285db6c04e80bd6f5fad573250541e9/casually-successful.mp4"/></video>
</a> </div>
<div class="text"> <div class="text">
<p>@CasuallyExplained</p> <p>@CasuallyExplained</p>
</div> </div>
</div> </div>
<div class="box"> <div class="box">
<a href="https://spee.ch/the-historical-elements-of-wolfenstein" class="image" target="_blank"> <div class="image" target="_blank">
<img src="/img/youtube/03@2x.jpg"> <div class="to-play" onclick="playVideo3()"><span></span></div>
<div class="to-play"><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>
</a> </div>
<div class="text"> <div class="text">
<p>@ColinsLastStand</p> <p>@ColinsLastStand</p>
</div> </div>
@ -136,6 +139,7 @@ Response::setMetaDescription("Put your content on the blockchain, experience tru
<div class="zigzag"></div> <div class="zigzag"></div>
<h1>Sync &amp; Earn</h1> <h1>Sync &amp; Earn</h1>
<p>LBRY offers a single-click sync process<br>for existing YouTubers</p> <p>LBRY offers a single-click sync process<br>for existing YouTubers</p>
<div class="button"> <div class="button">
<a href="https://api.lbry.io/yt/connect?type=sync&immediate_sync=true">Sync now</a> <a href="https://api.lbry.io/yt/connect?type=sync&immediate_sync=true">Sync now</a>
</div> </div>

25
view/template/acquisition/youtube_status.php
View file

@ -2,17 +2,19 @@
<?php Response::setMetaTitle(__('YouTubers! Take back control.')) ?> <?php Response::setMetaTitle(__('YouTubers! Take back control.')) ?>
<?php Response::setCssAssets(['/css/yt2.css']) ?> <?php Response::setCssAssets(['/css/yt2.css']) ?>
<?php Response::addJsAsset('/js/yt2/FormValidation.js')?> <?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 $statusResponse = LBRY::statusYoutube($token); ?>
<?php $statusData = $statusResponse['data'] ?> <?php $statusData = $statusResponse['data'] ?>
<?php $isSyncAgreed = in_array($statusData['status'], ["syncing", "synced", "queued"]) ?> <?php $isSyncAgreed = false ?>
<?php $isRewardClaimed = $statusData['is_reward_claimed'] ?? false ?> <?php $isRewardClaimed = $statusData['is_reward_claimed'] ?? false ?>
<main class="channel-settings"> <main class="channel-settings">
<?php echo View::render('acquisition/_youtube_header') ?> <?php echo View::render('acquisition/_youtube_header') ?>
<section class="section channel pad-top"> <section class="section channel pad-top">
<div class="inner"> <div class="inner">
<div class="content"> <div class="content">
<?php if (true): ?> <?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 xxx@plusgoogle.com.<br>If this is not your email address, please <span>change it below</span>.</div> <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 ?> <?php endif ?>
<div class="zigzag"></div> <div class="zigzag"></div>
<h1><?php echo $isSyncAgreed && $isRewardClaimed ? "You're all set!" : "Almost done!" ?></h1> <h1><?php echo $isSyncAgreed && $isRewardClaimed ? "You're all set!" : "Almost done!" ?></h1>
@ -22,14 +24,15 @@
<span>✓</span> <span>✓</span>
<p>Confirm your channel</p> <p>Confirm your channel</p>
</li> </li>
<li class="disabled"> <li class="<?php echo $isSyncAgreed? "" : "disabled" ?>">
<span><?php echo $isSyncAgreed ? "✓" : "☐" ?></span> <span><?php echo $isSyncAgreed ? "✓" : "☐" ?></span>
<p>Agree to sync</p> <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>
<li class="disabled"> <li class="<?php echo $isRewardClaimed && $isSyncAgreed? "" : "disabled" ?>">
<span><?php echo $isRewardClaimed ? "✓" : "☐" ?></span> <span><?php echo $isRewardClaimed ? "✓" : "☐" ?></span>
<p>Claim your credits</p> <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> </li>
</ul> </ul>
</div> </div>
@ -49,17 +52,17 @@
</div> </div>
<div class="block"> <div class="block">
<p>Subscribers<br> <p>Subscribers<br>
<span><?php echo $statusData['subscribers']?></span> <span><?php echo $statusData['subscribers'] === 0? "-": $statusData['subscribers']?></span>
</p> </p>
</div> </div>
<div class="block"> <div class="block">
<p>Videos<br> <p>Videos<br>
<span><?php echo $statusData['videos']?></span> <span><?php echo $statusData['videos'] === 0? "-": $statusData['videos']?></span>
</p> </p>
</div> </div>
<div class="block"> <div class="block">
<p>Expected Rewards<br> <p>Expected Rewards<br>
<span><?php echo $statusData['expected_reward']?></span> <span><?php echo $statusData['expected_reward'] === 0? "-": $statusData['expected_reward']?></span>
</p> </p>
</div> </div>
</div> </div>
@ -89,10 +92,10 @@
<div hidden id="email-error" class="error">Email is invalid or blank</div> <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 hidden id="email-google-plus-error" class="error">Are you sure you want to use this email</div>
</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>. <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 hidden id="sync-consent-error" class="error">In order to continue, you must agree to sync.</div>
</div> </label>
<div class="block"> <div class="block">
<button type="submit" onClick="return submitEditForm()">Save Changes</button> <button type="submit" onClick="return submitEditForm()">Save Changes</button>
</div> </div>

4
web/js/yt2/FormValidation.js
View file

@ -23,7 +23,7 @@ function submitEditForm(){
$('#email-error').show(); $('#email-error').show();
event.preventDefault(); event.preventDefault();
} }
else(!validateEmailIsNotGooglePlus(email)){ else if(!validateEmailIsNotGooglePlus(email)){
$('#email').addClass('error_form'); $('#email').addClass('error_form');
if(is_first_time){ if(is_first_time){
@ -73,6 +73,6 @@ function validateYoutubeChannelUrl(youtube_channel_url){
} }
function validateEmailIsNotGooglePlus(email){ 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); return re.test(email);
} }

14
web/js/yt2/youtube_status.js Normal file
View 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
View 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();
}
}