news

4 years ago · 541d45799a
parent cefb698fd6
commit 541d45799a
13 changed files with 66 additions and 26 deletions
--- a/.DS_Store
+++ b/.DS_Store
--- a/tree/.DS_Store
+++ b/tree/.DS_Store
--- a/tree/1_newspaper.html
+++ b/tree/1_newspaper.html
@ -1,18 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-US">
-<head>
-      <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
-    <title>start</title>
-    <link rel="stylesheet" href="index.css">
-    
-</head>
-<body>
-    <iframe name="news" src="http://cnn.com/"></iframe>
-<a href="http://repubblica.it" target="news">Read</a>
-
-
-<script src="jquery.min.js"></script>
-<script type="text/javascript" src="index.js" ></script>
-    
-</body>
--- a/tree/imgs/.DS_Store
+++ b/tree/imgs/.DS_Store
--- a/tree/imgs/avatars/.DS_Store
+++ b/tree/imgs/avatars/.DS_Store
--- a/tree/imgs/avatars/ball1.png
+++ b/tree/imgs/avatars/ball1.png
--- a/tree/imgs/avatars/ball2.gif
+++ b/tree/imgs/avatars/ball2.gif
--- a/tree/imgs/avatars/ball3.gif
+++ b/tree/imgs/avatars/ball3.gif
--- a/tree/imgs/avatars/ball4.gif
+++ b/tree/imgs/avatars/ball4.gif
--- a/tree/index.css
+++ b/tree/index.css
@ -1,5 +1,5 @@
 div.introtext {
-    font-size: 5vw;;    
+    font-size: 5vw;   
 }

 form {
@ -7,4 +7,22 @@ form {
 }
 label {
    display: inline;
+}
+
+input#player_name {
+    /*
+-webkit-appearance: none;*/
+border: 4px black solid;
+border-radius: 15px;
+font-size: 4vw; 
+color: black;
+}
+
+button {
+    -webkit-appearance: none;
+    font-size: 4vw;
+    background-color: white;
+    border: 4px black solid;
+    border-radius: 15px;
+    color:black;
 }
--- a/tree/index.html
+++ b/tree/index.html
@ -4,18 +4,19 @@
      <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
    <title>welcome</title>
-    <link rel="icon" href="imgs/icon_welcome.png">
+    <link rel="icon" href="imgs/avatars/ball2.gif">
    <link rel="stylesheet" href="index.css">
    
 </head>
 <body>
    <div class="introtext">
-    welcome to *game_name*, in this story you will be someone called 
+        It looks like you have been summoned by the oracle (<img src="imgs/avatars/ball1.png" height="70px">,<img src="imgs/avatars/ball2.gif" height="70px">,<img src="imgs/avatars/ball4.gif" height="70px">). 
+        You will be asked to start a journey: throughout it you will be called 
    <form name="nameForm">
        <input id="player_name" type="text" placeholder="enter you name" >
-    </form>.<br>
+    </form>.
  
-    You can decide whether you are going to look like     
+   You can decide whether you are going to look like   
   <form id="avatar_form" >
  <input type="radio" id="player1" name="player_avatar" value="imgs/avatars/avatar1.gif">
  <label for="player1"><img id="player_img_1" src="imgs/avatars/avatar1.gif" height="70px"></label>
--- a/tree/park.css
+++ b/tree/park.css
@ -22,6 +22,25 @@ p.text_container {
    
 }

+#newspaper_index{
+    position:fixed;
+   /* border: solid black 2px;*/
+    left:15%;
+    top:10%;
+    background-color: white;
+    z-index:30;
+    box-shadow: 10px 10px 15px black;
+    max-width: 30%;
+    font-size: 1vw;
+}
+.index_content{
+    margin: 5% 5% 5% 5% ;
+
+
+}
+
+/*images*/ 
+
 #player_img {
    bottom: 22%;
    left: 35%;
--- a/tree/park.html
+++ b/tree/park.html
@ -9,7 +9,25 @@
    
 </head>
 <body>
-<div id="groundline"></div>
+    <div id="groundline"></div>
+    <div id="newspaper_index" style="display: none;">
+      <div class="index_content">
+        Juicy Local News<br><br>
+        News from the school:<br>
+        -----Our annual trip to the Spring River National Park <br><br>
+        suspected food poisoning at primary school 
+        *<br>
+        *<br>
+        *<br>
+        *<br>
+        *<br>
+        *<br>
+
+
+
+      </div>
+    </div>
+
    <div id="player_img"></div>
    <img id="bench" src="imgs/park/bench1.gif" height="160px">
    <img id="tree1" src="imgs/park/tree1.gif" height="300px">
@ -25,7 +43,7 @@
    <img id="flower2" src="imgs/park/flower2.gif" height="50px">

    <p class="text_container"> Hello <span id="player_name"> </span>. It's Saturday morning. You are 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 close to you. 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 close to you. Maybe you want to <button id="open_newspaper_index">give it a read</button>. 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>
@ -40,7 +58,9 @@
    //get player name from local storage
    document.querySelector('#player_name').innerHTML =localStorage.playerName;

-
+    $("#open_newspaper_index").click (function(){
+      $("#newspaper_index").toggle();
+    });

 </script>