Используем data:uri
Берем последний JQuery + JQuery UI с официального сайта, причем отказываемся от загрузки эффектов UI и соглашаемся с выбором темы оформления по умолчанию ui-lightness. Далее пакуем все это в deb-пакет mbgserver-jquery, сразу же заменяя ссылки на картинки в css-файле на их base64 представление согласно формату data:uri. Написанный на скорую руку скрипт делает то, что нам нужно, хотя его не стоит рекомендовать как образец программирования на тикле:
Теперь делаем симлинки скриптов и стилей JQuery в рабочие директории, добавляем свои, пакуем их все вместе, получая файлы autoload.js и autoload.css и можно пользоваться.
Проверим на виджете Dialog. О нем много понаписано, например, jQuery UI – виджет Dialog Отлично, открывается окно диалога с фоновой картинкой заголовка и кнопкой закрытия в правом верхнем углу. Подробности смотрим в файрбаге или гугл девелопер тулс, в зависимости от нашего браузера.
Вот экзерсис в тему: Кроссбраузерный data URI в CSS-файлах. Имхо это зло, делать подобные вещи в продакшене сейчас, когда ИЕ6 сама микрософт жаждет похоронить, но ежели сильно приспичит, то как один из вариантов может пригодиться.
#!/usr/bin/tclsh8.5 proc K {arg args} {set arg} proc >> {name data} {set f [open $name w]; puts -nonewline $f $data; close $f} proc << name {K [read [set f [open $name]]] [close $f]} set css [exec sh -c "cat *css"] foreach file [exec ls images/] { set file images/$file # puts $file set image [string map {\r {} \n {}} [exec base64 $file]] set mime [exec file --brief --mime-type $file] set css [regsub -all -- $file $css "'data:$mime;base64,$image'"] } #puts $css set dir [exec pwd] set dir [exec basename $dir] >> ../${dir}.css $cssЗамечу, что в css недопустимо многострочное представление base64-строк. Указанный скрипт также наличествует в собранном пакете mbgserver-jquery.
Теперь делаем симлинки скриптов и стилей JQuery в рабочие директории, добавляем свои, пакуем их все вместе, получая файлы autoload.js и autoload.css и можно пользоваться.
Проверим на виджете Dialog. О нем много понаписано, например, jQuery UI – виджет Dialog Отлично, открывается окно диалога с фоновой картинкой заголовка и кнопкой закрытия в правом верхнем углу. Подробности смотрим в файрбаге или гугл девелопер тулс, в зависимости от нашего браузера.
Вот экзерсис в тему: Кроссбраузерный data URI в CSS-файлах. Имхо это зло, делать подобные вещи в продакшене сейчас, когда ИЕ6 сама микрософт жаждет похоронить, но ежели сильно приспичит, то как один из вариантов может пригодиться.
Comments