Используем data:uri

Берем последний JQuery + JQuery UI с официального сайта, причем отказываемся от загрузки эффектов UI и соглашаемся с выбором темы оформления по умолчанию ui-lightness. Далее пакуем все это в deb-пакет mbgserver-jquery, сразу же заменяя ссылки на картинки в css-файле на их base64 представление согласно формату data:uri. Написанный на скорую руку скрипт делает то, что нам нужно, хотя его не стоит рекомендовать как образец программирования на тикле:
#!/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

Popular posts from this blog

Открытый софт для научных расчетов

Счетчики в SQLite

Обработка email-сообщений