Mainly documentation and some code cleanup, working though!

README.md

@@ -1,10 +1,10 @@
 # Scaffolds
 
-Scaffolds allows you to quickly create Sections from a file. Section definitions can be exported and then imported into other Symphony installations using a lightweight JSON format. Definitions can be saved and reused on other Symphony projects to save you time recreating those common sections.
+Scaffolds allows you to quickly create Sections from a file. Section definitions can be exported and then imported into other Symphony installations using JSON. Definitions can be saved and reused on other Symphony projects to save you time recreating those common sections.
 
 - Version: 0.1
 - Date: unreleased
-- Requirements: Symphony 2.2 or newer, <http://github.com/symphonycms/symphony-2/>
+- Requirements: Symphony 2.2 or newer, <http://github.com/symphonycms/symphony-2/>, a Browser that supports the [FileReader API](https://developer.mozilla.org/en/DOM/FileReader)
 - Author: Brendan Abbott, brendan@bloodbone.ws
 - GitHub Repository: <http://github.com/brendo/scaffolds>
 
@@ -16,6 +16,12 @@ Scaffolds allows you to quickly create Sections from a file. Section definitions
 
 For further information, please refer to the [wiki](https://github.com/brendo/scaffolds/wiki).
 
+## Notes
+
+* This extension makes use of the [FileReader API](https://developer.mozilla.org/en/DOM/FileReader) to parse the files without actually uploading them a destination. At the time of release, this is only supported by Firefox and Chrome.
+* The only valid file that can be parsed at the moment is JSON, with the file extension of `.json`.
+* Checkbox values accept 'yes' and 'no' for 'checked' or 'unchecked', just like Symphony.
+
 ## Credits
 
-Thanks to @czheng for the initial idea, at least for the name, some many moons ago.
+Thanks to **@czheng** for the initial idea, at least for the name, some many moons ago.

assets/scaffolds.sections.js

@@ -6,35 +6,70 @@
 
 		// Add a dummy upload field so we can use the FileReader API
 		$scaffolds.append($('<input type="file" id="file" />'));
-		var $file = $('#file').bind('change', function(event) {
-			var files = this.files,
-				FR = new FileReader(),
-				valid = /json$/i,
-				file = undefined;
-
-			FR.onload = function(event) {
-				try {
-					def = $.parseJSON(event.target.result);
-					Scaffolds.import(def);
-				}
-				catch(e) {
-					alert('Invalid JSON');
-				}
-			}
+		var $file = $('#file').bind('change', function() {
+			// If no file was uploaded, abort.
+			if(this.files.length !== 1) return;
 
-			if(files.length == 0) return;
+			Scaffolds.parseFiles(this.files);
+		});
 
-			for(var i = 0; i < files.length; i++) {
-				if(valid.test(files[i].fileName)) {
-					FR.readAsText(files[i]);
-				}
+		// Add event handlers for the Import/Export button in the Section Editor
+		$scaffolds.find('ul').delegate('a', 'click', function(event) {
+			var $self = $(this);
+
+			if($self.data('action') == 'import') {
+				$file.trigger('click');
+			}
+			else if($self.data('action') == 'export') {
+				Scaffolds.export();
 			}
+
+			event.preventDefault();
 		});
 
+		// When the 'dropdown' arrow is clicked, toggle the 'dropdown' to close
+		// (or open)
+		$scaffolds.delegate('ul + a', 'click', function(event) {
+			Scaffolds.toggle();
+			event.preventDefault();
+		});
+
+		// Base extension object that does the (majority) of the logic
 		var Scaffolds = {
-			import: function(def) {
-				console.log('Importing...', def);
+			// The only accepted file at the moment is one with a .json extension
+			acceptedFiles: /json$/i,
+
+			// Given a FileList object, this will make sure the uploaded
+			// file is one Scaffolds cares about (or rather can use) and if
+			// so will call Scaffolds.import
+			parseFiles: function(files) {
+				var FR = new FileReader();
+
+				// Listen for the onload event of the FileReader API
+				// Tries to parse the file as JSON, if it's malformed, just
+				// return (for now)
+				// @todo Alert the user that the file isn't valid JSON
+				FR.onload = function(event) {
+					try {
+						def = $.parseJSON(event.target.result);
+						Scaffolds.import(def);
+					}
+					catch(e) {
+						return;
+					}
+				}
 
+				// If the file isn't one of our valid types, abort.
+				// @todo Look at how else we can do this (mimetype?)
+				if(Scaffolds.acceptedFiles.test(files[0].fileName)) {
+					// Load the file as text, we'll convert to JSON in onload.
+					FR.readAsText(files[0]);
+				}
+			},
+
+			// Called with a JSON object as a parameter, this will trigger the
+			// Section Editor duplicator
+			import: function(def) {
 				// Loop over the definition and trigger the duplicators
 				$.each(def, function(label, definition) {
 					$controls.find('option[data-type = ' + definition.type + ']').attr('selected', 'selected');
@@ -54,10 +89,15 @@
 
 				Scaffolds.toggle();
 			},
+
+			// Not implemented.. yet
 			export: function() {
 				console.log('Exporting...');
 				Scaffolds.toggle();
 			},
+
+			// Given the field context and a key/value pair, this will set the
+			// approtiate values in the Field's settings.
 			set: function(field, key, value) {
 				var field = field.find(':input[name*=' + key + ']');
 
@@ -82,26 +122,13 @@
 					field.val(value);
 				}
 			},
+
+			// Add/Removes the toggle class. Can be done with :target selector,
+			// but we don't want the 'snap to element' effect, so no bingo.
 			toggle: function() {
 				$scaffolds.find('ul').toggleClass('target');
 			}
 		};
-
-		$scaffolds.find('ul').delegate('a', 'click', function() {
-			var $self = $(this);
-
-			if($self.data('action') == 'import') {
-				$file.trigger('click');
-			}
-			else if($self.data('action') == 'export') {
-				Scaffolds.export();
-			}
-		});
-
-		$scaffolds.delegate('ul + a', 'click', function(event) {
-			Scaffolds.toggle();
-			event.preventDefault();
-		});
 	});
 
 })(jQuery.noConflict());