Try Dart 1 hour experience first draft

src/site/articles/trydart/code/piratebadge.dart

Index: src/site/articles/trydart/code/piratebadge.dart
diff --git a/src/site/articles/trydart/code/piratebadge.dart b/src/site/articles/trydart/code/piratebadge.dart
new file mode 100644
index 0000000000000000000000000000000000000000..09ea437f4801f0b482eacf2d0d1a887de63f3cf8
--- /dev/null
+++ b/src/site/articles/trydart/code/piratebadge.dart
@@ -0,0 +1,112 @@
+// 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.
+
+
+// Demonstrates:

[sethladd, 2013/10/22 20:19:06]

love the comments in here. Let's link to a doc from here so they can learn more
about these things.

[mem, 2013/10/22 21:39:43]

I can link to the doc once it has a home. Also, it might be worth a separate
readme or walk-through or concepts.

On 2013/10/22 20:19:06, sethladd wrote:

+// list, maps, random, strings, string interpolation, cascade, fat arrow,
+// named constructors.
+// optional parameters.
+// a class
+// getters,
+// httprequest, JSON
+// local storage
+// class-level methods/fields
+// top-level variable and functions
+// typecasting with 'as'
+// futures
+
+import 'dart:html';
+import 'dart:async';
+import 'dart:math';
+import 'dart:convert';
+
+final String TREASUREKEY = 'pirateName';
+
+void  main() {
+  query('#inputName').onInput.listen(updateBadge);
+  query('#generateButton').onClick.listen(generateBadge);
+  query('#badgeName').onChange.listen(storePirateName);

[sethladd, 2013/10/22 20:19:06]

my mistake, this doesn't work. Can we try a setter that changes the text and
stores in storage?

[mem, 2013/10/22 21:39:43]

Done.

+  
+  PirateName.initialize().then((e) {
+    (query('#generateButton') as ButtonElement).disabled = false;

[sethladd, 2013/10/22 20:19:06]

de-dupe these queries and create variables above

[mem, 2013/10/22 21:39:43]

Done.

+    (query('#inputName') as InputElement).disabled = false;

[sethladd, 2013/10/22 20:19:06]

can the HTML start as disabled?

[mem, 2013/10/22 21:39:43]

they *DO* start as disabled.
this is enabling them....

On 2013/10/22 20:19:06, sethladd wrote:

+    String storedName = window.localStorage[TREASUREKEY];
+    if (storedName != null) {
+      query('#badgeName').text = new PirateName.fromJSON(window.localStorage[TREASUREKEY]).pirateName;

[sethladd, 2013/10/22 20:19:06]

create a getter for new PirateName.fromJSON(window.localStorage[TRE
     ASUREKEY]).pirateName

[mem, 2013/10/22 21:39:43]

Done.

+    }
+  }).catchError((error) {
+    print ('Error reading JSON file: $error');

[sethladd, 2013/10/22 20:29:15]

the error is more generic than "reading JSON"

[mem, 2013/10/22 21:39:43]

Done.

+    query('#badgeName').text = 'Arrr! No names.';

[sethladd, 2013/10/22 20:29:15]

pull query out from here

[mem, 2013/10/22 21:39:43]

Done.

+  } );
+}
+
+void updateBadge(Event e) {
+  String inputName = (e.target as InputElement).value;
+  ButtonElement genButton = query('#generateButton');
+  
+  query('#badgeName').text = new PirateName(firstName: inputName).pirateName;

[sethladd, 2013/10/22 20:29:15]

if you use query like this through the code, you can use top-level variables.

[mem, 2013/10/22 21:39:43]

Done.

+  if (inputName == '') {

[sethladd, 2013/10/22 20:29:15]

inputName.trim().isEmpty

[mem, 2013/10/22 21:39:43]

Done.

+    genButton..disabled = false
+             ..text = 'Generate badge';
+  } else {
+    genButton..disabled = true
+             ..text = 'Arrr! Remove the text!';
+  }
+}
+
+//NOTE: this is not getting called. no change event is getting fired
+void storePirateName(Event e) {
+  window.localStorage[TREASUREKEY] = JSON.encode((e.target as SpanElement).text);
+}
+ 
+void generateBadge(Event e) {
+  query('#badgeName').text = new PirateName().pirateName;
+}
+
+class PirateName {
+  
+  static final Random indexGen = new Random();
+  
+  String _firstName;
+  String _appellation;
+  
+  String get pirateName => '$_firstName the $_appellation';
+         
+  String toString() => pirateName;
+
+  PirateName({String firstName}) {

[sethladd, 2013/10/22 20:29:15]

why not appellation ?

[mem, 2013/10/22 21:39:43]

Done.

+    if (firstName == null) {
+      _firstName = names[indexGen.nextInt(names.length)];
+    } else {
+      _firstName = firstName;
+    }
+    _appellation = appellations[indexGen.nextInt(appellations.length)];
+  }
+  
+  PirateName.fromJSON(String jsonString){

[sethladd, 2013/10/22 20:29:15]

space before {

[mem, 2013/10/22 21:39:43]

Done.

+    String storedName = JSON.decode(jsonString);
+    List splitName = storedName.split(' ');

[sethladd, 2013/10/22 20:29:15]

why not store the first name and appellation as separate fields? that why you
don't have to parse a string. which is kind of yucky

[mem, 2013/10/22 21:39:43]

Done.

[mem, 2013/10/22 21:39:43]

Done.

[mem, 2013/10/22 21:39:43]

Done.

+    _firstName = splitName[0];
+    _appellation = splitName[2];
+  }
+
+  static List<String> names = [];

[sethladd, 2013/10/22 20:29:15]

I think these should go up where the other statics are

[mem, 2013/10/22 21:39:43]

Done.

+  static List<String> appellations = [];
+
+  static Future initialize() {

[sethladd, 2013/10/22 20:29:15]

initialize is really generic. is there a more descriptive name?

[mem, 2013/10/22 21:39:43]

Done.

+    return makeRequest();
+  }
+  
+  static Future makeRequest(/*Event e*/) {

[sethladd, 2013/10/22 20:29:15]

how about moving the contents from this method up to initialize? all initialize
does is call this method

[mem, 2013/10/22 21:39:43]

Done.

+    var path = 'piratenames.json';
+    return HttpRequest.getString(path)
+        .then(parsePirateNamesFromJSON);
+  }
+
+  static parsePirateNamesFromJSON(String jsonString) {

[sethladd, 2013/10/22 20:29:15]

make this a private method

[mem, 2013/10/22 21:39:43]

Done.

+    Map pirateNames = JSON.decode(jsonString);
+    names = pirateNames['names'];
+    appellations = pirateNames['appellations'];
+  }
+}