Skip to main content ↑ ↓
Topic: Sphere Web Utilities (Read 172021 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Sphere Web Utilities

Inspired by Radnen's originally failed attempt at loading a windowstyle on the web, I finally started my JS-based Sphere-format file loading for previewing.



Let me know if you want commit access to the repo. Since the demo HTML file uses jQuery's AJAX to get the file it's subject to cross-domain limits, so if you want to run it locally you'll probably need a local webserver. Once done, I'm going to likely do a pull request on casiotone's project once I edit the loading code to his style.

Still tweaking positioning for windowstyle elements in the div since it's dynamic, otherwise successfully loads all 9 basic pieces; will probably convert it to a "hover-over-piece to display" workflow instead. RWS.drawWindow implemented!

RFN loading will be next! RFN loading done, RFN.drawText implemented!

RSS spriteset next! RSS loading done, spriteset animation done!

RTS tileset next! RTS loading done, tileset animation done!

RMP map next! RMP loading kinda done, display is next!

Re: Sphere Web Utilities

Reply #1 –
This is awesome. In fact if we can finish this project I can continue my work on pixi-sphere!!
If you use code to help you code you can use less code to code. Also, I have approximate knowledge of many things.

Sphere-sfml here
Sphere Studio editor here

Re: Sphere Web Utilities

Reply #2 –
Added RFN loading! Now we can also theoretically write a bitmap font writer like this one but for Sphere and on the web like this NES-based one!

Re: Sphere Web Utilities

Reply #3 –
Dude, awesome. The demo is kind of difficult to see, though. (And put the loading messages in console.log rather than alert?)
 

Re: Sphere Web Utilities

Reply #4 –
Changed sandbox area backgrounds to black.

I'll switch it so that it only alerts if the file didn't load.

Re: Sphere Web Utilities

Reply #5 –
I cloned the repo and tried to run it locally. Chrome doesn't like that:

Code: [Select]
Failed to load resource: Origin null is not allowed by Access-Control-Allow-Origin. file:///home/vincent/Dropbox/Sphere/projects-others/web-sphere-utilities/sample/blue.rws
XMLHttpRequest cannot load file:///home/vincent/Dropbox/Sphere/projects-others/web-sphere-utilities/sample/blue.rws. Origin null is not allowed by Access-Control-Allow-Origin. index.html:1
Failed to load resource


After looking around a bit, disabling Access-Control-Allow-Origin isn't a good idea, but perhaps you can set some origin it would accept. Or do I really need to test this on a server with localhost?

Edit: set up nginx, works like a charm. I found that you forgot to put trigger.rfn on Git.
Edit 2: wow, I see the code in your test is still really complicated. Gonna try and make a simple test on a single canvas.

Re: Sphere Web Utilities

Reply #6 –
Hmm, can I have commit access? Or is it possible to just fork without needing permission so you can merge anything I try at your own leisure? Also, your Git repo seems outdated compared to your live demo.

...After a few edits...

I implemented WindowStyle.blit for you. It uses a separate, hidden canvas to draw the cut-off/repeated bits of the windowstyle bitmap on, so I had to modify ncanvas. Also made a test HTML for it.

Re: Sphere Web Utilities

Reply #7 –
I was going to update the repo after going farther with Font. I'll take a look at the windowstyle code you attached and see how much of my code I can update with it, thanks!

Commit access in 3, 2, 1...done!

Re: Sphere Web Utilities

Reply #8 –
Updated windowstyle w/DaVince's fixes, now blits a window!

Updated font to add working drawText, now blits an unbroken line of text!

Re: Sphere Web Utilities

Reply #9 –
Huh, I don't see those changes working on the demo page.
If you use code to help you code you can use less code to code. Also, I have approximate knowledge of many things.

Sphere-sfml here
Sphere Studio editor here

Re: Sphere Web Utilities

Reply #10 –
Hm, seems to work here. Maybe it was still uploading?

Neo, thanks for optimizing it! That's not exactly my strong suit. :P

Re: Sphere Web Utilities

Reply #11 –
Alright, I see it not. Good stuff!
If you use code to help you code you can use less code to code. Also, I have approximate knowledge of many things.

Sphere-sfml here
Sphere Studio editor here

Re: Sphere Web Utilities

Reply #12 –
Should I attempt the mess that is Font.drawTextBox first or should I just go straight to spriteset loading?

Re: Sphere Web Utilities

Reply #13 –
Hmm... Mind if I code the Font.drawTextBox() so you can focus on the spriteset loading? That way the work is split up and development speeds up a bit.

Loading those formats is something I don't know how to do, but writing that drawTextBox() would be kinda fun to do. Just give me some coding directions so I can use the right variable naming and stuff. :)

Re: Sphere Web Utilities

Reply #14 –
Feel free to get started on it! I'll give it a quick pass anyways once done to make sure it's consistent but try to take what style you can already see and apply it. Keep in mind that since Font.drawTextBox depends on a wordWrapString implementation you might want to start with that first; I've implemented a pure JS wordWrapString long ago in my NTML demo (check the NTML wiki page for link) and that should still hold up even in 2013 if you need a starting point.

That means I'll start on spriteset loading :)