src/javascripts/cowhide-simple-scrollable.js

   1 /* vi: set et sw=4 ts=4 si: */
   2 (function($, undefined) {
   3     'use strict';
   4
   5     var ChSimpleScrollable = function(element, options) {
   6         $.fn.ch_widget.Constructor(element, options);
   7         this.$element = $(element);
   8         this.options = $.extend(
   9             options,
  10             $.fn.ch_widget.defaults,
  11             {
  12             });
  13     };
  14
  15     ChSimpleScrollable.prototype = $.extend(
  16         {},
  17         $.fn.ch_widget.Constructor.prototype,
  18         {
  19             constructor: ChSimpleScrollable,
  20
  21             enable: function() {
  22                 var self = this,
  23                     $this = self.$element,
  24                     $up = $('<div/>').addClass('ch-simple-scrollable-up'),
  25                     $dn = $('<div/>').addClass('ch-simple-scrollable-dn'),
  26                     $child =  $this.find('ul, ol, div, p'),
  27                     scrollAmount;
  28
  29                 $child.addClass('ch-simple-scrollable-content');
  30                 $child.height($child.parent().height() - 160);
  31                 scrollAmount = $child.height() - 40;
  32
  33
  34                 $up.css({top: $child.offset().top});
  35
  36                 $up.html('<a href="#"><i class="icon-chevron-up"></i></a>');
  37                 $dn.html('<a href="#"><i class="icon-chevron-down"></i></a>');
  38
  39                 $dn.click(function() {
  40                     $child.animate({
  41                         scrollTop: $child.scrollTop() + scrollAmount
  42                     }, 200);
  43                 });
  44
  45                 $up.click(function() {
  46                     $child.animate({
  47                         scrollTop: $child.scrollTop() - scrollAmount
  48                     }, 200);
  49                 });
  50
  51
  52                 $up.insertBefore($child);
  53                 $dn.insertAfter($child);
  54             }
  55         }
  56     );
  57
  58     $.fn.ch_simple_scrollable = function(option) {
  59         return this.each(function() {
  60             var $this = $(this),
  61                 data = $this.data('ch_simple_scrollable'),
  62                 options = typeof option == 'object' && option;
  63
  64             if (!data) {
  65                 $this.data('ch_simple_scrollable', (data = new ChSimpleScrollable(this, options)));
  66                 data.register();
  67             }
  68
  69             if(typeof option == 'string')
  70                 data[option]();
  71         });
  72     };
  73
  74     $.fn.ch_simple_scrollable.Constructor = ChSimpleScrollable;
  75
  76     /* CHSIMPLESCROLLABLE DATA-API
  77      * ================= */
  78     $(function() {
  79         $('div.ch-simple-scrollable').ch_simple_scrollable('enable');
  80     })
  81 })(window.jQuery);