Elgg Javascript now goes through the views system

git-svn-id: https://code.elgg.org/elgg/trunk@2185 36083f99-b078-4883-b0ff-0f9b5a30f544

3 files changed, 349 insertions, 2 deletions

diff --git a/views/default/js/friendsPickerv1.php b/views/default/js/friendsPickerv1.php
new file mode 100644
index 000000000..73e98af15
--- /dev/null
+++ b/views/default/js/friendsPickerv1.php
@@ -0,0 +1,94 @@
+/*

+	elgg friendsPicker plugin

+	

+	adapted from Niall Doherty's excellent Coda-Slider - http://www.ndoherty.com/coda-slider

+*/

+

+

+jQuery.fn.friendsPicker = function(iterator) {

+

+	var settings; 

+	settings = $.extend({ easeFunc: "easeOutExpo", easeTime: 1000, toolTip: false }, settings);

+	

+	return this.each(function() {

+	

+		var container = $(this);

+		container.addClass("friendsPicker");

+		// set panelwidth manually as it's hidden initially

+		var panelWidth = 685;

+

+		// count the panels in the container

+		var panelCount = container.find("div.panel").size();

+		// calculate the width of all the panels lined up end-to-end

+		var friendsPicker_containerWidth = panelWidth*panelCount;

+		// specify width for the friendsPicker_container

+		container.find("div.friendsPicker_container").css("width" , friendsPicker_containerWidth);

+		

+		// global variables for container.each function below

+		var friendsPickerNavigationWidth = 0;

+		var currentPanel = 1;

+		

+		// generate appropriate nav for each container

+		container.each(function(i) {

+			// generate Left and Right arrows

+			$(this).before("<div class='friendsPickerNavigationL' id='friendsPickerNavigationL" + iterator + "'><a href='#'>Left</a><\/div>");

+			$(this).after("<div class='friendsPickerNavigationR' id='friendsPickerNavigationR" + iterator + "'><a href='#'>Right</a><\/div>");

+			

+			// generate a-z tabs

+			$(this).before("<div class='friendsPickerNavigation' id='friendsPickerNavigation" + iterator + "'><ul><\/ul><\/div>");

+			$(this).find("div.panel").each(function(individualTabItemNumber) {

+				$("div#friendsPickerNavigation" + iterator + " ul").append("<li class='tab" + (individualTabItemNumber+1) + "'><a href='#" + (individualTabItemNumber+1) + "'>" + $(this).attr("title") + "<\/a><\/li>");		

+			});

+			

+			// tabs navigation

+			$("div#friendsPickerNavigation" + iterator + " a").each(function(individualTabItemNumber) {

+				// calc friendsPickerNavigationWidth by summing width of each li

+				friendsPickerNavigationWidth += $(this).parent().width();

+				// set-up individual tab clicks

+				$(this).bind("click", function() {

+					$(this).addClass("current").parent().parent().find("a").not($(this)).removeClass("current"); 

+					var distanceToMoveFriendsPicker_container = - (panelWidth*individualTabItemNumber);

+					currentPanel = individualTabItemNumber + 1;

+					$(this).parent().parent().parent().next().find("div.friendsPicker_container").animate({ left: distanceToMoveFriendsPicker_container}, settings.easeTime, settings.easeFunc);

+				});

+			});

+			

+			// Right arow click function

+			$("div#friendsPickerNavigationR" + iterator + " a").click(function() {

+				if (currentPanel == panelCount) {

+					var distanceToMoveFriendsPicker_container = 0;

+					currentPanel = 1; 

+					$(this).parent().parent().find("div.friendsPickerNavigation a.current").removeClass("current").parent().parent().find("a:eq(0)").addClass("current");

+				} else {

+					var distanceToMoveFriendsPicker_container = - (panelWidth*currentPanel);

+					currentPanel += 1;

+					$(this).parent().parent().find("div.friendsPickerNavigation a.current").removeClass("current").parent().next().find("a").addClass("current");

+				};

+				$(this).parent().parent().find("div.friendsPicker_container").animate({ left: distanceToMoveFriendsPicker_container}, settings.easeTime, settings.easeFunc);

+				return false;

+			});

+			

+			// Left arrow click function

+			$("div#friendsPickerNavigationL" + iterator + " a").click(function() {

+				if (currentPanel == 1) {

+					var distanceToMoveFriendsPicker_container = - (panelWidth*(panelCount - 1));

+					currentPanel = panelCount;

+					$(this).parent().parent().find("div.friendsPickerNavigation a.current").removeClass("current").parent().parent().find("li:last a").addClass("current");

+				} else {

+					currentPanel -= 1;

+					var distanceToMoveFriendsPicker_container = - (panelWidth*(currentPanel - 1));

+					$(this).parent().parent().find("div.friendsPickerNavigation a.current").removeClass("current").parent().prev().find("a").addClass("current");

+				};

+				$(this).parent().parent().find("div.friendsPicker_container").animate({ left: distanceToMoveFriendsPicker_container}, settings.easeTime, settings.easeFunc);

+				return false;

+			});

+						

+				// apply 'current' class to currently selected tab link

+				$("div#friendsPickerNavigation" + iterator + " a:eq(0)").addClass("current");

+		});

+

+		$("div#friendsPickerNavigation" + iterator).append("<br />");		

+  });

+};

+

+

diff --git a/views/default/js/initialise_elgg.php b/views/default/js/initialise_elgg.php
new file mode 100644
index 000000000..e8a9952e5
--- /dev/null
+++ b/views/default/js/initialise_elgg.php
@@ -0,0 +1,253 @@
+$(document).ready(function () {

+

+	// elggtoolbar - close all drawer elements on pageload

+	$('li.drawer ul').hide();

+	

+	// elggtoolbar

+	$('h2.drawer-handle').click(function () {	

+		$('li.drawer ul:visible').slideUp('medium').prev().removeClass('open');

+		$(this).addClass('open').next().slideDown('fast');

+	return false;

+	});

+	

+	// toggle widget box contents

+	$('a.toggle_box_contents').bind('click', toggleContent);

+	

+	// toggle widget box edit panel

+	$('a.toggle_box_edit_panel').click(function () {

+		$(this.parentNode.parentNode).children("[class=collapsable_box_editpanel]").slideToggle("fast");

+		return false;

+    });

+

+    

+	// toggle customise edit panel

+	$('a.toggle_customise_edit_panel').click(function () {

+		$('div#customise_editpanel').slideToggle("fast");

+		return false;

+    }); 

+

+	// toggle plugin's more info on admin tools admin

+	$('a.manifest_details').click(function () {

+		$(this.parentNode.parentNode).children("[class=manifest_file]").slideToggle("fast");

+		return false;

+	});

+  

+	//////////////////

+	// WIDGET GALLERY

+	// sortable widgets

+	var els = ['#leftcolumn_widgets', '#middlecolumn_widgets', '#rightcolumn_widgets', '#widget_picker_gallery' ];

+	var $els = $(els.toString());

+	

+	$els.sortable({

+		items: '.draggable_widget',

+		handle: '.drag_handle',

+		cursor: 'move',

+		revert: true,

+		opacity: 1.0,

+		appendTo: 'body',

+		placeholder: 'placeholder',

+		connectWith: els,

+		start:function(e,ui) {

+			// prevent droppable drop function from running when re-sorting main lists

+			//$('#middlecolumn_widgets').droppable("disable");

+			//$('#leftcolumn_widgets').droppable("disable");	

+		},

+		stop: function(e,ui) {	

+			// refresh list before updating hidden fields with new widget order		

+			$(this).sortable( "refresh" );

+			

+			var widgetNamesLeft = outputWidgetList('#leftcolumn_widgets');

+			var widgetNamesMiddle = outputWidgetList('#middlecolumn_widgets');

+			var widgetNamesRight = outputWidgetList('#rightcolumn_widgets');

+			

+			document.getElementById('debugField1').value = widgetNamesLeft;

+			document.getElementById('debugField2').value = widgetNamesMiddle;

+			document.getElementById('debugField3').value = widgetNamesRight;

+			

+		}

+	});

+	

+    // bind more info buttons

+    // it's wrapped in a function so it can be called when new widgets are created

+    widget_moreinfo();

+

+	// setup hover class for dragged widgets

+	$("#rightcolumn_widgets").droppable({

+		accept: ".draggable_widget",

+		hoverClass: 'droppable-hover'

+	});

+	$("#middlecolumn_widgets").droppable({

+		accept: ".draggable_widget",

+		hoverClass: 'droppable-hover'

+	});

+	$("#leftcolumn_widgets").droppable({

+		accept: ".draggable_widget",

+		hoverClass: 'droppable-hover'

+	});

+

+

+

+

+   

+}); /* end document ready function */

+

+

+

+

+

+

+

+

+

+

+

+

+jQuery.fn.makeDelimitedList = function(elementAttribute) {

+	

+	var delimitedListArray = new Array();

+

+	var listDelimiter = "::";

+

+	// Loop over each element in the stack and add the elementAttribute to the array

+	this.each(function(e) {

+			var listElement = $(this);

+	

+			// Add the attribute value to our values array

+			delimitedListArray[delimitedListArray.length] = listElement.attr(elementAttribute);

+		}

+	);

+

+	// Return value list by joining the array

+	return(delimitedListArray.join(listDelimiter));

+}

+

+

+

+

+function outputWidgetList(forElement) {

+	return( $("input[@name='handler'], input[@name='guid']", forElement ).makeDelimitedList("value") );	

+}

+

+

+// widget panel collapsed/expanded state

+function widget_state(forWidget) {

+

+	var thisWidgetState = $.cookie(forWidget);

+

+	if (thisWidgetState == 'collapsed') {

+	

+		forWidget = "#" + forWidget;

+		

+		$(forWidget).find("div.collapsable_box_content").hide();

+		$(forWidget).find("a.toggle_box_contents").html('+');

+		$(forWidget).find("a.toggle_box_edit_panel").fadeOut('medium');

+	};	

+}

+

+

+// toggle widget box contents

+var toggleContent = function(e) {

+	var targetContent = $('div.collapsable_box_content', this.parentNode.parentNode);

+		if (targetContent.css('display') == 'none') {

+			targetContent.slideDown(400);

+			$(this).html('-');

+			$(this.parentNode).children("[class=toggle_box_edit_panel]").fadeIn('medium');

+			

+			// set cookie for widget panel open-state

+			var thisWidgetName = $(this.parentNode.parentNode.parentNode).attr('id');

+			$.cookie(thisWidgetName, 'expanded', { expires: 365 });

+			

+			

+		} else {

+			targetContent.slideUp(400);

+			$(this).html('+');

+			$(this.parentNode).children("[class=toggle_box_edit_panel]").fadeOut('medium');

+			// make sure edit pane is closed

+			$(this.parentNode.parentNode).children("[class=collapsable_box_editpanel]").hide();

+			

+			// set cookie for widget panel closed-state

+			var thisWidgetName = $(this.parentNode.parentNode.parentNode).attr('id');

+			$.cookie(thisWidgetName, 'collapsed', { expires: 365 });			

+		}

+	return false;

+};

+

+

+

+

+function widget_moreinfo() {

+

+	$("img.more_info").hover(function(e) {										  

+		

+		var widgetdescription = $("input[@name='description']", this.parentNode.parentNode.parentNode ).attr('value');

+

+		$("body").append("<p id='widget_moreinfo'><b>"+ widgetdescription +" </b></p>");

+		

+		if (e.pageX < 900) {

+			$("#widget_moreinfo")

+				.css("top",(e.pageY + 10) + "px")

+				.css("left",(e.pageX + 10) + "px")

+				.fadeIn("medium");	

+		}	

+		else {

+			$("#widget_moreinfo")

+				.css("top",(e.pageY + 10) + "px")

+				.css("left",(e.pageX - 210) + "px")

+				.fadeIn("medium");		

+		}			

+				

+    },

+	function() {

+		$("#widget_moreinfo").remove();

+    });	

+    

+	$("img.more_info").mousemove(function(e) {

+		//$("#widget_moreinfo")

+		//	.css("top",(e.pageY + 10) + "px")

+		//	.css("left",(e.pageX + 10) + "px");

+	});	

+		

+};

+

+

+jQuery.cookie = function(name, value, options) {

+    if (typeof value != 'undefined') { // name and value given, set cookie

+        options = options || {};

+        if (value === null) {

+            value = '';

+            options.expires = -1;

+        }

+        var expires = '';

+        if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {

+            var date;

+            if (typeof options.expires == 'number') {

+                date = new Date();

+                date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));

+            } else {

+                date = options.expires;

+            }

+            expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE

+        }

+        // CAUTION: Needed to parenthesize options.path and options.domain

+        // in the following expressions, otherwise they evaluate to undefined

+        // in the packed version for some reason...

+        var path = options.path ? '; path=' + (options.path) : '';

+        var domain = options.domain ? '; domain=' + (options.domain) : '';

+        var secure = options.secure ? '; secure' : '';

+        document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');

+    } else { // only name given, get cookie

+        var cookieValue = null;

+        if (document.cookie && document.cookie != '') {

+            var cookies = document.cookie.split(';');

+            for (var i = 0; i < cookies.length; i++) {

+                var cookie = jQuery.trim(cookies[i]);

+                // Does this cookie string begin with the name we want?

+                if (cookie.substring(0, name.length + 1) == (name + '=')) {

+                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));

+                    break;

+                }

+            }

+        }

+        return cookieValue;

+    }

+};

diff --git a/views/default/page_elements/header.php b/views/default/page_elements/header.php
index 933cfaeb7..b1647a5f1 100644
--- a/views/default/page_elements/header.php
+++ b/views/default/page_elements/header.php
@@ -58,7 +58,7 @@ END;
 	<!-- include links to jQuery here? -->
 	<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery-1.2.6.pack.js"></script>
 	<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery-ui-personalized-1.5.packed.js"></script>
-	<script type="text/javascript" src="<?php echo $vars['url']; ?>javascript/initialise_elgg.js"></script>
+	<script type="text/javascript" src="<?php echo $vars['url']; ?>pg/js/initialise_elgg.js"></script>
 	

 <?php

 

@@ -70,7 +70,7 @@ END;
 	<!-- only needed on pages where we have friends collections and/or the friends picker-->
 	<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery-easing.1.2.pack.js"></script>
 	<script type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery-easing-compatibility.1.2.pack.js"></script>
-	<script type="text/javascript" src="<?php echo $vars['url']; ?>javascript/friendsPickerv1.js"></script>
+	<script type="text/javascript" src="<?php echo $vars['url']; ?>pg/js/friendsPickerv1.js"></script>
 	

 <?php