Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

slight change to module 03-06 #18

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

slight change to module 03-06 #18

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
a24be43
slight change
JosephAni Oct 1, 2021
e82eb65
03_06/script.js
JosephAni Oct 1, 2021
ccb68f7
a24be43a3832ca88f05
JosephAni Oct 5, 2021
e1f5b88
05_10/script.js
JosephAni Oct 11, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions 02_02/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Module demo</title>
<script src="script.js"></script>
</head>
<title>Module demo</title>
</head>
<body></body>
<script src="script.js"></script>
</html>
2 changes: 2 additions & 0 deletions 03_05/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,3 +20,5 @@ const backpack = {
this.strapLength.right = lengthRight;
},
};

console.log("The backpack object:", backpack);
20 changes: 13 additions & 7 deletions 03_06/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,28 @@
*/

const backpack = {
name: "Everyday Backpack",
name: 'Everyday Backpack',
volume: 30,
color: "grey",
color: 'grey',
pocketNum: 15,
strapLength: {
left: 26,
right: 26,
},
lidOpen: false,
toggleLid: function (lidStatus) {
this.lidOpen = lidStatus;
this.lidOpen = lidStatus
},
newStrapLength: function (lengthLeft, lengthRight) {
this.strapLength.left = lengthLeft;
this.strapLength.right = lengthRight;
this.strapLength.left = lengthLeft
this.strapLength.right = lengthRight
},
};
}
// Added the console
console.log('The backpack object:', backpack);
console.log('The pocketNum value:', backpack.pocketNum);
console.log('The Strap length L:', backpack.strapLength.left);

console.log("The backpack object:", backpack);
var query = 'pocketNum'

console.log('The pocketNum value:', backpack[query]);
45 changes: 32 additions & 13 deletions 05_10/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,19 +8,19 @@
* - A tip: Use either display flex or display grid to create the horizontal menu.
*/

import Backpack from "./Backpack.js";
import Backpack from './Backpack.js'

const everydayPack = new Backpack(
"Everyday Backpack",
'Everyday Backpack',
30,
"grey",
'grey',
15,
26,
26,
false,
"December 5, 2018 15:00:00 PST",
"../assets/images/everyday.svg"
);
'December 5, 2018 15:00:00 PST',
'../assets/images/everyday.svg'
)

const content = `

Expand Down Expand Up @@ -50,13 +50,32 @@ const content = `
}</span></li>
</ul>

`;
`

const main = document.querySelector(".maincontent");
const main = document.querySelector('.maincontent')

const newArticle = document.createElement("article");
newArticle.classList.add("backpack");
newArticle.setAttribute("id", "everyday");
newArticle.innerHTML = content;
const newArticle = document.createElement('article')
newArticle.classList.add('backpack')
newArticle.setAttribute('id', 'everyday')
newArticle.innerHTML = content

main.append(newArticle);
main.append(newArticle)

/**
* Add a navigation section to the DOM
*/
const navContent = `
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Backpacks</a></li>
<li><a href="#">Other things</a></li>
<li><a href="#">Contact</a></li>
`

const mainNav = document.createElement('nav')
mainNav.classList.add('main-navigation')
const navList = document.createElement('ul')
navList.innerHTML = navContent
mainNav.append(navList)

document.querySelector('.siteheader').append(mainNav)
18 changes: 18 additions & 0 deletions Practice/03_07/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,21 @@
* - Find an object that has another object inside of it to create a nested object.
* - Test your objects in the browser console by accessing the entire object and its specific properties.
*/
const penjar = {
name: 'Everyday penjar',
volume: 15,
color: 'yellow',
numPen: 15,
lidOpen: true,
toggleLid: function (lidStatus) {
this.lidOpen = lidStatus
},
}
// Added the console
console.log('The penjar object:', penjar)
console.log('The numPen value:', penjar.numPen)
console.log('The lid is open:', penjar.lidOpen)

var query = 'penjar'

console.log('The penjar value:', penjar[query])
14 changes: 14 additions & 0 deletions Practice/03_12/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,17 @@
* - Create several objects using the class.
* - Test the objecs by calling their properties and using their methods in the console.
*/
import Backpack from './Backpack.js'

const everydayPack = new Backpack(
'Everyday Backpack',
30,
'grey',
15,
26,
26,
false
)

console.log('The everydayPack object:', everydayPack)
console.log('The color value:', everydayPack.color)
Loading