jzheaux/businesscard.html

## businesscard.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
	src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
<script type="text/javascript">
	$(function() {
		$("nav a").click(function() {
			var divId = $(this).attr("href");
			var theDiv = $(divId);

			if ( !theDiv.hasClass("selected") ) {
				$(".section.selected").removeClass("selected");
				theDiv.addClass("selected");
			}
		});
	});

	var profileReceived = function(response) {
		console.log(response);

		var firstName = response.values[0].firstName;
		var lastName = response.values[0].lastName;

		// find 3-5 properties from the LinkedIn payload
		// and add them to the business card using this method

		// e.g. changing the insides
		$("#name h1").html(firstName + " " + lastName);

		// e.g. changing the attribute
		$(".linkedin a").attr("href", "http://www.google.com");
	}
</script>
<script type="text/javascript" src="inauth.js"></script>
<script type="text/javascript" src="//platform.linkedin.com/in.js">
    api_key:   7563910x1lf6op
    onLoad:    OnLinkedInFrameworkLoad
    authorize: true
</script>
<link rel="stylesheet" type="text/css" href="businesscard-goal.css"/>
</head>
<body>

	<div id="card">
		<header>
			<div id="name">
				<h1>
					<script type="in/Login">
					</script>
				</h1>
				<h2></h2>
			</div>

			<nav>
				<ul>
					<li><a href="#contact">Contact</a></li>
					<li><a href="#profile">Profile</a></li>
					<li><a href="#work">Portfolio</a></li>
				</ul>
			</nav>
		</header>

		<div id="contact" class="section selected">
			<img/>
			<section>
				<h1>Inquiries</h1>
				<ul>
					<li><span class="email"><a></a></span>
					</li>
					<li><span class="phone"><a></a>
						</pan></li>
					<li><span class="skype"></span></li>
					<li><span class="location"></span></li>
				</ul>
			</section>
			<section>
				<h1>Follow</h1>
				<ul>
					<li><span class="facebook"><a>Facebook</a></span></li>
					<li><span class="linkedin"><a>LinkedIn</a></span></li>
				</ul>
			</section>
		</div>

		<div id="profile" class="section">
			<p>Behold, a little bit about me...</p>
		</div>
		<div id="work" class="section">
			<p>Here are some cool things that I have created for myself and
				other folks...</p>
		</div>
		<footer>
			<p>&copy; 2015 All Rights Reserved</p>
		</footer>
	</div>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Insert title here</title>
	<script type="text/javascript"
	src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
	<script type="text/javascript">
	$(function() {
	$("nav a").click(function() {
	var divId = $(this).attr("href");
	var theDiv = $(divId);

	if ( !theDiv.hasClass("selected") ) {
	$(".section.selected").removeClass("selected");
	theDiv.addClass("selected");
	}
	});
	});

	var profileReceived = function(response) {
	console.log(response);

	var firstName = response.values[0].firstName;
	var lastName = response.values[0].lastName;

	// find 3-5 properties from the LinkedIn payload
	// and add them to the business card using this method

	// e.g. changing the insides
	$("#name h1").html(firstName + " " + lastName);

	// e.g. changing the attribute
	$(".linkedin a").attr("href", "http://www.google.com");
	}
	</script>
	<script type="text/javascript" src="inauth.js"></script>
	<script type="text/javascript" src="//platform.linkedin.com/in.js">
	api_key: 7563910x1lf6op
	onLoad: OnLinkedInFrameworkLoad
	authorize: true
	</script>
	<link rel="stylesheet" type="text/css" href="businesscard-goal.css"/>
	</head>
	<body>

	<div id="card">
	<header>
	<div id="name">
	<h1>
	<script type="in/Login">
	</script>
	</h1>
	<h2></h2>
	</div>

	<nav>
	<ul>
	<li><a href="#contact">Contact</a></li>
	<li><a href="#profile">Profile</a></li>
	<li><a href="#work">Portfolio</a></li>
	</ul>
	</nav>
	</header>

	<div id="contact" class="section selected">
	<img/>
	<section>
	<h1>Inquiries</h1>
	<ul>
	<li><span class="email"><a></a></span>
	</li>
	<li><span class="phone"><a></a>
	</pan></li>
	<li><span class="skype"></span></li>
	<li><span class="location"></span></li>
	</ul>
	</section>
	<section>
	<h1>Follow</h1>
	<ul>
	<li><span class="facebook"><a>Facebook</a></span></li>
	<li><span class="linkedin"><a>LinkedIn</a></span></li>
	</ul>
	</section>
	</div>

	<div id="profile" class="section">
	<p>Behold, a little bit about me...</p>
	</div>
	<div id="work" class="section">
	<p>Here are some cool things that I have created for myself and
	other folks...</p>
	</div>
	<footer>
	<p>© 2015 All Rights Reserved</p>
	</footer>
	</div>
	</body>
	</html>