ColorPicker
Выложил на ztools.org компонент для выбора цвета, по моему, получилось неплохо...
Компонент представляет собой RGB палитру, наподобие той, что используется в Photoshop - на мой взгляд, так выбирать цвет удобнее всего, хотя, есть задумка сделать еще несколько оригинальных колорпикеров.
getElementsByTagName
Забавно, getElementsByTagName не только возвращает коллекцию элементов по имени тега, но и поддерживает эту коллекцию в актуальном состоянии.
Так, если я добавлю в документ еще один элемент с таким же именем, то количество элементов в коллекции созданной ранее изменится:
window.onload = function(){ var inputs = document.getElementsByTagName('input'); alert(inputs.length); var item = document.createElement('input'); document.body.appendChild(item); alert(inputs.length); }
Upd: действительно: The list is live, so changes to it internally or externally will cause the items they reference to be updated as well.
Маска, маска я тебя знаю
Понадобилось сделать картинку с неровными краями, причем картинка должна быть именно прозрачной, вариант сделать белый фон не прокатывает. Самым логичным было бы использовать наложение маски как это можно сделать скажем во флеше... но...
Почемуто в GD нет функций для работы с масками. Пришлось изобретать самим, и вот что получилось:
Так выглядит код маскирования:
$image = imagecreatefromgif('image.gif'); $mask = imagecreatefromgif('mask.gif'); $dest = imagecreatetruecolor(imagesx($image),imagesy($image)); imagemask($dest,$image,$mask); header('Content-type: image/jpeg'); imagepng($dest);
Код самой функции маскирования:
function imagemask($dest,$image,$mask){ $width = imagesx($image); $height = imagesy($image); $tc = imagecolorallocate($dest,0,0,0); imagecolortransparent($dest,$tc); for($i=0;$i<$width;$i++){ for($j=0;$j<$height;$j++){ $c = imagecolorat($image,$i,$j); $color = imagecolorsforindex($image,$c); $c = imagecolorat($mask,$i,$j); $mcolor = imagecolorsforindex($mask,$c); if (!($mcolor['red']==255 && $mcolor['green']==255 && $mcolor['blue']==255)){ $c = imagecolorallocate($dest,$color['red'],$color['green'],$color['blue']); imagesetpixel($dest,$i,$j,$c); } } } }
Правда расстраивает, что GD так и не научилась работать нормально с полупрозрачностью - если кто знает способ, расскажите плиз.
Занятный фокус с JS
За что я люблю JS это за то что на нем можно реализовать некоторые вещи совершенно нетривиальным способом. Например такая задача: Есть IFRAME который создается динамически, нужно привесить событие onload на объект window внутри этого IFRAME. Сразу после создания свойство contentWindow равно нулю, поэтому непосредственно после создания доступа к нему нет. Оно станет доступно через некоторое время. Логичным будет проверять на ноль свойство каждые сто миллисекунд пока оно не будет чему нибудь равно:
var onloadfunc = function(){ alert('loaded!!!'); }; (function(){ if (!iframe.contentWindow){ setTimeout(arguments.callee,100); return; } iframe.contentWindow.onload = onloadfunc; })();
В приведенном примере анонимная функция вызывает саму себя через каждые 100 миллисекунд. Интересно что когда это писал - забыл поставить точку с запятой в }; - это привело к интересной штуке - калбак стал вызываться на этапе инициализации - т.е. скобки имеют наивысший приоритет даже если между ними стоит перенос строки.