highsmithcodes · June 14, 2016 02:46
diff --git a/index.html b/index.html
 <html lang="en">
 <head>
 	  <meta charset="UTF-8">
 	  <title>Quote Machine</title>
 	  <link rel="stylesheet" href="quote.css">
  	<link href='http://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
  <script src="jquery-1.11.2.min.js" type="text/javascript"></script>
 </head>
  <body>
 	    <div id="container">
    		  <h2>Quote Machine</h2>
      			<div id="quoteContainer">
 				      <p>.  .  .</p>
 				      <p id="quoteGenius"></p>			
 			    </div><!--end quoteContainer-->
 			
 			    <div id="buttonContainer">
  				    <a href="#" id="quoteButton">Generate</a>
 		    </div><!--end buttonContainer-->
    <div id="buttonContainer2">
        <a href="https://twitter.com/intent/tweet?url=&original_referer="><img src="https://g.twimg.com/Twitter_logo_blue.png" height="40" width="50"></a>
          
    </div><!--end buttonContainer-->

 	   </div><!--end container-->
  </body>
 </html>
diff --git a/script.js b/script.js
 	$(document).ready(function(){
    
 		var quoteSource=[
 		{
 			quote: "A shit in a suit still stinks",
 			name:"Unknown"
 	    },
 	    {
 	    	quote:"When a person tells you that you hurt them, you don’t get to decide that you didn’t.",
 	    	name:"Louis C.K"
 	    },
 	    {
 	    	quote:"I'm sorry, Wilson! Wilson, I'm sorry!",
 	    	name:"Confucius"
 	    },
 	    {
 	    	quote:"Let's kick some ice.",
 	    	name:"Thomas A. Edison"
 	    },
 	    {
 	    	quote:"You sack of wine!",
 	    	name:"Gandhi"
 	    },
 	    {
 	    	quote:"A dingo ate my baby!",
 	    	name:"Aym Rand"
 	    },
 	    {
 	    	quote:"I'm just a girl, standing in front of a boy, asking him to love her.",
 	    	name:"Dr. Martin Luther King Jr."
 	    },
 	    {
 	    	quote:"For Narnia!",
 	    	name:"Orson Welles"
 	    },
 	    {
 	    	quote:"I don't like sand. It's coarse and rough and irritating and it gets everywhere.",
 	    	name:"Alfred A. Montapert"
 	    },
 	    {
 	    	quote:"This is your wakeup call I AM AN F... B... I AGENT!",
 	    	name:"Malala Yousafzai"
 	    },
 	    {
 	    	quote:"Get to the choppa.",
 	    	name:"Eleanor Roosevelt"
 	    },
 	    {
 	    	quote:"Everybody knows, when you make an assumption, you make an ass out of you and umption.",
 	    	name:"Oscar Wilde"
 	    },
 	    {
 	    	quote:"We're gonna need a bigger boat.",
 	    	name:"Albert Einstein"
 	    },
 	    {
 	    	quote:"If you're a bird, I'm a bird.",
 	    	name:"Margaret Mead"
 	    },
 	    {
 	    	quote:"It's a pressure valve. It won't open unless there's tremendous pressure.",
 	    	name:"Winston Churchill"
 	    },
 	    {
 	    	quote:"It's clobbering time!",
 	    	name:"Oprah Winfrey"
 	    },
 	    {
 	    	quote:"It's not a tumor!",
 	    	name:"Mark Twain"
 	    },
 	    {
 	    	quote:"We're going to live on! We're going to survive! Today we celebrate our Independence Day.",
 	    	name:"Albert Einstein"
 	    },
 	];
 		

 		$('#quoteButton').click(function(evt){
 			//define the containers of the info we target
 			var quote = $('#quoteContainer p').text();
 			var quoteGenius = $('#quoteGenius').text();
 			//prevent browser's default action
 			evt.preventDefault();
 			//getting a new random number to attach to a quote and setting a limit
 			var sourceLength = quoteSource.length;
 			var randomNumber= Math.floor(Math.random()*sourceLength);
 			//set a new quote
 			for(i=0;i<=sourceLength;i+=1){
 			var newQuoteText = quoteSource[randomNumber].quote;
 			var newQuoteGenius = quoteSource[randomNumber].name;
 			//console.log(newQuoteText,newQuoteGenius);
      var timeAnimation = 500;
      var quoteContainer = $('#quoteContainer');
      //fade out animation with callback
      quoteContainer.fadeOut(timeAnimation, function(){
        quoteContainer.html('');
 				quoteContainer.append('<p>'+newQuoteText+'</p>'+'<p id="quoteGenius">'+'-								'+newQuoteGenius+'</p>');
        
        //fadein animation.
        quoteContainer.fadeIn(timeAnimation);
      });  
 			
 			break;
 		};//end for loop
 	
 	});//end quoteButton function
 		
 		
 });//end document ready

diff --git a/scripts b/scripts
 <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
diff --git a/style.css b/style.css
 body {
 	font-family: 'Roboto', sans-serif;
 	color: #000;
 }

 #container {
 	width:800px;
 	margin:50px auto;
 	padding: 20px;
 	width:50%;
 }

 #container h2 {
 	text-align: center;
 	color: black;
  font-size: 25px;
  padding: 60px;
  letter-spacing: 3px;
  border: 1px solid black;
 }

 #quoteContainer{
 	width:75%;
 	background: #fff;
 	padding:10px;
 	margin:30px auto;
 	text-align: center;
  height:70px;
 }
 #buttonContainer{
 	width: 100%;
 	text-align: center;
 }

 #buttonContainer2{
 	width: 100%;
 	text-align: center;
  padding-top: 50px;
 }

 #quoteButton{
 	width: 100px;
 	margin-top: 10px;
 	border: 1px solid black;
 	color: black;
 	font-family: inherit;
 	font-weight: bold;
 	padding:5px;
 	text-decoration: none;
 	text-align: center;
 }

 #webButton {
  width: 100px;
 	color: black;
 	font-family: inherit;
 	font-weight: bold;
 	margin: 30px;
  text-decoration: none;
 	text-align: center;
 }

 #quoteButton:hover{
 	cursor:pointer;
 	background:#346E75;/* teal */
 	color: #fff;	
 }
 #quoteButton:active{
 	cursor: pointer;
 }
 #quoteButton{
 	display: inline-block;
 }
 #quoteGenius{
 	font-style: italic;
 	font-weight: 600;
 	text-align: center;
 }


 /*MEDIA QUERIES*/
 @media screen and(max-width:760px){
 	#quoteButton,#addNew{
 		display: block;
 	}
 }
diff --git a/Sweet, Sweet Quote Machine.markdown b/Sweet, Sweet Quote Machine.markdown
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Quote Machine</title>
	<link rel="stylesheet" href="quote.css">
	<link href='http://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
	<script src="jquery-1.11.2.min.js" type="text/javascript"></script>
	</head>
	<body>
	<div id="container">
	<h2>Quote Machine</h2>
	<div id="quoteContainer">
	<p>. . .</p>
	<p id="quoteGenius"></p>
	</div><!--end quoteContainer-->

	<div id="buttonContainer">
	<a href="#" id="quoteButton">Generate</a>
	</div><!--end buttonContainer-->
	<div id="buttonContainer2">
	<a href="https://twitter.com/intent/tweet?url=&original_referer="><img src="https://g.twimg.com/Twitter_logo_blue.png" height="40" width="50"></a>

	</div><!--end buttonContainer-->

	</div><!--end container-->
	</body>
	</html>
	$(document).ready(function(){

	var quoteSource=[
	{
	quote: "A shit in a suit still stinks",
	name:"Unknown"
	},
	{
	quote:"When a person tells you that you hurt them, you don’t get to decide that you didn’t.",
	name:"Louis C.K"
	},
	{
	quote:"I'm sorry, Wilson! Wilson, I'm sorry!",
	name:"Confucius"
	},
	{
	quote:"Let's kick some ice.",
	name:"Thomas A. Edison"
	},
	{
	quote:"You sack of wine!",
	name:"Gandhi"
	},
	{
	quote:"A dingo ate my baby!",
	name:"Aym Rand"
	},
	{
	quote:"I'm just a girl, standing in front of a boy, asking him to love her.",
	name:"Dr. Martin Luther King Jr."
	},
	{
	quote:"For Narnia!",
	name:"Orson Welles"
	},
	{
	quote:"I don't like sand. It's coarse and rough and irritating and it gets everywhere.",
	name:"Alfred A. Montapert"
	},
	{
	quote:"This is your wakeup call I AM AN F... B... I AGENT!",
	name:"Malala Yousafzai"
	},
	{
	quote:"Get to the choppa.",
	name:"Eleanor Roosevelt"
	},
	{
	quote:"Everybody knows, when you make an assumption, you make an ass out of you and umption.",
	name:"Oscar Wilde"
	},
	{
	quote:"We're gonna need a bigger boat.",
	name:"Albert Einstein"
	},
	{
	quote:"If you're a bird, I'm a bird.",
	name:"Margaret Mead"
	},
	{
	quote:"It's a pressure valve. It won't open unless there's tremendous pressure.",
	name:"Winston Churchill"
	},
	{
	quote:"It's clobbering time!",
	name:"Oprah Winfrey"
	},
	{
	quote:"It's not a tumor!",
	name:"Mark Twain"
	},
	{
	quote:"We're going to live on! We're going to survive! Today we celebrate our Independence Day.",
	name:"Albert Einstein"
	},
	];


	$('#quoteButton').click(function(evt){
	//define the containers of the info we target
	var quote = $('#quoteContainer p').text();
	var quoteGenius = $('#quoteGenius').text();
	//prevent browser's default action
	evt.preventDefault();
	//getting a new random number to attach to a quote and setting a limit
	var sourceLength = quoteSource.length;
	var randomNumber= Math.floor(Math.random()*sourceLength);
	//set a new quote
	for(i=0;i<=sourceLength;i+=1){
	var newQuoteText = quoteSource[randomNumber].quote;
	var newQuoteGenius = quoteSource[randomNumber].name;
	//console.log(newQuoteText,newQuoteGenius);
	var timeAnimation = 500;
	var quoteContainer = $('#quoteContainer');
	//fade out animation with callback
	quoteContainer.fadeOut(timeAnimation, function(){
	quoteContainer.html('');
	quoteContainer.append('<p>'+newQuoteText+'</p>'+'<p id="quoteGenius">'+'- '+newQuoteGenius+'</p>');

	//fadein animation.
	quoteContainer.fadeIn(timeAnimation);
	});

	break;
	};//end for loop

	});//end quoteButton function


	});//end document ready
	body {
	font-family: 'Roboto', sans-serif;
	color: #000;
	}

	#container {
	width:800px;
	margin:50px auto;
	padding: 20px;
	width:50%;
	}

	#container h2 {
	text-align: center;
	color: black;
	font-size: 25px;
	padding: 60px;
	letter-spacing: 3px;
	border: 1px solid black;
	}

	#quoteContainer{
	width:75%;
	background: #fff;
	padding:10px;
	margin:30px auto;
	text-align: center;
	height:70px;
	}
	#buttonContainer{
	width: 100%;
	text-align: center;
	}

	#buttonContainer2{
	width: 100%;
	text-align: center;
	padding-top: 50px;
	}

	#quoteButton{
	width: 100px;
	margin-top: 10px;
	border: 1px solid black;
	color: black;
	font-family: inherit;
	font-weight: bold;
	padding:5px;
	text-decoration: none;
	text-align: center;
	}

	#webButton {
	width: 100px;
	color: black;
	font-family: inherit;
	font-weight: bold;
	margin: 30px;
	text-decoration: none;
	text-align: center;
	}

	#quoteButton:hover{
	cursor:pointer;
	background:#346E75;/* teal */
	color: #fff;
	}
	#quoteButton:active{
	cursor: pointer;
	}
	#quoteButton{
	display: inline-block;
	}
	#quoteGenius{
	font-style: italic;
	font-weight: 600;
	text-align: center;
	}


	/MEDIA QUERIES/
	@media screen and(max-width:760px){
	#quoteButton,#addNew{
	display: block;
	}
	}