uptodate.js — библиотека для автообновления элементов времени

[datacompboy]

Ну и чем от timeago.yarp.com/ отличается?

[Azy]

Похоже что ничем, но в timeago уже есть перевод на русский, добавлю в топик, спасибо.

[KAdot]

uptodate.js не зависит от jQuery.

[ha2bj]

О, а это сейчас уже минус ))

[Azy]

Почему? Зачем использовать jQuery если в данном случае отлично работает getElementsByClassName?

[ha2bj]

Хотя бы ради кроссбраузерности

[MuLLtiQ]

Ради IE<9?

[TheShock]

Кстати, если будете использовать el.querySelectorAll('.className') вместо el.getElementsByClassName('className'), то заработает даже в таком старье, как IE8

[vyacheslav_ka]

Тогда еще надо упомянуть momentjs.com/ умеющую очень богатый функционал и переводы на кучу языков.

[Azy]

Про momentjs я уже писал и это две разные либы. В топике — для автообновления даты в HTML элементе, в то же время как моментжс — для форматирования и работы с датами.

[vyacheslav_ka]

Посмотрите на Timeago в моментжс, он делает тоже самое. Или в чем тогда большое различие между ними?

[Azy]

Еще раз поясняю — timeago в momentjs это конвертация Date в строку, например «5 минут назад»

Либа в топике — автоматически обновляет дату в контейнере. Например в момент открытия было «оставил комментарий 2 минуты назад». Минутой позже либа заменит контент на «оставил комментарий 3 минуты назад» и так далее.

[vyacheslav_ka]

Спасибо, понял.

[thekip]

Moment.js делает тоже самое, и точно так же реалтайм апдейтит значение. К тому же с пол пинка работает с AngularJs и имеет очень крутое Api.

[Azy]

Ткните в доку, я ее сегодня 2 раза пропустил.

С полпинка работает с AngularJS.

Это либа форматирования даты. Она с чем угодно с полпинка работает.
И про крутое АПИ, это вообще к чему? Давайте еще с API бекбона сравним.

[thekip]

Кажется я повременил с выводами, и в действительности обновлялось оно у меня благодаря коду angular, а не самого momentJs.
Под крутым апи я имел ввиду, что MomentJs имеет очень богатые возможности интернализации, которые так же дают возможность изменения поведения форматирования даты.
К примеру momentJs, имеет 2 метода, вывода даты от текущего числа это fromNow() и calendar(). Но мне хотелось использовать оба метода одновременно. Что бы в пределах того же дня работал метод fromNow(), а в пределах недели уже calendar(), и я это легко реализовал:

    calendar : {
        sameDay: function(){
           return  "["+this.fromNow()+"]";
        }, //[Сегодня в] LT
        nextDay: '[Завтра в] LT',
        lastDay: '[Вчера в] LT',
        nextWeek: function () {
            return this.day() === 2 ? '[Во] dddd [в] LT' : '[В] dddd [в] LT';
        },
        lastWeek: function () {
            return  "["+this.fromNow()+"]";
        },
        sameElse: 'L'
    }

[Azy]

Ну так засунуть использование можно и в эту либу.
И тут ключевой момент не в форматировании, а в обновлении.

[leutsky]

по сути, в этой библиотеке более-менее полезный функционал — это только поиск элементов без использования jQuery и установка setInterval, т.е то, что и так можно реализовать за 10 минут и избавиться от зависимости от внешней библиотеки.

Имеющиеся минусы:
— чтобы русифицировать нужно переписать основную функцию
— не решена задача со склонением слов: 1 минута, 2 минуты, 5 минут и т.д.
т.е. минусы — это именно то, что весьма нужно, но этого нет.

В чем плюсы?

[Azy]

Тем что вместо того чтобы писать все — нужно написать только функцию которая генерит текст. Я планирую этим заняться на досуге, сделав отдельный бранч.
А вообще плюса в том что «это свое а не либа» я не вижу.

— чтобы русифицировать нужно переписать основную функцию

В случае со своей либой все равно ее придется писать

— не решена задача со склонением слов: 1 минута, 2 минуты, 5 минут и т.д.

Учитывая то что там вообще поддержки русского из коробки нет — какие могут быть склонения?

[leutsky]

Тем что вместо того чтобы писать все — нужно написать только функцию которая генерит текст.

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

А вообще плюса в том что «это свое а не либа» я не вижу.

конкретно в данном случае: свое = надежность, тем более, что к минусам библиотеки добавлено отсутствие кроссбраузерности.

[Azy]

Отправьте патч с локализацией и кросс-браузерностью в конце-концов. Все-таки сообщество подразумевает то что если наработки будут выкладываться в опенсорс и использоваться в других проектах это
а) сэкономит время других разработчиков
б) другие разработчики смогут вносить улучшения.

Вы же предлагаете каждому сидеть по своей норе и писать свои велосипеды.

[JiLiZART]

Проще сделать свое, а локализацию и правильность дат обеспечит moment.js

[xpert13]

Прошу вас, не используйте гифки возле текста. Его же читать не возможно, когда сбоку/сверху/снизу что-то мельтешит.

[Azy]

В прошлом моем посте гифки одобрили.

[TheShock]

Не соглашусь. Иногда гифки очень помогают понять идею.

[xpert13]

Как это противоречит тому, что я написал? Гифки можно и под споилер спрятать.

[RubaXa]

Можно было бы написать, что всё это добро, будет работать везде, кроме IE < 9.

[TheShock]

А разве то старьё ещё кто-то поддерживает?

[RubaXa]

Вот честно, хочу оказаться в вашей вселенной, где нет IE < 9 или Opera < 11, ээээххх :[

[TheShock]

Я как раз в такой вселенной)))

[Lungo]

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

[Azy]

Неистово плюсую. Сильно матерился когда толи на гитхабе толи где-то в подобном месте видел комит «3 days ago», когда мне нужно было точное время.

[GMM]

я думал вместо span будет тэг time

[Azy]

С учетом поддержки его — нахрен он там не нужен

developer.mozilla.org/en-US/docs/HTML/HTML_Elements/time#Compatibility

[w0den]

Очень странное и ошибочные утверждение от Вас (как от веб-разработчика).

Во-первых, то что по указанной Вами ссылке указано что браузеры не „поддерживают” элемент <time/>, это означает лишь то, что в данном случае они не поддерживают спецификацию HTML5 (однако, это не означает что должно быть проблемы с отображением или с обработкой этого HTML элемента).

Например, попробуйте выполнить следующий код в старых версиях браузеров, и увидите что работает без проблем (например в Firefox 3 или IE6):

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>time.test</title>
  <!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
  <time datetime="2013-04-29 00:00">???</time><br/>
  <time datetime="2013-04-30 00:00">???</time>
  <script>
    var times = document.getElementsByTagName('time');
    for (var t = 0; t < times.length; t++) {
        times[t].innerHTML = times[t].getAttribute('datetime');
    }
  </script>
</body>
</html>

И во-вторых — в своей библиотеке Вы используете функцию document.getElementsByClassName(), которая действительно не будет работать в старых версиях MSIE.

[Azy]

Во-первых ничто не мешает Вам использовать либу с элементом time, так как вы верно заметили что для выбора элемента используется getElementsByClassName, который не ограничивает теги. Я лишь ограничил для себя использование данного тега, поскольку не вижу в этом смысла, раз он не поддерживается всеми браузерами. Если нужен функционал добавления элемента пользователю в календарь то я использую форма iCalendar
Во-вторых либа не моя, и вы запросто можете предложить автору патч.

Ну и вообще семантика тега time подразумевает использование его только для добавления какого-то события в календарь пользователя, другого использования я не вижу. А поскольку либа предназначена в основном для подсчета сколько времени прошло с события (хотя ничего не мешает дописать для будущих событий) то тег тут бесполезен, поскольку добавлять в календарь прошедшие события не имеет смысла в 99% случаев.

[w0den]

Я написал комментарий только из-за Вашего резкого ответа насчёт элемента <time/>, а не потому что собираюсь использовать эту библиотеку (конечно, я не говорю что такая библиотека бесполезна).

Насчёт семантики элемента <time/> — Вы снова заблуждаетесь — в первую очередь этот элемент был создан для того чтобы „программы” (поисковые системы, браузеры и др.) поняли что речь идёт о дате, и во-вторых, единственное ограничение — то что нужно указать реальную дату. Поэтому, если хотите показать дату/время, смело используйте этот элемент (и при необходимости добавьте атрибут pubdate).

[Azy]

Ну пардон если было резко — не хотел никого задеть.
А по поводу time я в целом считаю что тег бесполезен :) Недаром его выпиливали из спецификации HTML5

[w0den]

> А по поводу time я в целом считаю что тег бесполезен :)
Тогда я уверен, что <time/> далеко не единственный тег которого Вы считаете бесполезным ;)

Не обижайтесь пожалуйста, но Вы напоминаете мне тех людей которые считают, что в HTML должен быть только один тег и все его стили должны задаться через CSS, и при необходимости использовать нужные атрибуты.

> Недаром его выпиливали из спецификации HTML5
Вы хотели сказать: „недаром один разработчик подумал его выпилить, но в итоге, у него ничего не получилось”?

[Azy]

Нет, просто я считаю этот тег лишним :)
Ладно, закроем дискуссию — каждый при своем мнении.

[JiLiZART]

Накатал быстрый примерчик, как то странно тики идут jsfiddle.net/j6ggU/1/

[sompylasar]

period у Вас равен 600. Чтобы обновление секунд было более точным, нужно обновлять не реже, чем раз в полсекунды (а лучше чаще), иначе будет смещение, которое так проявляется.

Смотрите, что получается: jsfiddle.net/sompylasar/uhMqL/