Bobba.io - HTML5 Habbo implementation

Page 1 of 3 123 LastLast
Results 1 to 15 of 44
  1. #1
    Registered Relevance is offline
    MemberRank
    May 2018 Join Date
    17Posts

    Bobba.io - HTML5 Habbo implementation

    Hi ther,
    I want to introduce you Bobba.io, a HTML5 Habbo Hotel implementation.

    Features:
    • Built-in Avatar imager.
    • Built-in Furni imager.
    • Walking, dancing, sitting, waving, blinking and speaking animations.
    • Furni interaction (double click switches states).
    • Furni animations and states.
    • Chat bubbles and scrolling.
    • Own furnidata structure (using json).
    • Virtual camera (you can drag the room).
    • C# Server from scratch.
    • Websockets

    plus some other stuff...

    All SWF assets are extracted and converted to individual png and json files, so all of these can be drawn in HTML5 Canvas.

    Live demo: Bobba

    Screenshot:



    Once you're logged in, you couldn't tell whether is Habbo or not.

    Code Snippets (?)
    The Furni class...

    Code:
    Furni.DRAWING_OFFSET_X = -32;Furni.DRAWING_OFFSET_Y = -16;Furni.FURNIDATA_URL = "./furnidata.json";Furni.ROOMITEM = 0;Furni.WALLITEM = 1;Furni.FRAME_SPEED = 80;function Furni(type, id, x, y, z, rot, baseId, state) {  this.type = type;  this.id = id;  this.x = x;  this.y = y;  this.z = z;  this.rot = rot;  this.state = state;  this.nextState = -1;  this.genericFrame = 0;  this.genericFrameCounter = 0;  this.baseId = baseId;  this.ready = false;  this.sprites = new Sprites();}Furni.prototype.loadSprites = function(furnitureImager) {  let allSpritesPromise = null;  if (this.type == Furni.ROOMITEM) {    allSpritesPromise = furnitureImager.generateRoomItem(this.baseId, 64);  } else {    allSpritesPromise = furnitureImager.generateWallItem(this.baseId, 64);  }  allSpritesPromise.then((base) => {    this.baseItem = base;    for (spriteId in this.baseItem.sprites) {      this.sprites.loadLocalImage(spriteId, this.baseItem.sprites[spriteId].sprite);      let i = 0;      for (layer of this.baseItem.sprites[spriteId].layers) {        this.sprites.loadLocalImage(spriteId + "_" + i++, layer.img);      }    }  });  return [allSpritesPromise];};Furni.prototype.prepare = function(furnitureImager) {  return new Promise((resolve, reject) => {    var p = this.loadSprites(furnitureImager);    Promise.all(p).then(function (loaded) {      //updateStatus("Sprites loaded (" + this.baseItem.itemName + " furniId:" + this.id + ")");      this.ready = true;      resolve();    }.bind(this),    function (error) {      updateStatus("Error loading sprites: " + error);      //reject("Error loading sprites: " + error);      resolve("Error loading sprites: " + error);    }.bind(this))  });};Furni.prototype.updateParams = function(x, y, z, baseId) {  this.x = x;  this.y = y;  this.z = z;};Furni.prototype.setState = function(state) {  if (this.baseItem.states[state].transition != null) {    this.state = this.baseItem.states[state].transition;    this.nextState = state;    this.genericFrame = 0;  } else {    this.setActualState(state);  }};Furni.prototype.setActualState = function(state) {  this.state = state;  this.nextState = -1;  this.genericFrame = 0;};Furni.prototype.nextGenericFrame = function() {  this.genericFrame++;  if (this.genericFrame >= this.baseItem.states[this.state].count) {    this.genericFrame = 0;    if (this.nextState != -1) {      this.setActualState(this.nextState);    }  }};Furni.prototype.tick = function(delta) {  this.genericFrameCounter += delta;  if (this.genericFrameCounter >= Furni.FRAME_SPEED) {    this.nextGenericFrame();    this.genericFrameCounter = 0;  }};Furni.prototype.getCurrentBaseSprite = function() {  return this.baseItem.sprites[this.getCurrentFurniSpriteKey()];};Furni.prototype.getCurrentSelectableLayer = function(layerId) {  return this.sprites.getSilhouette(this.getCurrentFurniSpriteKey() + "_" + layerId);};Furni.prototype.getCurrentFurniSpriteKey = function() {  return this.sprites.getFurnitureSpriteKey(this.baseItem.itemId, this.rot, this.state, this.genericFrame);};Furni.prototype.currentSprite = function() {  return this.sprites.getImage(this.getCurrentFurniSpriteKey());};Furni.prototype.currentSpriteAdd = function() {  return this.sprites.getImage(this.getCurrentFurniSpriteKey() + "_add");};Furni.prototype.currentSilhouette = function() {  return this.sprites.getSilhouette(this.getCurrentFurniSpriteKey());};
    https://github.com/Josedn/battleball_server
    https://github.com/Josedn/battleball_client
    Last edited by Relevance; 20-07-18 at 07:02 PM.


  2. #2
    Moderator Quackster is offline
    ModeratorRank
    Dec 2010 Join Date
    AustraliaLocation
    3,203Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Wow this looks AMAZING! Good luck!

    Is it just a client right now?
    The Habbo archives: http://alex-dev.org/archive/

  3. #3
    Registered Relevance is offline
    MemberRank
    May 2018 Join Date
    17Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Thanks!

    It includes client and server!

  4. #4
    Oldskool Resurrector Navine is offline
      V.I.P  Rank
    Oct 2012 Join Date
    The NetherlandsLocation
    2,330Posts

    Re: Bobba.io - HTML5 Habbo implementation

    It um still looks pretty buggy but it surely looks promising! Good luck with it.
    Developer of Aurora (huge oldskool & Habbo BETA project):
    http://forum.ragezone.com/f331/v9-r3...netty-1132388/

    - C# developer
    - Webdeveloper

    Contact me @ discord: navv13#8055

  5. #5
    Account Upgraded | Title Enabled! pipitt05000 is offline
    True MemberRank
    Feb 2009 Join Date
    202Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Excellent ! Good work man :)

  6. #6
    Registered LukeOx is offline
    MemberRank
    May 2016 Join Date
    18Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Looks very cool! Is the demo down right now? Would love to try it out.

  7. #7
    Registered Relevance is offline
    MemberRank
    May 2018 Join Date
    17Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Quote Originally Posted by LukeOx View Post
    Looks very cool! Is the demo down right now? Would love to try it out.
    Oops, server crashed.

    Online right now!

  8. #8
    Account Upgraded | Title Enabled! LeChris is offline
    True MemberRank
    Sep 2011 Join Date
    United StatesLocation
    652Posts

    Re: Bobba.io - HTML5 Habbo implementation

    It’s pretty amazing man. Good luck with this and I can’t wait to see the finished result after you optimize it all!!

  9. #9
    Hardcore Member cabeludo007 is offline
    MemberRank
    Nov 2013 Join Date
    My HouseLocation
    142Posts

    Re: Bobba.io - HTML5 Habbo implementation

    The greatest engine i've seem. Great job!
    Como conseguirei as respostas certas se nem ao menos sei quais perguntas fazer?

  10. #10
    Member Amariconao is offline
    MemberRank
    Nov 2011 Join Date
    66Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Hey bro! I let here from you the code of i used for try a few things. I hope u will use this for fix some things :D

    Only for the developer (If he pm me i will delete this)


  11. #11
    Developer BurakDev is offline
    SubscriberRank
    Mar 2013 Join Date
    ParisLocation
    370Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Nice project, currently the only one started a engine like the real one done by Sulake.

    Quote Originally Posted by Amariconao View Post
    Hey bro! I let here from you the code of i used for try a few things. I hope u will use this for fix some things :D

    Only for the developer (If he pm me i will delete this)
    As the author said, is just a live demo.
    There are not any extra security against things like that, you just created an useless websocket client

  12. #12
    Member Amariconao is offline
    MemberRank
    Nov 2011 Join Date
    66Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Quote Originally Posted by BurakDev View Post
    Nice project, currently the only one started a engine like the real one done by Sulake.



    As the author said, is just a live demo.
    There are not any extra security against things like that, you just created an useless websocket client
    Its not useless. Its intresting for see how he work with packets and for me for learn about websockets

  13. #13
    o/ Konquer is offline
    True MemberRank
    Apr 2014 Join Date
    458Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Looks really good, well done!

  14. #14
    Hardcore Member B3T4T3ST3 is offline
    MemberRank
    Dec 2013 Join Date
    149Posts

    Re: Bobba.io - HTML5 Habbo implementation

    so... this is a dead thread?
    Also, any plans to release it?

  15. #15
    Account Upgraded | Title Enabled! pipitt05000 is offline
    True MemberRank
    Feb 2009 Join Date
    202Posts

    Re: Bobba.io - HTML5 Habbo implementation

    Quote Originally Posted by B3T4T3ST3 View Post
    so... this is a dead thread?
    Also, any plans to release it?
    I don't think it will be released...
    Maybe an "hotel", maybe nothing Bobba.io - HTML5 Habbo implementation



Page 1 of 3 123 LastLast

Advertisement