Using the text-to-image plugin I generate a bunch of [output]'s in the <div> container. How do I access the <img> tag that the output object creates, for example if I want to get the title to get nseed from it using java script, or there’s an easier way to do that? I’m trying to make a button over the image to perfect that seed easier. Also, how do I access the button with id “heartBtn” that [output] creates?

  • VioneT@lemmy.worldM
    link
    fedilink
    English
    arrow-up
    0
    ·
    22 days ago

    You can’t access the ‘heart button’ since it is on an Iframe/embedded page. You can manually set seeds for the images like so:

    // https://perchance.org/text-to-image-plugin-example-4
    character
      a {mech|demon|cyberpunk} {warrior|minion}
      a cyberpunk {cat|crab}
    
    place
      soviet russia
      a small village
      a mountainous region
      an underwater cavern
    
    season
      winter
      summer
    
    digit = {0-9}
    seed = [digit.selectMany(8).join("")]
    
    prompt
      prompt = a portrait of a [character] in [place], [season]
      seed = [s]
      
    output
      [s = seed.selectOne]<br>[image(prompt)] <br><br> [lastTextToImagePrompt] <br><br>
    

    Then on your HTML:

    <div>[output.selectMany(3).join("")]</div>
    
    • Koto@lemmy.worldOP
      link
      fedilink
      English
      arrow-up
      0
      ·
      22 days ago

      thanks! I tried that and was super clunky to copy paste that. I tried to make the object clickable by doing like this <button id=“nseed” onClick="toUserPromp([seed])>[output]</button> but it’s a layer on top and the image itself isn’t clickable. is there any way to interact with the output to make it clickable or creating a button that is on top of the image just like the heartBtn and flagBtn?

      • VioneT@lemmy.worldM
        link
        fedilink
        English
        arrow-up
        0
        ·
        22 days ago

        Maybe something like this:

        output
          $output = [this.getRawListText.split('\n').slice(2).join('\n')]
          [s = seed.selectOne, ''] 
          <div style="position:relative;">
            <button style="position: absolute; left: 50%; bottom: 0%; transform: translate(-50%, -25%);" onclick="seeds.innerHTML += '[s]\r', this.disabled = true">Add to Seed History</button>
            [image(prompt)]
          </div>
          [s]<br>
          [lastTextToImagePrompt]<br>