Страница 1 из 11
Модератор форума: JonMagon 
Сообщество uCoz » Вебмастеру » JavaScript, Flash и прочие технологии » JavaScript » Скрипт "NEW у нового материала в информере"
Скрипт "NEW у нового материала в информере"
sergej_mekerov
Сообщений: 6
Репутация: 0

Сообщение # 1 | 16:33:44
Всем привет! Нашел на одном сайте скрипт, который в информере добавляет картинку NEW к добавленному материалу.
Если я правильно понял, то эта картинка висит у материала в течении 3-х дней с момента добавления и потом сама исчезает.
Вот сам код:

Код
$(document).ready(function(){
   var matDate = $('.WidgetForumTitleDate').text();
   matDateArr = matDate.split('|');

     for (var i=0;i<5;i++) { // 5
        var matDateArrFormat = matDateArr[i].split('.');
        var matDateArrFormatNew = +matDateArrFormat[0]+3+'.'+matDateArrFormat[1]+'.'+matDateArrFormat[2]; // +3
        var matDateArrFormatNew = new Date(matDateArrFormatNew.replace(/(\d+).(\d+).(\d+)/, '$3/$2/$1'));

        var todayDate = "08.02.2015";
        var todayDate = new Date(todayDate.replace(/(\d+).(\d+).(\d+)/, '$3/$2/$1'));
           if (matDateArrFormatNew > todayDate) {
             $(".WidgetForumTitleUpdate a").eq(i).addClass("WFTUNew");
             console.log(''+i+' - True! Added .WFTUNew class ['+matDateArrFormatNew+'] > ['+todayDate+']');
           } else {
             console.log(''+i+' - False!');
           }
     }
});


Помогите в нем разобраться, куда его вставлять. Единственное что понял, это console.log. Посмотрел в браузере, там пишет:
Цитата
0 - True! Added .WFTUNew class [Tue Feb 10 2015 00:00:00 GMT+0300 (Багдадское время (зима))] > [Sun Feb 08 2015 00:00:00 GMT+0300 (Багдадское время (зима))]
1 - False!
2 - False!
3 - False!
4 - False!
_CrySiS_
Сообщений: 464
Репутация: 38

Сообщение # 2 | 01:27:01
Ух, что то как то все муторно, я выводил это все довольно таки простым методом - через условные операторы
JacksonMihailov
Сообщений: 259
Репутация: 107

Сообщение # 3 | 01:29:30
реально муторно. Поищи еще, полно таких вещей, попроще.

jmDB - Текстовая база данных для uCoz
sergej_mekerov
Сообщений: 6
Репутация: 0

Сообщение # 4 | 16:49:23
Я видел примеры через условные операторы, но, дата в информере выводится в полном формате (даже если в модуле стоит галочка выводить дату добавления материала как "Сегодня").
В самом модуле выводится "Сегодня", а в информере - полная дата. Иначе я бы в самом коде информера написал что то по типу:
Код
<?if($DATE$ = 'Сегодня' || $DATE$ = 'Вчера')?>Добавляем иконку new<?else?>Просто выводим материал<?endif?>
Связался с владельцем сайта, где стоит такой скрипт, он подтвердил мои предположения.

А по поводу скрипта, все просто - в информере вывода есть блок, который скрыт и в котором находится дата добавления материала. Скриптом изымаем из него дату, разделяем ее через сплит, далее в цикле (у него выводится 5 последних материалов) разделяем дату добавления на массив, к дням прибавляем число 3 (+3 дня), собираем дату обратно, потом сравниваем с текущей. Если дата добавления+3 дня оказывается больше текущей даты - то добавляем класс, иначе просто ничего не делаем.

С одной стороны не очень хочется добавлять еще один скрипт на сайт, с другой нету альтернатив(
Head-Mad
Сообщений: 377
Репутация: 129

Сообщение # 5 | 20:09:00
Цитата sergej_mekerov ()
с другой нету альтернатив(

Такой вариант, на CSS:
Основному блоку(в виде материалов), где должен выводиться значок прописываете атрибут, например data-new="$DATE$"
а далее, на странице, например в header, добавляем следующие стили:
Код
[data-new]{position:relative}

        [data-new="Сегодня"]:after,
        [data-new="Вчера"]:after,
        [data-new="<?if(($DAY$-2)<10)?>0<?endif?><?$DAY$-2?>.<?if($MONTH$<10)?>0<?endif?>$MONTH$.$YEAR$"]:after{
          content:url(/img/new.png);
          position:absolute;
          top:0;
          right:0;
        }

первый стиль задает относительное позиционирование блоку для того чтоб можно было расположить значок относительно его.
Второй стиль будет добавлять значoк (в данном случае - некая картинка new.png) материалам добавленным за последние 3 дня. дней можно добавить и больше.

Есть безусловно недостаток! в начале месяца, когда 3-ий день попадает на прошлый месяц. Можно, конечно, написать с условными операторами и высчитать. Но нужно учитывать, сколько дней в месяце и прочее.

Добавлено (09 Фев 2015, 20:05:33)
---------------------------------------------
Решил перед сном допилить этот код. Полез разбираться, моментов оказалось чуть больше чем думал, это и начало года и високосные годы и 30 или 31 число прошлого месяца. В общем, постарался учесть это всё. Получилось громоздко, но вроде работает. и так, стиль такой:
Код
<style>
[data-new]{position:relative}     

[data-new="Сегодня"]:after,     
[data-new="Вчера"]:after,
[data-new="<?if(($DAY$-2)<10)?><?if(($DAY$-2)<=0)?><?if(strpos('4,6,9,11',$MONTH$)=-1 || $MONTH$=1)?><?if($MONTH$=3)?><?if($YEAR$%4=0)?><?29+($DAY$-2)?><?else?><?28+($DAY$-2)?><?endif?><?else?><?31+($DAY$-2)?><?endif?><?else?><?3 0+($DAY$-2)?><?endif?><?else?>0<?($DAY$-2)?><?endif?><?else?><?$DAY$-2?><?endif?>.<?if(($DAY$-2)<=0)?><?if($MONTH$=1)?>12<?else?><?if(($MONT H$-1)<10)?>0<?$MONTH$-1?><?else?><?$MONTH$-1?><?endif?><?endif?><?else?><?if($MONTH$<10)?>0$MONTH$<?else?>$MONTH$<?endif?><?endif?>.<?if($MO NTH$=1 && ($DAY$-2)<=0)?><?$YEAR$-1?><?else?>$YEAR$<?endif?>"]:after{
content:url(/img/new.png);     
position:absolute;     
top:0;     
right:0}
</style>


Добавлено (09 Фев 2015, 20:09:00)
---------------------------------------------
внимательно, в коде, редактор сам добавляет пробелы иногда в системные коды ($MONT H$)

Можешь забрать этот код и вставить его себе, сам знаешь куда.
Сообщение отредактировал Head-Mad - Понедельник, 09 Фев 2015, 22:15:28