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>
<meta charset="utf-8" />
<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">
</head>
<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>
<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>
</body>

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

@ -9,13 +9,13 @@
</head>
<body>
<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
<form>
<input type="checkbox" id="player1" name="player1" value="">
<label for="player1"><img id="player_img_1" src="imgs/dog1.gif" width="100px"></label><br>
<form id="avatar_form" >
<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>
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>
</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>
<meta charset="utf-8" />
<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">
</head>
<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>
<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>
</body>

6
tree/index.html
Unescape Escape View File

@ -11,11 +11,11 @@
<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>
You will look like
<form>
<input type="checkbox" id="player1" name="player1" value="">
<form id="avatar_form" >
<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>
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>
</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