diff --git a/css/main.css b/css/main.css index 2867743..226ad0c 100644 --- a/css/main.css +++ b/css/main.css @@ -13,6 +13,8 @@ body { .main { width: 100%; text-align: center; } + .main #message { + padding-bottom: 25px; } .main #search-bar { width: 50%; margin: 0 auto; @@ -42,7 +44,6 @@ body { background: #2e2e2e; padding: 20px 15px; border-radius: 6px; - text-align: center; min-height: 150px; } .main #other-content .sqr:hover { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); diff --git a/index.html b/index.html index b625594..a74e327 100644 --- a/index.html +++ b/index.html @@ -12,6 +12,9 @@
+
+

Hey Deepjyoti, Good Morning!

+
diff --git a/js/main.js b/js/main.js index baada39..d3ca55d 100644 --- a/js/main.js +++ b/js/main.js @@ -3,6 +3,8 @@ window.onload = function() { } searchBarId = "search-bar-input" +messageId = "message h2" +userName = "Deepjyoti" function initBody() { /** @@ -21,4 +23,47 @@ function initBody() { query = document.getElementById(searchBarId).value.replace(/\ /g, "+") document.location = googleSearchUrl + query }) + + // Build a message for the user + builtMsg = buildMsg() + builtMsg == "" ? + builtMsg = `Hello ${userName}` : builtMsg = `Hey ${userName}, ${builtMsg}!` + $("#" + messageId).text(builtMsg) +} + +function buildMsg() { + /** + * Build a nice message for the user. + * + * Following is how the message would be decided. + * 0 - 5:59 : It's too late, take some sleep + * 6 - 8:59 : You're up early + * 9 - 11:59 : Have a good day ahead + * 12 - 16:59 : Good Afternoon + * 17 - 19:59 : Good Evening + * 20 - 23:59 : Get away from the computer + */ + date = new Date() + currentHour = date.getHours() + currentMinute = date.getMinutes() + currentTime = currentHour + (0.01 * currentMinute) + + if (inRange(currentTime, 0, 5.59)) + return "It's too late, take some sleep" + if (inRange(currentTime, 6, 8.59)) + return "You're up early" + if (inRange(currentTime, 9, 11.59)) + return "Have a good day ahead" + if (inRange(currentTime, 12, 16.59)) + return "Good Afternoon" + if (inRange(currentTime, 17, 19.59)) + return "Good Evening" + if (inRange(currentTime, 20, 24)) + return "Get away from the computer" + else + return "" +} + +function inRange(number, min, max) { + return (number >= min && number <= max) } \ No newline at end of file diff --git a/scss/main.scss b/scss/main.scss index 883542c..ba247df 100644 --- a/scss/main.scss +++ b/scss/main.scss @@ -24,6 +24,10 @@ body { width: 100%; text-align: center; + #message { + padding-bottom: 25px; + } + #search-bar { width: 50%; margin: 0 auto; @@ -61,7 +65,6 @@ body { background: lighten($background, 5); padding: 20px 15px; border-radius: 6px; - text-align: center; min-height: 150px; &:hover {