This turned out absolutely beautiful.... wow.
A member registered Mar 18, 2017 · View creator page →
Creator of
A zine about making a miserable spreadsheet.
A Little Guy's Guide to getting started in Decker.
A tiny non-adventure in a mysterious forest.
Play in browser
Recent community posts
I'm a little sleepy, so I'm sorry if this doesn't totally make sense but I'll take a stab at writing out instructions anyway. If you get confused let me know with what part and I'll try to clear it up.
In both cases these are a kind of Decker resource called a Module. These are-written bundles of code that do specific things that you can transfer into your projects and it's all set up to be convenient and reusable.
You'll probably already have a copy of dialog.deck in the examples folder that comes with downloadable Decker. But you'll also want to download a copy of typetext.deck from the link above. Then you'll have the modules on your computer and you'll have an easier time transferring them to your project.
How to transfer resources
While you have your new project open (or an empty deck that might become your new project) use the menu at the top to go to File > Resources. Use the Choose button to select one of the decks files that you want to transfer a module from. This will create a list of all the transferrable resources on the left, and you can choose the ones you want and >> Copy >> them into your current project.
You'll want to get the "typetext" module from typetext.deck and the "dd"module from dialog.deck.
How to use typetext
When the typetext module is in your deck you can use it in scripts to make a section of text type out letter by letter into a text field. The easiest way to test it out is by putting your script in a button so you can click the button and see if things happen how you want them to.
I'm going to walk through the example code from the typetext module to explain what each part means, and then you can try playing around with it yourself.
Imagine that this is the little bit of code inside a button:
on click do typetext.typetext["hi there, look at this being typed out" targetfield 5 "" "lowpip"] end"on click do" and "end" are the basic structure of the usual click event code inside a button. Anything you want to happen when you click the button should go between those two lines.
The typetext.typetext part is just telling decker to look at the typetext module and use the typetext function (I think they're only the same word because this module only has one function).
Inside the brackets is where we put our arguments, meaning the instructions we want to give typetext about what to type, where to type it, etc.
The text inside the quotes ("hi there...") is the text that will be typed out typed out.
targetfield is a name I made up for a text field that we want the text to be typed into. (It doesn't need to be called that, it just need to exist and have the name of the field match the name in this part of the code)
5 is the speed, but specifically it's how long do you want typetext to pause to take between letters. In this case it's 5 frames. Try different numbers if you want!
The "" is an additional argument you can give it, if you want some text to be there already before the typing-out effect begins. You can leave this as two quotes with nothing in it if you don't want to use them.
"lowpip" is the sound effect that plays when this particular example runs. You'll need to transfer this sound effect from typetext.deck if you want to use it. It works just like how you got the module. You can also set up a different sound to use here or you can ignore this if you prefer silence.
My suggestion from here is to play around with it. :) And let me know if you run into any difficulties.
How to use Dialogizer
The Dialogizer example deck (examples/dialog.deck) is also full of instructions for how to use this module, but I'll write out a simple version so you can refer to this and the example deck and hopefully one or both of these explanations will make sense.
I'll use a simple button script example again:
on click do dd.open[deck] dd.say["Hello, World!"] dd.close[] endWhen this button is clicked the dd module is told to open[] (get itself ready, in a sense), then told to say[] ("Hello, World!" will appear in a dialog box) and then close[] itself, because it's done.
This is the basic code of Dialogizer, though there are some ways to make it even easier to write big scenes and also ways to style your dialog boxes which I'll explain next.
But to make sure things are set up right, just try putting that code up there in a button in your project and click it once. If the dialog box popped up on screen and displayed the text then we can move on.
Easier writing with Dialogizer
If we switch that code above to say dd.say[story.value] instead of dd.say["hello"] it can display a whole scene that's written in a more natural way inside of a Field widget.
story.value effectively tells dd to look at the contents of our field widget called story and dd.say[] will treat it as multiple lines of dialog if there are blank lines between lines of text.
Let's say this is the text inside of a Field widget named "story":
Me: Hello, World! World: Oh, hello there... Me: Aaah! The world is saying hello back!
This should make a series of dialog boxes appear until it finishes the whole scene written in the field. Hopefully this will all make sense if you give it a try.
Styling Dialogizer
This might seem a little more confusing at first.
We need to rewrite dd.open[deck] to add another argument: we need to tell it the name of a specific style that we're going to define. You can name your styles pretty much anything but I'll use the name st in this example because I want to create a style that has slow text.
I'm going to change our dd.open[deck] line to say dd.open[deck st] instead.
But we also need to define what st means. In a big project you'll probably want to put your style information 'higher up', maybe in the deck level script (happy to explain this later!) so any button or script in the project can look up and see what st means... but for this practice button we can define it in the same button where the dd script lives, just above the "on click do" event handler.
st:() st.speed:10 on click do dd.open[deck st] dd.say[story.value] dd.close[] end
Now when we click the button the text in our "story" will play out slowly. (It will take 10 frames per word. Lower numbers will be faster.)
There are a bunch of other ways to style a dialog box that are explained inside of dialog.deck, by the way! Once you understand the structure that the dd module uses it gets a lot easier to figure out what all the examples are doing, and you don't need to be able to write much code at all to start making things.
I'm sorry for being very rambly in this post but I hope this helps you get started playing with these two modules!
(And if you're interested in visual novel-type stuff, Dialogizer works very well with another module named Puppeteer which can handle character sprites.)
A note about how to access the Wigglystash contraption, for people who aren't familiar!
Using the menu bar you can go into "Widgets mode" which lets you edit various things in the program. [ Tool > Widgets ]
And then use the new "Widgets" menu option to create a "New Contraption"
Pick "wigglyStash" and click create.
This will give you a little rectangle with "Stash" and "Recall" written on it. Position it where you want it to be with your mouse and then go back to interact mode with the menu. [ Tool > Interact]
You can now click "Stash" to save and "Recall" to load a wigglypaint image from the wigglyStash contraption. You can even have a bunch of them, if you want.
This isn't a replacement for saving your file if you're using Wigglypaint offline, this is just an extra way to temporarily store drawings-in-progress while you're working on something or trying out different ideas.
Hmm! Yeah, my example in the book only goes one way... I'll have to think about adjusting it.
But for now I'll explain some other ways to write that script here!
Because buttons can hold a binary value (0 or 1) you can set it to hold either of those values directly.
Or you can tell it to be "NOT the current value". This will toggle it between 0 and 1 depending on which value is currently stored.
"!" is the Lil operator for "NOT" so it could be written like this:
on click do
thebox.value: ! thebox.value
end
I hope this makes sense? And thank you very much for reading! I'm always happy to clarify things!