-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtutorial.html
169 lines (153 loc) · 9.02 KB
/
tutorial.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>WaifuCHAIN</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" href="css/tutorial.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.6/plugins/ScrollToPlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.6/plugins/CSSPlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.6/TweenLite.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="js/main.js"></script>
<script src="js/tutorial.js"></script>
</head>
<body onload="main()">
<div id="background">
<div id="bgg1"></div>
<div id="bgg2"></div>
</div>
<a id="float-discord" href="https://discordapp.com/invite/ykrT4bw" target="_blank" class="round-btn"><div id="discord-text"><span>Talk to us on Discord</span></div></a>
<nav id="nav" class="navbar">
<div class="navbar-container">
<div class="navbar-g expandButton">
<svg onclick="displayMenu()" id="menu" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="32px" height="32px" viewBox="0 0 459 459" style="enable-background:new 0 0 459 459;" xml:space="preserve">
<g id="menu-icon-lines">
<path d="M0,382.5h459v-51H0V382.5z M0,255h459v-51H0V255z M0,76.5v51h459v-51H0z"/>
</g>
<g id="menu-icon-close">
<path style="fill-rule:evenodd;clip-rule:evenodd;" d="M131.804,106.491l75.936-75.936c6.99-6.99,6.99-18.323,0-25.312 c-6.99-6.99-18.322-6.99-25.312,0l-75.937,75.937L30.554,5.242c-6.99-6.99-18.322-6.99-25.312,0c-6.989,6.99-6.989,18.323,0,25.312 l75.937,75.936L5.242,182.427c-6.989,6.99-6.989,18.323,0,25.312c6.99,6.99,18.322,6.99,25.312,0l75.937-75.937l75.937,75.937 c6.989,6.99,18.322,6.99,25.312,0c6.99-6.99,6.99-18.322,0-25.312L131.804,106.491z" fill="#000"/>
</g>
</svg>
</div>
<div onclick="location.href='index.html'" class="navbar-g nbrand">
<p>WaifuChain</p>
</div>
<div id="navlist" class="navbar-g nmenu">
<div class="navbar-g spaces">
<ul>
<li>
<a href="index.html">
Home
</a>
</li>
<li>
<a href="soon.html">
Bid
</a>
</li>
<li>
<a href="faq.html">
FAQs
</a>
</li>
<li>
<a href="https://github.com/corollari/waifuchain" target="_blank">
Contract
</a>
</li>
</ul>
</div>
</div>
<div class="navbar-g">
<a href="tutorial.html"><button id="playnav" class="nbutton">Start</button></a>
</div>
</div>
</nav>
<div class="slides-container">
<div class="slide" id="slide-intro-1">
<div class="centered">
<h1>Welcome!</h1>
<p>WaifuChain is a blockchain cryptocollectible, which means that some steps must be taken to get started. We will be breaking, not only the process to start, but what to do after, into easy to follow parts (a cool “tu-Toriel” if you may). After these steps, you are all set to get your waifus!</p>
<p><span class="go-next">Aight!</span></p>
</div>
</div>
<div class="slide" id="slide-intro-2">
<div class="centered">
<h1>Steps to get ready for WaifuChain Beta:</h1>
<p id = "cuck">1. Install Metamask <br>2. Get the funds needed to acquire your waifus<br>3. Bid on waifu auctions<br>4. Another way to get a Waifu: the market.<br>5. I have my waifu, what do I do now?<br>6. What’s commin’ up next?</p>
<p><span class="go-next">Lets start!</span></p>
</div>
</div>
<div class="slide" id="slide-2">
<div class="centered">
<h1>1. Install Metamask</h1>
<h1><img src="https://metamask.io/img/ethereum-metamask-chrome.png"></h1>
<p>You will need a place for your waifus to rest! That's where Metamask comes in, a cozy and secure wallet. You should install or activate your Metamask Extension in your browser. If you do not have metamask, get it here: https://metamask.io/ </p>
<!-- <p><a>https://metamask.io</a>.</p> -->
<p><span style="cursor:pointer" onclick="checkDoneExtension()">Done!</span></p>
</div>
</div>
<div class="slide" id="slide-3">
<div class="centered">
<h1>Open up your browser’s MetaMask extension</h1>
<p>That done by tapping the top right fox cute logo. Then login. You did it, you really know how to click at the right places! I mean, If I could I would give you a cookie, but welp.</p>
<p><span onclick="checkDoneWallet()">Done!</span></p>
</div>
</div>
<div class="slide" id="slide-4">
<div class="centered">
<h1>2. Getting the funds to acquire your waifus</h1>
<h1>(in Beta version)</h1>
<p>You can go to <a>your profile</a> or see what waifus are today in <a>auction</a>. As this is the beta, the currency will be completely free (yeah, we know you like free things!). That means you can get your Waifus at no cost, yay!</p>
<p>To get this moneyz go to: <a ref= "https://faucet.rinkeby.io/"> https://faucet.rinkeby.io/</a> and follow the instructions on the site</p>
<p><span class="go-next">Next!</span></p>
</div>
</div>
<div class="slide" id="slide-5">
<div class="centered">
<h1>3. Bid on waifu auctions</h1>
<p>Each day, different waifus will be on auction. Once you click the “BID” button on the official site, you will be able to check what waifus are available. Chose and bid on the waifu/s you want, after the bidding process ends, you will know if you got your partner.</p>
<p><b><i>“I’m sad, I didn’t get the waifu :(” </i></b>- No problem! You can participate again in tomorrow’s auction (Keep it between you and me, there’s still another way to get a waifu: the market. We will get there in part n.4)</p>
<p><b><i>“Hurray! I got my dream waifu.”</i></b> - Congratulations, a new world has opened for you! </p>
<p><span class="go-next">Next!</span></p>
</div>
</div>
<div class="slide" id="slide-6">
<div class="centered">
<h1>4. Another way to get a Waifu: the market </h1>
<p>Buy, Sell, Exchange waifus with other users. Chose your prices, increase the value of your waifu, become the supreme harem owner. Sounds like a nice plan if you ask me...</p>
<p><span class="go-next">Next!</span></p>
</div>
</div>
<div class="slide" id="slide-7">
<div class="centered">
<h1>5. I have my waifu, what do I do now?</h1>
<p>Now that you have your beloved waifu, you need to share it with the world! To do that, go and install our twitter extension (Yes, you are welcome).
We will be adding more extensions and also a bot for discord in which you will be able to use your waifus in a tactical fighting game (Poke like).
Check out our RoadMap for more information!</p>
<p><span class="go-next">Next!</span></p>
</div>
</div>
<div class="slide" id="slide-8">
<div class="centered">
<h1>6. What’s commin’ up next?</h1>
<p>We know that you know that we know that you like cool things, that is why we have some awesome ideas being developed while you are reading these lines: </p>
<p id = "cuck">·Bot for discord.<br>·Tactical fighting battles (Poke like)<br>·Chat with your Waifu via AI</p>
<p><i>ehemChecktheRoadMap- uh? who said that? </i></p>
</div>
</div>
</div>
<!--<div id="nav2">
<ul>
<li><a href="#slide-1">Installing Metamask</a></li>
<li><a href="#slide-2">Sign in to MetaMask</a></li>
<li><a href="#slide-3">Finish</a></li>
<li><a href="#slide-4">More</a></li>
</ul>
</div>-->
</body>
</html>