This is the Fluffy Start page.
You are $playerName, a $playerGender <<print $playerRace.toUpperFirst()>> pony, and you aren't a smarty.
You're going to start in the <<cycle "$ponyStart">><<option "Safe Room" "saferoom">><<option "Daycare Room" "daycare">><<option "Alleyway" "alleyway">><<option "Factory Farm" "factoryfarm">><</cycle>>.This is the Human Start page.
You are $playerName, a $playerGender $playerRace.Hey there. Make your choices for the character you'd like to play, then hit "Confirm Character."<<nobr>><<set $firstLoad to true>><</nobr>>
Your name is <<textbox "$playerName" "Player Name">>.
You are playing a <<cycle "$playerGender">><<option Male "male">><<option Female "female">><</cycle>> <<cycle "$playerRace">><<option Human "human">><<option "Earthie Pony" "earthie">><<option "Pegasus Pony" "pegasus">><<option "Unicorn Pony" "unicorn">><<option "Alicorn Pony" "alicorn">><</cycle>>.
<<nobr>><<do>><<if $playerRace isnot "human">><<include "fluffyQuestions">><</if>><</do>><</nobr>>
<<button "Confirm My Character">><<set $firstLoad to false>><<redo>><</button>>
<<do>>''Confirmed'': You are $playerName, <<print $playerGender.toUpperFirst()>> <<print $playerRace.toUpperFirst()>>. <<if $playerSmarty is true>>You are a Smarty.<<elseif $playerRace isnot "human">>You are not a Smarty.<<elseif $playerRace is "human">><</if>>
<</do>>
<<nobr>>
<<do>><<if $firstLoad is false>>
<<if $playerSmarty is true and $playerRace isnot "human">><<button [[I'm ready to go! @@.icon;.next-arrow;@@|Smarty Start]]>><</button>><</if>>
<<if $playerSmarty is false and $playerRace isnot "human">><<button [[I'm ready to go! @@.icon;.next-arrow;@@|Fluffy Start]]>><</button>><</if>>
<<if $playerRace is "human">><<button [[I'm ready to go! @@.icon;.next-arrow;@@|Human Start]]>><</button>><</if>>
<</if>><</do>>
<</nobr>>Hey all. This is a fun little thing I used to try to learn how to make things in Twine. Don't take it too seriously.
A little about me: I'm <a href="https://fluffy-community.com/u/recent6284/activity" target="_blank">Recent6284 on Fluffy-Community</a> and I mostly want to experiment with Fluffy fiction as I can't draw for shit.
If you want to add any art to any of these pages, feel free to tag me on the boards. When I release an alpha copy of this I'll likely create a thread for it, and things can be tagged there too. I'd also like this to serve as a nice prototype for anyone else trying to use Twine for Fluffy stuff; this is using [[Sugarcube 2|https://www.motoslave.net/sugarcube/2/docs/]] as the Story Format in Twine, which I felt was apt.
I host the source for this [[on GitLab|https://gitlab.com/recent62841/cyoa-fluffy]], and auto-push the latest version I'm working on to [[NeoCities|https://recent6284.neocities.org/]], where you might be reading this. I'll try to use the <a href="https://gitlab.com/recent62841/cyoa-fluffy/-/tree/dev-testing" target="_none"><code>dev-testing</code> branch</a> on GitLab before I publish anything game-breaking, but no guarantees.
You can download the .html file from GitLab if you want to save this for offline play.
!! A small guide
* If there's <<cycle "_examplelink">><<option "different colored text">><<option "a link">><<option "a button">><<option "a text field">><</cycle>>, it's something to interact with.
* Buttons that will make you leave the page will be marked with a "@@.icon;.next-arrow;@@".
* I'll be using variables to track some choices, and some may matter! We'll see how ambitious I get.
The license for this work is [[Attribution-NonCommercial-ShareAlike 4.0 International|https://creativecommons.org/licenses/by-nc-sa/4.0/]].
<<button "Let's begin! @@.icon;.next-arrow;@@" "Character Creation">><</button>>!!You chose a fluffy. Here's some more questions.
!!!Appearance
@@.optionbox;
<<do>>Since you're a fluffy, pick the color of your mane and tail:
Mane and Tail: <<cycle "$playerMane">><<option @@color:blue;Blue>><<option @@color:red;Red>><<option @@color:green;Green>><<option @@color:purple;Purple>><<option @@color:pink;Pink>><<option @@color:yellow;Yellow>><</cycle>>
Fur: <<cycle "$playerFur">><<option Blue>><</cycle>>
<</do>>
@@\
!!!The Smarty Option
@@.optionbox;
<<do>><<if $playerRace isnot "human">>I noticed you wanted to play a fluffy. Do you want to be a smarty?
<label><<checkbox "$playerSmarty" false true `$playerSmarty ? 'checked' : ''`>> Click this box to enable being a smarty.</label><</if>><</do>>
@@
@@color:red;
Please make sure to click "Confirm Character" to lock in your choices.
@@This is the Smarty Start page.
You are <<print $playerName.toUpperFirst()>>, a $playerGender <<print $playerRace.toUpperFirst()>> pony, and you are a //very// smart pony, indeed. You've been trying to make your way in the world, because well, the world owes you a lot.<div id="bug-section">
<span class="icon bug"></span><div id="footergray" class="hidden">Page ID: <span id="page-id"><<print passage()>></span> <<link "(Copy to Clipboard)">><<run setup.copyToClipboard(passage())>><</link>><br>Submit it to <a href="https://fluffy-community.com/t/prototype-dev-thread-choose-your-own-adventure-in-twine/69395" target="_none">the bug tracker</a>.
</div>
</div>
<<script>>
// Wait for the passage to finish rendering
$(document).on(":passageend", function() {
// Add a click event listener to the bug icon
document.getElementById("bug-section").addEventListener("click", function() {
// Toggle the visibility of the footer
var footer = document.getElementById("footergray");
footergray.classList.toggle("hidden");
});
});
<</script>><<script>>
setup.copyToClipboard = function(text) {
// Add the "Page ID: " prefix to the text
var fullText = "Page ID: " + text;
navigator.clipboard.writeText(fullText)
.then(() => {
alert("Copied to clipboard: " + fullText);
})
.catch((error) => {
alert("Failed to copy text: " + error);
});
};
<</script>>