diff --git a/01resume/index.html b/01resume/index.html index e69de29b..2bffdcd3 100644 --- a/01resume/index.html +++ b/01resume/index.html @@ -0,0 +1,115 @@ + + + + + + + + Resume + + + +

Laxmi Gurumoorthy

+

Project Manager


+ Austin, TX, US
+ One Dell Way

+ EMAIL:test@gmail.com
+ PHONE- (xxx) xxx-xxx
+ WEBSITE- http://test.com


+ PROFILES
+

About

+

+ + Laxmi hails from Austin, TX. She has earned a degree in CS from the University of Minnesota. +

+ +

Work Experience

+ Project Manager, Dell
+ December 2013 - December 2014

+

+ Pied Piper is a multi-platform technology based on a propriatary universal compression algorithm that has consistently fielded high Weisman Scores that are not merely competetive, but approach the theoritical limit of lossless compression +

Highlights
+ +

+ +

Volunteer Work

+ + Teacher. CoderDojo
+ January 2012 - January 2013

+ + Global movement of free coding clubs for young people + http://coderdojo.com/ +
HIGHLIGHTS
+ + +

SKILLS

+ + Web Development
+ HTML + CSS + Javascript + +


+ Compression
+ MPEG + ZIP + CLIF + +

EDUCATION

+ M.S in Computer Science - University of Minnesota
+ June 2011 - January 2014
+ GPA: 4.0

+ +
COURSES
+ + +

AWARDS

+ + Digital compression Pioneer Award - Techcrunch
+ 01 November 2014

+ There is no spoon + +

PUBLICATIONS

+ + Video compression for 3d media
+ 01 October 2014

+ + Innovative middle-out compression algorithm that changes that way we store data.
+ http://en.wilipedia.oeg/wiki/Silicon_Valley_(TV_series) + +

INTERESTS

+ Wildlife
+ Forests + Unicorn +

LANGUAGES

+ + English
+ Fluency: Native speaker + +

REFERENCES

+ It is my pleasure to recomment Rochard, his performance working as a consultant for Main St. Company proved that he will be a valuable addition to any company.
+ - Erlich Bachman + + + + \ No newline at end of file diff --git a/02boxmodel/index.html b/02boxmodel/index.html index e69de29b..e0e0987c 100644 --- a/02boxmodel/index.html +++ b/02boxmodel/index.html @@ -0,0 +1,23 @@ + + + + + + + Document + + + +
+
+
+
+
+ +
+
+
+
+
+ + diff --git a/02boxmodel/style.css b/02boxmodel/style.css index e69de29b..87e61322 100644 --- a/02boxmodel/style.css +++ b/02boxmodel/style.css @@ -0,0 +1,81 @@ +body { + background-color: black; +} + +* { + box-sizing: border-box; + border-radius: 50%; +} + +.planet { + margin: 50px auto; +} + +.core { + background-color: yellow; + border-color: orange; + border-style: solid; +} + +.mantle { + background-color: orangered; + border-color: red; + border-style: solid; +} + +.crust { + background-color: brown; + /* border-color depends on planet! */ + border-style: solid; +} + +/* + planet height and width => height and width + inner-layers => padding; + outer-layers => border-width; + make it round => border-radius; +*/ + +.planet.earth { + height: 500px; + width: 500px; +} + +.earth .crust { + padding: 10px; + border-width: 10px; + border-color: blue; +} + +.earth .mantle { + padding: 140px; + + border-width: 40px; +} + +.earth .core { + padding: 30px; + border-width: 30px; +} + +.planet.mars { + height: 200px; + width: 200px; +} + +.mars .crust { + border-color: #f3b19d; + padding: 20px; + border-width: 10px; +} + +.mars .mantle { + padding: 40px; + border-width: 20px; + border-color: brown margin; +} + +.mars .core { + padding: 6px; + border-width: 5px; +} diff --git a/03floats/index.html b/03floats/index.html index e69de29b..2deffddf 100644 --- a/03floats/index.html +++ b/03floats/index.html @@ -0,0 +1,84 @@ + + + + + + + Document + + + + + + +
+ + +
+
+
+ +
+
+ + +
+
+ + +
+
+ + + + +
+
+ +
+
+
+
+ + diff --git a/03floats/style.css b/03floats/style.css index e69de29b..1107cc46 100644 --- a/03floats/style.css +++ b/03floats/style.css @@ -0,0 +1,81 @@ +header { + /* /* top: 0; */ + width: 100%; + height: auto; + background-color: #183a55; +} +* { + box-sizing: border-box; +} + +header .logo { + float: left; +} +header ul { + float: right; + margin-top: 30px; +} + +header ul li { + float: left; + list-style: none; + margin-left: 10px; + margin-right: 10px; + padding: 5px; +} + +header a { + color: white; +} + +a { + text-decoration: none; +} + +header a:hover { + color: #03b5aa; +} +.clearfix:after { + content: ""; + clear: both; + display: block; +} + +main { + background-image: url("./img/airline.jpg"); + background-size: cover; + height: 86vh; + margin: 0; +} + +section { + position: absolute; + margin-left: 20px; + margin-top: 100px; +} + +section nav a { + width: 33.3%; + float: left; + background-color: teal; + text-align: center; + padding: 10px 0; + color: white; + border-right: 1px solid white; +} + +/* section nav li { + border-right: 1px solid white; +} */ + +section nav li:last-child a { + border-right: none; +} +section nav a:hover { + background-color: blue; +} +section form { + padding: 10px; + background-color: #183a55; + color: white; +} diff --git a/04flexbox/index.html b/04flexbox/index.html index e69de29b..7a9723fb 100644 --- a/04flexbox/index.html +++ b/04flexbox/index.html @@ -0,0 +1,47 @@ + + + + + + + Document + + + + +
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder text + used to demonstrate the visual form of a document without relying on + meaningful content (also called greeking). Replacing the actual + content with placeholder text allows designers to design the form of + the content before the content itself has been produced. The lorem + ipsum text is typically a scrambled section of De finibus bonorum et + malorum, a 2nd-century BC Latin text by Cicero, with words altered, + added, and removed to make it nonsensical, improper Latin. A + variation of the ordinary lorem ipsum text has been used in + typesetting since the 1960s or earlier, when it was popularized by + advertisements for Letraset transfer sheets. It was introduced to + the Information Age in the mid-1980s by Aldus Corporation, which + employed it in graphics and word-processing templates for its + desktop publishing program PageMaker. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+ + diff --git a/04flexbox/style.css b/04flexbox/style.css index e69de29b..6985da8d 100644 --- a/04flexbox/style.css +++ b/04flexbox/style.css @@ -0,0 +1,59 @@ +* { + box-sizing: border-box; +} + +body { + padding: 20px; +} + +.container { + min-height: 250px; + min-width: 345px; + display: flex; + flex-direction: row; + flex-wrap: wrap; + box-shadow: 1px 1px 1px black; + padding: 15px 10px 0; +} + +.img { + display: flex; + flex-basis: 0; + flex-grow: 1; + height: 230px; + justify-content: center; + padding-bottom: 5px; +} + +img { + max-width: 285px; +} + +.text { + min-width: 230px; + flex-basis: 0; + flex-grow: 3; + padding: 0 20px 10px; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.actions { + display: flex; + /* align-self: row; */ + justify-content: space-between; + padding-top: 10px; +} + +a:hover { + color: blue; +} +/* +.readmore { + align-self: flex-end; +} + +.heart { + align-self: flex-start; +} */ diff --git a/05grid/index.html b/05grid/index.html index 8b137891..fb19ba42 100644 --- a/05grid/index.html +++ b/05grid/index.html @@ -1 +1,290 @@ + + + + + + + Document + + + + +
+
+

Travel-Gram

+

Desktop

+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has been + produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+ +
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+ + diff --git a/05grid/style.css b/05grid/style.css index d3f5a12f..3c075baf 100644 --- a/05grid/style.css +++ b/05grid/style.css @@ -1 +1,118 @@ +* { + box-sizing: border-box; +} +body { + padding: 20px; +} + +.container { + /* min-height: 250px; + min-width: 345px; */ + display: flex; + flex-direction: row; + flex: 1; + flex-wrap: wrap; + box-shadow: 1px 1px 1px 1px black; + padding: 15px 10px 0; +} + +/* .card3 { + display: flex; + } */ + +.img { + display: flex; + flex: 1; + height: 130px; + justify-content: center; + padding-bottom: 5px; +} + +img { + max-width: 150px; +} + +.text { + min-width: 230px; + flex: 1; + padding: 0 20px 10px; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.actions { + display: flex; + /* align-self: row; */ + flex: 1; + justify-content: space-between; + padding-top: 10px; +} + +a:hover { + color: blue; +} + +.card1 { + grid-area: card1; +} +.card2 { + grid-area: card2; +} +.card3 { + grid-area: card3; +} +.card4 { + grid-area: card4; +} +.card5 { + grid-area: card5; +} +.card6 { + grid-area: card6; +} +.card7 { + grid-area: card7; +} +.card8 { + grid-area: card8; +} +.card9 { + grid-area: card9; +} +.card10 { + grid-area: card10; +} + +header { + grid-area: header; + text-align: center; + /* display: flex; + justify-content: center; */ + /* flex: 1; */ +} + +/* .h2{ + grid-area: h2; + /* display: flex; + justify-content: center; */ +/* } */ + +/* .section{ + min-height: calc(100vh - 54px); + grid-area: section; + } */ +main { + display: grid; + grid-template-columns: 1fr 1fr 1fr 1fr; + min-height: 100vh; + grid-column-gap: 10px; + grid-row-gap: 10px; + grid-template-areas: + "header header header header" + "card1 card1 card2 card2" + "card3 card3 card4 card5" + "card3 card3 card6 card6" + "card7 card8 card9 card10"; +} diff --git a/06responsive/index.html b/06responsive/index.html index 8b137891..fb19ba42 100644 --- a/06responsive/index.html +++ b/06responsive/index.html @@ -1 +1,290 @@ + + + + + + + Document + + + + +
+
+

Travel-Gram

+

Desktop

+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has been + produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+ +
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+
+
+
+
+

+ In publishing and graphic design, lorem ipsum is a placeholder + text used to demonstrate the visual form of a document without + relying on meaningful content (also called greeking). Replacing + the actual content with placeholder text allows designers to + design the form of the content before the content itself has + been produced. +

+
+
+
+ 12 +
+
+ Read More +
+
+
+
+
+
+ + diff --git a/06responsive/style.css b/06responsive/style.css index d3f5a12f..fb018525 100644 --- a/06responsive/style.css +++ b/06responsive/style.css @@ -1 +1,163 @@ +* { + box-sizing: border-box; + } + + body { + padding: 20px; + } + + .container { + /* min-height: 250px; + min-width: 345px; */ + display: flex; + flex-direction: row; + flex: 1; + flex-wrap: wrap; + box-shadow:1px 1px 1px 1px black; + padding: 15px 10px 0; + } + + /* .card3 { + display: flex; + } */ + + .img { + display:flex; + flex: 1; + height: 130px; + justify-content: center; + padding-bottom: 5px; + } + + img{ + max-width: 150px; + } + + .text { + min-width: 230px; + flex: 1; + padding: 0 20px 10px; + display: flex; + flex-direction: column; + justify-content: space-between; + } + + .actions { + display: flex; + /* align-self: row; */ + flex: 1; + justify-content: space-between; + padding-top: 10px; + } + + a:hover{ + color: blue; + } + + .card1 { + grid-area: card1; + } + .card2 { + grid-area: card2; + } + .card3 { + grid-area: card3; + } + .card4 { + grid-area: card4; + } + .card5 { + grid-area: card5; + } + .card6 { + grid-area: card6; + } + .card7 { + grid-area: card7; + } + .card8 { + grid-area: card8; + } + .card9 { + grid-area: card9; + } + .card10 { + grid-area: card10; + } + + header{ + grid-area: header; + text-align: center; + /* display: flex; + justify-content: center; */ + /* flex: 1; */ + } + + /* .h2{ + grid-area: h2; + /* display: flex; + justify-content: center; */ + /* } */ + + /* .section{ + min-height: calc(100vh - 54px); + grid-area: section; + } */ + + @media (min-width: 576px){ + main{ + display:grid; + grid-template-columns: 1fr; + min-height: 100vh; + grid-column-gap: 10px; + grid-row-gap: 10px; + grid-template-areas: + "header " + "card1 " + "card2 " + "card3 " + "card4 " + "card5 " + "card6 " + "card7 " + "card8 " + "card9 " + "card10 "; + } +} + @media (min-width: 576px){ + main{ + display:grid; + grid-template-columns: 1fr 1fr; + min-height: 100vh; + grid-column-gap: 10px; + grid-row-gap: 10px; + grid-template-areas: + "header header " + "card1 card1 " + "card2 card3" + "card4 card4" + "card5 card5" + "card6 card7" + "card8 card8" + "card9 card10"; + } + } + + @media (min-width: 768px){ + main{ + display:grid; + grid-template-columns: 1fr 1fr 1fr 1fr; + min-height: 100vh; + grid-column-gap: 10px; + grid-row-gap: 10px; + grid-template-areas: + "header header header header" + "card1 card1 card2 card2" + "card3 card3 card4 card5" + "card3 card3 card6 card6" + "card7 card8 card9 card10"; + } + } + diff --git a/07javascripting/accessing-array-values.js b/07javascripting/accessing-array-values.js new file mode 100644 index 00000000..b1875d6c --- /dev/null +++ b/07javascripting/accessing-array-values.js @@ -0,0 +1,2 @@ +var food = ['apple', 'pizza', 'pear']; +console.log(food[1]); \ No newline at end of file diff --git a/07javascripting/array-filtering.js b/07javascripting/array-filtering.js new file mode 100644 index 00000000..d77301e7 --- /dev/null +++ b/07javascripting/array-filtering.js @@ -0,0 +1,7 @@ +var numbers = [1,2,3,4,5,6,7,8,9,10]; +var filtered = numbers.filter(function (numbers) +{ + return numbers % 2 === 0; +} +); +console.log(filtered); \ No newline at end of file diff --git a/07javascripting/arrays.js b/07javascripting/arrays.js new file mode 100644 index 00000000..a17f06ef --- /dev/null +++ b/07javascripting/arrays.js @@ -0,0 +1,2 @@ +var pizzatoppings = ['tomato sauce', 'cheese', 'pepperoni']; +console.log(pizzatoppings); \ No newline at end of file diff --git a/07javascripting/correct - for - loop.js b/07javascripting/correct - for - loop.js new file mode 100644 index 00000000..09028ad3 --- /dev/null +++ b/07javascripting/correct - for - loop.js @@ -0,0 +1,8 @@ +var total = 0; +var limit = 10; + +for (var i = 0; i < limit; i++) { + total += i; +} + +console.log(total); \ No newline at end of file diff --git a/07javascripting/for-loop.js b/07javascripting/for-loop.js new file mode 100644 index 00000000..3df2fe6a --- /dev/null +++ b/07javascripting/for-loop.js @@ -0,0 +1,8 @@ +var total = 0; +var limit = 10; +for (var i = 0; i < limit; i++) { + // log the numbers 0 through 9 + total += i; + } + + console.log (total); diff --git a/07javascripting/function-arguments.js b/07javascripting/function-arguments.js new file mode 100644 index 00000000..da860e90 --- /dev/null +++ b/07javascripting/function-arguments.js @@ -0,0 +1,6 @@ +function math(num1, num2, num3){ +return (num2 * num3 ) + num1; + +} + +console.log(math(53, 61, 67)); \ No newline at end of file diff --git a/07javascripting/functions.js b/07javascripting/functions.js new file mode 100644 index 00000000..d16989f7 --- /dev/null +++ b/07javascripting/functions.js @@ -0,0 +1,5 @@ +function eat(fruit){ +return fruit + ' tasted really good.'; + +} +console.log(eat('bananas')); diff --git a/07javascripting/if-statement.js b/07javascripting/if-statement.js new file mode 100644 index 00000000..232f908f --- /dev/null +++ b/07javascripting/if-statement.js @@ -0,0 +1,9 @@ +var fruit = "orange"; +if(fruit.length > 5) { + + console.log ("The fruit name has more than five characters."); +} +else{ + + console.log ("The fruit name has five characters or less"); +} \ No newline at end of file diff --git a/07javascripting/introduction.js b/07javascripting/introduction.js index 8b137891..b72d6cbf 100644 --- a/07javascripting/introduction.js +++ b/07javascripting/introduction.js @@ -1 +1,2 @@ + console.log('hello'); \ No newline at end of file diff --git a/07javascripting/looping-through-arrays.js b/07javascripting/looping-through-arrays.js new file mode 100644 index 00000000..01378386 --- /dev/null +++ b/07javascripting/looping-through-arrays.js @@ -0,0 +1,7 @@ +var pets = ['cat', 'dog', 'rat']; + for (var i = 0; i < 3; i++) { + // log the numbers 0 through 9 + pets[i] = pets[i] + 's'; + } + + console.log (pets); \ No newline at end of file diff --git a/07javascripting/number-to-string.js b/07javascripting/number-to-string.js new file mode 100644 index 00000000..134a7c91 --- /dev/null +++ b/07javascripting/number-to-string.js @@ -0,0 +1,3 @@ +var n = 128; +n = n.toString(); +console.log(n); \ No newline at end of file diff --git a/07javascripting/numbers.js b/07javascripting/numbers.js new file mode 100644 index 00000000..27edcdc7 --- /dev/null +++ b/07javascripting/numbers.js @@ -0,0 +1,3 @@ +var example = 123456789; +console.log(example); + diff --git a/07javascripting/object-properties.js b/07javascripting/object-properties.js new file mode 100644 index 00000000..0b763ebd --- /dev/null +++ b/07javascripting/object-properties.js @@ -0,0 +1,4 @@ +var food = { + types: 'only pizza' + }; +console.log(food.types); \ No newline at end of file diff --git a/07javascripting/objects.js b/07javascripting/objects.js new file mode 100644 index 00000000..93542f91 --- /dev/null +++ b/07javascripting/objects.js @@ -0,0 +1,7 @@ +var pizza = { + toppings: ['cheese', 'sauce', 'pepperoni'], + crust: 'deep dish', + serves: 2 + }; + + console.log(pizza); \ No newline at end of file diff --git a/07javascripting/revising-strings.js b/07javascripting/revising-strings.js new file mode 100644 index 00000000..c3edf5ac --- /dev/null +++ b/07javascripting/revising-strings.js @@ -0,0 +1,3 @@ +var pizza = 'pizza is alright'; +pizza = pizza.replace('alright', 'wonderful'); +console.log(pizza); \ No newline at end of file diff --git a/07javascripting/rounding-numbers.js b/07javascripting/rounding-numbers.js new file mode 100644 index 00000000..f1273a98 --- /dev/null +++ b/07javascripting/rounding-numbers.js @@ -0,0 +1,3 @@ +var roundup = 1.5; +var rounded = Math.round(roundup); +console.log(rounded); diff --git a/07javascripting/scope.js b/07javascripting/scope.js new file mode 100644 index 00000000..7fa6b8eb --- /dev/null +++ b/07javascripting/scope.js @@ -0,0 +1,20 @@ +var a = 1, b = 2, c = 3; + +(function firstFunction(){ + var b = 5, c = 6; + + (function secondFunction(){ + var b = 8; + console.log("a: "+a+", b: "+b+", c: "+c); + + (function thirdFunction(){ + var a = 7, c = 9; + + (function fourthFunction(){ + var a = 1, c = 8; + + })(); + })(); + })(); +})(); + diff --git a/07javascripting/string-length.js b/07javascripting/string-length.js new file mode 100644 index 00000000..88992c9c --- /dev/null +++ b/07javascripting/string-length.js @@ -0,0 +1,2 @@ +var example = 'example string'; +console.log(example.length); diff --git a/07javascripting/strings.js b/07javascripting/strings.js new file mode 100644 index 00000000..507177c5 --- /dev/null +++ b/07javascripting/strings.js @@ -0,0 +1,2 @@ +var example = 'this is a string'; +console.log(example); diff --git a/07javascripting/variables.js b/07javascripting/variables.js new file mode 100644 index 00000000..06bc2b0a --- /dev/null +++ b/07javascripting/variables.js @@ -0,0 +1,2 @@ +var example = 'some string'; +console.log(example); \ No newline at end of file diff --git a/08calculator/index.html b/08calculator/index.html index e69de29b..2ed87e5f 100644 --- a/08calculator/index.html +++ b/08calculator/index.html @@ -0,0 +1,61 @@ + + + + + + + + + + + Document + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
123+
456-
789*
+/-0=/
DeleteClear
+
+ + + + + + + + \ No newline at end of file diff --git a/08calculator/script.js b/08calculator/script.js index c1dcbe6c..3ca50df7 100644 --- a/08calculator/script.js +++ b/08calculator/script.js @@ -1,5 +1,64 @@ + 'use strict'; +document.addEventListener("DOMContentLoaded", function (event) { + document.querySelectorAll('.button').forEach((button) => { + button.addEventListener('click', (event) => { + let text = event.target.innerHTML; + if (text === '=') { + equals(); + } else if (text === '+/-') { + PlusMinus(); + } + + else if (text === 'Delete') { + deleteLast(); + } else if (text === 'Clear') { + clearResults(); + } + + else { + addNumber(text); + } + + }) + + }) + + + + function addNumber(num) { + document.querySelector("#results").value += num; + } + + function clearResults() { + document.querySelector("#results").value = ""; + } + + // function addition() { + // document.querySelector("#results").value += "+"; + // } + + function equals() { + document.querySelector("#results").value = eval(document.querySelector("#results").value); + } + + function deleteLast() { + let current = document.querySelector("#results").value; + document.querySelector("#results").value = current.slice(0, -1); + } + + // function substraction() { + // document.querySelector("#results").value += "-"; + // } + + // function Multiplication() { + // document.querySelector("#results").value += "*"; + // } -document.addEventListener("DOMContentLoaded", function(event) { - // You code here + // function division() { + // document.querySelector("#results").value += "/"; + // } + function PlusMinus() { + document.querySelector("#results").value = -document.querySelector("#results").value; + } }); diff --git a/08calculator/style.css b/08calculator/style.css index e69de29b..4cc2c002 100644 --- a/08calculator/style.css +++ b/08calculator/style.css @@ -0,0 +1,10 @@ +input { + width: 119.5px; + margin-left: 2px + } + .button { + border: 1px solid black; + width: 26px; + text-align: center; + cursor: pointer; + } \ No newline at end of file diff --git a/09tic-tac-toe-dom/index.html b/09tic-tac-toe-dom/index.html index ba7f2ee9..73a8e1f4 100644 --- a/09tic-tac-toe-dom/index.html +++ b/09tic-tac-toe-dom/index.html @@ -1,26 +1,62 @@ - - - - - Document - - - -
-
-
-
-
-
-
-
-
-
-
-
- - - - \ No newline at end of file + + + + + Document + + + + + + + + + + + + + + + + + + + + + +
+ N/A + + N/A + + N/A +
+ N/A + + N/A + + N/A +
+ N/A + + N/A + + N/A +
+
+ + + + diff --git a/09tic-tac-toe-dom/script.js b/09tic-tac-toe-dom/script.js index e69de29b..76bcfa23 100644 --- a/09tic-tac-toe-dom/script.js +++ b/09tic-tac-toe-dom/script.js @@ -0,0 +1,128 @@ +"use strict"; + +/*document.addEventListener("DOMContentLoaded", function(event) { + let player = "X"; + + document.querySelectorAll("[data-cell]").forEach(cell => { + cell.addEventListener("click", event => { + if (player === "X" && event.target.innerHTML === "") { + event.target.innerHTML = "X"; + player = "Y"; + event.target.innerHTML.alert("Winner X") + + } else if (player === "Y" && event.target.innerHTML === "") { + event.target.innerHTML = "O"; + player = "X"; + event.target.innerHTML.alert("Winner X") + } + }); + }); + + document.querySelector("#clear").addEventListener("click", function() { + document.querySelectorAll("[data-cell]").forEach(cell => { + cell.innerHTML = ""; + event.target.innerHTML.alert("Winner clear") + }); + + }); +});*/ + + + + + + +// document.addEventListener("DOMContentLoaded", function (event) { +// document.querySelectorAll('.button').forEach((button) => { +// button.addEventListener('click', (event) => { +// let text = event.target.innerHTML; +// if (text === '=') { +// equals(); +// } else if (text === '+/-') { +// PlusMinus(); +// } + +// else if (text === 'Delete') { +// deleteLast(); +// } else if (text === 'Clear') { +// clearResults(); +// } + +// else { +// addNumber(text); +// } + +// }) + +// }) + + +document.addEventListener('DOMContentLoaded', function () { + var board = [-1,-1,-1,-1,-1,-1,-1,-1,-1]; + var wins = [ + [0, 1, 2], + [3, 4, 5], + [6, 7, 8], + [0, 3, 6], + [1, 4, 7], + [2, 5, 8], + [0, 4, 8], + [2, 4, 6] ]; + var turn = 0; + Array.from(document.querySelectorAll('td a'), function (link, i) { + link.addEventListener('click', gotClicked.bind(null, link, i)); + }); + + function gotClicked(link, i, e) { + e.preventDefault(); + if (doMove(i, 'You won!')) return; + randomAi(); + } + + + function doMove(i, msg) { + var td = document.querySelectorAll('td')[i]; + var player = turn % 2; + td.textContent = 'XO'[player]; + board[i] = player; + turn++; + if (isWinFor(player)) { + alert(msg); + return true; + } + if (turn == 9) { + alert("It's a draw"); + return true; + } + } + + function randomAi() { + var randomPick = Math.floor(Math.random()*(9-turn)); + for (var i in board) { + if (board[i] !== -1) continue; // used cell -- skip it + if (randomPick == 0) break; // found it + randomPick--; + } + doMove(i, 'You lost'); + } + + function isWinFor(player) { + for (var win of wins) { + var count = 0; + for (var index of win) { + if (board[index] !== player) break; + count++; + } + if (count == 3) { + Array.from(document.querySelectorAll('td a'), function (link, i) { + link.parentNode.innerHTML = ''; + }); + return true; + } + } + } + + +} + +); \ No newline at end of file diff --git a/09tic-tac-toe-dom/style.css b/09tic-tac-toe-dom/style.css index 533cd272..184f97bd 100644 --- a/09tic-tac-toe-dom/style.css +++ b/09tic-tac-toe-dom/style.css @@ -1,7 +1,7 @@ #board { width: 300px; height: 300px; - display: grid; + display: flex; grid-template: repeat(3, 1fr) / repeat(3, 1fr); } @@ -15,3 +15,46 @@ #announce-winner { font-size: 50px; } + +table,tr,td{ + border-style:solid; + border-width:1px; + text-align: center +} +/* ***Fix the size of the board */ +td { width: 30px; height: 30px } + +/* #board { + display: flex; +} +.column { + width: 50px; + height: 300px; + background-color: #f2f2f2; + border-right: 1px solid #808080; + display: flex; + flex-direction: column; + justify-content: flex-end; +} + +.disc { + height: 50px; + width: 50px; + border-radius: 25px; +} + +.red { + background-color: red; +} + +.blue { + background-color: blue; +} + +.black { + background-color: black; +} + +.row { + clear: both; +} */ diff --git a/10tic-tac-toe-node/index_1.js b/10tic-tac-toe-node/index_1.js new file mode 100644 index 00000000..40c08c88 --- /dev/null +++ b/10tic-tac-toe-node/index_1.js @@ -0,0 +1,297 @@ +// 'use strict'; + +// const assert = require('assert'); +// const readline = require('readline'); +// const rl = readline.createInterface({ +// input: process.stdin, +// output: process.stdout +// }); +// let board = [ +// [' ', ' ', ' '], +// [' ', ' ', ' '], +// [' ', ' ', ' '] +// ]; + +// let playerTurn = 'X'; + +// function printBoard() { +// console.log(' 0 1 2'); +// console.log('0 ' + board[0].join(' | ')); +// console.log(' ---------'); +// console.log('1 ' + board[1].join(' | ')); +// console.log(' ---------'); +// console.log('2 ' + board[2].join(' | ')); +// } + +// function horizontalWin() { +// if (((board[0][0]===board[0][1]) && (board[0][1] === board[0][2]))|| +// ((board[1][0]===board[1][1]) && (board[1][1] === board[2][2])) || +// ((board[2][0]===board[2][1]) && (board[2][1] === board[2][2])) && +// ((board[0][0]!=='') && (board[0][1] !==''))|| +// ((board[1][0]!=='') && (board[1][1] !=='')) || +// ((board[2][0]!=='') && (board[2][1] !==''))) + +// {console.log(board[0][0]); +// console.log ('True'); +// return true; + +// } +// else { +// console.log ('False'); +// return false; +// } + +// } + + + + +// // function isLegal() { +// // let currentendstack = stacks[yesendstack] +// // let length = currentendstack.length + +// // if(currentendstack[length - 1] < piece) +// // { +// // return false; + +// // } +// // } + + + + +// function isLegal(row, column) { +// if ((row >= 0 ) && (column <= 2 ) && (row <=2) && (column >=0) && (board[row,column] === ' ' ) ) +// { +// return true; + +// } +// else return false; +// } + + + +// function verticalWin() { +// // Your code here +// } + +// function diagonalWin() { + + +// // Your code here +// } + +// function checkForWin() { +// return(horizontalWin); +// } + +// function ticTacToe(row, column) { +// if (isLegal(row,column) ) +// { +// board[row][column]=playerTurn; +// if (playerTurn === 'X') { +// playerTurn = 'O'; +// } else if(playerTurn === 'O'){ +// playerTurn = 'X'; +// } +// } +// else console.log ("Illegal move"); + +// } + +// // Your code here + + +// function getPrompt() { +// printBoard(); +// console.log("It's Player " + playerTurn + "'s turn."); +// rl.question('row: ', (row) => { +// rl.question('column: ', (column) => { +// ticTacToe(row, column); +// getPrompt(); +// }); +// }); + +// } + + + +// // Tests + +// if (typeof describe === 'function') { + +// describe('#ticTacToe()', () => { +// it('should place mark on the board', () => { +// ticTacToe(1, 1); +// assert.deepEqual(board, [ [' ', ' ', ' '], [' ', 'X', ' '], [' ', ' ', ' '] ]); +// }); +// it('should alternate between players', () => { +// ticTacToe(0, 0); +// assert.deepEqual(board, [ ['O', ' ', ' '], [' ', 'X', ' '], [' ', ' ', ' '] ]); +// }); +// it('should check for vertical wins', () => { +// board = [ [' ', 'X', ' '], [' ', 'X', ' '], [' ', 'X', ' '] ]; +// assert.equal(verticalWin(), true); +// }); +// it('should check for horizontal wins', () => { +// board = [ ['X', 'X', 'X'], [' ', ' ', ' '], [' ', ' ', ' '] ]; +// assert.equal(horizontalWin(), true); +// }); +// it('should check for diagonal wins', () => { +// board = [ ['X', ' ', ' '], [' ', 'X', ' '], [' ', ' ', 'X'] ]; +// assert.equal(diagonalWin(), true); +// }); +// it('should detect a win', () => { +// assert.equal(checkForWin(), true); +// }); +// }); +// } else { + +// getPrompt(); + +// } + + +"use strict"; + +const assert = require("assert"); +const readline = require("readline"); +const rl = readline.createInterface({ + input: process.stdin, + output: process.stdout +}); +let board = [[" ", " ", " "], [" ", " ", " "], [" ", " ", " "]]; + +let playerTurn = "X"; + +function printBoard() { + console.log(" 0 1 2"); + console.log("0 " + board[0].join(" | ")); + console.log(" ---------"); + console.log("1 " + board[1].join(" | ")); + console.log(" ---------"); + console.log("2 " + board[2].join(" | ")); +} + +function horizontalWin() { + if ( + (board[0][0] === board[0][1] && + board[0][1] === board[0][2] && + board[0][0] === playerTurn) || + (board[1][0] === board[1][1] && + board[1][1] === board[1][2] && + board[1][0] === playerTurn) || + (board[2][0] === board[2][1] && + board[2][1] === board[2][2] && + board[2][0] === playerTurn) + ) { + return true; + } else { + return false; + } +} + +function verticalWin() { + if ( + (board[0][0] === board[1][0] && + board[0][0] === board[2][0] && + board[0][0] === playerTurn) || + (board[0][1] === board[1][1] && + board[1][1] === board[2][1] && + board[0][1] === playerTurn) || + (board[0][2] === board[1][2] && + board[1][2] === board[2][2] && + board[0][2] === playerTurn) + ) { + return true; + } else { + return false; + } +} + +function diagonalWin() { + if ( + (board[0][0] === board[1][1] && + board[0][0] === board[2][2] && + board[0][0] === playerTurn) || + (board[2][0] === board[1][1] && + board[1][1] === board[0][2] && + board[2][0] === playerTurn) + ) { + return true; + } else { + return false; + } +} + +function checkForWin() { + if (horizontalWin() || verticalWin() || diagonalWin()) { + console.log(`Player '${playerTurn}' wins`); + console.log("Return-true"); + return true; + } else { + console.log("Return-False"); + } +} + +function ticTacToe(row, column) { + board[row][column] = playerTurn; + checkForWin(); + playerTurn = playerTurn === "X" ? "O" : "X"; + // if (playerTurn === 'X'){ + // playerTurn = 'O'; + // } else if (playerTurn === 'O'){ + // playerTurn = 'X'; + // } +} + +function getPrompt() { + printBoard(); + console.log("It's Player " + playerTurn + "'s turn."); + rl.question("row: ", row => { + rl.question("column: ", column => { + ticTacToe(row, column); + getPrompt(); + }); + }); +} + +// Tests + +if (typeof describe === "function") { + describe("#ticTacToe()", () => { + it("should place mark on the board", () => { + ticTacToe(1, 1); + assert.deepEqual(board, [ + [" ", " ", " "], + [" ", "X", " "], + [" ", " ", " "] + ]); + }); + it("should alternate between players", () => { + ticTacToe(0, 0); + assert.deepEqual(board, [ + ["O", " ", " "], + [" ", "X", " "], + [" ", " ", " "] + ]); + }); + it("should check for vertical wins", () => { + board = [[" ", "X", " "], [" ", "X", " "], [" ", "X", " "]]; + assert.equal(verticalWin(), true); + }); + it("should check for horizontal wins", () => { + board = [["X", "X", "X"], [" ", " ", " "], [" ", " ", " "]]; + assert.equal(horizontalWin(), true); + }); + it("should check for diagonal wins", () => { + board = [["X", " ", " "], [" ", "X", " "], [" ", " ", "X"]]; + assert.equal(diagonalWin(), true); + }); + it("should detect a win", () => { + assert.equal(checkForWin(), true); + }); + }); +} else { + getPrompt(); +} \ No newline at end of file diff --git a/13towers-of-hanoi-node/index.js b/13towers-of-hanoi-node/index.js index f5210825..256ff164 100644 --- a/13towers-of-hanoi-node/index.js +++ b/13towers-of-hanoi-node/index.js @@ -1,7 +1,7 @@ -'use strict'; +"use strict"; -const assert = require('assert'); -const readline = require('readline'); +const assert = require("assert"); +const readline = require("readline"); const rl = readline.createInterface({ input: process.stdin, output: process.stdout @@ -19,30 +19,43 @@ function printStacks() { console.log("c: " + stacks.c); } -function movePiece() { - // Your code here - +function movePiece(startStack, endStack) { + let piece = stacks[startStack].pop(); + stacks[endStack].push(piece); + checkForWin(); } -function isLegal() { - // Your code here - +function isLegal(startStack, endStack) { + if (stacks[endStack].length < 1) { + movePiece(startStack, endStack); + return true; + } else if ( + stacks[startStack][stacks[startStack].length - 1] < + stacks[endStack][stacks[endStack].length - 1] + ) { + movePiece(startStack, endStack); + return true; + } else { + return false; + } } function checkForWin() { - // Your code here - + if (stacks.b.length === 4) { + return true; + } else { + return false; + } } function towersOfHanoi(startStack, endStack) { - // Your code here - + isLegal(startStack, endStack); } function getPrompt() { printStacks(); - rl.question('start stack: ', (startStack) => { - rl.question('end stack: ', (endStack) => { + rl.question("start stack: ", startStack => { + rl.question("end stack: ", endStack => { towersOfHanoi(startStack, endStack); getPrompt(); }); @@ -51,44 +64,40 @@ function getPrompt() { // Tests -if (typeof describe === 'function') { - - describe('#towersOfHanoi()', () => { - it('should be able to move a block', () => { - towersOfHanoi('a', 'b'); +if (typeof describe === "function") { + describe("#towersOfHanoi()", () => { + it("should be able to move a block", () => { + towersOfHanoi("a", "b"); assert.deepEqual(stacks, { a: [4, 3, 2], b: [1], c: [] }); }); }); - describe('#isLegal()', () => { - it('should not allow an illegal move', () => { + describe("#isLegal()", () => { + it("should not allow an illegal move", () => { stacks = { a: [4, 3, 2], b: [1], c: [] }; - assert.equal(isLegal('a', 'b'), false); + assert.equal(isLegal("a", "b"), false); }); - it('should allow a legal move', () => { + it("should allow a legal move", () => { stacks = { a: [4, 3, 2, 1], b: [], c: [] }; - assert.equal(isLegal('a', 'c'), true); + assert.equal(isLegal("a", "c"), true); }); }); - describe('#checkForWin()', () => { - it('should detect a win', () => { + describe("#checkForWin()", () => { + it("should detect a win", () => { stacks = { a: [], b: [4, 3, 2, 1], c: [] }; assert.equal(checkForWin(), true); stacks = { a: [1], b: [4, 3, 2], c: [] }; assert.equal(checkForWin(), false); }); }); - } else { - getPrompt(); - } \ No newline at end of file diff --git a/14final/index.html b/14final/index.html index e69de29b..fb8b0686 100644 --- a/14final/index.html +++ b/14final/index.html @@ -0,0 +1,49 @@ + + + + + + + + + + + Document + + + +
+ + + + + \ No newline at end of file diff --git a/14final/script.js b/14final/script.js index e69de29b..942bb133 100644 --- a/14final/script.js +++ b/14final/script.js @@ -0,0 +1,15 @@ +'use strict'; + +document.addEventListener('DOMContentLoaded', () => { + + document.querySelector('#slow').addEventListener('click', () => { + const currentSpeed = document.querySelector('.square').style.animationDuration; + document.querySelector('.square').style.animationDuration = `${Number(currentSpeed.split('s')[0]) + 10}s` + }); + + document.querySelector('#slower').addEventListener('click', () => { + const currentSpeed = document.querySelector('.square').style.animationDuration; + document.querySelector('.square').style.animationDuration = `${Number(currentSpeed.split('s')[0]) + 30}s` + }); + +}); \ No newline at end of file diff --git a/14final/style.css b/14final/style.css index e69de29b..e1faad45 100644 --- a/14final/style.css +++ b/14final/style.css @@ -0,0 +1,49 @@ +/* +*{ + box-sizing: border-box; + border-radius: 50%; + } + + +.square { + height: 250px; + width: 250px; + background-color: blue; + box-sizing: border-box; + /* opacity: .9; */ + /* } + + .rotate { + -webkit-animation: spin 30s infinite linear; + animation-timing-function: linear; + + } + @keyframes spin { + 100% { + transform: rotate(360deg); + } + } */ + + + + .square { + height: 300px; + width: 300px; + background-color: blue; + animation-name: spin; + animation-duration: 1s; + animation-iteration-count: infinite; + animation-timing-function: linear; + border-radius: 50%; + /* background-image: url("./wheel_share.jpg"); */ + } + + img { + max-width: 300px; + } + @keyframes spin { + 100% { + transform: rotate(360deg); + } + } + diff --git a/index.html b/index.html index 247bea4f..df203653 100644 --- a/index.html +++ b/index.html @@ -1,9 +1,29 @@ - + - + + + + Document + + -

Hello, world!

+

Hello, Laxmi

+ - + +