Benjamin/Web-Dev-Classwork-2022
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add files via upload

Browse Source
This commit is contained in:
Benjamin Adovasio
2025-09-05 09:40:42 -04:00
committed by GitHub
commit 9b61405f91
9 changed files with 291 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
2.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<script src="script.js"></script>
</body>
</html>

21
3.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<script src="script.js"></script>
</body>
</html>

21
4.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<script src="script.js"></script>
</body>
</html>

21
5.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<script src="script.js"></script>
</body>
</html>

21
6.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<script src="script.js"></script>
</body>
</html>

21
index.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="active" class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<script src="script.js"></script>
</body>
</html>

36
options.html Normal file
View File

@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Final Project</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<header>
<ul id="heading">
<li class="scenes"><a href="index.html">Scene 1</a></li>
<li class="utils"><a href="options.html">𓃑</a></li>
</ul>
</header>
<body>
<h1 class="options">Options:</h1>
<table id="sceneList" class="options">
<thead>
<tr>
<th>Current Scenes:</th>
</tr>
<tr>
<td>Scene 1</td>
</tr>
</thead>
<tbody>
</tbody>
</table>
<p class="options">Type a new name and click enter to save</p>
<script src="script.js"></script>
</body>
</html>

74
script.js Normal file
View File

@@ -0,0 +1,74 @@
let sceneArray = ['Scene 2','Scene 3'] ;
array_str = JSON.stringify(sceneArray);
setCookie("sceneArray",array_str, 5);
let sceneCount = 1;
function addScene() {
sceneCount++;
let newScene = "Scene " + sceneCount;
sceneArray.push(newScene);
setCookie("sceneArray",array_str, 5);
}
sceneArray = getCookie("sceneArray");
for (i=0; i<sceneArray.length; i++){
sceneCount++;
var ul = document.getElementById("heading");
var li = document.createElement("li");
var href = document.createElement("a");
href.appendChild(document.createTextNode(sceneArray[(sceneCount)-2]));
href.setAttribute("href", sceneCount+".html")
li.setAttribute("class", "scenes");
li.setAttribute("id", "scene" + sceneCount);
li.appendChild(href);
ul.appendChild(li);
}
if((window.location.pathname.split("/").pop().slice(0,-5)) == "index"){
console.log("index.html");
}
else if((window.location.pathname.split("/").pop().slice(0,-5)) == "options"){
console.log("options.html");
for(i=0; i<sceneArray.length; i++){
var tbodyRef = document.getElementById('sceneList').getElementsByTagName('tbody')[0];
var newRow = tbodyRef.insertRow();
var newCell = newRow.insertCell();
newText = document.createElement("Input");
newText.setAttribute("type", "text");
newText.setAttribute("placeholder", sceneArray[i]);
newCell.appendChild(newText);
}
var tbodyRef = document.getElementById('sceneList').getElementsByTagName('tbody')[0];
var newRow = tbodyRef.insertRow();
var newCell = newRow.insertCell();
newText = document.createElement("Input");
newText.setAttribute("type", "button");
newText.setAttribute("value", "Add Scene");
newText.setAttribute("onclick", "addScene()");
newCell.appendChild(newText);
}
else{
document.getElementById("scene" + window.location.pathname.split("/").pop().slice(0,-5)).setAttribute("class", "active");
}
function setCookie(cname, cvalue, exdays) {
const d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
let expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function getCookie(cname) {
let name = cname + "=";
let ca = document.cookie.split(';');
for(let i = 0; i < ca.length; i++) {
let c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}

55
style.css Normal file
View File

@@ -0,0 +1,55 @@
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
height: 53.5px;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Change the link color to #111 (black) on hover */
li a:hover {
background-color: #111;
height: 53.5px;
}
.active { /*add an active class to current page link */
background-color: #04AA6D;
height: 53.5px;
}
.utils {
background-color: #2047d5;
float: right;
}
.scenes {
border-right: 1px solid #bbb;
}
.scenes:last-child {
border-right: none;
}
.options{
text-align: center;
position: relative;
}
table, th, td {
margin-left: auto;
margin-right: auto;
border-collapse: collapse;
width: 500px;
text-align: center;
font-size: 20px;
}