• Log InLog In
  • Register
Liquid`
Team Liquid Liquipedia
EDT 03:44
CEST 09:44
KST 16:44
  • 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
BGE Stara Zagora 2025: Info & Preview27Code S RO12 Preview: GuMiho, Bunny, SHIN, ByuN3The Memories We Share - Facing the Final(?) GSL46Code S RO12 Preview: Cure, Zoun, Solar, Creator4[ASL19] Finals Preview: Daunting Task30
Community News
[BSL20] ProLeague: Bracket Stage & Dates8GSL Ro4 and Finals moved to Sunday June 15th12Weekly Cups (May 27-June 1): ByuN goes back-to-back0EWC 2025 Regional Qualifier Results26Code S RO12 Results + RO8 Groups (2025 Season 2)3
StarCraft 2
General
BGE Stara Zagora 2025: Info & Preview The SCII GOAT: A statistical Evaluation Magnus Carlsen and Fabi review Clem's chess game. Jim claims he and Firefly were involved in match-fixing GSL Ro4 and Finals moved to Sunday June 15th
Tourneys
Bellum Gens Elite: Stara Zagora 2025 Master Swan Open (Global Bronze-Master 2) $5,100+ SEL Season 2 Championship (SC: Evo) SOOPer7s Showmatches 2025 Cheeseadelphia 2025 - Open Bracket LAN!
Strategy
[G] Darkgrid Layout Simple Questions Simple Answers [G] PvT Cheese: 13 Gate Proxy Robo
Custom Maps
[UMS] Zillion Zerglings
External Content
Mutation # 476 Charnel House Mutation # 475 Hard Target Mutation # 474 Futile Resistance Mutation # 473 Cold is the Void
Brood War
General
Will foreigners ever be able to challenge Koreans? [BSL20] ProLeague: Bracket Stage & Dates BGH auto balance -> http://bghmmr.eu/ BW General Discussion I made an ASL quiz
Tourneys
[ASL19] Grand Finals [Megathread] Daily Proleagues [BSL20] ProLeague Bracket Stage - Day 2 [BSL20] ProLeague Bracket Stage - Day 1
Strategy
I am doing this better than progamers do. [G] How to get started on ladder as a new Z player
Other Games
General Games
Stormgate/Frost Giant Megathread What do you want from future RTS games? Path of Exile Nintendo Switch Thread Mechabellum
Dota 2
Official 'what is Dota anymore' discussion
League of Legends
LiquidLegends to reintegrate into TL.net
Heroes of the Storm
Heroes of the Storm 2.0 Simple Questions, Simple Answers
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 Vape Nation Thread European Politico-economics QA Mega-thread
Fan Clubs
Maru Fan Club Serral Fan Club
Media & Entertainment
Korean Music Discussion [Manga] One Piece
Sports
2024 - 2025 Football Thread Formula 1 Discussion NHL Playoffs 2024
World Cup 2022
Tech Support
Computer Build, Upgrade & Buying Resource Thread Cleaning My Mechanical Keyboard
TL Community
The Automated Ban List
Blogs
Cognitive styles x game perf…
TrAiDoS
StarCraft improvement
iopq
Heero Yuy & the Tax…
KrillinFromwales
I was completely wrong ab…
jameswatts
Need Your Help/Advice
Glider
Trip to the Zoo
micronesia
Poker
Nebuchad
Customize Sidebar...

Website Feedback

Closed Threads



Active: 25691 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 16m
[ Submit Event ]
Live Streams
Refresh
StarCraft 2
EnDerr 44
StarCraft: Brood War
Mong 394
TY 331
Killer 307
soO 70
ggaemo 58
PianO 58
Leta 55
Mind 44
Bale 3
Dota 2
XcaliburYe170
League of Legends
JimRising 711
Counter-Strike
Stewie2K2416
Heroes of the Storm
Khaldor222
Other Games
summit1g6255
shahzam973
WinterStarcraft550
SC2_NightMare2
Organizations
StarCraft: Brood War
UltimateBattle 30
StarCraft 2
Blizzard YouTube
StarCraft: Brood War
BSLTrovo
sctven
[ Show 12 non-featured ]
StarCraft 2
• AfreecaTV YouTube
• intothetv
• Kozan
• IndyKCrew
• LaughNgamezSOOP
• Migwel
• sooper7s
StarCraft: Brood War
• BSLYoutube
• STPLYoutube
• ZZZeroYoutube
Dota 2
• lizZardDota2178
League of Legends
• Stunt490
Upcoming Events
SOOP
1h 16m
Classic vs GuMiho
Sparkling Tuna Cup
2h 16m
AllThingsProtoss
3h 16m
Fire Grow Cup
7h 16m
BSL: ProLeague
10h 16m
HBO vs Doodle
spx vs Tech
DragOn vs Hawk
Dewalt vs TerrOr
Replay Cast
16h 16m
Replay Cast
1d 16h
Replay Cast
2 days
WardiTV Invitational
2 days
WardiTV Invitational
2 days
[ Show More ]
GSL Code S
3 days
Rogue vs GuMiho
Maru vs Solar
Replay Cast
3 days
GSL Code S
4 days
herO vs TBD
Classic vs TBD
The PondCast
4 days
Replay Cast
4 days
GSL Code S
5 days
WardiTV Invitational
5 days
Korean StarCraft League
5 days
CranKy Ducklings
6 days
WardiTV Invitational
6 days
Cheesadelphia
6 days
Cheesadelphia
6 days
Liquipedia Results

Completed

CSL Season 17: Qualifier 1
BGE Stara Zagora 2025
Heroes 10 EU

Ongoing

JPL Season 2
BSL 2v2 Season 3
BSL Season 20
KCM Race Survival 2025 Season 2
NPSL S3
Rose Open S1
CSL Season 17: Qualifier 2
2025 GSL S2
BLAST.tv Austin Major 2025
ESL Impact League Season 7
IEM Dallas 2025
PGL Astana 2025
Asian Champions League '25
ECL Season 49: Europe
BLAST Rivals Spring 2025
MESA Nomadic Masters
CCT Season 2 Global Finals
IEM Melbourne 2025
YaLLa Compass Qatar 2025
PGL Bucharest 2025
BLAST Open Spring 2025

Upcoming

CSL 17: 2025 SUMMER
Copa Latinoamericana 4
CSLPRO Last Chance 2025
CSLPRO Chat StarLAN 3
K-Championship
SEL Season 2 Championship
Esports World Cup 2025
HSC XXVII
Championship of Russia 2025
Murky Cup #2
Esports World Cup 2025
BLAST Bounty Fall 2025
BLAST Bounty Fall Qual
IEM Cologne 2025
FISSURE Playground #1
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.