Add accordion widget

Author: Gaurav0

app/router.js

@@ -6,6 +6,7 @@ var Router = Ember.Router.extend({
 });
 
 Router.map(function() {
+    this.route('accordion');
     this.route('autocomplete');
     this.route('button');
     this.route('datepicker');

app/styles/app.css

@@ -37,3 +37,7 @@ nav li:first-of-type {
     width: 50%;
     display: inline-block;
 }
+
+.ui-accordion {
+    width: 50%;
+}

app/templates/accordion.hbs

@@ -0,0 +1,70 @@
+<h2>Accordion</h2>
+
+{{#jqui-accordion}}
+    <h3>Section 1</h3>
+    <div>
+        <p>
+            Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
+            ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
+            amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
+            odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
+        </p>
+    </div>
+    <h3>Section 2</h3>
+    <div>
+        <p>
+            Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
+            purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
+            velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
+            suscipit faucibus urna.
+        </p>
+    </div>
+    <h3>Section 3</h3>
+    <div>
+        <p>
+            Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
+            Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
+            ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
+            lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
+        </p>
+        <ul>
+            <li>List item one</li>
+            <li>List item two</li>
+            <li>List item three</li>
+        </ul>
+    </div>
+    <h3>Section 4</h3>
+    <div>
+        <p>
+            Cras dictum. Pellentesque habitant morbi tristique senectus et netus
+            et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
+            faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
+            mauris vel est.
+        </p>
+        <p>
+            Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
+            Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
+            inceptos himenaeos.
+        </p>
+    </div>
+{{/jqui-accordion}}
+
+<p>To use the accordion widget as above, just add the following template to your application:</p>
+
+<p><code><pre>
+\{{#jqui-accordion}}
+&lt;h3&gt;Section 1&lt;/h3&gt;
+&lt;div&gt;
+    &lt;p&gt;
+        Mauris mauris ante, ...
+    &lt;/p&gt;
+&lt;/div&gt;
+&lt;h3&gt;Section 2&lt;/h3&gt;
+&lt;div&gt;
+    &lt;p&gt;
+        Sed non urna. ...
+    &lt;/p&gt;
+&lt;/div&gt;
+...
+\{{/jqui-accordion}}
+</pre></code></p>

app/templates/application.hbs

@@ -1,4 +1,5 @@
 <nav>
+    <li>{{#link-to "accordion"}}Accordion{{/link-to}}</li>
     <li>{{#link-to "autocomplete"}}Autocomplete{{/link-to}}</li>
     <li>{{#link-to "button"}}Button{{/link-to}}</li>
     <li>{{#link-to "datepicker"}}Datepicker{{/link-to}}</li>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ember-cli-jquery-ui-example",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "private": true,
   "directories": {
     "doc": "doc",