<div id="kanavas_dep" style="display:none;">  
  <div id="kanavas_url">$FULL_PHOTO_DIRECT_URL$</div>  
  <div id="kanavas_name">$PHOTO_NAME$</div>  
  </div>

<div class="head_img">
<div id="head_f"></div>  
<div id="kanavas" style="display:none;">  
<input id="cover_url" name="cUrl" type="text" placeholder="Вставте url изображения">  
<div id="cover_uri" style="display:none;"></div><div id="cover_tLoad" style="display:none;">Производим загрузку...</div>  
<div id="cover_url-ok">Ok</div>  
</div>
<?if($_IS_OWN_PROFILE$)?><div id="edit_cover">Изменить обложку</div><?else?><?endif?>  
  </div>

<script type="text/javascript">  
$(function () {  
$.fn.mytoggle = function () {  
  var b = arguments;  
  return this.each(function (i, el) {  
  var a = function () {  
  var c = 0;  
  return function () {  
  b[c++ % b.length].apply(el, arguments)  
  }  
  }();  
  $(el).click(a)  
  })  
};  
$('div#edit_cover').mytoggle(function() {  
$('div#kanavas').show();  
}, function() {  
$('div#kanavas').hide();  
}  
);  
setTimeout(function(){ $('#cover_uri').load('/photo/0-1-0-17-'+timeline.feyssmesh._userid+' #kanavas_dep:first'); }, 100);  
setTimeout(function(){ var uCoveres = $('#kanavas_url').text(); var uCovName = $('#kanavas_name').text(); $('div#head_f').css('background','#47a3da url('+uCoveres+') center'); }, 1500);  
$('#cover_url-ok').click(function () {  
$('#cover_tLoad').show().html('Загрузка...');  
$.get('/photo/0-0-0-1', function(data){  
var ssid = $('input[name="ssid"]', data).val();  
$.post('/photo/', {  
a: '14',  
jkd428: '1',  
jkd498: '1',  
ocat: '1',  
uphoto1: $('#cover_url').val(),  
org: '1',  
name1: $('#uPeople_cover').val(),  
ssid: ssid  
}, function(str){  
fields = $('cmd[p="content"]', str).text();  
if(fields.indexOf('Добавлены')!=-1){ $('#cover_tLoad').show().html('Обложка загружена.');  
setTimeout(function(){ $('div#kanavas, #cover_tLoad').hide(); }, 1100); }  
else{ $('#cover_tLoad').show().html('Обложка не загружена. Ошибка при передачи!'); $('#cover_tLoad').hide();}  
});  
});  
});  
});  
</script>
<script type="text/javascript">  
var timeline = new Object();  
timeline.feyssmesh = {  
_userid:'$_USER_ID$'
}  
</script>

div#head_f {
  width: 800px;
  height:300px;
  background-size: cover !important;
}
div#cover_url-ok {
  position: absolute;
  top: 0px;
  background:#f2f6fa;
  padding: 8px;
  right: -28px;
  cursor: pointer;
}
div#cover_tLoad {
  color: #fff;
  background: rgba(0,0,0,0.5);
}
div#kanavas {
  position: absolute;
  top: 20px;
  right: 180px;
}

.head_img {
  position: relative;
  width: 800px;
  height: 300px;
}
div#edit_cover {
  position: absolute;
  top: 20px;
  right: 20px;
  background: rgba(48, 128, 232, 0.5);color:#FFF;
  font-size: 13px;text-decoration:none;padding:6px 10px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;
  cursor: pointer;
}
div#edit_cover:hover {background:rgba(48, 128, 232, 0.8)}