Adds SimpleScrollable widget.

diff --git a/grunt.js b/grunt.js
index 57f76a4..a92b187 100644 (file)
--- a/grunt.js
+++ b/grunt.js
@@ -128,7 +128,8 @@ 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-scrollable.js',
+          'src/javascripts/cowhide-simple-scrollable.js'
         ], dest: 'dist/cowhide.js'
       },
       cowhide_ng_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/src/themes/default/default.less b/src/themes/default/default.less
index b3852e1..d7cefbc 100644 (file)
--- a/src/themes/default/default.less
+++ b/src/themes/default/default.less
@@ -2,3 +2,4 @@
 @import "common.less";
 @import "seat-selector.less";
 @import "header.less";
+@import "simple-scrollable.less";

diff --git a/src/themes/default/simple-scrollable.less b/src/themes/default/simple-scrollable.less
new file mode 100644 (file)
index 0000000..2599ca1
--- /dev/null
+++ b/src/themes/default/simple-scrollable.less
@@ -0,0 +1,30 @@
+.ch-simple-scrollable {
+    height: 100%;
+    overflow-y: hidden;
+
+    .ch-simple-scrollable-content {
+        padding-top: 40px;
+        padding-bottom: 40px;
+        height: 100%;
+        overflow-y: hidden;
+    }
+
+    .ch-simple-scrollable-up,
+    .ch-simple-scrollable-dn {
+        width: 100%;
+        height: 28px;
+        text-align: center;
+        background-color: #ddd;
+        padding-top: 12px;
+    }
+
+    .ch-simple-scrollable-up {
+        border-bottom: 1px solid #aaa;
+        position: absolute;
+        top: 0;
+    }
+
+    .ch-simple-scrollable-dn {
+        border-top: 1px solid #fafafa;
+    }
+}