Чудо{вищные} заметки

Ну наверное для многих не новость, что после очередного апдейта IE (6), начались проблемы с Flash-ем (впрочем не только с ним…) – вокруг означенного флэша появилась пренеприятнейшая рамка и tooltip с напоминанием о том, что надо кликнуть на объект, чтобы его активировать…

UPDATE2:

Модификация Internet Explorer должна решить проблему нарушения корпорацией Microsoft патента фирмы Eolas на технологию взаимодействия пользователя с интерактивным контентом, внедрённым в веб-страницы.

Вот собственно где собака порылась – теперь не M$ нарушает американские патенты – теперь из буду нарушать я ;o)
Умные люди нашли выход – вставлять флэш через JS.

Я этот метод в принципе одобряю – как-никак спасение… но править добрую полсотню сайтов, искать там банеры и прочий активный контент и заменять вставку swf-ок на flashobject … это путь для самурая – я пошёл другим путём – нахожу все object-ы c нужным classid и тупо переписываю obj.outerHTML = obj.outerHTML

И что интересно – это работает! Но… но вот FlashVars почему-то теряются(кто видел, какой innerHTML генерит IE для flash-а, тот наверное понимает о чём я..

Пришлось топорным методом сохранять flashvars из param заменять его в outerHTML перед записью.

Итого:

function initFlashObj() {
    var objs = document.getElementsByTagName('object');
    if (objs && objs.length) {
        for (var i = 0; i < objs.length; i++) {
           if (objs[i].getAttribute('classid') == 'clsid:d27cdb6e-ae6d-11cf-96b8-444553540000') {
               var params =  objs[i].getElementsByTagName('PARAM');
               for (var j = 0; j < params.length; j++) {
                   if (params[j].getAttribute('name') == 'flashvars') {
                       var FlashVars = params[j].getAttribute('value');
                       break;
                   }
               }
               var obj = objs[i].outerHTML + "\n";
               obj = obj.replace(/FLASHVARS" VALUE=""/i,'FLASHVARS" value="'+FlashVars+'"');
               objs[i].outerHTML = obj;
           }
        }
       objs = null;
   }
}

Остаётся добавить эту функцию на window.onload и всё…
Особо пытливые могут попытаться оптимизировать геморой с replace и тогда всем будет всемирное счастье..

P.S.
Пишу это второй раз – какие-то неполадки(сам заметил, что с кодировкой что-то не то) на wordpress-е – видимо они восстановились из бэкапа…

UPDATE:

А вот ещё один дядя сделал тоже самое (не учтя “проблему” с flashvars) и судя по дате додумался в тот же день, что и я ;o)

Часть II

Часть III  (Издание 2-ое – дополненное и исправленное)

Technorati Tags: flash, ie, activeX, js

Обнаружилось досадное недоразумение – onreadystate вызывалось чаще чем задумано – readyState изменялся примерно следующим образом: 1,1,2,3,4,4.

соответственно обработчик(ну который на readyState == 4) вызывался два раза. Погрешил на новый FireFox (в 1.0.7 такого не наблюдается) и добавил проверку на тот случай если обработчик уже вызывался.

А причиной такого недоразумания оказался GM-скрипт XMLHTTPDebugging, назначение которого думаю понятно из названия, а принцип действия прост как 3 копейки – подменяется оригинальный объект window.XMLHttpRequest на свой, с перегруженными свойствами.

Теперь интересно – а лишней ли была та проверка, которую я добавил? (или по-другому: какова вероятность того, что у пользователей получившегося сайта будет установлен подобный софт ? )

Technorati Tags: XMLHttpRequest, firefox, GreaseMonkey

Захотелось вот узнать как там поживает Selenium (не вышла ли новая версия?) и оказалось, что сайт проекта переехал на другой домен – OpenQA.org и ещё оказалось, что эта самая “контора” (которая OpenQA) активно работает на создаением IDE на основе Selenium. Они конечно же не выпустили
пока ни одной паблик-версии, но зато сделали(перестали делать и занялись разработкой IDE) extension для FF – Selenium Recorder. C помощью него можно писать сценарии для selenium(самая муторная часть тестирования ) просто “кликаясь” по интерфейсу Вашего приложения, можно эти сценарии выполнять не отходя от кассы(selenium “вшит” прямо в xpi), можно сценарии сохранять в файл(удобно в случаях, когда надо подправить “напильником” сценарий[например добавить setUp и tearDown], или когда тесты выполняют кучей группой).
В общем рекомендую тем, кто пользуется selenium-ом этот extension, а тем кто ещё не пользовался им(селениумом) – “попользоваться” и потом “познать удобство”, которое даёт плагин.

P.S.
для тех кто не в курсе – Selenium это JS Framework, созданный специально для функционального тестирования web-приложений. И в отличии от SimpleTest с его WebTester-ом, тесты выполняются в контексте браузера(где соответственно работают[или не работают] javascript-ы, flash-ки и т.д.). Для тестирования приложений использующих XmlHttpRequest это незаменимый очень удобный инструмент обнаружения неполадок в сложных интерфейсах.

“Я другой,такой ‘тулзы’ не знаю…”

Technorati Tags: selenium, web, dev, js, firefox, extensions

На страницах сайтов частенько почти всегда приходиться ставить счётчики различных бесплатных (и платных тоже) online-статистик, а так же нередко нужно поставить onload-handler на window (выпадающее меню, или нечто подобное требующее инициализации после полной загрузки страницы)… Ну приходиться и приходиться, проблема-то в чём? А проблема в том, что картинки(в данном случае изображения счётчиков) могут грузиться неимоверно долго(иногда, если сервер хотлога (например хотлога – намеренно никого не обижаем ;o) ) не доступен(занят) это занимает порядка 60-секунд(или сколько там таймаут в браузере ?!?), соответственно пока не произойдёт таймаут (не загрузиться изображение) window.onload не сработает…. Дошли руки наконец искоренить (хотя бы частично) эту “проблему”… – грузить счётчик после полной загрузки страницы

(да часть хитов возможно не попадут в статистику, но есть мнение, что пользователи [сужу по себе] и так не дожидаются полной загрузки “тормозных” страниц – либо уходят, потому что страница не интересна[раздражает тормознутостью],либо жмут Stop[продвинутые Esc] и продолжают работать )

Так что теряем (если теряем) теоритически по минимому. Итак : Вместо счётчика делаем картинку (я сделал прозрачный однопиксельный gif) размером точно под счётчик (для того чтобы после загрузки счётчика не “расползалась вёрстка”) (как правило 88×31) и даём ей id=”counter_id” (для того чтобы позже найти её):

в js-скрипт пишем функцию:

function doLoadCounter() {
   var url="http://free-online-statistics.example.com/counter.script";
   var query_string = "";
   // тут долго-долго собираем query_string (как правило нужно просто скопировать код счётчика и выбрать нужные параметры и убрать document.write(code) )
   // var s=screen;
   // var px=(ie==1)?s.colorDepth:s.pixelDepth;
   // query_string += px;
   var counterImg = new Image();
   counterImg.src = url + query_string;
   counterImg.onload = function() {
      var placeHolder = document.getElementById('counter_id');
      if (placeHolder) {
         placeHolder.src = this.src;
      }
   }
}

Далее рисуем что-то типа:

addOnLoadEvent(doLoadCounter);

эта функция была “сочинена” по мотивам БазыЗнанийXpoint её смысл – “навесить” обработчик load на window (или document – зависит от браузера) удобна как раз в том случае если их(обработчиков) надо иметь более одного (о чём я толкую уже 39-ю строчку)

function addOnLoadEvent() { 
  var root = window.addEventListener || window.attachEvent ? window : document.addEventListener ? document : null;
  if (root) { 
     for (var i = 0; i < arguments.length; i++) { 
        if ('function' == typeof(arguments[i])) addHandler(root,'load',arguments[i]);
     }
  }
}

Определение addHandler взято по ссылке выше...

function addHandler(object, event, handler) {
   if (typeof (object.addEventListener) != 'undefined')
       object.addEventListener(event, handler, false);
   else if (typeof (object.attachEvent) != 'undefined')
      object.attachEvent('on' + event, handler);
   else {
      var handlersProp = '_handlerStack_' + event;
      var eventProp = 'on' + event;
      if (typeof (object[handlersProp]) == 'undefined') {
         object[handlersProp] = [];
         if (typeof (object[eventProp]) != 'undefined')
            object[handlersProp].push(object[eventProp]);
         object[eventProp] = function(e) {
            var ret = true;
            for (var i = 0; ret != false && i < object[handlersProp].length; i++)
               ret = object[handlersProp][i](e);
            return ret;
         }
       }
       object[handlersProp].push(handler);
    }
}

В итоге имеем:

1. Загружается страница, css, js, сопутствующие картинки с сайта
2. Выполняется js.
3. Срабатывает onload event
4. Страница "готова к употреблению" - всякие менюшки и прочие "прибамбасы" уже работают
5. Загружается счётчик

P.S.
Наслышан о том что есть системы "запрещающие" редактировать код своих счётчиков…
хммм... не знаю как они проверяют "это дело" - по идее "запрос картинки" прозрачен для сервера (не важно как этот запрос сформирован), возможно выборочно-ручные "проверки на вшивость"... но думаю даже в таких "тяжёлых" случаях всегда можно найти выход - отказаться от этого счётчика или объяснить причину "переделок" владельцам системы…