forked from bloominstituteoftechnology/DOM-I
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
115 lines (83 loc) · 4.18 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
const siteContent = {
"nav": {
"nav-item-1": "Services",
"nav-item-2": "Product",
"nav-item-3": "Vision",
"nav-item-4": "Features",
"nav-item-5": "About",
"nav-item-6": "Contact",
"img-src": "img/logo.png"
},
"cta": {
"h1": "DOM Is Awesome",
"button": "Get Started",
"img-src": "img/header-img.png"
},
"main-content": {
"features-h4":"Features",
"features-content": "Features content elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.",
"about-h4":"About",
"about-content": "About content elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.",
"middle-img-src": "img/mid-page-accent.jpg",
"services-h4":"Services",
"services-content": "Services content elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.",
"product-h4":"Product",
"product-content": "Product content elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.",
"vision-h4":"Vision",
"vision-content": "Vision content elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.",
},
"contact": {
"contact-h4" : "Contact",
"address" : "123 Way 456 Street Somewhere, USA",
"phone" : "1 (888) 888-8888",
"email" : "sales@greatidea.io",
},
"footer": {
"copyright" : "Copyright Great Idea! 2018"
},
};
let navA = document.getElementsByTagName ('a');
let logo = document.getElementById("logo-img");
let header = document.querySelector('h1');
let button = document.querySelector('.cta button');
let ctaImg = document.getElementById("cta-img");
let main = document.querySelectorAll("h4");
let paragraph = document.querySelectorAll("p");
let middleImg = document.getElementById("middle-img");
let theContact = document.querySelector(".contact h4");
let contactP = document.querySelectorAll(".contact p");
let footer = document.querySelector("footer p")
// nav
navA[0].textContent = siteContent.nav["nav-item-1"];
navA[1].textContent = siteContent.nav["nav-item-2"];
navA[2].textContent = siteContent.nav["nav-item-3"];
navA[3].textContent = siteContent.nav["nav-item-4"];
navA[4].textContent = siteContent.nav["nav-item-5"];
// Example: Update the img src for the logo
logo.setAttribute('src', siteContent["nav"]["img-src"])
// CTA
header.textContent = siteContent.cta["h1"];
button.textContent = siteContent.cta["button"];
ctaImg.setAttribute('src', siteContent ["cta"]["img-src"])
// Main Content Headers
main[0].textContent = siteContent["main-content"]["features-h4"];
main[1].textContent = siteContent["main-content"]["about-h4"];
main[2].textContent = siteContent["main-content"]["services-h4"];
main[3].textContent = siteContent["main-content"]["product-h4"];
main[4].textContent = siteContent["main-content"]["vision-h4"];
// Middle Img
middleImg.setAttribute('src', siteContent["main-content"]["middle-img-src"])
// Main Content Paragraphs
paragraph[0].textContent = siteContent["main-content"]["features-content"];
paragraph[1].textContent = siteContent["main-content"]["features-content"];
paragraph[2].textContent = siteContent["main-content"]["features-content"];
paragraph[3].textContent = siteContent["main-content"]["features-content"];
paragraph[4].textContent = siteContent["main-content"]["features-content"];
// Contact Header
theContact.textContent = siteContent["contact"]["contact-h4"];
// Contact Paragraph
contactP[0].textContent = siteContent ["contact"]["address"];
contactP[1].textContent = siteContent ["contact"]["phone"];
contactP[2].textContent = siteContent ["contact"]["email"];
// Footer
footer.textContent = siteContent ["footer"]["copyright"];