[Модуль] настройка меню слева как у вк на js

[kphp 26]

настройка меню слева (на js, а не php)
1. main.tpl
        От <ul id="leftmenu"> до </ul> меняем на:
       
        <ul id="leftmenu">

<li id="myprofile" style="display:"><div class="menu_ic pr_ic"></div>
<a href="/u{my-id}" onclick="Page.Go(this.href); return false;">Моя страница</a></li>

<li id="ig0" style="display:"><div class="menu_ic news_ic"></div><a href="/news" onclick="Page.Go(this.href); return false;">Новости</a></li>

<li id="ig1" style="display:"><div class="menu_ic not_ic"></div><a href="/news/notifications" onclick="Page.Go(this.href); return false;">Ответы</a></li>

<li id="ig2" style="display:"><div class="menu_ic msg_ic"></div><a href="/messages" onclick="Page.Go(this.href); return false;">Диалоги</a><div style="margin-top:-15px;"> </div><div id="new_msg">{msg}</div><div style="margin-top:15px;"></div></li>

<div class="clear"></div>

<li id="ig3" style="display:"><div class="menu_ic fr_ic"></div><a href="/friends" onclick="Page.Go(this.href); return false;" id="requests_link">Друзья </a>
<div style="margin-top:-15px;"> </div> <div id="new_requests">{demands}</div><div style="margin-top:15px;"></div></li>

<li id="ig4" style="display:"><div class="menu_ic comm_ic"></div><a href="/groups/" onclick="Page.Go(this.href); return false;">Сообщества</a><div style="margin-top:-15px;"> </div><div style="margin-top:15px;"></div></li>
<div class="clear"></div>

<li id="ig5" style="display:"><div class="menu_ic ph_ic"></div><a href="/albums/{my-id}" onclick="Page.Go(this.href); return false;" id="requests_link_new_photos">Фотографии </a><div id="new_photos">{new_photos}</div></li>
<div class="clear"></div>

<li id="ig6" style="display:" ><div class="menu_ic vid_ic"></div><a href="/videos" onclick="Page.Go(this.href); return false;">Видеозаписи</a></li>
<div class="clear"></div>

<li id="ig7" style="display:"><div class="menu_ic aud_ic"></div><a href="/audio" onClick="player.change_list(0); return false" id="fplayer_pos">Аудиозаписи</a></li>
<div class="clear"></div>

<li id="ig8" style="display:"><div class="menu_ic fave_ic"></div><a href="/fave" onclick="Page.Go(this.href); return false;">Закладки</a></li>

<li id="ig9" style="display:"><div class="menu_ic apps_ic"></div><a href="/apps" onclick="Page.Go(this.href); return false">Приложения</a></li>
<div id="birthday"></div>
<div class="mgclr"></div>
<div class="menu_gray">

<li id="mysettings" style="display:"><div class="menu_ic sett_ic"></div><a href="/settings" onclick="Page.Go(this.href); return false;">Настройки</a></li>

<li><div class="menu_ic help_ic"></div><a href="/support?act=new" onclick="Page.Go(this.href); return false">Помощь</a>
<div style="margin-top:-15px;"> </div><div id="new_support">{new-support}</div></li>
</div>
</ul>

2. в main.js вверху добавить
var num = 30;
var b = 0;

3. в этом же файле после
$(window).scroll(function(){
                if($(document).scrollTop() > ($(window).height()/2))
                        $('.scroll_fix_bg').fadeIn(200);
                else
                        $('.scroll_fix_bg').fadeOut(200);
        });
        ставим
        while(b <= num){
                if($.cookie('g'+b))
                        $('#ig'+b).addClass('no_display');
                b++;
        }
});
       
4. в jquery.lib.js

над
//jPlayer
ставим
$.cookie = function(name,value,options){if(typeof value != 'undefined'){options = options ||{};if(value === null){value = '';options.expires = -1;}var expires = '';if(options.expires &&(typeof options.expires == 'number' || options.expires.toUTCString)){var date;if(typeof options.expires == 'number'){date = new Date();date.setTime(date.getTime() +(options.expires * 24 * 60 * 60 * 1000));} else{date = options.expires;}expires = '; expires=' + date.toUTCString();}var path = options.path ? '; path=' +(options.path) : '';var domain = options.domain ? '; domain=' +(options.domain) : '';var secure = options.secure ? '; secure' : '';document.cookie = [name,'=',encodeURIComponent(value),expires,path,domain,secure].join('');} else{ var cookieValue = null;if(document.cookie && document.cookie != ''){var cookies = document.cookie.split(';');for(var i = 0; i < cookies.length; i++){var cookie = jQuery.trim(cookies[i]);if(cookie.substring(0,name.length + 1) ==(name + '=')){cookieValue = decodeURIComponent(cookie.substring(name.length + 1));break;}}}return cookieValue;}};


5. в general.tpl
вверху ставим
<script type="text/javascript">

$(document).ready(function(){

        var arr = ['Новости', 'Ответы', 'Диалоги', 'Друзья', 'Сообщества', 'Фотографии', 'Видеозаписи', 'Аудиозаписи', 'Закладки', 'Приложения'];
        var num = 0;
        while (typeof arr[num] != 'undefined'){
                $('#settings_services').append('<div class="texta"><div id="settings_labelg'+num+'" class="fl_l no_display"  style="margin-left:10px;">Изменения сохранены</div> </div><div id="g'+num+'" class="html_checkbox_menu margin_top_10" onclick="lin.chekbox(\'g'+num+'\');">'+arr[num]+'</div><div class="mgclr"></div>');
                if($.cookie('g'+num)){$('#g'+num).addClass('html_checked_menu');}
                num++;
        }
       
});
var lin = {
        chekbox:function(id){
                $('#settings_label'+id).fadeIn(2000).fadeOut(2000);
                if($('#'+id).is('.html_checked_menu')){
                        $('#'+id).removeClass('html_checked_menu');
                        $('#i'+id).removeClass('no_display');
                        $.cookie(id,null);
                }else{
                        $('#'+id).addClass('html_checked_menu');
                        $('#i'+id).addClass('no_display');
                        $.cookie(id,id, {path: "/",expires:365});
                }
        }
}
</script>

над <div class="margin_top_10"></div><div class="allbar_title">Изменить пароль</div>
ставим

<div class="margin_top_10"></div><div class="allbar_title">Настройки страницы</div>
<div style="color: #666666;">Укажите ссылки, которые Вы хотели бы видеть в меню слева:</div>
<div id="settings_services"></div>


6. в style.css добавить
.html_checkbox_menu{min-width:15px;height:14px;cursor:pointer;float:left;padding-left:20px;background:url("../images/checkbox.gif") no-repeat 0px -14px}
.html_checkbox_menu:hover{background:url("../images/checkbox.gif") no-repeat 0px -42px}
.html_checked_menu{background:url("../images/checkbox.gif") no-repeat;}
.html_checked_menu:hover{background:url("../images/checkbox.gif") no-repeat 0px -28px}

Автор Developer.Sloopy