Guest
home
beatmaps
rankings
community
store
help
forum
  1. Forums
  2. osu!
  3. Development

osu! uebu (HTML5 osu!)

posted
Total Posts
46
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
Hey guys i've started work on an osu! port to HTML5, some of the features that will be in it upon release will be:
  1. All osu! standard beatmaps from desktop version will be playable
  2. Beatmap videos will play
  3. All skins for osu! will work with osu! uebu
  4. All beatmap-specific skins will work with osu! uebu
  5. asm.js core for speed (should run about only 1/16th slower or less than osu! desktop)
  6. WebGL, your html5 osu! will be GPU accelerated just like osu! desktop.
  7. Local storage of records/replays
  8. Multithreaded with WebWorkers so you can get even better performance.
  9. Other stuff i've yet to decide on.
List of things I will never do:
  1. Support any microsoft browser.
  2. Support IOS Safari.
  3. Add Catch The Beat.
Stuff that I would like to include but probably won't for a long time for various reasons:
  1. Bancho connection (would need peppy's permission)
  2. Tycho mode
  3. osu! mania
  4. Javascript Video Codecs
  5. Beatmap editor
Finally I follow this up with a teaser screenshot of the loading screen:
SPOILER
Last edited by Frowned , edited 1 time in total.
Marcin
osu! Alumni
4,944 posts
Joined March 2011
Marcin
5. Beatmap editor
Why would you need next editor when there is osu! one?

Also do you have any working release, or is it just "what-I'll-maybe-do"?
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

Marcin wrote:

Also do you have any working release, or is it just "what-I'll-maybe-do"?
This is not "what-I'll-maybe-do" it's "what i'm doing right now but isn't finished yet", so no it's not working yet but i'll have a few of the bullet points finished soon.

Edit: the reason why i won't add a beatmap editor for quite a while is because it's already in osu!
Marcin
osu! Alumni
4,944 posts
Joined March 2011
Marcin
Oh sorry, my bad, I overlook the header of this, and missed "but probably won't" part.

Anyway good luck with that, I wish you best to see it in working state ;)
- Marco -
7,360 posts
Joined December 2011
- Marco -
but will it blend work?

or it's laggy as the other?
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

marcostudios wrote:

or it's laggy as the other?
It won't lag, im using WebGL which allows me to use your graphics card, and asm.js which is almost identical in speed to compiled code. Asm.js and WebGL are fast enough to run Unreal Tournament 3 in a web browser, so you shouldn't get any lag, if you can run what i linked to below at all (even with lag) you should have no problems with my port.

Unreal 3 Engine in a web browser (if you aren't running firefox hit "try anyway"):
http://www.unrealengine.com/html5
dkun
osu! Alumni
4,486 posts
Joined August 2009
dkun
What does uebu derive from (if it does from anything)?
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

dkun wrote:

What does uebu derive from (if it does from anything)?
The name "uebu" is just the romanji for the japanese word for the world wide web, when pronounced it sounds like oo-web-oo. Just like how osu is the romanji for "push" (as in pushing a button) in japanese.

Edit: apparently this isn't where the name osu comes from but it is true that osu means push in japanese.
Last edited by Frowned , edited 1 time in total.
Marcin
osu! Alumni
4,944 posts
Joined March 2011
Marcin

Frowned wrote:

The name "uebu" is just the romanji for the japanese word for the world wide web, when pronounced it sounds like oo-web-oo. Just like how osu is the romanji for "push" (as in pushing a button) in japanese.
I thought it was some kind of greeting, originating from ... I don't remember this word :/
- Marco -
7,360 posts
Joined December 2011
- Marco -

Frowned wrote:

im using WebGL
My pc don't support WebGL

Oh well... good luck ^^
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

marcostudios wrote:

My pc don't support WebGL

Oh well... good luck ^^
try firefox, or setting your browser to use software OpenGL renderer.
XPJ38
osu! Alumni
3,570 posts
Joined February 2010
XPJ38
I'll keep an eye on your project, it looks promising :)

Marcin wrote:

Frowned wrote:

The name "uebu" is just the romanji for the japanese word for the world wide web, when pronounced it sounds like oo-web-oo. Just like how osu is the romanji for "push" (as in pushing a button) in japanese.
I thought it was some kind of greeting, originating from ... I don't remember this word :/
Yep, it comes from ohayo gozaimasu!
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
I've gotten what i've already written of the asm.js rendering code to compile in Odinmonkey (Firefox's asm.js Engine)... that only took 4 hours (asm.js is really hard to write correctly).
quantum-rose
quantum-rose
really a great job
ErunamoJAZZ
osu! Alumni
2,726 posts
Joined August 2012
ErunamoJAZZ
I would be very interested in having an editor for firefox. It would be cool to edit maps way to college on a tablet... or something.
As a Linux user, an editor is a good idea, as there is no native client here.

Your project is very interesting, and I think it has a better approach than the others that are out there.

Good Luck!! :D
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
Struggling with the javascript libraries for unzipping beatmaps and Skins, It would be nice if there was a simple up to date library for it, i'm having to write my own zip parser and use the zpipe DEFLATE implementation.

Edit: I found a library but it's a little big, I may actually compress the compressing code and use the decompressing code to decompress the compressing code :P
- Marco -
7,360 posts
Joined December 2011
- Marco -

Frowned wrote:

marcostudios wrote:

My pc don't support WebGL

Oh well... good luck ^^
try firefox, or setting your browser to use software OpenGL renderer.
How to do this with chrome?
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

marcostudios wrote:

How to do this with chrome?
first are you running XP?
if so that's why.

if that's not the case then try adding this to the end of the chrome shortcut:
--ignore-gpu-blacklist

Edit: just got skin/replay/beatmap decompression working, now i need to do Filesystem IO and skin/replay/beatmap parsing and the majority of the display code as well as game logic.
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
I've gotten beatmap decompression done, and skin loading is mostly finished...
- Marco -
7,360 posts
Joined December 2011
- Marco -

Frowned wrote:

first are you running XP?
if so that's why.
oh so it doesn't work on XP? :(

oh well time to buy a new PC ^^
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

marcostudios wrote:

oh so it doesn't work on XP? :(

oh well time to buy a new PC ^^
just update to windows 7
Kuudere
5 posts
Joined September 2012
Kuudere
Do you have any plans to port this to a windows store app?

After 8.1 all the technologies you're using can work on the in store apps.
olszam
20 posts
Joined February 2012
olszam
A good motive to do it in HTML5. For Linux users this is already a plus just to the acceleratedi gpu did not lagg. I also wanted to do a project in HTML5, but as for now, the lack of time and motivation :(

sry for my english ;3
Chokladboll
190 posts
Joined November 2012
Chokladboll
I really approve of this idea, even though it lacks some features
Chamosiala
12 posts
Joined March 2012
Chamosiala
...but why
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
File-system storage is almost complete, i just need to debug an issue with the storage API that wraps the JavaScript Filesystem API reporting it's being given more space than it actually is, and add the ability to open files for reading instead of write-only. After this the five remaining things are beatmap parsing, score calculation, input/replays and rendering/webgl shaders.

For those of you who are interested, osu! uebu now consists of:
11 javascript files, 1 html file (the page it runs on), 1 css file (styling for that page) and 1 osk file(containing the default osu! skin*), each javascript file has a length of between 140 to 350 lines of code.


*i have permission from peppy to use osu! graphical assets, and the name osu! in osu! uebu.
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

Frowned wrote:

List of things I will never do:
  1. Support any microsoft browser.
  2. Support IOS Safari.
  3. Add Catch The Beat.

UselessFlaw wrote:

Do you have any plans to port this to a windows store app?

After 8.1 all the technologies you're using can work on the in store apps.
see item 1 on the list

As a side note: asm.js won't be much faster than normal js if you aren't using a browser that has an asm.js compiler built in (i.e. Firefox 24 or later (no other browsers currently have an asm.js compiler)).

Edit: sorry for the double post.
Chokladboll
190 posts
Joined November 2012
Chokladboll
What's the progress so far?
logon13
3 posts
Joined August 2013
logon13
I'm really looking foward to this. Good luck
ymn_old
1 post
Joined January 2014
ymn_old
This sounds exciting. Best of luck! Let me know if you need a hand.
flannel
1 post
Joined December 2012
flannel
Sounds like quite a big leap for osu!
Any news on progression?
Yukiteru Amano
409 posts
Joined September 2012
Yukiteru Amano
CTB modcist!
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
This project is kind of on the backburner for me right now i'll be working on it soon though... i've been busy with other projects
LoupDuQc
17 posts
Joined May 2014
LoupDuQc

Frowned wrote:

This project is kind of on the backburner for me right now i'll be working on it soon though... i've been busy with other projects
Would it be possible to have access to what you've done so far? I'm quite intrested about how you're doing it as I have yet to learn how to do graphic stuff with javascript/html5.
Rirakusu
218 posts
Joined November 2013
Rirakusu
Actually I'm still wondering how you managed to extract osz files using JavaScript? I know it's possible with PHP but JS?

And I'm still figuring out how slider-drawing in canvas works TT
DarkStoorM
451 posts
Joined October 2009
DarkStoorM

jinhang_ang wrote:

Actually I'm still wondering how you managed to extract osz files using JavaScript?
I think this will be your answer: zip.js
You can also check this thread on stackoverflow.
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
I didn't use zip.js but i used a similar library yes. I'm currently working on a method for storing the uncompressed files if local file system access isn't available.
dinan_old
dinan_old
Good :D
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
I'm looking for someone to work on this with me if anyone would be interested.
LoupDuQc
17 posts
Joined May 2014
LoupDuQc

Frowned wrote:

I'm looking for someone to work on this with me if anyone would be interested.
Interest and will to help I do have, and I'm also able to use javascript, but haven't seen other way to display things other then HTML/css (snake using table is so wonderful XD) with it and I'm also starting to learn object oriented programation in flash...
may not be much that I can do, but I'm willing to look at new things if needed
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned

LoupDuQc wrote:

Frowned wrote:

I'm looking for someone to work on this with me if anyone would be interested.
Interest and will to help I do have, and I'm also able to use javascript, but haven't seen other way to display things other then HTML/css (snake using table is so wonderful XD) with it and I'm also starting to learn object oriented programation in flash...
may not be much that I can do, but I'm willing to look at new things if needed
Pm me your skype or google talk info so I can contact you.
Howl
1,121 posts
Joined June 2013
Howl
I may can help in the backend if there's anything php-related.
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
It's being done entirely in ECMAScript (standardized JavaScript) on the clientside so I doubt we'll need php but thanks anyway.
akiroz_old
6 posts
Joined November 2010
akiroz_old
Hi, I was thinking about starting a similar project and got directed here....
Are there any plans to make this project open source so I could help in some way?

I'm aware of a similar project around here called osu!web but they seem dead with a working demo released.
Their latest commit on git was Feb 26, 2013 (almost 2 years ago at the time of writing this) with 0 contributors on the repo.
How's the progress over here?

Nice naming btw, had me scratching my head until I read it out loud :)
Frowned
34 posts
Joined August 2013
Topic Starter
Frowned
I've been a bit busy lately, i'm planning on working more on this sometime soon. My computer is currently having issues where it hangs randomly so that's kind of getting in my way.
akiroz_old
6 posts
Joined November 2010
akiroz_old
If it's ok with you, maybe you can share the code with me so I could get a better idea of this project in its current state?
Please sign in to reply.

New reply

0
1 / 46