-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
193 lines (183 loc) · 10.6 KB
/
index.html
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
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta Tags -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>Home | Generated</title>
<link href="./images/assets/logo/icon.png" rel="icon">
<meta content="Generated Prints" name="og:title">
<meta content="Generated" name="og:site_name">
<meta content="./images/assets/promos/squarePost1.png" name="og:image">
<meta content="website" name="og:type">
<meta content="https://generatedprints.com/" name="og:url">
<meta content="en_US" name="og:locale">
<!-- PWA -->
<link href="./images/assets/logo/generated.png" rel="apple-touch-icon">
<link rel="manifest" href="./manifest.json">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"
integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
<!-- Swiper -->
<link rel="stylesheet" href="https://unpkg.com/swiper@7/swiper-bundle.min.css" />
<!-- Bootstrap Icons CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css">
<!-- Personal CSS -->
<link href="./css/styles.css" rel="stylesheet">
</head>
<body style="opacity: 0;">
<div class="nav">
<a onclick="linkClicked('./')" id="homelinkM">
<h1>//Generated</h1>
</a>
<div class="d-flex flex-row">
<a onclick="linkClicked('./about/')" id="aboutlink" class="pageLink">
<h5>About</h5>
</a>
<a onclick="linkClicked('./contact/')" id="contactlink" class="pageLink">
<h5>Contact</h5>
</a>
<a onclick="linkClicked('./')" id="homelink">
<h1>//Generated</h1>
</a>
<a onclick="linkClicked('./socials/')" id="socialslink" class="pageLink">
<h5>Socials</h5>
</a>
<a onclick="linkClicked('./shop/')" id="shoplink" class="pageLink">
<h5>Shop</h5>
</a>
</div>
</div>
<!-- <div class="ad" style="top: 4%;"></div> -->
<div class="fullpage" id="land1">
<div class="imagegroup" id="landing">
<img src="./images/ai/nothing.png" class="framed shadow-sm" alt="AI Generated Image" id="imageback">
<img src="./images/ai/animals.png" class="framed shadow-sm" alt="AI Generated Image" id="imagemid">
<img src="./images/ai/forest2.png" class="framed shadow-sm" alt="AI Generated Image" id="imagefront">
</div>
<div class="textgroup">
<svg class="madewai" width="1002px" height="873px" viewBox="0 0 1002 873" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
<!-- Generated by Pixelmator Pro 2.1.3 -->
<path id="Rectangle" d="M0 873 L1002 873 1002 0 0 0 Z" fill="#c44900" fill-opacity="1" stroke="none" />
<path id="AI"
d="M882 366.254 L831.753 366.254 831.753 416.501 882 416.501 882 517.647 831.753 517.647 831.753 668.386 882 668.386 882 768.88 681.014 768.88 681.014 668.386 731.26 668.386 731.26 517.647 681.014 517.647 681.014 416.501 731.26 416.501 731.26 366.254 681.014 366.254 681.014 265.761 882 265.761 Z M648.386 768.88 L539.41 768.88 274.473 668.386 231.405 768.88 121.776 768.88 337.118 265.761 433.696 265.761 Z M385.407 408.67 L317.542 567.893 481.985 632.496 Z"
fill="#efd6ac" fill-opacity="1" stroke="none" />
<path id="made-with"
d="M801.146 247.263 L830.382 247.263 830.382 190.806 852.763 190.806 852.763 247.263 882 247.263 882 106.12 852.763 106.12 852.763 162.376 830.382 162.376 830.382 135.357 843.085 135.357 843.085 106.12 801.146 106.12 Z M724.929 106.12 L724.929 135.357 757.996 135.357 757.996 247.263 787.031 247.263 787.031 106.12 Z M716.057 247.465 L716.057 106.322 686.82 106.322 686.82 247.465 Z M587.819 247.465 L609.998 247.465 615.846 223.067 621.693 247.465 643.872 247.465 677.948 106.322 648.107 106.322 632.984 169.231 C626.734 148.463 623.104 127.292 617.66 106.322 L614.031 106.322 C611.611 116.807 609.192 127.292 606.57 137.777 L598.909 169.231 583.786 106.322 553.743 106.322 Z M423.085 105.919 L423.287 247.465 493.858 247.465 493.858 218.228 452.322 218.228 452.322 190.806 482.567 190.806 482.567 161.771 452.322 161.771 452.322 134.954 493.858 134.954 493.858 105.919 Z M312.389 163.384 L313.599 167.215 C317.43 179.313 328.52 215.405 329.931 220.043 L338.198 247.465 C378.726 247.465 412.197 218.228 412.197 176.49 412.197 137.777 379.936 106.322 341.223 106.322 L312.389 106.322 Z M243.834 247.465 L258.15 190.806 279.725 190.806 294.041 247.465 324.487 247.465 283.354 106.322 254.521 106.322 213.388 247.465 Z M341.626 134.752 C364.41 134.752 382.961 153.706 382.961 176.49 382.961 199.073 364.41 218.228 341.626 218.228 Z M265.207 165.602 L269.038 153.101 272.869 165.602 Z M122.049 106.322 L122.049 247.465 151.285 247.465 151.285 183.144 163.585 212.784 175.481 183.144 175.481 247.465 204.516 247.465 204.516 106.322 179.715 106.322 162.778 143.624 147.051 106.322 Z"
fill="#efd6ac" fill-opacity="1" stroke="none" />
</svg>
<h1>Who are we?</h1>
<p>All the way from Seattle, Washington, Generated is a print shop
that specializes in selling posters generated by <strong>artificial intelligence</strong>.</p>
</div>
</div>
<div class="imgbg" id="land2" style="opacity: 0;">
<div class="textgroup bgvid">
<h1>What Are AI Generated Images?</h1>
<p>AI Generated images use an AI titled "VQGAN" and another AI called "CLIP." VQGAN is a
<strong>generative adversarial neural network</strong>. "CLIP" is the program used to tell the AI if
what it is generating is really what you asked for. Together, these two AIs can generate images that
offer familiar glimpses of reality, yet feel 'broken' somehow.
</p>
<a class="btn btn-primary" onclick="linkClicked('./about/')">
Learn More
</a>
</div>
</div>
<div class="fullpage">
<div class="textgroup">
<!-- <div class="ad" style="top: 70%;"></div> -->
<h1>Let's Get Shopping</h1>
<p>Ready to fill your home, studio, apartment, or home studio apartment with unique, high quality, AI
Generated prints?</p>
<a class="btn btn-primary" onclick="linkClicked('./shop/')">Let's Get Started</a>
</div>
</div>
<div class="footer">
<!-- <img src="./images/assets/" id="decor1"> -->
<h1>//Generated </h1>
<div class="links">
<a onclick="linkClicked('./about/')" id="aboutlinkf">
<h5>About</h5>
</a>
<a onclick="linkClicked('./contact/')" id="contactlinkf">
<h5>Contact</h5>
</a>
<a onclick="linkClicked('./socials/')" id="socialslinkf">
<h5>Socials</h5>
</a>
<a onclick="linkClicked('./shop/')" id="shoplinkf">
<h5>Shop</h5>
</a>
</div>
<!-- <img src="./images/assets/" id="decor2"> -->
</div>
<!-- Disclaimer: This is a mock site. Generated is not a real business, and all rights are reserved to Jackson Graddon
2021-2022. -->
<script>
// Scroll Triggers
setTimeout(() => {
gsap.fromTo('#land2', 1.5, { scrollTrigger: ".textgroup.bgvid", opacity: 0, delay: 0.2, ease: "power2.out" }, { opacity: 1, ease: "power2.out" });
}, 1500)
// Disable Right Click
document.addEventListener('contextmenu', event => event.preventDefault());
// Visual Effects when nav link clicked
function linkClicked(link) {
gsap.to('body', 0.5, { opacity: 0, ease: "power2.inOut" });
setTimeout(() => {
window.location.href = link;
}, 500);
}
// Test for Safari
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('safari') != -1) {
if (ua.indexOf('chrome') > -1) {
// Chrome or Edge
} else {
document.getElementById('landing').classList.add('safari');
}
}
</script>
<!-- Bootstrap JS Bundle (bootstrap.js + popper.js) -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"
integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ"
crossorigin="anonymous"></script>
<!-- jsCookie -->
<script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.1/dist/js.cookie.min.js"
integrity="sha256-0H3Nuz3aug3afVbUlsu12Puxva3CP4EhJtPExqs54Vg=" crossorigin="anonymous"></script>
<script src="./js/accessibility.js"></script>
<!-- GSAP -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/CSSRulePlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/TextPlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/ScrollToPlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/ScrollTrigger.min.js"></script>
<!-- Swiper -->
<script src="https://unpkg.com/swiper@7/swiper-bundle.min.js"></script>
<!-- Detect Cache and Load Animations -->
<script>
// If the page is loaded from cache, refresh it to show up to date content.
(function () {
window.onpageshow = function (event) {
if (event.persisted) {
window.location.reload();
}
};
})();
// Onload effects
window.onload = function () {
try {
window.scrollTo(0, 0);
gsap.fromTo('body', 0.8, { y: 25, opacity: 0, delay: 0.5, overflowY: 'hidden', ease: "power2.out" }, { delay: 0.5, overflowY: 'visible', y: 0, opacity: 1 });
} catch (error) {
console.log(error);
document.querySelector('body').style.opacity = 1;
document.querySelector('body').style.display = 'block';
}
};
</script>
</body>
</html>