Хак Сворачивающиеся блоки на сайте

Тема в разделе "DLE", создана пользователем MSW, 6 ноя 2009.

Информация :
Актуальная версия DataLife Engine 11.3
( Final Release v.11.3 | Скачать DataLife Engine | Скачать 11.3 demo )
Нужно ли обновляться | Как обновиться | Изменения в шаблонах
> Нет русских символов <
[Приватная тема DLE (Все подробности в ЛС к модератору раздела)]

Версии 11.2 и ниже - уязвимы!

Локализации | F.A.Q. | Внешний вид
Правила раздела | Правила форума
Обсуждение хайда карается баном!
В каждом сообщении указывайте версию DLE, которого они касаются!
Статус темы:
Закрыта.
Модераторы: killoff
  1. MSW

    MSW

    Регистр.:
    27 авг 2007
    Сообщения:
    491
    Симпатии:
    408
    Версия ДЛЕ - любая!
    Как нуль так и лицензия!
    Автор: MSW
    Назначение: Добавляет возможность пользователям сворачивать, или разворачивать, блоки на сайте, можно прикрутить под абсолютно любые блоки! от боковых до похожих новостей и всё такое! на что у вас хватит фантастики!)))
    Каждый пользователь сам себе выбирает какие ему блоки сворачивать, какие оставлять развёрнутыми.
    После очередной загрузки, перезагрузки страниц сайта блоки остаются в последнем выбранном пользователем варианте, то-есть запоминается их последнее состояние.

    Технология: основан на яваскрипт, данные записываются в куки пользователю
    Недостатки:
    - блоки сворачиваются только после загрузки страницы(яваскрипт отрабатывается последним)
    - содержимое блоков загружается в любом случае - свёрнут он или развёрнут.

    Итак, сам код:

    Создаём файл: /templates/ваш_шаблон/js/block.js
    с содержимым:
    HTML:
    function setCookie(name, value, expiredays, path, domain, secure) {
    	if (expiredays) {
    		var exdate=new Date();
    		exdate.setDate(exdate.getDate()+expiredays);
    		var expires = exdate.toGMTString();
    	}
    	document.cookie = name + "=" + escape(value) +
    	((expiredays) ? "; expires=" + expires : "") +
    	((path) ? "; path=" + path : "") +
    	((domain) ? "; domain=" + domain : "") +
    	((secure) ? "; secure" : "");
    }
    
    function getCookie(name) {
    	var cookie = " " + document.cookie;
    	var search = " " + name + "=";
    	var setStr = null;
    	var offset = 0;
    	var end = 0;
    	if (cookie.length > 0) {
    		offset = cookie.indexOf(search);
    		if (offset != -1) {
    			offset += search.length;
    			end = cookie.indexOf(";", offset)
    			if (end == -1) {
    				end = cookie.length;
    			}
    			setStr = unescape(cookie.substring(offset, end));
    		}
    	}
    	return setStr;
    }
    
    function block_now(id) {
    	if(getCookie(id) == 1) {
    		display = 'none';
    		setCookie(id, 0, 90, "/");
    	} else {
    		display = '';
    		setCookie(id, 1, 90, "/");
    	}
    	document.getElementById(id).style.display = display;
    }
    
    function block_start(id) {
    	var cookie_stat = getCookie(id);
    	if((cookie_stat == 1) || (!cookie_stat)){
    		display = '';
    	} else {
    		display = 'none';
    	}
    	document.getElementById(id).style.display = display;
    }
    Файл: main.tpl
    Найти:
    HTML:
    </head>
    Добавить выше:
    HTML:
    
    <script type="text/javascript" src="{THEME}/js/block.js"></script>
    <script type="text/javascript">
    function block_search(){
    	block_start("blok_1");
    	block_start("blok_2");
    //	block_start("blok_3");
    //	block_start("blok_4");
    // добавляет столько вызовов функций, сколько у вас будет блоков
    }
    </script>
    найти:
    HTML:
    <body>
    заменить на:
    HTML:
    <body onLoad="block_search()">
    а теперь собственно правим свои блоки по типу:
    HTML:
    <table>
    <tr onClick="block_now('blok_1')" style="cursor:pointer;">
    	<th>Заголовок блока</th>
    </tr>
    <tr id="blok_1" style="">
    	<td>Содержимое блока</td>
    </tr>
    </table>
    живой пример:

    Перейти по ссылке (боковые блоки кроме рекламных ;) )

    В дальнейшем развитии планирую решить проблему с полной загрузкой содержимого блоков а потом прятанием его с помощью пхп, и снова показ содержимого если блок был свёрнут - с помощью аякс....
    вот только пока не знаю как точно такое реализовать, ещё не особо над этим думал))
     
    Tarasishe, Kiosaki, TexnoMozg и ещё 1-му нравится это.
  2. TexnoMozg

    TexnoMozg Создатель

    Регистр.:
    6 мар 2009
    Сообщения:
    31
    Симпатии:
    0
    Протестировал,всё отлично работает ,сделано на javascript ))
    Если хотите вторую демку говорите ,скину
     
  3. sanekd2c

    sanekd2c Создатель

    Регистр.:
    13 мар 2009
    Сообщения:
    21
    Симпатии:
    7
    А что тут прям такого для dle, я думаю этот хак подойдет для любой системы, а скачать его можно по запросу в гугле :confused:
     
  4. MSW

    MSW

    Регистр.:
    27 авг 2007
    Сообщения:
    491
    Симпатии:
    408
    да ничего тут такого, можете скачать - качайте, разве я запрещаю или говорю что это единственная реализация?
    вобше я это делал для себя, чтоб разобраться как яваскрипт работает с куками.
    кому надо - тот возмёт, кто не захочит брать это готовое - скачает в гугле и для себя сам сделает и разберётся.

    это первоначальная версия, дальше планирую развить данный хак как модуль, прикрутить пхп и аякс, для универсальности и снижения нагрузки на сервер.

    если кто может что подсказать по данному направлению - подсказывайте, а не хвастайтесь что можете пользоваться поисковыми системами.
     
  5. MSW

    MSW

    Регистр.:
    27 авг 2007
    Сообщения:
    491
    Симпатии:
    408
    вот и осилил вроди как всё это дело :)

    Теперь этот хак можно назвать: Хак - Блоки как вконтакте :)

    Функционал: работает на аяксе, если меню было отключено пользователем - то при повторной загрузке/обновлении страницы содержимое блока загружено не будет!
    что решило заявленные в первом посте недостатки :)

    Теперь данный хак подходит только для ДЛЕ версии 8,2
    так как содержимое менюшек нужно будет перенести в отдельные пхп файлы и просто инклудить в шаблон.

    Создаём файл: /templates/ваш_шаблон/js/block.js
    Код:
    function setCookie(name, value, expiredays, path, domain, secure) {
    	if (expiredays) {
    		var exdate=new Date();
    		exdate.setDate(exdate.getDate()+expiredays);
    		var expires = exdate.toGMTString();
    	}
    	document.cookie = name + "=" + escape(value) +
    	((expiredays) ? "; expires=" + expires : "") +
    	((path) ? "; path=" + path : "") +
    	((domain) ? "; domain=" + domain : "") +
    	((secure) ? "; secure" : "");
    }
    function getCookie(name) {
    	var cookie = " " + document.cookie;
    	var search = " " + name + "=";
    	var setStr = null;
    	var offset = 0;
    	var end = 0;
    	if (cookie.length > 0) {
    		offset = cookie.indexOf(search);
    		if (offset != -1) {
    			offset += search.length;
    			end = cookie.indexOf(";", offset)
    			if (end == -1) {
    				end = cookie.length;
    			}
    			setStr = unescape(cookie.substring(offset, end));
    		}
    	}
    	return setStr;
    }
    
    function block_ajax(id) {
    	if(getCookie(id) == 1) {
    		setCookie(id, 0, 90, "/");
    	} else {
    		setCookie(id, 1, 90, "/");
    	}
    	var ajax = new dle_ajax();
    	ajax.setVar("id", id);
    	ajax.setVar("edit", "1");
    	ajax.requestFile = dle_root+"engine/modules/block/"+id+".php";
    	ajax.method = 'POST';
    	ajax.element = id;
    	ajax.sendAJAX("");
    	return false;
    }
    Создаём файл инклуженого меню: /engine/modules/block/test.php
    PHP:
    <?php
    if($_REQUEST['edit'])
    {
    define('DATALIFEENGINE'true);
    define('ROOT_DIR''../../..');
    define('ENGINE_DIR''../..');

    include 
    ENGINE_DIR '/data/config.php';
    require_once 
    ENGINE_DIR '/classes/mysql.php';
    require_once 
    ENGINE_DIR '/data/dbconfig.php';
    require_once 
    ENGINE_DIR '/modules/functions.php';

    @
    header("Content-type: text/css; charset=windows-1251");
    }

    $name "test";

    $cookie $_COOKIE["{$name}"];

    $content "<div id=\"{$name}\">";

    if(
    $cookie == || !isset($cookie))
    {
    $content .= <<<HTML
        <table>
            <tr onClick="block_ajax('
    {$name}')" style="cursor:pointer;">
                <th>Заголовок блока</th>
            </tr>
            <tr>
                <td>Содержимое блока</td>
            </tr>
        </table>
    HTML;
    }
    else
    {
    $content .= <<<HTML
        <table>
            <tr onClick="block_ajax('
    {$name}')" style="cursor:pointer;">
                <th>Заголовок блока</th>
            </tr>
        </table>
    HTML;
    }
    $content .= "</div>";

    echo 
    $content;
    ?>
    Подключаем файл в шаблон: main.tpl
    Найти:
    HTML:
    </head>
    Добавить выше:
    HTML:
    <script type="text/javascript" src="{THEME}/js/block.js"></script>
    в нужном месте для вывода блока:
    Код:
    {include file="engine/modules/block/test.php"}
    демка тамже:

    Перейти по ссылке - блоки - Из фотоальбомов, Именинники, Курс валют, Наши проекты
     
  6. a1ien.n3t

    a1ien.n3t Постоялец

    Регистр.:
    12 июл 2008
    Сообщения:
    52
    Симпатии:
    7
    Можно узнать а зачем block.js всетаки вставлять в каждый блок?
    Не проще ли его в индекс вставить и не париться?
     
  7. PoMaH

    PoMaH

    Регистр.:
    8 июн 2006
    Сообщения:
    753
    Симпатии:
    142
    Ну не в индекс а в маин.тпл
    можно как ява инклуд, а можно прямо кодом.
     
  8. a1ien.n3t

    a1ien.n3t Постоялец

    Регистр.:
    12 июл 2008
    Сообщения:
    52
    Симпатии:
    7
    Вобщето всетаки в индекс ))
    и туда дописывашь свои. Точнее можно и в main.tpl но тогда будет только для одного диза.
    А так будет для всех
    И у тебя когда приходит ответ для ajax не заменяеться {THEME}
    <script type="text/javascript" src="{THEME}/js/block.js"></script>
    + Подгружая через ajax таким образом скрипт не выполняеться(вроде)
     
  9. MSW

    MSW

    Регистр.:
    27 авг 2007
    Сообщения:
    491
    Симпатии:
    408
    да, то наверно магнинтые бури были и чёто не работало если в мейн подключено было....
    сейчас вот проверил - работает замечательно, потому можно подключить в мейн:

    Файл: main.tpl
    Найти:
    HTML:
    </head>
    Добавить выше:
    HTML:
    <script type="text/javascript" src="{THEME}/js/block.js"></script>
    вот собственно и всё, полноценный хак, можно сказать, только проблема с тегами в таком случае и с инклудами других файлов.

    теги - при загрузке первой отрабатываются как положено, а вот после сворачивания и разворачивания - отображаются как тег.
    инклуженые файлы в шаблон - так и отображаются текстом как инклуженый файл....
     
  10. nithwich

    nithwich

    Регистр.:
    10 фев 2007
    Сообщения:
    421
    Симпатии:
    74
    я бы использовал jquery возможности на много шире,да и кроме таких блоков можна много чего интересного реализовать.
     
Статус темы:
Закрыта.