June 18, 2015 09:28
diff --git a/readme.md b/readme.md
diff --git a/index.html b/index.html
 <!DOCTYPE html>

 <html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>pirate-badge-app</title>
    <link rel="stylesheet" href="styles.css">
    <script type="application/dart" src="main.dart"></script>
  </head>

  <body>
    <!-- Copyright (c) 2012, the Dart project authors.  Please see the AUTHORS file
     for details. All rights reserved. Use of this source code is governed by a
     BSD-style license that can be found in the LICENSE file.
 -->

 <h1>Pirate badge</h1>

 <div class="widgets">
  <div>
    <input type="text" id="inputName" maxlength="15" disabled>
  </div>
  <div>
    <button id="generateButton" disabled>Aye! Gimme a name!</button>
  </div>
 </div>
 <div class="badge">
  <div class="greeting">
    Arrr! Me name is
  </div>
  <div class="name">
    <span id="badgeName"> </span>
  </div>
 </div>
  </body>
 </html>
diff --git a/main.dart b/main.dart
 // Copyright (c) 2012, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.

 // This app starts out with almost no Dart code, as described
 // in Step 1 of the code lab (dartlang.org/codelabs/darrrt/).
 import 'dart:html';
 import 'dart:math' show Random;
 import 'dart:convert' show JSON;
 import 'dart:async' show Future;


 ButtonElement genButton;
 SpanElement badgeElement;

 main() async {
  // Your app starts here.
  print('program starts...');
  InputElement inputField = querySelector('#inputName');
 	inputField.onInput.listen(updateBadge);
  
  genButton = querySelector('#generateButton');
  genButton.onClick.listen(generateBadge);
  
  badgeElement = querySelector('#badgeName');
  
  try {
    print('waiting for pirates data...');
    await Pirate.getPiratesFromRemote();
    print('Received data!');
    
    inputField.disabled = false;
    genButton.disabled = false;
  } catch(error) {
  	 print('Error initializing pirate names: $error');
     badgeElement.text = 'Arrr! No names.';
  }
  
 }

 void updateBadge(Event e) {
  String badgeName = (e.target as InputElement).value;
  setBadgeName(new Pirate(firstName: badgeName));
  
  if(badgeName.trim().isEmpty) {
  	genButton..disabled = false
      	     ..text = "Aye! Gimme a name!";
  } else {
    genButton..disabled = true
             ..text = "Aye! write yer name!";
  }
 }

 void generateBadge(Event e) {
  setBadgeName(new Pirate());
 }

 void setBadgeName(Pirate pirate) {
  badgeElement.text = pirate.toString();
 }

 class Pirate{
 	static final Random randIndex = new Random();
  static List names = [];
  static List titles = [];
  
  static Future getPiratesFromRemote() async {
    final String path = 'https://www.dartlang.org/codelabs/darrrt/files/piratenames.json';
    String response = await HttpRequest.getString(path);
    _parseResponse(response);
  }
  
  static _parseResponse(String response) {
    Map pirateDetails = JSON.decode(response);
    names = pirateDetails['names'];
    titles = pirateDetails['appellations'];
  }
  
  String _firstName;
  String _appellation;
  
  Pirate({String firstName, String appellation}) {
  	_firstName = firstName == null ? names[randIndex.nextInt(names.length)] : firstName;
    _appellation = appellation == null ? titles[randIndex.nextInt(titles.length)] : appellation;
  }
  
  String get pirateName => _firstName.isEmpty ? '' : '$_firstName the $_appellation';
  
  String toString() => pirateName;
 }
diff --git a/styles.css b/styles.css
 body {
  background-color: #F8F8F8;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.2em;
  margin: 15px;
 }

 h1, p {
  color: #333;
 }
 .widgets {
  padding-bottom: 20pt;
  float: left;
 }
 .badge {
  border: 2px solid brown;
  border-radius: 1em;
  background: red;
  font-size: 14pt;
  width: 20em;
  height: 7em;
  text-align: center;
  float: left;
  margin-left: 20px;
  white-space: nowrap;
  overflow: hidden;
 }
 .greeting {
  color: white;
  font-family: sans-serif;
  padding: 0.5em;
 }
 .name {
  color: black;
  background: white;
  font-family: "Marker Felt", cursive;
  font-size: 25pt;
  padding-top: 1.0em;
  padding-bottom: 0.7em;
  height: 16px;
 }
 #generateButton {
  font-size: 12pt;
  margin-top: 20px;
 }
 input[type="text"] {
  font-size: 12pt;
  margin-top: 10pt;
  margin-bottom: 10pt;
  width: 12em;
 }
 @media all and (max-width: 500px) {
  .badge {
    margin-left: 0px;
  }
 }
	<!DOCTYPE html>

	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>pirate-badge-app</title>
	<link rel="stylesheet" href="styles.css">
	<script type="application/dart" src="main.dart"></script>
	</head>

	<body>
	<!-- Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file
	for details. All rights reserved. Use of this source code is governed by a
	BSD-style license that can be found in the LICENSE file.
	-->

	<h1>Pirate badge</h1>

	<div class="widgets">
	<div>
	<input type="text" id="inputName" maxlength="15" disabled>
	</div>
	<div>
	<button id="generateButton" disabled>Aye! Gimme a name!</button>
	</div>
	</div>
	<div class="badge">
	<div class="greeting">
	Arrr! Me name is
	</div>
	<div class="name">
	<span id="badgeName"> </span>
	</div>
	</div>
	</body>
	</html>
	// Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file
	// for details. All rights reserved. Use of this source code is governed by a
	// BSD-style license that can be found in the LICENSE file.

	// This app starts out with almost no Dart code, as described
	// in Step 1 of the code lab (dartlang.org/codelabs/darrrt/).
	import 'dart:html';
	import 'dart:math' show Random;
	import 'dart:convert' show JSON;
	import 'dart:async' show Future;


	ButtonElement genButton;
	SpanElement badgeElement;

	main() async {
	// Your app starts here.
	print('program starts...');
	InputElement inputField = querySelector('#inputName');
	inputField.onInput.listen(updateBadge);

	genButton = querySelector('#generateButton');
	genButton.onClick.listen(generateBadge);

	badgeElement = querySelector('#badgeName');

	try {
	print('waiting for pirates data...');
	await Pirate.getPiratesFromRemote();
	print('Received data!');

	inputField.disabled = false;
	genButton.disabled = false;
	} catch(error) {
	print('Error initializing pirate names: $error');
	badgeElement.text = 'Arrr! No names.';
	}

	}

	void updateBadge(Event e) {
	String badgeName = (e.target as InputElement).value;
	setBadgeName(new Pirate(firstName: badgeName));

	if(badgeName.trim().isEmpty) {
	genButton..disabled = false
	..text = "Aye! Gimme a name!";
	} else {
	genButton..disabled = true
	..text = "Aye! write yer name!";
	}
	}

	void generateBadge(Event e) {
	setBadgeName(new Pirate());
	}

	void setBadgeName(Pirate pirate) {
	badgeElement.text = pirate.toString();
	}

	class Pirate{
	static final Random randIndex = new Random();
	static List names = [];
	static List titles = [];

	static Future getPiratesFromRemote() async {
	final String path = 'https://www.dartlang.org/codelabs/darrrt/files/piratenames.json';
	String response = await HttpRequest.getString(path);
	_parseResponse(response);
	}

	static _parseResponse(String response) {
	Map pirateDetails = JSON.decode(response);
	names = pirateDetails['names'];
	titles = pirateDetails['appellations'];
	}

	String _firstName;
	String _appellation;

	Pirate({String firstName, String appellation}) {
	_firstName = firstName == null ? names[randIndex.nextInt(names.length)] : firstName;
	_appellation = appellation == null ? titles[randIndex.nextInt(titles.length)] : appellation;
	}

	String get pirateName => _firstName.isEmpty ? '' : '$_firstName the $_appellation';

	String toString() => pirateName;
	}
	body {
	background-color: #F8F8F8;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.2em;
	margin: 15px;
	}

	h1, p {
	color: #333;
	}
	.widgets {
	padding-bottom: 20pt;
	float: left;
	}
	.badge {
	border: 2px solid brown;
	border-radius: 1em;
	background: red;
	font-size: 14pt;
	width: 20em;
	height: 7em;
	text-align: center;
	float: left;
	margin-left: 20px;
	white-space: nowrap;
	overflow: hidden;
	}
	.greeting {
	color: white;
	font-family: sans-serif;
	padding: 0.5em;
	}
	.name {
	color: black;
	background: white;
	font-family: "Marker Felt", cursive;
	font-size: 25pt;
	padding-top: 1.0em;
	padding-bottom: 0.7em;
	height: 16px;
	}
	#generateButton {
	font-size: 12pt;
	margin-top: 20px;
	}
	input[type="text"] {
	font-size: 12pt;
	margin-top: 10pt;
	margin-bottom: 10pt;
	width: 12em;
	}
	@media all and (max-width: 500px) {
	.badge {
	margin-left: 0px;
	}
	}