- Use jqueryui's tab system instead of our own

- Update the tab style so it doesn't look stupid.

admin/award_awards.php

@@ -202,8 +202,6 @@ case 'award_create':
 			'Administration' => 'admin/index.php',
 			'Awards Main' => 'admin/awards.php') );
 
- require_once('../htabs.inc.php');
-
  ?>
 <script type="text/javascript" src="../js/jquery.tablednd_0_5.js"></script>
 <script type="text/javascript">
@@ -358,6 +356,25 @@ $(document).ready(function() {
 			modal: true, resizable: false,
 			draggable: false
 		});
+
+    $("#editor_tabs").tabs({
+			show: function(event, ui) { 
+						switch(ui.panel.id) {
+						case 'editor_tab_awardinfo':
+							update_awardinfo();
+							break;			
+						case 'editor_tab_eligibility':
+							update_eligibility();
+							break;			
+						case 'editor_tab_prizes':
+							update_prizeinfo();
+							break;			
+						}
+					},
+			selected: -1,
+
+		});
+
 }); 
 
  </script>
@@ -366,16 +383,14 @@ $(document).ready(function() {
  /* Begin popup */
  echo "<div id=\"popup_editor\" title=\"Award Editor\" style=\"display: none\">";
 
-htabs_begin('editortabs', array('awardinfo' => array('label' =>'Award',
-							'callback' => 'update_awardinfo'),
-				'eligibility' => array('label' =>'Eligibility',
-							'callback' => 'update_eligibility'),					
-				'prizes'=> array('label' => 'Prizes',
-							'callback' => 'update_prizeinfo'),
-				),'awardinfo');
-
-htabs_tab_begin('awardinfo');
 ?>
+<div id="editor_tabs">
+	<ul><li><a href="#editor_tab_awardinfo"><span><?=i18n('Award Info')?></span></a></li>
+	<li><a href="#editor_tab_eligibility"><span><?=i18n('Eligibility')?></span></a></li>
+	<li><a href="#editor_tab_prizes"><span><?=i18n('Prizes')?></span></a></li>
+</ul>
+
+<div id="editor_tab_awardinfo">
 	<h2><?=i18n("Award Info")?></h2>
 	<div id="awardinfo_info"></div>
 	<form id="awardinfo">
@@ -435,12 +450,11 @@ htabs_tab_begin('awardinfo');
 		<td class="right"><?=i18n("Allow the Automatic Judge Scheduler to assign judges to this award (usually checked)")?></td></tr>
 	</table></form>
 	<input type="submit" onClick="awardinfo_save();" value="Save" />
-<?
+</div>
-htabs_tab_end();
 
-htabs_tab_begin('eligibility');
+<? /* Next Tab */ ?>
-?>
+<div id="editor_tab_eligibility">
-	<h2><?=i18n("Award Info")?></h2>
+	<h3><?=i18n("Eligibility")?></h3>
 	<div id="eligibility_info"></div>
 	<form id="eligibility">
 	<input type="hidden" id="eligibility_id" name="id" value="" />
@@ -472,13 +486,13 @@ htabs_tab_begin('eligibility');
 	</td></tr></table>
 	</form>
 	<input type="submit" onClick="eligibility_save();" value="Save" />
-<?
+</div>
-htabs_tab_end();
 
-htabs_tab_begin('prizes');
+<?  /* Next Tab */ ?>
-?>
+
+<div id="editor_tab_prizes">
 	<div id="prizeinfo_info"></div> 
-	<h2><?=i18n("Prizes")?></h2>
+	<h3><?=i18n("Prizes")?></h3>
 	<br />
 	<table id="prizelist" class="tableview"> 
 	<tr class="nodrop nodrag">
@@ -495,7 +509,7 @@ htabs_tab_begin('prizes');
 	<br >
 	<hr>
 
-	<br /><h2 id="prizeinfo_edit_header">Click on a prize to edit</h2><br />
+	<br /><h3 id="prizeinfo_edit_header">Click on a prize to edit</h3><br />
 	<form id="prizeinfo">
 	<input type="hidden" id="prizeinfo_id" name="id" value=""/>
 	<input type="hidden" id="prizeinfo_award_awards_id" name="award_awards_id" value=""/>
@@ -538,21 +552,17 @@ htabs_tab_begin('prizes');
 	<br />
 	<input type="submit" onClick="prize_create();" value="<?=i18n("Create New Prize")?>" />
 	<input type="submit" id="prizeinfo_save" onClick="prize_save();" value="<?=i18n("Save Prize")?>" disabled="disabled" />
+</div>
+
+</div>
+
+</div>
 
 <?
-htabs_tab_end();
-
-htabs_end();
-
-/* End popup */
-echo '</div>';
-
-
-
-
 /* Here's all the code for the award list, except for the AJAX queries which are
  * at the top of this file */
 ?>
+
 <script type="text/javascript">
 
 function popup_editor(id)
@@ -566,9 +576,11 @@ function popup_editor(id)
 
 	award_id = id;
 	if(id == -1) {
-		htabs_open('prizes');
+		$('#editor_tabs').tabs('option', 'disabled', [0, 1]);
+		$('#editor_tabs').tabs('option', 'selected', 2);
 	} else {
-		htabs_open("editortabs");
+		$('#editor_tabs').tabs('option', 'disabled', []);
+		$('#editor_tabs').tabs('option', 'selected', 0);
 	}
 	return 0;
 }
@@ -600,9 +612,7 @@ function award_create()
 		        function(json) {
 				popup_editor(json.id);
 				/* Ensure we open on the first tab */
-				$("#htabs_awardinfo_tab").click();
+				 $('#editor_tabs').tabs('option', 'selected', 0);
-				/* FIXME: insert data into the list */
-				awardlist_refresh();
 			});
 //	alert("ok");
 	return 0;
@@ -624,15 +634,6 @@ function award_delete(id)
 
 }
 
-function popup_edit_prize_template()
-{
-	$("#htabs_editortabs_awardinfo").remove();
-	$("#htabs_editortabs_eligibility").remove();
-	$("#htabs_editortabs_prizes").html("<?=i18n("Generic Prize Template")?>");
-	popup_editor(-1);
-	$("#htabs_editortabs_prizes").click();
-}
-
 $(document).ready(function() { 
 	awardlist_refresh();
 //	$(".awardlist_tr#166").css('background-color','red');
@@ -729,9 +730,9 @@ echo "</table>";
 ?>
 <br />
 <a href="#" onClick="award_create();"><?=i18n("Create New Award")?></a>
-<a href="#" onClick="popup_edit_prize_template();"><?=i18n("Edit Generic Prize Template")?></a>
+<a href="#" onClick="popup_editor(-1);"><?=i18n("Edit Generic Prize Template")?></a>
 <input type="submit" onClick="award_create();" value="<?=i18n("Create New Award")?>" />
-<input type="submit" onClick="popup_edit_prize_template();" value="<?=i18n("Edit Generic Prize Template")?>" />
+<input type="submit" onClick="popup_editor(-1);" value="<?=i18n("Edit Generic Prize Template")?>" />
 <br /><br />
 
 <?
@@ -815,7 +816,7 @@ if(mysql_num_rows($q))
 	if($_GET['action'] == 'edit_prize_template') {
  	
 		?><script type="text/javascript">
-			popup_edit_prize_template();
+			popup_editor(-1);
 		</script>
 		<?
 	 }

theme/default/sfiab.css

@@ -483,6 +483,10 @@ table.usereditor td.right {
 	background: #e0e0ff;
 }
 
+.ui-widget {
+	font-size: 1em;
+}
+
 /* Override the titlebar padding, it's too big. */
 .ui-dialog .ui-dialog-titlebar { 
 	padding: 0 0 0 .5em ;
@@ -490,8 +494,38 @@ table.usereditor td.right {
 
 /* Override the title */
 .ui-dialog .ui-dialog-title {
-	font-size: 16px;
+	font-size: 12pt;
 	font-weight: bold;
 }
 
+/* Required for tabs to work */
+.ui-tabs .ui-tabs-hide {
+	display: none;
+}
+
+/* Rework the tabs, the default layout with a separate div
+ behind only the tabs is silly, and it looks stupid. */
+div.ui-tabs {
+	background: none;
+	border: none;
+	padding: 0;
+}
+
+div.ui-tabs div.ui-tabs-panel {
+	border: 1px solid #A5B5C6;
+	background: #eeeeff;
+}
+
+div.ui-tabs ul.ui-tabs-nav {
+	border: 0;
+	background: none;
+}
+
+/* Dump the HUGE tab border and change the font.  We need to
+ * rework the fonts for ALL of sfiab.   "1em" in here is about 20pt*/
+.ui-tabs .ui-tabs-nav li a {
+	padding: 0.1em 0.3em 0.1em 0.3em;
+	font-size: 10pt;
+	font-weight: bold;
+}