From 5ced2872d1b5e11a64b33cdd3b891e17c428d687 Mon Sep 17 00:00:00 2001 From: Karthikeyan Date: Mon, 22 Nov 2021 19:54:57 +0530 Subject: [PATCH] first commit with JS --- .vscode/settings.json | 3 + Clock_XD/AM_svg.svg | 1 + Clock_XD/clock_logo.png | Bin 0 -> 10527 bytes Clock_XD/goodnight_image.svg | 1 + Clock_XD/lunch_image.svg | 1 + Clock_XD/lunch_time.svg | 1 + Clock_XD/nap_time.svg | 1 + Clock_XD/timeline.svg | 1 + Clock_XD/wake_up.svg | 1 + Clock_XD/wakeup_image.svg | 1 + clock.js | 80 ++++++++++++++ index.css | 196 +++++++++++++++++++++++++++++++++++ index.html | 131 +++++++++++++++++++++++ 13 files changed, 418 insertions(+) create mode 100644 .vscode/settings.json create mode 100644 Clock_XD/AM_svg.svg create mode 100644 Clock_XD/clock_logo.png create mode 100644 Clock_XD/goodnight_image.svg create mode 100644 Clock_XD/lunch_image.svg create mode 100644 Clock_XD/lunch_time.svg create mode 100644 Clock_XD/nap_time.svg create mode 100644 Clock_XD/timeline.svg create mode 100644 Clock_XD/wake_up.svg create mode 100644 Clock_XD/wakeup_image.svg create mode 100644 clock.js create mode 100644 index.css create mode 100644 index.html diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..f1289cf --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5500 +} \ No newline at end of file diff --git a/Clock_XD/AM_svg.svg b/Clock_XD/AM_svg.svg new file mode 100644 index 0000000..6a2a699 --- /dev/null +++ b/Clock_XD/AM_svg.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/clock_logo.png b/Clock_XD/clock_logo.png new file mode 100644 index 0000000000000000000000000000000000000000..be95c6783b52f028be6d47e3ec92c1ca6430eb06 GIT binary patch literal 10527 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 literal 0 HcmV?d00001 diff --git a/Clock_XD/goodnight_image.svg b/Clock_XD/goodnight_image.svg new file mode 100644 index 0000000..0c9d415 --- /dev/null +++ b/Clock_XD/goodnight_image.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/lunch_image.svg b/Clock_XD/lunch_image.svg new file mode 100644 index 0000000..114e737 --- /dev/null +++ b/Clock_XD/lunch_image.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/lunch_time.svg b/Clock_XD/lunch_time.svg new file mode 100644 index 0000000..03ecbc9 --- /dev/null +++ b/Clock_XD/lunch_time.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/nap_time.svg b/Clock_XD/nap_time.svg new file mode 100644 index 0000000..4f1f1c3 --- /dev/null +++ b/Clock_XD/nap_time.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/timeline.svg b/Clock_XD/timeline.svg new file mode 100644 index 0000000..5207a46 --- /dev/null +++ b/Clock_XD/timeline.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/wake_up.svg b/Clock_XD/wake_up.svg new file mode 100644 index 0000000..3708568 --- /dev/null +++ b/Clock_XD/wake_up.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Clock_XD/wakeup_image.svg b/Clock_XD/wakeup_image.svg new file mode 100644 index 0000000..2cd8131 --- /dev/null +++ b/Clock_XD/wakeup_image.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/clock.js b/clock.js new file mode 100644 index 0000000..bf08882 --- /dev/null +++ b/clock.js @@ -0,0 +1,80 @@ +function clock(){ // function for clock time!! +var hours = document.getElementById('hour'); +var mins = document.getElementById('min'); +var secs = document.getElementById('sec'); +var am =document.getElementById('ampm'); +var wish =document.getElementById('gdwish'); + +var time = new Date(); // getting Time + +var a =time.getHours()%12||12; +var b =time.getMinutes(); +var c =time.getSeconds(); +var d =time.getHours(); +if(a<10)a = "0"+a; +if(b<10)b = "0"+b; +if(c<10)c = "0"+c; +if (time.getHours()<12) { + am="AM"}else{am="PM" +} +if(d>5&&d<12){ + wish ="GOOD MORNING!!" +}else if(d>=12&&d<14){ + wish ="GOOD AFTERNOON!!" +}else if(d>=14&&d<20){ + wish="GOOD EVENING!!" +} +else if(d>=20&&d<23){ + wish ="GOOD NIGHT!!" +}else{wish="NIGHT OWL!!"} + hours.innerHTML=a; + mins.innerHTML=b; + secs.innerHTML=c; + ampm.innerHTML=am; + gdwish.innerHTML=wish; +}setInterval(clock,1000); + +//setting time dynamicaly +function makediv(){ + const newDiv = document.createElement("div"); + newDiv.setAttribute("id","dyna-blk"); + const sel1 =document.getElementById("wake"); + const val1 =sel1.options[sel1.selectedIndex].text; + //x.options[index].text//index=x.selectedIndex; + + const sel2 = document.getElementById("lunch"); + const val2=sel2.options[sel2.selectedIndex].text; + + const sel3 = document.getElementById("nap"); + const val3=sel3.options[sel3.selectedIndex].text; + newDiv.innerText="Set Wake-up Time: "+val1+"\n"+"Set Lunch Time: "+val2+"\n"+"Set Nap Time: "+val3; + + const existDiv = document.getElementById("left-kd"); + existDiv.appendChild(newDiv); + + //using jquery to disable the button + $(".left-tb3").attr("disabled", true); +} +//setwake up time;; to img and hiii + +function setTime(){ + var hour1 = new Date().getHours(); + var i = document.getElementById("wake").value; + if(i==hour1){ + document.getElementById("right-tb-img").style.backgroundImage="url(./CLock_XD/wakeup_image.svg)"; + document.getElementById("right-tb-text").innerHTML="WAKE-UP!!" + } + + var j = document.getElementById("lunch").value; + if(j==hour1){ + document.getElementById("right-tb-img").style.backgroundImage="url(./CLock_XD/lunch_image.svg)"; + document.getElementById("right-tb-text").innerHTML="LET'S HAVE SOME LUNCH !!" + } + + var k = document.getElementById("nap").value; + if(k==hour1){ + document.getElementById("right-tb-img").style.backgroundImage="url(./CLock_XD/goodnight_image.svg)"; + document.getElementById("right-tb-text").innerHTML="GOOD NIGHT !!" + } + makediv(); //function for calling dynamic div +} \ No newline at end of file diff --git a/index.css b/index.css new file mode 100644 index 0000000..83267b3 --- /dev/null +++ b/index.css @@ -0,0 +1,196 @@ +body{ +background: #3D087B; +font-family: 'Baumans', cursive; +} +.top{ + display: flex; + flex-direction: row; + height: 130px; + width: 100%; +} +.logo{ + margin: 59px 0px 0px 124px; +} +.time{ + color: #3D087B; + background: white; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + font-style: bold; + font-size: 20px; + height: 130px; + width: 540px; + margin: 42px 120px 0px 400px; + border-radius: 10px; + padding: 0px 0px 0px 20px; + display: flex; + flex-direction: row; + } + /* clock time display */ +.tim{ + padding-top: 20px; + font-size: 20px; + display: flex; + flex-direction: row; + justify-content: space-around; +} +.tim>div{ + height: 90px; + width: 82px; + background: #F6E2FF; + border-radius: 5px; + padding-left: 20px; +} +.tim span{ + margin-top: 20px; + padding: 5px; +} +#hour,#min,#sec{ + font-size: 45px; +} +#ampm{ + height: 50px; + width: 42px; + margin-left: 5px; + padding: 20px; + font-size: 40px; + font-weight: 200; + color: white; + background: url(./Clock_XD/AM_svg.svg); +} +.shade{ + position: absolute; + border-radius: 10px; +} +.sh1{ + top: 63px; + right: 170px; + height: 130px; + width: 420px; + z-index: -1; + background: #EDEDED; +} +.sh2{ + top: 75px; + right: 210px; + height: 130px; + width: 350px; + z-index: -2; + background: #996fa7; +} +.group{ + width: 100%; + display: flex; + flex-direction: row; + justify-content: space-evenly; +} +.left-tb{ + margin:25px 0px 0px 70px; + height: 400px; + width: 45%; + margin-top: 90px; + display: flex; + flex-direction: column; + justify-content: space-evenly; +} +.left-tb1{ + margin-top:80px; + padding: 20px 0px; + border-radius: 10px; + background:#FFFFFF; + height: 290px; + width: 95%; + display: flex; + flex-direction: row; + justify-content: space-around; +} +.left-tb-img{ + height: 90%; + width: 30px; + display: flex; + flex-direction: column; + justify-content: space-between; + color: #FFFFFF; + border-left: 2px solid #c2c2c2; + margin: 10px 0px 0px 20px; +} +.left-tb-img>img{ + height: 50px; + position: relative; + left: -17px; + background: #FFFFFF; +} +.left-tb-sel{ + display: flex; + flex-direction: column; + justify-content: space-between; + font-size: 20px; + font-family: manrope,sans-serif; + color: #3D087B; +} +.spacebar1{margin-right: 15px;} +.spacebar2{margin-right: 40px;} +.spacebar3{margin-right: 55px;} +.left-tb2{ + height: 80px; + width: 551px; + margin: 10px 0px; + border-radius: 5px; + color: #FFFFFF; + background: #6E54EC; + font-size: 27px; + padding: 20px 0px 20px 20px; +} +.left-tb3{ + height: 50px; + width: 300px; + text-align: center; + background-image: linear-gradient(to left,#6E54EC,#CB52F8,#FC5EFF,#F1A7C5); + border-radius: 5px; + border: transparent; + color: #FFFFFF; + font-size: 25px; + font-weight: 200; + font-family: 'Manrope', sans-serif; +} +.left-tb3:hover{ + background-image: linear-gradient(to right,#6E54EC,#CB52F8,#FC5EFF,#F1A7C5); +} +#right-tb{ + color: #8E53F0; + font-size: 2rem; + padding: 1rem; + background: white; + margin: 80px 40px 0px -80px; + height: 440px; + width: 457px; + border-radius: 10px; +} +#right-tb-img{ + height: 474px; + width: 536px; + position: absolute; + right: 120px; + top: 216px; + background-image: url(./Clock_XD/lunch_image.svg); + background-repeat: no-repeat; +} +select{ + background: #DDF5FF; + border-radius: 4px; + border: transparent; + width: 280px; + height: 25px; + padding: 0px 30px; +} + +#dyna-blk{ + width: 300px; + background: #CB52F8; + color: white; + font-size: 20px; + margin: 10px 0px 10px 0px; + padding: 10px 0px; + border-radius: 10px; + text-align: center; + +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..c4de512 --- /dev/null +++ b/index.html @@ -0,0 +1,131 @@ + + + + + + + + + + + + Clock_XD + + +
+
+
+ Time

  hours

:


  mins

:


  secs
 +
+
+
+ +
+
+
+
+ + + +
+
+

Set wake up time + +

+

Set lunch time + +

+

Set nap time + +

+
+
+
HELLO, WELCOME!!
+ +
+
+
let's have some lunch !!
+
+
+
+ + + \ No newline at end of file