/ Gists / jQuery-plugins

Gists - jQuery-plugins

On gists

Vymazání formulářových prvků / Reset form fields

jQuery jQuery-plugins

reset.js #

function formFieldCleaner(formObject) {
    $(":input", formObject).not(":button, :submit, :reset, :hidden").val("").removeAttr("checked").removeAttr("selected");
}

formFieldCleaner("#odesilaciFormular");

On gists

Obalit každý prvek / Wrap element with other

jQuery jQuery-plugins

wrap.js #

(function($){ $.fn.wrapMatch = function(count, className) { var length = this.length; for(var i = 0; i '); } return this; }; })(jQuery);
$('.list-parent li').wrapMatch(5,'newclass');

On gists

Twitter plugin by JW

JavaScript jQuery jQuery-plugins

twitter.js #

// Utility
if ( typeof Object.create !== 'function' ) {
	Object.create = function( obj ) {
		function F() {};
		F.prototype = obj;
		return new F();
	};
}

(function( $, window, document, undefined ) {
	var Twitter = {
		init: function( options, elem ) {
			var self = this;

			self.elem = elem;
			self.$elem = $( elem );

			self.url = 'https://api.twitter.com/1.1/search/tweets.json';

			self.search = ( typeof options === 'string' )
				? options
				: options.search;

			self.options = $.extend( {}, $.fn.queryTwitter.options, options );

			self.refresh( 1 );
		},

		refresh: function( length ) {
			var self = this;

			setTimeout(function() {
				self.fetch().done(function( results ) {
					results = self.limit( results.results, self.options.limit );

					self.buildFrag( results );

					self.display();

					if ( typeof self.options.onComplete === 'function' ) {
						self.options.onComplete.apply( self.elem, arguments );
					}

					if ( self.options.refresh ) {
						self.refresh();
					}
				});
			}, length || self.options.refresh );
		},

		fetch: function() {
			return $.ajax({
				url: this.url,
				data: { q: this.search },
				dataType: 'jsonp'
			});
		},

		buildFrag: function( results ) {
			var self = this;

			self.tweets = $.map( results, function( obj, i) {
				return $( self.options.wrapEachWith ).append ( obj.text )[0];
			});
		},

		display: function() {
			var self = this;

			if ( self.options.transition === 'none' || !self.options.transition ) {
				self.$elem.html( self.tweets ); // that's available??
			} else {
				self.$elem[ self.options.transition ]( 500, function() {
					$(this).html( self.tweets )[ self.options.transition ]( 500 );
				});
			}
		},

		limit: function( obj, count ) {
			return obj.slice( 0, count );
		}
	};

	$.fn.queryTwitter = function( options ) {
		return this.each(function() {
			var twitter = Object.create( Twitter );
			
			twitter.init( options, this );

			$.data( this, 'queryTwitter', twitter );
		});
	};

	$.fn.queryTwitter.options = {
		search: '@tutspremium',
		wrapEachWith: '<li></li>',
		limit: 10,
		refresh: null,
		onComplete: null,
		transition: 'fadeToggle'
	};

})( jQuery, window, document );

On gists

jQuery form select helpers

jQuery Helpers-Filters-Plugins jQuery-plugins

jQuery form select helpers.js #

jQuery.fn.containsOption = function (query) {
  var found = false;
 
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      for (var i = 0; i < this.options.length; i++) {
        if (query.value) {
          found = (query.value.constructor == RegExp) ? this.options[i].value.match(query.value) : this.options[i].value == query.value;
        } else if (query.text) {
          found = (query.text.constructor == RegExp) ? this.options[i].text.match(query.text) : this.options[i].text == query.text;
        }
        if (found) break;
      }
    } else {
      return this;
    }
  });
 
  return found;
};
 
jQuery.fn.addOption = function (o) {
  var opt = o;
 
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      var option = document.createElement('OPTION');
      option.value = opt.value;
      option.text = opt.text;
 
      if (opt.selected) option.selected = opt.selected;
 
      this.options[this.options.length] = option;
    } else return this;
  });
 
  return this;
};
 
jQuery.fn.clearOptions = function () {
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      this.options.length = 0;
    }
  });
};
 
jQuery.fn.removeOptionByValue = function (val) {
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      for (var i = 0; i < this.options.length; i++) {
        if (this.options[i].value == val) {
          this.options[i] = null;
        }
      }
    } else {
      return this;
    }
  });
  return this;
};
 
jQuery.fn.removeOptionByText = function (txt) {
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      for (var i = 0; i < this.options.length; i++) {
        if (this.options[i].text == txt) {
          this.options[i] = null;
        }
      }
    } else {
      return this;
    }
  });
  return this;
};
 
jQuery.fn.selectOptionByValue = function (val) {
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      for (var i = 0; i < this.options.length; i++) {
        if (this.options[i].value == val) {
          this.options[i].selected = true;
        } else {
          this.options[i].selected = false;
        }
      }
    } else return this;
  });
  return this;
};
 
jQuery.fn.selectOptionByText = function (txt) {
  this.each(function () {
    if (this.nodeName.toLowerCase() == 'select') {
      for (var i = 0; i < this.options.length; i++) {
        if (this.options[i].text == txt) {
          this.options[i].selected = true;
        } else {
          this.options[i].selected = false;
        }
      }
    } else return this;
  });
  return this;
};
 
// USAGE
$('select#languages').containsOption({
  text: 'Text'
});
 
$('select#languages').containsOption({
  value: '19'
});
 
$('select#languages').selectOptionByValue('19');
$('select#languages').selectOptionByText('Apache');
 
$('select#languages').addOption({
  'text': 'rubyonrails',
  'value': '100'
});
 
$('select#languages').removeOptionByValue('19');
$('select#languages').removeOptionByText('Apache');
 
$('select#languages').clearOptions(); // deletes all options

On gists

Jquery slice - gt, lt like functions

jQuery jQuery-plugins

jquery-gt-lt-slice.js #

$("li").slice(0,4); // :lt(4)
$("li").slice(5); // :gt(4)

$.fn.lt = function(n) {return this.slice(0,n);};
$.fn.gt = function(n) {return this.slice(n+1);};

On gists

Custom events - jquery

JavaScript jQuery jQuery-plugins

2.html #

  <dl>
    <dt>Question</dt>
    <dd>Answer</dd>
  </dl>

On gists

Wrap image with caption

jQuery Helpers-Filters-Plugins jQuery-plugins

image-with-caption.js #

	$(".img-left, .img-right, .article-detail img", this).each(function() 
	{
	    var image = $(this);
	    var imageCaption = image.attr("alt");
	    if (imageCaption != '') 
	    {
	    	image.wrap('<div class="image-w-caption">');
	    	image.parent('.image-w-caption')
	    	     .css('max-width', image.width())
	    	     .addClass(image.attr('class'))
	    	     .append('<div class="caption">'+imageCaption+'</div>');
	    }
	});

On gists

jQuery - keyup with delay (timeout)

jQuery Helpers-Filters-Plugins jQuery-plugins

keyup-delay1.js #

var delay = (function(){
  var timer = 0;
  return function(callback, ms){
    clearTimeout (timer);
    timer = setTimeout(callback, ms);
  };
})();


$('input').keyup(function() {
    delay(function(){
      alert('Time elapsed!');
    }, 1000 );
});

On gists

Very simple autosave functionality using local storage

JavaScript Helpers-Filters-Plugins jQuery-plugins

test.html #

<html>
    <body>    
        <textarea rows=24 cols=80></textarea>
        <script type="text/javascript" src="autosave.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                AutoSave.start();
            })

            $(window).unload(function(){
                AutoSave.stop();
            });
        </script>
    </body>
</html>

On gists

MathUtils

jQuery Helpers-Filters-Plugins jQuery-plugins

mathutils.jquery.js #

(function($) {
  $.mathUtils = {
    sum: function(array) {
      var total = 0;

      $.each(array, function(index, value) {
        total += $.mathUtils.parseCzechFloat(value);
      });
      return total;
    },
    parseCzechFloat: function(string) {
      var value = $.trim(string);
      return parseFloat(value.replace(' ', '').replace(',', '.')) || 0;
    },
    formatCzechFloat: function(number) {
      return String(number).replace('.', ',');
    },
    average: function(array) {
      if ($.isArray(array)) {
        return $.mathUtils.sum(array) / array.length;
      }
      return '';
    }
  };
})(jQuery);