• Log InLog In
  • Register
Liquid`
Team Liquid Liquipedia
EDT 18:50
CEST 00:50
KST 07:50
  • Home
  • Forum
  • Calendar
  • Streams
  • Liquipedia
  • Features
  • Store
  • EPT
  • TL+
  • StarCraft 2
  • Brood War
  • Smash
  • Heroes
  • Counter-Strike
  • Overwatch
  • Liquibet
  • Fantasy StarCraft
  • TLPD
  • StarCraft 2
  • Brood War
  • Blogs
Forum Sidebar
Events/Features
News
Featured News
[ASL20] Ro24 Preview Pt2: Take-Off6[ASL20] Ro24 Preview Pt1: Runway132v2 & SC: Evo Complete: Weekend Double Feature4Team Liquid Map Contest #21 - Presented by Monster Energy9uThermal's 2v2 Tour: $15,000 Main Event18
Community News
Weekly Cups (Aug 18-24): herO dethrones MaxPax5Maestros of The Game—$20k event w/ live finals in Paris30Weekly Cups (Aug 11-17): MaxPax triples again!13Weekly Cups (Aug 4-10): MaxPax wins a triple6SC2's Safe House 2 - October 18 & 195
StarCraft 2
General
Weekly Cups (Aug 18-24): herO dethrones MaxPax What mix of new and old maps do you want in the next 1v1 ladder pool? (SC2) : A Eulogy for the Six Pool Geoff 'iNcontroL' Robinson has passed away 2v2 & SC: Evo Complete: Weekend Double Feature
Tourneys
WardiTV Mondays Maestros of The Game—$20k event w/ live finals in Paris RSL: Revival, a new crowdfunded tournament series Sparkling Tuna Cup - Weekly Open Tournament Monday Nights Weeklies
Strategy
Custom Maps
External Content
Mutation # 488 What Goes Around Mutation # 487 Think Fast Mutation # 486 Watch the Skies Mutation # 485 Death from Below
Brood War
General
No Rain in ASL20? BW General Discussion Flash On His 2010 "God" Form, Mind Games, vs JD BGH Auto Balance -> http://bghmmr.eu/ [ASL20] Ro24 Preview Pt2: Take-Off
Tourneys
[ASL20] Ro24 Group E [Megathread] Daily Proleagues [ASL20] Ro24 Group D [ASL20] Ro24 Group B
Strategy
Simple Questions, Simple Answers Fighting Spirit mining rates [G] Mineral Boosting Muta micro map competition
Other Games
General Games
Stormgate/Frost Giant Megathread Nintendo Switch Thread General RTS Discussion Thread Dawn of War IV Path of Exile
Dota 2
Official 'what is Dota anymore' discussion
League of Legends
Heroes of the Storm
Simple Questions, Simple Answers Heroes of the Storm 2.0
Hearthstone
Heroes of StarCraft mini-set
TL Mafia
TL Mafia Community Thread Vanilla Mini Mafia
Community
General
US Politics Mega-thread Things Aren’t Peaceful in Palestine Russo-Ukrainian War Thread The year 2050 European Politico-economics QA Mega-thread
Fan Clubs
INnoVation Fan Club SKT1 Classic Fan Club!
Media & Entertainment
Anime Discussion Thread Movie Discussion! [Manga] One Piece [\m/] Heavy Metal Thread
Sports
2024 - 2026 Football Thread TeamLiquid Health and Fitness Initiative For 2023 Formula 1 Discussion
World Cup 2022
Tech Support
High temperatures on bridge(s) Gtx660 graphics card replacement Installation of Windows 10 suck at "just a moment"
TL Community
The Automated Ban List TeamLiquid Team Shirt On Sale
Blogs
Evil Gacha Games and the…
ffswowsucks
Breaking the Meta: Non-Stand…
TrAiDoS
INDEPENDIENTE LA CTM
XenOsky
[Girl blog} My fema…
artosisisthebest
Sharpening the Filtration…
frozenclaw
ASL S20 English Commentary…
namkraft
Customize Sidebar...

Website Feedback

Closed Threads



Active: 4776 users

HTML5 hackers wanted

Blogs > mmp
Post a Reply
mmp
Profile Blog Joined April 2009
United States2130 Posts
November 22 2011 05:14 GMT
#1
I made a post in the Big Programming Thread but I'll post here too:

On November 22 2011 14:09 mmp wrote:
Are there any Javascript/Canvas/HTML5 hackers out there? I've been working on a framework for Canvas 2D Context for a while now and things are starting to come together (it's about 95% tested and 90% documented but there are some known holes, so be gentle).

The project is hosted at: http://gitorious.org/meta2d/core/trees/master/

If your browser is awesome (tested in FF7, Chrome14 -- Opera won't work right now, I assume IE will fail) you can try a demo of HTMLMouseEvent triggers here: http://mikemp.mit.edu/meta2d/demo/mouse.html

Unlike some other frameworks out there, this one is aimed at scalability of interactive applications without obfuscating the Context2D API. So you can port your existing canvas code over easily and use the extras that this framework provides to improve performance as needed.

It's a powerful utility if you want to write an HTML5 game, among other applications.

I'd appreciate some feedback & if you're interested in getting involved or have any questions feel free to pm me.


*
I (λ (foo) (and (<3 foo) ( T_T foo) (RAGE foo) )) Starcraft
Gummy
Profile Blog Joined October 2010
United States2180 Posts
Last Edited: 2011-11-22 05:22:49
November 22 2011 05:22 GMT
#2
This is pretty cool. I don't know how the browser handles the rendering/event detection of elements vs. drawn canvas shapes. iirc, you have to create the bounding boxes yourself, and do an expensive user-code loop of the mouse's current location against all the drawn shapes. Is your project relevant to this issue?
¯\_(ツ)_/¯ There are three kinds of people in the world: those who can count and those who can't.
mmp
Profile Blog Joined April 2009
United States2130 Posts
Last Edited: 2011-11-22 07:04:55
November 22 2011 05:29 GMT
#3
On November 22 2011 14:22 Gummy wrote:
This is pretty cool. I don't know how the browser handles the rendering/event detection of elements vs. drawn canvas shapes. iirc, you have to create the bounding boxes yourself, and do an expensive user-code loop of the mouse's current location against all the drawn shapes. Is your project relevant to this issue?

Yes, the project addresses this performance issue (among others).

When you define an entity's repaint behavior, you can draw on a canvas with a normal-looking Context2D, apply whatever transformations you want, and then pass that same Context over to the mouse collision detector for, say, alpha-masking.

It does mouse collisions in O(logN) expected runtime for N entities. I can run that demo with 1000 shapes on my netbook before getting significant lag.
I (λ (foo) (and (<3 foo) ( T_T foo) (RAGE foo) )) Starcraft
Hidden_MotiveS
Profile Blog Joined February 2010
Canada2562 Posts
November 22 2011 17:23 GMT
#4
So does the mouseevent trigger use any html5?
mmp
Profile Blog Joined April 2009
United States2130 Posts
November 23 2011 06:41 GMT
#5
On November 23 2011 02:23 Hidden_MotiveS wrote:
So does the mouseevent trigger use any html5?

The canvas is the HTML5. Normal HTMLMouseEvents are propagated through entities inside the canvas as though they were elements -- just set onevent to your function(Event) callback.
I (λ (foo) (and (<3 foo) ( T_T foo) (RAGE foo) )) Starcraft
Enderbantoo
Profile Blog Joined December 2009
United States465 Posts
November 23 2011 08:33 GMT
#6
hey that's exactly what i'm doing. Im writing a canvas workflow program: http://www.enderbantoo.github.com/LONI-1

and i experienced all of what gummy was talking about, expensive bounding functions client side
At the biggest upset of all of bw, Shanghai SPL finals 2011
Enderbantoo
Profile Blog Joined December 2009
United States465 Posts
November 23 2011 08:36 GMT
#7
On November 23 2011 02:23 Hidden_MotiveS wrote:
So does the mouseevent trigger use any html5?



much more simple

canvas.onmousedown = function(e);

handle eah different clicks as e.button
At the biggest upset of all of bw, Shanghai SPL finals 2011
Hidden_MotiveS
Profile Blog Joined February 2010
Canada2562 Posts
November 24 2011 02:42 GMT
#8
On November 23 2011 15:41 mmp wrote:
Show nested quote +
On November 23 2011 02:23 Hidden_MotiveS wrote:
So does the mouseevent trigger use any html5?

The canvas is the HTML5. Normal HTMLMouseEvents are propagated through entities inside the canvas as though they were elements -- just set onevent to your function(Event) callback.

Ah I see now. Thanks.
Please log in or register to reply.
Live Events Refresh
Next event in 1h 10m
[ Submit Event ]
Live Streams
Refresh
StarCraft 2
UpATreeSC 109
ProTech91
NeuroSwarm 82
CosmosSc2 61
StarCraft: Brood War
Artosis 665
NaDa 50
Dota 2
capcasts275
Counter-Strike
Stewie2K505
flusha289
Super Smash Bros
AZ_Axe78
PPMD50
Other Games
summit1g6149
Grubby2271
shahzam847
ViBE209
Pyrionflax153
C9.Mang080
Maynarde72
JuggernautJason58
ZombieGrub44
ToD3
Organizations
Other Games
BasetradeTV15
StarCraft 2
Blizzard YouTube
StarCraft: Brood War
BSLTrovo
sctven
[ Show 18 non-featured ]
StarCraft 2
• musti20045 43
• RyuSc2 28
• davetesta18
• IndyKCrew
• Migwel
• sooper7s
• AfreecaTV YouTube
• intothetv
• Kozan
• LaughNgamezSOOP
StarCraft: Brood War
• iopq 2
• STPLYoutube
• ZZZeroYoutube
• BSLYoutube
Dota 2
• masondota22622
League of Legends
• TFBlade654
Counter-Strike
• imaqtpie1034
• Shiphtur203
Upcoming Events
PiGosaur Monday
1h 10m
Afreeca Starleague
11h 10m
hero vs Alone
Royal vs Barracks
Replay Cast
1d 1h
The PondCast
1d 11h
WardiTV Summer Champion…
1d 12h
Replay Cast
2 days
LiuLi Cup
2 days
MaxPax vs TriGGeR
ByuN vs herO
Cure vs Rogue
Classic vs HeRoMaRinE
Cosmonarchy
2 days
OyAji vs Sziky
Sziky vs WolFix
WolFix vs OyAji
BSL Team Wars
2 days
Team Hawk vs Team Dewalt
BSL Team Wars
2 days
Team Hawk vs Team Bonyth
[ Show More ]
SC Evo League
3 days
TaeJa vs Cure
Rogue vs threepoint
ByuN vs Creator
MaNa vs Classic
Maestros of the Game
3 days
ShoWTimE vs Cham
GuMiho vs Ryung
Zoun vs Spirit
Rogue vs MaNa
[BSL 2025] Weekly
3 days
SC Evo League
4 days
Maestros of the Game
4 days
SHIN vs Creator
Astrea vs Lambo
Bunny vs SKillous
HeRoMaRinE vs TriGGeR
BSL Team Wars
4 days
Team Bonyth vs Team Sziky
BSL Team Wars
4 days
Team Dewalt vs Team Sziky
Monday Night Weeklies
5 days
Replay Cast
6 days
Sparkling Tuna Cup
6 days
Liquipedia Results

Completed

CSLAN 3
uThermal 2v2 Main Event
HCC Europe

Ongoing

Copa Latinoamericana 4
BSL 20 Team Wars
KCM Race Survival 2025 Season 3
BSL 21 Qualifiers
ASL Season 20
CSL Season 18: Qualifier 1
Acropolis #4 - TS1
SEL Season 2 Championship
WardiTV Summer 2025
Esports World Cup 2025
BLAST Bounty Fall 2025
BLAST Bounty Fall Qual
IEM Cologne 2025
FISSURE Playground #1
BLAST.tv Austin Major 2025

Upcoming

CSL Season 18: Qualifier 2
CSL 2025 AUTUMN (S18)
LASL Season 20
BSL Season 21
BSL 21 Team A
Chzzk MurlocKing SC1 vs SC2 Cup #2
RSL Revival: Season 2
Maestros of the Game
EC S1
Sisters' Call Cup
IEM Chengdu 2025
PGL Masters Bucharest 2025
Thunderpick World Champ.
MESA Nomadic Masters Fall
CS Asia Championships 2025
Roobet Cup 2025
ESL Pro League S22
StarSeries Fall 2025
FISSURE Playground #2
BLAST Open Fall 2025
BLAST Open Fall Qual
TLPD

1. ByuN
2. TY
3. Dark
4. Solar
5. Stats
6. Nerchio
7. sOs
8. soO
9. INnoVation
10. Elazer
1. Rain
2. Flash
3. EffOrt
4. Last
5. Bisu
6. Soulkey
7. Mini
8. Sharp
Sidebar Settings...

Advertising | Privacy Policy | Terms Of Use | Contact Us

Original banner artwork: Jim Warren
The contents of this webpage are copyright © 2025 TLnet. All Rights Reserved.