this post was submitted on 16 May 2026
-1 points (45.5% liked)

Perchance - Create a Random Text Generator

1851 readers
10 users here now

⚄︎ Perchance

This is a Lemmy Community for perchance.org, a platform for sharing and creating random text generators.

Feel free to ask for help, share your generators, and start friendly discussions at your leisure :)

This community is mainly for discussions between those who are building generators. For discussions about using generators, especially the popular AI ones, the community-led Casual Perchance forum is likely a more appropriate venue.

See this post for the Complete Guide to Posting Here on the Community!

Rules

1. Please follow the Lemmy.World instance rules.

2. Be kind and friendly.

  • Please be kind to others on this community (and also in general), and remember that for many people Perchance is their first experience with coding. We have members for whom English is not their first language, so please be take that into account too :)

3. Be thankful to those who try to help you.

  • If you ask a question and someone has made a effort to help you out, please remember to be thankful! Even if they don't manage to help you solve your problem - remember that they're spending time out of their day to try to help a stranger :)

4. Only post about stuff related to perchance.

  • Please only post about perchance related stuff like generators on it, bugs, and the site.

5. Refrain from requesting Prompts for the AI Tools.

  • We would like to ask to refrain from posting here needing help specifically with prompting/achieving certain results with the AI plugins (text-to-image-plugin and ai-text-plugin) e.g. "What is the good prompt for X?", "How to achieve X with Y generator?"
  • See Perchance AI FAQ for FAQ about the AI tools.
  • You can ask for help with prompting at the 'sister' community Casual Perchance, which is for more casual discussions.
  • We will still be helping/answering questions about the plugins as long as it is related to building generators with them.

6. Search through the Community Before Posting.

  • Please Search through the Community Posts here (and on Reddit) before posting to see if what you will post has similar post/already been posted.

founded 2 years ago
MODERATORS
eatham@lemmy.world
eatham@aussie.zone
VioneT@lemmy.world
perchance@lemmy.world
-1
Cant code, and am trying to make my own text adventure/ visual novel ish thing (lemmy.world)
submitted 2 days ago by OkOtt@lemmy.world to c/perchance@lemmy.world
2 comments fedilink hide all child comments
 

The ai ia asked to make a layout did a good job, now i jsut need to figure out how to make it work. i wnat it to generate the map image automatically, maybe based on lorebooks as well, and to generate visual novel style character images, but we'll see if any of this actualy happens

you are viewing a single comment's thread
view the rest of the comments
[–] Tod_1ncignito@lemmy.world 2 points 1 day ago

Wow thats actually awesome and perfectly nice and small code use, i like it. This is just a little help with the map part :

Paste this line inside your hub-bar div at line 279 <button class="hud-btn" id="mapBtn">Map</button>

Paste this code in after the map-legend div at line 503

<!-- ══ MAP MODAL ══ -->
<div id="mapModal" class="modal-overlay" hidden>
  <div class="modal-box">
    <div class="modal-header">
      <span class="modal-title">Region Map</span>
      <button class="close-icon-btn" onclick="mapModal.hidden=true">&times;</button>
    </div>
    <div class="modal-body">
      <div style="width:100%; border:1px solid var(--border); border-radius:2px; overflow:hidden; background:#0e1c2e; margin-bottom:15px; box-shadow:0 0 20px rgba(0,0,0,0.5);">
        <svg viewBox="0 0 248 186" xmlns="http://www.w3.org/2000/svg" style="width:100%; height:auto; display:block;">
          <rect width="248" height="186" fill="#0e1c2e"/>
          <path d="M10,186 L10,50 Q30,30 60,40 Q80,20 120,30 Q160,15 200,35 Q230,30 248,50 L248,186 Z" fill="#142010" opacity="0.9"/>
          <ellipse cx="70" cy="100" rx="40" ry="30" fill="#0e1a0a" opacity="0.8"/>
          <ellipse cx="110" cy="85" rx="30" ry="22" fill="#0e1a0a" opacity="0.7"/>
          <ellipse cx="150" cy="105" rx="35" ry="25" fill="#0e1a0a" opacity="0.8"/>
          <path d="M124,176 Q124,140 120,110 Q118,90 100,75 Q80,60 60,50" stroke="#2a2416" stroke-width="3" fill="none" stroke-linecap="round"/>
          <path d="M124,176 Q128,140 140,110 Q158,85 180,70 Q200,58 220,60" stroke="#2a2416" stroke-width="3" fill="none" stroke-linecap="round"/>
          <path d="M0,80 Q40,90 80,85 Q100,82 120,95 Q140,108 160,100 Q200,88 248,100" stroke="#1a2d44" stroke-width="5" fill="none" stroke-linecap="round" opacity="0.9"/>
          <path d="M0,80 Q40,90 80,85 Q100,82 120,95 Q140,108 160,100 Q200,88 248,100" stroke="#1d3550" stroke-width="2" fill="none" stroke-linecap="round"/>
          <rect x="111" y="162" width="10" height="8" rx="1" fill="#3a3020"/>
          <polygon points="116,156 108,162 124,162" fill="#4a3a28"/>
          <rect x="53" y="64" width="8" height="8" rx="1" fill="#2a2018"/>
          <polygon points="185,58 178,72 192,72" fill="#2a2030" opacity="0.8"/>
          <rect x="180" y="72" width="10" height="4" rx="1" fill="#2a2030"/>
          <circle cx="124" cy="155" r="5" fill="none" stroke="#c9a55e" stroke-width="1.5"/>
          <circle cx="124" cy="155" r="2" fill="#c9a55e"/>
          <circle cx="124" cy="155" r="8" fill="none" stroke="#c9a55e" stroke-width="0.5" opacity="0.4"/>
          <circle cx="57"  cy="60" r="3" fill="#6a5a30" opacity="0.8"/>
          <circle cx="186" cy="62" r="3" fill="#3a3060" opacity="0.8"/>
          <circle cx="115" cy="160" r="3" fill="#504030" opacity="0.9"/>
          <ellipse cx="30"  cy="150" rx="25" ry="30" fill="#0e1c2e" opacity="0.6"/>
          <ellipse cx="220" cy="155" rx="30" ry="25" fill="#0e1c2e" opacity="0.5"/>
          <rect width="248" height="186" fill="none" stroke="#3a2f52" stroke-width="1.5" rx="1"/>
          <g transform="translate(226,20)">
            <line x1="0" y1="-10" x2="0" y2="10" stroke="#3a3020" stroke-width="0.8"/>
            <line x1="-10" y1="0" x2="10" y2="0" stroke="#3a3020" stroke-width="0.8"/>
            <polygon points="0,-10 -3,-5 3,-5" fill="#c9a55e" opacity="0.8"/>
            <text x="0" y="-12" text-anchor="middle" font-family="serif" font-size="6" fill="#8a7f6a">N</text>
          </g>
        </svg>
      </div>
      <div class="map-legend" style="justify-content:center;">
        <div class="legend-item"><div class="legend-dot" style="background:#c9a55e"></div>You (Current Location)</div>
        <div class="legend-item"><div class="legend-dot" style="background:#6a5a30"></div>Old Mill</div>
        <div class="legend-item"><div class="legend-dot" style="background:#3a3060"></div>Shrine</div>
        <div class="legend-item"><div class="legend-dot" style="background:#504030"></div>Village</div>
      </div>
      <div style="text-align:center; margin-top:15px; font-family:var(--serif); font-size:13px; color:var(--text-dim); font-style:italic;">
        The forest stretches endlessly to the North.
      </div>
    </div>
  </div>
</div>

And paste this script after function addLoreEntry at 898 and before Local Storage

// ── Map Button Function ───────────────────────────────────────────────
mapBtn.onclick = function() {
  mapModal.hidden = false;
};