tag:blogger.com,1999:blog-20444794033587502172024-03-20T05:34:39.490+02:00story of my flightUnknownnoreply@blogger.comBlogger6125tag:blogger.com,1999:blog-2044479403358750217.post-31341009037604172942013-06-30T15:08:00.000+03:002013-06-30T16:20:05.451+03:00OpenCart: краткое описание товара<div dir="ltr" style="text-align: left;" trbidi="on">
Как-то понадобилось мне вывести краткое описание продукта, чтоб получилось вот так:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuZHzpZZK-SXHIWgWcI7AzHgDDPu-fNutd_aw7wG_YIu3cj8mUkHetCR1ykIYNOmeet-3fRZL8BuFVH7ipeiCLBJk94Qw1GbXCr2imf4Jc7LQ4PmqrCUe9niZRPYXQB86hqJc4NVrIqKo/s674/%D0%91%D0%B5%D0%B7%D1%8B%D0%BC%D1%8F%D0%BD%D0%BD%D1%8B%D0%B9.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="387" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuZHzpZZK-SXHIWgWcI7AzHgDDPu-fNutd_aw7wG_YIu3cj8mUkHetCR1ykIYNOmeet-3fRZL8BuFVH7ipeiCLBJk94Qw1GbXCr2imf4Jc7LQ4PmqrCUe9niZRPYXQB86hqJc4NVrIqKo/s640/%D0%91%D0%B5%D0%B7%D1%8B%D0%BC%D1%8F%D0%BD%D0%BD%D1%8B%D0%B9.JPG" width="640" /></a></div>
Ну ок<br />
Смотрим, у какой модели наш модуль инфу берет:<br />
<!-- HTML generated using hilite.me --><br />
<div style="background: #ffffff; border-width: .1em .1em .1em .8em; border: solid gray; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;">$this->load->model('catalog/product');
</pre>
</div>
<br />
Хорошо, идем смотреть в модель product, ищем какую инфу он нам еще передает:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXnpg240eIap8PTY1d_yWStsYXlxSlJNtkuC73glbpk_HgL3PX_Jb-TzPGKXTco3mrvP8AYMmz7JTuG8651mVhsGh9l9b30HSGRyY06jDUFQSRXTtet_nbQQBGNNGupyUTN5XqoAuhbNo/s508/2.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="87" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXnpg240eIap8PTY1d_yWStsYXlxSlJNtkuC73glbpk_HgL3PX_Jb-TzPGKXTco3mrvP8AYMmz7JTuG8651mVhsGh9l9b30HSGRyY06jDUFQSRXTtet_nbQQBGNNGupyUTN5XqoAuhbNo/s400/2.JPG" width="400" /></a></div>
Как видим, описание нам передается<br />
<br />
Пробуем достать его, в модуль добавляем это:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrBZ4Utfh8VsnI946HVlu__ZxheuUovEsHD1i-ul3DoSBkc3krjkXUFJbJiTVJvM4-mEG20FCMq2RY6o47SuhW82dRLYd92anFOJYlS3Patn_8h2LUqqQyhUNQV_o7PPwtM-9ka2Kb1qM/s757/3.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="224" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrBZ4Utfh8VsnI946HVlu__ZxheuUovEsHD1i-ul3DoSBkc3krjkXUFJbJiTVJvM4-mEG20FCMq2RY6o47SuhW82dRLYd92anFOJYlS3Patn_8h2LUqqQyhUNQV_o7PPwtM-9ka2Kb1qM/s640/3.JPG" width="640" /></a></div>
Вот так мы подцепили описание из модели и передали его нашему шаблону<br />
А ну ка попробуем его вывести:<br />
<!-- HTML generated using hilite.me --><br />
<div style="background: #ffffff; border-width: .1em .1em .1em .8em; border: solid gray; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: #007700;"><div</span> <span style="color: #0000cc;">class=</span><span style="background-color: #fff0f0;">"text"</span><span style="color: #007700;">></span><span style="color: #557799;"><?php</span> <span style="color: #008800; font-weight: bold;">echo</span> <span style="color: #996633;">$product</span>[<span style="background-color: #fff0f0;">'description'</span>]; <span style="color: #557799;">?></span><span style="color: #007700;"></div></span>
</pre>
</div>
И получаем такое:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7TTcoOiHwcgJZLXntuDecEe7-suoJS4EhgaP1T9R_0Xm-rb0fSoXclk7qnGwMLd5d7qDvmS1AmZB2SdiO4SqTab-QNhu-iZWmZUbGNkX7ZKR5-X90FU1_Anmb2k7RryTwdoHtAC8uxqg/s402/1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7TTcoOiHwcgJZLXntuDecEe7-suoJS4EhgaP1T9R_0Xm-rb0fSoXclk7qnGwMLd5d7qDvmS1AmZB2SdiO4SqTab-QNhu-iZWmZUbGNkX7ZKR5-X90FU1_Anmb2k7RryTwdoHtAC8uxqg/s320/1.JPG" width="174" /></a></div>
<br />
Описание вывелось! Но стоп: почему тэги вывелись текстом а не отрендерились? Я хз :о) Где-то они переводятся из html-сущности в текст, так давайте это исправим:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqGvJVoXW6qVsA_qLHvy6bJjwNYfhlBiOdqK3eczS0SqMOUpHy1K7ovJw39CSUFpH7A8I_oDaja53K34jabakFP9ZUaH9lZreA_KdsxvqAUeDPMEe0zKauHJ4NCl7pP0w8Ck-e7OIZnB8/s742/5.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqGvJVoXW6qVsA_qLHvy6bJjwNYfhlBiOdqK3eczS0SqMOUpHy1K7ovJw39CSUFpH7A8I_oDaja53K34jabakFP9ZUaH9lZreA_KdsxvqAUeDPMEe0zKauHJ4NCl7pP0w8Ck-e7OIZnB8/s640/5.JPG" width="640" /></a></div>
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigZ8gol7qDr4xxUYKbj-RxyB4fPTnEQgvIdqbsFBepBASxHXAHOnnJwETswNmze2BLv3t1fhs8Q82FzMpNvbfNTtnTL9UtvRqHpYKtWHqjw65CsKwHWA5UrN0rqIpuJLNp7YKl7G2svpk/s356/4.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigZ8gol7qDr4xxUYKbj-RxyB4fPTnEQgvIdqbsFBepBASxHXAHOnnJwETswNmze2BLv3t1fhs8Q82FzMpNvbfNTtnTL9UtvRqHpYKtWHqjw65CsKwHWA5UrN0rqIpuJLNp7YKl7G2svpk/s320/4.JPG" width="203" /></a></div>
<br />
Прекрасно!<br />
Ну теперь осталось лишь избавиться от тэгов и обрезать описание до нужных нам размеров:<br />
<!-- HTML generated using hilite.me --><br />
<div style="background: #ffffff; border-width: .1em .1em .1em .8em; border: solid gray; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;">'description' => substr(strip_tags(html_entity_decode($result['description'])), 0, 60)."...",
</pre>
</div>
Вуаля!)))<br />
<br /></div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-2044479403358750217.post-39325063723391984132013-05-26T20:07:00.002+03:002013-05-26T20:28:33.689+03:00Анимация в Flash: урок для начинающих<div dir="ltr" style="text-align: left;" trbidi="on">
И так, достаем где-нибудь программу Adobe Flash (тут используется версия CS6), желательно её установить, запускаем и... половина работы сделана, далее расписаны лишь мелочи, которых должно хватить для рисовки угарного мульта и последующего его показа пьяным друзьям<br />
<br />
Создаем новый ActionScript3 проект<br />
Смотрим на интерфейс проги, а именно на временную шкалу<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikJhuyfZHpHKf_z1Hgm-CoX9H_iQZs5WTQ9a0fE5-CY0Dq7xGUITtPq0xkdjjKrSEmtPxJtFpcGxB14KgeAJjxlcAkoC1YKEcac_DB9ql_B7GYfUjNxVmjwjW6N0SH3yQXR0-VpedRpU0/s1600/jjjjj.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikJhuyfZHpHKf_z1Hgm-CoX9H_iQZs5WTQ9a0fE5-CY0Dq7xGUITtPq0xkdjjKrSEmtPxJtFpcGxB14KgeAJjxlcAkoC1YKEcac_DB9ql_B7GYfUjNxVmjwjW6N0SH3yQXR0-VpedRpU0/s1600/jjjjj.JPG" height="256" width="400" /></a></div>
Слева мы видим "Layer 1" - это слой, как в фотожопе, и его можно скрывать (жмакаем на точку, расположенную под глазиком), блокировать от редактирования на всякий случяй (колодка), удалять (в низу, изображение мусорного бака), создавать новые слои и группы/папки<br />
Справа мы видим саму временную шкалу, в ней размещаются кадры нашего мего-ролика достойного высших наград <br />
<br />
Панель инструментов трогать почти не будем, мы будем использовать хот-кеи как настоящие джедаи<br />
<br />
И так, находим рабочее поле/холст, готовимся в нем рисовать<br />
Приготовились<br />
Жмем "<b>В</b>"(<b>кисть</b>) и ищем Properties (эта вкладка показывает настройки текущего инструмента/объекта)<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZVjg-LdJmOVe-yRytkvHM9VrAI4RXnmmPP18xlsL7Elheg5GnKeJ2tznsypSkpvIL9kFk1IODTUdCEE0_kt2OUp5EDEeKPGnwu0dPMqK392w2jZgzLVA6HBPBY-nJdMIG5VooyVXm0eo/s1600/b2.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZVjg-LdJmOVe-yRytkvHM9VrAI4RXnmmPP18xlsL7Elheg5GnKeJ2tznsypSkpvIL9kFk1IODTUdCEE0_kt2OUp5EDEeKPGnwu0dPMqK392w2jZgzLVA6HBPBY-nJdMIG5VooyVXm0eo/s1600/b2.JPG" height="288" width="320" /></a></div>
Давайте попробуем нарисовать несколько линий, играясь с параметром Smoothing (размер кисти регулируем кнопками "<b>[</b>" и "<b>]</b>") <br />
Должно получится нечто на подобии современного искусства <br />
Жмем "<b>Q</b>"(<b>выделялка</b>), выделаем их (Ctrl+A - выделить все) и удаляем<br />
<br />
А теперь нарисуй круг<br />
Жмем "<b>К</b>"(<b>заливка</b>), тыкаем в середину круга и радуемся<br />
<br />
Ну все, теперь мы готовы рисовать настоящий мульт!!1<br />
Я хочу нарисовать голубое небо<br />
Жмем "<b>R</b>"(<b>прямоугольник</b>), выбираем небесно голубой цвет заливки и заполняем им весь холст<br />
В новом слое кистью рисуем землю, облака, солнце, и заливаем подходящими цветами (почему в новом слое? попробуйте продолжить работу без создания слоя, сами увидите :о) )<br />
Вы можете столкнуться с маленькой проблемкой, которая изрядно бесит еще со времен Paint-a - невозможность залить пространство из за возможных дырок<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCwZyhCkJ5X8w82wzhd3I7LE6P4SNi3ckJY-yjh6uA0t45_RJxUxVtksJyPLh_mzfxfSfrKyh4Q9sWbhdjbP1cRqahRBsMpuI8S8H7lj3uBvpLdh-wj3SBDxaItwHT3VQ0QLMJCqP6F-I/s1600/b4.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCwZyhCkJ5X8w82wzhd3I7LE6P4SNi3ckJY-yjh6uA0t45_RJxUxVtksJyPLh_mzfxfSfrKyh4Q9sWbhdjbP1cRqahRBsMpuI8S8H7lj3uBvpLdh-wj3SBDxaItwHT3VQ0QLMJCqP6F-I/s1600/b4.JPG" height="215" width="320" /></a></div>
ЗЫ: то, что за пределами холста, в исходном ролике видно не будет<br />
В Adobe Flash решение есть! У инструмента заливки есть параметр степени пофигизма к дыркам!!1<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi7EJtgH__Rj2IbZ2ypAT2yIdzSoiCDXQzJEb1KMp2RwAwm80gCmjtpuP9m4G6BNkWjdNWo8SSZ7ePhBxExe7kEaBJcjE_WgSO1ThV0LkGiKwBXogXyPbwkoita2s2BD7C2bvu8G8mbsg/s1600/b5.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi7EJtgH__Rj2IbZ2ypAT2yIdzSoiCDXQzJEb1KMp2RwAwm80gCmjtpuP9m4G6BNkWjdNWo8SSZ7ePhBxExe7kEaBJcjE_WgSO1ThV0LkGiKwBXogXyPbwkoita2s2BD7C2bvu8G8mbsg/s1600/b5.JPG" height="59" width="320" /></a></div>
Фухх, идем дальше<br />
В новом слое нарисуем деревья<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiytYSlVMvWlTK289tCIu0NK9sYrrJApY2RXTB6AKsXOOjxF9W3DacLlbEUFScE5ZduAEgiXnBLgqyA00tWJn9v8oV9RTrmpIbkVx3mow2rj5QoiV1bi9WgUqi3F1dUkhMJemLdBOE39wQ/s1600/b1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiytYSlVMvWlTK289tCIu0NK9sYrrJApY2RXTB6AKsXOOjxF9W3DacLlbEUFScE5ZduAEgiXnBLgqyA00tWJn9v8oV9RTrmpIbkVx3mow2rj5QoiV1bi9WgUqi3F1dUkhMJemLdBOE39wQ/s1600/b1.JPG" height="320" width="208" /></a></div>
По-моему получилось восхитительно, и у вас, уверен, тоже!<br />
Но кое чего явно не хватает, скорее всего объема<br />
Жмем "<b>Y</b>"(<b>ручка</b>), и проделываем что-то типа такого:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_eoCE3cZTnNtuX-xRB-HcsWhaUY0ruhm7zCsEJyVh7eAuf2RszQBiLUax8Y81o-WkNbiklP2vDlUwHNJ4HbLtSpunp4jshBmqxBnPCqPwPeKsW4Qm1iiXZ3uZAGS3d0STaqN7inMqYTk/s1600/b2.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_eoCE3cZTnNtuX-xRB-HcsWhaUY0ruhm7zCsEJyVh7eAuf2RszQBiLUax8Y81o-WkNbiklP2vDlUwHNJ4HbLtSpunp4jshBmqxBnPCqPwPeKsW4Qm1iiXZ3uZAGS3d0STaqN7inMqYTk/s1600/b2.JPG" height="320" width="224" /></a></div>
А теперь заливаем нужные места цветами чуть-темнее исходных<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbKKBmgqfc97kKE78Xc0VYMUmKj1Xh_f44656Fk2eoP2bgfETxPTxX1m3CFf3BmUzZeeSWkFObaze_HMmQPf0YfalPoyWTWWWzFluhrVUvlsiuXg65cwufxPEcfQdjSZtfcEf3gJX6wGA/s1600/b3.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbKKBmgqfc97kKE78Xc0VYMUmKj1Xh_f44656Fk2eoP2bgfETxPTxX1m3CFf3BmUzZeeSWkFObaze_HMmQPf0YfalPoyWTWWWzFluhrVUvlsiuXg65cwufxPEcfQdjSZtfcEf3gJX6wGA/s1600/b3.JPG" height="320" width="237" /></a></div>
Выделяем все (Q, Ctrl+A), и жмакаем на следующее:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgumLiV6FoqdRt45JdYKmlC9QvKc0reVPiQyWhc-9Pm_SfRqDTRASd5JNkzh_rs6fJ1kcABguYhR4hfDcSi02cBNP5-Sgxc8tKgW1-TxJk90c-927NyhAR6j5v6WwA204_Wo3dGnOqVmyg/s1600/b4.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgumLiV6FoqdRt45JdYKmlC9QvKc0reVPiQyWhc-9Pm_SfRqDTRASd5JNkzh_rs6fJ1kcABguYhR4hfDcSi02cBNP5-Sgxc8tKgW1-TxJk90c-927NyhAR6j5v6WwA204_Wo3dGnOqVmyg/s1600/b4.JPG" /></a></div>
<br />
Как видим, дерево очистилось от линий ручки, а тени остались<br />
Что это вообще было?<br />
Создай новый слой, нарисуй две фигуры отдельно друг от друга<br />
Жмем "<b>V</b>"(<b>выделялка объектов</b>), выбираем одну фигуру, перетаскиваем на другую, убираем выделение (щелкаем где-нибудь в пустое место холста), опять выбираем нашу фигуру - и - о чудо! - они объединились! Что это за злое волшебство?<br />
В Flash, на сколько я понимаю, один слой == один объект (есть конечно возможность рисовать в отдельный объект (подслой), но это уже другая история)<br />
Tак вот: ручку мы использовали для рисования вспомогательных контуров, которые можно легко убрать<br />
<br />
Давайте теперь в новом слое нарисуем Главного Героя (далее как гг) гордо стоящего на сотворенной нами земле<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLzxVFWgP_Ky5DPe2sCFSh0neMw23EsFWxutCmYYqktJSTrVh3SX3tSJYyT_UAzBoknb9FgEY9Dv5ZjnoXf6hRLSVUT9pyP6gPKWM1TNjh_CiyHk3bAZGjjWZq9fs201X2Q2_cmxhNSjY/s1600/b1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLzxVFWgP_Ky5DPe2sCFSh0neMw23EsFWxutCmYYqktJSTrVh3SX3tSJYyT_UAzBoknb9FgEY9Dv5ZjnoXf6hRLSVUT9pyP6gPKWM1TNjh_CiyHk3bAZGjjWZq9fs201X2Q2_cmxhNSjY/s1600/b1.JPG" /></a></div>
Надо бы вдохнуть в него жизнь, а то стоит там как столб<br />
Жмем "<b>F7</b>"(<b>новый кадр</b>), и чтобы видеть предыдущий кадр (его "тень") тычем вооот сюда:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZGczGfiUsJyVf5OnGhPieelumN0HJnLFblh2idfi3UbgCC1etbT2lOasgVHnYa1STGaagb7lEOcpp8vsaMa_3ACtpjxIajfP5napKzM1DOhoAuBqaCoM7_U-bL6aWGY_q6Hi3oIAGsGQ/s1600/b1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZGczGfiUsJyVf5OnGhPieelumN0HJnLFblh2idfi3UbgCC1etbT2lOasgVHnYa1STGaagb7lEOcpp8vsaMa_3ACtpjxIajfP5napKzM1DOhoAuBqaCoM7_U-bL6aWGY_q6Hi3oIAGsGQ/s1600/b1.JPG" height="102" width="400" /></a></div>
Рисуем чувачка еще раз, или не чувачка, на ваше усмотрение<br />
ЗЫ: параметр fps можно понизить до 12, при этом пострадает плавность анимации, но зато придется меньше рисовать кадров :о)<br />
Ну что еще?<br />
Можно нажать "<b>F6</b>"(<b>новый кадр, на основе предыдущего</b>), или "<b>F5</b>"(увеличение размера кадра во временной шкале)<br />
"<b><</b>" и "<b>></b>" - перемещение между кадрами<br />
И святой "<b>Enter</b>"(<b>пуск/пауза</b> воспроизведения анимации) <br />
<br />
Еще есть такая штука как Сцена (Scene)<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg22DuPEyBQjTruCeCsgTZRqq6oQAHRe1GuQsGFpAtY2fdbo5LFw-TMUfKCSXZAIFm3DZ1JsS8PR2q3tB3HhmChjE6kay5eF-x1U4L1TD1wcB3WQRv0MmmvW6G0Y8DJIFjXH7gRu3kAoBc/s1600/b1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg22DuPEyBQjTruCeCsgTZRqq6oQAHRe1GuQsGFpAtY2fdbo5LFw-TMUfKCSXZAIFm3DZ1JsS8PR2q3tB3HhmChjE6kay5eF-x1U4L1TD1wcB3WQRv0MmmvW6G0Y8DJIFjXH7gRu3kAoBc/s1600/b1.JPG" /></a></div>
Каждая из них это отдельный холст со своей временной шкалой, и в финальном ролике они воспроизводятся поочередно<br />
"<b>Ctrl+Enter</b>"(<b>построить ролик</b>)<br />
<br />
Ну в принципе и все )))<br />
Рисовать - умеем, кадры создавать - умеем, что еще? Ну разве что пару уроков по чёрной магии не помешает :о)<br />
А я пока отлучусь на кое-какое время:<br />
<iframe allowfullscreen="" frameborder="0" height="360" src="http://www.youtube.com/embed/vbhqJ0Wloko?feature=player_detailpage" width="640"></iframe>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-2044479403358750217.post-29135336299309729262013-05-14T19:28:00.003+03:002013-05-26T16:06:53.410+03:00Что лучше? Mozilla Firefox vs Google Chrome<div dir="ltr" style="text-align: left;" trbidi="on">
Все началось с того, что комп начал сильно тормозить (если точнее, то тормоза были во время работы браузера)<br />
Отнес на полную чистку (смазка кулеров и т п), но к моему величайшему удивлению тормоза остались О_О<br />
Проверил температуру процессора во время воспроизведения ютубе-видео <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://cs305900.userapi.com/v305900215/4cd2/3LDXS_et1xg.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://cs305900.userapi.com/v305900215/4cd2/3LDXS_et1xg.jpg" /></a></div>
В пределах нормы, но все же слишком горячо<br />
Да и оперативка забита фиг знает чем <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://cs305900.userapi.com/v305900215/4cd9/3JC9KXs3F8g.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="267" src="http://cs305900.userapi.com/v305900215/4cd9/3JC9KXs3F8g.jpg" width="320" /></a></div>
Поставил Firefox и - о Боги! - все работает без тормозов!(кхм, сравнительно)<br />
Открыл в мозилле больше десяти вкладок - оперативы хавает ++280мб,
открыл в хроме 7 вкладок - ++1000мб (мог бы и больше, но задолбался
ждать когда они наконец-то загрузятся, в мозилле намного быстрее)<br />
Получается православный хром уже не торт<br />
Но почему так?<br />
<br />
<b>Что лучше? Mozilla Firefox vs Google Chrome</b> - ответ прост: зависит от вашей машины<br />
Chrome хорошо использует многоядерные процессоры, каждая его вкладка живет "своей жизнью", и это плохо сказывается на одноядерных<br />
Если у вас нетбук, старый ноутбук или допотопный пк - Firefox однозначно подойдет именно вам<br />
Если у вас больше одного ядра в процессоре и больше 2гб оперативки - Chrome это ваш браузер (то же касается Windows Vista/7/8)<br />
В остальном же (функциональные возможности, количество расширений, удобство) они в принципе равны<br />
На этом пока можно поставить точку в войне между двумя Гигантами<br />
ЗЫ: эта запись является компиляцией <a href="http://forum.boolean.name/showthread.php?t=17514" target="_blank">моей темы в моем любимом форуме</a></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-2044479403358750217.post-83264921814986662832013-05-14T18:10:00.003+03:002013-05-15T01:09:17.842+03:00Как сгенерировать/создать юзербар на PHP?<div dir="ltr" style="text-align: left;" trbidi="on">
В принципе нечего тут рассказывать, просто выложу прокомментированный код и приложу архив со всем остальным<br />
В итоге должно получится следующее:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi66ELBkyFUpxsyXcwQuLBgo09bSsmV0bkhIU-qFdlgO9zZ3oNvi-MHiD20HFG2DTswx5AnS-JbpngkQnybICjdwyzt42zZR0_yB4BXPOIIKIO6LAhJZFYJ6YRC3uFOoBNQp1e6GkQ-6t8/s1600/userbar_8.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi66ELBkyFUpxsyXcwQuLBgo09bSsmV0bkhIU-qFdlgO9zZ3oNvi-MHiD20HFG2DTswx5AnS-JbpngkQnybICjdwyzt42zZR0_yB4BXPOIIKIO6LAhJZFYJ6YRC3uFOoBNQp1e6GkQ-6t8/s1600/userbar_8.png" /></a></div>
<br />
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 300px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: #bc7a00;"><?php</span>
<span style="color: #408080; font-style: italic;">// Тип содержимого</span>
header(<span style="color: #ba2121;">'Content-Type: image/png'</span>);
<span style="color: green;">define</span>(<span style="color: #ba2121;">'FONT_NAME'</span>, <span style="color: #ba2121;">'trebuc.ttf'</span>);<span style="color: #408080; font-style: italic;">//имя шрифта</span>
<span style="color: green;">define</span>(<span style="color: #ba2121;">'FONT_SIZE'</span>, <span style="color: #666666;">9</span>);<span style="color: #408080; font-style: italic;">//кегль</span>
<span style="color: green;">define</span>(<span style="color: #ba2121;">'SPACING'</span>, <span style="color: #666666;">1</span>);<span style="color: #408080; font-style: italic;">//расстояние между символами</span>
<span style="color: #19177c;">$im</span> <span style="color: #666666;">=</span> imagecreatefrompng(<span style="color: #ba2121;">'userbar_template.png'</span>)<span style="color: #408080; font-style: italic;">//достаем "подложку" юзербара</span>
<span style="color: green; font-weight: bold;">or</span> <span style="color: green; font-weight: bold;">die</span>(<span style="color: #ba2121;">'Cannot create image'</span>);
<span style="color: green;">define</span>(<span style="color: #ba2121;">'WIDTH'</span>, imagesx(<span style="color: #19177c;">$im</span>));
<span style="color: green;">define</span>(<span style="color: #ba2121;">'HEIGHT'</span>, imagesy(<span style="color: #19177c;">$im</span>));
<span style="color: #408080; font-style: italic;">// Создание цветов</span>
<span style="color: #19177c;">$white</span> <span style="color: #666666;">=</span> imagecolorallocate(<span style="color: #19177c;">$im</span>, <span style="color: #666666;">255</span>, <span style="color: #666666;">255</span>, <span style="color: #666666;">255</span>);
<span style="color: #19177c;">$grey</span> <span style="color: #666666;">=</span> imagecolorallocate(<span style="color: #19177c;">$im</span>, <span style="color: #666666;">128</span>, <span style="color: #666666;">128</span>, <span style="color: #666666;">128</span>);
<span style="color: #19177c;">$yellow</span> <span style="color: #666666;">=</span> imagecolorallocate(<span style="color: #19177c;">$im</span>, <span style="color: #666666;">255</span>, <span style="color: #666666;">216</span>, <span style="color: #666666;">0</span>);
<span style="color: #19177c;">$black</span> <span style="color: #666666;">=</span> imagecolorallocate(<span style="color: #19177c;">$im</span>, <span style="color: #666666;">0</span>, <span style="color: #666666;">0</span>, <span style="color: #666666;">0</span>);
<span style="color: #408080; font-style: italic;">// Текст надписи</span>
<span style="color: #19177c;">$text</span> <span style="color: #666666;">=</span> <span style="color: #ba2121;">"Введите название..."</span>;
<span style="color: #408080; font-style: italic;">//определяем нужный для нашего текста размер области</span>
<span style="color: #19177c;">$coord</span> <span style="color: #666666;">=</span> imagettfbbox(
FONT_SIZE, <span style="color: #408080; font-style: italic;">// размер шрифта</span>
<span style="color: #666666;">0</span>, <span style="color: #408080; font-style: italic;">// угол наклона шрифта (0 = не наклоняем)</span>
FONT_NAME, <span style="color: #408080; font-style: italic;">// имя шрифта, а если точнее, ttf-файла</span>
<span style="color: #19177c;">$text</span> <span style="color: #408080; font-style: italic;">// собственно, текст</span>
);
<span style="color: #19177c;">$width</span> <span style="color: #666666;">=</span> <span style="color: #19177c;">$coord</span>[<span style="color: #666666;">2</span>] <span style="color: #666666;">-</span> <span style="color: #19177c;">$coord</span>[<span style="color: #666666;">0</span>];
<span style="color: #19177c;">$height</span> <span style="color: #666666;">=</span> <span style="color: #19177c;">$coord</span>[<span style="color: #666666;">1</span>] <span style="color: #666666;">-</span> <span style="color: #19177c;">$coord</span>[<span style="color: #666666;">7</span>];
<span style="color: #408080; font-style: italic;">// Зная ширину и высоту изображения, располагаем текст по центру:</span>
<span style="color: #408080; font-style: italic;">//$X = (WIDTH - $width) / 2;</span>
<span style="color: #19177c;">$Y</span> <span style="color: #666666;">=</span> (HEIGHT <span style="color: #666666;">+</span> <span style="color: #19177c;">$height</span>) <span style="color: #666666;">/</span> <span style="color: #666666;">2.5</span>;
<span style="color: #408080; font-style: italic;">// Тень</span>
imagettftextSp(<span style="color: #19177c;">$im</span>, FONT_SIZE, <span style="color: #666666;">0</span>, <span style="color: #666666;">11</span>, <span style="color: #19177c;">$Y</span>, <span style="color: #19177c;">$white</span>, FONT_NAME, <span style="color: #19177c;">$text</span>, SPACING);
<span style="color: #408080; font-style: italic;">// Текст</span>
imagettftextSp(<span style="color: #19177c;">$im</span>, FONT_SIZE, <span style="color: #666666;">0</span>, <span style="color: #666666;">10</span>, <span style="color: #19177c;">$Y</span>, <span style="color: #19177c;">$white</span>, FONT_NAME, <span style="color: #19177c;">$text</span>, SPACING);
<span style="color: #408080; font-style: italic;">// Достаем вторую, верхнюю часть шаблона</span>
<span style="color: #19177c;">$cover</span> <span style="color: #666666;">=</span> imagecreatefrompng(<span style="color: #ba2121;">'userbar_template_cover.png'</span>)
<span style="color: green; font-weight: bold;">or</span> <span style="color: green; font-weight: bold;">die</span>(<span style="color: #ba2121;">'Cannot create image'</span>);
<span style="color: #408080; font-style: italic;">// Накладываем её поверх нашего супер-юзербара</span>
imagecopy (<span style="color: #19177c;">$im</span>, <span style="color: #19177c;">$cover</span>, <span style="color: #666666;">0</span>, <span style="color: #666666;">0</span>, <span style="color: #666666;">0</span>, <span style="color: #666666;">0</span>, WIDTH, HEIGHT);
imagepng(<span style="color: #19177c;">$im</span>);
imagedestroy(<span style="color: #19177c;">$im</span>);
<span style="color: #408080; font-style: italic;">// Функция эта украдена уже не помню у кого и где, но автору большая от меня благодарность - именно благодаря ей можно управлять расстоянием между символами, ибо стандартные средства этого не предусмотрели О_О</span>
<span style="color: green; font-weight: bold;">function</span> <span style="color: blue;">imagettftextSp</span>(<span style="color: #19177c;">$image</span>, <span style="color: #19177c;">$size</span>, <span style="color: #19177c;">$angle</span>, <span style="color: #19177c;">$x</span>, <span style="color: #19177c;">$y</span>, <span style="color: #19177c;">$color</span>, <span style="color: #19177c;">$font</span>, <span style="color: #19177c;">$text</span>, <span style="color: #19177c;">$spacing</span> <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>)
{
<span style="color: green; font-weight: bold;">if</span> (<span style="color: #19177c;">$spacing</span> <span style="color: #666666;">==</span> <span style="color: #666666;">0</span>){imagettftext(<span style="color: #19177c;">$image</span>, <span style="color: #19177c;">$size</span>, <span style="color: #19177c;">$angle</span>, <span style="color: #19177c;">$x</span>, <span style="color: #19177c;">$y</span>, <span style="color: #19177c;">$color</span>, <span style="color: #19177c;">$font</span>, <span style="color: #19177c;">$text</span>);}
<span style="color: green; font-weight: bold;">else</span>
{
<span style="color: #19177c;">$temp_x</span> <span style="color: #666666;">=</span> <span style="color: #19177c;">$x</span>;
<span style="color: green; font-weight: bold;">for</span> (<span style="color: #19177c;">$i</span> <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>; <span style="color: #19177c;">$i</span> <span style="color: #666666;"><</span> <span style="color: green;">strlen</span>(<span style="color: #19177c;">$text</span>); <span style="color: #19177c;">$i</span><span style="color: #666666;">++</span>)
{
<span style="color: #19177c;">$bbox</span> <span style="color: #666666;">=</span> imagettftext(<span style="color: #19177c;">$image</span>, <span style="color: #19177c;">$size</span>, <span style="color: #19177c;">$angle</span>, <span style="color: #19177c;">$temp_x</span>, <span style="color: #19177c;">$y</span>, <span style="color: #19177c;">$color</span>, <span style="color: #19177c;">$font</span>, <span style="color: green;">mb_substr</span>(<span style="color: #19177c;">$text</span>,<span style="color: #19177c;">$i</span>,<span style="color: #666666;">1</span>,<span style="color: #ba2121;">'UTF-8'</span>));
<span style="color: #19177c;">$temp_x</span> <span style="color: #666666;">+=</span> <span style="color: #19177c;">$spacing</span> <span style="color: #666666;">+</span> (<span style="color: #19177c;">$bbox</span>[<span style="color: #666666;">2</span>] <span style="color: #666666;">-</span> <span style="color: #19177c;">$bbox</span>[<span style="color: #666666;">0</span>]);
}
}
}
<span style="color: #bc7a00;">?></span>
</pre>
</div>
В html на время тестов можно прописать что-то типа такого:
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 300px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: green; font-weight: bold;"><img</span> <span style="color: #7d9029;">src=</span><span style="color: #ba2121;">"userbar.php"</span><span style="color: green; font-weight: bold;">></span>
</pre>
</div>
Php-скрипт выдает картинку в качестве результата благодаря записи <b>header('Content-Type: image/png')</b>, позже её надо бы убрать, а саму картинку сохранять на сервере <br />
<a href="http://vk.com/doc55392215_182194687?hash=629d24355b00feb999" target="_blank">Ссылка на архив с шрифтом и шаблоном</a>
<br />
Ну и конечно же можно генерить BB-коды и просто ссылки для вставки в html
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 300px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;">//BB-code
$res = $res."[url=".ссылка на вашу страницу."][img]".ссылка на юзербар."[/img][/url]";
//HTML
$res = $res."<a target=\"_blank\" href=\"".ссылка на вашу страницу."\"><img src=\"".ссылка на юзербар."\" border=\"0\"></a>";
</pre>
</div>
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-2044479403358750217.post-2000437524291721772013-05-08T00:59:00.000+03:002013-05-15T00:59:54.568+03:00Свои иконки<div dir="ltr" style="text-align: left;" trbidi="on">
Каждый хоть раз наверняка хотел запилить свою иконку<br />
Вот и я захотел<br />
Случилось это под впечатлением от <a href="http://ru.wikipedia.org/wiki/Fez" target="_blank">игры FEZ</a>, а точнее - от её иконки (ибо сама игра так и не изволила загрузиться, но я не удивляюсь, ибо <a href="http://ru.wikipedia.org/wiki/%D0%A4%D0%B8%D0%BB_%D0%A4%D0%B8%D1%88" target="_blank">Фила Фиша</a> всегда сопровождали баги)<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb1313YWna4JMikePGMna9UNaz4OEiN3jK44JWqx1_X_0ukHnQ9y9S_aMW9AGWrCGvScZ2SyXGQz2lurI9nIHbNa-CfjawP2_Lh2C6PeZrC-ji7es3Ohq6zdKxuCLk68IXj4WeqVXX9-M/s1600/ds.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb1313YWna4JMikePGMna9UNaz4OEiN3jK44JWqx1_X_0ukHnQ9y9S_aMW9AGWrCGvScZ2SyXGQz2lurI9nIHbNa-CfjawP2_Lh2C6PeZrC-ji7es3Ohq6zdKxuCLk68IXj4WeqVXX9-M/s1600/ds.png" /></a></div>
Взяв в руки <a href="http://www.awicons.com/ru/icon-editor/" target="_blank">AWIcons</a> (наверное самый лучший редактор иконок) получилось вот это:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgantI7TTIVn8ZfnDa9CY7t81fZe_VFAxdwZGaH5dgjbl1F9AXlDxdvabAxG8ZR_SAqwiVbg8WA_OMQPQUUFlp_u7ePZwMGdJBPAj-Zk4QAYDClnsC3uFYKL0UAs-qqzPfpxbArb4tlxpw/s1600/ghgfh.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgantI7TTIVn8ZfnDa9CY7t81fZe_VFAxdwZGaH5dgjbl1F9AXlDxdvabAxG8ZR_SAqwiVbg8WA_OMQPQUUFlp_u7ePZwMGdJBPAj-Zk4QAYDClnsC3uFYKL0UAs-qqzPfpxbArb4tlxpw/s1600/ghgfh.png" /></a></div>
Ну все, конец этой бесполезной записи, мир</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-2044479403358750217.post-82942834941924235392013-05-07T20:41:00.003+03:002013-05-15T01:04:58.452+03:00Динамическое обновление контента<div dir="ltr" style="text-align: left;" trbidi="on">
Выкладываю свои наработки в этом направлении, ибо незачем добру пропадать<br />
Или не добру<br />
Вам виднее<br />
<br />
Что конкретно делают нижеследующие скрипты? Перехватывают нажатие на ссылки, блокируя дефолтную загрузку страницы, вместо чего вызывается заданная пользователем функция, которая может грузить через аякс какую-то инфу
Еще перехватываются нажатия на кнопки "назад-вперед" в браузере, т е сохраняется полноценная история просмотров, по которой можно переходить<br />
<a href="http://ojinn.pp.ua/" target="_blank">На практике это выглядит вот так</a> <br />
Вот скрипт, отвечающий за историю (добавление/удаление значений в адресной строке):<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 300px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: green; font-weight: bold;">function</span> updateAnalytics(){
$(<span style="color: #ba2121;">"#google_analytics"</span>).html(<span style="color: #ba2121;">"<script type='text/javascript'>"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"var _gaq = _gaq || [];"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"_gaq.push(['_setAccount', 'UA-39346755-1']);"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"_gaq.push(['_trackPageview']);"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"(function() {"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);"</span><span style="color: #666666;">+</span>
<span style="color: #ba2121;">"})();</script>"</span>);
}
<span style="color: green; font-weight: bold;">function</span> _get_url_vars(string){
<span style="color: green; font-weight: bold;">var</span> vars <span style="color: #666666;">=</span> [], hash;
<span style="color: green; font-weight: bold;">var</span> hashes;
<span style="color: green; font-weight: bold;">if</span> (string){hashes <span style="color: #666666;">=</span> string.slice(string.indexOf(<span style="color: #ba2121;">'?'</span>) <span style="color: #666666;">+</span> <span style="color: #666666;">1</span>).split(<span style="color: #ba2121;">'&'</span>);}
<span style="color: green; font-weight: bold;">else</span> { hashes <span style="color: #666666;">=</span> <span style="color: green;">window</span>.location.href.slice(<span style="color: green;">window</span>.location.href.indexOf(<span style="color: #ba2121;">'?'</span>) <span style="color: #666666;">+</span> <span style="color: #666666;">1</span>).split(<span style="color: #ba2121;">'&'</span>);}
<span style="color: green; font-weight: bold;">for</span>(<span style="color: green; font-weight: bold;">var</span> i <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>; i <span style="color: #666666;"><</span> hashes.length; i<span style="color: #666666;">++</span>)
{
<span style="color: green; font-weight: bold;">if</span>(hashes[i] <span style="color: #666666;">==</span> <span style="color: green;">window</span>.location){<span style="color: green; font-weight: bold;">return</span> vars;}
<span style="color: green; font-weight: bold;">else</span> {
hash <span style="color: #666666;">=</span> hashes[i].split(<span style="color: #ba2121;">'='</span>);
vars.push(hash[<span style="color: #666666;">0</span>]);
vars[hash[<span style="color: #666666;">0</span>]] <span style="color: #666666;">=</span> hash[<span style="color: #666666;">1</span>];
}
}
<span style="color: green; font-weight: bold;">return</span> vars;
}
<span style="color: green; font-weight: bold;">function</span> getUrlVar(name, string){
<span style="color: green; font-weight: bold;">if</span> (string){<span style="color: green; font-weight: bold;">return</span> (_get_url_vars(string))[name];}
<span style="color: green; font-weight: bold;">else</span> {<span style="color: green; font-weight: bold;">return</span> _url_vars[name];}
}
<span style="color: green; font-weight: bold;">function</span> getPrewUrlVar(name){
<span style="color: green; font-weight: bold;">return</span> prew_url_vars[name];
}
<span style="color: green; font-weight: bold;">var</span> _url_vars <span style="color: #666666;">=</span> [];<span style="color: #408080; font-style: italic;">//тут храним массив переменных из адресной строки {имя->значение}</span>
<span style="color: green; font-weight: bold;">var</span> prew_url_vars <span style="color: #666666;">=</span> [];
<span style="color: green; font-weight: bold;">var</span> tmp_prew_url_vars <span style="color: #666666;">=</span> [];
$(<span style="color: green; font-weight: bold;">function</span> (e) {<span style="color: #408080; font-style: italic;">//обновляем актуальность вышеопределенной переменной, при загрузке страницы и при нажатии по кнопочках "назад"/"вперед" в браузере</span>
$( <span style="color: green;">window</span> ).bind( <span style="color: #ba2121;">"popstate"</span>, <span style="color: green; font-weight: bold;">function</span>( e ) {
<span style="color: #408080; font-style: italic;">//var returnLocation = history.location || document.location;</span>
prew_url_vars <span style="color: #666666;">=</span> _copy_url_vars(_url_vars);
_url_vars <span style="color: #666666;">=</span> _get_url_vars();
_upd_url_vars();
updbg();
updateAnalytics();
});
_url_vars <span style="color: #666666;">=</span> _get_url_vars();
_upd_url_vars();
updbg();
updateAnalytics();
});
<span style="color: green; font-weight: bold;">var</span> _urlvars_ <span style="color: #666666;">=</span> <span style="color: #ba2121;">"?"</span>;<span style="color: #408080; font-style: italic;">//тут храним уже готовую строку с переменными, которую можно уже использовать</span>
<span style="color: green; font-weight: bold;">function</span> addUrlVar(var_name, var_val){<span style="color: #408080; font-style: italic;">//доюавление переменной</span>
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> _url_vars.length; i<span style="color: #666666;">++</span>){<span style="color: #408080; font-style: italic;">//если переменная с таким именем уже есть, то заменяем</span>
<span style="color: green; font-weight: bold;">if</span> (_url_vars[i] <span style="color: #666666;">==</span> var_name){<span style="color: green; font-weight: bold;">delete</span> _url_vars[_url_vars[i]]; _url_vars.splice(i, <span style="color: #666666;">1</span>);}
}
_url_vars.push(var_name);
_url_vars[var_name] <span style="color: #666666;">=</span> var_val;
_upd_url_vars();
}
<span style="color: green; font-weight: bold;">function</span> removeUrlVar(var_name){<span style="color: #408080; font-style: italic;">//удаление переменной</span>
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> _url_vars.length; i<span style="color: #666666;">++</span>){<span style="color: #408080; font-style: italic;">//удаляем уже существующую переменную с таким же именем, если она есть</span>
<span style="color: green; font-weight: bold;">if</span> (_url_vars[i] <span style="color: #666666;">==</span> var_name){<span style="color: green; font-weight: bold;">delete</span> _url_vars[_url_vars[i]]; _url_vars.splice(i, <span style="color: #666666;">1</span>);}
}
_upd_url_vars();
}
<span style="color: green; font-weight: bold;">function</span> _copy_url_vars(o) {
<span style="color: green; font-weight: bold;">var</span> r <span style="color: #666666;">=</span> [];
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> o.length; i<span style="color: #666666;">++</span>){
r.push(o[i]);
r[o[i]] <span style="color: #666666;">=</span> o[o[i]];
}
<span style="color: green; font-weight: bold;">return</span> r;
}
<span style="color: green; font-weight: bold;">function</span> updateUrl(){<span style="color: #408080; font-style: italic;">//обновляем историю, впихнув в нее нашу сгенерированную строку "_urlvars_"</span>
<span style="color: green; font-weight: bold;">var</span> sm <span style="color: #666666;">=</span> <span style="color: green; font-weight: bold;">true</span>;
<span style="color: green; font-weight: bold;">if</span> (_url_vars.length <span style="color: #666666;">==</span> prew_url_vars.length <span style="color: #666666;">&&</span> _url_vars.length <span style="color: #666666;">></span> <span style="color: #666666;">0</span>){
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> _url_vars.length <span style="color: #666666;">&&</span> i <span style="color: #666666;"><</span> prew_url_vars.length; i<span style="color: #666666;">++</span>){
<span style="color: green; font-weight: bold;">if</span> ((_url_vars[i] <span style="color: #666666;">!=</span> tmp_prew_url_vars[i]) <span style="color: #666666;">||</span> (_url_vars[_url_vars[i]] <span style="color: #666666;">!=</span> tmp_prew_url_vars[tmp_prew_url_vars[i]])){
sm <span style="color: #666666;">=</span> <span style="color: green; font-weight: bold;">false</span>; <span style="color: green; font-weight: bold;">break</span>;
}
}
}
<span style="color: green; font-weight: bold;">else</span> {sm <span style="color: #666666;">=</span> <span style="color: green; font-weight: bold;">false</span>;}
<span style="color: green; font-weight: bold;">if</span> (sm <span style="color: #666666;">==</span> <span style="color: green; font-weight: bold;">true</span>){<span style="color: green; font-weight: bold;">return</span>;}
<span style="color: green; font-weight: bold;">delete</span> prew_url_vars;
prew_url_vars <span style="color: #666666;">=</span> _copy_url_vars(tmp_prew_url_vars);
tmp_prew_url_vars <span style="color: #666666;">=</span> _copy_url_vars(_url_vars)
history.pushState( <span style="color: green; font-weight: bold;">null</span>, <span style="color: green; font-weight: bold;">null</span>, _urlvars_ );
updbg();
updateAnalytics();
}
<span style="color: green; font-weight: bold;">function</span> _upd_url_vars(){<span style="color: #408080; font-style: italic;">//собсно, основываясь на переменной "_url_vars", генерируем строку "_urlvars_" для вставки в историю</span>
_urlvars_ <span style="color: #666666;">=</span> <span style="color: #ba2121;">"?"</span>;
_url_vars.sort();
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> _url_vars.length; i<span style="color: #666666;">++</span>){
<span style="color: green; font-weight: bold;">if</span> (i <span style="color: #666666;">!=</span> <span style="color: #666666;">0</span>){_urlvars_ <span style="color: #666666;">=</span> _urlvars_ <span style="color: #666666;">+</span> <span style="color: #ba2121;">"&"</span>;}
_urlvars_ <span style="color: #666666;">=</span> _urlvars_ <span style="color: #666666;">+</span> _url_vars[i] <span style="color: #666666;">+</span> <span style="color: #ba2121;">"="</span> <span style="color: #666666;">+</span> _url_vars[_url_vars[i]];
}
}
<span style="color: green; font-weight: bold;">function</span> updbg(){
$(<span style="color: #ba2121;">"#debuginfo"</span>).html(<span style="color: #ba2121;">""</span>);
<span style="color: green; font-weight: bold;">var</span> test <span style="color: #666666;">=</span> <span style="color: #ba2121;">"Prew: "</span>;
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> prew_url_vars.length; i<span style="color: #666666;">++</span>){
test <span style="color: #666666;">+=</span> prew_url_vars[i] <span style="color: #666666;">+</span> <span style="color: #ba2121;">"="</span> <span style="color: #666666;">+</span> prew_url_vars[prew_url_vars[i]]<span style="color: #666666;">+</span><span style="color: #ba2121;">", "</span>;
}
addbg(test);
test <span style="color: #666666;">=</span> <span style="color: #ba2121;">"Cur: "</span>;
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i<span style="color: #666666;">=0</span>; i <span style="color: #666666;"><</span> _url_vars.length; i<span style="color: #666666;">++</span>){
test <span style="color: #666666;">+=</span> _url_vars[i] <span style="color: #666666;">+</span> <span style="color: #ba2121;">"="</span> <span style="color: #666666;">+</span> _url_vars[_url_vars[i]]<span style="color: #666666;">+</span><span style="color: #ba2121;">", "</span>;
}
addbg(test);
}
<span style="color: green; font-weight: bold;">function</span> addbg(inf){
$(<span style="color: #ba2121;">"#debuginfo"</span>).append(inf<span style="color: #666666;">+</span><span style="color: #ba2121;">"<br>"</span>);
}</pre>
<pre style="line-height: 125%; margin: 0;"> </pre>
</div>
<br />
Как пользоваться:<br />
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 700px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;">addUrlVar(<span style="color: #ba2121;">"имя_переменной"</span>, <span style="border: 1px solid #FF0000;">значение</span> );<span style="color: #408080; font-style: italic;">//добавляем переменную</span>
updateUrl();<span style="color: #408080; font-style: italic;">//обновляем историю/адресную строку</span>
</pre>
</div>
Адресная строка станет из "example.ru" -> "example.ru?имя_переменной=значение"
<br />
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 700px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;">removeUrlVar(<span style="color: #ba2121;">"имя_переменной"</span>);<span style="color: #408080; font-style: italic;">//удаление переменной</span>
getUrlVar(<span style="color: #ba2121;">"имя_переменной"</span>, <span style="color: #ba2121;">"строка"</span>);
<span style="color: #408080; font-style: italic;">//добываем текущее значение переменной, </span>
<span style="color: #408080; font-style: italic;">//и если второй параметр указан - переменная ищется не в адресной строке, </span>
<span style="color: #408080; font-style: italic;">//а во втором параметре (использую для поиска переменной в ссылках)</span>
getPrewUrlVar(<span style="color: #ba2121;">"имя_переменной"</span>);<span style="color: #408080; font-style: italic;">//добываем предыдущее значение переменной</span>
</pre>
</div>
Отладочная инфа выводится в div с идентификатором "debuginfo", можете создать его где угодно с какими угодно стилями<br />
Следующий скрипт отвечает за реестр и обработку переменных
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 300px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: #408080; font-style: italic;">//----------------------------------------------------------------------------com</span>
<span style="color: green; font-weight: bold;">var</span> update_com <span style="color: #666666;">=</span> [];
<span style="color: green; font-weight: bold;">function</span> regUpdateCom(params, _com){
_com.params <span style="color: #666666;">=</span> params;
update_com[update_com.length] <span style="color: #666666;">=</span> _com;
}
<span style="color: green; font-weight: bold;">var</span> _com_at_start <span style="color: #666666;">=</span> <span style="color: green; font-weight: bold;">true</span>;
$(<span style="color: green; font-weight: bold;">function</span> (e) {
$( <span style="color: green;">window</span> ).bind( <span style="color: #ba2121;">"popstate"</span>, <span style="color: green; font-weight: bold;">function</span>( e ) {
pageUpdate();
});
pageUpdate();
$(<span style="color: #ba2121;">"body"</span>).on(<span style="color: #ba2121;">"click"</span>, <span style="color: #ba2121;">"a"</span>, <span style="color: green; font-weight: bold;">function</span>(event){
<span style="color: green; font-weight: bold;">var</span> o;
<span style="color: green; font-weight: bold;">var</span> param_count, pv, cv, sm, param, val, pval;
<span style="color: green; font-weight: bold;">var</span> href <span style="color: #666666;">=</span> $(<span style="color: green; font-weight: bold;">this</span>).attr(<span style="color: #ba2121;">'href'</span>).slice(<span style="color: #666666;">0</span>, $(<span style="color: green; font-weight: bold;">this</span>).attr(<span style="color: #ba2121;">'href'</span>).indexOf(<span style="color: #ba2121;">'?'</span>));
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>; i <span style="color: #666666;"><</span> update_com.length <span style="color: #666666;">&&</span> (href <span style="color: #666666;">==</span> <span style="color: green;">window</span>.location <span style="color: #666666;">||</span> href <span style="color: #666666;">==</span> <span style="color: #ba2121;">'/'</span>); i<span style="color: #666666;">++</span>){
param_count <span style="color: #666666;">=</span> update_com[i].params.length;
<span style="color: green; font-weight: bold;">var</span> res <span style="color: #666666;">=</span> [];
pv <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>, cv <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>, sm <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>;
<span style="color: #408080; font-style: italic;">//var test = "";</span>
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> p <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>; p <span style="color: #666666;"><</span> param_count; p<span style="color: #666666;">++</span>){
<span style="color: #408080; font-style: italic;">//test+="\n ";</span>
param <span style="color: #666666;">=</span> update_com[i].params[p];
val <span style="color: #666666;">=</span> getUrlVar(param, $(<span style="color: green; font-weight: bold;">this</span>).attr(<span style="color: #ba2121;">"href"</span>));
<span style="color: #408080; font-style: italic;">//alert(param+"="+_url_vars[param]+", ");</span>
pval <span style="color: #666666;">=</span> getUrlVar(param);
<span style="color: green; font-weight: bold;">if</span> (pval){pv<span style="color: #666666;">++</span>;}
res.push(param);
<span style="color: green; font-weight: bold;">if</span> (val){cv<span style="color: #666666;">++</span>; res[param] <span style="color: #666666;">=</span> val; addUrlVar(param, val);}<span style="color: green; font-weight: bold;">else</span>{res[param] <span style="color: #666666;">=</span> pval;}
<span style="color: #408080; font-style: italic;">//var tsm = "is not sm";</span>
<span style="color: green; font-weight: bold;">if</span> (val <span style="color: #666666;">==</span> pval <span style="color: #666666;">||</span> (pval <span style="color: #666666;">&&</span> <span style="color: #666666;">!</span>val)){
sm<span style="color: #666666;">++</span>;
<span style="color: #408080; font-style: italic;">//tsm = "is sm";</span>
}
<span style="color: #408080; font-style: italic;">//test+="param: "+param+", prew: "+pval+", cur: "+val+", "+tsm+", ";</span>
}
<span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">==</span> <span style="color: #666666;">0</span> <span style="color: #666666;">&&</span> cv){
<span style="color: green; font-weight: bold;">if</span> (update_com[i].on_open){update_com[i].on_open(res);}
<span style="color: green; font-weight: bold;">else</span> {update_com[i].on_update(res);}
updateUrl();
<span style="color: #408080; font-style: italic;">//test+="\n todo: open"; alert (test); </span>
o<span style="color: #666666;">=1</span>; <span style="color: green; font-weight: bold;">continue</span>;}
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">&&</span> cv <span style="color: #666666;">&&</span> sm <span style="color: #666666;"><</span> param_count){
update_com[i].on_update(res);
updateUrl();
<span style="color: #408080; font-style: italic;">//test+="\n todo: update"; alert (test); </span>
o<span style="color: #666666;">=1</span>; <span style="color: green; font-weight: bold;">continue</span>;}
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">&&</span> cv){
<span style="color: #408080; font-style: italic;">//test+="\n todo: none"; alert (test); </span>
o<span style="color: #666666;">=1</span>; <span style="color: green; font-weight: bold;">continue</span>;}
}
<span style="color: green; font-weight: bold;">if</span>(o){<span style="color: green; font-weight: bold;">return</span> <span style="color: green; font-weight: bold;">false</span>;}
});
});
<span style="color: green; font-weight: bold;">function</span> pageUpdate(){
addbg(<span style="color: #ba2121;">"<br>page update:"</span>);
<span style="color: green; font-weight: bold;">var</span> test, tsm, param_count, pv, cv, sm, param, val, pval;
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> i <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>; i <span style="color: #666666;"><</span> update_com.length; i<span style="color: #666666;">++</span>){
test <span style="color: #666666;">=</span> <span style="color: #ba2121;">""</span>;
param_count <span style="color: #666666;">=</span> update_com[i].params.length;
<span style="color: green; font-weight: bold;">var</span> res <span style="color: #666666;">=</span> [];
pv <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>, cv <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>, sm <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>;
<span style="color: green; font-weight: bold;">for</span> (<span style="color: green; font-weight: bold;">var</span> p <span style="color: #666666;">=</span> <span style="color: #666666;">0</span>; p <span style="color: #666666;"><</span> param_count; p<span style="color: #666666;">++</span>){
test<span style="color: #666666;">+=</span><span style="color: #ba2121;">"\n "</span>;
param <span style="color: #666666;">=</span> update_com[i].params[p];
pval <span style="color: #666666;">=</span> getPrewUrlVar(param);
val <span style="color: #666666;">=</span> getUrlVar(param);
<span style="color: green; font-weight: bold;">if</span> (pval){pv<span style="color: #666666;">++</span>;}
<span style="color: green; font-weight: bold;">if</span> (val){cv<span style="color: #666666;">++</span>; res.push(param); res[param] <span style="color: #666666;">=</span> val;}
tsm <span style="color: #666666;">=</span> <span style="color: #ba2121;">"is not sm"</span>;
<span style="color: green; font-weight: bold;">if</span> (val <span style="color: #666666;">==</span> pval){sm<span style="color: #666666;">++</span>;tsm <span style="color: #666666;">=</span> <span style="color: #ba2121;">"is sm"</span>;}
test<span style="color: #666666;">+=</span><span style="color: #ba2121;">"param: "</span><span style="color: #666666;">+</span>param<span style="color: #666666;">+</span><span style="color: #ba2121;">", prew: "</span><span style="color: #666666;">+</span>pval<span style="color: #666666;">+</span><span style="color: #ba2121;">", cur: "</span><span style="color: #666666;">+</span>val<span style="color: #666666;">+</span><span style="color: #ba2121;">", "</span><span style="color: #666666;">+</span>tsm<span style="color: #666666;">+</span><span style="color: #ba2121;">", "</span>;
}
<span style="color: #408080; font-style: italic;">//open | update</span>
<span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">==</span> <span style="color: #666666;">0</span> <span style="color: #666666;">&&</span> cv){
<span style="color: green; font-weight: bold;">if</span> (update_com[i].on_truestart <span style="color: #666666;">&&</span> _com_at_start){update_com[i].on_truestart(res);addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_truestart"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv==0 && cv)"</span>);}
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (update_com[i].on_open){update_com[i].on_open(res);addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_open"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv==0 && cv)"</span>);}
<span style="color: green; font-weight: bold;">else</span>{update_com[i].on_update(res);addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_update"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv==0 && cv)"</span>);}
}
<span style="color: #408080; font-style: italic;">//update</span>
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">&&</span> cv <span style="color: #666666;">&&</span> sm <span style="color: #666666;"><</span> param_count){update_com[i].on_update(res);addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_update"</span> <span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv && cv && sm < param_count)"</span>);}
<span style="color: #408080; font-style: italic;">//close | update</span>
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">&&</span> cv <span style="color: #666666;">==</span> <span style="color: #666666;">0</span>){
<span style="color: green; font-weight: bold;">if</span> (update_com[i].on_close){update_com[i].on_close();addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_close"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv && cv == 0)"</span>);}
<span style="color: green; font-weight: bold;">else</span>{update_com[i].on_update(res);addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_update"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv && cv == 0)"</span>);}
}
<span style="color: #408080; font-style: italic;">//same</span>
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">&&</span> cv <span style="color: #666666;">&&</span> sm <span style="color: #666666;">==</span> param_count){
<span style="color: green; font-weight: bold;">if</span> (update_com[i].on_same){update_com[i].on_same();addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_same"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv && cv && sm == param_count)"</span>);}
}
<span style="color: #408080; font-style: italic;">//disabled | falsestart</span>
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (pv <span style="color: #666666;">==</span> <span style="color: #666666;">0</span> <span style="color: #666666;">&&</span> cv <span style="color: #666666;">==</span> <span style="color: #666666;">0</span>){
<span style="color: green; font-weight: bold;">if</span> (update_com[i].on_falsestart <span style="color: #666666;">&&</span> _com_at_start){update_com[i].on_falsestart();addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_falsestart"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv == 0 && cv == 0)"</span>);}
<span style="color: green; font-weight: bold;">else</span> <span style="color: green; font-weight: bold;">if</span> (update_com[i].on_disabled){update_com[i].on_disabled();addbg(test<span style="color: #666666;">+</span><span style="color: #ba2121;">"on_disabled"</span><span style="color: #666666;">+</span><span style="color: #ba2121;">", (pv == 0 && cv == 0)"</span>);}
}
}
_com_at_start <span style="color: #666666;">=</span> <span style="color: green; font-weight: bold;">false</span>;
}
</pre>
</div>
Пример использования:
<!-- HTML generated using hilite.me --><br />
<div style="background: #f8f8f8; border-width: .1em .1em .1em .8em; border: solid gray; max-height: 300px; overflow: auto; padding: .2em .6em; width: auto;">
<pre style="line-height: 125%; margin: 0;">regUpdateCom([<span style="color: #ba2121;">"имя_переменной"</span>], {<span style="color: #408080; font-style: italic;">//регистрируем наш параметр, и с этого момента все клики по ссылках, содержащие его, будут обрабатываться заданными ниже вашими обработчиками</span>
<span style="color: #408080; font-style: italic;">//можно регистрировать более одного параметра подрят, с помощью такой записи "["имя_переменной1", "имя_переменной2"]"</span>
on_update<span style="color: #666666;">:</span><span style="color: green; font-weight: bold;">function</span>(val){<span style="color: #408080; font-style: italic;">//on_update - эта функция вызывается при каждом обновлении адресной строки, будь то это переход по ссылке, или же нажатии на кнопку "назад" в браузере</span>
<span style="color: #408080; font-style: italic;">//val - массив, содержащий в себе все переменные из адресной строки и их текущие значения</span>
UpdateContent(val.<span style="border: 1px solid #FF0000;">имя</span>_<span style="border: 1px solid #FF0000;">переменной</span>);<span style="color: #408080; font-style: italic;">//ваша функция, и она очень хорошо умеет загружать данные через аякс :З </span>
<span style="color: #408080; font-style: italic;">//val.имя_переменной - тут мы получаем, например, id загружаемого контента</span>
},
on_falsestart<span style="color: #666666;">:</span><span style="color: green; font-weight: bold;">function</span>(){<span style="color: #408080; font-style: italic;">//on_falsestart - вызывается когда пользователь только-что зашел на ваш сайт, но значения нашей переменной он не задал, тобишь она вызывается "по-дефолту"</span>
UpdateContent(<span style="color: #666666;">0</span>);
}
});
</pre>
</div>
Наши обработчики можно забиндить на следующие события:<br />
<b>on_open </b>- когда предыдущее значение не назначено или равно нулю, но при этом текущее - назначено<br />
<b>on_update</b> - предыдущее значение и текущее - назначены, но они разные<br />
<b>on_same </b>- предыдущее значение назначено, как и текущее, при этом они еще и равны <br />
<b>on_close</b> - предыдущее значение назначено, но текущее - пустое<br />
<b>on_falsestart</b> - предыдущее и текущие значения отсутствуют, вызывается только при первом заходе на страницу<br />
<b>on_disabled</b> - предыдущее значение и текущее - не назначены<br />
<br />
Для обеспечения работы всего этого добра, надо бы присоединить <a href="http://habrahabr.ru/post/144071/" target="_blank">еще один скрипт</a>, имитирующий HistoryAPI из HTML5, ну и плюс еще jQuery который наверняка используется большинством<br />
<br />
Вот и все<br />
Почти<br />
Если кому интересно, могу рассказать как все это добро сдружить с поисковиками<br />
<br />
Заметка: для вставки кода использую <a href="http://hilite.me/" target="_blank">этот ресурс</a> </div>
Unknownnoreply@blogger.com0