File size: 6,276 Bytes
04fa58e
 
 
 
 
 
d76ea0c
 
 
04fa58e
 
 
 
 
180ae41
04fa58e
 
 
 
 
 
 
 
180ae41
04fa58e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
139dfe0
04fa58e
d76ea0c
04fa58e
 
 
 
 
997a354
 
139dfe0
997a354
139dfe0
997a354
04fa58e
74c1735
04fa58e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d76ea0c
04fa58e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
180ae41
04fa58e
 
180ae41
04fa58e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d76ea0c
04fa58e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
d76ea0c
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Infer</title>
    <link rel="stylesheet" href="static/styles.css" />
    <link rel="icon" type="image/svg+xml" href="static/assets/favicon.svg" />
    <link rel="icon" type="image/png" href="static/assets/favicon.png" />
  </head>
  <body>
    <header class="main-header">
      <div class="header-left">
        <h1>
          <a href="/" class="home-link"
            >Infer <span class="star"></span></a
          >
        </h1>
        <p class="subtitle">Making AI accountability tools for artists.</p>
      </div>
      <nav class="header-nav">
        <a href="#" class="nav-link">About</a>
        <span class="nav-separator"></span>
        <a href="/resources" class="nav-link">Resources</a>
        <span class="nav-separator"></span>
        <a href="mailto:hello@infer.ai" class="nav-link">Contact</a>
      </nav>
    </header>
    <main class="main-content">
      <div class="home-columns">
        <section class="upload-section" style="min-height: 540px">
          <div class="card-header">
            <h2>Model select</h2>
            <p>Select an AI model to test against</p>
          </div>
          <div class="card-content">
            <div class="model-selector">
              <div class="custom-dropdown" id="modelDropdown">
                <button
                  type="button"
                  class="dropdown-toggle"
                  id="dropdownToggle"
                >
                  <span id="selectedModel">CompVis Stable Diffusion v1.4</span>
                  <img
                    src="static/assets/arrow-down.svg"
                    alt="Dropdown arrow"
                    id="dropdown-arrow"
                  />
                </button>
                <ul class="dropdown-menu" id="dropdownMenu" hidden>
                  <li
                    class="dropdown-option selected"
                    data-value="CompVis/stable-diffusion-v1-4"
                  >
                    CompVis Stable Diffusion v1.4
                  </li>
                  <li
                    class="dropdown-option"
                    data-value="rupeshs/LCM-runwayml-stable-diffusion-v1-5"
                  >
                    Runway Stable Diffusion v1.5
                  </li>
                  <li
                    class="dropdown-option"
                    data-value="prompthero/openjourney-v4"
                  >
                    OpenJourney v4
                  </li>
                </ul>
              </div>
            </div>
            <div class="upload-area" id="uploadArea">
              <input type="file" id="imageInput" accept="image/*" hidden />

              <div class="upload-placeholder">
                <img
                  src="static/assets/upload-icon.svg"
                  alt="Upload"
                  id="uploadIcon"
                />
                <p>Click or drag-and-drop to upload a file</p>
              </div>
              <img id="imagePreview" class="preview-image" hidden />
            </div>
            <div id="errorMessage" class="error-message"></div>
            <button id="submitButton" class="submit-button" disabled>
              <span>Let's go</span>
              <span></span>
            </button>
          </div>
        </section>
        <section class="result-section" id="result" hidden>
          <div class="result-content">
            <div class="result-image-container">
              <img id="resultImage" class="result-image" hidden />
            </div>
            <h2>Result: <span id="resultStatus"></span></h2>
            <p id="resultDescription"></p>
            <div class="probability-section">
              <p>
                Predicted membership probability:
                <span id="probabilityValue"></span>
              </p>
              <div class="probability-bar">
                <div id="probabilityFill" class="probability-fill"></div>
              </div>
            </div>
            <div id="likelyInfo" class="likely-info" hidden>
              <p class="likely-users">
                There are <strong>531 other users</strong> that have work that
                is likely in this model's training data.
              </p>
              <h3>What now?</h3>
              <div class="result-actions">
                <a href="/resources" class="action-button"
                  >Protect your work <span class="arrow"></span></a
                >
                <a href="/get-organized" class="action-button"
                  >Get organized <span class="arrow"></span></a
                >
              </div>
            </div>
          </div>
        </section>
      </div>
    </main>
    <!-- <div
      class="contact-optin"
      style="display: none; margin: 2em auto 0 auto; max-width: 400px"
    >
      <input type="checkbox" id="optInCheckbox" />
      <label for="optInCheckbox"
        >Notify me if there are updates about this project (optional):</label
      >
      <input
        type="email"
        id="contactInfo"
        class="styled-input"
        placeholder="Your email (optional)"
        style="margin-left: 0.5em"
      />
    </div> -->
    <script src="static/app.js"></script>
    <div id="aboutOverlay" class="about-overlay" style="display:none;">
      <div class="about-modal">
        <button class="about-close" id="aboutCloseBtn" aria-label="Close About">&times;</button>
        <h2>About Infer</h2>
        <p>
          Infer helps artists and image creators check whether their work was likely used to train popular AI models. By comparing your image against model behaviors, we can estimate its presence in the training data—something that's often invisible by design.
        </p>
        <p>
          If your image comes up as a likely match, you'll get two paths:
          <ul>
            <li>Protect Your Art with tools to cloak, license, or fight back</li>
            <li>Get Organized with others facing the same issue—through legal coordination, shared resources, and community defense</li>
          </ul>
        </p>
      </div>
    </div>
  </body>
</html>