Merge pull request #30 from sylouuu/feature/add-thumb-event

added thumbEvent property #29
sylouuu · Jun 28, 2016 · 11e6e6d · 11e6e6d
2 parents c82d4d0 + 78623dc
commit 11e6e6d
Show file tree

Hide file tree

Showing 19 changed files with 471 additions and 346 deletions.
diff --git a/.jscsrc b/.jscsrc
@@ -1,4 +1,11 @@
 {
+    "disallowQuotedKeysInObjects": true,
+    "requireCapitalizedConstructors": true,
+    "requireDotNotation": true,
+    "requireMatchingFunctionName": true,
+    "requireSemicolons": true,
+    "requireSpaceBetweenArguments": true,
+    "requireSpacesInForStatement": true,
     "requireCurlyBraces": [
         "if",
         "else",
@@ -8,6 +15,11 @@
         "try",
         "catch"
     ],
+    "requireSpaceBeforeKeywords": [
+        "else",
+        "while",
+        "catch"
+    ],
     "requireSpaceAfterKeywords": [
         "if",
         "else",
@@ -28,9 +40,11 @@
         "beforeAlternate": true
     },
     "requireSpacesInFunctionExpression": {
+        "beforeOpeningRoundBrace": true,
         "beforeOpeningCurlyBrace": true
     },
     "requireSpacesInAnonymousFunctionExpression": {
+        "beforeOpeningRoundBrace": true,
         "beforeOpeningCurlyBrace": true
     },
     "requireSpacesInNamedFunctionExpression": {
@@ -42,15 +56,18 @@
         "beforeOpeningCurlyBrace": true
     },
     "requireSpacesInFunction": {
+        "beforeOpeningRoundBrace": true,
         "beforeOpeningCurlyBrace": true
     },
     "requireMultipleVarDecl": true,
     "requireBlocksOnNewline": true,
     "disallowEmptyBlocks": true,
     "disallowSpacesInsideArrayBrackets": "all",
     "disallowSpacesInsideParentheses": true,
+    "disallowSpacesInsideParenthesizedExpression": true,
     "requireSpacesInsideObjectBrackets": "all",
     "disallowSpaceAfterObjectKeys": true,
+    "requireSpaceBeforeObjectValues": true,
     "requireCommaBeforeLineBreak": true,
     "requireOperatorBeforeLineBreak": [
         "?",
@@ -77,19 +94,18 @@
     "validateQuoteMarks": "'",
     "validateIndentation": 4,
     "disallowMixedSpacesAndTabs": true,
-    "disallowTrailingWhitespace": true,
     "disallowTrailingComma": true,
     "disallowKeywordsOnNewLine": ["else"],
     "requireLineFeedAtFileEnd": true,
     "maximumLineLength": {
-        "value": 200,
+        "value": 600,
         "allowComments": true,
         "allowUrlComments": true,
         "allowRegex": true
     },
     "requireCapitalizedConstructors": true,
     "safeContextKeyword": ["that", "self"],
     "disallowYodaConditions": true,
-    "requireSpaceAfterLineComment": true,
+    "requireSpaceAfterLineComment": false,
     "disallowNewlineBeforeBlockStatements": true
 }
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
     "name": "desoslide",
-    "version": "2.1.0",
+    "version": "2.2.0",
     "homepage": "https://github.com/sylouuu/desoslide",
     "description": "Take control of your slideshow with this powerful jQuery plugin",
     "keywords": [

diff --git a/desoslide.jquery.json b/desoslide.jquery.json
@@ -1,7 +1,7 @@
 {
     "name": "desoslide",
     "title": "desoSlide",
-    "version": "2.1.0",
+    "version": "2.2.0",
     "description": "Take control of your slideshow with this powerful jQuery plugin",
     "keywords": [
         "slider",

diff --git a/dist/css/jquery.desoslide.css b/dist/css/jquery.desoslide.css
@@ -1,6 +1,6 @@
 /**
  * desoslide - Take control of your slideshow with this powerful jQuery plugin
- * @version 2.1.0
+ * @version 2.2.0
  * @link https://github.com/sylouuu/desoslide
  * @license MIT
  */

diff --git a/dist/css/jquery.desoslide.min.css b/dist/css/jquery.desoslide.min.css
diff --git a/dist/js/jquery.desoslide.min.js b/dist/js/jquery.desoslide.min.js
diff --git a/doc/assets/js/app/demo.js b/doc/assets/js/app/demo.js
@@ -1,10 +1,10 @@
-$(function() {
+$(function () {
 
     // Demo
     // ----------------------------------------------------------------------------------------------------------
     // ----------------------------------------------------------------------------------------------------------
 
-    $('a.back-to-top').on('click', function(e) {
+    $('a.back-to-top').on('click', function (e) {
         e.preventDefault();
 
         $('html, body').stop().animate({
@@ -16,10 +16,10 @@ $(function() {
     // ----------------------------------------------------------------------------------------------------------
     // ----------------------------------------------------------------------------------------------------------
 
-    $('#toggle_thumbs').on('click', function(e) {
+    $('#toggle_thumbs').on('click', function (e) {
         e.preventDefault();
 
-        var $this = $(this),
+        var $this                 = $(this),
             $slideshow_1_thumbs_1 = $('#slideshow_1_thumbs_1'),
             $slideshow_1_thumbs_2 = $('#slideshow_1_thumbs_2');
 
@@ -41,8 +41,8 @@ $(function() {
     // Syntax highlighting
     // ----------------------------------------------------------------------------------------------------------
 
-    var syntaxHighlight = function() {
-        $('pre code').each(function(i, e) {
+    var syntaxHighlight = function () {
+        $('pre code').each(function (i, e) {
             hljs.highlightBlock(e);
         });
     };
@@ -106,22 +106,22 @@ $(function() {
     };
 
     // Change provider
-    var changeProvider = function(provider, effect) {
+    var changeProvider = function (provider, effect) {
         var tmp = '';
 
-        $.each(effects[provider], function(i, item) {
-            if(effect !== undefined && effect === item) {
-                tmp += '<option value="'+ item +'" selected="selected">'+ item +'</option>';
+        $.each(effects[provider], function (i, item) {
+            if (effect !== undefined && effect === item) {
+                tmp += '<option value="' + item + '" selected="selected">' + item + '</option>';
             } else {
-                tmp += '<option value="'+ item +'">'+ item +'</option>';
+                tmp += '<option value="' + item + '">' + item + '</option>';
             }
         });
 
         $effect_name.html(tmp);
     };
 
     // Set effect
-    var setEffect = function(provider, effect) {
+    var setEffect = function (provider, effect) {
         // Pausing
         $slideshow1.desoSlide('pause');
 
@@ -134,26 +134,26 @@ $(function() {
         var code = "$('#slideshow').desoSlide({\n";
         code += "    thumbs: $('ul.slideshow_thumbs li > a'),\n";
         code += "    effect: {\n";
-        code += "        provider: '"+ $effect_provider.val() +"',\n";
-        code += "        name: '"+ $effect_name.val() +"'\n";
+        code += "        provider: '" + $effect_provider.val() + "',\n";
+        code += "        name: '" + $effect_name.val() + "'\n";
         code += "    }\n";
         code += "});";
 
-        $('#html_code1').html('&lt;link rel="stylesheet" href="path/to/'+ $effect_provider.val() +'.min.css"&gt;');
+        $('#html_code1').html('&lt;link rel="stylesheet" href="path/to/' + $effect_provider.val() + '.min.css"&gt;');
         $('#js_code1').html(code);
 
         syntaxHighlight();
     };
 
     // On change effect provider
-    $effect_provider.on('change', function() {
+    $effect_provider.on('change', function () {
         changeProvider($(this).val());
 
         setEffect();
     });
 
     // On change effect name
-    $effect_name.on('change', function() {
+    $effect_name.on('change', function () {
         setEffect();
     });
 
@@ -207,7 +207,8 @@ $(function() {
 
     $('#slideshow2').desoSlide({
         thumbs: $('#slideshow2_thumbs li > a'),
-        first: 2
+        first: 2,
+        thumbEvent: 'mouseover'
     });
 
     // Demo 3

diff --git a/doc/assets/js/app/documentation.js b/doc/assets/js/app/documentation.js
@@ -1,14 +1,14 @@
-$(function() {
+$(function () {
 
-    $('a.back-to-top').on('click', function(e) {
+    $('a.back-to-top').on('click', function (e) {
         e.preventDefault();
 
         $('html, body').stop().animate({
             scrollTop: $('html, body').offset().top
         }, 1000);
     });
 
-    $('pre code').each(function(i, e) {
+    $('pre code').each(function (i, e) {
         hljs.highlightBlock(e);
     });
 

diff --git a/doc/assets/js/app/home.js b/doc/assets/js/app/home.js
@@ -1,14 +1,14 @@
-$(function() {
+$(function () {
 
-    $('a.back-to-top').on('click', function(e) {
+    $('a.back-to-top').on('click', function (e) {
         e.preventDefault();
 
         $('html, body').stop().animate({
             scrollTop: $('html, body').offset().top
         }, 1000);
     });
 
-    $('pre code').each(function(i, e) {
+    $('pre code').each(function (i, e) {
         hljs.highlightBlock(e);
     });
 

diff --git a/doc/assets/js/app/release-notes.js b/doc/assets/js/app/release-notes.js
@@ -1,14 +1,14 @@
-$(function() {
+$(function () {
 
-    $('a.back-to-top').on('click', function(e) {
+    $('a.back-to-top').on('click', function (e) {
         e.preventDefault();
 
         $('html, body').stop().animate({
             scrollTop: $('html, body').offset().top
         }, 1000);
     });
 
-    $('pre code').each(function(i, e) {
+    $('pre code').each(function (i, e) {
         hljs.highlightBlock(e);
     });
 

diff --git a/doc/demo.html b/doc/demo.html
@@ -260,7 +260,7 @@ <h3 class="page-header">
                 <div class="row">
                     <div class="col-lg-12 col-md-12">
                         <p>
-                            Show the third slide at loading.
+                            Show the third slide at loading, large image shown on mouse over, not click.
                         </p>
                     </div>
                 </div>
@@ -318,6 +318,7 @@ <h4>Result</h4>
                         <h4>Code</h4>
 <pre><code>$('#slideshow').desoSlide({
     thumbs: $('#slideshow_thumbs li > a'),
+    thumbEvent: 'mouseover',
     first: 2
 });</code></pre>
                     </article>
@@ -588,7 +589,7 @@ <h3 class="page-header">
                     </article>
 
                     <article class="col-lg-3 col-md-3 col-sm-3 text-right">
-                        <p>&copy; 2014 desoSlide</p>
+                        <p>&copy; 2014-2016 desoSlide</p>
                     </article>
                 </div>
             </div>
@@ -598,7 +599,7 @@ <h3 class="page-header">
         <script src="assets/js/vendor/bootstrap/bootstrap.min.js"></script>
         <script src="assets/js/vendor/highlight/highlight.pack.js"></script>
 
-        <script src="../src/js/jquery.desoslide.js"></script>
+        <script src="../dist/js/jquery.desoslide.min.js"></script>
         <script src="assets/js/app/demo.js"></script>
 
     </body>

diff --git a/doc/index.html b/doc/index.html
@@ -97,7 +97,7 @@ <h1>Documentation</h1>
                 <div class="row">
                     <article class="col-lg-12">
                         <p>
-                            Documentation covers: 2.1.0
+                            Documentation covers: 2.2.0
                         </p>
                     </article>
                 </div>
@@ -221,6 +221,7 @@ <h3 id="configuration" class="page-header">
 
 <pre><code>defaults = {
     thumbs:             null,             // An anchors (`&lt;a&gt;`) collection
+    thumbEvent:         'click',          // What event to capture on thumbnail ('click', 'mouseover')
     imageClass:         'img-responsive', // Image class(es)
     auto: {
         load:           true,             // Preloading images
@@ -240,19 +241,20 @@ <h3 id="configuration" class="page-header">
         keys:           false             // Able to control by using the keyboard shortcuts (left/space/right)
     },
     events: {
-        onThumbClick:   null,             // On thumb click
-        onImageShow:    null,             // On image show
-        onImageShown:   null,             // On image shown
-        onImageHide:    null,             // On image hide
-        onImageHidden:  null,             // On image hidden
-        onImageClick:   null,             // On image click
-        onPrev:         null,             // On previous
-        onPause:        null,             // On pause
-        onPlay:         null,             // On play
-        onNext:         null,             // On next
-        onError:        null,             // On error
-        onWarning:      null,             // On warning
-        onSuccess:      null              // On success
+        onThumbClick:       null,             // On thumb click if thumbEvent: 'click'
+        onThumbMouseOver:   null,             // On thumb mouseover if thumbEvent: 'mouseover'
+        onImageShow:        null,             // On image show
+        onImageShown:       null,             // On image shown
+        onImageHide:        null,             // On image hide
+        onImageHidden:      null,             // On image hidden
+        onImageClick:       null,             // On image click
+        onPrev:             null,             // On previous
+        onPause:            null,             // On pause
+        onPlay:             null,             // On play
+        onNext:             null,             // On next
+        onError:            null,             // On error
+        onWarning:          null,             // On warning
+        onSuccess:          null              // On success
     }
 }</code></pre>
 
@@ -508,6 +510,10 @@ <h3 id="events" class="page-header">
     // on thumbClick
 });
 
+$('#slideshow').on('thumbMouseOver.desoslide', function() {
+    // on thumbMouseOver
+});
+
 $('#slideshow').on('imageShow.desoslide', function() {
     // on imageShow
 });
@@ -565,6 +571,9 @@ <h3 id="events" class="page-header">
     'thumbClick.desoslide': function() {
         // on thumbClick
     },
+    'thumbMouseOver.desoslide': function() {
+        // on thumbMouseOver
+    },
     'imageShow.desoslide': function() {
         // on imageShow
     },
@@ -749,7 +758,7 @@ <h4>Jaoued</h4>
                     </article>
 
                     <article class="col-lg-3 col-md-3 col-sm-3 text-right">
-                        <p>&copy; 2014 desoSlide</p>
+                        <p>&copy; 2014-2016 desoSlide</p>
                     </article>
                 </div>
             </div>