Merge branch 'feature/enhance-readme-documentation' into develop

README.md

@@ -1,46 +1,63 @@
-# generator-tumblr-theme [![Build Status](https://secure.travis-ci.org/ffffranklin/generator-tumblr-theme.png?branch=master)](https://travis-ci.org/ffffranklin/generator-tumblr-theme)
+# Tumblr Theme generator [![Build Status](https://secure.travis-ci.org/ffffranklin/generator-tumblr-theme.png?branch=master)](https://travis-ci.org/ffffranklin/generator-tumblr-theme)
 
-A generator for [Yeoman](http://yeoman.io).
+A Tumblr Theme generator for [Yeoman](http://yeoman.io) that allows you to create a theme for Tumblr.
 
 
 ## Getting Started
 
-### What is Yeoman?
-
-Trick question. It's not a thing. It's this guy:
-
-![](http://i.imgur.com/JHaAlBJ.png)
-
-Basically, he wears a top hat, lives in your computer, and waits for you to tell him what kind of application you wish to create.
-
-Not every new computer comes with a Yeoman pre-installed. He lives in the [npm](https://npmjs.org) package repository. You only have to ask for him once, then he packs up and moves into your hard drive. *Make sure you clean up, he likes new and shiny things.*
+First install [Yeoman](http://yeoman.io) globally  
 
 ```
 $ npm install -g yo
 ```
 
-### Yeoman Generators
-
-Yeoman travels light. He didn't pack any generators when he moved in. You can think of a generator like a plug-in. You get to choose what type of application you wish to create, such as a Backbone application or even a Chrome extension.
-
 To install generator-tumblr-theme from npm, run:
 
 ```
 $ npm install -g generator-tumblr-theme
 ```
 
+Create a theme project folder
+
+```
+$ mkdir my-theme && cd my-theme
+```
+
 Finally, initiate the generator:
 
 ```
 $ yo tumblr-theme
 ```
 
-### Getting To Know Yeoman
+This will expand the themer scripts and assets into your theme project directory 
+
+## Custom Content
 
-Yeoman has a heart of gold. He's a person with feelings and opinions, but he's very easy to work with. If you think he's too opinionated, he can be easily convinced.
+By default generator-tumblr-theme uses http://tumblrthemr.tumblr.com as it's content source. In order to use your own blog as a source of test content, you need to convert an existing tumblr blog to XML.   
 
-If you'd like to get to know Yeoman better and meet some of his friends, [Grunt](http://gruntjs.com) and [Bower](http://bower.io), check out the complete [Getting Started Guide](https://github.com/yeoman/yeoman/wiki/Getting-Started).
+### Tumblr XML Template
+
+Copy and paste the content of this tumblr theme file to your blog's theme editor
+https://raw.githubusercontent.com/ffffranklin/tumblrthemr-xml-theme/master/xml.tumblr
+
+![](http://i.imgur.com/XvcUpvZ.png)
+
+When you visit your tumblr blog you should see an rendered XML
+
+![](http://i.imgur.com/AhmkkFx.png)
+
+Configure your tumbler themer to use your new source by entering in a content source when you initially run the generator. 
+
+![](http://i.imgur.com/2loXTep.png)
+
+You can always update the config file, post generation, here: 
+
+```
+$ cat app/themr/javascripts/tumblr-themr-1.0.config.js
+var themrConf = { url: 'myblog.tumblr.com', theme: 'theme' };
+```
 
+Now your Tumblr Theme will render in your themer app
 
 ## License
 

app/index.js

@@ -1,10 +1,13 @@
+
 'use strict';
+
 var util = require('util');
 var path = require('path');
 var yeoman = require('yeoman-generator');
 
 
 var TumblrGenerator = module.exports = function TumblrGenerator(args, options, config) {
+
     yeoman.generators.Base.apply(this, arguments);
 
     this.on('end', function () {
@@ -17,12 +20,25 @@ var TumblrGenerator = module.exports = function TumblrGenerator(args, options, c
 util.inherits(TumblrGenerator, yeoman.generators.Base);
 
 TumblrGenerator.prototype.askFor = function askFor() {
+
     var cb = this.async();
 
     // have Yeoman greet the user.
     console.log(this.yeoman);
 
-    var prompts = [/*{
+    var prompts = [{
+        type: 'confirm',
+        name: 'customContent',
+        message: 'Would you like to use custom content? [No]',
+        default: false
+    },{
+        // todo: should test url to make sure it's properly configured
+        when: function (answers) {
+            return answers && answers.customContent;
+        },
+        name: 'contentURL',
+        message: 'What is the URL of the content source for this theme? http://'
+    }/*,{
         name: 'themeName',
         message: 'What is your tumblr name?'
     },{
@@ -32,18 +48,19 @@ TumblrGenerator.prototype.askFor = function askFor() {
     }*/];
 
     this.prompt(prompts, function (props) {
-        this.themeID = this.normalizeName(props.themeName);
-        this.themeName = props.themeName;
+        //this.themeID = this.sanitizeName(props.themeName);
+        //this.themeName = props.themeName;
+        this.contentURL= props.contentURL;
         cb();
     }.bind(this));
 
 };
 
 /**
- * TODO: add find and replace
+ * TODO: add find and replace to sanitize
  */
-TumblrGenerator.prototype.normalizeName = function normalizeName(name) {
-    return name;
+TumblrGenerator.prototype.sanitizeName = function sanitizeName(name) {
+    return this._.slugify(name);
 };
 
 TumblrGenerator.prototype.app = function app() {
@@ -53,11 +70,24 @@ TumblrGenerator.prototype.app = function app() {
     this.mkdir('app/theme');
     this.mkdir('app/theme/styles');
     this.mkdir('app/theme/scripts');
-
     this.copy('_package.json', 'package.json');
     this.copy('_bower.json', 'bower.json');
 };
 
+TumblrGenerator.prototype.createConfig= function createConfig() {
+
+    var url = 'tumblrthemr.tumblr.com';
+    var userURL = this.contentURL;
+
+    if (typeof userURL === 'string') {
+        url = userURL;
+    }
+
+    this.write(
+        'app/themr/javascripts/tumblr-themr-1.0.config.js',
+        'var themrConf = { url: \'' + url  + '\', theme: \'theme\' };'
+    );
+};
 TumblrGenerator.prototype.gruntfile = function gruntfile() {
     this.template('Gruntfile.js');
 };
@@ -70,7 +100,6 @@ TumblrGenerator.prototype.createThemr = function createthemr() {
     this.copy('index.html', 'app/index.html');
     this.copy('spinner.gif', 'app/themr/images/spinner.gif');
     this.copy('tumblr-themr-1.0.js', 'app/themr/javascripts/tumblr-themr-1.0.js');
-    this.copy('tumblr-themr-1.0.config.js', 'app/themr/javascripts/tumblr-themr-1.0.config.js');
     this.copy('jquery-1.6.4.min.js', 'app/themr/javascripts/jquery-1.6.4.min.js');
     this.copy('sammy.js', 'app/themr/javascripts/sammy.js');
     this.copy('sammy.handlebars.js', 'app/themr/javascripts/sammy.handlebars.js');

app/templates/index.html

@@ -217,12 +217,14 @@
     <script src="themr/javascripts/tumblr-themr-1.0.js"></script>
     <script>
         (function ($, conf) {
-            $('#tumblrthemr-config [name=url]').val(conf.url);
-            $('#tumblrthemr-config [name=theme]').val(conf.theme);
-            // check if url is set
-            if (!window.location.hash.match(/url\/.*tumblr\.com$/)) {
-                //$('#tumblrthemr-config [type=submit]').trigger('submit');
-            }
+            $(function () {
+                $('#tumblrthemr-config [name=url]').val(conf.url);
+                $('#tumblrthemr-config [name=theme]').val(conf.theme);
+                // check if a tumblr url is set
+                if (!window.location.hash.match(/url\/.*tumblr\.com$/)) {
+                    $('#tumblrthemr-config').submit();
+                }
+            })
         })(jQuery, themrConf)
     </script>
   </body>