Merge branch 'master' of https://github.com/juliejonak/Yo-Clock

juliejonak · Sep 16, 2018 · 26a33c1 · 26a33c1
2 parents faa6aaa + 61bb325
commit 26a33c1
Show file tree

Hide file tree

Showing 8 changed files with 16 additions and 25 deletions.
diff --git a/img/Time Reminder Memes/1.jpg b/img/Time Reminder Memes/1.jpg
diff --git a/img/Time Reminder Memes/2.jpg b/img/Time Reminder Memes/2.jpg
diff --git a/img/Time Reminder Memes/3.jpg b/img/Time Reminder Memes/3.jpg
diff --git a/img/Time Reminder Memes/4.jpg b/img/Time Reminder Memes/4.jpg
diff --git a/img/Time Reminder Memes/5.jpg b/img/Time Reminder Memes/5.jpg
diff --git a/img/Time Reminder Memes/6.jpg b/img/Time Reminder Memes/6.jpg
diff --git a/img/Time Reminder Memes/7.jpg b/img/Time Reminder Memes/7.jpg
diff --git a/js/popup.js b/js/popup.js
@@ -3,6 +3,20 @@
 //Create new div on existing body element
 
 
+var imageArray = ['1', '2', '3', '4', '5', '6', '7',];
+
+window.addEventListener('load', function(){
+    const imageDiv = document.querySelector('.image');
+    const randomImg = document.createElement('img');
+    let num = Math.floor(Math.random() * imageArray.length);
+    let img = imageArray[num];
+    let imgStr = `img/Time Reminder Memes/${img}.jpg`;
+    randomImg.setAttribute('src', `${imgStr}`);
+    imageDiv.appendChild(randomImg);
+    randomImg.style = 'width: 80%; height: auto; border-radius: 4px;';
+});
+
+
 //Delay popup on load
 window.addEventListener('load', function(){
     this.setTimeout(function(){
@@ -24,19 +38,13 @@ popup.style = 'display: none; max-width: 900px; min-height: 400px; justify-conte
 
 //Create image div within popup
 const image = document.createElement('div');
-image.style = 'width: 50%; height: auto; overflow: hidden; padding-left: 3%;';
+image.style = 'padding-left: 3%;';
 popup.appendChild(image);
 image.classList.add('image');
 
-//Create img with source within image div
-// const img = document.createElement('img');
-// img.setAttribute('src', './img/Time Reminder Memes/none of my business.jpg')
-// img.style = 'width: 80%; height: auto; border-radius: 4px;';
-// image.appendChild(img);
-
 //Create text box div within popup
 const textBox = document.createElement('div');
-textBox.style = 'width: 47%; height: 26vh; display: flex; flex-direction: column; justify-content: space-between; margin-top: -45px;';
+textBox.style = 'height: 26vh; display: flex; flex-direction: column; justify-content: space-between; margin-top: -45px;';
 popup.appendChild(textBox);
 textBox.classList.add('text-box');
 
@@ -104,9 +112,6 @@ buttonTwo.addEventListener('mouseleave', function(){
 
 
 
-
-
-
 // buttonOne.addEventListener('click', function(){
 //     OPEN NEW TAB;
 // })
@@ -116,17 +121,3 @@ buttonTwo.addEventListener('mouseleave', function(){
 buttonTwo.addEventListener('click', function(){
     popup.style = 'display: none;';
 })
-
-
-var imageArray = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15',];
-
-window.addEventListener('load', function(){
-    const imageDiv = document.querySelector('.image');
-    const randomImg = document.createElement('img');
-    let num = Math.floor(Math.random() * imageArray.length);
-    let img = imageArray[num];
-    let imgStr = `img/Time Reminder Memes/${img}.jpg`;
-    randomImg.setAttribute('src', `${imgStr}`);
-    imageDiv.appendChild(randomImg);
-    img.style = 'width: 80%; height: auto; border-radius: 4px;';
-});