vanzhiganov/clipbucket
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
clipbucket/upload/styles/cb_2014/layout/index.html
asifqayyum 888b599440 Revised
2014-03-28 11:49:31 +00:00

364 lines
No EOL
14 KiB
HTML
Executable file
Raw Blame History

<div class="container">
<div class="row cb-box marginBottom">
<!-- Global Announcement START //-->
<h1 class="alert alert-info" style="margin-top: 5px; font-size:16px;">Welome to new interface</h1>
<!-- Global Announcement END //-->
<!-- Editor Pick START //-->
<div class="row">
<div class="col-md-8 nopadding-right">
<!-- Editor Pick Video Main Container START //-->
<div id="ep_video_container">
{if is_installed('editorspick')}
{section name=e_list loop=$editor_picks max=1}
{include file="$style_dir/blocks/editor_pick/video_block.html" video=$editor_picks[e_list]}
{sectionelse}
There is no video in editor's pick, Please Add Videos In Editor's Pick<br />Videos Manager > Add to editor's pick
{/section}
{/if}
</div>
<!-- Editor Pick Video Main Container END //-->
</div>
<!-- Editor Pick Videos Slider Container START //-->
<div id="slide" class="col-md-4 hidden-sm hidden-xs nopadding-left">
{section name=e_list loop=$editor_picks}
{include file="$style_dir/blocks/editor_pick/index_featured_video.html" video=$editor_picks[e_list]}
{/section}
</div>
<div class="col-md-4 hidden-sm hidden-xs nopadding-left">
<a href="#" class="col-md-6 btn btn-primary" id="slide_prev" style="margin-bottom:5px; margin-top:15px;">
<img src="{$baseurl}/styles/cb_2014/images/m_arrow_up.png" />
</a>
<a href="#" class="col-md-6 btn btn-primary" id="slide_next" style="margin-bottom:5px; margin-top:15px;">
<img src="{$baseurl}/styles/cb_2014/images/m_arrow_down.png" />
</a>
</div>
<!-- Editor Pick Videos Slider Container END //-->
<script type="text/javascript">
$(function() {
$('#slide').ulslide({
width: 375,
height: 90,
effect: {
type: 'carousel', // slide or fade
axis: 'y', // x, y
showCount: 4
},
nextButton: '#slide_next',
prevButton: '#slide_prev',
duration: 800,
/*autoslide: 2000,*/
easing: 'easeOutBounce'
});
});
</script>
</div>
<!-- Editor Pick END //-->
<!-- Latest Videos START //-->
<div class="row">
<div class="col-md-12">
<div class="col-md-8">
<h2 class="myHeading">Latest Videos</h2>
<div class="col-md-12 nopadding">
<div class="col-md-12 text-center nopadding">
<div class="col-md-8 text-center nopadding" style="border:1px solid #CCC; margin-bottom:10px;">
{foreach from=$videos_01 item=video_01}
<div class="col-md-12 text-center nopadding">
<a href="{videoLink vdetails=$video_01}" title="{$video_01.title}">
<img src="{getThumb vdetails=$video_01}" width="475" height="372" border="0" {ANCHOR place="video_thumb" data=$video_01} />
</a>
<div class="cbHomeVidTitle">{$video_01.title|truncate:30}</div>
</div>
<div style="position:absolute; top:5px; right:5px; font-size:11px; font-size:11px; color:#FFF; background:#333; width: 40px; height:18px; text-align:center; border:1px solid rgba(0, 0, 0, 0.12); border-radius:5px;">
{$video_01.duration|number_format}
</div>
<div style="position:absolute; top:5px; left:5px; font-size:11px; font-size:10px; color:#FFF; background:#333; width: 100px; height:18px; text-align:center; border:1px solid rgba(0, 0, 0, 0.12); border-radius:5px;">
By: {$video_01.username}
</div>
{/foreach}
</div>
<div class="col-md-4 hidden-sm hidden-xs text-center nopadding-right" style="padding-left:8px;">
{foreach from=$videos_03 item=video_03}
<div class="col-md-12 text-center nopadding">
<a href="{videoLink vdetails=$video_03}" title="{$video_02.title}">
<img src="{getThumb vdetails=$video_03}" width="240" height="120" style="border:1px solid #CCC;" {ANCHOR place="video_thumb" data=$video_03} />
<div class="cbHomeVidTitle" style="margin-bottom:8px;">{$video_03.title|truncate:10}</div>
</a>
<div class="cbHomeVidDuration">
{$video_03.duration|number_format}
</div>
</div>
{/foreach}
</div>
</div>
<div class="clearfix"></div>
<div class="col-md-12 text-center nopadding">
{foreach from=$videos_03 item=video_03}
<div class="col-md-4 hidden-sm hidden-xs text-center nopadding-left" style="margin-bottom:15px; padding-right:4px;">
<a href="{videoLink vdetails=$video_03}" title="{$video_02.title}">
<img src="{getThumb vdetails=$video_03}" width="242" height="120" style="border:1px solid #CCC;" {ANCHOR place="video_thumb" data=$video_03} />
<div class="cbHomeVidTitle">{$video_03.title|truncate:10}</div>
</a>
<div class="cbHomeVidDuration">
{$video_03.duration|number_format}
</div>
</div>
{/foreach}
</div>
</div>
<div class="clearfix"></div>
<!-- Latest Videos END //-->
<!-- Videos START //-->
<div class="row">
<div class="col-md-12">
<h2 class="myHeading">Videos</h2>
<div class="hmtabs hidden-sm hidden-xs">
<ul>
<li class="selected col-md-4 text-center nopadding">
{lang code='being_watched'}
</li>
<li class="selected col-md-4 text-center nopadding-left">
{lang code='most_viewed'}
</li>
<li class="selected col-md-4 text-center nopadding">
{lang code='recently_added'}
</li>
</ul>
</div> <!--TABS END-->
</div>
</div>
<script>
jQuery(document).ready(function ($) {
{ldelim}
var options = { $AutoPlay: true };
var jssor_slider1 = new $JssorSlider$('slider1_container', options);
var jssor_slider2 = new $JssorSlider$('slider2_container', options);
var jssor_slider3 = new $JssorSlider$('slider3_container', options);
{rdelim}
});
var _hidediv = null;
function showdiv(id) {
if(_hidediv)
hidediv();
var div = document.getElementById(id);
div.style.display = 'block';
_hidediv = function () { div.style.display = 'none'; };
}
</script>
<div class="col-md-4 nopadding">
<div id="slider1_container" class="cbHomeSldVidCont">
<div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 240px; height: 120px;">
{foreach from=$videos_06_lv item=video_06_lv}
<div class="col-md-12 text-center nopadding">
<a href="{videoLink vdetails=$video_06_lv}" title="{$video_06_lv.title}">
<img src="{getThumb vdetails=$video_06_lv}" width="240" height="120" style="border:1px solid #CCC;" {ANCHOR place="video_thumb" data=$video_06_lv} />
<div style="position:relative; z-index:100; margin-top:-25px; color: #000; background: rgba(0, 0, 0, 0.1);">{$video_06_lv.title|truncate:10}</div>
</a>
<div class="cbHomeVidDuration">
{$video_06_lv.duration|number_format}
</div>
</div>
{/foreach}
</div>
</div>
</div>
<div class="col-md-4 nopadding">
<div id="slider2_container" class="cbHomeSldVidCont">
<div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 240px; height: 120px;">
{foreach from=$videos_06_v item=video_06_v}
<div class="col-md-12 text-center nopadding">
<a href="{videoLink vdetails=$video_06_v}" title="{$video_06_v.title}">
<img src="{getThumb vdetails=$video_06_v}" width="240" height="120" style="border:1px solid #CCC;" {ANCHOR place="video_thumb" data=$video_06_v} />
<div class="cbHomeVidTitle">{$video_06_v.title|truncate:10}</div>
</a>
<div class="cbHomeVidDuration">
{$video_06_v.duration|number_format}
</div>
</div>
{/foreach}
</div>
</div>
</div>
<div class="col-md-4 nopadding">
<div id="slider3_container" class="cbHomeSldVidCont">
<div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 240px; height: 120px;">
{foreach from=$videos_06_da item=video_06_da}
<div class="col-md-12 text-center nopadding">
<a href="{videoLink vdetails=$video_06_da}" title="{$video_06_da.title}">
<img src="{getThumb vdetails=$video_06_da}" width="240" height="120" style="border:1px solid #CCC;" {ANCHOR place="video_thumb" data=$video_06_da} />
<div class="cbHomeVidTitle">{$video_06_da.title|truncate:10}</div>
</a>
<div class="cbHomeVidDuration">
{$video_06_da.duration|number_format}
</div>
</div>
{/foreach}
</div>
</div>
</div>
<!-- Videos END //-->
<div class="clearfix"></div>
<!-- Photos START //-->
<script>
$(document).ready(function()
{ldelim}
getAjaxPhoto('most_viewed','#most_viewed_pho_container');
getAjaxPhoto('most_recent','#most_recent_pho_container');
getAjaxPhoto('most_download','#most_down_pho_container');
{rdelim}
);
</script>
<div class="row">
<div class="col-md-12">
<h2 class="myHeading">Photos</h2>
<div class="hmtabs hidden-sm hidden-xs">
<ul>
<li class="selected col-md-4 text-center nopadding" style="margin-right:5px; margin-bottom: 10px;">
{lang code='Most Viewed'}
</li>
<div id="most_viewed_pho_container" style="padding-left:10px;"></div>
<li class="col-md-4 text-center nopadding" style="margin-right:5px; margin-bottom: 10px;">
{lang code='Recently Added'}
</li>
<div id="most_recent_pho_container" style="padding-left:10px;"></div>
<li class="col-md-4 text-center nopadding" style="margin-right:5px; margin-bottom: 10px;">
{lang code='Top Downloaded'}
</li>
<div id="most_down_pho_container" style="padding-left:10px;"></div>
</ul>
</div>
</div>
</div>
</div>
<!-- Photos END //-->
<!-- Advertisement Block START //-->
<div class="col-md-4" style="background-color:#F2F2F2; padding-top:10px; padding-bottom:10px; margin-bottom:10px;">
<h2 class="myHeading" style="margin-top:0;">Advertisement</h2>
<div class="col-md-12" style="margin-top: 5px; font-size:18px; border:1px solid #CCC; background:#FFF;">
Ad Box
</div>
</div>
<!-- Advertisement Block END //-->
<!-- User Block START //-->
<div class="col-md-4" style="background-color:#F2F2F2; padding-top:10px; padding-bottom:10px; margin-bottom:10px;">
<h2 class="myHeading" style="margin-top:0;">Featured Users</h2>
{section name=result_users loop=$result_users}
<div class="col-md-12 cb-item-title-container" style="min-height:75px; margin-top:10px; margin-bottom:10px; padding-bottom: 15px; border-bottom: 1px solid #CCC;">
<div class="cb-item-thumb">
<img src="{$userquery->getuserthumb($result_users[result_users],'small')}" width="65" height="65" class="img-circle" />
</div>
<div class="cb-item-user" style="font-size:12px; margin-top:3px;">
<a href="{$userquery->profile_link($result_users[result_users])}">{$result_users[result_users].username}</a>
<BR />
{lang code='User Profile views'}: {$result_users[result_users].profile_hits|number_format}
&nbsp;&nbsp; / &nbsp;&nbsp;
{lang code='User Videos'}: {$result_users[result_users].total_videos|number_format}
</div>
<div style="position:absolute; top: 25%; right:5px;">
<a href="{$userquery->profile_link($result_users[result_users])}">
<img src="{$baseurl}/styles/cb_2014/images/user_next_icon.png" width="25" height="25" />
</a>
</div>
</div>
{/section}
</div>
<!-- User Block END //-->
<!-- FB Block START //-->
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=1403898473202427";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="col-md-4">
<div class="fb-like-box" data-href="https://www.facebook.com/Tunepkofficial" data-width="350" data-height="275" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>
</div>
<!-- FB Block END //-->
<!-- Comments Block START //-->
<div class="col-md-4" style="background-color:#F2F2F2; padding-top:10px; padding-bottom:10px; margin-bottom:10px;">
<h2 class="myHeading" style="margin-top:0;">Most Commented</h2>
<div class="col-md-12 nopadding">
{foreach from=$result_comments item=comment}
<div class="col-md-2 nopadding-right" style=" margin-top: 10px;">
{if ($comment.userid!=0)}
<img src="images/avatars/{$comment.userid}-small.jpg" width="35" height="35" class="img-rounded" />
{else}
<img src="images/avatars/no_avatar-small.png" width="35" height="35" class="img-rounded" />
{/if}
</div>
<!-- Displaying User Comment Box //-->
<div class="col-md-10 nopadding" style="z-index:2;">
<p class="mycommentboxarrow"></p>
<div style="min-height:100px; margin-top:10px; padding:5px; color: #000; background:#FFF; border: 1px solid #CCC; border-radius:5px; font-size:14px; word-wrap: break-word;">
{$comment.comment|truncate:150}
<div style="position:absolute; bottom:5px; font-size:11px; color:#666;">
Updated: {$comment.date_added|niceTime}
</div>
<div class="cbHomeCommCount">
{$result_comments[result_comments].total_comments|number_format}
</div>
</div>
</div>
{/foreach}
</div>
</div>
<!-- Comments Block END //-->
</div>
</div>
</div>
</div>
Reference in a new issue View git blame Copy permalink