Merge pull request #36 from alexsilva/master

Add option to set specific HTML element to be created for hours, minutes and seconds.

Author: caike

.gitignore

@@ -1,2 +1,3 @@
 node_modules
 *.swp
+.idea

examples/index.html

@@ -78,7 +78,24 @@ <h3>Examples</h3>
     <div class="timer-pause" data-minutes-left="1.5"></div>
   </p>
 </li>
+
+<li>
+    <p><strong>timer structured elements span</strong></p>
+    <p><pre><code>
+// HTML
+&lt;span class="timer-span" data-minutes-left="5"&gt;&lt;/span&gt;
+
+// JavaScript
+$('.timer-span').startTimer({
+    elementContainer: "span"
+});
+    </code></pre>
+    <span class="timer-span" data-seconds-left="5"></span>
+</li>
 </ul>
+<br/>
+<br/>
+<br/>
 <style>
 .jst-hours {
   float: left;
@@ -103,6 +120,10 @@ <h3>Examples</h3>
 
     $('.timer-quick').startTimer();
 
+    $('.timer-span').startTimer({
+        elementContainer: "span"
+    });
+
     $('.timer').startTimer({
       onComplete: function(){
         console.log('Complete');

jquery.simple.timer.js

@@ -53,6 +53,10 @@
   // pass this object as argument multiple times.
   function mergeOptions(timer, opts) {
     opts = opts || {};
+
+    // Element that will be created for hours, minutes, and seconds.
+    timer._options.elementContainer = opts.elementContainer || 'div';
+
     var classNames = opts.classNames || {};
 
     timer._options.classNameSeconds       = classNames.seconds  || 'jst-seconds'
@@ -66,24 +70,24 @@
 
     var that = this;
 
-    var createSubDivs = function(timerBoxElement){
-      var seconds = document.createElement('div');
+    var createSubElements = function(timerBoxElement){
+      var seconds = document.createElement(that._options.elementContainer);
       seconds.className = that._options.classNameSeconds;
 
-      var minutes = document.createElement('div');
+      var minutes = document.createElement(that._options.elementContainer);
       minutes.className = that._options.classNameMinutes;
 
-      var hours = document.createElement('div');
+      var hours = document.createElement(that._options.elementContainer);
       hours.className = that._options.classNameHours;
 
-      var clearDiv = document.createElement('div');
-      clearDiv.className = that._options.classNameClearDiv;
+      var clearElement = document.createElement(that._options.elementContainer);
+      clearElement.className = that._options.classNameClearDiv;
 
       return timerBoxElement.
         append(hours).
         append(minutes).
         append(seconds).
-        append(clearDiv);
+        append(clearElement);
     };
 
     this.targetElement.each(function(_index, timerBox) {
@@ -119,7 +123,7 @@
         that.startCountdown(timerBoxElement, { secondsLeft: timerBoxElement.data('timeLeft') });
       });
 
-      createSubDivs(timerBoxElement);
+      createSubElements(timerBoxElement);
       return this.startCountdown(timerBoxElement, options);
     }.bind(this));
   };