srhtnin.github.io/Pages/Guide.php

<?php

$PageTitle = "Guide";
$PageSection = "Guide";


?>

<!DOCTYPE html>

<html lang="en" data-palette="CatppuccinMocha">
    <?php require __DIR__ . "/Bits/Head.php"; ?>

    <body>
        <?php require __DIR__ . "/Bits/Navbar.php"; ?>

        <main class="MainContainer">
            <h1>Garden guide</h1>

            <p>
                A quick guide to growing plants, earning Dew,
                discovering mutations, and using the Garden's
                tools and upgrades. You do not need to know
                everything here before you start playing.
                (But it's useful to do..)
            </p>

            <section
                id="GettingStarted"
                class="GuideSection"
            >
                <h2>Getting started</h2>

                <p>
                    A new Garden starts with a Red Rose seed and
                    some Dew. The <a href="/Pages/Shop.html">Shop</a>
                    stocks seeds you can buy to start gardening and
                    making some Dew.
                </p>

                <p>
                    Seeds are consumable. Planting one removes it
                    from your inventory, so you need to buy
                    another if you want to grow the same plant again.
                    ..So just buy multiple at once.
                </p>
            </section>

            <section
                id="Planting"
                class="GuideSection"
            >
                <h2>Planting and growing</h2>

                <p>
                    In the <a href="/Pages/Garden.html">Garden</a>,
                    select a seed and then choose an empty plot with
                    the Trowel. Plants continue growing with real time,
                    even while you are away from the page.
                </p>

                <p>
                    Plant sprites change as they grow. When the final
                    growth sprite appears, the plant is mature and can
                    be harvested. The Garden also shows when your next
                    plant will be ready. Don't worry: it'll also have
                    a green border around it when it's ready to harvest.
                </p>
            </section>

            <section
                id="Harvesting"
                class="GuideSection"
            >
                <h3>Harvesting</h3>

                <p>
                    Click a mature plant to harvest it. Harvesting gives
                    you Dew and makes the plot empty again, as it once was.
                </p>

                <p>
                    More valuable seeds usually give more Dew.
                    The Shop shows the current seed cost,
                    harvest reward, growth time, and how many seeds you
                    already own. The Garden can also quick-buy the selected
                    seed without making you leave the page. So you can be
                    smart in your plant investments!
                </p>
            </section>

            <section
                id="Shop"
                class="GuideSection"
            >
                <h2>The Shop</h2>

                <p>
                    Some basic plants can be bought from the beginning.
                    Plants created through mutations become purchasable
                    in the shop after you discover them.
                </p>

                <p>
                    Mutation-derived seed prices are based on their
                    recipes, so discovering and performing mutations is
                    often a useful alternative to simply buying the
                    resulting seed. The Shop also contains tools, Garden
                    expansions, additional Gardens, and optional information
                    upgrades.
                </p>
            </section>

            <section
                id="Mutations"
                class="GuideSection"
            >
                <h2>Mutations</h2>

                <p>
                    Most plants can create new plants or change when they are
                    arranged in a particular pattern. Unless a mutation
                    says otherwise, the plants involved need to be
                    mature before the recipe can work.
                </p>

                <p>
                    As soon as a valid recipe exists, the Garden tries
                    the mutation. Some mutations are guaranteed, but
                    others may only have a chance to succeed. A failed
                    attempt may need to wait for its cooldown before
                    that same area can try mutating again.
                </p>

                <p>
                    Some recipes use numbered lists instead of one exact
                    plant in a slot. A <strong>Once</strong> list can use
                    each of its entries at most once across the whole
                    recipe, while an <strong>Any</strong> list can reuse a
                    matching entry. This lets a recipe care about a set of
                    plants without caring which order they are arranged in.
                </p>

                <div class="GuideTip">
                    <strong>
                        Since you were good and actually read this...
                    </strong>

                    <p>
                        Try arranging mature plants like this:
                    </p>

                    <div
                        id="GuideMutationHint"
                        class="GuideRecipe"
                        aria-label="Red Rose, empty plot, Blue Rose"
                    >
                        <div
                            class="PlantTile GuideRecipeCell GuideRecipePlant"
                            data-plant-key="RedRose"
                        >
                            <span class="GuideRecipeLabel">
                                Red Rose
                            </span>
                        </div>

                        <div
                            class="PlantTile GuideRecipeCell GuideRecipeEmpty"
                        >
                            <span>Empty</span>
                        </div>

                        <div
                            class="PlantTile GuideRecipeCell GuideRecipePlant"
                            data-plant-key="BlueRose"
                        >
                            <span class="GuideRecipeLabel">
                                Blue Rose
                            </span>
                        </div>
                    </div>

                    <p class="GuideHintText">
                        "Empty" means the middle plot really does need
                        to be empty. What happens next is for you to
                        find out.
                    </p>
                </div>
            </section>

            <section
                id="Discoveries"
                class="GuideSection"
            >
                <h3>Discoveries</h3>

                <p>
                    Discovering a new plant or mutation is saved with
                    your Garden. New plant discoveries also unlock
                    additional seeds in the Shop, so you can skip
                    creating them through mutations. Though it always
                    costs more to buy the seeds than create them by mutation..
                    Your discoveries are also recorded in the
                    <a href="/Pages/Plants.html">Plant encyclopedia</a> and
                    <a href="/Pages/Mutations.html">Mutation encyclopedia</a>.
                </p>

                <p>
                    Experiment with different plants, empty spaces, and
                    arrangements. Not every recipe has to look like the
                    example above. Some are logical (Red + Blue = Purple),
                    while others are visual, or maybe don't make sense at all.
                </p>
            </section>

            <section
                id="Tools"
                class="GuideSection"
            >
                <h2>Tools</h2>

                <p>
                    The <strong>Trowel</strong> is the default tool. Select
                    a seed from your inventory, then use the Trowel on an
                    empty plot to plant it.
                </p>

                <p>
                    The <strong>Magic trowel</strong> fills as many empty
                    plots as it can with the selected seed. If you have
                    fewer seeds than empty plots, it simply plants every
                    seed you have. Use it on a mature plant to harvest every
                    mature plant of that same type in the active Garden.
                </p>

                <p>
                    The <strong>Shovel</strong> removes planted crops. At
                    level 0 it returns nothing, level 1 returns 33% of the
                    seed cost, level 2 returns 66%, and level 3 returns the
                    planted seed itself.
                </p>

                <p>
                    <strong>Fertilizer</strong> consumes one Fertilizer use
                    to advance a growing plant. Its six levels advance 10,
                    20, 30, 40, 50, or 60 minutes respectively. Additional
                    Fertilizer uses are bought from the Shop.
                </p>

                <p>
                    <strong>Future Sight</strong> previews the Garden's next
                    mutation as though that mutation succeeded. The preview
                    does not actually mutate or discover anything, and Future
                    Sight must recharge for two hours after a successful use.
                </p>

                <p>
                    Tools and their upgrades are bought from the Shop. Shovel
                    and Fertilizer upgrade prices rise exponentially as their
                    levels increase.
                </p>
            </section>

            <section
                id="Gardens"
                class="GuideSection"
            >
                <h2>Gardens and rotation</h2>

                <p>
                    You can buy additional Gardens from the Shop. Each Garden
                    has its own name, plots, mutation cooldowns, and expansion
                    size. Use the arrows beside the Garden name to switch
                    between the Gardens you own.
                </p>

                <p>
                    The Plot rotation upgrade adds a direction to planted
                    plots. Rotation matters for directional mutations and
                    functional plants, and plants with directional sprites
                    can visually face their saved direction.
                </p>
            </section>

            <section
                id="FunctionalPlants"
                class="GuideSection"
            >
                <h2>Functional plants</h2>

                <p>
                    Some mutation-created plants do more than grow and harvest.
                    Once mature, functional plants can affect nearby plots or
                    the wider Garden by harvesting, planting, duplicating,
                    advancing growth, changing mutation behaviour, or modifying
                    harvest rewards. Their exact behaviour depends on the plant.
                </p>

                <p>
                    Directional functional plants use their plot rotation to
                    decide where effects such as <strong>Front</strong> and
                    <strong>Behind</strong> point. Other effects can target
                    cardinal neighbours, adjacent plots, or the whole Garden.
                </p>
            </section>

            <section
                id="Account"
                class="GuideSection"
            >
                <h2>Your account</h2>

                <p>
                    Your <a href="/Pages/Profile.html">Profile</a>
                    contains your username, colour, Gardener description,
                    plant profile picture, privacy settings, Garden display
                    settings, statistics, and Account Key. Garden saves can
                    sync through the API, while the Account Key lets you use
                    the same Garden in another browser or on another device.
                    It's basically just like logging into an account.
                </p>

                <p>
                    Treat your Account Key like a password. Anyone who
                    has it can load the same Garden account and mess stuff up.
                </p>
            </section>

            <section
                id="Social"
                class="GuideSection"
            >
                <h2>Social and Gardener profiles</h2>

                <p>
                    The <a href="/Pages/Social.html">Social</a> page lets
                    you search for other gardeners by username and open their
                    public Gardener page. Gardener profile pictures use a plant
                    and growth stage the player has discovered.
                </p>

                <p>
                    Gardener pages can show statistics and read-only previews
                    of every Garden the player owns. Players can independently
                    disable Garden previews, comments, Dew donations, and
                    public statistics from their Profile. Disabling public
                    statistics also hides the player from the Dew leaderboard.
                </p>

                <p>
                    Comments are simple messages left on a Gardener page. A
                    comment can be deleted by its author or by the owner of the
                    Gardener page. Dew donations transfer spendable Dew between
                    accounts, but donated Dew does not increase the recipient's
                    Lifetime Dew.
                </p>
            </section>

            <section
                id="Privacy"
                class="GuideSection"
            >
                <h2>Privacy and your data</h2>

                <p>
                    The Garden API stores the data needed to keep your
                    account synchronized, including your Garden save,
                    username, profile colour, Dew totals, and the time
                    the server save was last updated. The server identifies
                    the account using a one-way hash derived from your
                    Account Key rather than storing the Account Key itself.
                </p>

                <p>
                    This browser stores your Account Key and a local copy
                    of your Garden save so the same account can keep working
                    between visits. If you set a username, your Gardener can
                    be found through Social. Your username, profile colour,
                    description, and selected plant profile picture form the
                    basic public Gardener profile; the separate privacy
                    settings control Garden previews, comments, Dew donations,
                    and public statistics.
                </p>

                <p>
                    The <a href="/Pages/Profile.html#Account">Profile</a>
                    page lets you export a JSON copy of the account data
                    stored on the server, or permanently delete the account.
                    Deleting removes the server account and clears the
                    Account Key and local save from the browser where you
                    perform the deletion. Other devices have their own local
                    browser storage and cannot be cleared remotely.
                </p>
            </section>

            <section
                id="Contact"
                class="GuideSection"
            >
                <h2>Contact</h2>

                <p>
                    For general Garden questions or anything that does not fit
                    elsewhere, email
                    <a href="mailto:[email protected]">[email protected]</a>.
                </p>

                <p>
                    Found a bug? Send it to
                    <a href="mailto:[email protected]">[email protected]</a>.
                    Ideas and suggestions can go to
                    <a href="mailto:[email protected]">[email protected]</a>.
                </p>
            </section>
        </main>

        <script src="/Scripts/Garden/PlantImages.js"></script>
        <script src="/Scripts/Garden/Plants.js"></script>
        <script src="/Scripts/Garden/Mutations.js"></script>
        <script src="/Scripts/Garden/Save.js"></script>
        <script src="/Scripts/Garden/Content.js"></script>
        <script src="/Scripts/Garden/Guide.js"></script>
    </body>
</html>