Merge pull request #41 from cash/embed-lightbox

Fixes #3564 Embed rewrite using new lightbox

17 files changed, 322 insertions, 626 deletions

diff --git a/engine/lib/actions.php b/engine/lib/actions.php
index ff598916f..4ccffd267 100644
--- a/engine/lib/actions.php
+++ b/engine/lib/actions.php
@@ -384,7 +384,8 @@ function actions_init() {
  */
 function elgg_is_xhr() {
 	return isset($_SERVER['HTTP_X_REQUESTED_WITH'])
-		&& strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest';
+		&& strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest' ||
+		get_input('X-Requested-With') === 'XMLHttpRequest';
 }
 
 /**
diff --git a/mod/embed/images/close_button.gif b/mod/embed/images/close_button.gif
deleted file mode 100644
index 822ea8527..000000000
--- a/mod/embed/images/close_button.gif
+++ /dev/null
diff --git a/mod/embed/js/embed.js b/mod/embed/js/embed.js
deleted file mode 100644
index c29083af7..000000000
--- a/mod/embed/js/embed.js
+++ /dev/null
@@ -1,10 +0,0 @@
-$(function() {
-
-	// change for dropdown
-	$('#embed_upload').live('change', function() {
-		var upload_section = $(this).val();
-		var url = elgg.get_site_url() + 'embed/embed?active_section=upload&active_upload_section=' + upload_section;
-		$('#facebox .body .content').load(url);
-	});
-
-});
\ No newline at end of file
diff --git a/mod/embed/start.php b/mod/embed/start.php
index f6f49a53f..f6f1acc57 100644
--- a/mod/embed/start.php
+++ b/mod/embed/start.php
@@ -13,33 +13,42 @@ elgg_register_event_handler('init', 'system', 'embed_init');
  */
 function embed_init() {
 	elgg_extend_view('css/elgg', 'embed/css');
-	elgg_extend_view('js/elgg', 'embed/js');
-	elgg_extend_view('js/elgg', 'embed/lightbox_init');
 	
 	elgg_register_plugin_hook_handler('register', 'menu:longtext', 'embed_longtext_menu');
 
 	// Page handler for the modal media embed
 	elgg_register_page_handler('embed', 'embed_page_handler');
 	
-	elgg_register_js('elgg.embed', 'mod/embed/js/embed.js', 'footer');
+	elgg_register_js('elgg.embed', 'js/embed/embed.js', 'footer');
 }
 
+/**
+ * Add the embed menu item to the long text menu
+ *
+ * @param string $hook
+ * @param string $type
+ * @param array $items
+ * @param array $vars
+ * @return array
+ */
 function embed_longtext_menu($hook, $type, $items, $vars) {
-	// yeah this is naughty.  embed and ecml might want to merge.
-	if (elgg_is_active_plugin('ecml')) {
-		$active_section = 'active_section=web_services&';
-	} else {
-		$active_section = '';
+
+	if (elgg_get_context() == 'embed') {
+		return $items;
 	}
 	
 	$items[] = ElggMenuItem::factory(array(
 		'name' => 'embed',
-		'href' => "embed?{$active_section}internal_id={$vars['id']}",
+		'href' => "embed",
 		'text' => elgg_echo('media:insert'),
-		'rel' => 'facebox',
-		'link_class' => 'elgg-longtext-control',
-		'priority' => 1,
+		'rel' => 'lightbox',
+		'link_class' => "elgg-longtext-control elgg-lightbox embed-control embed-control-{$vars['id']}",
+		'priority' => 10,
 	));
+
+	elgg_load_js('lightbox');
+	elgg_load_css('lightbox');
+	elgg_load_js('elgg.embed');
 	
 	return $items;
 }
diff --git a/mod/embed/views/default/embed/addcontentjs.php b/mod/embed/views/default/embed/addcontentjs.php
index 18d2927fd..ffed211f5 100644
--- a/mod/embed/views/default/embed/addcontentjs.php
+++ b/mod/embed/views/default/embed/addcontentjs.php
@@ -3,4 +3,5 @@
  * Blank for compatibility.
  * @deprecated 1.8
  */
-?>
\ No newline at end of file
+
+elgg_deprecated_notice("The view 'embed/addcontentjs' has been deprecated.", 1.8);
diff --git a/mod/embed/views/default/embed/css.php b/mod/embed/views/default/embed/css.php
index 44491846b..1ce994cfe 100644
--- a/mod/embed/views/default/embed/css.php
+++ b/mod/embed/views/default/embed/css.php
@@ -5,6 +5,71 @@
  * @package embed
  */
 ?>
+.embed-wrapper {
+	width: 730px;
+	min-height: 400px;
+	margin: 5px;
+}
+.embed-wrapper h2 {
+	color: #333333;
+	margin-bottom: 10px;
+}
+.embed-wrapper .elgg-list-item {
+	cursor: pointer;
+}
+
+/* ***************************************
+	EMBED TABBED PAGE NAVIGATION
+*************************************** */
+.embed-wrapper .elgg-tabs a:hover {
+	color: #666;
+}
+
+.embed-wrapper p {
+	color: #333;
+}
+.embed-wrapper .elgg-image-block:hover {
+	background-color: #eee;
+}
+<?php
+return true;
+?>
+/***************
+ Form
+******************/
+/* input field classes */
+.embed-wrapper .elgg-input-text,
+.embed-wrapper .elgg-input-tags {
+	font: 120% Arial, Helvetica, sans-serif;
+	padding: 5px;
+	border: 1px solid #ccc;
+	color:#666;
+	background-color: white;
+
+	-webkit-border-radius: 5px;
+	-moz-border-radius: 5px;
+	border-radius: 5px;
+
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+	box-shadow: none;
+}
+.embed-wrapper .elgg-input-text:focus,
+.embed-wrapper .elgg-input-tags:focus {
+	border: solid 1px #4690d6;
+	background: #e4ecf5;
+	color:#333;
+}
+.embed-wrapper .elgg-input-file {
+	background-color: white;
+}
+
+.embed-wrapper label {
+	color:#333;
+}
+
+
+
 
 #facebox {
 	position: absolute;
diff --git a/mod/embed/views/default/embed/embed.php b/mod/embed/views/default/embed/embed.php
index eeeb1d244..77ce03699 100644
--- a/mod/embed/views/default/embed/embed.php
+++ b/mod/embed/views/default/embed/embed.php
@@ -17,41 +17,11 @@ $internal_id = elgg_extract('internal_id', $vars);
 if (!$sections) {
 	$content = elgg_echo('embed:no_sections');
 } else {
-	$offset = max(0, get_input('offset', 0));
-	$limit = get_input('limit', 10);
-
 	$content = elgg_view_title(elgg_echo('embed:media'));
-	//$content .= elgg_echo('embed:instructions');
-
-	// prepare tabbed menu
-	$tabs = array();
-	foreach ($sections as $section_id => $section_info) {
-		$tab = array(
-			'title' => $section_info['name'],
-			'url' => '#',
-			'url_class' => 'embed_section',
-			'url_id' => $section_id,
-		);
-
-		if ($section_id == $active_section) {
-			$tab['selected'] = TRUE;
-		}
-		$tabs[] = $tab;
-	}
-
-	// make sure upload is always the last tab
-	if ($upload_sections) {
-		$tabs[] = array(
-			'title' => elgg_echo('embed:upload'),
-			'url' => '#',
-			'url_class' => 'embed_section',
-			'url_id' => 'upload',
-			'selected' => ($active_section == 'upload')
-		);
-	}
+	$content .= elgg_view('embed/tabs', $vars);
 
-	$tabs_html = elgg_view('navigation/tabs', array('tabs' => $tabs));
-	$content .= $tabs_html;
+	$offset = max(0, get_input('offset', 0));
+	$limit = get_input('limit', 5);
 
 	// build the items and layout.
 	if ($active_section == 'upload' || array_key_exists($active_section, $sections)) {
@@ -59,8 +29,6 @@ if (!$sections) {
 		$layout = isset($section_info['layout']) ? $section_info['layout'] : 'list';
 
 		$params =  array(
-			//'type'	=> $type,
-			//'subtype'	=> $subtype,
 			'offset' => $offset,
 			'limit' => $limit,
 			'section' => $active_section,
@@ -73,10 +41,13 @@ if (!$sections) {
 		if ($section_content = elgg_view("embed/$active_section/content", $params)) {
 			// handles its own pagination
 			$content .= $section_content;
-		} elseif ($embed_info = elgg_trigger_plugin_hook('embed_get_items', $active_section, $params, array('items' => array(), 'count' => 0))) {
-			// check if we have an override for this section type.
-			$view = "embed/$active_section/item/$layout";
+		} else {
+			// see if anyone has any items to display for the active section
+			$result = array('items' => array(), 'count' => 0);
+			$embed_info = elgg_trigger_plugin_hook('embed_get_items', $active_section, $params, $result);
 
+			// do we use default view or has someone defined "embed/$active_section/item/$layout"
+			$view = "embed/$active_section/item/$layout";
 			if (!elgg_view_exists($view)) {
 				$view = "embed/item/$layout";
 			}
@@ -84,80 +55,32 @@ if (!$sections) {
 			if (!isset($embed_info['items']) || !is_array($embed_info['items']) || !count($embed_info['items'])) {
 				$content .= elgg_echo('embed:no_section_content');
 			} else {
-				// pull out some common tests
-				// embed requires ECML, but until we have plugin deps working
-				// we need to explicitly check and use a fallback.
-				if ($ecml_enabled = elgg_is_active_plugin('ecml')){
-					$ecml_valid_keyword = ecml_is_valid_keyword($active_section);
-				} else {
-					$ecml_valid_keyword = FALSE;
-				}
-				
-				$items_content = '<ul class="elgg-list">';
-				foreach ($embed_info['items'] as $item) {
-					$item_params = array(
-						'section' => $active_section,
-						'item' => $item,
-						'ecml_enabled' => $ecml_enabled,
-						'ecml_keyword' => ($ecml_valid_keyword) ? $active_section : 'entity',
-						'icon_size' => elgg_extract('icon_size', $section_info, 'tiny'),
-					);
-	
-					$items_content .= '<li class="elgg-list-item">' . elgg_view($view, $item_params) . '</li>';
-				}
-				$items_content .= '</ul>';
-				
-				$params['content'] = $items_content;
-				$params['count'] = $embed_info['count'];
-	
-				$content .= elgg_view('navigation/pagination', $params);
-				$content .= elgg_view("embed/layouts/$layout", $params);
+
+				elgg_push_context('widgets');
+				$content .= elgg_view_entity_list($embed_info['items'], array(
+					'full_view' => false,
+					'count' => $embed_info['count'],
+					'pagination' => true,
+					'position' => 'before',
+					'offset' => $offset,
+					'limit' => $limit,
+				));
+				elgg_pop_context();
+
+				$js = elgg_view('js/embed/inline', array(
+					'items' => $embed_info['items'],
+				));
 			}
-		} else {
-			$content .= elgg_echo('embed:no_section_content');
 		}
 	} else {
 		$content .= elgg_echo('embed:invalid_section');
 	}
 }
 
-echo $content;
-?>
-
-<?php //@todo: JS 1.8: ugly ?>
-<script type="text/javascript">
-$(function() {
-	var internal_id = '<?php echo addslashes($internal_id); ?>';
-
-	// Remove any existing "live" handlers
-	$('.embed_data').die('click');
-	$('.embed_section').die('click');
-	$('#facebox .elgg-pagination a').die('click');
-	
-	// insert embed codes
-	$('.embed_data').live('click', function() {
-		var embed_code = $(this).data('embed_code');
-		elggEmbedInsertContent(embed_code, internal_id);
-		
-		return false;
-	});
+echo '<div class="embed-wrapper">' . $content . '</div>';
 
-	// tabs
-	$('.embed_section').live('click', function() {
-		var section = $(this).attr('id');
-		var url = elgg.config.wwwroot + 'embed/embed?active_section=' + section + '&internal_id=' + internal_id;
-		$('#facebox .body .content').load(url);
-
-		return false;
-	});
-
-	// pagination
-	function elggPaginationClick() {
-		$('#facebox .body .content').load($(this).attr('href'));
-		return false;
-	}
-
-	$('#facebox .elgg-pagination a').live('click', elggPaginationClick);
-});
-
-</script>
+if (isset($js)) {
+	echo '<script type="text/javascript">';
+	echo $js;
+	echo '</script>';
+}
diff --git a/mod/embed/views/default/embed/js.php b/mod/embed/views/default/embed/js.php
deleted file mode 100644
index a0a2e8ff5..000000000
--- a/mod/embed/views/default/embed/js.php
+++ /dev/null
@@ -1,428 +0,0 @@
-<?php
-/**
- * JS interface for inserting content into the active editor.
- * 
- * @todo: 1.8 JS: Ugh
- */
-
-?>
-$(function() { 
-	$('a[rel*=facebox]').facebox();
-
-	// Only apply the .live binding after facebox has been displayed
-	$(document).bind('afterReveal.facebox', function() {
-	
-		// fire off the ajax upload
-		$('#file_embed_upload').live('submit', function() {
-			var options = {
-				success: function(data) {
-					var info = jQuery.parseJSON(data);
-
-					if (info.status == 'success') {
-						$('.popup .content').load(elgg.get_site_url() + 'embed/embed?active_section=file');
-					} else {
-						$('.popup .content').find('form').prepend('<p>' + info.message + '</p>');
-					}
-				}
-			};
-			$(this).ajaxSubmit(options);
-			return false;
-		});
-	});
-});
-function elggEmbedInsertContent(content, textAreaId) {
-	content = ' ' + content + ' ';
-	
-	// default input.
-	// if this doesn't match anything it won't add anything.
-	$('#' + textAreaId).val($('#' + textAreaId).val() + ' ' + content);
-	
-	<?php
-		// This view includes the guts of the function to do the inserting.
-		// Anything that overrides input/longtext with its own editor
-		// needs to supply its own function here that inserts
-		// content into textAreaId.
-		// See TinyMCE as an example.
-		
-		// for compatibility
-		// the old on that was overriden.
-		echo elgg_view('embed/addcontentjs');
-		
-		// the one you should extend.
-		//@todo This should fire a plugin hook or event, not require extending the view! >_<
-		echo elgg_view('embed/custom_insert_js');
-	?>
-	
-	
-	$.facebox.close();
-}
-
-/*
- * Facebox (for jQuery)
- * version: 1.2 (05/05/2008)
- * @requires jQuery v1.2 or later
- *
- * Examples at http://famspam.com/facebox/
- *
- * Licensed under the MIT:
- *   http://www.opensource.org/licenses/mit-license.php
- *
- * Copyright 2007, 2008 Chris Wanstrath [ chris@ozmm.org ]
- *
- * Usage:
- *
- *  jQuery(document).ready(function() {
- *    jQuery('a[rel*=facebox]').facebox()
- *  })
- *
- *  <a href="#terms" rel="facebox">Terms</a>
- *    Loads the #terms div in the box
- *
- *  <a href="terms.html" rel="facebox">Terms</a>
- *    Loads the terms.html page in the box
- *
- *  <a href="terms.png" rel="facebox">Terms</a>
- *    Loads the terms.png image in the box
- *
- *
- *  You can also use it programmatically:
- *
- *    jQuery.facebox('some html')
- *
- *  The above will open a facebox with "some html" as the content.
- *
- *    jQuery.facebox(function($) {
- *      $.get('blah.html', function(data) { $.facebox(data) })
- *    })
- *
- *  The above will show a loading screen before the passed function is called,
- *  allowing for a better ajaxy experience.
- *
- *  The facebox function can also display an ajax page or image:
- *
- *    jQuery.facebox({ ajax: 'remote.html' })
- *    jQuery.facebox({ image: 'dude.jpg' })
- *
- *  Want to close the facebox?  Trigger the 'close.facebox' document event:
- *
- *    jQuery(document).trigger('close.facebox')
- *
- *  Facebox also has a bunch of other hooks:
- *
- *    loading.facebox
- *    beforeReveal.facebox
- *    reveal.facebox (aliased as 'afterReveal.facebox')
- *    init.facebox
- *
- *  Simply bind a function to any of these hooks:
- *
- *   $(document).bind('reveal.facebox', function() { ...stuff to do after the facebox and contents are revealed... })
- *
- */
-(function($) {
-$.facebox = function(data, klass) {
-	$.facebox.loading()
-
-	if (data.ajax) fillFaceboxFromAjax(data.ajax)
-	else if (data.image) fillFaceboxFromImage(data.image)
-	else if (data.div) fillFaceboxFromHref(data.div)
-	else if ($.isFunction(data)) data.call($)
-	else $.facebox.reveal(data, klass)
-}
-
-/*
-   * Public, $.facebox methods
-   */
-
-$.extend($.facebox, {
-	settings: {
-	opacity      : 0.7,
-	overlay      : true,
-	loadingImage : '<?php echo elgg_get_site_url(); ?>_graphics/ajax_loader_bw.gif',
-	closeImage   : '<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif',
-	imageTypes   : [ 'png', 'jpg', 'jpeg', 'gif' ],
-	faceboxHtml  : '\
-	<div id="facebox" class="hidden"> \
-	<div class="popup"> \
-		<div class="body"> \
-			<div class="footer"> \
-				<a href="#" class="close"> \
-					<img src="<?php echo elgg_get_site_url(); ?>_graphics/spacer.gif" title="close" class="close_image" width="22" height="22" border="0" /> \
-				</a> \
-				</div> \
-				<div class="content"> \
-				</div> \
-		</div> \
-	</div> \
-	</div>'
-	},
-
-	loading: function() {
-	init()
-	if ($('#facebox .loading').length == 1) return true
-	showOverlay()
-
-	$('#facebox .content').empty()
-	$('#facebox .body').children().hide().end().
-		append('<div class="loading"><br /><br /><img src="'+$.facebox.settings.loadingImage+'"/><br /><br /></div>')
-
-	$('#facebox').css({
-		top:	getPageScroll()[1] + (getPageHeight() / 10),
-		// Curverider addition (pagewidth/2 - modalwidth/2)
-		left: ((getPageWidth() / 2) - ($('#facebox').width() / 2))
-	}).show()
-
-	$(document).bind('keydown.facebox', function(e) {
-		if (e.keyCode == 27) $.facebox.close()
-		return true
-	})
-	$(document).trigger('loading.facebox')
-	},
-
-	reveal: function(data, klass) {
-	$(document).trigger('beforeReveal.facebox')
-	if (klass) $('#facebox .content').addClass(klass)
-	$('#facebox .content').append(data)
-
-	setTimeout(function() {
-		$('#facebox .loading').remove();
-		$('#facebox .body').children().fadeIn('slow');
-		$('#facebox').css('left', $(window).width() / 2 - ($('#facebox').width() / 2));
-		$(document).trigger('reveal.facebox').trigger('afterReveal.facebox');
-		}, 100);
-
-	//$('#facebox .loading').remove()
-	//$('#facebox .body').children().fadeIn('slow')
-	//$('#facebox').css('left', $(window).width() / 2 - ($('#facebox').width() / 2))
-	//$(document).trigger('reveal.facebox').trigger('afterReveal.facebox')
-
-	},
-
-	close: function() {
-	$(document).trigger('close.facebox')
-	return false
-	}
-})
-
-/*
-   * Public, $.fn methods
-   */
-
-// Curverider addition
-/*
-	$.fn.wait = function(time, type) {
-		time = time || 3000;
-		type = type || "fx";
-		return this.queue(type, function() {
-			var self = this;
-			setTimeout(function() {
-				//$(self).queue();
-				$('#facebox .loading').remove();
-			}, time);
-		});
-	};
-*/
-
-$.fn.facebox = function(settings) {
-	init(settings)
-
-	function clickHandler() {
-	$.facebox.loading(true)
-
-	// support for rel="facebox.inline_popup" syntax, to add a class
-	// also supports deprecated "facebox[.inline_popup]" syntax
-	var klass = this.rel.match(/facebox\[?\.(\w+)\]?/)
-	if (klass) klass = klass[1]
-
-	fillFaceboxFromHref(this.href, klass)
-	return false
-	}
-
-	return this.click(clickHandler)
-}
-
-/*
-   * Private methods
-   */
-
-// called one time to setup facebox on this page
-function init(settings) {
-	if ($.facebox.settings.inited) return true
-	else $.facebox.settings.inited = true
-
-	$(document).trigger('init.facebox')
-	/* makeCompatible() */
-
-	var imageTypes = $.facebox.settings.imageTypes.join('|')
-	$.facebox.settings.imageTypesRegexp = new RegExp('\.' + imageTypes + '$', 'i')
-
-	if (settings) $.extend($.facebox.settings, settings)
-	$('body').append($.facebox.settings.faceboxHtml)
-
-	var preload = [ new Image(), new Image() ]
-	preload[0].src = $.facebox.settings.closeImage
-	preload[1].src = $.facebox.settings.loadingImage
-	preload.push(new Image())
-
-/*
-	$('#facebox').find('.b:first, .bl, .br, .tl, .tr').each(function() {
-	preload.push(new Image())
-	preload.slice(-1).src = $(this).css('background-image').replace(/url\((.+)\)/, '$1')
-	})
-*/
-
-	$('#facebox .close').click($.facebox.close)
-	$('#facebox .close_image').attr('src', $.facebox.settings.closeImage)
-}
-
-// getPageScroll() by quirksmode.com
-function getPageScroll() {
-	var xScroll, yScroll;
-	if (self.pageYOffset) {
-	yScroll = self.pageYOffset;
-	xScroll = self.pageXOffset;
-	} else if (document.documentElement && document.documentElement.scrollTop) {	 // Explorer 6 Strict
-	yScroll = document.documentElement.scrollTop;
-	xScroll = document.documentElement.scrollLeft;
-	} else if (document.body) {// all other Explorers
-	yScroll = document.body.scrollTop;
-	xScroll = document.body.scrollLeft;
-	}
-	return new Array(xScroll,yScroll)
-}
-
-	// Adapted from getPageSize() by quirksmode.com
-	function getPageHeight() {
-	var windowHeight
-	if (self.innerHeight) {	// all except Explorer
-	windowHeight = self.innerHeight;
-	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
-	windowHeight = document.documentElement.clientHeight;
-	} else if (document.body) { // other Explorers
-	windowHeight = document.body.clientHeight;
-	}
-	return windowHeight
-	}
-
-	// Curverider addition
-	function getPageWidth() {
-	var windowWidth;
-	if( typeof( window.innerWidth ) == 'number' ) {
-		windowWidth = window.innerWidth; //Non-IE
-	} else if( document.documentElement && ( document.documentElement.clientWidth ) ) {
-		windowWidth = document.documentElement.clientWidth; //IE 6+ in 'standards compliant mode'
-	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
-		windowWidth = document.body.clientWidth; //IE 4 compatible
-	}
-	return windowWidth
-	}
-
-
-
-// Backwards compatibility
-/*
-function makeCompatible() {
-	var $s = $.facebox.settings
-
-	$s.loadingImage = $s.loading_image || $s.loadingImage
-	$s.closeImage = $s.close_image || $s.closeImage
-	$s.imageTypes = $s.image_types || $s.imageTypes
-	$s.faceboxHtml = $s.facebox_html || $s.faceboxHtml
-}
-*/
-
-// Figures out what you want to display and displays it
-// formats are:
-//     div: #id
-//   image: blah.extension
-//    ajax: anything else
-function fillFaceboxFromHref(href, klass) {
-	// div
-	if (href.match(/#/)) {
-	var url    = window.location.href.split('#')[0]
-	var target = href.replace(url,'')
-	$.facebox.reveal($(target).clone().show(), klass)
-
-	// image
-	} else if (href.match($.facebox.settings.imageTypesRegexp)) {
-	fillFaceboxFromImage(href, klass)
-	// ajax
-	} else {
-	fillFaceboxFromAjax(href, klass)
-	}
-}
-
-function fillFaceboxFromImage(href, klass) {
-	var image = new Image()
-	image.onload = function() {
-	$.facebox.reveal('<div class="image"><img src="' + image.src + '" /></div>', klass)
-	}
-	image.src = href
-}
-
-function fillFaceboxFromAjax(href, klass) {
-	$.get(href, function(data) { $.facebox.reveal(data, klass) })
-}
-
-function skipOverlay() {
-	return $.facebox.settings.overlay == false || $.facebox.settings.opacity === null
-}
-
-function showOverlay() {
-	if (skipOverlay()) return
-
-	if ($('facebox_overlay').length == 0)
-	$("body").append('<div id="facebox_overlay" class="facebox_hide"></div>')
-
-	$('#facebox_overlay').hide().addClass("facebox_overlayBG")
-	.css('opacity', $.facebox.settings.opacity)
-	/* .click(function() { $(document).trigger('close.facebox') }) */
-	.fadeIn(400)
-	return false
-}
-
-function hideOverlay() {
-	if (skipOverlay()) return
-
-	$('#facebox_overlay').fadeOut(400, function(){
-	$("#facebox_overlay").removeClass("facebox_overlayBG")
-	$("#facebox_overlay").addClass("facebox_hide")
-	$("#facebox_overlay").remove()
-	})
-
-	return false
-}
-
-/*
-   * Bindings
-   */
-
-$(document).bind('close.facebox', function() {
-	$(document).unbind('keydown.facebox')
-	$('#facebox').fadeOut(function() {
-	$('#facebox .content').removeClass().addClass('content')
-	hideOverlay()
-	$('#facebox .loading').remove()
-	})
-})
-
-
-
-
-	// Curverider addition
-	$(window).resize(function(){
-	//alert("resized");
-
-	$('#facebox').css({
-		top:	getPageScroll()[1] + (getPageHeight() / 10),
-		left: ((getPageWidth() / 2) - 365)
-	})
-
-
-	});
-
-
-
-
-
-})(jQuery);
diff --git a/mod/embed/views/default/embed/tabs.php b/mod/embed/views/default/embed/tabs.php
new file mode 100644
index 000000000..3f377fee5
--- /dev/null
+++ b/mod/embed/views/default/embed/tabs.php
@@ -0,0 +1,40 @@
+<?php
+/**
+ * Embed tabs
+ *
+ * @uses $vars['sections']
+ * @uses $vars['upload_sections']
+ * @uses $vars['actibe_section']
+ */
+
+$sections = elgg_extract('sections', $vars, array());
+$active_section = elgg_extract('active_section', $vars, array_shift(array_keys($sections)));
+$upload_sections = elgg_extract('upload_sections', $vars, array());
+
+$tabs = array();
+foreach ($sections as $section_id => $section_info) {
+	$tab = array(
+		'title' => $section_info['name'],
+		'url' => '#',
+		'url_class' => 'embed-section',
+		'url_id' => $section_id,
+	);
+
+	if ($section_id == $active_section) {
+		$tab['selected'] = TRUE;
+	}
+	$tabs[] = $tab;
+}
+
+// make sure upload is always the last tab
+if ($upload_sections) {
+	$tabs[] = array(
+		'title' => elgg_echo('embed:upload'),
+		'url' => '#',
+		'url_class' => 'embed-section',
+		'url_id' => 'upload',
+		'selected' => ($active_section == 'upload')
+	);
+}
+
+echo elgg_view('navigation/tabs', array('tabs' => $tabs));
diff --git a/mod/embed/views/default/embed/upload/content.php b/mod/embed/views/default/embed/upload/content.php
index b7bcc76a0..24fce8112 100644
--- a/mod/embed/views/default/embed/upload/content.php
+++ b/mod/embed/views/default/embed/upload/content.php
@@ -19,16 +19,21 @@ if ($upload_sections) {
 		'value' => $active_section
 	));
 
-	echo "<div class='embed_modal_upload'>";
-	echo "<p>" . elgg_echo('embed:upload_type') . "$input</p>";
-
+	// hack this in for now as we clean up this mess
+	$form_vars = array(
+		'enctype' => 'multipart/form-data',
+		'class' => 'elgg-form',
+	);
+	$upload_content = elgg_view_form('file/upload', $form_vars);
+/*
 	if (!$upload_content = elgg_view($upload_sections[$active_section]['view'])) {
 		$upload_content = elgg_echo('embed:no_upload_content');
 	}
-
-	echo $upload_content . "</div>";
-
-	elgg_load_js('elgg.embed');
+*/
+	echo "<div class='mbm'>" . elgg_echo('embed:upload_type') . "$input</div>";
+	echo "<div class='embed-upload'>";
+	echo $upload_content;
+	echo "</div>";
 
 } else {
 	echo elgg_echo('embed:no_upload_sections');
diff --git a/mod/embed/views/default/js/embed/embed.php b/mod/embed/views/default/js/embed/embed.php
new file mode 100644
index 000000000..bf04c0963
--- /dev/null
+++ b/mod/embed/views/default/js/embed/embed.php
@@ -0,0 +1,108 @@
+elgg.provide('elgg.embed');
+
+elgg.embed.init = function() {
+
+	// inserts the embed content into the textarea
+	$(".embed-wrapper .elgg-list-item").live('click', elgg.embed.insert);
+
+	// caches the current textarea id
+	$(".embed-control").live('click', function() {
+		var classes = $(this).attr('class');
+		var embedClass = classes.split(/[, ]+/).pop();
+		var textAreaId = embedClass.substr(embedClass.indexOf('embed-control-') + "embed-control-".length);
+		elgg.embed.textAreaId = textAreaId;
+	});
+
+	// special pagination helper for lightbox
+	$('.embed-wrapper .elgg-pagination a').live('click', elgg.embed.pagination);
+
+	$('.embed-section').live('click', elgg.embed.loadTab);
+
+	$('.embed-upload .elgg-form').live('submit', elgg.embed.submit);
+}
+
+/**
+ * Inserts data attached to an embed list item in textarea
+ *
+ * @todo generalize lightbox closing and wysiwyg refreshing
+ *
+ * @param {Object} event
+ * @return void
+ */
+elgg.embed.insert = function(event) {
+
+	var textAreaId = elgg.embed.textAreaId;
+
+	var content = $(this).data('embed_code');
+	$('#' + textAreaId).val($('#' + textAreaId).val() + ' ' + content + ' ');
+
+	<?php echo elgg_view('embed/custom_insert_js'); ?>
+
+	$.fancybox.close();
+
+	event.preventDefault();
+}
+
+/**
+ * Submit an upload form through Ajax
+ *
+ * Requires the jQuery Form Plugin. Because files cannot be uploaded with
+ * XMLHttpRequest, the plugin uses an invisible iframe. This results in the
+ * the X-Requested-With header not being set. To work around this, we are
+ * sending the header as a POST variable and Elgg's code checks for it in
+ * elgg_is_xhr().
+ *
+ * @param {Object} event
+ * @return bool
+ */
+elgg.embed.submit = function(event) {
+	
+	$(this).ajaxSubmit({
+		dataType : 'json',
+		data     : { 'X-Requested-With' : 'XMLHttpRequest'},
+		success  : function(response) {
+			if (response) {
+				if (response.system_messages) {
+					elgg.register_error(response.system_messages.error);
+					elgg.system_message(response.system_messages.success);
+				}
+				if (response.status >= 0) {
+					// @todo - really this should forward to what the registered defined
+					// For example, forward to images tab if an image was uploaded
+					var url = elgg.config.wwwroot + 'embed/embed?active_section=file';
+					$('.embed-wrapper').parent().load(url);
+				}
+			}
+		}
+	});
+
+	// this was bubbling up the DOM causing a submission
+	event.preventDefault();
+	event.stopPropagation();
+}
+
+/**
+ * Loads the next chunk of content within the lightbox
+ *
+ * @param {Object} event
+ * @return void
+ */
+elgg.embed.pagination = function(event) {
+	$('.embed-wrapper').parent().load($(this).attr('href'));
+	event.preventDefault();
+}
+
+/**
+ * Loads an embed tab
+ *
+ * @param {Object} event
+ * @return void
+ */
+elgg.embed.loadTab = function(event) {
+	var section = $(this).attr('id');
+	var url = elgg.config.wwwroot + 'embed/embed?active_section=' + section;
+	$('.embed-wrapper').parent().load(url);
+	event.preventDefault();
+}
+
+elgg.register_hook_handler('init', 'system', elgg.embed.init);
diff --git a/mod/embed/views/default/js/embed/inline.php b/mod/embed/views/default/js/embed/inline.php
new file mode 100644
index 000000000..0672a68f8
--- /dev/null
+++ b/mod/embed/views/default/js/embed/inline.php
@@ -0,0 +1,26 @@
+<?php
+/**
+ * Inline embed JavaScript for attaching the insert data to list items
+ *
+ * @uses $vars['items']
+ */
+
+foreach ($vars['items'] as $item) {
+
+	// different entity types have different title attribute names.
+	$title = isset($item->name) ? $item->name : $item->title;
+	// don't let it be too long
+	$title = elgg_get_excerpt($title);
+
+	$icon = "<img src=\"{$item->getIcon($icon_size)}\" />" . htmlspecialchars($title, ENT_QUOTES, 'UTF-8', false);
+
+	$embed_code = elgg_view('output/url', array(
+		'href' => $item->getURL(),
+		'title' => $title,
+		'text' => $icon,
+		'encode_text' => false,
+	));
+	$embed_code = json_encode($embed_code);
+
+	echo "$('#elgg-object-{$item->getGUID()}').data('embed_code', $embed_code);";
+}
\ No newline at end of file
diff --git a/mod/file/actions/file/upload.php b/mod/file/actions/file/upload.php
index c5fe763cb..88a01745d 100644
--- a/mod/file/actions/file/upload.php
+++ b/mod/file/actions/file/upload.php
@@ -13,8 +13,6 @@ $container_guid = (int) get_input('container_guid', 0);
 $guid = (int) get_input('file_guid');
 $tags = get_input("tags");
 
-$ajax = get_input('ajax', FALSE);
-
 if ($container_guid == 0) {
 	$container_guid = elgg_get_logged_in_user_guid();
 }
@@ -33,17 +31,8 @@ if ($new_file) {
 	if (empty($_FILES['upload']['name'])) {
 
 		$error = elgg_echo('file:nofile');
-
-		if ($ajax) {
-			echo json_encode(array(
-				'status' => 'error',
-				'message' => $error
-			));
-			exit;
-		} else {
-			register_error($error);
-			forward(REFERER);
-		}
+		register_error($error);
+		forward(REFERER);
 	}
 
 	$file = new FilePluginFile();
@@ -159,44 +148,22 @@ elgg_clear_sticky_form('file');
 
 
 // handle results differently for new files and file updates
-// ajax is only for new files from embed right now.
 if ($new_file) {
 	if ($guid) {
 		$message = elgg_echo("file:saved");
-		if ($ajax) {
-			echo json_encode(array(
-				'status' => 'success',
-				'message' => $message
-			));
-			exit;
-
-		} else {
-			system_message($message);
-			add_to_river('river/object/file/create', 'create', elgg_get_logged_in_user_guid(), $file->guid);
-		}
+		system_message($message);
+		add_to_river('river/object/file/create', 'create', elgg_get_logged_in_user_guid(), $file->guid);
 	} else {
 		// failed to save file object - nothing we can do about this
 		$error = elgg_echo("file:uploadfailed");
-
-		if ($ajax) {
-			echo json_encode(array(
-				'status' => 'error',
-				'message' => $error
-			));
-			exit;
-
-		} else {
-			register_error($error);
-		}
+		register_error($error);
 	}
 
-	if (!$ajax) {
-		$container = get_entity($container_guid);
-		if (elgg_instanceof($container, 'group')) {
-			forward("file/group/$container->guid/all");
-		} else {
-			forward("file/owner/$container->username");
-		}
+	$container = get_entity($container_guid);
+	if (elgg_instanceof($container, 'group')) {
+		forward("file/group/$container->guid/all");
+	} else {
+		forward("file/owner/$container->username");
 	}
 
 } else {
diff --git a/mod/file/views/default/file/embed_upload.php b/mod/file/views/default/file/embed_upload.php
deleted file mode 100644
index e5076b052..000000000
--- a/mod/file/views/default/file/embed_upload.php
+++ /dev/null
@@ -1,8 +0,0 @@
-<?php
-/**
- * Files upload form for embed
- */
-
-echo elgg_view_form('file/upload', array('id' => 'file_embed_upload'), array('ajax' => TRUE));
-
-
diff --git a/mod/file/views/default/forms/file/upload.php b/mod/file/views/default/forms/file/upload.php
index b8a7a1668..98b7d9f05 100644
--- a/mod/file/views/default/forms/file/upload.php
+++ b/mod/file/views/default/forms/file/upload.php
@@ -11,8 +11,10 @@ $desc = elgg_extract('description', $vars, '');
 $tags = elgg_extract('tags', $vars, '');
 $access_id = elgg_extract('access_id', $vars, ACCESS_DEFAULT);
 $container_guid = elgg_extract('container_guid', $vars);
+if (!$container_guid) {
+	$container_guid = elgg_get_logged_in_user_guid();
+}
 $guid = elgg_extract('guid', $vars, null);
-$ajax = elgg_extract('ajax', $vars, FALSE);
 
 if ($guid) {
 	$file_label = elgg_echo("file:replace");
@@ -56,11 +58,6 @@ if ($categories) {
 
 echo elgg_view('input/hidden', array('name' => 'container_guid', 'value' => $container_guid));
 
-//@todo this should not be necessary in 1.8... -- ajax actions can be auto-detected
-if ($ajax) {
-	echo elgg_view('input/hidden', array('name' => 'ajax', 'value' => 1));
-}
-
 if ($guid) {
 	echo elgg_view('input/hidden', array('name' => 'file_guid', 'value' => $guid));
 }
diff --git a/views/default/css/elements/layout.php b/views/default/css/elements/layout.php
index 9f028d8b5..42d898439 100644
--- a/views/default/css/elements/layout.php
+++ b/views/default/css/elements/layout.php
@@ -53,7 +53,7 @@
 	top: 24px;
 	right: 20px;
 	max-width: 500px;
-	z-index: 1000;
+	z-index: 2000;
 }
 .elgg-system-messages li {
 	margin-top: 10px;
diff --git a/views/default/css/elements/navigation.php b/views/default/css/elements/navigation.php
index 62bd1e50f..64b7c47b4 100644
--- a/views/default/css/elements/navigation.php
+++ b/views/default/css/elements/navigation.php
@@ -165,7 +165,7 @@
 	SITE MENU
 *************************************** */
 .elgg-menu-site {
-	z-index: 7000;
+	z-index: 1;
 }
 
 .elgg-menu-site > li > a {
@@ -213,7 +213,7 @@
 	position: relative;
 	left: -1px;
 	width: 100%;
-	z-index: 7000;
+	z-index: 1;
 	min-width: 150px;
 	border: 1px solid #999;
 	border-top: 0;