From 1d319058fde660cd1e6cd70a510c150f2cffc15c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andreas=20=C3=85kre=20Solberg?= <andreas.solberg@uninett.no>
Date: Tue, 24 Feb 2009 06:40:09 +0000
Subject: [PATCH] Statistics module switching to jquery tabs

git-svn-id: https://simplesamlphp.googlecode.com/svn/trunk@1307 44740490-163a-0410-bde0-09ae8108e29a
---
 .../statistics/templates/statistics-tpl.php   | 78 +++++-----------
 www/resources/js/tabs/AddCSS.js               | 59 ------------
 www/resources/js/tabs/addclasskillclass.js    | 14 ---
 www/resources/js/tabs/attachevent.js          | 34 -------
 www/resources/js/tabs/tabtastic.js            | 92 -------------------
 5 files changed, 25 insertions(+), 252 deletions(-)
 delete mode 100644 www/resources/js/tabs/AddCSS.js
 delete mode 100644 www/resources/js/tabs/addclasskillclass.js
 delete mode 100644 www/resources/js/tabs/attachevent.js
 delete mode 100644 www/resources/js/tabs/tabtastic.js

diff --git a/modules/statistics/templates/statistics-tpl.php b/modules/statistics/templates/statistics-tpl.php
index 34f968948..aad0fdc5a 100644
--- a/modules/statistics/templates/statistics-tpl.php
+++ b/modules/statistics/templates/statistics-tpl.php
@@ -1,55 +1,33 @@
 <?php
-$this->data['header'] = 'Statistics';
-$this->includeAtTemplateBase('includes/header.php');
+$this->data['header'] = 'SimpleSAMLphp Statistics';
+
 
+/*
 echo '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'resources/js/tabs/addclasskillclass.js"></script>';
 echo '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'resources/js/tabs/attachevent.js"></script>';
 echo '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'resources/js/tabs/addcss.js"></script>';
 echo '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'resources/js/tabs/tabtastic.js"></script>';
+*/
 
 
-?>
+$this->data['head']  = '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'resources/jquery.js"></script>';
+$this->data['head'] .= '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'resources/jquery-ui.js"></script>';
+$this->data['head'] .= '<link rel="stylesheet" media="screen" type="text/css" href="/' . $this->data['baseurlpath'] . 'resources/uitheme/jquery-ui-themeroller.css" />';
 
-	<style type="text/css" media="all">
-#content .tabset_tabs	{ 
-	margin:0; padding:0; 
-	list-style-type:none; position:relative; z-index:2; white-space:nowrap 
-}
-#content .tabset_tabs li	{ 
-	margin:0; 
-	padding: 0px; 
-	display:inline;
-	font-family: sans-serif; 
-	font-size: medium;
-	font-weight: normal;
-}
-#content .tabset_tabs a	{ 
-	color:#bbb ! important; 
-	background-color:#e8e8e8 ! important; 
-	border:1px solid #aaa; text-decoration:none; 
-	padding:0 2em;
-
-/*	border-left-width:1px;  */
-	border-bottom:none 
-}
-#content .tabset_tabs a:hover { 
-	color:#666; 
-	background-color:#eee; 
-}
-#content .tabset_tabs a.active { 
-	color:black ! important; background-color:white ! important; border-color:black; border-left-width:1px; cursor:default; border-bottom:white; padding-top:1px; padding-bottom:1px;
-}
+$this->data['head'] .= '<script type="text/javascript">
 
-#content .tabset_tabs li.firstchild a	{ border-left-width:1px }
+$(document).ready(function() {
+	$("#tabdiv > ul").tabs();
+});
+</script>';
 
-#content .tabset_content	{ 
-	border:1px solid black; background-color:white; position:relative; z-index:1; padding:0.5em 1em; display:none;
-	top: -3px;
-}
-#content .tabset_label	{ display:none }
 
-#content .tabset_content_active	{ display:block }
+$this->includeAtTemplateBase('includes/header.php');
 
+?>
+
+	<style type="text/css" media="all">
+.ui-tabs-panel { padding: .5em }
 
 .tableview {
 	border-collapse: collapse;
@@ -81,7 +59,7 @@ echo '<script type="text/javascript" src="/' . $this->data['baseurlpath'] . 'res
 echo('<h1>'. $this->data['available.rules'][$this->data['selected.rule']]['name'] . '</h1>');
 echo('<p>' . $this->data['available.rules'][$this->data['selected.rule']]['descr'] . '</p>');
 
-echo '<div class="selecttime" style="border: 1px solid #999; background: #ccc; margin: .5em; padding: .5em">';
+echo '<div class="selecttime" style="border: 1px solid #ccc; background: #eee; margin: 5px 0px; padding: .5em">';
 echo '<div style="display: inline">';
 echo '<form style="display: inline"><select onChange="submit();" name="rule">';
 foreach ($this->data['available.rules'] AS $key => $rule) {
@@ -131,27 +109,22 @@ echo '</select></form>';
 echo '</div>';
 
 
-echo '<br style="clear: both; height: 0px">';
+echo '<div style="clear: both; height: 0px"></div>';
 echo '</div>';
 
 
-echo '<ul class="tabset_tabs">
-   <li><a href="#graph" class="active">Graph</a></li>
+echo '<div id="tabdiv"><ul class="tabset_tabs">
+   <li><a href="#graph">Graph</a></li>
    <li><a href="#table">Table</a></li>
    <li><a href="#debug">Debug</a></li>
 </ul>';
 echo '
 
-<div id="graph" class="tabset_content">
-   <h2 class="tabset_label">Graph</h2>
-';
+<div id="graph" class="tabset_content">';
 
 
 echo '<img src="' . htmlspecialchars($this->data['imgurl']) . '" />';
 
-
-
-
 echo '</div>'; # end graph content.
 
 
@@ -161,7 +134,7 @@ echo '</div>'; # end graph content.
  */
 $classint = array('odd', 'even'); $i = 0;
 echo '<div id="table" class="tabset_content">
-   <h2 class="tabset_label">Table</h2>
+
 <table class="tableview"><tr><th class="value">Value</th><th class="category">Data range</th>';
 foreach ( $this->data['summaryDataset'] as $key => $value ) {
 	$clint = $classint[$i++ % 2];
@@ -180,9 +153,7 @@ echo '</table></div>';
  
 
 
-echo '<div id="debug" class="tabset_content" style="max-height: 400px; overflow-y: scroll">
-   <h2 class="tabset_label">Debug</h2>
-';
+echo '<div id="debug" >';
 
 
 
@@ -201,6 +172,7 @@ echo '</table>';
 
 
 echo '</div>'; # End debug tab content
+echo('</div>'); # End tab div
 
 
 
diff --git a/www/resources/js/tabs/AddCSS.js b/www/resources/js/tabs/AddCSS.js
deleted file mode 100644
index a6c9f421b..000000000
--- a/www/resources/js/tabs/AddCSS.js
+++ /dev/null
@@ -1,59 +0,0 @@
-//*** This code is copyright 2002-2003 by Gavin Kistner, gavin@refinery.com
-//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
-//*** Reuse or modification is free provided you abide by the terms of that license.
-//*** (Including the first two lines above in your source code satisfies the conditions.)
-
-// Add a new stylesheet to the document;
-// url [optional] A url to an external stylesheet to use
-// idx [optional] The index in document.styleSheets to insert the new sheet before
-function AddStyleSheet(url,idx){
-	var css,before=null,head=document.getElementsByTagName("head")[0];
-
-	if (document.createElement){
-		if (url){
-			css = document.createElement('link');
-			css.rel  = 'stylesheet';
-			css.href = url;
-		} else css = document.createElement('style');
-		css.media = 'all';
-		css.type  = 'text/css';
-
-		if (idx>=0){
-			for (var i=0,ct=0,len=head.childNodes.length;i<len;i++){
-				var el = head.childNodes[i];
-				if (!el.tagName) continue;
-				var tagName = el.tagName.toLowerCase();
-				if (ct==idx){
-					before = el;
-					break;
-				}
-				if (tagName=='style' || tagName=='link' && (el.rel && el.rel.toLowerCase()=='stylesheet' || el.type && el.type.toLowerCase()=='text/css') ) ct++;
-			}
-		}
-		head.insertBefore(css,before);
-
-		return document.styleSheets[before?idx:document.styleSheets.length-1];
-	} else return alert("I can't create a new stylesheet for you. Sorry.");
-}
-// e.g. var newBlankSheetAfterAllOthers = AddStyleSheet(); 
-// e.g. var newBlankSheetBeforeAllOthers = AddStyleSheet(null,0);
-// e.g. var externalSheetAfterOthers = AddStyleSheet('http://phrogz.net/JS/Classes/docs.css');
-// e.g. var externalSheetBeforeOthers = AddStyleSheet('http://phrogz.net/JS/Classes/docs.css',0);
-
-
-// Cross-browser method for inserting a new rule into an existing stylesheet.
-// ss       - The stylesheet to stick the new rule in
-// selector - The string value to use for the rule selector
-// styles   - The string styles to use with the rule
-function AddRule(ss,selector,styles){
-	if (!ss) return false;
-	if (ss.insertRule) return ss.insertRule(selector+' {'+styles+'}',ss.cssRules.length);
-	if (ss.addRule){
-		ss.addRule(selector,styles);
-		return true;
-	}
-	return false;
-}
-
-// e.g. AddRule( document.styleSheets[0] , 'a:link' , 'color:blue; text-decoration:underline' );
-// e.g. AddRule( AddStyleSheet() , 'hr' , 'display:none' );
diff --git a/www/resources/js/tabs/addclasskillclass.js b/www/resources/js/tabs/addclasskillclass.js
deleted file mode 100644
index f199fc8a3..000000000
--- a/www/resources/js/tabs/addclasskillclass.js
+++ /dev/null
@@ -1,14 +0,0 @@
-//*** This code is copyright 2002-2003 by Gavin Kistner and Refinery; www.refinery.com
-//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
-//*** Reuse or modification is free provided you abide by the terms of that license.
-//*** (Including the first two lines above in your source code satisfies the conditions.)
-
-//***Adds a new class to an object, preserving existing classes
-function AddClass(obj,cName){ KillClass(obj,cName); return obj && (obj.className+=(obj.className.length>0?' ':'')+cName); }
-
-//***Removes a particular class from an object, preserving other existing classes.
-function KillClass(obj,cName){ return obj && (obj.className=obj.className.replace(new RegExp("^"+cName+"\\b\\s*|\\s*\\b"+cName+"\\b",'g'),'')); }
-
-//***Returns true if the object has the class assigned, false otherwise.
-function HasClass(obj,cName){ return (!obj || !obj.className)?false:(new RegExp("\\b"+cName+"\\b")).test(obj.className) }
-
diff --git a/www/resources/js/tabs/attachevent.js b/www/resources/js/tabs/attachevent.js
deleted file mode 100644
index eaad7b856..000000000
--- a/www/resources/js/tabs/attachevent.js
+++ /dev/null
@@ -1,34 +0,0 @@
-//*** This code is copyright 2003 by Gavin Kistner, gavin@refinery.com
-//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
-//*** Reuse or modification is free provided you abide by the terms of that license.
-//*** (Including the first two lines above in your source code satisfies the conditions.)
-
-
-//***Cross browser attach event function. For 'evt' pass a string value with the leading "on" omitted
-//***e.g. AttachEvent(window,'load',MyFunctionNameWithoutParenthesis,false);
-
-function AttachEvent(obj,evt,fnc,useCapture){
-	if (!useCapture) useCapture=false;
-	if (obj.addEventListener){
-		obj.addEventListener(evt,fnc,useCapture);
-		return true;
-	} else if (obj.attachEvent) return obj.attachEvent("on"+evt,fnc);
-	else{
-		MyAttachEvent(obj,evt,fnc);
-		obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
-	}
-} 
-
-//The following are for browsers like NS4 or IE5Mac which don't support either
-//attachEvent or addEventListener
-function MyAttachEvent(obj,evt,fnc){
-	if (!obj.myEvents) obj.myEvents={};
-	if (!obj.myEvents[evt]) obj.myEvents[evt]=[];
-	var evts = obj.myEvents[evt];
-	evts[evts.length]=fnc;
-}
-function MyFireEvent(obj,evt){
-	if (!obj || !obj.myEvents || !obj.myEvents[evt]) return;
-	var evts = obj.myEvents[evt];
-	for (var i=0,len=evts.length;i<len;i++) evts[i]();
-}
diff --git a/www/resources/js/tabs/tabtastic.js b/www/resources/js/tabs/tabtastic.js
deleted file mode 100644
index 4dbf2ef78..000000000
--- a/www/resources/js/tabs/tabtastic.js
+++ /dev/null
@@ -1,92 +0,0 @@
-//*** This library is copyright 2004 by Gavin Kistner, gavin@refinery.com
-//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
-//*** Reuse or modification is free provided you abide by the terms of that license.
-//*** (Including the first two lines above in your source code mostly satisfies the conditions.)
-
-//*** Tabtastic -- see http://phrogz.net/JS/Tabstatic/index.html
-//*** Version 1.0    20040430   Initial release.
-//***         1.0.2  20040501   IE5Mac, IE6Win compat.
-//***         1.0.3  20040501   Removed IE5Mac/Opera7 compat. (see http://phrogz.net/JS/Tabstatic/index.html#notes)
-//***         1.0.4  20040521   Added scroll-back hack to prevent scrolling down to page anchor. Then commented out :)
-
-AttachEvent(window,'load',function(){
-	var tocTag='ul',tocClass='tabset_tabs',tabTag='a',contentClass='tabset_content';
-
-
-	function FindEl(tagName,evt){
-		if (!evt && window.event) evt=event;
-		if (!evt) return DebugOut("Can't find an event to handle in DLTabSet::SetTab",0);
-		var el=evt.currentTarget || evt.srcElement;
-		while (el && (!el.tagName || el.tagName.toLowerCase()!=tagName)) el=el.parentNode;
-		return el;
-	}
-
-	function SetTabActive(tab){
-		if (tab.tabTOC.activeTab){
-			if (tab.tabTOC.activeTab==tab) return;
-			KillClass(tab.tabTOC.activeTab,'active');
-			if (tab.tabTOC.activeTab.tabContent) KillClass(tab.tabTOC.activeTab.tabContent,'tabset_content_active');
-			//if (tab.tabTOC.activeTab.tabContent) tab.tabTOC.activeTab.tabContent.style.display='';
-			if (tab.tabTOC.activeTab.prevTab) KillClass(tab.tabTOC.activeTab.previousTab,'preActive');
-			if (tab.tabTOC.activeTab.nextTab) KillClass(tab.tabTOC.activeTab.nextTab,'postActive');
-		}
-		AddClass(tab.tabTOC.activeTab=tab,'active');
-		if (tab.tabContent) AddClass(tab.tabContent,'tabset_content_active');				
-		//if (tab.tabContent) tab.tabContent.style.display='block';
-		if (tab.prevTab) AddClass(tab.prevTab,'preActive');
-		if (tab.nextTab) AddClass(tab.nextTab,'postActive');
-	}
-	function SetTabFromAnchor(evt){
-		//setTimeout('document.body.scrollTop='+document.body.scrollTop,1);
-		SetTabActive(FindEl('a',evt).semanticTab);
-	}
-
-	
-	function Init(){
-		window.everyTabThereIsById = {};
-		
-		var anchorMatch = /#([a-z][\w.:-]*)$/i,match;
-		var activeTabs = [];
-		
-		var tocs = document.getElementsByTagName(tocTag);
-		for (var i=0,len=tocs.length;i<len;i++){
-			var toc = tocs[i];
-			if (!HasClass(toc,tocClass)) continue;
-
-			var lastTab;
-			var tabs = toc.getElementsByTagName(tabTag);
-			for (var j=0,len2=tabs.length;j<len2;j++){
-				var tab = tabs[j];
-				if (!tab.href || !(match=anchorMatch.exec(tab.href))) continue;
-				if (lastTab){
-					tab.prevTab=lastTab;
-					lastTab.nextTab=tab;
-				}
-				tab.tabTOC=toc;
-				everyTabThereIsById[tab.tabID=match[1]]=tab;
-				tab.tabContent = document.getElementById(tab.tabID);
-				
-				if (HasClass(tab,'active')) activeTabs[activeTabs.length]=tab;
-				
-				lastTab=tab;
-			}
-			AddClass(toc.getElementsByTagName('li')[0],'firstchild');
-		}
-
-		for (var i=0,len=activeTabs.length;i<len;i++){
-			SetTabActive(activeTabs[i]);
-		}
-
-		for (var i=0,len=document.links.length;i<len;i++){
-			var a = document.links[i];
-			if (!(match=anchorMatch.exec(a.href))) continue;
-			if (a.semanticTab = everyTabThereIsById[match[1]]) AttachEvent(a,'click',SetTabFromAnchor,false);
-		}
-		
-		if ((match=anchorMatch.exec(location.href)) && (a=everyTabThereIsById[match[1]])) SetTabActive(a);
-		
-		//Comment out the next line and include the file directly if you need IE5Mac or Opera7 support.
-		AddStyleSheet('tabtastic.css',0);
-	}
-	Init();
-},false);
\ No newline at end of file
-- 
GitLab