{include file="$style_dir/global_header.html"}
{include file="$style_dir/header.html" }
{$myAccountLinks = $userquery->my_account_links()}
{$leftMenuLinks = array_slice($myAccountLinks, 7)}

{lang code='channel' assign='object_type'}
{*include file="$style_dir/blocks/view_channel/channel_global.html" *}
<div id="container" class="container">
    {include file="$style_dir/blocks/manage/account_menu.html"}
    <div class="row cb-box">
    <div class="relative1" id="coverConainer" style="background: url({$coverPhoto}) center #000000" >
      {if $user.userid == userid()}
      <a href="#" class="btn btn-primary btn-sm  changeCover sr-only" id="changeCover">Update Cover</a>
      {/if}
      <div class="row">
          <div class="col-md-4 pull-right btn-group" style="padding-left: 40px">
              <br>
              <button style="display: inline; background-color: #000000" class="btn btn-primary btn-sm new1"><i class="glyphicon glyphicon-plus-sign white"></i>  Add as Friend</button>
              <a href="private_message.php?mode=new_msg&to=admin" style="display: inline; background-color: #000000" class="btn btn-primary btn-sm new1"><i class="glyphicon glyphicon-envelope white"></i>  Send Message</a>
              <button style="display: inline; background-color: #000000" class="btn btn-primary btn-sm new1"><i class="icon-rss icon-spin white"></i>  Subscribe</button>
          </div>
    </div>

    <div class="row">
        <div class="col-md-2">
            <a class="navbar-brand" href="#">
                <img class="relative2" src="{$userquery->getUserThumb($user)}"  width="140" height="140">
            </a>
        </div>

        <div class="col-md-4 padding33">
            <h3 class="cname">{$user.username}</h3>
        </div>
        <div class="col-md-4 pull-right padding34">
            {if $user.userid == userid()}
            <button class="btn btn-primary new1" style="background-color: #000000;color: white">
                <span class="line-height-1 bigger-170 blue">{$user.total_videos}</span>
                <br>
                <span class="line-height-1 smaller-90 new1"> Videos </span>
            </button>
            <span class="btn btn-primary new1" style="background-color: #000000;color: #ffffff">
													<span class="line-height-1 bigger-170 blue">{$user.total_photos}</span>
													<br>
													<span class="line-height-1 smaller-90 new1"> Photos </span>
												</span>
            <span class="btn btn-primary new1" style="background-color: #000000; color: #ffffff">
													<span class="line-height-1 bigger-170 blue">{$user.profile_hits}</span>
													<br>
													<span class="line-height-1 smaller-90 new1"> Views </span>
												</span>
            <span class="btn btn-primary new1" style="background-color: #000000;color: #ffffff">
													<span class="line-height-1 bigger-170 blue">{$user.subscribers}</span>
													<br>
													<span class="line-height-1 smaller-90 new1"> Contacts </span>
												</span>
            {/if}
        </div>
    </div>
        <div class="btn-group col-md-6 channel">
            <h6 class="padding35"><b><span id="likes">{$user["likes"]}</span> people like this channel out of <span id="totalVotes">{$user["voted"]}</span></b></h6>
            <button class="btn btn-danger btn-sm" id="channelVoteDown" style="width: 50px"><i class="glyphicon glyphicon-thumbs-down"></i><b>  No</b></button>
            <button id="channelVoteUp" class="btn btn-primary btn-sm" style="width: 300px"><i class="glyphicon glyphicon-thumbs-up"></i>  <b>Do you like this channel ?</b></button>
        </div>
    </div>
        <div class="clearfix"></div>
        <br><br>
      <div class="row">
          <div class="col-md-6">
                <div id="cb_player" class="">
                    {FlashPlayer vdetails=$firstVideo width='100%' height='355px'}
                </div>
              <hr class="hr">
              {foreach from=$videos item=video}
                  <div class="col-md-4">
                      <a href="{videoLink($video)}" title="{$video.title|title}">
                      <img src="{getThumb vdetails=$video}"  width="203" height="115" id="thumbs_{$video.videoid}"  title=""/></a>
                      <p class="duration1"><b class="color">{if
                          $video.duration>1}{$video.duration|SetTime}{else}00:00{/if}</b></p>
                      <h5><a href="{videoLink($video)}" title="{$video.title|title}"><b>{$video.title|truncate:22}</b></a></h5>
                      <small class="font1 new1"><b>{lang code='views'} :{$video.views}</b></small>
                      <small class="font2 new1"><b>{$video.date_added|niceTime}</b></small>
                      <hr>
                  </div>
                  {/foreach}
              <div class="col-md-4">
                  {include file="$style_dir/blocks/pagination.html"}
              </div>
              </div>

          <div class="col-md-6">
              <h4><i class="icon-rss"></i>  Recent Activities</h4>
              <hr class="hr">
                      <div id="content_1" class="content">
                      <div class="feeds1" id="selectedDiv">
                          <div id="userFeeds" >
                              {if isSectionEnabled('feeds')}
                              {assign var=userFeeds value=$cbfeeds->getUserFeeds($u)}
                              {if $userFeeds}
                              {foreach from=$userFeeds item=userFeed}
                              {include file="$style_dir/blocks/feed.html" feed=$userFeed}
                              {/foreach}
                              {else}
                              <div align="center" class="no_comments">
                                  {lang code='no_activity' assign=no_activity} {$no_activity|sprintf:$u.username}
                              </div>
                              {/if}
                              {/if}
                          </div>
                      </div>
                        </div>

              </h4>
              <br>
              <h4><i class="glyphicon glyphicon-film"></i>  Popular Channels</h4>
              <div id="popular" class="content1">
              <hr class="hr">
              {section name=u_list loop=$users}
              {include file="$style_dir/blocks/channels.html" user=$users[u_list]}
              {sectionelse}
              {lang code='no_results_found'}
              {/section}
                  </div>
          </div>
      </div>
    </div>
</div>

<style>
  .changeCover{
    position: absolute;
    top: 10px;
    left: 10px;
  }
</style>

<script>
(function(window){
  $(document).ready(function(){
    var extensions = "{$extensions}";
    var baseurl = '{$baseurl}';
    var channelId = "{$user['userid']}";
    extensions = (extensions.substring(0, extensions.length - 1)) + ",png,jpeg";
    $.get("{$theme}/js/plupload/js/plupload.full.min.js", function(e){
      var uploader = new plupload.Uploader({
          browse_button: 'changeCover',
          runtimes : 'html5,flash,silverlight,html4',
          url : baseurl + "/edit_account.php?mode=avatar_bg",
          file_data_name : "coverPhoto",
          filters: {
            mime_types : [
              { title : "Image files", extensions : extensions },
            ],
            max_file_size: "2mb",
            prevent_duplicates: false,
          }
      });
      window.uploader = uploader;
      uploader.init();
      uploader.bind("FilesAdded", function(up, uploadedFiles){
        $("#coverConainer").css("background", "url({$baseurl}/images/loading.png) center #000000");
        up.start();
      });
      uploader.bind('UploadComplete', function(plupload, files, response){
        
      });

      uploader.bind("FileUploaded", function(plupload, files, response){
        var response = $.parseJSON(response.response);
        if(response.status == true){
          $("#coverConainer").css("background", "url(" + response.url + ") center #000000");
        }else{
          $("#coverConainer").css("background", "url(" + response.url + ") center #000000");
          alert(response.msg);
        }
      });

      uploader.bind("Error", function(plupload, error){
        alert(error.message);
      });
    });
    $("#coverConainer").hover(function(e){
      $("#changeCover").removeClass("sr-only");
    }, function(e){
      $("#changeCover").addClass("sr-only");
    });
    $("#channelVoteUp, #channelVoteDown").on({
      click: function(e){
        var vote = "";
        var id = "" + this.id;
        var likes = parseInt($("#likes").text());
        var totalVotes = parseInt($("#totalVotes").text()) + 1;
        if(this.id == "channelVoteDown"){
          vote  = "no";
        }else{
          vote = "yes";
          likes = likes + 1;
        }
        $.ajax({
          type: "POST",
          url: "{$baseurl}/actions/vote_channel.php",
          data: { vote: vote, channelId : channelId}
        }).success(function(data){
          $("#likes").text(likes);
          $("#totalVotes").text(totalVotes);
        });
      }
    })
  });
})(window);
</script>


{include file="$style_dir/footer.html" }