JonathanCMitchell/index.html

## index.html
<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
	<link rel="icon" type="image/png" href="/img/crown_freepik.png">

    <title>Jonathan Mitchell | Random Quote Generator</title>

	   <!-- Bootstrap and Core css-->
	<link href = "main.css" rel="stylesheet">
    <link href="css/bootstrap.css" rel="stylesheet">


    <!-- Bootstrap Core CSS
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> -->
    <!-- Custom CSS -->

    <!-- Fonts -->
      <!-- Insert Font Awesome -->
</head>


<header>
Quote Generator - Jonathan Mitchell
</header>

<body>
<h1 class="text-center" id="headerText">Random Quote Generator</h1>
<div class="container-fluid" id="containerID">
  <div class="row" id="island">
    <div class="col-md-12 col-xs-4">
<div id = "quotebox">
  <p id="quote_par_text" class="text-center">Text goes here </p>
  <!-- find a way to make the authors name into a link somehow -->
  <p id="quote_par_source" class="text-center"><a href="#">Auth goes here </a></p>
  <button class="btn btn-primary center-block" id="quote_button">New Quote</button>
 </div>
  </div>
  </div>
</div>


<!-- Link javascript files -->
    <script src="../js/jquery-2.2.1.min.js"></script>
    <script src="/js/quotes.js"></script>
</body>

<footer>

</footer>

## main.css

.container-fluid {
  width: 600px;
  height: 60px;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#quotebox {
  border-width: 20px;
  border-radius: 3px;
  width: 450px;
  padding: 40px 50px;
  position: relative;
  margin: 8% auto auto auto;
  display: table;
}


#quote_par_source {
  text-align: right;
  font-size: 1em;
    padding-right: 5px;
}


#quote_par_text {
  text-align: center;
  font-size: 2em;
  padding-left: 30px;

}
#headerText {
  top: 20%;
  padding-top: 5px;
  height: 75px;
  margin: auto;
}

.fa-tumblr {
  padding-left: 20px;
}

.fa-quote-left {
  text-align: left;
  font-size: 30px;
  padding-left: 10px;
}

## quotes.js

function changeQuote(arr) {
    var quote_par_text = document.getElementById("quote_par_text");
    var quote_par_source = document.getElementById("quote_par_source")
    var rand_num = pickRandom(arr);
   quote_par_text.innerHTML = arr[rand_num].text;
    quote_par_source.innerHTML = "-"+arr[rand_num].source;
}

function pickRandom(arr) {
    var rand = Math.floor(Math.random()*arr.length);
    return rand;
}

function changeColor(elem1, elem2, elem3, elem4, elem5, elem6) {
  var randNum1 = Math.floor(Math.random()*255).toString();
  var randNum2 = Math.floor(Math.random()*255).toString();
  var randNum3 = Math.floor(Math.random()*255).toString();
  var invNum1 = 256 - randNum1;
  var invNum2 = 256 - randNum2;
  var invNum3 = 256 - randNum3;
  return elem1.style.backgroundColor = 'rgb('+randNum1+','+randNum2+','+ randNum3+')',
    elem2.style.backgroundColor = elem1.style.backgroundColor,
    elem3.style.color = 'rgb('+invNum1+','+invNum2+','+ invNum3+')',
    elem4.style.color = elem3.style.color,
    elem2.style.color = elem3.style.color,
    elem5.style.backgroundColor = elem3.style.color,
  elem6[0].style.color = elem3.style.color;
  elem6[1].style.backgroundColor = elem3.style.color;
}

document.getElementById("quote_button").onclick = function() {
  var quotebox = document.getElementById("quotebox");
  var headerText = document.getElementById("headerText")
  var containerId = document.getElementById("containerID")
  var quote_par_text = document.getElementById("quote_par_text")
  var quote_par_source = document.getElementById("quote_par_source")
  var body = document.body;
  var fa = document.getElementsByClassName("fa");
 // var body = document.querySelector("body");
   changeQuote(quotes);
   changeColor(quotebox, headerText, quote_par_text, quote_par_source, body, fa);
}


var quotes = [
  {
    "text" : "Someone is sitting in the shade because someone planted a tree a long time ago",
    "source" :  "Someone I dont know"
  },
  {
    "text" : "Dude fuck it, its college",
    "source" : "Jmitch"
  },
  {
    "text" : "Success is a lousy teacher. It seduces smart people into thinking they can't lose",
    "source" : "Bill Gates"
  },
  {
    "text" : "It ain’t about how hard you hit. It’s about how hard you can get hit and keep moving forward; how much you can take and keep moving forward. That’s how winning is done!",
    "source" : "Rocky Balboa"
  },
  {
    "text" : "Bitches get stitches",
    "source" : "Michael Charles"
  },
  {
    "text" : "Avoid things that will require an apology",
    "source": "Unknown"
  },
  {
    "text": "If someone is too good for you, you aren't good enough for yourself",
    "source" : "Life"
  },
  {
    "text" : "Betrayal is pretty F",
    "source" : "KT"
  },
  {
    "text" : "He who has a why to live can bear with almost any how ",
    "source" : "Friedrich Nietzsche"
  },
  {
    "text" : "I just wanna make sauce",
    "source": "Typo"
  },
  {
    "text": "I heard",
    "source" : "Everybody"
  },
  {
    "text" : "Women might be able to fake orgasms. But men can fake a whole relationship",
    "source": "Sharon Stone"
  },
  {
    "text" : "Be nice to people on your way up because you meet them on your way down.",
    "source" : "Jimmy Durante"
  },
  {
    "text" : "If you are going through hell, keep going",
    "source" : "Sir Winston Churchill"
  },
  {
    "text" : "C makes it easy to shoot yourself in the foot; C++ makes it harder, but when you do, it blows away your whole leg.",
    "source": "Bjarne Stroustrup"
  },
  {
    "text" : "Do, or do not. There is no 'try'.",
    "source": "Yoda"
  },
  {
    "text" : "When you do the common things in life in an uncommon way, you will command the attention of the world.",
    "source": "George Washington Carver"
  },
  {
    "text" : "I have not failed. I've just found 10,000 ways that won't work.",
    "source": "Thomas Alba Edison"
  },
  {
    "text" : "In the End, we will remember not the words of our enemies, but the silence of our friends",
    "source": "Martin Luther King Jr."
  },
  {
    "text" : "Blessed is the man, who having nothing to say, abstains from giving wordy evidence of the fact.",
    "source": "George Eliot"
  },
  {
    "text" : "The first step is you have to say that you can",
    "source": "Will Smith"
  },
  {
    "text" : "Being realistic is the most commonly traveled road to mediocrity.",
    "source": "Will Smith"
  },
  {
    "text" : "The separation of talent and skill is one of the greatest misunderstood concepts for people who are trying to excel, who have dreams, who want to do things. Talent you have naturally. Skill is only developed by hours and hours and hours of beating on your craft.",
    "source": "Will Smith"
  },
  {
    "text" : "Don’t ever let someone tell you that you can’t do something. You got a dream, you gotta protect it. When people can’t do something themselves, they are going to tell you that you can’t do it. You want something, go get it. Period.",
    "source": "Will Smith"
  },
  {
    "text" : "If you’re not making someone else’s life better, than you are wasting your time. Your life will become better by making other people’s lives better.",
    "source": "Will Smith"
  },
  {
    "text" : "Here's looking at you, kid",
    "source": "Casablanca"
  },
  {
    "text" : "Start by doing what's necessary; then do what's possible; and suddenly you are doing the impossible",
    "source": "Francis of Assisi"
  },
  {
    "text" : "As we express gratitude, we must never forget that the highest appreciation is not to utter words, but to live by them",
    "source": "John F. Kennedy"
  },
  {
    "text" : "If I have seen further is it by standing on the shoulders of Giants",
    "source": "Sir Isaac Newton"
  },
  {
    "text" : "You miss 100% of the shots you don't take",
    "source": "Wayne Gretzky"
  },
  {
    "text" : "The mind is everything. What you think you become",
    "source": "Buddha"
  },
  {
    "text" : "Eighty percent of success is showing up",
    "source": "Woody Allen"
  },
  {
    "text" : "Every child is an artist. The problem is how to remain an artist once he grows up",
    "source": "Pablo Picasso"
  },
  {
    "text" : "You can never cross the ocean until you have the courage to lose sight of the shore.",
    "source" :  "Christopher Columbus"
  },
  {
    "text" : "Whether you think you can or you think you can’t, you’re right.",
    "source" :  "Henry Ford"
  },
  {
    "text" : "He who thinks he \"can't\", and he who thinks he can, are both right",
    "source" :  "W Smith."
  },
  {
    "text" : "The two most important days in your life are the day you are born and the day you find out why.",
    "source" : "Mark Twain"
  },
  {
    "text" : "Whatever you can do, or dream you can, begin it.  Boldness has genius, power and magic in it.",
    "source" :  "Johann Wolfgang von Goethe"
  },
  {
    "text" : "Life shrinks or expands in proportion to one’s courage.",
    "source" :  "Anais Nin" //maybe provide a link to her wikipedia page as well.
  },
  {
    "text" : "The only person you are destined to become is the person you decide to be.",
    "source" :  "Ralph Waldo Emerson"
  },
  {
    "text" : "When I stand before God at the end of my life, I would hope that I would not have a single bit of talent left and could say, I used everything you gave me. –Erma Bombeck",
    "source" : "Erma Bombeck"
  },
  {
    "text" : "Believe you can and you’re halfway there",
    "source" :  "Theodore Roosevelt"
  },
  {
    "text" : "Everything you’ve ever wanted is on the other side of fear.",
    "source" :  "George Addair"
  },
  {
    "text" : "Teach thy tongue to say, “I do not know,” and thous shalt progress.",
    "source" :  "Maimonides"
  },
  {
    "text" : "When I let go of what I am, I become what I might be",
    "source" :  "Lao Tzu"
  },
  {
    "text" : "Life is not measured by the number of breaths we take, but by the moments that take our breath away.",
    "source" :  "Maya Angelou"
  },
  {
    "text" : "There are no traffic jams along the extra mile.",
    "source" :  "Roger Staubach"
  },
  {
    "text" : "Build your own dreams, or someone else will hire you to build theirs.",
    "source" :  "Farrah Gray"
  },
  {
    "text" : "Education costs money.  But then so does ignorance.",
    "source" :  "Sir Claus Moser"
  },
  {
    "text" : "When everything seems to be going against you, remember that the airplane takes off against the wind, not with it.",
    "source" :  "Henry Ford"
  },
  {
    "text" : "Nothing is impossible, the word itself says, “I’m possible",
    "source" :  "Audrey Hepburn"
  },
  {
    "text": "The only way to do great work is to love what you do.",
    "source": "Steve Jobs"
  },
  {
    "text": "If something is important enough, even if the odds are against you, you should still do it",
    "source": "Elon Musk"
  },
  {
    "text": "Actually I can",
    "source": "You"
  },
  {
    "text": "When we love, we always strive to become better than we are. When we strive to become better than we are, everything around us becomes better too.",
    "source": "Paulo Coelho, The Alchemist"
  },
  {
    "text": "Hold fast to dreams, for if dreams die<br> Life is a broken-winged bird, That cannot fly.",
    "source": "Langston Hughes"
  },
  {
    "text": "The flower that blooms in adversity is the rarest and most beautiful of all",
    "source": "Mulan - Disney"
  },
  {
    "text": "Nurture your mind with great thoughts. To believe in the heroic makes heroes",
    "source": "Benjamin Disraeli"
  }
]
	<!DOCTYPE html>
	<html lang="en">

	<head>

	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- The above 3 meta tags must come first in the head; any other head content must come after these tags -->
	<link rel="icon" type="image/png" href="/img/crown_freepik.png">

	<title>Jonathan Mitchell \| Random Quote Generator</title>

	<!-- Bootstrap and Core css-->
	<link href = "main.css" rel="stylesheet">
	<link href="css/bootstrap.css" rel="stylesheet">



	<!-- Bootstrap Core CSS
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> -->
	<!-- Custom CSS -->

	<!-- Fonts -->
	<!-- Insert Font Awesome -->
	</head>



	<header>
	Quote Generator - Jonathan Mitchell
	</header>

	<body>
	<h1 class="text-center" id="headerText">Random Quote Generator</h1>
	<div class="container-fluid" id="containerID">
	<div class="row" id="island">
	<div class="col-md-12 col-xs-4">
	<div id = "quotebox">
	<p id="quote_par_text" class="text-center">Text goes here </p>
	<!-- find a way to make the authors name into a link somehow -->
	<p id="quote_par_source" class="text-center"><a href="#">Auth goes here </a></p>
	<button class="btn btn-primary center-block" id="quote_button">New Quote</button>
	</div>
	</div>
	</div>
	</div>




	<!-- Link javascript files -->
	<script src="../js/jquery-2.2.1.min.js"></script>
	<script src="/js/quotes.js"></script>
	</body>

	<footer>

	</footer>

	.container-fluid {
	width: 600px;
	height: 60px;
	margin: 0 auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	}

	#quotebox {
	border-width: 20px;
	border-radius: 3px;
	width: 450px;
	padding: 40px 50px;
	position: relative;
	margin: 8% auto auto auto;
	display: table;
	}


	#quote_par_source {
	text-align: right;
	font-size: 1em;
	padding-right: 5px;
	}




	#quote_par_text {
	text-align: center;
	font-size: 2em;
	padding-left: 30px;

	}
	#headerText {
	top: 20%;
	padding-top: 5px;
	height: 75px;
	margin: auto;
	}

	.fa-tumblr {
	padding-left: 20px;
	}

	.fa-quote-left {
	text-align: left;
	font-size: 30px;
	padding-left: 10px;
	}

	function changeQuote(arr) {
	var quote_par_text = document.getElementById("quote_par_text");
	var quote_par_source = document.getElementById("quote_par_source")
	var rand_num = pickRandom(arr);
	quote_par_text.innerHTML = arr[rand_num].text;
	quote_par_source.innerHTML = "-"+arr[rand_num].source;
	}

	function pickRandom(arr) {
	var rand = Math.floor(Math.random()*arr.length);
	return rand;
	}

	function changeColor(elem1, elem2, elem3, elem4, elem5, elem6) {
	var randNum1 = Math.floor(Math.random()*255).toString();
	var randNum2 = Math.floor(Math.random()*255).toString();
	var randNum3 = Math.floor(Math.random()*255).toString();
	var invNum1 = 256 - randNum1;
	var invNum2 = 256 - randNum2;
	var invNum3 = 256 - randNum3;
	return elem1.style.backgroundColor = 'rgb('+randNum1+','+randNum2+','+ randNum3+')',
	elem2.style.backgroundColor = elem1.style.backgroundColor,
	elem3.style.color = 'rgb('+invNum1+','+invNum2+','+ invNum3+')',
	elem4.style.color = elem3.style.color,
	elem2.style.color = elem3.style.color,
	elem5.style.backgroundColor = elem3.style.color,
	elem6[0].style.color = elem3.style.color;
	elem6[1].style.backgroundColor = elem3.style.color;
	}

	document.getElementById("quote_button").onclick = function() {
	var quotebox = document.getElementById("quotebox");
	var headerText = document.getElementById("headerText")
	var containerId = document.getElementById("containerID")
	var quote_par_text = document.getElementById("quote_par_text")
	var quote_par_source = document.getElementById("quote_par_source")
	var body = document.body;
	var fa = document.getElementsByClassName("fa");
	// var body = document.querySelector("body");
	changeQuote(quotes);
	changeColor(quotebox, headerText, quote_par_text, quote_par_source, body, fa);
	}



	var quotes = [
	{
	"text" : "Someone is sitting in the shade because someone planted a tree a long time ago",
	"source" : "Someone I dont know"
	},
	{
	"text" : "Dude fuck it, its college",
	"source" : "Jmitch"
	},
	{
	"text" : "Success is a lousy teacher. It seduces smart people into thinking they can't lose",
	"source" : "Bill Gates"
	},
	{
	"text" : "It ain’t about how hard you hit. It’s about how hard you can get hit and keep moving forward; how much you can take and keep moving forward. That’s how winning is done!",
	"source" : "Rocky Balboa"
	},
	{
	"text" : "Bitches get stitches",
	"source" : "Michael Charles"
	},
	{
	"text" : "Avoid things that will require an apology",
	"source": "Unknown"
	},
	{
	"text": "If someone is too good for you, you aren't good enough for yourself",
	"source" : "Life"
	},
	{
	"text" : "Betrayal is pretty F",
	"source" : "KT"
	},
	{
	"text" : "He who has a why to live can bear with almost any how ",
	"source" : "Friedrich Nietzsche"
	},
	{
	"text" : "I just wanna make sauce",
	"source": "Typo"
	},
	{
	"text": "I heard",
	"source" : "Everybody"
	},
	{
	"text" : "Women might be able to fake orgasms. But men can fake a whole relationship",
	"source": "Sharon Stone"
	},
	{
	"text" : "Be nice to people on your way up because you meet them on your way down.",
	"source" : "Jimmy Durante"
	},
	{
	"text" : "If you are going through hell, keep going",
	"source" : "Sir Winston Churchill"
	},
	{
	"text" : "C makes it easy to shoot yourself in the foot; C++ makes it harder, but when you do, it blows away your whole leg.",
	"source": "Bjarne Stroustrup"
	},
	{
	"text" : "Do, or do not. There is no 'try'.",
	"source": "Yoda"
	},
	{
	"text" : "When you do the common things in life in an uncommon way, you will command the attention of the world.",
	"source": "George Washington Carver"
	},
	{
	"text" : "I have not failed. I've just found 10,000 ways that won't work.",
	"source": "Thomas Alba Edison"
	},
	{
	"text" : "In the End, we will remember not the words of our enemies, but the silence of our friends",
	"source": "Martin Luther King Jr."
	},
	{
	"text" : "Blessed is the man, who having nothing to say, abstains from giving wordy evidence of the fact.",
	"source": "George Eliot"
	},
	{
	"text" : "The first step is you have to say that you can",
	"source": "Will Smith"
	},
	{
	"text" : "Being realistic is the most commonly traveled road to mediocrity.",
	"source": "Will Smith"
	},
	{
	"text" : "The separation of talent and skill is one of the greatest misunderstood concepts for people who are trying to excel, who have dreams, who want to do things. Talent you have naturally. Skill is only developed by hours and hours and hours of beating on your craft.",
	"source": "Will Smith"
	},
	{
	"text" : "Don’t ever let someone tell you that you can’t do something. You got a dream, you gotta protect it. When people can’t do something themselves, they are going to tell you that you can’t do it. You want something, go get it. Period.",
	"source": "Will Smith"
	},
	{
	"text" : "If you’re not making someone else’s life better, than you are wasting your time. Your life will become better by making other people’s lives better.",
	"source": "Will Smith"
	},
	{
	"text" : "Here's looking at you, kid",
	"source": "Casablanca"
	},
	{
	"text" : "Start by doing what's necessary; then do what's possible; and suddenly you are doing the impossible",
	"source": "Francis of Assisi"
	},
	{
	"text" : "As we express gratitude, we must never forget that the highest appreciation is not to utter words, but to live by them",
	"source": "John F. Kennedy"
	},
	{
	"text" : "If I have seen further is it by standing on the shoulders of Giants",
	"source": "Sir Isaac Newton"
	},
	{
	"text" : "You miss 100% of the shots you don't take",
	"source": "Wayne Gretzky"
	},
	{
	"text" : "The mind is everything. What you think you become",
	"source": "Buddha"
	},
	{
	"text" : "Eighty percent of success is showing up",
	"source": "Woody Allen"
	},
	{
	"text" : "Every child is an artist. The problem is how to remain an artist once he grows up",
	"source": "Pablo Picasso"
	},
	{
	"text" : "You can never cross the ocean until you have the courage to lose sight of the shore.",
	"source" : "Christopher Columbus"
	},
	{
	"text" : "Whether you think you can or you think you can’t, you’re right.",
	"source" : "Henry Ford"
	},
	{
	"text" : "He who thinks he \"can't\", and he who thinks he can, are both right",
	"source" : "W Smith."
	},
	{
	"text" : "The two most important days in your life are the day you are born and the day you find out why.",
	"source" : "Mark Twain"
	},
	{
	"text" : "Whatever you can do, or dream you can, begin it. Boldness has genius, power and magic in it.",
	"source" : "Johann Wolfgang von Goethe"
	},
	{
	"text" : "Life shrinks or expands in proportion to one’s courage.",
	"source" : "Anais Nin" //maybe provide a link to her wikipedia page as well.
	},
	{
	"text" : "The only person you are destined to become is the person you decide to be.",
	"source" : "Ralph Waldo Emerson"
	},
	{
	"text" : "When I stand before God at the end of my life, I would hope that I would not have a single bit of talent left and could say, I used everything you gave me. –Erma Bombeck",
	"source" : "Erma Bombeck"
	},
	{
	"text" : "Believe you can and you’re halfway there",
	"source" : "Theodore Roosevelt"
	},
	{
	"text" : "Everything you’ve ever wanted is on the other side of fear.",
	"source" : "George Addair"
	},
	{
	"text" : "Teach thy tongue to say, “I do not know,” and thous shalt progress.",
	"source" : "Maimonides"
	},
	{
	"text" : "When I let go of what I am, I become what I might be",
	"source" : "Lao Tzu"
	},
	{
	"text" : "Life is not measured by the number of breaths we take, but by the moments that take our breath away.",
	"source" : "Maya Angelou"
	},
	{
	"text" : "There are no traffic jams along the extra mile.",
	"source" : "Roger Staubach"
	},
	{
	"text" : "Build your own dreams, or someone else will hire you to build theirs.",
	"source" : "Farrah Gray"
	},
	{
	"text" : "Education costs money. But then so does ignorance.",
	"source" : "Sir Claus Moser"
	},
	{
	"text" : "When everything seems to be going against you, remember that the airplane takes off against the wind, not with it.",
	"source" : "Henry Ford"
	},
	{
	"text" : "Nothing is impossible, the word itself says, “I’m possible",
	"source" : "Audrey Hepburn"
	},
	{
	"text": "The only way to do great work is to love what you do.",
	"source": "Steve Jobs"
	},
	{
	"text": "If something is important enough, even if the odds are against you, you should still do it",
	"source": "Elon Musk"
	},
	{
	"text": "Actually I can",
	"source": "You"
	},
	{
	"text": "When we love, we always strive to become better than we are. When we strive to become better than we are, everything around us becomes better too.",
	"source": "Paulo Coelho, The Alchemist"
	},
	{
	"text": "Hold fast to dreams, for if dreams die<br> Life is a broken-winged bird, That cannot fly.",
	"source": "Langston Hughes"
	},
	{
	"text": "The flower that blooms in adversity is the rarest and most beautiful of all",
	"source": "Mulan - Disney"
	},
	{
	"text": "Nurture your mind with great thoughts. To believe in the heroic makes heroes",
	"source": "Benjamin Disraeli"
	}
	]