using the new lightbox and hacking away at the complicated embed/embed view

4 files changed, 110 insertions, 36 deletions

diff --git a/mod/embed/start.php b/mod/embed/start.php
index f6f49a53f..ce6c6ec11 100644
--- a/mod/embed/start.php
+++ b/mod/embed/start.php
@@ -36,10 +36,13 @@ function embed_longtext_menu($hook, $type, $items, $vars) {
 		'name' => 'embed',
 		'href' => "embed?{$active_section}internal_id={$vars['id']}",
 		'text' => elgg_echo('media:insert'),
-		'rel' => 'facebox',
-		'link_class' => 'elgg-longtext-control',
+		'rel' => 'lightbox',
+		'link_class' => 'elgg-longtext-control elgg-lightbox',
 		'priority' => 1,
 	));
+
+	elgg_load_js('lightbox');
+	elgg_load_css('lightbox');
 	
 	return $items;
 }
diff --git a/mod/embed/views/default/embed/css.php b/mod/embed/views/default/embed/css.php
index 44491846b..c20116bf2 100644
--- a/mod/embed/views/default/embed/css.php
+++ b/mod/embed/views/default/embed/css.php
@@ -5,6 +5,67 @@
  * @package embed
  */
 ?>
+.embed-wrapper {
+	width: 730px;
+	min-height: 400px;
+	padding: 5px;
+}
+.embed-wrapper h2 {
+	color: #333333;
+	margin-bottom: 10px;
+}
+
+/* ***************************************
+	EMBED TABBED PAGE NAVIGATION
+*************************************** */
+.embed-wrapper .elgg-tabs a:hover {
+	color: #666;
+}
+
+/***************
+ 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 p {
+	color:#333;
+}
+.embed-wrapper p.entity-title {
+	color:#666;
+}
+.embed-wrapper .elgg-image-block:hover {
+	background-color: #eee;
+}
+.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..f09d76a4b 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');
+	$content .= elgg_view('embed/tabs', $vars);
 
-	// 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')
-		);
-	}
-
-	$tabs_html = elgg_view('navigation/tabs', array('tabs' => $tabs));
-	$content .= $tabs_html;
+	$offset = max(0, get_input('offset', 0));
+	$limit = get_input('limit', 10);
 
 	// build the items and layout.
 	if ($active_section == 'upload' || array_key_exists($active_section, $sections)) {
@@ -121,7 +91,7 @@ if (!$sections) {
 	}
 }
 
-echo $content;
+echo '<div class="embed-wrapper">' . $content . '</div>';
 ?>
 
 <?php //@todo: JS 1.8: ugly ?>
diff --git a/mod/embed/views/default/embed/tabs.php b/mod/embed/views/default/embed/tabs.php
new file mode 100644
index 000000000..a148ece9f
--- /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));