Menu system

[SolarPortal]

good that its working now

I have changed the GUI shaders so fonts and images are both SRGB Corrected via shader instead of when the texture is loaded in c++ which allows 8, 16, 24, 32 bit per channel textures to be the correct colours instead of only the 8 bit texture working. Since fonts are using textures and generally are more than 8 bit for quality, they were buggering up.
This way makes life much easier and fixes the font colour also so nothing at all to deal with on the users end. This will be in the next update

As for the loadFromTemplate, as mentioned before, this is only required if you are loading 2 .rml files of the same name in the scene at once. e.g.

Code: Select all

function onInit(objID)
    id1 = gui.loadFromTemplate("myRML.rml", 0, 0);
    id2 = gui.loadFromTemplate("myRML.rml", 50, 50);
end


If not, then you are fine using gui.load() as normal The load from template was created as an RPG demo we made on Gen1 had an rml which only held the enemy health bar in the top left of the document to show above the enemies head and the same document was loaded for each enemy in the level.

...it would take ages to figure out myself

Thats why we are here and happy to help

Hope this all makes sense

[planetX]

As for the loadFromTemplate, as mentioned before, this is only required if you are loading 2 .rml files of the same name in the scene at once. e.g.

Ok, so I went back to gui.load() as I'm not loading any rml more than once...

Thanks, everything is clear (so far).

[SolarPortal]

Just to let you know that we have also just added the scissor test ability to clip around boxes such as a text box with scrolling text. Currently on Gen2, the text appears outside the box. We have just wrote the shaders to account for the css property:
"overflow: hidden" or "overflow: scroll" to clip outside the box and render only the text inside the box. Quite an important feature lol

[planetX]

Just to let you know that we have also just added the scissor test ability to clip around boxes such as a text box with scrolling text. Currently on Gen2, the text appears outside the box. We have just wrote the shaders to account for the css property:
"overflow: hidden" or "overflow: scroll" to clip outside the box and render only the text inside the box. Quite an important feature lol

Good to know...

There are also some css properties which seem not to be implemented yet, or at least I can't make them work, line "border" or "letter-spacing", to name some... they are CSS2 compatible, so they should work... maybe the syntax is different?

[planetX]

Hi there,

I was on fire with this, but sadly I think I have to stop a lil bit, as I must continue another (no gamedev related) project... there's no time for everything... anyway, here's a video of the progress so far:





I've added a vignette to fake cool ambient lightning, also added an input text field (WIP as I can't delete at the moment) and some value selectors, some info here and there... it's getting shape nicely. I love it!

[SolarPortal]

That is very well done! Looking forward to seeing the rest.

I hope that its not the engine forcing you on to another task, and we will check out the lineedit to see why it cant be deleted or cleared. i imagine the gui.setInnerRML(bid, elementID, "") would work. Strange if not though...

Anyway, keep it up and its gunna turn out a great game on the engine

[StarFire]

Great work, this menu is looking way pro now, love it

Go and do something else .... if you must! lol
Look forward to seeing what you do on your next Skyline sessions.

[planetX]

Thanks buds, glad you like it...

I think I'm gonna face a big problem in the near future, in order to adapt the layout to all screen sizes. I'm positioning the elements in percentages, which works fine, but still need to adapt the font sizes. Is it possible to switch the .rcss file depending on the screen size?

Cheers!

[SolarPortal]

Yeah, theres a bit of code we have written.
StarFire will have a look for it soon, she's just a bit busy atm.

Will get back to you with it asap.

[StarFire]

Yes the font sizes can be an issue. Currently we are scaling the fonts with the following script:

Code: Select all


fontsize2                         = 24;      -- Base font size
maxWidth                         = 1920;      -- Max expected screen width

function openTalkUI()
   gui.workSpace(ui_Workspace);
   guiID = gui.load(ui_File, 0, 0,obj);
   gui.setFontSize(guiID,guiID,""..fontsize1);
   gui.setFontSize(guiID,"Body_Text",""..fontsize2);
   for i=1, maxOptionAmount do gui.setFontSize(guiID,"Opt"..i.."_Text",fontsize2); end
   scaleFonts(screen.getWidth(),screen.getHeight());
   gui.showCursor();   
end

function scaleFonts(w,h)
   currentWidth = w;
   percent = 100/maxWidth*currentWidth;
   val = percent*0.01*fontsize1;
   gui.setFontSize(guiID,"Title_Text",val);
   val = percent*0.01*fontsize2;
   gui.setFontSize(guiID,"Body_Text",val);
   for i=1, maxOptionAmount do gui.setFontSize(guiID,"Opt"..i.."_Text",val); end
end


It is a workable solution until we can set up something better in the gui system.
Hope this helps

[planetX]

Hi, thanks for quick reply...

That font scaling solution looks interesting, and I'm pretty sure I'll use it at some point... I'm thinking about and I have to test it, but I fear it's not going to be enough, due to margins and sprite sizes. But anyway, looking at your code, I see that you can get the window size in runtime, which makes me think in another direction... what do you think about this logic?:

if (window_size > 1500) then
load workspace A
elseif (window_size < 1500) then
load workspace B
... and so on

But not sure if I can load only the .rcss file and not the .rml ones, as I don't want to duplicate 25 pages for each screen size. Don't know either how the GUI system works, if I can load more than one workspace or not... what do you think? is it worth a try?

[SolarPortal]

It could be possible to dynamically change the rcss on load if we parse and edit the rml file being passed into the document loader before the rml file actually loads if that makes sense.
RCSS is loaded first as it contains the stylesheet for the rml file.
Since the document is pulled in as a string, it could be edited to change the RCSS which is used since rml references the RCSS via a link tag. The visual editor already parses and adds the RCSS associated when the rml is created so the same code could be reused with a slight tweak.

All this would have to be programmed though and we are in the middle of a code freeze for the interim release. If there is time and i can get through these remaining merge bugs before release, i could see how much work it would be and if its a quick one, then it could be implemented. Although its more likely it wont happen for this release.

edit:
If this code was implemented, it could be coded as such:

Code: Select all

   -- Load workspace as normal
   gui.loadWorkspace("path/to/my/folder/");
   -- This would replace the name of the old file with the name of the new file in the next load call.
   gui.changeNextRCSS( "fileThatWas.rcss", "NewFile.rcss" );
   -- Load the GUI as normal
   guiID = gui.load("myfile.rml", 0, 0);


Note: This is not actual code that would work but is a showcase of what could be....

[planetX]

Hey, no hurries, I was just thinking loud... Take your time and focus on the important things, don't get distracted by details like this. I definitely can wait, this is a hobby, I'm not a professional.

Parsing/editing the .rml file sounds good. At least sounds like I wont have to change too much of the code I already have.

[SolarPortal]

ok, looking at the document loader, it takes file and stream atm but there is a string variant. So yeah, lets leave this for another release for now as it requires a separate path to follow and load correctly

The same lua code as mentioned before could be the way of using it once done.
Thanks for being patient

[planetX]

Good morning! Hope you guys have a nice weekend, I'll try to make some progress on this... got addicted.

I have a question about sounds. I'm trying to organize all the sounds I'll use in the menu, so I've created some functions to make it a lil bit easier to manage, but it doesn't work as expected... first I declare the variables and load all the sounds onInit():

Code: Select all

sound_music = 0
sound_click = 0
sound_check = 0

function onInit(objID)
   obj = objID
   ...
   LoadAllSounds()
   ...
end


And here are the loading functions:

Code: Select all

function LoadAllSounds()
   LoadSound( 1, 1, "MR_MUSIC_menu2.ogg", 0, sound_music )
   LoadSound( 0, 1, "MR_MENU_beep.ogg", 0, sound_click )
   LoadSound( 0, 1, "MR_MENU_check.ogg", 0, sound_check )
end

function LoadSound( loop, volume, soundfile, stream, theobject )
   sound.setLooped( loop )
   sound.setVolume( volume )
   sound.setSoundFile( soundfile )
   sound.setIsStreamed( stream )
   theobject = sound.create2DSound()
end



Additionally, I've created a function to play each sound:

Code: Select all

function PlaySound( thesound )
   if (thesound == "sound_music") then sound.play2DSound( sound_music ) end
   if (thesound == "sound_click") then sound.play2DSound( sound_click ) end
   if (thesound == "sound_check") then sound.play2DSound( sound_check ) end
end


In the .rml file, I have this markup for the event:

Code: Select all

onclick="lua(scenescript,PlaySound,sound_click);"


So when I press a button, it should play the "sound_click" object... but I only can hear the "sound_music" one, which makes me think that only the first sound is loaded. I know that I'm doing something wrong when passing variables, as always, but I'm currently lost here... any clue?

Thanks!

[SolarPortal]

Hi, i just gave it a go and the problem is in the way you have passed the id to fill in "LoadSound()".
Lua doesnt know how to use references and you have passed the id in but havent returned out the id.

Changing it to:

Code: Select all

function LoadAllSounds()
   sound_music = LoadSound( 1, 1, "guimusic.ogg", 0 ) -- replace with your file
   sound_click = LoadSound( 0, 1, "buttonDown.ogg", 0 ) -- replace with your file
   sound_check = LoadSound( 0, 1, "buttonOver.ogg", 0 ) -- replace with your file
end

function LoadSound( loop, volume, soundfile, stream )
   sound.setLooped( loop )
   sound.setVolume( volume )
   sound.setSoundFile( soundfile )
   sound.setIsStreamed( stream )
   return sound.create2DSound()
end


works fine.

[planetX]

Aha, that makes sense... than you very much for the solution (and the explanation).

[SolarPortal]

no problem

[planetX]

Hi there,

made some progress on the menu system... now all the tracks and cars can be selected, and the fog transition between camera positions are nice and smooth. Just need to make the buying process and the unlocking features, then I'll start with the save/load functions... and this is pretty much done.

I'm also thinking on adding a color switcher to the cars, that would be easy to implement... we'll see.

Hope you like it!

[SolarPortal]

Fantastic work! Definitely needs to be apart of the skyline feature reel

Also good to see all the colours are now correct and matching what you wanted

Keep up the great work!

[StarFire]

what can I say... Awesome

When you are happy with it, we would like to use it on an official video to show of the power of Skylines Gui

[planetX]

Glad you like it buds!!

Also good to see all the colours are now correct and matching what you wanted

Yes, I have been enjoying all the features and fixes you did include in the last update... thanks so much!

When you are happy with it, we would like to use it on an official video to show of the power of Skylines Gui

Sure, that would be great. I'm still waiting for some cool lights and shadows... I know you guys are working on that ATM, hope you get those features done soon, can't wait to play with them.

Cheers!

[planetX]

Hi buddies,

hope you're getting a nice summer full of development and fun... I don't say anything but still following your progress almost every day, you're doing a great job.

Sorry for bothering you again with this, I'm almost done with my aside projects and start thinking on getting back to Skyline soon... I just got some spare minutes and wanted to revisit the menu system, the save/load stuff to be more precise.

I've created a table with all the player profile variables and I want to save it in a folder called "Profiles" inside the project folder. Setting up an absolute path works fine (D:/TALLER/Skyline2/Projects/MyGame/Profiles/thefile.json) but I would like to use a relative path instead. I've re-read what SP wrote some time ago about the general locations, but those are locations from the Skylike2 folder. Any trick?

Also, is there any way to setup a relative path which works on both editor and compiled game?

Here are the general locations when working in the editor and wont be much good in an end game.

• sky.getDir_AssetLibrary();
• sky.getDir_DataFolder();
• sky.getDir_Win32();
• sky.getDir_Win64();
• sky.getDir_Scenes();
• sky.getDir_Presets();
• sky.getDir_Models();
• sky.getDir_Materials();
• sky.getDir_Environements();
• sky.getDir_Scripts();
• sky.getDir_VisualModules();
• sky.getDir_Textures();

The next two functions are used for the Game Directories once its exported to game.

• sky.getDir_GameAssets(); -- Will retrieve the Assets Folder of the game folder.
• sky.getDir_GameRoot(); -- Will return the root of the game folder.

If in the editor, then i expect these will go to the Win32_Release folder.

I've also found that the order of the variables in the .json file is messed up, is there any way to fix that? Not really important, but a lil bit annoying.

Thanks!

[SolarPortal]

Hi PlanetX Seen your message and i will look into it tomorrow and respond, little bit stuck in code at the moment.
From that list, it doesnt look like the project path exists, so i will check and add tomorrow if necessary.

hope you're getting a nice summer full of development and fun... I don't say anything but still following your progress almost every day, you're doing a great job.

Thanks Not had much of a summer here, the odd weeks have been hot but the rest is rain lol
Hope you are having a good summer too!

I've also found that the order of the variables in the .json file is messed up, is there any way to fix that? Not really important, but a lil bit annoying.

Is this when displaying the names. Perhaps try indexing them using an integer(e.g. myprofiles[0] = "Person") or prefixing with a number (e.g. myprofile["00_ProfileName"] = name) as the file is auto generated, so there really isnt a lot of control in that area.
If you could post how your storing the profile info that gets out of whack, then i can look at that for a good solution.


I should have more information tomorrow.

[planetX]

Hi SP, thanks for reply... no rush mate, you know I'm not in a hurry with this. A path from the project folder would be great, just add it to the to-do list.

About the json, it's not really important, as they are basically files to read from... just wanted to point it out, just in case is a stupidity that can be fixed easily. Not even worth to change the variables name, so you can ignore it if you want. Anyway, here's the table in the lua script FYI:

Code: Select all

player = {
   ["id"] = 1,
   ["active"] = 1,
   ["name"] = "Player Name",
   ["money"] = 100000,
   ["game_type"] = "arcade",
   ["current_car"] = 1,
   ["settings_sound_music"] = 10,
   ["settings_sound_fx"] = 10,
   ["settings_sound_track"] = 1,
   ["settings_display_map"] = 1,
   ["settings_display_timer"] = 1,
   ["settings_display_speed"] = 1,
   ["car_state"] = {
      [1] = 2,
      [2] = 0,
      [3] = 0,
      [4] = 0,
      [5] = 0,
      [6] = 0,
      [7] = 0
   },
   ["car_setup"] = {
      ["AccF"] = 0,
      ["AccR"] = 0,
      ["BrakeF"] = 0,
      ["BrakeR"] = 0,
      ["LonGripF"] = 0,
      ["LonGripR"] = 0,
      ["GripF"] = 0,
      ["GripR"] = 0,
      ["Speed"] = 0,
      ["Reverse"] = 0,
      ["Friction"] = 0,
      ["Rest"] = 0
   },
   ["arcade_curr_car"] = "Car Name",
   ["arcade_curr_moon"] = "Moon Name",
   ["arcade_curr_track"] = "Track Name",
   ["arcade_level"] = 1,
   ["arcade_laps"] = 5,
   ["arcade_active"] = {
      [1] = 1,
      [2] = 0,
      [3] = 0,
      [4] = 0,
      [5] = 0
   },
   ["arcade_pos"] = {
      [1] = 0,
      [2] = 0,
      [3] = 0,
      [4] = 0,
      [5] = 0,
      [6] = 0,
      [7] = 0,
      [8] = 0,
      [9] = 0,
      [10] = 0,
      [11] = 0,
      [12] = 0,
      [13] = 0,
      [14] = 0,
      [15] = 0
   },
   ["arcade_time"] = {
      [1] = "00:00:000",
      [2] = "00:00:000",
      [3] = "00:00:000",
      [4] = "00:00:000",
      [5] = "00:00:000",
      [6] = "00:00:000",
      [7] = "00:00:000",
      [8] = "00:00:000",
      [9] = "00:00:000",
      [10] = "00:00:000",
      [11] = "00:00:000",
      [12] = "00:00:000",
      [13] = "00:00:000",
      [14] = "00:00:000",
      [15] = "00:00:000"
   }
}


And this is the json:

Code: Select all

{
    "car_setup": {
        "AccR": 0.0,
        "GripR": 0.0,
        "BrakeF": 0.0,
        "LonGripR": 0.0,
        "AccF": 0.0,
        "LonGripF": 0.0,
        "Friction": 0.0,
        "Reverse": 0.0,
        "Speed": 0.0,
        "GripF": 0.0,
        "Rest": 0.0,
        "BrakeR": 0.0
    },
    "active": 1.0,
    "arcade_active": [
        1.0,
        0.0,
        0.0,
        0.0,
        0.0
    ],
    "settings_sound_fx": 10.0,
    "settings_sound_track": 1.0,
    "settings_display_map": 1.0,
    "arcade_time": [
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000",
        "00:00:000"
    ],
    "arcade_curr_car": "Car Name",
    "arcade_laps": 5.0,
    "current_car": 1.0,
    "id": 1.0,
    "money": 100000.0,
    "settings_display_timer": 1.0,
    "arcade_pos": [
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0
    ],
    "arcade_curr_moon": "Moon Name",
    "game_type": "arcade",
    "name": "Player Name",
    "car_state": [
        2.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0,
        0.0
    ],
    "settings_sound_music": 10.0,
    "settings_display_speed": 1.0,
    "arcade_curr_track": "Track Name",
    "arcade_level": 1.0
}

Cheers!