projects / profile / ivi / cowhide.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 16d13a4)
Add simple-scrollable back.
authorSalvatore Iovene <salvatore@iovene.com>
Mon, 29 Apr 2013 07:57:16 +0000 (10:57 +0300)
committerSalvatore Iovene <salvatore@iovene.com>
Mon, 29 Apr 2013 07:57:16 +0000 (10:57 +0300)
grunt.js patch | blob | history
src/javascripts/cowhide-simple-scrollable.js [new file with mode: 0644] patch | blob
tests/index.html patch | blob | history
tests/unit/cowhide-simple-scrollable.js [new file with mode: 0644] patch | blob

diff --git a/grunt.js b/grunt.js
index 27aa92f..fe8175b 100644 (file)
--- a/grunt.js
+++ b/grunt.js
@@ -122,7 +122,6 @@ module.exports = function(grunt) {
           'src/javascripts/cowhide-select.js',
           'src/javascripts/cowhide-page.js',
           'src/javascripts/cowhide-header.js',
-          'src/javascripts/cowhide-scrollable.js',
           'src/javascripts/cowhide-simple-scrollable.js'
         ], dest: 'dist/cowhide.js'
       },
diff --git a/src/javascripts/cowhide-simple-scrollable.js b/src/javascripts/cowhide-simple-scrollable.js
new file mode 100644 (file)
index 0000000..fe02a6d
--- /dev/null
+++ b/src/javascripts/cowhide-simple-scrollable.js
@@ -0,0 +1,81 @@
+/* vi: set et sw=4 ts=4 si: */
+(function($, undefined) {
+    'use strict';
+
+    var ChSimpleScrollable = function(element, options) {
+        $.fn.ch_widget.Constructor(element, options);
+        this.$element = $(element);
+        this.options = $.extend(
+            options,
+            $.fn.ch_widget.defaults,
+            {
+            });
+    };
+
+    ChSimpleScrollable.prototype = $.extend(
+        {},
+        $.fn.ch_widget.Constructor.prototype,
+        {
+            constructor: ChSimpleScrollable,
+
+            enable: function() {
+                var self = this,
+                    $this = self.$element,
+                    $up = $('<div/>').addClass('ch-simple-scrollable-up'),
+                    $dn = $('<div/>').addClass('ch-simple-scrollable-dn'),
+                    $child =  $this.find('ul, ol, div, p'),
+                    scrollAmount;
+
+                $child.addClass('ch-simple-scrollable-content');
+                $child.height($child.parent().height() - 160);
+                scrollAmount = $child.height() - 40;
+
+
+                $up.css({top: $child.offset().top});
+
+                $up.html('<a href="#"><i class="icon-chevron-up"></i></a>');
+                $dn.html('<a href="#"><i class="icon-chevron-down"></i></a>');
+
+                $dn.click(function() {
+                    $child.animate({
+                        scrollTop: $child.scrollTop() + scrollAmount
+                    }, 200);
+                });
+
+                $up.click(function() {
+                    $child.animate({
+                        scrollTop: $child.scrollTop() - scrollAmount
+                    }, 200);
+                });
+
+
+                $up.insertBefore($child);
+                $dn.insertAfter($child);
+            }
+        }
+    );
+
+    $.fn.ch_simple_scrollable = function(option) {
+        return this.each(function() {
+            var $this = $(this),
+                data = $this.data('ch_simple_scrollable'),
+                options = typeof option == 'object' && option;
+
+            if (!data) {
+                $this.data('ch_simple_scrollable', (data = new ChSimpleScrollable(this, options)));
+                data.register();
+            }
+
+            if(typeof option == 'string')
+                data[option]();
+        });
+    };
+
+    $.fn.ch_simple_scrollable.Constructor = ChSimpleScrollable;
+
+    /* CHSIMPLESCROLLABLE DATA-API
+     * ================= */
+    $(function() {
+        $('div.ch-simple-scrollable').ch_simple_scrollable('enable');
+    })
+})(window.jQuery);
diff --git a/tests/index.html b/tests/index.html
index 276baca..4be06fe 100644 (file)
--- a/tests/index.html
+++ b/tests/index.html
@@ -40,6 +40,7 @@
   <script src="../src/javascripts/cowhide-page.js"></script>
   <script src="../src/javascripts/cowhide-radio-input.js"></script>
   <script src="../src/javascripts/cowhide-select.js"></script>
+  <script src="../src/javascripts/cowhide-simple-scrollable.js"></script>
 
   <!-- unit tests -->
 
@@ -50,6 +51,7 @@
   <script src="unit/cowhide-page.js"></script>
   <script src="unit/cowhide-radio-input.js"></script>
   <script src="unit/cowhide-select.js"></script>
+  <script src="unit/cowhide-simple-scrollable.js"></script>
 </head>
 <body>
   <div>
diff --git a/tests/unit/cowhide-simple-scrollable.js b/tests/unit/cowhide-simple-scrollable.js
new file mode 100644 (file)
index 0000000..8acdbe4
--- /dev/null
+++ b/tests/unit/cowhide-simple-scrollable.js
@@ -0,0 +1,14 @@
+$(function () {
+
+    module("cowhide-simple-scrollable")
+
+      test("widget has been made scrollable", function () {
+        var page = $('<div class="page"></div>')
+        var scrollable = $('<div class="ch-simple-scrollable"><p>Test</p></div>')
+
+        scrollable.appendTo(page)
+        scrollable.ch_simple_scrollable('enable')
+
+        ok(scrollable.find('.ch-simple-scrollable-content').length > 0, "element has ch-simple-scrollable-content child")
+      })
+})
Domain: Web Framework / Uncategorized;