1
0
Fork 0
mirror of https://github.com/DanielnetoDotCom/YouPHPTube synced 2025-10-06 03:50:04 +02:00

NetFlix Style

This commit is contained in:
daniel 2017-12-08 13:40:52 -03:00
parent c1f03c7d1d
commit 3d650310d3
2 changed files with 49 additions and 18 deletions

View file

@ -63,12 +63,16 @@ $category = Category::getAllCategories();
<?php } ?> <?php } ?>
</div> </div>
<div class="tile__details"> <div class="tile__details">
<div class="videoInfo">
<span class="label label-default"><i class="fa fa-eye"></i> <?php echo $value['views_count']; ?></span>
<span class="label label-success"><i class="fa fa-thumbs-up"></i> <?php echo $value['likes']; ?></span>
</div>
<div class="tile__title"> <div class="tile__title">
<?php echo $value['title']; ?> <?php echo $value['title']; ?>
</div> </div>
</div>
<div class="videoDescription"> <div class="videoDescription">
<?php echo $value['description']; ?> <?php echo nl2br(textToLink($value['description'])); ?>
</div>
</div> </div>
</div> </div>
<div class="arrow-down" style="display: none;"></div> <div class="arrow-down" style="display: none;"></div>
@ -82,6 +86,9 @@ $category = Category::getAllCategories();
<h2 class="infoTitle"> <h2 class="infoTitle">
Title Title
</h2> </h2>
<h4 class="infoDetails">
Details
</h4>
<div class="infoText col-md-4 col-sm-12"> <div class="infoText col-md-4 col-sm-12">
Text Text
</div> </div>
@ -122,12 +129,16 @@ $category = Category::getAllCategories();
<?php } ?> <?php } ?>
</div> </div>
<div class="tile__details"> <div class="tile__details">
<div class="videoInfo">
<span class="label label-default"><i class="fa fa-eye"></i> <?php echo $value['views_count']; ?></span>
<span class="label label-success"><i class="fa fa-thumbs-up"></i> <?php echo $value['likes']; ?></span>
</div>
<div class="tile__title"> <div class="tile__title">
<?php echo $value['title']; ?> <?php echo $value['title']; ?>
</div> </div>
</div>
<div class="videoDescription"> <div class="videoDescription">
<?php echo $value['description']; ?> <?php echo nl2br(textToLink($value['description'])); ?>
</div>
</div> </div>
</div> </div>
<div class="arrow-down" style="display: none;"></div> <div class="arrow-down" style="display: none;"></div>
@ -141,6 +152,9 @@ $category = Category::getAllCategories();
<h2 class="infoTitle"> <h2 class="infoTitle">
Title Title
</h2> </h2>
<h4 class="infoDetails">
Details
</h4>
<div class="infoText col-md-4 col-sm-12"> <div class="infoText col-md-4 col-sm-12">
Text Text
</div> </div>
@ -180,12 +194,16 @@ $category = Category::getAllCategories();
<?php } ?> <?php } ?>
</div> </div>
<div class="tile__details"> <div class="tile__details">
<div class="videoInfo">
<span class="label label-default"><i class="fa fa-eye"></i> <?php echo $value['views_count']; ?></span>
<span class="label label-success"><i class="fa fa-thumbs-up"></i> <?php echo $value['likes']; ?></span>
</div>
<div class="tile__title"> <div class="tile__title">
<?php echo $value['title']; ?> <?php echo $value['title']; ?>
</div> </div>
</div>
<div class="videoDescription"> <div class="videoDescription">
<?php echo $value['description']; ?> <?php echo nl2br(textToLink($value['description'])); ?>
</div>
</div> </div>
</div> </div>
<div class="arrow-down" style="display: none;"></div> <div class="arrow-down" style="display: none;"></div>
@ -199,6 +217,9 @@ $category = Category::getAllCategories();
<h2 class="infoTitle"> <h2 class="infoTitle">
Title Title
</h2> </h2>
<h4 class="infoDetails">
Details
</h4>
<div class="infoText col-md-4 col-sm-12"> <div class="infoText col-md-4 col-sm-12">
Text Text
</div> </div>
@ -249,12 +270,16 @@ $category = Category::getAllCategories();
<?php } ?> <?php } ?>
</div> </div>
<div class="tile__details"> <div class="tile__details">
<div class="videoInfo">
<span class="label label-default"><i class="fa fa-eye"></i> <?php echo $value['views_count']; ?></span>
<span class="label label-success"><i class="fa fa-thumbs-up"></i> <?php echo $value['likes']; ?></span>
</div>
<div class="tile__title"> <div class="tile__title">
<?php echo $value['title']; ?> <?php echo $value['title']; ?>
</div> </div>
</div>
<div class="videoDescription"> <div class="videoDescription">
<?php echo $value['description']; ?> <?php echo nl2br(textToLink($value['description'])); ?>
</div>
</div> </div>
</div> </div>
<div class="arrow-down" style="display: none;"></div> <div class="arrow-down" style="display: none;"></div>
@ -268,6 +293,9 @@ $category = Category::getAllCategories();
<h2 class="infoTitle"> <h2 class="infoTitle">
Title Title
</h2> </h2>
<h4 class="infoDetails">
Details
</h4>
<div class="infoText col-md-4 col-sm-12"> <div class="infoText col-md-4 col-sm-12">
Text Text
</div> </div>

View file

@ -68,7 +68,8 @@ $(function () {
if (!img || true) { if (!img || true) {
img = $(this).attr('poster'); img = $(this).attr('poster');
} }
var desc = $(this).find(".videoDescription").text(); var desc = $(this).find(".videoDescription").html();
var details = $(this).find(".videoInfo").html();
var title = $(this).find(".tile__title").text(); var title = $(this).find(".tile__title").text();
var row = $(this).closest('.row'); var row = $(this).closest('.row');
@ -84,10 +85,12 @@ $(function () {
$(row).find('.poster').slideDown(); $(row).find('.poster').slideDown();
$(row).find('.footerBtn, .labelPoints').fadeIn(); $(row).find('.footerBtn, .labelPoints').fadeIn();
$(row).find('.poster').css({'background-image': 'url(' + img + ')'}); $(row).find('.poster').css({'background-image': 'url(' + img + ')'});
$(row).find('.infoText, .infoTitle').fadeOut('slow', function () { $(row).find('.infoText, .infoTitle, .infoDetails').fadeOut('slow', function () {
$(row).find('.infoText').text(desc); $(row).find('.infoText').html(desc);
$(row).find('.infoTitle').text(title); $(row).find('.infoTitle').text(title);
$(row).find('.infoText, .infoTitle').fadeIn('slow'); $(row).find('.infoDetails').html(details);
$(row).find('.infoText, .infoTitle, .infoDetails').fadeIn('slow');
}); });
video = $(this).attr('video'); video = $(this).attr('video');
cat = $(this).attr('cat'); cat = $(this).attr('cat');