annasandri
/
pizzagate
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

localstor

Browse Source
master
annasandri 4 years ago
parent 0439586e2b
commit 83837d5751
6 changed files with 58 additions and 14 deletions
Show Stats Download Patch File Download Diff File

13
tree/.ipynb_checkpoints/0_start-checkpoint.html
Unescape Escape View File

@ -3,18 +3,25 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>start</title> <title>bench</title>
<link rel="stylesheet" href="index.css"> <link rel="stylesheet" href="index.css">
</head> </head>
<body> <body>
<h1> start</h1> <p> Hello <div id="player_img"> </div>It's Saturday morning. You are sitting on a bench at the park waiting for your friend Amanda. She seems to be really late.
<p> Hello <div id="player_img"></div>It's Saturday morning. You are sitting on a bench at the park waiting for your friend Amanda. She seems to be really late.
You spot a copy of today's newspaper on the bench. Maybe you want to <a href="1_newspaper.html">give it a read</a>. You can <a href="1_walk.html">go for a little walk</a> or just <a href="1_amanda.html">wait for Amanda</a> if you feel like it. </p> You spot a copy of today's newspaper on the bench. Maybe you want to <a href="1_newspaper.html">give it a read</a>. You can <a href="1_walk.html">go for a little walk</a> or just <a href="1_amanda.html">wait for Amanda</a> if you feel like it. </p>
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<script>
console.log (localStorage.myavatar)
var img = document.createElement("img");
img.src = localStorage.myavatar;
var player_img = document.querySelector("#player_img");
player_img.appendChild(img);
</script>
<script type="text/javascript" src="index.js" ></script> <script type="text/javascript" src="index.js" ></script>
</body> </body>

10
tree/.ipynb_checkpoints/index-checkpoint.html
Unescape Escape View File

@ -9,13 +9,13 @@
</head> </head>
<body> <body>
<div class="introtext"> <div class="introtext">
welcome to *name*, in this story you will be someone called <form><input type="text" placeholder="enter you name" id="player_name" name="player_name"></form>. welcome to *name*, in this story you will be someone called <form><input type="text" placeholder="enter you name" id="player_name" name="player_name"></form>.<br>
You will look like You will look like
<form> <form id="avatar_form" >
<input type="checkbox" id="player1" name="player1" value=""> <input type="radio" id="player1" name="player_avatar" value="imgs/dog1.gif">
<label for="player1"><img id="player_img_1" src="imgs/dog1.gif" width="100px"></label><br> <label for="player1"><img id="player_img_1" src="imgs/dog1.gif" width="100px"></label>
or like or like
<input type="checkbox" id="player2" name="player2" value=""> <input type="radio" id="player2" name="player_avatar" value="imgs/dog2.gif">
<label for="player2"> <img id="player_img_2" src="imgs/dog2.gif" width="100px"></label><br> <label for="player2"> <img id="player_img_2" src="imgs/dog2.gif" width="100px"></label><br>
</form> </form>

15
tree/.ipynb_checkpoints/index-checkpoint.js
Unescape Escape View File

@ -0,0 +1,15 @@
//store form's value in localStorage
var f = document.querySelector("form#avatar_form")
f.onchange = updateAvatar
document.querySelector("#player1").onchange = updateAvatar
document.querySelector("#player2").onchange = updateAvatar
function updateAvatar () {
console.log("CHANGE");
var fd = new FormData(f)
var avatar=fd.get("player_avatar")
console.log("avatar", avatar);
localStorage.myavatar=avatar
}

13
tree/0_start.html
Unescape Escape View File

@ -3,18 +3,25 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>start</title> <title>bench</title>
<link rel="stylesheet" href="index.css"> <link rel="stylesheet" href="index.css">
</head> </head>
<body> <body>
<h1> start</h1> <p> Hello <div id="player_img"> </div>It's Saturday morning. You are sitting on a bench at the park waiting for your friend Amanda. She seems to be really late.
<p> Hello <div id="player_img"></div>It's Saturday morning. You are sitting on a bench at the park waiting for your friend Amanda. She seems to be really late.
You spot a copy of today's newspaper on the bench. Maybe you want to <a href="1_newspaper.html">give it a read</a>. You can <a href="1_walk.html">go for a little walk</a> or just <a href="1_amanda.html">wait for Amanda</a> if you feel like it. </p> You spot a copy of today's newspaper on the bench. Maybe you want to <a href="1_newspaper.html">give it a read</a>. You can <a href="1_walk.html">go for a little walk</a> or just <a href="1_amanda.html">wait for Amanda</a> if you feel like it. </p>
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<script>
console.log (localStorage.myavatar)
var img = document.createElement("img");
img.src = localStorage.myavatar;
var player_img = document.querySelector("#player_img");
player_img.appendChild(img);
</script>
<script type="text/javascript" src="index.js" ></script> <script type="text/javascript" src="index.js" ></script>
</body> </body>

6
tree/index.html
Unescape Escape View File

@ -11,11 +11,11 @@
<div class="introtext"> <div class="introtext">
welcome to *name*, in this story you will be someone called <form><input type="text" placeholder="enter you name" id="player_name" name="player_name"></form>.<br> welcome to *name*, in this story you will be someone called <form><input type="text" placeholder="enter you name" id="player_name" name="player_name"></form>.<br>
You will look like You will look like
<form> <form id="avatar_form" >
<input type="checkbox" id="player1" name="player1" value=""> <input type="radio" id="player1" name="player_avatar" value="imgs/dog1.gif">
<label for="player1"><img id="player_img_1" src="imgs/dog1.gif" width="100px"></label> <label for="player1"><img id="player_img_1" src="imgs/dog1.gif" width="100px"></label>
or like or like
<input type="checkbox" id="player2" name="player2" value=""> <input type="radio" id="player2" name="player_avatar" value="imgs/dog2.gif">
<label for="player2"> <img id="player_img_2" src="imgs/dog2.gif" width="100px"></label><br> <label for="player2"> <img id="player_img_2" src="imgs/dog2.gif" width="100px"></label><br>
</form> </form>

15
tree/index.js
Unescape Escape View File

@ -0,0 +1,15 @@
//store form's value in localStorage
var f = document.querySelector("form#avatar_form")
f.onchange = updateAvatar
document.querySelector("#player1").onchange = updateAvatar
document.querySelector("#player2").onchange = updateAvatar
function updateAvatar () {
console.log("CHANGE");
var fd = new FormData(f)
var avatar=fd.get("player_avatar")
console.log("avatar", avatar);
localStorage.myavatar=avatar
}
Write Preview
Loading…
Cancel
Save