Создание фреймворка для Canvas: объекты и мышь

[@Anatoly_Piskunov]

Можно узнать в каких браузерах все работает?
Я любитель Оперы, демка не работает. Даже при наведении на фигуры — цвет не меняют.
Спасибо.

[@Kindman]

В 8ie тоже не работает (даже не отображает сами фигуры)

[@Seldon]

ie до 9 версии не поддерживает canvas вообще. Вам или надо скачать плагин для ie но это все равно, что хром установить ибо все будет на вебките рендериться
либо реализовывать сходный функционал параллельно на VML

[@TheShock]

Простите, в устаревших браузерах — не работает.

[@northicewind]

Для совместимости с Opera нужно использовать не e.layerX, а e.offsetX. Так как первый возвращает undefined

[@TheShock]

Вы правы, спасибо.

[@TheShock]

Пофиксил. Работает во всех современных браузерах.

[@Seldon]

Автору спасибо за труд, но думаю стать скорее смутить начинающих. Как вы и заметили в заключении, тут ещё много тонкостей, а небольшое api для отрисовки фигур ничего как таковое не даст. Нужно во первых понимать как работает канва, чтобы грамотно оптимизировать отрисовку, кешировать результаты, сделать чтобы отрисовывались меняющиеся части а не весь холст и тд.
Так что тут для написание постов непочатый край )).

[@TheShock]

Я думаю, что даже если новички не осилят реализацию и детали, то, как минимум, осилят идею, а это — достаточно важно. Желательно понимать, как оно работает.

[@vooD]

Мне одному уже сразу ясно, кто автор статьи если речь идет о HTML5?

[@TheShock]

Нууу… Я иногда вижу статьи о HTML5 другого авторства…
Я Вам надоел? =)

[@vooD]

Нет, как раз-таки наоборот.

[@spmbt]

> использование map + area
— и ещё area медленее работает, чем вычисление расположения мыши в JS (проверено однажды в проекте с пробками на карте). Поэтому приложения, критичные ко времени, лучше сразу писать в подобной оболочке.

[@TheShock]

Я думаю, у него есть одно классное преимущество. В Андроиде при клике на элемент будет активироваться не всё поле, а только элемент. Но спасибо за комментарий. Я не тестил, но ожидал, что map+area будет быстрее.

[@rwz]

Я понимаю, конечно, что это только примитивный пример, но сходу возник вопрос.

Зачем в Mouse массив elements?

Получается, что каждый новый элемент приходится добавлять в this.elements объекта CF и делать this.mouse.add, чтобы он добавился в this.elements объекта mouse.

Не проще ли из Mouse дергать this.canvas.elements, сделав предварительно в инитиалайзере this.canvas = canvas?

[@TheShock]

Ну это как бы разделение по ответственностям. В угоду ООП, скажем. Mouse ничего не знает про того, кто её вызвал.

В LibCanvas это разные массивы. Потому что не все объекты, которые отрисовываются слушают мышь и не все объекты, которые слушают мышь — отрисовываются.