The Guardian's Legacy

Browser lacks capabilities required to play.

Upgrade or switch to another browser.

Loading…

<<set $name to "">> <<set $contentReplaced to false>>  <style> /* Styling for the "Choose Your Weapon" button */ .choose-weapon-button { background-color: #d0403f; /* Red */ color: white; padding: 10px 20px; margin: 10px 0; border: none; cursor: pointer; font-size: 1em; display: inline-block; text-align: center; transition: background-color 0.3s; } .choose-weapon-button:hover { background-color: #a83232; /* Darker Red */ } </style> <div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">The Beginning</h1> <<button "Skip to Full Text">> <<if not $contentReplaced>>  <<set $contentReplaced to true>>  <<replace "#content">> <div id="content"> <span class="fade-in">You find yourself in a quiet, forgotten corner of the world...</span><br><br> <div id="story-text">  <span class="fade-in">[[Doraida|Doraida 1]] — a human village nestled between ancient woods and the imposing peaks of the Gray Mountains. It’s a place untouched by the world’s troubles, where each day blends seamlessly into the next, like pages of an old story.</span><br><br> <span class="fade-in">You are a young adventurer, restless and longing for something beyond the quiet life of Doraida.</span><br><br> <span class="fade-in">One day, the [[village elder|village elder 1]] shared a tale with you — a prophecy, spoken by an oracle ages ago.</span><br><br> <span class="fade-in">The prophecy told of a chosen one, a hero destined to reclaim a hidden [[Artifact|Artifact 1]] within the Dark Forest. This relic of immense power is said to be the kingdom's only hope against a looming darkness, a sinister force that threatens to consume the land of the kingdom and cast shadows over its future.</span><br><br> <span class="fade-in">Some say the Artifact is both a blessing and a curse, capable of bringing prosperity or destruction, depending on the heart of the one who wields it.</span><br><br> <span class="fade-in">Few know the details of the prophecy, but the elder has spent a lifetime studying its secrets and believes that its fulfillment is near.</span><br><br> <span class="fade-in">That night, something strange occurs.</span><br><br> <span class="fade-in">A mysterious glow pulses from deep within the the Dark Forest, casting eerie shadows on the village homes.</span><br><br> <span class="fade-in">The wind carries a whisper, speaking of destiny, of change… of danger.</span><br><br> <span class="fade-in">You feel a pull, a calling, leading you to the forest where the Artifact awaits — and with it, your fate.</span><br><br> <span class="fade-in">Knowing that this day would come, the village elder had prepared for your departure. When the time comes for you to leave, he approaches you with a quiet resolve, offering a choice of weapon to aid you on your journey. <span style="color: darkgreen; font-variant: small-caps; font-weight: bold;">Elder:</span>"I sensed that you would one day seek the Artifact," the elder says, "and have made ready what you may need to face the trials ahead."</span><br><br> </div>  <<if $name == "" || $name is undefined>> <span class="fade-in">Before we proceed, what shall we call you, young adventurer?</span><br> <<textbox "$name" "Enter your name here">><br> <<button "Confirm Name">> <<replace "#confirmation">> <span class="fade-in">Your journey begins here, <<print $name>>.<br><br></span> <button class="choose-weapon-button" onclick="SugarCube.Engine.play('Choose Weapon');">Choose Your Weapon</button> <</replace>> <</button>> <</if>> <div id="confirmation">  <<if $name != "" && $name is not undefined>> <span class="fade-in">Your journey begins here, <<print $name>>.<br><br></span> <button class="choose-weapon-button" onclick="SugarCube.Engine.play('Choose Weapon');">Choose Your Weapon</button> <</if>> </div> </div> <</replace>> <</if>> <</button>> <div id="content"> <span class="fade-in">You find yourself in a quiet, forgotten corner of the world...</span><br><br> <<timed 2s>><span class="fade-in">[[Doraida|Doraida 1]] — a human village nestled between ancient woods and the imposing peaks of the Gray Mountains. It’s a place untouched by the world’s troubles, where each day blends seamlessly into the next, like pages of an old story.</span><br><br><</timed>> <<timed 5s>><span class="fade-in">You are a young adventurer, restless and longing for something beyond the quiet life of Doraida.</span><br><br><</timed>> <<timed 8s>><span class="fade-in">One day, the [[village elder|village elder 1]] shared a tale with you — a prophecy, spoken by an oracle ages ago.</span><br><br><</timed>> <<timed 12s>><span class="fade-in">The prophecy told of a hidden [[Artifact|Artifact 1]] within the Dark Forest, a relic of immense power that could shape the kingdom’s fate. It is said to be the only hope against a looming darkness, a sinister force that has begun to plague the land and cast shadows over the kingdom’s future.</span><br><br><</timed>> <<timed 16s>><span class="fade-in">Some say the Artifact is both a blessing and a curse, capable of bringing prosperity or destruction, depending on the heart of the one who wields it.</span><br><br><</timed>> <<timed 19s>><span class="fade-in">That night, something strange occurs.</span><br><br><</timed>> <<timed 22s>><span class="fade-in">A mysterious glow pulses from deep within the forest, casting eerie shadows on the village homes.</span><br><br><</timed>> <<timed 26s>><span class="fade-in">The wind carries a whisper, speaking of destiny, of change… of danger.</span><br><br><</timed>> <<timed 30s>><span class="fade-in">You feel a pull, a calling, leading you to the forest where the Artifact awaits — and with it, your fate.</span><br><br><</timed>> <<timed 34s>><span class="fade-in">Knowing that this day would come, the village elder had prepared for your departure. When the time comes for you to leave, he approaches you with a quiet resolve, offering a choice of weapon to aid you on your journey.</span><br><br><</timed>> <<timed 38s>><span class="fade-in"><span style="color: darkgreen; font-variant: small-caps; font-weight: bold;">Elder:</span>"I sensed that you would one day seek the Artifact," the elder says, "and have made ready what you may need to face the trials ahead."</span><br><br><</timed>>  <<if $name == "" || $name is undefined>> <<timed 44s>><span class="fade-in">Before we proceed, what shall we call you, young adventurer?</span><br> <<textbox "$name" "Enter your name here">><br> <<button "Confirm Name">> <<replace "#confirmation">> <span class="fade-in">Your journey begins here, <<print $name>>.<br><br></span> <button class="choose-weapon-button" onclick="SugarCube.Engine.play('Choose Weapon');">Choose Your Weapon</button> <</replace>> <</button>><</timed>> <</if>> <div id="confirmation">  <<if $name != "" && $name is not undefined>> <span class="fade-in">Your journey begins here, <<print $name>>.<br><br></span> <button class="choose-weapon-button" onclick="SugarCube.Engine.play('Choose Weapon');">Choose Your Weapon</button> <</if>> </div> </div> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Doraida I</h1> Doraida is a secluded village, shielded from the larger world by towering mountains and dense forests. Founded by travelers seeking refuge, it has grown into a quiet sanctuary where life flows at a gentle pace. The people are resilient and self-sufficient, rarely venturing beyond the village's borders. Yet, rumors persist of ancient forces that slumber beneath the land, waiting for a time to awaken. <img src="https://i.ibb.co/LgDcbx7/DALL-E-2024-11-12-02-32-47-A-scenic-village-named-Doraida-nestled-between-ancient-woods-and-the-impo.webp" width="400" height="auto"/> <<back>> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Village Elder I</h1> The village elder is a wise figure, having lived through many seasons and witnessed the passage of time in [[Doraida|Doraida 1]]. He carries the collective knowledge of the village and is one of the few who know the truth about the prophecy. Some say the elder has spoken with spirits and seen visions of the future, while others whisper that he was once a great adventurer before choosing a life of peace. <img src="https://i.ibb.co/dKNM8XH/DALL-E-2024-11-12-02-50-23-A-realistic-illustration-of-a-wise-elder-character-standing-in-the-foregr.webp" width="400" height="auto"/> <<back>> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Artifact I</h1> Artifacts are ancient and powerful relics, imbued with forces capable of influencing the fate of entire civilizations. They are not bound by the borders of a single kingdom, nor the constraints of time. Across history, these relics have ignited wars, established empires, and brought about the downfall of mighty rulers. Their influence is as far-reaching as it is unpredictable, making them treasures of immeasurable value—and danger. Legends speak of Artifacts as catalysts of change. They are said to hold the essence of natural forces or ancient magic, capable of restoring balance to the world or plunging it into chaos. In their presence, even the most steadfast are tested, for their allure is matched only by the weight of their consequences. Some Artifacts are thought to shape the land itself, while others bend the will of those around them, forging destinies that ripple through generations. Revered and feared in equal measure, Artifacts are protected by Guardians, who ensure their power remains safely out of reach of those with impure intentions. <img src="https://i.postimg.cc/0NFFBKdF/temp-Imagev9m-Yhi.avif" width="400" height="auto"/> <<back>> </div>

<<set $encounteredGuardian to false>> <<set $encounteredSorcerer to false>> <style> /* Button styles for the options */ .option-button { background-color: #d0403f; /* Base red color */ color: white; padding: 10px 20px; margin: 10px 5px; border: none; cursor: pointer; font-size: 1em; display: inline-block; text-align: center; transition: background-color 0.3s; } .option-button:hover { background-color: #a83232; /* Darker red on hover */ } </style> <div id="text-box"> <h1 style="font-size: 2.2em; font-weight: bold; text-align: center; margin-bottom: 25px;">Face the [[Guardian|Guardian]]</h1> <img src="https://i.ibb.co/Vjbt5dP/DALL-E-2024-12-03-20-10-06-A-mystical-forest-clearing-enveloped-in-thick-curling-mist-with-an-ethere.jpg" width="400" height="auto"/> The Guardian’s ghostly form stands resolute before you, its spectral weapon raised as it sizes you up. You take a steadying breath, gripping your <<if $weapon is "sword">>sword<</if>><<if $weapon is "bow">>bow<</if>><<if $weapon is "staff">>staff<</if>>, preparing for the trial that lies ahead. You know this confrontation is more than a battle of skill—it’s a test of your courage and the worthiness of your heart. <<if $weapon is "sword">> With your sword in hand, you feel an immediate surge of confidence. The blade feels perfectly balanced, responding intuitively to your movements. <</if>> <<if $weapon is "bow">> Holding your bow steady, you position yourself with calculated precision. The tension in the string feels familiar, and you mentally prepare for a battle that requires both agility and accuracy.<</if>> <<if $weapon is "staff">> Your staff hums with latent energy, its surface warm under your grip. You focus your thoughts, channeling mana into the staff, preparing for a confrontation that will test your magical prowess and mental fortitude. <</if>> The Guardian moves first, lunging with an otherworldly speed that forces you to react instinctively. <<if $weapon is "sword">> You parry its strike effortlessly, the sword's sharp edge glinting as it deflects the Guardian’s spectral blade. Each clash sends vibrations through your arms, but your training with the sword allows you to maintain control and counterattack with swift, decisive blows. <</if>> <<if $weapon is "bow">> You swiftly dodge the Guardian’s initial strike, drawing an arrow from your quiver. With practiced precision, you release the arrow, aiming for a weak spot. The arrow finds its mark, but the Guardian's agility makes it difficult to land consistent hits, prolonging the battle.<</if>> <<if $weapon is "staff">> As the Guardian lunges, you raise your staff, conjuring a barrier of magical energy that absorbs the impact. You retaliate with a burst of mana, sending a wave of force towards the Guardian. The duel becomes a dance of spells and strikes, each requiring intense concentration and quick reflexes.<</if>> As the battle intensifies, you begin to feel the weight of the Guardian’s silent scrutiny, as if it’s probing deeper into your soul with each exchange. It’s as though the Guardian is not merely fighting you, but measuring your intent, searching for any shadow of doubt or selfishness. Every strike you land and every dodge you make seem to unlock fragments of understanding—the Guardian’s purpose, its duty to protect, and the burden it carries for those who seek the Artifact’s power. <<if $weapon is "sword">> Your mastery with the sword allows you to anticipate the Guardian’s moves. Each powerful swing weakens its resolve, your strikes fueled by unwavering determination. The Guardian begins to falter under your relentless assault, its form flickering more frequently. <</if>> <<if $weapon is "bow">> Your strategic shots with the bow gradually erode the Guardian’s defenses. However, maintaining precision while evading its swift attacks drains your stamina, making each subsequent arrow more challenging to aim accurately. The Guardian’s persistence tests your endurance and focus. <</if>> <<if $weapon is "staff">> The continuous casting of spells takes a toll on your energy reserves. Balancing offense and defense becomes increasingly taxing as the Guardian's relentless onslaught pushes you to your limits. Each spell must be perfectly timed to counter its attacks, requiring immense mental resilience. <</if>> Finally, with one final, determined blow, you strike the Guardian’s form, and it stumbles back, flickering as if made of smoke. It regards you for a moment, its gaze softened, almost approving. Slowly, the Guardian lowers its weapon, a silent acknowledgment of your worthiness. It dissolves back into the mist, leaving the path to the Artifact unobstructed. You catch your breath, standing alone in the clearing as the eerie silence returns. The Luminous Artifact pulses before you, inviting you to approach. But as you take a step forward, you hear a faint rustling in the bushes behind you. The sound is unmistakable—someone is approaching, moving carefully yet swiftly, closing in on your position. A dark figure cloaked in robes emerges from the edge of the clearing, though they haven't yet noticed you. You realize you only have a moment to act before they spot you. The figure's gaze sweeps across the scene, eyes flickering toward the faint glow of the Artifact, a silent confirmation that they too have come for it. The seconds tick by, and you know you must make a choice. Will you confront this mysterious figure head-on, or hide behind a nearby tree to observe them before making a move?  <button class="option-button" onclick="SugarCube.Engine.play('Confront Figure');">Confront the figure</button> <button class="option-button" onclick="SugarCube.Engine.play('Hide Tree');">Hide behind a tree</button> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Artifact II</h1> Artifacts are ancient and powerful relics, imbued with forces capable of influencing the fate of entire civilizations. They are not bound by the borders of a single kingdom, nor the constraints of time. Across history, these relics have ignited wars, established empires, and brought about the downfall of mighty rulers. Their influence is as far-reaching as it is unpredictable, making them treasures of immeasurable value—and danger. Legends speak of Artifacts as catalysts of change. They are said to hold the essence of natural forces or ancient magic, capable of restoring balance to the world or plunging it into chaos. In their presence, even the most steadfast are tested, for their allure is matched only by the weight of their consequences. Some Artifacts are thought to shape the land itself, while others bend the will of those around them, forging destinies that ripple through generations. Revered and feared in equal measure, Artifacts are protected by Guardians, who ensure their power remains safely out of reach of those with impure intentions. The Luminous Artifact is a mysterious, glowing relic rumored to hold immense power. It’s said to be as old as the forest itself, with inscriptions in a forgotten language that only the most learned scholars could decipher. Its appearance resembles a small orb, pulsing faintly with an inner light, and its surface is smooth yet warm to the touch. Many believe it holds the power to shape the fate of the kingdom, but whether it will save or doom the land remains unknown. Legends speak of the Luminous Artifact's ability to restore balance to the kingdom by channeling the life force of the land itself. Bound within its core is the essence of the ancient forest and the strength of generations who once protected this realm. In the hands of a worthy soul, the Luminous Artifact’s energy could banish the spreading darkness, healing the blight that threatens the kingdom’s people, land, and creatures. However, such power is not without risk. <img src="https://i.postimg.cc/0NFFBKdF/temp-Imagev9m-Yhi.avif" width="400" height="auto"/> <<back>> </div>

<<set $encounteredGuardian to true>> <<set $encounteredSorcerer to true>> <style> /* Button styles for the options */ .option-button { background-color: #d0403f; /* Base red color */ color: white; padding: 10px 20px; margin: 10px 5px; border: none; cursor: pointer; font-size: 1em; display: inline-block; text-align: center; transition: background-color 0.3s; } .option-button:hover { background-color: #a83232; /* Darker red on hover */ } /* Optional: Style the dialogue for consistency */ .dialogue { color: darkred; font-variant: small-caps; font-weight: bold; } </style> <div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Engage in Combat</h1> The air crackles with tension as you prepare to confront the sorcerer. His dark magic swirls around him, shadows coiling at his feet like serpents ready to strike. You tighten your grip on your <<print $weapon>>, knowing this confrontation will test your every skill. <<if $weapon is "staff">> Using your staff, you feel a surge of confidence. Its length provides you with ample distance to react to the sorcerer's attacks, and its sturdy construction allows you to block incoming spells effectively. The sorcerer unleashes wave after wave of dark magic, each more potent than the last. You pivot and leap, using your staff to deflect the spells when necessary, but primarily focusing on evading the relentless barrage. The ground trembles as dark energy collides with your defenses, yet your enhanced agility and reflexes keep you one step ahead. With a final, powerful spell, the sorcerer reaches for the Luminous Artifact, its glow drawing him closer. Before you can react, he snatches the Artifact, the energy from his magic knocking you off your feet as he vanishes into the mist with a chilling promise. <span class="dialogue">Sorcerer:</span> “Your strength is admirable,” he says, “but this is not over.” The clearing falls silent as you catch your breath, frustration mingling with the sense of loss. The Luminous Artifact, the very thing you fought so hard to protect, is now in the hands of someone whose intentions are anything but noble. The sorcerer’s parting words echo in your mind, a reminder that this confrontation is far from finished. You know that letting him escape may have dire consequences—not only for you but for the entire kingdom. <</if>> <<if $weapon is "bow">> Armed with your bow, you rely on precision and agility to navigate the sorcerer's dark onslaught. The sorcerer fires bolts of magic your way, each one faster and more unpredictable than the last. You nimbly sidestep and weave through his attacks, your bow poised to respond if an opening appears. However, maintaining both offense and defense proves challenging as the sorcerer's spells grow more intense, leaving you little room to strike back. He conjures a barrier of dark magic, forcing you to move constantly to avoid the onslaught. Every evasive maneuver keeps you one step ahead, but the relentless assault takes its toll. With a swift incantation, he creates a vortex of shadows that envelops the area, and in a flash, he grasps the Luminous Artifact, disappearing into the shadows with a cold smile. <span class="dialogue">Sorcerer:</span> "This is not over." The clearing falls silent as you catch your breath, frustration mingling with the sense of loss. The Luminous Artifact, the very thing you fought so hard to protect, is now in the hands of someone whose intentions are anything but noble. The sorcerer’s parting words echo in your mind, a reminder that this confrontation is far from finished. You know that letting him escape may have dire consequences—not only for you but for the entire kingdom. <</if>> <<if $weapon is "sword">> Wielding your sword, you brace yourself for a more direct and intense confrontation. The sorcerer unleashes a barrage of dark energy blasts, each one aimed with deadly precision. You swiftly dodge to the side, your sword serving both as a shield and a guide as you maneuver through his relentless attacks. Every parry and strike demands your utmost focus, as balancing offense and defense becomes increasingly difficult under the sorcerer's onslaught. Shadows twist and lunge at you from all directions, testing your agility and endurance. Despite your best efforts to counterattack, the sorcerer's power overwhelms your defenses. He closes the distance with alarming speed, his hand outstretched to seize the Luminous Artifact. With a final surge of dark energy, he snatches the Artifact from its resting place, vanishing into the darkness with a sinister laugh. <span class="dialogue">Sorcerer:</span> "This is far from over," he sneers, retreating into the mist with the Artifact in hand. The clearing falls silent as you catch your breath, frustration mingling with the sense of loss. The Luminous Artifact, the very thing you fought so hard to protect, is now in the hands of someone whose intentions are anything but noble. The sorcerer’s parting words echo in your mind, a reminder that this confrontation is far from finished. You know that letting him escape may have dire consequences—not only for you but for the entire kingdom. <</if>>  <button class="option-button" onclick="SugarCube.Engine.play('Pursue Sorcerer');">Pursue the sorcerer</button> <button class="option-button" onclick="SugarCube.Engine.play('Village Elder');">Return to the village</button> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Village Elder II</h1> The village elder is a wise figure, having lived through many seasons and witnessed the passage of time in [[Doraida|Doraida 1]]. He carries the collective knowledge of the village and is one of the few who know the truth about the prophecy. Some say the elder has spoken with spirits and seen visions of the future, while others whisper that he was once a great adventurer before choosing a life of peace. Since your journey with the Luminous Artifact, whispers around the village suggest there is more to the elder’s past than you first knew. You come to learn that he was once a [[Guardian|Guardian]] himself—a keeper of secrets and a protector of powerful relics much like the Luminous Artifact. In his youth, he is said to have ventured to the far reaches of the kingdom, seeking knowledge of ancient magic and learning from sages hidden deep within the mountains. His travels were filled with encounters with mystical forces, and he acquired wisdom that now guides him in his role as elder. It’s even said that he once wielded an [[Artifact|Artifact 3]] himself, though not the one you recovered. His own journey, however, ended in a difficult choice—a choice to leave that power behind and return to the quiet life of Doraida, where he could serve as a guide for others. He alone understands the weight of what you have now experienced, for he, too, has known the cost of such power and the responsibility it brings. The elder’s understanding of the prophecy and his connection to ancient magic now makes sense in a way it didn’t before. His calm demeanor, his watchful gaze, and his patience with the villagers are born not only of age but of lived experience. He remains a quiet Guardian of knowledge, choosing a life of peace, yet ever watchful for the next generation who may need his guidance. <img src="https://i.ibb.co/dKNM8XH/DALL-E-2024-11-12-02-50-23-A-realistic-illustration-of-a-wise-elder-character-standing-in-the-foregr.webp" width="400" height="auto"/> <<back>> </div>

<<set $contentReplaced to false>>  <style> /* Button styles for the options */ .option-button { background-color: #d0403f; /* Base red color */ color: white; padding: 10px 20px; margin: 10px 5px; border: none; cursor: pointer; font-size: 1em; display: inline-block; text-align: center; transition: background-color 0.3s; } .option-button:hover { background-color: #a83232; /* Darker red on hover */ } </style> <div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">The Hero Returns</h1> <<button "Skip to Full Text">> <<if not $contentReplaced>>  <<set $contentReplaced to true>>  <<replace "#ending-content">> <div id="ending-content"> <span class="fade-in">You approach the village elder, your steps steady yet weighted with the immense power now coursing through you. The elder’s eyes meet yours, filled with a mixture of pride, respect, and perhaps even relief. They nod knowingly, sensing that you have not only returned with the Artifact, but also with an understanding of its true purpose and the balance it demands.</span><br><br> <span class="fade-in">As you recount your journey—the trials in the forest, the battle with the sorcerer, and the visions imparted by the Luminous Artifact—the elder listens in silence, his expression grave. When you finish, they take a deep breath and place a gentle hand on your shoulder.</span><br><br> <span class="fade-in"><span style="color: darkgreen; font-variant: small-caps; font-weight: bold;">Elder:</span> “The Artifact has chosen you,” he says, his voice filled with reverence. “Its power is not easily wielded, nor is its burden light. But I see now that you are ready.”</span><br><br> <span class="fade-in">With your newfound knowledge, you unlock the secrets of the Luminous Artifact, deciphering the ancient inscriptions and tapping into its dormant energy. The Artifact hums in your hands, its light growing brighter as you channel its power, sending waves of healing energy out into the land.</span><br><br> <span class="fade-in">The darkness that has plagued the kingdom begins to dissipate, retreating under the Luminous Artifact’s influence. Rivers flow clean, crops begin to flourish, and the air itself feels lighter, filled with the renewed vitality of a kingdom restored.</span><br><br> <span class="fade-in">The villagers of Doraida gather around, watching in awe as the land responds to the Artifact’s magic. Smiles break out, and cheers of joy and gratitude rise up as they witness the kingdom’s rebirth.</span><br><br> <span class="fade-in">You look upon the faces of those you have saved—friends, families, people who may never know the full extent of your journey but who will live in the peace you have created.</span><br><br> <span class="fade-in">The elder turns to you, bowing his head in a rare show of respect.</span><br><br> <span class="fade-in"><span style="color: darkgreen; font-variant: small-caps; font-weight: bold;">Elder:</span> “The kingdom owes you its life, <<print $name>>, as do we all. You have fulfilled the prophecy, and in doing so, you have become a legend—a hero whose story will be told for generations.”</span><br><br> <span class="fade-in">The weight of the Luminous Artifact lessens in your hands, its purpose fulfilled. Though it will always be a part of you, its power now lies dormant, waiting for the next soul who may one day need it to protect the kingdom.</span><br><br> <span class="fade-in"><span style="color: goldenrod; font-weight: bold;">Congratulations!</span> You have completed your quest and saved both the kingdom and [[Doraida|Doraida 2]]. Your journey has come to an end, but the legacy of your heroism will endure.</span><br><br> <img src="https://i.postimg.cc/G22Jph6V/temp-Image0-Xnj0-P.avif" width="400" height="auto"/><br><br>  <span class="fade-in"> <button class="option-button" onclick="SugarCube.Engine.play('Start');">Restart your adventure</button></span> </div> <</replace>> <</if>> <</button>>  <div id="ending-content"> <<timed 3s>><span class="fade-in">You approach the village elder, your steps steady yet weighted with the immense power now coursing through you. The elder’s eyes meet yours, filled with a mixture of pride, respect, and perhaps even relief. They nod knowingly, sensing that you have not only returned with the Artifact, but also with an understanding of its true purpose and the balance it demands.</span><br><br><</timed>> <<timed 6s>><span class="fade-in">As you recount your journey—the trials in the forest, the battle with the sorcerer, and the visions imparted by the Luminous Artifact—the elder listens in silence, his expression grave. When you finish, they take a deep breath and place a gentle hand on your shoulder.</span><br><br><</timed>> <<timed 9s>><span class="fade-in"><span style="color: darkgreen; font-variant: small-caps; font-weight: bold;">Elder:</span> “The Artifact has chosen you,” he says, his voice filled with reverence. “Its power is not easily wielded, nor is its burden light. But I see now that you are ready.”</span><br><br><</timed>> <<timed 12s>><span class="fade-in">With your newfound knowledge, you unlock the secrets of the Luminous Artifact, deciphering the ancient inscriptions and tapping into its dormant energy. The Artifact hums in your hands, its light growing brighter as you channel its power, sending waves of healing energy out into the land.</span><br><br><</timed>> <<timed 15s>><span class="fade-in">The darkness that has plagued the kingdom begins to dissipate, retreating under the Luminous Artifact’s influence. Rivers flow clean, crops begin to flourish, and the air itself feels lighter, filled with the renewed vitality of a kingdom restored.</span><br><br><</timed>> <<timed 18s>><span class="fade-in">The villagers of Doraida gather around, watching in awe as the land responds to the Artifact’s magic. Smiles break out, and cheers of joy and gratitude rise up as they witness the kingdom’s rebirth.</span><br><br><</timed>> <<timed 21s>><span class="fade-in">You look upon the faces of those you have saved—friends, families, people who may never know the full extent of your journey but who will live in the peace you have created.</span><br><br><</timed>> <<timed 24s>><span class="fade-in">The elder turns to you, bowing his head in a rare show of respect.</span><br><br><</timed>> <<timed 27s>><span class="fade-in"><span style="color: darkgreen; font-variant: small-caps; font-weight: bold;">Elder:</span> “The kingdom owes you its life, <<print $name>>, as do we all. You have fulfilled the prophecy, and in doing so, you have become a legend—a hero whose story will be told for generations.”</span><br><br><</timed>> <<timed 30s>><span class="fade-in">The weight of the Luminous Artifact lessens in your hands, its purpose fulfilled. Though it will always be a part of you, its power now lies dormant, waiting for the next soul who may one day need it to protect the kingdom.</span><br><br><</timed>> <<timed 33s>><span class="fade-in"><span style="color: goldenrod; font-weight: bold;">Congratulations!</span> You have completed your quest and saved both the kingdom and [[Doraida|Doraida 2]]. Your journey has come to an end, but the legacy of your heroism will endure.</span><br><br><</timed>> <<timed 36s>><img src="https://i.postimg.cc/G22Jph6V/temp-Image0-Xnj0-P.avif" width="400" height="auto"/><br><br><</timed>> <<timed 38s>> <span class="fade-in"> <button class="option-button" onclick="SugarCube.Engine.play('Start');">Restart your adventure</button> </span> <</timed>> </div> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Artifact III</h1> Artifacts are ancient and powerful relics, imbued with forces capable of influencing the fate of entire civilizations. They are not bound by the borders of a single kingdom, nor the constraints of time. Across history, these relics have ignited wars, established empires, and brought about the downfall of mighty rulers. Their influence is as far-reaching as it is unpredictable, making them treasures of immeasurable value—and danger. Legends speak of Artifacts as catalysts of change. They are said to hold the essence of natural forces or ancient magic, capable of restoring balance to the world or plunging it into chaos. In their presence, even the most steadfast are tested, for their allure is matched only by the weight of their consequences. Some Artifacts are thought to shape the land itself, while others bend the will of those around them, forging destinies that ripple through generations. Revered and feared in equal measure, Artifacts are protected by Guardians, who ensure their power remains safely out of reach of those with impure intentions. The Luminous Artifact is a mysterious, glowing relic rumored to hold immense power. It’s said to be as old as the Dark Forest itself, with inscriptions in a forgotten language that only the most learned scholars could decipher. Its appearance resembles a small orb, pulsing faintly with an inner light, and its surface is smooth yet warm to the touch. Many believe it holds the power to shape the fate of the kingdom, but whether it will save or doom the land remains unknown. Legends speak of the Luminous Artifact's ability to restore balance to the kingdom by channeling the life force of the land itself. Bound within its core is the essence of the ancient forest and the strength of generations who once protected this realm. In the hands of a worthy soul, the Luminous Artifact’s energy could banish the spreading darkness, healing the blight that threatens the kingdom’s people, land, and creatures. However, such power is not without risk. The Luminous Artifact’s magic is potent and unpredictable. It is said that to wield it for salvation requires a sacrifice—an offering of life energy that binds the user to the Artifact’s purpose. Some fear that the price might be too great, warning that misuse could awaken ancient forces, unleashing chaos rather than peace. Thus, the Luminous Artifact remains shrouded in mystery and caution, a relic that could either renew the kingdom or bring about its end, depending on the heart and intent of its bearer. <img src="https://i.postimg.cc/0NFFBKdF/temp-Imagev9m-Yhi.avif" width="400" height="auto"/> <<back>> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">Doraida II</h1> Doraida is a secluded village, shielded from the larger world by towering mountains and dense forests. Founded by travelers seeking refuge, it has grown into a quiet sanctuary where life flows at a gentle pace. The people are resilient and self-sufficient, rarely venturing beyond the village's borders. Yet, rumors persist of ancient forces that slumber beneath the land, waiting for a time to awaken. But now, the villagers tell a story—of a time when shadows crept across the land, and a darkness threatened to consume their peaceful valley. In those days, a prophecy spoke of a chosen one, a hero who would rise to reclaim an ancient Artifact and drive the darkness away. One fateful night, the hero appeared, venturing deep into the forest to face the unknown. They returned with the Luminous Artifact, and with it, light and peace were restored to Doraida. The darkness faded, and the village was once again safe. Today, the hero is remembered as a legend in Doraida—a figure of courage and sacrifice, whose story is passed down through the generations, inspiring all who call this land their home. <img src="https://i.ibb.co/LgDcbx7/DALL-E-2024-11-12-02-32-47-A-scenic-village-named-Doraida-nestled-between-ancient-woods-and-the-impo.webp" width="400" height="auto"/> <<back>> </div>

<div id="text-box"> <h1 style="font-size: 2em; font-weight: bold; text-align: center; margin-bottom: 20px;">The Guardian</h1> Guardians are powerful protectors bound to sacred relics called Artifacts, entrusted with their defense and preservation across the ages. Their purpose transcends mere guardianship; they serve as stewards of balance, ensuring that these powerful relics do not fall into the hands of those unworthy or driven by selfish ambition. While often regarded as solitary figures shrouded in mystery, Guardians come from diverse backgrounds and species—humans, elves, spirits, and even enchanted creatures of nature. Each Guardian is chosen not for their physical prowess alone but for their unwavering resolve, their connection to the relic’s purpose, and their willingness to sacrifice personal desires for the greater good. Becoming a Guardian is both an honor and a burden, requiring a bond to the relic that often transforms the individual, tying their essence to its purpose. <<back>> </div>

<div id="game-info"> <p>Defeat the Guardian before it overpowers you</p> <p>Time Left: <span id="time-left">10</span> seconds</p> <p>Targets Left: <span id="targets-left">0</span></p> </div> <div id="game-area">  </div> <div id="button-container"> <button id="start-game-button" onclick="startMinigame()">Fight Guardian</button> <button id="stop-game-button" onclick="endMinigame(false, false)">Stop Fighting</button> </div>  <style> /* Game info section */ #game-info { position: absolute; top: 100px; left: 520px; text-align: center; font-size: 18px; color: #000000; /* Black text */ margin-bottom: 10px; /* Space between game info and game area */ } /* Style for the instruction text */ #game-info p:first-of-type { font-size: 18px; /* Adjust font size as desired */ font-weight: bold; /* Makes the instruction text stand out */ margin: 0 0 10px 0; /* Adds space below this line only */ color: #333333; /* Adjust color to match your theme */ } /* Game area container */ #game-area { position: absolute; /* Allows precise positioning */ top: 370px; /* Adjust this value to move the game area vertically */ left: 520px; /* Adjust this value to move the game area horizontally */ width: 400px; height: 300px; border: 2px solid #333; background-color: #f0f0f0; margin: 0; /* Remove default margin to avoid unintended shifts */ overflow: hidden; /* Prevent targets from overflowing */ } /* Clickable targets styled as circles */ .click-target { position: absolute; width: 65px; /* Adjust width for circular shape */ height: 65px; /* Make height equal to width for a perfect circle */ background-color: #87CEEB; border: none; color: white; cursor: pointer; font-size: 14px; display: none; /* Initially hidden */ border-radius: 50%; /* Makes the targets circular */ justify-content: center; align-items: center; /* Removed the duplicate display property */ } /* Hover effect for targets */ .click-target:hover { background-color: #5a9bcf; color: #ffffff; /* Keeps the text white on hover */ } /* Button container for Start and Stop buttons */ #button-container { position: absolute; top: 640px; left: 650px; text-align: center; margin-top: 10px; /* Space between buttons and game area */ } /* Position and style for Start and Stop buttons */ #start-game-button, #stop-game-button { margin: 5px; padding: 10px 15px; background-color: #d0403f; color: #ffffff; border: none; border-radius: 5px; cursor: pointer; font-size: 14px; transition: background-color 0.3s; } #start-game-button:hover, #stop-game-button:hover { background-color: #a83232; } /* Styling for the Guardian image inside targets */ .guardian-image { width: 60px; /* Adjust the size as needed */ height: 60px; /* Maintain aspect ratio */ pointer-events: none; /* Allow clicks to pass through to the button */ } </style>  <script> // Game variables let timeLeft = 10; // Total time for the game let targetsLeft = 0; // Will be set based on weapon let currentTarget = 1; // Keeps track of the current target to click let countdownInterval; let gameActive = false; // Mapping of weapons to number of targets const weaponTargetCounts = { "sword": 12, "bow": 14, "staff": 16 }; // Constants for game area and button size const GAME_AREA_WIDTH = 400; // in pixels const GAME_AREA_HEIGHT = 300; // in pixels const BUTTON_SIZE = 65; // width and height in pixels (matches .click-target size) // Function to start the game window.startMinigame = function() { console.log("Start Minigame clicked."); // Prevent starting the game if it's already active if (gameActive) { console.log("Game is already active. Ignoring start request."); return; } // Retrieve the selected weapon from SugarCube variables const weapon = SugarCube.State.variables.weapon || "sword"; // Default to sword if undefined console.log("Selected Weapon:", weapon); // Determine the number of targets based on the weapon const targetCount = weaponTargetCounts[weapon] || 15; // Default to 15 if weapon not found console.log("Target Count:", targetCount); // Set game variables targetsLeft = targetCount; timeLeft = 10; currentTarget = 1; gameActive = true; // Update UI elements document.getElementById('time-left').innerText = timeLeft; document.getElementById('targets-left').innerText = targetsLeft; // Disable the Start button to prevent multiple clicks document.getElementById('start-game-button').disabled = true; document.getElementById('start-game-button').style.opacity = "0.6"; document.getElementById('start-game-button').style.cursor = "not-allowed"; // Remove any existing targets removeAllTargets(); // Create and show the first target createAndShowTarget(currentTarget); // Start countdown timer countdownInterval = setInterval(countdown, 1000); } // Countdown function function countdown() { if (timeLeft > 0) { timeLeft--; document.getElementById('time-left').innerText = timeLeft; console.log("Time Left:", timeLeft); } else { console.log("Time ran out."); endMinigame(false, true); // End the game with failure due to time running out } } // Function to create and show a target button function createAndShowTarget(targetNumber) { console.log("Creating and showing target:", targetNumber); const gameArea = document.getElementById('game-area'); const button = document.createElement('button'); button.classList.add('click-target'); button.id = `target-${targetNumber}`; // Replace innerText with an image button.innerHTML = `<img src="https://i.ibb.co/wQCbk30/shield-3d-rendering-icon-illustration.png" alt="Guardian" class="guardian-image">`; button.onclick = function() { clickTarget(targetNumber); }; // Customize target appearance based on weapon const weapon = SugarCube.State.variables.weapon || "sword"; if (weapon === "sword") { button.style.backgroundColor = "#C0C0C0"; // Silver for sword } else if (weapon === "bow") { button.style.backgroundColor = "#8B4513"; // Brown for bow } else if (weapon === "staff") { button.style.backgroundColor = "#FFD700"; // Gold for staff } gameArea.appendChild(button); // Calculate random positions within bounds const maxTop = GAME_AREA_HEIGHT - BUTTON_SIZE; const maxLeft = GAME_AREA_WIDTH - BUTTON_SIZE; const randomTop = Math.floor(Math.random() * maxTop); const randomLeft = Math.floor(Math.random() * maxLeft); button.style.top = `${randomTop}px`; button.style.left = `${randomLeft}px`; button.style.display = 'flex'; // Flex for centering console.log(`Target ${targetNumber} positioned at (${randomLeft}px, ${randomTop}px).`); } // Function to remove all target buttons function removeAllTargets() { console.log("Removing all existing targets."); const gameArea = document.getElementById('game-area'); const existingTargets = gameArea.querySelectorAll('.click-target'); existingTargets.forEach(target => target.remove()); } // Function to handle clicks on targets function clickTarget(targetNumber) { console.log("Target clicked:", targetNumber); if (targetNumber === currentTarget && gameActive) { targetsLeft--; document.getElementById('targets-left').innerText = targetsLeft; console.log("Targets Left:", targetsLeft); // Hide and remove the clicked target const target = document.getElementById(`target-${targetNumber}`); if (target) { target.style.display = 'none'; target.remove(); console.log("Target removed:", targetNumber); } // Move to the next target currentTarget++; if (targetsLeft === 0) { console.log("All targets defeated. Success!"); endMinigame(true, false); // End the game with success } else { // Create and show the next target createAndShowTarget(currentTarget); } } else { console.log("Clicked target is not the current target or game is inactive."); } } // Function to end the game function endMinigame(success, ranOutOfTime = false) { console.log("Ending game. Success:", success, "Ran Out Of Time:", ranOutOfTime); clearInterval(countdownInterval); gameActive = false; // Remove all targets removeAllTargets(); // Enable the Start button again const startButton = document.getElementById('start-game-button'); startButton.disabled = false; startButton.style.opacity = "1"; startButton.style.cursor = "pointer"; // Show result message or redirect to next passage if (success) { alert("You succeeded! You defeated the Guardian in time."); // Link to the next passage in Twine SugarCube.Engine.play('Face Guardian'); } else if (ranOutOfTime) { alert("Game over! You ran out of time."); } else { alert("You chose to stop the game."); } } // Ensure the stop button works correctly without duplicating targets document.addEventListener("DOMContentLoaded", function() { const stopButton = document.getElementById('stop-game-button'); if (stopButton) { stopButton.onclick = function() { if (gameActive) { console.log("Stop Minigame clicked."); endMinigame(false, false); // Stopping the game manually } else { console.log("Stop Minigame clicked, but game is not active."); } }; } }); </script>

<div id="evade-game-info"> <p>Use the arrow keys to evade the Sorcerer's attacks until the time runs out</p> <p>Time Left: <span id="evade-time-left">0</span> seconds</p> </div> <div id="evade-game-area"> <div id="evade-player"></div> <div class="evade-sorcerer" id="evade-sorcerer-1"></div> <div class="evade-sorcerer" id="evade-sorcerer-2"></div> <div class="evade-sorcerer" id="evade-sorcerer-3"></div> </div> <div id="evade-button-container"> <button id="start-evade-game-button">Start Evading</button> <button id="stop-evade-game-button">Stop Evading</button> </div>  <style> /* Center the game area vertically and horizontally */ #passage { display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; flex-direction: column; } /* Game info section */ #evade-game-info { position: absolute; top: 100px; left: 440px; text-align: center; font-size: 18px; color: #000000; margin-bottom: 20px; } #evade-game-info p:first-of-type { font-weight: bold; font-size: 18px; margin: 0 0 10px 0; color: #333333; /* Slightly darker for emphasis */ } /* Game area container */ #evade-game-area { position: absolute; top: 370px; left: 520px; width: 400px; height: 300px; border: 2px solid #333; background-color: #f0f0f0; overflow: hidden; } /* Player styling */ #evade-player { position: absolute; width: 30px; height: 30px; background-color: #4CAF50; /* Green for player */ top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; z-index: 2; /* Ensure player is above sorcerers */ } /* Sorcerer styling */ .evade-sorcerer { position: absolute; width: 30px; height: 30px; background-color: #FF0000; /* Default red for sorcerers */ border-radius: 50%; display: none; /* Initially hidden */ z-index: 1; /* Below the player */ } /* Button container for Start and Stop buttons */ #evade-button-container { position: absolute; top: 640px; left: 650px; margin-top: 10px; text-align: center; } /* Position and style for Start and Stop buttons */ #start-evade-game-button, #stop-evade-game-button { margin: 5px; padding: 10px 15px; background-color: #d0403f; color: #ffffff; border: none; border-radius: 5px; cursor: pointer; font-size: 14px; transition: background-color 0.3s; } #start-evade-game-button:hover, #stop-evade-game-button:hover { background-color: #a83232; } </style>  <script> // Evading game variables let evadeGameTimeLeft = 0; // Initial time set to 0 let evadeGameInterval; let evadeGameActive = false; let evadePlayerSpeed = 15; let evadeSorcererSpeed = 1; let gameEnded = false; // DOM Elements const evadePlayerElement = document.getElementById('evade-player'); const evadeGameArea = document.getElementById('evade-game-area'); const evadeSorcerers = Array.from(document.getElementsByClassName('evade-sorcerer')); const evadeTimeLeftDisplay = document.getElementById('evade-time-left'); // Player Position let evadePlayerPosition = { x: 200, y: 150 }; // Sorcerer initial positions let evadeSorcererPositions = [ { x: 50, y: 0 }, { x: 350, y: 0 }, { x: 200, y: 0 } ]; // Mapping of weapons to their corresponding sorcerer colors const weaponColorMap = { "sword": "#C0C0C0", // Silver "bow": "#8B4513", // Brown "staff": "#FFD700" // Gold }; // Function to start the evading game function startEvadeGame() { console.log("Start Evade Game clicked."); // Prevent starting the game if it's already active if (evadeGameActive) { console.log("Evade game is already active. Ignoring start request."); return; } // Retrieve the weapon from Twine's state variables const weapon = SugarCube.State.variables.weapon || "sword"; // Default to sword if undefined console.log("Selected Weapon:", weapon); // Map weapons to their corresponding evade times const weaponTimeMap = { "sword": 16, "bow": 14, "staff": 12 }; // Set evadeGameTimeLeft based on the chosen weapon, default to 10 if undefined evadeGameTimeLeft = weaponTimeMap[weapon] || 10; console.log(`Weapon chosen: ${weapon}, Time Left: ${evadeGameTimeLeft} seconds`); // Initialize game variables evadeGameActive = true; gameEnded = false; evadeTimeLeftDisplay.innerText = evadeGameTimeLeft; evadePlayerPosition = { x: 200, y: 150 }; evadePlayerElement.style.top = `${evadePlayerPosition.y}px`; evadePlayerElement.style.left = `${evadePlayerPosition.x}px`; // Initialize sorcerers evadeSorcererPositions = [ { x: 50, y: 0 }, { x: 350, y: 0 }, { x: 200, y: 0 } ]; // Determine sorcerer color based on weapon const sorcererColor = weaponColorMap[weapon] || "#FF0000"; // Default red evadeSorcerers.forEach((sorcerer, index) => { const pos = evadeSorcererPositions[index]; sorcerer.style.top = `${pos.y}px`; sorcerer.style.left = `${pos.x}px`; sorcerer.style.backgroundColor = sorcererColor; // Apply color based on weapon sorcerer.style.display = 'block'; // Make sorcerers visible }); // Disable the Start button to prevent multiple clicks const startButton = document.getElementById('start-evade-game-button'); startButton.disabled = true; startButton.style.opacity = "0.6"; startButton.style.cursor = "not-allowed"; // Remove any existing movement or event listeners if any document.removeEventListener('keydown', moveEvadingPlayer); // Add event listener for player movement document.addEventListener('keydown', moveEvadingPlayer); // Start countdown timer evadeGameInterval = setInterval(evadingCountdown, 1000); // Start moving sorcerers moveEvadingSorcerers(); } // Countdown timer function for evading game function evadingCountdown() { if (evadeGameTimeLeft > 0) { evadeGameTimeLeft--; evadeTimeLeftDisplay.innerText = evadeGameTimeLeft; console.log("Evading Game Time Left:", evadeGameTimeLeft); } else { console.log("Evading game time ran out."); endEvadeGame(true); } } // Function to move the Player using arrow keys function moveEvadingPlayer(event) { if (!evadeGameActive) return; const playerRadius = evadePlayerElement.offsetWidth / 2; const gameAreaWidth = evadeGameArea.clientWidth; const gameAreaHeight = evadeGameArea.clientHeight; switch (event.key) { case 'ArrowUp': evadePlayerPosition.y = Math.max(playerRadius, evadePlayerPosition.y - evadePlayerSpeed); break; case 'ArrowDown': evadePlayerPosition.y = Math.min(gameAreaHeight - playerRadius, evadePlayerPosition.y + evadePlayerSpeed); break; case 'ArrowLeft': evadePlayerPosition.x = Math.max(playerRadius, evadePlayerPosition.x - evadePlayerSpeed); break; case 'ArrowRight': evadePlayerPosition.x = Math.min(gameAreaWidth - playerRadius, evadePlayerPosition.x + evadePlayerSpeed); break; default: // Ignore other keys return; } evadePlayerElement.style.top = `${evadePlayerPosition.y}px`; evadePlayerElement.style.left = `${evadePlayerPosition.x}px`; checkEvadeCollision(); } // Function to move Sorcerers toward the Player function moveEvadingSorcerers() { if (!evadeGameActive) return; const sorcererRadius = evadeSorcerers[0].offsetWidth / 2; const gameAreaWidth = evadeGameArea.clientWidth; const gameAreaHeight = evadeGameArea.clientHeight; evadeSorcerers.forEach((sorcerer, index) => { let pos = evadeSorcererPositions[index]; // Calculate direction vector toward player position const sorcererCenter = { x: pos.x + sorcererRadius, y: pos.y + sorcererRadius }; const playerCenter = { x: evadePlayerPosition.x + (evadePlayerElement.offsetWidth / 2), y: evadePlayerPosition.y + (evadePlayerElement.offsetHeight / 2) }; const dx = playerCenter.x - sorcererCenter.x; const dy = playerCenter.y - sorcererCenter.y; const distance = Math.sqrt(dx * dx + dy * dy); // Avoid division by zero if (distance === 0) return; // Normalize direction const dirX = dx / distance; const dirY = dy / distance; // Move sorcerer toward player pos.x += dirX * evadeSorcererSpeed; pos.y += dirY * evadeSorcererSpeed; // Boundary constraints pos.x = Math.max(0, Math.min(gameAreaWidth - sorcererRadius * 2, pos.x)); pos.y = Math.max(0, Math.min(gameAreaHeight - sorcererRadius * 2, pos.y)); // Update sorcerer position in DOM sorcerer.style.top = `${pos.y}px`; sorcerer.style.left = `${pos.x}px`; // Update sorcerer position in array evadeSorcererPositions[index] = pos; }); checkEvadeCollision(); if (evadeGameActive) { requestAnimationFrame(moveEvadingSorcerers); } } // Function to check for collision between Player and Sorcerers function checkEvadeCollision() { const playerRect = evadePlayerElement.getBoundingClientRect(); const playerRadius = evadePlayerElement.offsetWidth / 2; const playerCenter = { x: playerRect.left + playerRadius, y: playerRect.top + playerRadius }; for (let sorcerer of evadeSorcerers) { const sorcererRect = sorcerer.getBoundingClientRect(); const sorcererRadius = sorcerer.offsetWidth / 2; const sorcererCenter = { x: sorcererRect.left + sorcererRadius, y: sorcererRect.top + sorcererRadius }; const dx = playerCenter.x - sorcererCenter.x; const dy = playerCenter.y - sorcererCenter.y; const distance = Math.sqrt(dx * dx + dy * dy); if (distance < playerRadius + sorcererRadius) { console.log("Collision detected between Player and Sorcerer."); endEvadeGame(false, true); break; } } } // Function to end the evading game function endEvadeGame(playerSurvived, wasCaught = false) { if (gameEnded) return; gameEnded = true; evadeGameActive = false; clearInterval(evadeGameInterval); document.removeEventListener('keydown', moveEvadingPlayer); // Hide all sorcerers evadeSorcerers.forEach(sorcerer => { sorcerer.style.display = 'none'; }); // Enable the Start button again const startButton = document.getElementById('start-evade-game-button'); startButton.disabled = false; startButton.style.opacity = "1"; startButton.style.cursor = "pointer"; // Show result message or redirect to next passage if (playerSurvived) { alert("You succeeded! You evaded the Sorcerer's attacks."); // Link to the next passage in Twine SugarCube.Engine.play('Combat'); } else if (wasCaught) { alert("Game over! You were caught by the Sorcerer."); // === Added Code Start === evadeGameTimeLeft = 0; // Reset time to 0 evadeTimeLeftDisplay.innerText = evadeGameTimeLeft; // Update the display // === Added Code End === } else { alert("You chose to stop the game."); } } // Event listeners for Start and Stop game buttons document.getElementById('start-evade-game-button').onclick = startEvadeGame; document.getElementById('stop-evade-game-button').onclick = function() { if (!gameEnded) { endEvadeGame(false, false); } }; </script>

<div id="game-info"> <p>Defeat the Guardian before it overpowers you</p> <p>Time Left: <span id="time-left">10</span> seconds</p> <p>Targets Left: <span id="targets-left">0</span></p> </div> <div id="game-area">  </div> <div id="button-container"> <button id="start-game-button" onclick="startMinigame()">Fight Guardian</button> <button id="stop-game-button" onclick="endMinigame(false, false)">Stop Fighting</button> </div>  <style> /* Game info section */ #game-info { position: absolute; top: 100px; left: 520px; text-align: center; font-size: 18px; color: #000000; /* Black text */ margin-bottom: 10px; /* Space between game info and game area */ } /* Style for the instruction text */ #game-info p:first-of-type { font-size: 18px; /* Adjust font size as desired */ font-weight: bold; /* Makes the instruction text stand out */ margin: 0 0 10px 0; /* Adds space below this line only */ color: #333333; /* Adjust color to match your theme */ } /* Game area container */ #game-area { position: absolute; /* Allows precise positioning */ top: 370px; /* Adjust this value to move the game area vertically */ left: 520px; /* Adjust this value to move the game area horizontally */ width: 400px; height: 300px; border: 2px solid #333; background-color: #f0f0f0; margin: 0; /* Remove default margin to avoid unintended shifts */ overflow: hidden; /* Prevent targets from overflowing */ } /* Clickable targets styled as circles */ .click-target { position: absolute; width: 65px; /* Adjust width for circular shape */ height: 65px; /* Make height equal to width for a perfect circle */ background-color: #87CEEB; border: none; color: white; cursor: pointer; font-size: 14px; display: none; /* Initially hidden */ border-radius: 50%; /* Makes the targets circular */ justify-content: center; align-items: center; /* Removed the duplicate display property */ } /* Hover effect for targets */ .click-target:hover { background-color: #5a9bcf; color: #ffffff; /* Keeps the text white on hover */ } /* Button container for Start and Stop buttons */ #button-container { position: absolute; top: 640px; left: 650px; text-align: center; margin-top: 10px; /* Space between buttons and game area */ } /* Position and style for Start and Stop buttons */ #start-game-button, #stop-game-button { margin: 5px; padding: 10px 15px; background-color: #d0403f; color: #ffffff; border: none; border-radius: 5px; cursor: pointer; font-size: 14px; transition: background-color 0.3s; } #start-game-button:hover, #stop-game-button:hover { background-color: #a83232; } /* Styling for the Guardian image inside targets */ .guardian-image { width: 60px; /* Adjust the size as needed */ height: 60px; /* Maintain aspect ratio */ pointer-events: none; /* Allow clicks to pass through to the button */ } </style>  <script> // Game variables let timeLeft = 10; // Total time for the game let targetsLeft = 0; // Will be set based on weapon let currentTarget = 1; // Keeps track of the current target to click let countdownInterval; let gameActive = false; // Mapping of weapons to number of targets const weaponTargetCounts = { "sword": 12, "bow": 14, "staff": 16 }; // Constants for game area and button size const GAME_AREA_WIDTH = 400; // in pixels const GAME_AREA_HEIGHT = 300; // in pixels const BUTTON_SIZE = 65; // width and height in pixels (matches .click-target size) // Function to start the game window.startMinigame = function() { console.log("Start Minigame clicked."); // Prevent starting the game if it's already active if (gameActive) { console.log("Game is already active. Ignoring start request."); return; } // Retrieve the selected weapon from SugarCube variables const weapon = SugarCube.State.variables.weapon || "sword"; // Default to sword if undefined console.log("Selected Weapon:", weapon); // Determine the number of targets based on the weapon const targetCount = weaponTargetCounts[weapon] || 15; // Default to 15 if weapon not found console.log("Target Count:", targetCount); // Set game variables targetsLeft = targetCount; timeLeft = 10; currentTarget = 1; gameActive = true; // Update UI elements document.getElementById('time-left').innerText = timeLeft; document.getElementById('targets-left').innerText = targetsLeft; // Disable the Start button to prevent multiple clicks document.getElementById('start-game-button').disabled = true; document.getElementById('start-game-button').style.opacity = "0.6"; document.getElementById('start-game-button').style.cursor = "not-allowed"; // Remove any existing targets removeAllTargets(); // Create and show the first target createAndShowTarget(currentTarget); // Start countdown timer countdownInterval = setInterval(countdown, 1000); } // Countdown function function countdown() { if (timeLeft > 0) { timeLeft--; document.getElementById('time-left').innerText = timeLeft; console.log("Time Left:", timeLeft); } else { console.log("Time ran out."); endMinigame(false, true); // End the game with failure due to time running out } } // Function to create and show a target button function createAndShowTarget(targetNumber) { console.log("Creating and showing target:", targetNumber); const gameArea = document.getElementById('game-area'); const button = document.createElement('button'); button.classList.add('click-target'); button.id = `target-${targetNumber}`; // Replace innerText with an image button.innerHTML = `<img src="https://i.ibb.co/wQCbk30/shield-3d-rendering-icon-illustration.png" alt="Guardian" class="guardian-image">`; button.onclick = function() { clickTarget(targetNumber); }; // Customize target appearance based on weapon const weapon = SugarCube.State.variables.weapon || "sword"; if (weapon === "sword") { button.style.backgroundColor = "#C0C0C0"; // Silver for sword } else if (weapon === "bow") { button.style.backgroundColor = "#8B4513"; // Brown for bow } else if (weapon === "staff") { button.style.backgroundColor = "#FFD700"; // Gold for staff } gameArea.appendChild(button); // Calculate random positions within bounds const maxTop = GAME_AREA_HEIGHT - BUTTON_SIZE; const maxLeft = GAME_AREA_WIDTH - BUTTON_SIZE; const randomTop = Math.floor(Math.random() * maxTop); const randomLeft = Math.floor(Math.random() * maxLeft); button.style.top = `${randomTop}px`; button.style.left = `${randomLeft}px`; button.style.display = 'flex'; // Flex for centering console.log(`Target ${targetNumber} positioned at (${randomLeft}px, ${randomTop}px).`); } // Function to remove all target buttons function removeAllTargets() { console.log("Removing all existing targets."); const gameArea = document.getElementById('game-area'); const existingTargets = gameArea.querySelectorAll('.click-target'); existingTargets.forEach(target => target.remove()); } // Function to handle clicks on targets function clickTarget(targetNumber) { console.log("Target clicked:", targetNumber); if (targetNumber === currentTarget && gameActive) { targetsLeft--; document.getElementById('targets-left').innerText = targetsLeft; console.log("Targets Left:", targetsLeft); // Hide and remove the clicked target const target = document.getElementById(`target-${targetNumber}`); if (target) { target.style.display = 'none'; target.remove(); console.log("Target removed:", targetNumber); } // Move to the next target currentTarget++; if (targetsLeft === 0) { console.log("All targets defeated. Success!"); endMinigame(true, false); // End the game with success } else { // Create and show the next target createAndShowTarget(currentTarget); } } else { console.log("Clicked target is not the current target or game is inactive."); } } // Function to end the game function endMinigame(success, ranOutOfTime = false) { console.log("Ending game. Success:", success, "Ran Out Of Time:", ranOutOfTime); clearInterval(countdownInterval); gameActive = false; // Remove all targets removeAllTargets(); // Enable the Start button again const startButton = document.getElementById('start-game-button'); startButton.disabled = false; startButton.style.opacity = "1"; startButton.style.cursor = "pointer"; // Show result message or redirect to next passage if (success) { alert("You succeeded! You defeated the Guardian in time."); } else if (ranOutOfTime) { alert("Game over! You ran out of time."); } else { alert("You chose to stop the game."); } } // Ensure the stop button works correctly without duplicating targets document.addEventListener("DOMContentLoaded", function() { const stopButton = document.getElementById('stop-game-button'); if (stopButton) { stopButton.onclick = function() { if (gameActive) { console.log("Stop Minigame clicked."); endMinigame(false, false); // Stopping the game manually } else { console.log("Stop Minigame clicked, but game is not active."); } }; } }); </script>

<div id="evade-game-info"> <p>Use the arrow keys to evade the Sorcerer's attacks until the time runs out</p> <p>Time Left: <span id="evade-time-left">0</span> seconds</p> </div> <div id="evade-game-area"> <div id="evade-player"></div> <div class="evade-sorcerer" id="evade-sorcerer-1"></div> <div class="evade-sorcerer" id="evade-sorcerer-2"></div> <div class="evade-sorcerer" id="evade-sorcerer-3"></div> </div> <div id="evade-button-container"> <button id="start-evade-game-button">Evade Attacks</button> <button id="stop-evade-game-button">Stop Evading</button> </div>  <style> /* Center the game area vertically and horizontally */ #passage { display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; flex-direction: column; } /* Game info section */ #evade-game-info { position: absolute; top: 100px; left: 440px; text-align: center; font-size: 18px; color: #000000; margin-bottom: 20px; } #evade-game-info p:first-of-type { font-weight: bold; font-size: 18px; margin: 0 0 10px 0; color: #333333; /* Slightly darker for emphasis */ } /* Game area container */ #evade-game-area { position: absolute; top: 370px; left: 520px; width: 400px; height: 300px; border: 2px solid #333; background-color: #f0f0f0; overflow: hidden; } /* Player styling */ #evade-player { position: absolute; width: 30px; height: 30px; background-color: #4CAF50; /* Green for player */ top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; z-index: 2; /* Ensure player is above sorcerers */ } /* Sorcerer styling */ .evade-sorcerer { position: absolute; width: 30px; height: 30px; background-color: #FF0000; /* Default red for sorcerers */ border-radius: 50%; display: none; /* Initially hidden */ z-index: 1; /* Below the player */ } /* Button container for Start and Stop buttons */ #evade-button-container { position: absolute; top: 640px; left: 650px; margin-top: 10px; text-align: center; } /* Position and style for Start and Stop buttons */ #start-evade-game-button, #stop-evade-game-button { margin: 5px; padding: 10px 15px; background-color: #d0403f; color: #ffffff; border: none; border-radius: 5px; cursor: pointer; font-size: 14px; transition: background-color 0.3s; } #start-evade-game-button:hover, #stop-evade-game-button:hover { background-color: #a83232; } </style>  <script> // Evading game variables let evadeGameTimeLeft = 0; // Initial time set to 0 let evadeGameInterval; let evadeGameActive = false; let evadePlayerSpeed = 15; let evadeSorcererSpeed = 1; let gameEnded = false; // DOM Elements const evadePlayerElement = document.getElementById('evade-player'); const evadeGameArea = document.getElementById('evade-game-area'); const evadeSorcerers = Array.from(document.getElementsByClassName('evade-sorcerer')); const evadeTimeLeftDisplay = document.getElementById('evade-time-left'); // Player Position let evadePlayerPosition = { x: 200, y: 150 }; // Sorcerer initial positions let evadeSorcererPositions = [ { x: 50, y: 0 }, { x: 350, y: 0 }, { x: 200, y: 0 } ]; // Mapping of weapons to their corresponding sorcerer colors const weaponColorMap = { "sword": "#C0C0C0", // Silver "bow": "#8B4513", // Brown "staff": "#FFD700" // Gold }; // Function to start the evading game function startEvadeGame() { console.log("Start Evade Game clicked."); // Prevent starting the game if it's already active if (evadeGameActive) { console.log("Evade game is already active. Ignoring start request."); return; } // Retrieve the weapon from Twine's state variables const weapon = SugarCube.State.variables.weapon || "sword"; // Default to sword if undefined console.log("Selected Weapon:", weapon); // Map weapons to their corresponding evade times const weaponTimeMap = { "sword": 16, "bow": 14, "staff": 12 }; // Set evadeGameTimeLeft based on the chosen weapon, default to 10 if undefined evadeGameTimeLeft = weaponTimeMap[weapon] || 10; console.log(`Weapon chosen: ${weapon}, Time Left: ${evadeGameTimeLeft} seconds`); // Initialize game variables evadeGameActive = true; gameEnded = false; evadeTimeLeftDisplay.innerText = evadeGameTimeLeft; evadePlayerPosition = { x: 200, y: 150 }; evadePlayerElement.style.top = `${evadePlayerPosition.y}px`; evadePlayerElement.style.left = `${evadePlayerPosition.x}px`; // Initialize sorcerers evadeSorcererPositions = [ { x: 50, y: 0 }, { x: 350, y: 0 }, { x: 200, y: 0 } ]; // Determine sorcerer color based on weapon const sorcererColor = weaponColorMap[weapon] || "#FF0000"; // Default red evadeSorcerers.forEach((sorcerer, index) => { const pos = evadeSorcererPositions[index]; sorcerer.style.top = `${pos.y}px`; sorcerer.style.left = `${pos.x}px`; sorcerer.style.backgroundColor = sorcererColor; // Apply color based on weapon sorcerer.style.display = 'block'; // Make sorcerers visible }); // Disable the Start button to prevent multiple clicks const startButton = document.getElementById('start-evade-game-button'); startButton.disabled = true; startButton.style.opacity = "0.6"; startButton.style.cursor = "not-allowed"; // Remove any existing movement or event listeners if any document.removeEventListener('keydown', moveEvadingPlayer); // Add event listener for player movement document.addEventListener('keydown', moveEvadingPlayer); // Start countdown timer evadeGameInterval = setInterval(evadingCountdown, 1000); // Start moving sorcerers moveEvadingSorcerers(); } // Countdown timer function for evading game function evadingCountdown() { if (evadeGameTimeLeft > 0) { evadeGameTimeLeft--; evadeTimeLeftDisplay.innerText = evadeGameTimeLeft; console.log("Evading Game Time Left:", evadeGameTimeLeft); } else { console.log("Evading game time ran out."); endEvadeGame(true); } } // Function to move the Player using arrow keys function moveEvadingPlayer(event) { if (!evadeGameActive) return; const playerRadius = evadePlayerElement.offsetWidth / 2; const gameAreaWidth = evadeGameArea.clientWidth; const gameAreaHeight = evadeGameArea.clientHeight; switch (event.key) { case 'ArrowUp': evadePlayerPosition.y = Math.max(playerRadius, evadePlayerPosition.y - evadePlayerSpeed); break; case 'ArrowDown': evadePlayerPosition.y = Math.min(gameAreaHeight - playerRadius, evadePlayerPosition.y + evadePlayerSpeed); break; case 'ArrowLeft': evadePlayerPosition.x = Math.max(playerRadius, evadePlayerPosition.x - evadePlayerSpeed); break; case 'ArrowRight': evadePlayerPosition.x = Math.min(gameAreaWidth - playerRadius, evadePlayerPosition.x + evadePlayerSpeed); break; default: // Ignore other keys return; } evadePlayerElement.style.top = `${evadePlayerPosition.y}px`; evadePlayerElement.style.left = `${evadePlayerPosition.x}px`; checkEvadeCollision(); } // Function to move Sorcerers toward the Player function moveEvadingSorcerers() { if (!evadeGameActive) return; const sorcererRadius = evadeSorcerers[0].offsetWidth / 2; const gameAreaWidth = evadeGameArea.clientWidth; const gameAreaHeight = evadeGameArea.clientHeight; evadeSorcerers.forEach((sorcerer, index) => { let pos = evadeSorcererPositions[index]; // Calculate direction vector toward player position const sorcererCenter = { x: pos.x + sorcererRadius, y: pos.y + sorcererRadius }; const playerCenter = { x: evadePlayerPosition.x + (evadePlayerElement.offsetWidth / 2), y: evadePlayerPosition.y + (evadePlayerElement.offsetHeight / 2) }; const dx = playerCenter.x - sorcererCenter.x; const dy = playerCenter.y - sorcererCenter.y; const distance = Math.sqrt(dx * dx + dy * dy); // Avoid division by zero if (distance === 0) return; // Normalize direction const dirX = dx / distance; const dirY = dy / distance; // Move sorcerer toward player pos.x += dirX * evadeSorcererSpeed; pos.y += dirY * evadeSorcererSpeed; // Boundary constraints pos.x = Math.max(0, Math.min(gameAreaWidth - sorcererRadius * 2, pos.x)); pos.y = Math.max(0, Math.min(gameAreaHeight - sorcererRadius * 2, pos.y)); // Update sorcerer position in DOM sorcerer.style.top = `${pos.y}px`; sorcerer.style.left = `${pos.x}px`; // Update sorcerer position in array evadeSorcererPositions[index] = pos; }); checkEvadeCollision(); if (evadeGameActive) { requestAnimationFrame(moveEvadingSorcerers); } } // Function to check for collision between Player and Sorcerers function checkEvadeCollision() { const playerRect = evadePlayerElement.getBoundingClientRect(); const playerRadius = evadePlayerElement.offsetWidth / 2; const playerCenter = { x: playerRect.left + playerRadius, y: playerRect.top + playerRadius }; for (let sorcerer of evadeSorcerers) { const sorcererRect = sorcerer.getBoundingClientRect(); const sorcererRadius = sorcerer.offsetWidth / 2; const sorcererCenter = { x: sorcererRect.left + sorcererRadius, y: sorcererRect.top + sorcererRadius }; const dx = playerCenter.x - sorcererCenter.x; const dy = playerCenter.y - sorcererCenter.y; const distance = Math.sqrt(dx * dx + dy * dy); if (distance < playerRadius + sorcererRadius) { console.log("Collision detected between Player and Sorcerer."); endEvadeGame(false, true); break; } } } // Function to end the evading game function endEvadeGame(playerSurvived, wasCaught = false) { if (gameEnded) return; gameEnded = true; evadeGameActive = false; clearInterval(evadeGameInterval); document.removeEventListener('keydown', moveEvadingPlayer); // Hide all sorcerers evadeSorcerers.forEach(sorcerer => { sorcerer.style.display = 'none'; }); // Enable the Start button again const startButton = document.getElementById('start-evade-game-button'); startButton.disabled = false; startButton.style.opacity = "1"; startButton.style.cursor = "pointer"; // Show result message or redirect to next passage if (playerSurvived) { alert("You succeeded! You evaded the Sorcerer's attacks."); } else if (wasCaught) { alert("Game over! You were caught by the Sorcerer."); // === Added Code Start === evadeGameTimeLeft = 0; // Reset time to 0 evadeTimeLeftDisplay.innerText = evadeGameTimeLeft; // Update the display // === Added Code End === } else { alert("You chose to stop the game."); } } // Event listeners for Start and Stop game buttons document.getElementById('start-evade-game-button').onclick = startEvadeGame; document.getElementById('stop-evade-game-button').onclick = function() { if (!gameEnded) { endEvadeGame(false, false); } }; </script>