Как использовать History.js

[Harvey]

Привет!

Ребят, каким образом юзать эту библиотеку? Не нашел ни одного нормального гайда, хотя и статья автора есть на хабре и на сайте есть пример, и отдельные статьи тоже есть, но это не дает приемлимого понимания, как ее использовать.
У меня ситуация такая:
Есть главная станица, на ней меню, при нажатии на линк, через аякс подгружается соответствующая страница. Всё. Элементарно. Как сделать так, что бы нормально работала история?

Спасибо!

[dmitriymar]

https://github.com/DmitriyProvatorov...HTML5-HistoryX
Добавите одну строку и класс в ссылки и всё будет работать

[Harvey]

Спасибо за этот пример, выглядит очень просто, обязательно попробую, но я имел в виду другую библиотеку - History.js, а не HystoryX.js.
Почему я не слышал о либе HistoryX? По какой причине она не популярна?

Спасибо!

[dmitriymar]

Почему я не слышал о либе HistoryX? По какой причине она не популярна?

Это модуль, а не библиотека. Он новый, он не афишировался и не будет, как прочие.
Ну а по поводу популярности, google запрос history html5 . 1 -2 страница ,в основном, при 14-20 лямах релевантных ответов в зависимости от страны поиска. Это всего при 3х ссылках внешних на него -так что с количеством пользователей модуля всё норм)

Да и принцип прост- подключи и всё работает, не нужно знать ни методов history Api, ни принципов его работы.
http://tolstoy.kiev.ua/ -здесь знаю что использовали его

[Harvey]

Ок, большое спасибо

[Harvey]

Чего то не работает. И примеры с гит хаба тоже(

[dmitriymar]

Чего то не работает. И примеры с гит хаба тоже(

посмотрите на http://tolstoy.kiev.ua/ там всё работает. код с сайта:

<script src="/assets/js/historyX.js"></script>
<script src="/assets/js/jquery.tools.min.js"></script>
<script src="/assets/js/jquery.validate.min.js"></script>
<script src="/assets/js/jquery.form.js"></script>


<script type="text/javascript">
$(document).ready(function() {
// histori.start('ajax',ajax);
historyX.start('ajax',ajax,"tolstoy.kiev.ua/ru,tolstoy.kiev.ua/en");

Ну и класс в соответствующие ссылки добавить .
<a class="ajax mainMenu"
Сомневаетесь в версии с гитхаба?- возьмите файл с этого сайта

И примеры с гит хаба тоже(

создайте структуру у себя на сервере
Перенесите пример к себе на сервер
Замените в примере -yourSite.com на свой адрес а /folder/... на свои пути
И самое главное поместите файл HistoryX у себя на сайте, либо подключите его с использованием абсолютного адреса гитхаба

[Harvey]

dmitriymar,
Посмотрите, пожалуйста, этот пример http://fgcs.projects.fgcs.ru/sources

Попытался сделать, но нормального поведения добиться не удалось.

Инициализация history в файле general в самом начале

[dmitriymar]

1 я смотрю что под работу модуля вы подписали только 2 ссылки
События и Pos материалы
2 видно что они определились нормально -получили атрибут data-ajax="1"
3 при клике на любую из них видно, в фаербаге в разделе сеть,что отправляется в районе 10 запросов одинаковых -бок явно у вас с этим

4 если перейти по эвенту и посмотреть на меню на ссылку пос материалы она приобретает интересный вид:

<a href="#!/pos-materials">POS-материалы</a>

В то время как, она должна обладать классом аякс - class="ajax" (вы его установили у себя для хистори) и после запуска старта(в инструкции это описано), она должна приобрести вид:

<a class="ajax" href="http://fgcs.projects.fgcs.ru/sources/pos-material-ajax.html" data-ajax="1">POS-материалы</a>
Ну или относительный путь. но никаких !#

Класс ajax должен присутствовать, иначе как модуль поймёт что , нужно подписать под хистори?

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

[Harvey]

И все же ничего не понял) В чем моя ошибка?

У меня нигде не прописано !#, откуда же это берется тогда