muck-contents 0.2.25 → 0.2.26

data/README.rdoc

@@ -227,6 +227,16 @@ NOTE: you must define icon, thumb, small, medium and large as styles.  They can
   
   end
 
+== Tips
+If friendly_id starts producing errors like this then you need to redo your slugs:
+  ActiveRecord::StatementInvalid (Mysql::Error: Duplicate entry 'my-content-page-/-2' for key 2: UPDATE `slugs` SET `scope` = '/', `sequence` = 2 WHERE `id` = 189):
+
+Run this and you should be good to go:
+  rake friendly_id:redo_slugs MODEL=Content
+
+Cleanup old slugs with:
+  rake friendly_id:remove_old_slugs MODEL=Content
+ 
 == Testing
 This gem uses a full rails application in the test directory for testing and development.  By default there isn't a global_config.yml setup.  
 Use global_config.sample.yml to set one up.

data/VERSION

@@ -1 +1 @@
-0.2.25
+0.2.26

data/app/controllers/muck/contents_controller.rb

@@ -106,6 +106,7 @@ class Muck::ContentsController < ApplicationController
   #
   def edit
     @page_title = @content.locale_title(I18n.locale)
+    @content.setup_uri_path # be sure to recover uri_path or scope will get messed up when the content is saved.
     respond_to do |format|
       format.html { render :template => @edit_template || 'contents/edit'}
       format.pjs { render :template => @edit_template || 'contents/edit', :layout => 'popup'}
@@ -214,7 +215,7 @@ class Muck::ContentsController < ApplicationController
     # Pass the numeric id to this method to ensure that the operations update and delete occur on the correct object
     def get_secure_content
       @content = Content.find(params[:id])
-      unless @content.can_edit?(current_user)
+      if !@content.can_edit?(current_user)
         respond_to do |format|
           format.html do
             flash[:notice] = I18n.t('muck.contents.cant_delete_content')

data/lib/active_record/acts/muck_content.rb

@@ -141,6 +141,12 @@ module ActiveRecord
           File.join(self.scope, self.to_param)
         end
         
+        # uri_path is used to calculate scope on save and therefore must be recovered
+        # before a save is executed. Use this method to set it from the uri method.
+        def setup_uri_path
+          self.uri_path = self.class.scope_from_uri(self.uri)
+        end
+        
         # get scope from the slug
         def scope
           self.slug.scope

data/muck-contents.gemspec

@@ -5,11 +5,11 @@
 
 Gem::Specification.new do |s|
   s.name = %q{muck-contents}
-  s.version = "0.2.25"
+  s.version = "0.2.26"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
   s.authors = ["Justin Ball", "Joel Duffin"]
-  s.date = %q{2010-05-27}
+  s.date = %q{2010-07-14}
   s.email = %q{justin@tatemae.com}
   s.extra_rdoc_files = [
     "README.rdoc"
@@ -1626,6 +1626,8 @@ Gem::Specification.new do |s|
      "test/rails_root/public/images/file_icons/text.gif",
      "test/rails_root/public/images/file_icons/text.png",
      "test/rails_root/public/images/file_icons/word.gif",
+     "test/rails_root/public/images/icon_no.gif",
+     "test/rails_root/public/images/icon_success.gif",
      "test/rails_root/public/images/icons/accept.png",
      "test/rails_root/public/images/icons/add.png",
      "test/rails_root/public/images/icons/blue_guy.png",
@@ -2011,6 +2013,7 @@ Gem::Specification.new do |s|
      "test/rails_root/public/javascripts/effects.js",
      "test/rails_root/public/javascripts/fancyzoom.min.js",
      "test/rails_root/public/javascripts/jquery/colorpicker.js",
+     "test/rails_root/public/javascripts/jquery/fg.menu.js",
      "test/rails_root/public/javascripts/jquery/jquery-ui.js",
      "test/rails_root/public/javascripts/jquery/jquery.autocomplete.js.readme",
      "test/rails_root/public/javascripts/jquery/jquery.autocomplete.min.js",
@@ -2033,6 +2036,7 @@ Gem::Specification.new do |s|
      "test/rails_root/public/javascripts/muck-users.js",
      "test/rails_root/public/javascripts/muck.js",
      "test/rails_root/public/javascripts/muck_activities.js",
+     "test/rails_root/public/javascripts/muck_admin.js",
      "test/rails_root/public/javascripts/muck_time/en.js",
      "test/rails_root/public/javascripts/prototype.js",
      "test/rails_root/public/javascripts/scriptaculous.js",
@@ -3429,6 +3433,21 @@ Gem::Specification.new do |s|
      "test/rails_root/public/stylesheets/blueprint/src/print.css",
      "test/rails_root/public/stylesheets/blueprint/src/reset.css",
      "test/rails_root/public/stylesheets/blueprint/src/typography.css",
+     "test/rails_root/public/stylesheets/fgmenu/fg.menu.css",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_flat_0_aaaaaa_40x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_flat_0_eeeeee_40x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_flat_55_ffffff_40x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_flat_75_ffffff_40x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_glass_65_ffffff_1x400.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_highlight-soft_100_f6f6f6_1x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_highlight-soft_25_0073ea_1x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-bg_highlight-soft_50_dddddd_1x100.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-icons_0073ea_256x240.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-icons_454545_256x240.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-icons_666666_256x240.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-icons_ff0084_256x240.png",
+     "test/rails_root/public/stylesheets/flick/images/ui-icons_ffffff_256x240.png",
+     "test/rails_root/public/stylesheets/flick/jquery-ui-1.8.1.custom.css",
      "test/rails_root/public/stylesheets/jquery/cupertino/images/ui-bg_diagonals-small_0_aaaaaa_40x40.png",
      "test/rails_root/public/stylesheets/jquery/cupertino/images/ui-bg_diagonals-thick_15_444444_40x40.png",
      "test/rails_root/public/stylesheets/jquery/cupertino/images/ui-bg_glass_100_f0f0f0_1x400.png",

data/test/rails_root/public/javascripts/jquery/fg.menu.js

@@ -0,0 +1,517 @@
+/*-------------------------------------------------------------------- 
+Scripts for creating and manipulating custom menus based on standard <ul> markup
+Version: 3.0, 03.31.2009
+
+By: Maggie Costello Wachs (maggie@filamentgroup.com) and Scott Jehl (scott@filamentgroup.com)
+	http://www.filamentgroup.com
+	* reference articles: http://www.filamentgroup.com/lab/jquery_ipod_style_drilldown_menu/
+		
+Copyright (c) 2009 Filament Group
+Dual licensed under the MIT (filamentgroup.com/examples/mit-license.txt) and GPL (filamentgroup.com/examples/gpl-license.txt) licenses.
+--------------------------------------------------------------------*/
+
+
+var allUIMenus = [];
+
+$.fn.menu = function(options){
+	var caller = this;
+	var options = options;
+	var m = new Menu(caller, options);	
+	allUIMenus.push(m);
+	
+	$(this)
+	.mousedown(function(){
+		if (!m.menuOpen) { m.showLoading(); };
+	})	
+	.click(function(){
+		if (m.menuOpen == false) { m.showMenu(); }
+		else { m.kill(); };
+		return false;
+	});	
+};
+
+function Menu(caller, options){
+	var menu = this;
+	var caller = $(caller);
+	var container = $('<div class="fg-menu-container ui-widget ui-widget-content ui-corner-all">'+options.content+'</div>');
+	
+	this.menuOpen = false;
+	this.menuExists = false;
+	
+	var options = jQuery.extend({
+		content: null,
+		width: 180, // width of menu container, must be set or passed in to calculate widths of child menus
+		maxHeight: 180, // max height of menu (if a drilldown: height does not include breadcrumb)
+		positionOpts: {
+			posX: 'left', 
+			posY: 'bottom',
+			offsetX: 0,
+			offsetY: 0,
+			directionH: 'right',
+			directionV: 'down', 
+			detectH: true, // do horizontal collision detection  
+			detectV: true, // do vertical collision detection
+			linkToFront: false
+		},
+		showSpeed: 200, // show/hide speed in milliseconds
+		callerOnState: 'ui-state-active', // class to change the appearance of the link/button when the menu is showing
+		loadingState: 'ui-state-loading', // class added to the link/button while the menu is created
+		linkHover: 'ui-state-hover', // class for menu option hover state
+		linkHoverSecondary: 'li-hover', // alternate class, may be used for multi-level menus		
+	// ----- multi-level menu defaults -----
+		crossSpeed: 200, // cross-fade speed for multi-level menus
+		crumbDefaultText: 'Choose an option:',
+		backLink: true, // in the ipod-style menu: instead of breadcrumbs, show only a 'back' link
+		backLinkText: 'Back',
+		flyOut: false, // multi-level menus are ipod-style by default; this parameter overrides to make a flyout instead
+		flyOutOnState: 'ui-state-default',
+		nextMenuLink: 'ui-icon-triangle-1-e', // class to style the link (specifically, a span within the link) used in the multi-level menu to show the next level
+		topLinkText: 'All',
+		nextCrumbLink: 'ui-icon-carat-1-e'	
+	}, options);
+	
+	var killAllMenus = function(){
+		$.each(allUIMenus, function(i){
+			if (allUIMenus[i].menuOpen) { allUIMenus[i].kill(); };	
+		});
+	};
+	
+	this.kill = function(){
+		caller
+			.removeClass(options.loadingState)
+			.removeClass('fg-menu-open')
+			.removeClass(options.callerOnState);	
+		container.find('li').removeClass(options.linkHoverSecondary).find('a').removeClass(options.linkHover);		
+		if (options.flyOutOnState) { container.find('li a').removeClass(options.flyOutOnState); };	
+		if (options.callerOnState) { 	caller.removeClass(options.callerOnState); };			
+		if (container.is('.fg-menu-ipod')) { menu.resetDrilldownMenu(); };
+		if (container.is('.fg-menu-flyout')) { menu.resetFlyoutMenu(); };	
+		container.parent().hide();	
+		menu.menuOpen = false;
+		$(document).unbind('click', killAllMenus);
+		$(document).unbind('keydown');
+	};
+	
+	this.showLoading = function(){
+		caller.addClass(options.loadingState);
+	};
+
+	this.showMenu = function(){
+		killAllMenus();
+		if (!menu.menuExists) { menu.create() };
+		caller
+			.addClass('fg-menu-open')
+			.addClass(options.callerOnState);
+		container.parent().show().click(function(){ menu.kill(); return false; });
+		container.hide().slideDown(options.showSpeed).find('.fg-menu:eq(0)');
+		menu.menuOpen = true;
+		caller.removeClass(options.loadingState);
+		$(document).click(killAllMenus);
+		
+		// assign key events
+		$(document).keydown(function(event){
+			var e;
+			if (event.which !="") { e = event.which; }
+			else if (event.charCode != "") { e = event.charCode; }
+			else if (event.keyCode != "") { e = event.keyCode; }
+			
+			var menuType = ($(event.target).parents('div').is('.fg-menu-flyout')) ? 'flyout' : 'ipod' ;
+			
+			switch(e) {
+				case 37: // left arrow 
+					if (menuType == 'flyout') {
+						$(event.target).trigger('mouseout');
+						if ($('.'+options.flyOutOnState).size() > 0) { $('.'+options.flyOutOnState).trigger('mouseover'); };
+					};
+					
+					if (menuType == 'ipod') {
+						$(event.target).trigger('mouseout');
+						if ($('.fg-menu-footer').find('a').size() > 0) { $('.fg-menu-footer').find('a').trigger('click'); };
+						if ($('.fg-menu-header').find('a').size() > 0) { $('.fg-menu-current-crumb').prev().find('a').trigger('click'); };
+						if ($('.fg-menu-current').prev().is('.fg-menu-indicator')) {
+							$('.fg-menu-current').prev().trigger('mouseover');							
+						};						
+					};
+					return false;
+					break;
+					
+				case 38: // up arrow 
+					if ($(event.target).is('.' + options.linkHover)) {	
+						var prevLink = $(event.target).parent().prev().find('a:eq(0)');						
+						if (prevLink.size() > 0) {
+							$(event.target).trigger('mouseout');
+							prevLink.trigger('mouseover');
+						};						
+					}
+					else { container.find('a:eq(0)').trigger('mouseover'); }
+					return false;
+					break;
+					
+				case 39: // right arrow 
+					if ($(event.target).is('.fg-menu-indicator')) {						
+						if (menuType == 'flyout') {
+							$(event.target).next().find('a:eq(0)').trigger('mouseover');
+						}
+						else if (menuType == 'ipod') {
+							$(event.target).trigger('click');						
+							setTimeout(function(){
+								$(event.target).next().find('a:eq(0)').trigger('mouseover');
+							}, options.crossSpeed);
+						};				
+					}; 
+					return false;
+					break;
+					
+				case 40: // down arrow 
+					if ($(event.target).is('.' + options.linkHover)) {
+						var nextLink = $(event.target).parent().next().find('a:eq(0)');						
+						if (nextLink.size() > 0) {							
+							$(event.target).trigger('mouseout');
+							nextLink.trigger('mouseover');
+						};				
+					}
+					else { container.find('a:eq(0)').trigger('mouseover'); }		
+					return false;						
+					break;
+					
+				case 27: // escape
+					killAllMenus();
+					break;
+					
+				case 13: // enter
+					if ($(event.target).is('.fg-menu-indicator') && menuType == 'ipod') {							
+						$(event.target).trigger('click');						
+						setTimeout(function(){
+							$(event.target).next().find('a:eq(0)').trigger('mouseover');
+						}, options.crossSpeed);					
+					}; 
+					break;
+			};			
+		});
+	};
+	
+	this.create = function(){	
+		container.css({ width: options.width }).appendTo('body').find('ul:first').not('.fg-menu-breadcrumb').addClass('fg-menu');
+		container.find('ul, li a').addClass('ui-corner-all');
+		
+		// aria roles & attributes
+		container.find('ul').attr('role', 'menu').eq(0).attr('aria-activedescendant','active-menuitem').attr('aria-labelledby', caller.attr('id'));
+		container.find('li').attr('role', 'menuitem');
+		container.find('li:has(ul)').attr('aria-haspopup', 'true').find('ul').attr('aria-expanded', 'false');
+		container.find('a').attr('tabindex', '-1');
+		
+		// when there are multiple levels of hierarchy, create flyout or drilldown menu
+		if (container.find('ul').size() > 1) {
+			if (options.flyOut) { menu.flyout(container, options); }
+			else { menu.drilldown(container, options); }	
+		}
+		else {
+			container.find('a').click(function(){
+				menu.chooseItem(this);
+				return false;
+			});
+		};	
+		
+		if (options.linkHover) {
+			var allLinks = container.find('.fg-menu li a');
+			allLinks.hover(
+				function(){
+					var menuitem = $(this);
+					$('.'+options.linkHover).removeClass(options.linkHover).blur().parent().removeAttr('id');
+					$(this).addClass(options.linkHover).focus().parent().attr('id','active-menuitem');
+				},
+				function(){
+					$(this).removeClass(options.linkHover).blur().parent().removeAttr('id');
+				}
+			);
+		};
+		
+		if (options.linkHoverSecondary) {
+			container.find('.fg-menu li').hover(
+				function(){
+					$(this).siblings('li').removeClass(options.linkHoverSecondary);
+					if (options.flyOutOnState) { $(this).siblings('li').find('a').removeClass(options.flyOutOnState); }
+					$(this).addClass(options.linkHoverSecondary);
+				},
+				function(){ $(this).removeClass(options.linkHoverSecondary); }
+			);
+		};	
+		
+		menu.setPosition(container, caller, options);
+		menu.menuExists = true;
+	};
+	
+	this.chooseItem = function(item){
+		// edit this for your own custom function/callback:
+		if ($(item).attr('alt') == "pop")
+		{
+          var d = jQuery('<div class="dialog"><div style="width:32px; margin:20px auto 0px auto"><img src="/images/loading-spinner.gif"/></div></div>').appendTo("body");
+          d.dialog({ modal: true, autoOpen: true, width: 'auto', title: $(item).attr('title') });
+          d.load($(item).attr('href'), '', function(){
+            d.dialog("open");
+            apply_ajax_forms();
+          });
+		}
+		else
+		{
+		   location.href = $(item).attr('href');
+		}
+		menu.kill();
+	};
+};
+
+Menu.prototype.flyout = function(container, options) {
+	var menu = this;
+	
+	this.resetFlyoutMenu = function(){
+		var allLists = container.find('ul ul');
+		allLists.removeClass('ui-widget-content').hide();	
+	};
+	
+	container.addClass('fg-menu-flyout').find('li:has(ul)').each(function(){
+		var linkWidth = container.width();
+		var showTimer, hideTimer;
+		var allSubLists = $(this).find('ul');		
+		
+		allSubLists.css({ left: linkWidth, width: linkWidth }).hide();
+			
+		$(this).find('a:eq(0)').addClass('fg-menu-indicator').html('<span>' + $(this).find('a:eq(0)').text() + '</span><span class="ui-icon '+options.nextMenuLink+'"></span>').hover(
+			function(){
+				clearTimeout(hideTimer);
+				var subList = $(this).next();
+				if (!fitVertical(subList, $(this).offset().top)) { subList.css({ top: 'auto', bottom: 0 }); };
+				if (!fitHorizontal(subList, $(this).offset().left + 100)) { subList.css({ left: 'auto', right: linkWidth, 'z-index': 999 }); };
+				showTimer = setTimeout(function(){
+					subList.addClass('ui-widget-content').show(options.showSpeed).attr('aria-expanded', 'true');	
+				}, 300);	
+			},
+			function(){
+				clearTimeout(showTimer);
+				var subList = $(this).next();
+				hideTimer = setTimeout(function(){
+					subList.removeClass('ui-widget-content').hide(options.showSpeed).attr('aria-expanded', 'false');
+				}, 400);	
+			}
+		);
+
+		$(this).find('ul a').hover(
+			function(){
+				clearTimeout(hideTimer);
+				if ($(this).parents('ul').prev().is('a.fg-menu-indicator')) {
+					$(this).parents('ul').prev().addClass(options.flyOutOnState);
+				}
+			},
+			function(){
+				hideTimer = setTimeout(function(){
+					allSubLists.hide(options.showSpeed);
+					container.find(options.flyOutOnState).removeClass(options.flyOutOnState);
+				}, 500);	
+			}
+		);	
+	});
+	
+	container.find('a').click(function(){
+		menu.chooseItem(this);
+		alert("FOO");
+		return false;
+	});
+};
+
+
+/* Menu.prototype.setPosition parameters (defaults noted with *):
+	referrer = the link (or other element) used to show the overlaid object 
+	settings = can override the defaults:
+		- posX/Y: where the top left corner of the object should be positioned in relation to its referrer.
+				X: left*, center, right
+				Y: top, center, bottom*
+		- offsetX/Y: the number of pixels to be offset from the x or y position.  Can be a positive or negative number.
+		- directionH/V: where the entire menu should appear in relation to its referrer.
+				Horizontal: left*, right
+				Vertical: up, down*
+		- detectH/V: detect the viewport horizontally / vertically
+		- linkToFront: copy the menu link and place it on top of the menu (visual effect to make it look like it overlaps the object) */
+
+Menu.prototype.setPosition = function(widget, caller, options) { 
+	var el = widget;
+	var referrer = caller;
+	var dims = {
+		refX: referrer.offset().left,
+		refY: referrer.offset().top,
+		refW: referrer.getTotalWidth(),
+		refH: referrer.getTotalHeight()
+	};	
+	var options = options;
+	var xVal, yVal;
+	
+	var helper = $('<div class="positionHelper"></div>');
+	helper.css({ position: 'absolute', left: dims.refX, top: dims.refY, width: dims.refW, height: dims.refH });
+	el.wrap(helper);
+	
+	// get X pos
+	switch(options.positionOpts.posX) {
+		case 'left': 	xVal = 0; 
+			break;				
+		case 'center': xVal = dims.refW / 2;
+			break;				
+		case 'right': xVal = dims.refW;
+			break;
+	};
+	
+	// get Y pos
+	switch(options.positionOpts.posY) {
+		case 'top': 	yVal = 0;
+			break;				
+		case 'center': yVal = dims.refH / 2;
+			break;				
+		case 'bottom': yVal = dims.refH;
+			break;
+	};
+	
+	// add the offsets (zero by default)
+	xVal += options.positionOpts.offsetX;
+	yVal += options.positionOpts.offsetY;
+	
+	// position the object vertically
+	if (options.positionOpts.directionV == 'up') {
+		el.css({ top: 'auto', bottom: yVal });
+		if (options.positionOpts.detectV && !fitVertical(el)) {
+			el.css({ bottom: 'auto', top: yVal });
+		}
+	} 
+	else {
+		el.css({ bottom: 'auto', top: yVal });
+		if (options.positionOpts.detectV && !fitVertical(el)) {
+			el.css({ top: 'auto', bottom: yVal });
+		}
+	};
+	
+	// and horizontally
+	if (options.positionOpts.directionH == 'left') {
+		el.css({ left: 'auto', right: xVal });
+		if (options.positionOpts.detectH && !fitHorizontal(el)) {
+			el.css({ right: 'auto', left: xVal });
+		}
+	} 
+	else {
+		el.css({ right: 'auto', left: xVal });
+		if (options.positionOpts.detectH && !fitHorizontal(el)) {
+			el.css({ left: 'auto', right: xVal });
+		}
+	};
+	
+	// if specified, clone the referring element and position it so that it appears on top of the menu
+	if (options.positionOpts.linkToFront) {
+		referrer.clone().addClass('linkClone').css({
+			position: 'absolute', 
+			top: 0, 
+			right: 'auto', 
+			bottom: 'auto', 
+			left: 0, 
+			width: referrer.width(), 
+			height: referrer.height()
+		}).insertAfter(el);
+	};
+};
+
+
+/* Utilities to sort and find viewport dimensions */
+
+function sortBigToSmall(a, b) { return b - a; };
+
+jQuery.fn.getTotalWidth = function(){
+	return $(this).width() + parseInt($(this).css('paddingRight')) + parseInt($(this).css('paddingLeft')) + parseInt($(this).css('borderRightWidth')) + parseInt($(this).css('borderLeftWidth'));
+};
+
+jQuery.fn.getTotalHeight = function(){
+	return $(this).height() + parseInt($(this).css('paddingTop')) + parseInt($(this).css('paddingBottom')) + parseInt($(this).css('borderTopWidth')) + parseInt($(this).css('borderBottomWidth'));
+};
+
+function getScrollTop(){
+	return self.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
+};
+
+function getScrollLeft(){
+	return self.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft;
+};
+
+function getWindowHeight(){
+	var de = document.documentElement;
+	return self.innerHeight || (de && de.clientHeight) || document.body.clientHeight;
+};
+
+function getWindowWidth(){
+	var de = document.documentElement;
+	return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
+};
+
+/* Utilities to test whether an element will fit in the viewport
+	Parameters:
+	el = element to position, required
+	leftOffset / topOffset = optional parameter if the offset cannot be calculated (i.e., if the object is in the DOM but is set to display: 'none') */
+	
+function fitHorizontal(el, leftOffset){
+	var leftVal = parseInt(leftOffset) || $(el).offset().left;
+	return (leftVal + $(el).width() <= getWindowWidth() + getScrollLeft() && leftVal - getScrollLeft() >= 0);
+};
+
+function fitVertical(el, topOffset){
+	var topVal = parseInt(topOffset) || $(el).offset().top;
+	return (topVal + $(el).height() <= getWindowHeight() + getScrollTop() && topVal - getScrollTop() >= 0);
+};
+
+/*-------------------------------------------------------------------- 
+ * javascript method: "pxToEm"
+ * by:
+   Scott Jehl (scott@filamentgroup.com) 
+   Maggie Wachs (maggie@filamentgroup.com)
+   http://www.filamentgroup.com
+ *
+ * Copyright (c) 2008 Filament Group
+ * Dual licensed under the MIT (filamentgroup.com/examples/mit-license.txt) and GPL (filamentgroup.com/examples/gpl-license.txt) licenses.
+ *
+ * Description: Extends the native Number and String objects with pxToEm method. pxToEm converts a pixel value to ems depending on inherited font size.  
+ * Article: http://www.filamentgroup.com/lab/retaining_scalable_interfaces_with_pixel_to_em_conversion/
+ * Demo: http://www.filamentgroup.com/examples/pxToEm/	 	
+ *							
+ * Options:  	 								
+ 		scope: string or jQuery selector for font-size scoping
+ 		reverse: Boolean, true reverses the conversion to em-px
+ * Dependencies: jQuery library						  
+ * Usage Example: myPixelValue.pxToEm(); or myPixelValue.pxToEm({'scope':'#navigation', reverse: true});
+ *
+ * Version: 2.0, 08.01.2008 
+ * Changelog:
+ *		08.02.2007 initial Version 1.0
+ *		08.01.2008 - fixed font-size calculation for IE
+--------------------------------------------------------------------*/
+
+Number.prototype.pxToEm = String.prototype.pxToEm = function(settings){
+	//set defaults
+	settings = jQuery.extend({
+		scope: 'body',
+		reverse: false
+	}, settings);
+	
+	var pxVal = (this == '') ? 0 : parseFloat(this);
+	var scopeVal;
+	var getWindowWidth = function(){
+		var de = document.documentElement;
+		return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
+	};	
+	
+	/* When a percentage-based font-size is set on the body, IE returns that percent of the window width as the font-size. 
+		For example, if the body font-size is 62.5% and the window width is 1000px, IE will return 625px as the font-size. 	
+		When this happens, we calculate the correct body font-size (%) and multiply it by 16 (the standard browser font size) 
+		to get an accurate em value. */
+				
+	if (settings.scope == 'body' && $.browser.msie && (parseFloat($('body').css('font-size')) / getWindowWidth()).toFixed(1) > 0.0) {
+		var calcFontSize = function(){		
+			return (parseFloat($('body').css('font-size'))/getWindowWidth()).toFixed(3) * 16;
+		};
+		scopeVal = calcFontSize();
+	}
+	else { scopeVal = parseFloat(jQuery(settings.scope).css("font-size")); };
+			
+	var result = (settings.reverse == true) ? (pxVal * scopeVal).toFixed(2) + 'px' : (pxVal / scopeVal).toFixed(2) + 'em';
+	return result;
+};

data/test/rails_root/public/javascripts/muck_admin.js

@@ -0,0 +1,13 @@
+ jQuery(function(){
+	// BUTTONS
+	jQuery('.fg-button').hover(
+		function(){ jQuery(this).removeClass('ui-state-default').addClass('ui-state-focus'); },
+		function(){ jQuery(this).removeClass('ui-state-focus').addClass('ui-state-default'); }
+	);
+	jQuery('.flat').each(function() {
+		jQuery(this).menu({ 
+			content: jQuery(this).next().html(), // grab content from this page
+			showSpeed: 200 
+		});
+	});
+});

data/test/rails_root/public/stylesheets/admin.css

@@ -31,6 +31,8 @@ ul.admin-list li a{font-size:1.2em;}
 #admin-messages{display:none;}
 /* ui elements */
 #ui-datepicker-div{z-index:2005;}
+/* jquery-ui theme overrides */
+.ui-widget {font-size:.8em;}
 /* tables */
 .adminTable{margin:5px 0 0 0;padding:0 0 40px 0px;width:980px;}
 .adminTable a{color:#000;text-decoration:none;font-weight:bold;}
@@ -38,3 +40,23 @@ ul.admin-list li a{font-size:1.2em;}
 .adminTable tr{background-color:#fff;}
 .adminTable table{border:2px solid #c4ad63;}
 .adminTable tr td{font-size:1.1em;font-weight:bold;padding:5px;border-bottom:1px solid #eee;}
+/* menu styles*/
+.hidden { position:absolute; top:0; left:-9999px; width:1px; height:1px; overflow:hidden; }
+.fg-button { font-size:11px; clear:left; padding: .4em 1em; text-decoration:none !important; cursor:pointer; position: relative; text-align: center; zoom: 1; }
+.fg-button .ui-icon { position: absolute; top: 50%; margin-top: -8px; left: 50%; margin-left: -8px; }
+a.fg-button { float:left;  }
+button.fg-button { width:auto; overflow:visible; } /* removes extra button width in IE */
+.fg-button-icon-left { padding-left: 2.1em; }
+.fg-button-icon-right { padding-right: 2.1em; }
+.fg-button-icon-left .ui-icon { right: auto; left: .2em; margin-left: 0; }
+.fg-button-icon-right .ui-icon { left: auto; right: .2em; margin-left: 0; }
+.fg-button-icon-solo { display:block; width:8px; text-indent: -9999px; }	 /* solo icon buttons must have block properties for the text-indent to work */	
+.fg-button.ui-state-loading .ui-icon { background: url(spinner_bar.gif) no-repeat 0 0;}
+/*tabs*/
+.tabs{font-size:1.2em;border-bottom:solid 2px #000;position:relative;}
+.tabs ul{list-style-type:none;}
+.tabs ul li{float:left;display:inline;margin-right:20px;}
+.tabs ul li a{color:#000;text-decoration:none;}
+.tabs ul li a:hover{color:#333;}
+.tabs ul li a.active{background-position:0 bottom;color:#fff;}
+.tabs ul li a.active span{background-position:right bottom;}