fuelux-rails 2.3.2 → 2.4.0.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: c8bcb339d8ad14260944a114b90ac7921c5a41a4
-  data.tar.gz: 51f37b8629f599000b51dbb4e4f3e4eb7c422e4d
+  metadata.gz: 704eff1baaf48f735aca4db6b9f0c0e58d017a94
+  data.tar.gz: 7a4116a51a646f2c89884360ec67a0a492f36907
 SHA512:
-  metadata.gz: 54f3f97b780d0a675ec888bbde50917ed8814bfa0dae03a87027f9919dcc3a5e8d0a4d350caf718e5d51d1b447f86d3da8264712c49b85f80e3cdeee9be4e52a
-  data.tar.gz: a932520f888340d8c99872962663ee8b15c85c76d0d4226b31aba8d397c1bf78e31ff99c33f26e8334423f8ef1a770a07eb35afcf09641f197713fa296861c1d
+  metadata.gz: 61b4ee030e388045c2e4001728e1e2830e919fc9e88f34605194b2d263474a0085d4e5ea51459ba8349111d0b8f83daa8e10de2876bf3466b9426da1c11848e8
+  data.tar.gz: ab771d6f5646c904c570ea119701bf6f73dac1b583c3f017d2b7c62dc984c51c50cdf135316acf159033b40c294d2d85022b7d009303a14488fb20db3e5798e7

data/Rakefile

@@ -1,6 +1,7 @@
 #!/usr/bin/env rake
+
 begin
-  require 'bundler/setup'
+  #require 'bundler/setup'
 rescue LoadError
   puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
 end
@@ -23,7 +24,10 @@ end
 
 
 
-Bundler::GemHelper.install_tasks
+Bundler::GemHelper.install_tasks if defined? Bundler::GemHelper
+
+load 'lib/tasks/fuelux-rails_tasks.rake'
+
 
 require 'rake/testtask'
 
@@ -34,5 +38,4 @@ Rake::TestTask.new(:test) do |t|
   t.verbose = false
 end
 
-
 task :default => :test

data/lib/fuelux-rails/version.rb

@@ -1,3 +1,3 @@
 module FueluxRails
-  VERSION = "2.3.2"
+  VERSION = "2.4.0.rc1"
 end

data/lib/generators/fuelux/install_generator.rb

@@ -13,7 +13,7 @@ module Fuelux
         else
           puts <<-EOM
           Warning:
-            app/assets/stylesheets/bootstrap_override.css.less does not exist
+            app/assets/stylesheets/bootstrap_overrides.css.less does not exist
             Run "rails generate bootstrap:install" and then rerun "rails generate fuelux:install"
           EOM
         end
@@ -21,7 +21,7 @@ module Fuelux
         if File.exist?('app/assets/javascripts/application.js')
           # Add our own require:
           content = File.read("app/assets/javascripts/application.js")
-          if content.match(/require_tree\s+\.\s*$/)
+          if content.match(/require\s+fuelux\.js\s*$/)
             # Good enough - that'll include our Fuel UX js
           else
             insert_into_file "app/assets/javascripts/application.js", "//= require fuelux.js\n", :after => "jquery_ujs\n"

data/lib/tasks/fuelux-rails_tasks.rake

@@ -1,4 +1,100 @@
 # desc "Explaining what the task does"
-# task :fuelux-rails do
-#   # Task goes here
-# end
+namespace :fuelux_rails do
+
+	desc "Update files"
+	task :update do
+		require 'open-uri'
+		tag = (ENV['TAG'] || 'master')
+		bump_version = (ENV['BUMP_VERSION'] || false)
+		bump_version = false if tag.eql? 'master'
+		update_all tag
+		update_version tag if bump_version
+		puts "Updated assets to #{tag}"
+	end
+
+	SCRIPTS_REPO = "https://raw.github.com/ExactTarget/fuelux/%s/src/%s.js"
+	SCRIPTS_PATH = "./vendor/assets/javascripts/fuelux/%s.js"
+
+	SCRIPTS = %w( util checkbox combobox datagrid intelligent-dropdown pillbox 
+								radio search select spinner tree wizard).freeze
+
+	STYLESHEETS_REPO = "https://raw.github.com/ExactTarget/fuelux/%s/src/less/%s.less"
+	STYLESHEETS_PATH = "./vendor/toolkit/fuelux/%s.less"
+	EXTRA_VARIABLES = "// Tree\n// --------------------------------------------------\n@treeBackgroundHover: #DFEEF5;\n@treeBackgroundSelect: #B9DFF1;\n"
+
+	def update_javascript(file, tag = 'master')
+		repo = SCRIPTS_REPO % [tag, file]
+		path = SCRIPTS_PATH % file
+		begin
+			original_file = open(repo)
+		rescue OpenURI::HTTPError
+			return ''
+		end
+		open(path, 'wb') do |file|
+			file << original_file.read
+		end
+
+		lines = IO.readlines(path).map do |line|
+			case
+			when line =~ /define\(/
+				'!function ($) {'
+			when line =~ /require\(/
+				''
+			when line =~ /^\}\);/
+				'}(window.jQuery);'
+			else
+				line
+			end
+		end
+
+		File.open(path, 'w') {|file| file.puts lines }
+		"//= require fuelux/#{file}\n"
+	end
+
+	def update_all_javascripts(tag = 'master')
+		requires = SCRIPTS.map do |script|
+			update_javascript script, tag
+		end
+		open('./vendor/assets/javascripts/fuelux.js', 'wb') do |file|
+			requires.each {|r| file << r }
+		end
+	end
+
+	def update_stylesheet(file, tag = 'master')
+		repo = STYLESHEETS_REPO % [tag, file]
+		path = STYLESHEETS_PATH % file
+		begin
+			original_file = open(repo)
+		rescue OpenURI::HTTPError
+			return ''
+		end
+		open(path, 'wb') do |file|
+			file << original_file.read
+		end
+		lines = IO.readlines(path)
+		File.open(path, 'w') {|file| file.puts lines }
+		%(@import "fuelux/#{file}.less";\n)
+	end
+
+	def update_all_stylesheets(tag = 'master')
+		
+		requires = SCRIPTS.map do |script|
+			update_stylesheet script, tag
+		end.unshift EXTRA_VARIABLES
+		
+		open('./vendor/toolkit/fuelux.less', 'wb') do |file|
+			requires.each {|r| file << r }
+		end
+	end
+
+	def update_all(tag = 'master')
+		update_all_stylesheets
+		update_all_javascripts
+	end
+
+	def update_version(tag)
+		open('./lib/fuelux-rails/version.rb', 'wb') do |file|
+			file << "module FueluxRails\n  VERSION = \"#{tag}\"\nend"
+		end
+	end
+end

data/vendor/assets/javascripts/fuelux.js

@@ -1,12 +1,12 @@
 //= require fuelux/util
+//= require fuelux/checkbox
 //= require fuelux/combobox
 //= require fuelux/datagrid
+//= require fuelux/intelligent-dropdown
 //= require fuelux/pillbox
-//= require fuelux/search
-//= require fuelux/spinner
-//= require fuelux/checkbox
 //= require fuelux/radio
+//= require fuelux/search
 //= require fuelux/select
+//= require fuelux/spinner
 //= require fuelux/tree
-//= require fuelux/search
 //= require fuelux/wizard

data/vendor/assets/javascripts/fuelux/checkbox.js

@@ -7,7 +7,10 @@
  */
 
 !function ($) {
-  
+
+
+
+
 	// CHECKBOX CONSTRUCTOR AND PROTOTYPE
 
 	var Checkbox = function (element, options) {
@@ -32,11 +35,13 @@
 		constructor: Checkbox,
 
 		setState: function ($chk) {
+			$chk = $chk || this.$chk;
+
 			var checked = $chk.is(':checked');
-			var disabled = $chk.is(':disabled');
+			var disabled = !!$chk.prop('disabled');
 
 			// reset classes
-			this.$icon.removeClass('checked').removeClass('disabled');
+			this.$icon.removeClass('checked disabled');
 
 			// set state of checkbox
 			if (checked === true) {
@@ -64,6 +69,20 @@
 		itemchecked: function (e) {
 			var chk = $(e.target);
 			this.setState(chk);
+		},
+		
+		check: function () {
+            this.$chk.prop('checked', true);
+            this.setState(this.$chk);
+		},
+		
+		uncheck: function () {
+            this.$chk.prop('checked', false);
+            this.setState(this.$chk);
+		},
+		
+		isChecked: function () {
+            return this.$chk.is(':checked');
 		}
 	};
 

data/vendor/assets/javascripts/fuelux/combobox.js

@@ -8,6 +8,9 @@
 
 !function ($) {
 
+
+
+
 	// COMBOBOX CONSTRUCTOR AND PROTOTYPE
 
 	var Combobox = function (element, options) {
@@ -47,7 +50,7 @@
 		},
 
 		selectByValue: function (value) {
-			var selector = 'li[data-value=' + value + ']';
+			var selector = 'li[data-value="' + value + '"]';
 			this.selectBySelector(selector);
 		},
 
@@ -165,7 +168,7 @@
 			});
 		});
 
-		$('body').on('mousedown.combobox.data-api', '.combobox', function (e) {
+		$('body').on('mousedown.combobox.data-api', '.combobox', function () {
 			var $this = $(this);
 			if ($this.data('combobox')) return;
 			$this.combobox($this.data());

data/vendor/assets/javascripts/fuelux/datagrid.js

@@ -8,6 +8,12 @@
 
 !function ($) {
 
+
+
+	// Relates to thead .sorted styles in datagrid.less
+	var SORTED_HEADER_OFFSET = 22;
+
+
 	// DATAGRID CONSTRUCTOR AND PROTOTYPE
 
 	var Datagrid = function (element, options) {
@@ -17,7 +23,7 @@
 		this.$footer = this.$element.find('tfoot th');
 		this.$footerchildren = this.$footer.children().show().css('visibility', 'hidden');
 		this.$topheader = this.$element.find('thead th');
-		this.$searchcontrol = this.$element.find('.search');
+		this.$searchcontrol = this.$element.find('.datagrid-search');
 		this.$filtercontrol = this.$element.find('.filter');
 		this.$pagesize = this.$element.find('.grid-pagesize');
 		this.$pageinput = this.$element.find('.grid-pager input');
@@ -34,12 +40,23 @@
 
 		this.options = $.extend(true, {}, $.fn.datagrid.defaults, options);
 
-		if(this.$pagesize.hasClass('select')) {
+		// Shim until v3 -- account for FuelUX select or native select for page size:
+		if (this.$pagesize.hasClass('select')) {
+			this.$pagesize.select('selectByValue', this.options.dataOptions.pageSize);
 			this.options.dataOptions.pageSize = parseInt(this.$pagesize.select('selectedItem').value, 10);
 		} else {
+			var pageSize = this.options.dataOptions.pageSize;
+			this.$pagesize.find('option').filter(function() {
+				return $(this).text() === pageSize.toString();
+			}).attr('selected', true);
 			this.options.dataOptions.pageSize = parseInt(this.$pagesize.val(), 10);
 		}
 
+		// Shim until v3 -- account for older search class:
+		if (this.$searchcontrol.length <= 0) {
+			this.$searchcontrol = this.$element.find('.search');
+		}
+
 		this.columns = this.options.dataSource.columns();
 
 		this.$nextpagebtn.on('click', $.proxy(this.next, this));
@@ -48,7 +65,7 @@
 		this.$filtercontrol.on('changed', $.proxy(this.filterChanged, this));
 		this.$colheader.on('click', 'th', $.proxy(this.headerClicked, this));
 
-		if(this.$pagesize.hasClass('select')) {
+		if (this.$pagesize.hasClass('select')) {
 			this.$pagesize.on('changed', $.proxy(this.pagesizeChanged, this));
 		} else {
 			this.$pagesize.on('change', $.proxy(this.pagesizeChanged, this));
@@ -85,10 +102,18 @@
 		},
 
 		updateColumns: function ($target, direction) {
+			this._updateColumns(this.$colheader, $target, direction);
+
+			if (this.$sizingHeader) {
+				this._updateColumns(this.$sizingHeader, this.$sizingHeader.find('th').eq($target.index()), direction);
+			}
+		},
+
+		_updateColumns: function ($header, $target, direction) {
 			var className = (direction === 'asc') ? 'icon-chevron-up' : 'icon-chevron-down';
-			this.$colheader.find('i').remove();
-			this.$colheader.find('th').removeClass('sorted');
-			$('<i>').addClass(className).appendTo($target);
+			$header.find('i.datagrid-sort').remove();
+			$header.find('th').removeClass('sorted');
+			$('<i>').addClass(className + ' datagrid-sort').appendTo($target);
 			$target.addClass('sorted');
 		},
 
@@ -141,12 +166,16 @@
 				$.each(data.data, function (index, row) {
 					rowHTML += '<tr>';
 					$.each(self.columns, function (index, column) {
-						rowHTML += '<td>' + row[column.property] + '</td>';
+						rowHTML += '<td';
+						if (column.cssClass) {
+							rowHTML += ' class="' + column.cssClass + '"';
+						}
+						rowHTML += '>' + row[column.property] + '</td>';
 					});
 					rowHTML += '</tr>';
 				});
 
-				if (!rowHTML) rowHTML = self.placeholderRowHTML('0 ' + self.options.itemsText);
+				if (!rowHTML) rowHTML = self.placeholderRowHTML(self.options.noDataFoundHTML);
 
 				self.$tbody.html(rowHTML);
 				self.stretchHeight();
@@ -182,7 +211,7 @@
 		},
 
 		pagesizeChanged: function (e, pageSize) {
-			if(pageSize) {
+			if (pageSize) {
 				this.options.dataOptions.pageSize = parseInt(pageSize.value, 10);
 			} else {
 				this.options.dataOptions.pageSize = parseInt($(e.target).val(), 10);
@@ -193,7 +222,13 @@
 		},
 
 		pageChanged: function (e) {
-			this.options.dataOptions.pageIndex = parseInt($(e.target).val(), 10) - 1;
+			var pageRequested = parseInt($(e.target).val(), 10);
+			pageRequested = (isNaN(pageRequested)) ? 1 : pageRequested;
+			var maxPages = this.$pageslabel.text();
+
+			this.options.dataOptions.pageIndex =
+				(pageRequested > maxPages) ? maxPages - 1 : pageRequested - 1;
+
 			this.renderData();
 		},
 
@@ -205,15 +240,20 @@
 
 		filterChanged: function (e, filter) {
 			this.options.dataOptions.filter = filter;
+			this.options.dataOptions.pageIndex = 0;
 			this.renderData();
 		},
 
 		previous: function () {
+			this.$nextpagebtn.attr('disabled', 'disabled');
+			this.$prevpagebtn.attr('disabled', 'disabled');
 			this.options.dataOptions.pageIndex--;
 			this.renderData();
 		},
 
 		next: function () {
+			this.$nextpagebtn.attr('disabled', 'disabled');
+			this.$prevpagebtn.attr('disabled', 'disabled');
 			this.options.dataOptions.pageIndex++;
 			this.renderData();
 		},
@@ -265,7 +305,15 @@
 
 			function matchSizingCellWidth(i, el) {
 				if (i === columnCount - 1) return;
-				$(el).width($sizingCells.eq(i).width());
+
+				var $el = $(el);
+				var $sourceCell = $sizingCells.eq(i);
+				var width = $sourceCell.width();
+
+				// TD needs extra width to match sorted column header
+				if ($sourceCell.hasClass('sorted') && $el.prop('tagName') === 'TD') width = width + SORTED_HEADER_OFFSET;
+
+				$el.width(width);
 			}
 
 			this.$colheader.find('th').each(matchSizingCellWidth);
@@ -293,7 +341,8 @@
 		dataOptions: { pageIndex: 0, pageSize: 10 },
 		loadingHTML: '<div class="progress progress-striped active" style="width:50%;margin:auto;"><div class="bar" style="width:100%;"></div></div>',
 		itemsText: 'items',
-		itemText: 'item'
+		itemText: 'item',
+        noDataFoundHTML: '0 items'
 	};
 
 	$.fn.datagrid.Constructor = Datagrid;

data/vendor/assets/javascripts/fuelux/intelligent-dropdown.js

@@ -0,0 +1,132 @@
+/*
+ * Fuel UX Intelligent Bootstrap Dropdowns
+ * https://github.com/ExactTarget/fuelux
+ *
+ * Copyright (c) 2013 ExactTarget
+ * Licensed under the MIT license.
+ */
+
+!function ($) {
+
+	$(function() {
+		$(document.body).on("click", "[data-toggle=dropdown][data-direction]", function( event ) {
+
+			var dataDirection = $(this).data().direction;
+
+			// if data-direction is not auto or up, default to bootstraps dropdown
+			if( dataDirection === "auto" || dataDirection === "up" ) {
+				// only changing css positioning if position is set to static
+				// if this doesn"t happen, dropUp will not be correct
+				// works correctly for absolute, relative, and fixed positioning
+				if( $(this).parent().css("position") === "static" ) {
+					$(this).parent().css({ position: "relative"});
+				}
+
+				// only continue into this function if the click came from a user
+				if( event.hasOwnProperty("originalEvent") ) {
+					// stopping bootstrap event propagation
+					event.stopPropagation();
+
+					// deciding what to do based on data-direction attribute
+					if( dataDirection === "auto" ) {
+						// have the drop down intelligently decide where to place itself
+						forceAutoDropDown( $(this) );
+					} else if ( dataDirection === "up" ) {
+						forceDropUp( $(this) );
+					}
+				}
+			}
+
+		});
+
+		function forceDropUp( element ) {
+			var dropDown      = element.next();
+			var dropUpPadding = 5;
+			var topPosition;
+
+			$(dropDown).addClass("dropUp");
+			topPosition = ( ( dropDown.outerHeight() + dropUpPadding ) * -1 ) + "px";
+
+			dropDown.css({
+				visibility: "visible",
+				top: topPosition
+			});
+			element.click();
+		}
+
+		function forceAutoDropDown( element ) {
+			var dropDown      = element.next();
+			var dropUpPadding = 5;
+			var topPosition;
+
+			// setting this so I can get height of dropDown without it being shown
+			dropDown.css({ visibility: "hidden" });
+
+			// deciding where to put menu
+			if( dropUpCheck( dropDown ) ) {
+				$(dropDown).addClass("dropUp");
+				topPosition = ( ( dropDown.outerHeight() + dropUpPadding ) * -1 ) + "px";
+			} else {
+				$(dropDown).removeClass("dropUp");
+				topPosition = "auto";
+			}
+
+			dropDown.css({
+				visibility: "visible",
+				top: topPosition
+			});
+			element.click();
+		}
+
+		function dropUpCheck( element ) {
+			// caching container
+			var $container = getContainer( element );
+
+			// building object with measurementsances for later use
+			var measurements                = {};
+			measurements.parentHeight       = element.parent().outerHeight();
+			measurements.parentOffsetTop    = element.parent().offset().top;
+			measurements.dropdownHeight     = element.outerHeight();
+			measurements.containerHeight    = $container.overflowElement.outerHeight();
+
+			// this needs to be different if the window is the container or another element is
+			measurements.containerOffsetTop = ( !! $container.isWindow ) ? $container.overflowElement.scrollTop() : $container.overflowElement.offset().top;
+
+			// doing the calculations
+			measurements.fromTop    = measurements.parentOffsetTop - measurements.containerOffsetTop;
+			measurements.fromBottom = measurements.containerHeight - measurements.parentHeight - ( measurements.parentOffsetTop - measurements.containerOffsetTop );
+
+			// actual determination of where to put menu
+			// false = drop down
+			// true = drop up
+			if( measurements.dropdownHeight < measurements.fromBottom ) {
+				return false;
+			} else if ( measurements.dropdownHeight < measurements.fromTop ) {
+				return true;
+			} else if ( measurements.dropdownHeight >= measurements.fromTop && measurements.dropdownHeight >= measurements.fromBottom ) {
+				// decide which one is bigger and put it there
+				if( measurements.fromTop >= measurements.fromBottom ) {
+					return true;
+				} else {
+					return false;
+				}
+			}
+		}
+
+		function getContainer( element ) {
+			var containerElement = window;
+			var isWindow         = true;
+			$.each( element.parents(), function(index, value) {
+				if( $(value).css('overflow') !== 'visible' ) {
+					containerElement = value;
+					isWindow         = false;
+					return false;
+				}
+			});
+			return {
+				overflowElement: $( containerElement ),
+				isWindow: isWindow
+			};
+		}
+	});
+}(window.jQuery);