13.05.13, 22:25
0 комментарий
  DLE Хаки

AJAX загрузка страниц категорий новостей

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

Суть работы хака:
Вы зашли на страницу, где выводится список новостей с навигацией.
После полной загрузки страницы начинает работать специальный java-script код.
Код ищет на странице элемент навигации и всё существующее заменяет на одну ссылку "Загрузить ещё".
При нажатии на эту самую кнопку, посылается AJAX запрос к сайту, идёт подгрузка полной версии следующей страницы.
После получения кода страницы, идёт выборка основного контента (из тега { content }).
После выборки контента, он добавляется к текущему, тем самым показывая новые новости.
Также хак автоматически меняет адрес в строке браузера, чтобы при обновлении страницы, пользователь видел последние полученные новости.
Если движок посылает ошибку 404 или другую, тем самым кнопка становится не активной и на ней написано "Новостей больше нет".

Установка:
Откройте файл main.tpl текущего шаблона и перед закрывающимся тегом:

</head>



Добавьте:

[aviable=main|cat]
<script language="javascript" type="text/javascript">
    var lastExtNewsUrl = "";
    var lastExtNewsPage = 0;
    var mainClassNewsNavigation = "navigation"; // navigation.tpl - название класса основного элемента
    function loadExtNews(){
        
        if( lastExtNewsUrl )
            {
                var url = lastExtNewsUrl.replace( "/page/" + lastExtNewsPage, "/page/" + ( lastExtNewsPage + 1 ) ) + "";
                lastExtNewsPage++;
            }
                else
            {
                var url = location.href;
                url = url.replace( new RegExp( "#(.*)", "g" ), "" ) + "";
                
                var RegExpC = new RegExp( "/page/([0-9]+)", "g" );
                if( url.match( RegExpC ) )
                    {
                        var page = url.match( /page/[0-9]{1,50}/ ) + "";
                        page = parseInt( page.match( /[0-9]{1,50}/ ) );
                        var newPage = page + 1;
                        url = url.replace( "/page/" + page, "/page/" + newPage ) + "";
                        lastExtNewsPage = newPage;
                    }
                        else
                    {
                        url = url + "page/2/";
                        lastExtNewsPage = 2;
                    }
            }
        
        lastExtNewsUrl = url;
        
        $( "#dle-content ." + mainClassNewsNavigation + " a" ).html( "<span>Идёт загрузка...</span>" );
        
        $.ajax({
            url: url,
            data: "",
            success: function( data ){
                var parser = new DOMParser();
                var doc = parser.parseFromString( data, "text/html" );
                $( "#dle-content ." + mainClassNewsNavigation ).remove();
                $( "#dle-content" ).html( $( "#dle-content" ).html() + doc.getElementById( "dle-content" ).innerHTML );                    
                $( "#dle-content ." + mainClassNewsNavigation ).html( "<a href="#" onclick="loadExtNews(); return false;" class="loadExtNews"><span>Загрузить ещё</span></a>" );
                
                history.pushState( {}, "", lastExtNewsUrl );
            },
            error: function( xhr, ajaxOptions, thrownError ){
                // Можно по номеру ошибки определять, но в любом случае ответ не тот, показывать нечего, страхуемся )))
                $( "#dle-content ." + mainClassNewsNavigation ).html( "<a href="#" onclick="return false;" class="loadExtNews"><span>Новостей больше нет</span></a>" );
            },
            dataType: "html",
            type: "POST"
        });
    }
    $( document ).ready(
        function(){
            $( "#dle-content ." + mainClassNewsNavigation ).html( "<a href="#" onclick="loadExtNews(); return false;" class="loadExtNews"><span>Загрузить ещё</span></a>" );
        }
    );
</script>
[/aviable]



Ну и небольшие настройки модуля:
Собственно настраиваете страницы, на которых будет работать навигация (можно например добавить на закладки, теги, архив и т.д.)
[aviable=main|cat]



Название класса основного элемента в файле шаблона navigation.tpl
var mainClassNewsNavigation = "navigation";



Можно также переместить код в отдельный js файл, и на странице подгружать примерно так:
[aviable=main|cat]<script language="javascript" type="text/javascript" src="{THEME}/js/navigation.js"></script>[/aviable]



Версия DLE: 7.х-9.x
Автор: Rezer
Сайт автора: rezer.net

Реклама

Напишите своё мнение

  • acuteaggressiveair_kissangel
    badbbbeachbeee
    biggrinbig_bossblumblush
    boastbombboredombye
    clappingcraycrazycurtsey
    dancedashdeclarediablo
    diroldon-t_mentiondownloaddrinks
    first_moveflirtfocusfool
    friendsgive_heartgive_rosegood
    hangheartheathelp
    hihunterhystericireful
    kingkisslaughlazy
    lolmail1mambaman_in_love
    mdamega_shokmoilmosking
    musicneanegativenew_russian
    okon_the_quietpardonparting
    partypilotpioneerpleasantry
    popcormpranksterprevedpunish
    roflrtfmrussiansad
    sarcasticscarescratchsearch
    secretsensoredshokshout
    slowsmilesmokesoldier
    soldier_girlsorryspitefulspruce_up
    stinkersuicidesunsuperstition
    swoonteasetenderthanks
    thisto_pick_ones_noseto_take_umbragetreaten
    umnikunknwvampirevava
    victorywackowhistlewink
    wizardyahooyesyu
    e101e102e103e104
    e105e106e107e108
    e109e110e111e112
    e113e114e115e116
    e117e118e119e120
    e121e122e123e124
    e125e126e127e128
    e129e130e131e132
    e133e134e135e136
    e137e138e139e140
    e141e142e143e144
    e145e146e147e148
    e149e150e151e152
    e153e154e155e156
    e157e158e159e160
    e161e162e163e164
    e165e166e167e168
    e169e170e171e172
    e173e174e175e176
    e177e178e179e180
    e181e182e183e184
    e185e186e187e188
    e189e190e191e192
    e193e194e195e196
    e197e198e199e200
    e201e202e203e204