приложение на js для удобной передачи смайликов на форумы и сайты с поддержкой BBCode.
В приложении задействованы JS API:
Cross-document messaging
WebStorage
JSON parsing
- index.html
- Главная и единственная страничка приложения. Подгружает стили и скрипт программы.
- SmilePack.js
- Главный скрипт приложения. В нем происходят основные рабочие процессы: создание пользовательских наборов из смайликов, кеширование, AJAX-запросы на сервер, работа с WebStorage и т.д.
- style.css
- Стили приложения для full-версии сайта. Нагружает CPU, поэтому рекомендован для мощных ПК.
- style_lite.css
- Стили приложения для lite-версии сайта. Сделан специально для маломощный ПК. Результаты тестирования показали, что gif-анимация и некоторые свойства css (box-shadow, border-radius, transition и т.д.) создают серьезную нагрузку на процессор пользователя. Данные стили позволяют снизить нагрузку более, чем в 4 раза (safari). Переключить версии можно под копирайтом приложения.
- check.php
- Обрабатывает запрос от клиента. Проверяет запрашиваемую директорию на наличие gif-анимации, собирает информацию в JSON. Запрашивается единственный раз (при первой загрузке), при повторном запросе JSON берется из локального хранилища браузера пользователя.
- sp.html
- HTML-разметка фрейма на стороннем ресурсе при вызове букмарклета.
- sp.css
- Стили для букмарклета.
- bookmarklet.js
- Скрипт на стороне букмарклета. На основе созданных директорий заполняет его содержимое. Отправляет сообщение скрипту message.js с информацией о картинке.
- message.js
- Скрипт на стороннем сайте. Получает сообщение из букмарклета и вставляет BBCode в указанное место.
Пользователь составляет из понравившихся изображений собственные наборы (директории).
На стороннем сайте открывает букмарклет, выбирает нужную картинку кликая на нее.
Если следующий клик приходится на текстовую область (textarea или input c типом text),
то в этой области создается bbCode с ссылкой на эту картинку.
Посмотреть как работает приложение можно на видео.
© 2012 lgick. Email: lgick@yandex.ru