Add code API and readme content

rstaib · rstaib · commit de31f8ad75f0 · 2013-05-11T23:29:02.000+02:00
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -37,9 +37,10 @@ module.exports = function (grunt)
                         src: [
                             'README.md',
                             /*'changelog.txt',*/
-                            'demo/** /*.*',
+                            'docs/**/*.*',
+                            'demo/**/*.*',
                             'lib/*.*',
-                            'test/** /*.*'
+                            'test/**/*.*'
                         ]
                     },
                     {
@@ -104,6 +105,18 @@ module.exports = function (grunt)
                     ]
                 }
             }
+        },
+        yuidoc: {
+            compile: {
+                name: '<%= pkg.name %>',
+                description: '<%= pkg.description %>',
+                version: '<%= pkg.version %>',
+                url: '<%= pkg.homepage %>',
+                options: {
+                    paths: '.',
+                    outdir: 'docs/'
+                }
+            }
         }
     });
 
@@ -114,6 +127,6 @@ module.exports = function (grunt)
     grunt.loadNpmTasks('grunt-contrib-yuidoc');
     grunt.loadNpmTasks('grunt-contrib-compress');
 
-    grunt.registerTask('default', ['jshint'/*, 'qunit'*/]);
-    grunt.registerTask('release', ['default', 'concat'/*, 'yuidoc'*/, 'uglify', 'compress']);
+    grunt.registerTask('default', ['jshint'/*, 'qunit'*/, 'yuidoc']);
+    grunt.registerTask('release', ['default', 'concat', 'uglify', 'compress']);
 };
diff --git a/README.md b/README.md
@@ -1,6 +1,66 @@
-jquery-steps
+jQuery Steps Plugin [![Build Status](https://secure.travis-ci.org/rstaib/jquery-steps.png)](http://travis-ci.org/rstaib/jquery-steps)
 ============
 
 A powerful jQuery wizard plugin that supports accessibility and HTML5.
 
-[![Build Status](https://secure.travis-ci.org/rstaib/jquery-steps.png)](http://travis-ci.org/rstaib/jquery-steps)
+## Getting Started
+
+jQuery Steps is a lightweight wizard UI component written for jQuery.
+
+Everything you need to start is:
+
+1. Include *jQuery* and *jQuery Steps* in your HTML code.
+2. Then select an element represents the wizard and call the `steps` method.
+
+```html
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Demo</title>
+        <meta charset="utf-8">
+        <script src="jquery.js"></script> 
+        <script src="jquery.steps.js"></script>
+    </head>
+    <body>
+        <script>
+            $("#wizard").steps();
+        </script>
+        <div id="wizard"></div>
+    </body>
+</html>
+```
+
+### How to add initial steps?
+
+There are two ways to add steps and their corresponding content.
+
+1. Add HTML code into the representing wizard element.
+
+```html
+<div id="wizard">
+    <h1>First Step</h1>
+    <div>First Content</div>
+
+    <h1>Second Step</h1>
+    <div>Second Content</div>
+</div>
+```
+
+2. Or use the API to add steps dynamically.
+
+```javascript
+    <script>
+        // Initialize wizard
+        var wizard = $("#wizard").steps();
+
+        // Add step
+        wizard.steps("add", {
+            title: "HTML code", 
+            content: "<strong>HTML code</strong>"
+        });
+    </script>
+```
+
+## License
+
+Copyright (c) 2013 Rafael J. Staib Licensed under the [MIT license](https://github.com/rstaib/jquery-steps/blob/master/LICENSE.txt).
diff --git a/jquery.steps.js b/jquery.steps.js
