Developer Journal
to do
- Check out https://i.nintendo.net/ to see if there's anything interesting (there are Twitter & Facebook login buttons)
- link to mpo file
- iframe set to mpo file
- Find a clean way to have A or B switch between their default and the done sound
- Check out what audio types the 3DS plays in their player
- Link to a 3D photo, can we go back into the web browser?
- Throw some other random data uri's at the browser via regular links
- 0x0px body?
- Large body to trap scrolling?
- All element test page (one at a time, automated)
- Create surii.net Nintendo Zone access point
- notify sound
- loading sound
- communication error sound
2013-09-08
If a page can't be downloaded, there's a communication error messange and yet another sound. Again, I need to test a broken/invalid data URI (text/html), also test in an iframe.
2013-08-31
I heard a new sound from the 3DS today, it happened when I transferred from a secure site (https) to a non-secure site. I wonder what happens if I do that inside an iframe? I did got a popup though, which is an annoying side effect.
I also noticed that if you start a download via ajax and it takes a while, you keep hearing the loading sound (though, it sounds lower than when loading a full page) and the indicator keeps going at the top.
2013-07-19
jQuery 2
I'm going to do a quick jQuery 2 test. jQuery 2 does not work but 1.10.2 does so I'm going with that.
box-sizing
To make sure things fit into the surii divs, I'm enabling box-sizing: border-box. I need the webkit prefix though. Non-prefixed version doesn't seem to work.
2013-07-16
Nekos in Wonderland, a game by the guy who did Okiwi will be added to the external section. Which I guess I'm keeping now. http://socialneko.com/wonderland/game.php.
Twitter turned off their REST API 1.0 and now I need to setup some proxy for Tiny Cartridge app to work. Ugh!
2013-06-09
Wow, it's been a while.
The Mind's Eye on Nintendo Video has a link to vote. That link opens the web browser to http://watchmindseye.com/3ds. The page pulls the document back when you pan, it's probably just formatted to do that. I doubt it's JavaScript but I'll check it out. They are using JavaScript.
if (navigator.platform.toLowerCase() == "nintendo 3ds") {
window.ndsScrollTo = function() {
window.scrollTo(40, 220);
};
window.ndsScrollTo();
window.setInterval(window.ndsScrollTo, 50);
} else {
window.ndsScrollTo = function () {}
}
2012-09-07
I finally launched Phantom on surii.net! My first 3DS browser game.
2012-08-15
Finally working on Settings again. I don't get an event when they enter text. I wish I did.
But I do get window.unload when they hit the back button! But not when they refresh the page. Oh well.
2012-08-13
There's a Saved Pages section of Nintendo Zone. I wonder how that works. It's not related to the 3DS browser. Is there a second browser built into Nintendo Zone? I'm going to check it out at Gamestop or McDonald's today. It probably just saves content and isn't active, i.e., no JavaScript.
Yeah, Nintendo Zone does have its own broswer. It seems even more limited. I saved a couple pages. I wonder how it saves them and if they can run JavaScript. The pages can also launch the Internet browser. Sadly, Saved Pages only saves a static image for the page. Links aren't even clickable.
2012-07-25
I had to switch the OK sound to use input type=range because number now brings up the text input.
prompt is pretty cool & will be useful
2012-07-19
Wow, it's been a while. I added a page to display modernizr 2.6 results.
2011-12-16
The new 3DS Hotspots page from Nintendo is: http://www.nintendo.com/mobile/hotspot/. I wonder what else is in that mobile folder.
Here's an example call it uses to find hotspots by address: http://www.nintendo.com/3ds/hotspots/lookup?address=%2001970&distance=10&page=1&size=10
2011-11-10
- checking native dialogs: alert, confirm & prompt
2011-06-26
- We do have animated GIFs, of course
- We do not have fixed position, it acts like absolute position, that's a bummer.
2011-06-25
- Sad that both Start and Select popup the stupid address bar w/o sending an event
2011-06-19
- Putting the input trap in an iframe doesn't help me also trap the analog stick
2011-06-18
- If you absolutely (or fixed) position something above a "tiny" frame, it is hidden
2011-06-17
- No Float32Array support, heh
2011-06-15
- Clicking on a label attached to an input doesn't trigger the software keyboard. That's too bad.
- Triggering click or mousedown on a label attached to an input doesn't do anything
2011-06-14
- Going to try an idea for analog stick trapping tonight, this probably won't work out
- Didn't work out, I wound up playing with the D-Pad though
- The D-Pad will make a new sound if you put focus on an element in the center of a table with other elements around it
- I'm going to coin the D-Pad sound the "move" sound
2011-06-13
- I was mentioned on GBAtemp :D
- EMouseEventLongPressed is an enum in the NetFront code, I wonder if I can find a way to disable their default popup
- I wonder if I can fake a mouse click
- I can fake a wav file download! The act of the download finishing makes a noise, phew!
- I'm now simulating the wav via a fake data URI. In theory it won't even attempt to go to the web server but no way to tell really.
- img tags are shorter and appear to cause the same effect
- I CAN use the mouse cursor events as long as I -webkit-user-select: none the body tag. The popup still appears but this might be useful for "tiny" css classed games
- I'm trying to make other sounds but not getting far
- I tried a bunch of different things (hashchange, iframes) but couldn't get the browser to make the back or forward button sounds
- input type=number makes fun sounds on focus & blur in hardware but not when I trigger them via events in JavaScript
- Wow! I think I just found a much better way to keep the screen focused on the game
- I also have access to the B button now as well as sounds for B & A buttons
- Very successful testing today
- I can't trigger the ok or cancel sounds manually. The done sound is the only one I can play at will so far.
- Single-tap also triggers my B button. I will have to clean up how I test that it is the B button by attempting to ignore all known causes.
2011-06-11
- Fullscreen skinny mode gives me nice access to down, left and right on the D-Pad, nothing moves. Up still moves the screen.
- I tried to trap touch with an iframe and that was a no-go. I doubt img will work too.
- There are no items in navigator.plugins :(
- I actually have to scrollTo(0, 218) on skinny modes
- tiny mode gives full access to the D-Pad
- I only get window.scroll events when the document is vertically larger than the viewable area. I don't get horizontal scroll events :(
- Scratch that, I do get horizontal scroll events if I set the viewport width larger than the device width
- Pushed these tests into github: https://github.com/TrippingTheBits/3ds
- I definitely don't get scroll events if the document isn't greater than the viewport, even though the browser window scrolls via D-Pad up or stylus
- A very wide screen could scroll horizontally though, on purpose. Might be a useful game mechanic.
- viewport height does have an effect on wide mode
- window does not get any analog stick events
- window does get resize+scroll events when zoom it hit
- I can't counter zoom by dropping and re-adding the meta viewport tag
- If you fit the entire level of a game into a window, you can use the analog pad to an advantage, touch to play the game: move here, etc.
- CSS transitions work :D
- Touch pad scroll -> tap behavior feels pretty good
- I can see this page http://en.wikipedia.org/wiki/File:USK12_neu2.svg which I think means that we have SVG support
- Nothing happens when I go to a WAV file. I think I got an "unsupported" message when I went to an mp3 file
- Calling window.resize doesn't appear to help anything
- Seems window screenX and screenY always return 0
- Also seems window scrollX and scrollY don't change when the user moves the window frame in any of the full screen modes :( I would very much like to know how to detect the amount of movement)
- window.moveBy doesn't do anything, not that I actually thought that one would :P
- No box-shadow (not even -webkit)
- Only -webkit-gradient works
- Ajax seems ok
2011-06-10
another developer
A web dev named Andy Smith is trying this as well: http://andysmith.co.uk/blog/2011/06/10/3ds-browser-opens-up-homebrew/
two modes
- I'm going down to two major modes: skinny & t-bone. Either can have default (full) or scroll versions so: skinny, skinnyscroll, tbone and tbonescroll classes
2011-06-08
more tests
- jQuery works so far
- viewport width=320 and 398 appear to work, max-scale doesn't seem to do anything
- window.scrollTo(39, 218) appears to work regardless of wheather i'm in skinny, tbone or fullscreen
- i guess i need viewport width=device-width, initial-scale=?.0 for all screens, no user-scale=no (skinny gets scale=1.0)
- X = zoom in, no keydown event, Y = zoom out, no keydown event :(
- D-Pad moves the screen but does fire events, which is: 37 (left) 38 (up) 39 (right) 40 (down)
- A = Enter (13), no side effects
- B doesn't seem to trigger anything
2011-06-07
initial thoughts
- The browser does not ignore meta viewport!
- The 3DS's title bar (Internet, date, battery) takes up exactly 20px; the browser draws over the 3DS's title bar drop shadow
- The browser's nav bar (at the bottom of bottom screen) takes up exactly 28px; the browser does not draw over the nav bar's top blue line
- overflow=scroll adds pixels for the scroll bars and should not be used for the bottom screen, handle it with mouse events
- It supports initial-scale=2.0 to get a nice initial format, however, the 3DS's drop shadow counts and remove 2px from the top screen
- I can't disable the zoom buttons or scrolling the bottom page to the top
- Nintendo's bookmarks page is http://www.nintendo.com/3ds/internetbrowser/bookmarks/
- They use meta viewport width=320
- alert messages don't look bad, they are a nice modal dialog with Message from page: and an OK button
- My current way to initial load the top screen pushes the top screen one pixel to the right :(, I'll have to compensate by making the usable width 398 instead of 400
- I might have to scrollTo even fullscreen pages, my last test started the top widescreen on the bottom
- I think we have canvas support, that is such good news; I don't know about audio
- I want a third type of frame that has a wide top screen but allows scrolling, the scrolling portion will not be widescreen, this will make a nice headered page