CS Fade & Color Mod (V 1.2)

Game Development
1

Alright, so, to make a looooong story short, I’ve created a mod for CS that’ll let you add fadein (that you can toggle on or off for certain scenes) to your game and switch background and text color on the fly without having to write any extra code for it. In addition, since it’s CS variable based, it works alongside CJW’s smPlugin.js without a hitch and keeps previous settings (coincidentally that was the entire reason I made this, to work with smPlugin).

To install it, download and replace your scene.js file with the modded one [here][1] and download and add this [fade.css][2] file into the same directory where style.css is. After that’s done, you’ll need to edit the index.html file in your mygame folder with Notepad and add two lines to activate the mods:

  1. Add this line (of course, take out the space between the “<” and “link id=” etc. otherwise it won’t work):
    < link id=“fade” href="…/fade.css" rel=“stylesheet” type=“text/css”>
    Right after this line here:
    < link href="…/style.css" rel=“stylesheet” type=“text/css”>

  2. All the way at the bottom of the file, add this line (again, remove the space between the “<” and “body id=” etc.):
    < body id=“body”>
    Right before this bit here:
    < noscript>
    < p>This game requires JavaScript; please enable JavaScript and refresh this page.< /p>
    < p>If you can’t get the game to work, please write to us at
    < a href=“mailto:support-external@choiceofgames.com”>support-external@choiceofgames.com for assistance.< /p>
    < /noscript>

Once you’ve done that, Congrats! You’ve installed the mod, now here’s how to use it, (and because reasons) this section will be titled:

Malebranche’s Mod Manual (V 1.2)

Since this mod works the way it does, in your startup.txt you’ll need to *create 4 extra variables, these are:
*create scenecolor “”
*create scenecolor2 “”
*create togglescenefade false
*create scenefadetime “[Insert the number of seconds you want it to take to fadein]s”

(Note: The “s” is not a typo, that needs to be there for it to work, to if you wanted it to take 10 seconds for the text to fadein you’d create fadetime as *create fadetime “10s”)

How to change colors:
scenecolor and scenecolor2 effect the text color and background color of your regular scene files respectively (scenecolor controls background color and scenecolor2 text color). If you leave them blank as they are, they’ll simply inherit the CS default colors from within style.css, so no harm done if you want to leave them alone. If you want to change colors you simply need *set scenecolor and scenecolor2 to the equivalent hexcolor values of the colors you want (for example if you *set scenecolor “#000000” (the hexcolor value for black) and *set scenecolor2 “#FFFFFF” (the hexcolor value for white) you’d get white text on a black background). Want to revert back to CS defaults? Simply *set scenecolor and scenecolor2 back to just “” 's and you’re good to go.

How to activate fading:
As was mentioned before, *set scenefadetime to the number of seconds you want it to take to fadein (Note: you can also change this as you please, so you need not stick with “10s” or “5s” fadein for the entirety of your game) and *set togglescenefade true to activate fading. If you only want fading for a certain scene, simply *set togglescenefade back to false and Fadebegone!

Isolating Color and Fade Schemes for Stats Screen and Regular Scenes:
In order to use this functionality, you’ll need to *create 5 more variables in addition to the ones aforementioned, these 5 are:
*create isolateschemes false
*create statscreencolor “”
*create statscreencolor2 “”
*create togglestatscreenfade false
*create statscreenfadetime “”

These variables work EXACTLY the same as their “scene” counterparts, only they will apply settings to the stats screen. However, in order for the mod to apply these, the switch (the variable “isolateschemes”) needs to be set to on, or, in our case, true. If isolateschemes is set to false (or not even created at all), the stat screen will simply inherit the scheme you’ve set for the regular scenes, effectively letting you turn the feature on and off at will throughout your game.

Hope you can use it! Let me know if it works as intended (EDIT AS OF V1.2: it should, since I tested it on my end without a hitch).
[1]: https://www.dropbox.com/s/wmahragcvkji00y/scene.js?dl=0
[2]: https://www.dropbox.com/s/0kvvmo8vqp8gyd0/fade.css?dl=0

7 Likes
2

Do you have the blank CS game still to show us what it would looks like?

3

Sure, you want me to upload the folder, or simply show screenshots?

4

Great to see you get this out there! For what it’s worth, I can attest that’s it’s pretty easy to set up and a really useful feature to have.

5

If your able to put up a link to the game to see it in action, that would be great.

6

Here you go, just compiled [here][1] (EDIT AGAIN: I’ve uploaded it to my own shared hosting plan, now you can view it in browser)
[1]: http://gatorhost.info/randomgame.html

7

Currently unable to download or otherwise with this laptop and its firewalls. Is there no way to directly open it through browser?

8

EDIT: Fixed, uploaded to my hosting plan.

9

Will this be okay with Cog? Like can I still publish my game if I add this stuff?

10

Wow looks pretty cool! Though the speed at which it first appears might want adjusting imo, I’m sure that’s adjustable.

11

@Imon That remains to be seen, I personally don’t know. If they do it’d be great since it’s really a very simple mod that integrates into scene.js. While I know they don’t allow games that use the *script command in CS, they do try to implement as many features as possible (that’s how the *sound command was created, since Samuel H Young submitted a game with sound) so as to make using the *script command unneeded, not that this mod uses the *script command of course.

@Arcania Yeah, I set it to “20s”. I’ll have to add a choice to let you see it at different fade speeds.

12

I have added this over on the Choiceofbox site under snippets. :slight_smile:

13

*sound command? enlighten me. cant find it anywhere in the dev wiki

14

@Imon Right, well, basically, like I said before, *sound is an experimental command implemented into CS around the time Samuel H Young had Trial of The Demon Hunter released. In a nutshell, it works exactly like the *image command does in CS, you simply have to add the (in this case) .mp3 file you want into your mygame folder and call it within CS like so:

*sound myaudiofile.mp3

Now *sound is a very limited command in regards to you have no control over playback of the sound file, meaning it will end when it ends and you have no way to loop a sound until a player gets to a specific point, so a player could be reading an epic scene with equally epic music, only for the music to cut out in the middle because it finished. Thankfully, (as I just found out while testing it) it operates on a hierarchical order, that is if you call two *sound commands at once, the latter will override the former, the same concept applies to different scenes, if you play a sad tune first and then the scene turns into a battlefield suddenly (to give an example of complete opposites) the moment you call the second *sound command the first (sad tune) will stop playing, getting replaced by the other, more suitable, tune.

Also, side note, to everyone: I’ve updated the demo of the mod to a version that shows off it’s capabilities more, as you could probably tell by going through it, I had faaaaar too much fun making it than I should have, lol.

Still the same link, so you can access it by going here or clicking the link to it a few posts above.

1 Like
15

Wow. That’s great! I’m definitely going to install this.

16

Tried it and it works. However, as I do not know what hexcolor values are, I can only use the two examples you gave above (black background with white writing). Is there anywhere I can find these hexcolor values for the colours?

17

http://www.w3schools.com/tags/ref_colorpicker.asp

2 Likes
18

Version 1.2 is UP!

Changes in this version:
-Variable names that the mod runs off of are now (at least somewhat) self-documenting
-The ability to isolate a color scheme for your stats screen, separate from the color scheme for your regular scenes, at will (without the older hackneyed method and without replacing ui.js).
-The ability to isolate the fade in effect for your stats screen, separate from the fade in effect for your regular scenes, at will.

The manual for this version has been updated in the original post of this thread, so go check it out before you download the resources. Let me know if there’s any errors (there shouldn’t be) or anything (within reason, of course :stuck_out_tongue_winking_eye:) that you’d like to see in another version. On that note, enjoy the new version, hope it can be of some help to ya’.

19

If I have some text with for example a black background and white text. I can’t seem to change it back in the same scene.
And also I’ve encountered the problem that if I were to use *finish at the end of the chapter that the entire color scheme I’ve set won’t work.

For example.

*create scenecolor ""
*create scenecolor2 ""
*create togglescenefade false
*create scenefadetime "5s"  

*set scenecolor "#000000"
*set scenecolor2 "#FFFFFF"     
*set togglescenefade true
bla bla bla
bla bla!
*finish

The color of both the background and text doesn’t seem to change. But it does however when i replace *finish with *page_break but if I do that I am not able to change the colors to something else.

20

That’s… odd. I just tested it (switching back from color scheme to CS defaults in the same scene) on my end and it has no issues doing that whatsoever, can you post a snippet of your code?

I knew I was forgetting a command to edit somewhere. I’ve just updated the link to scene.js with the fix for *finish, so re-download it + replace and you should be good to go.