social_stream-presence 0.6.2 → 0.6.3

data/app/assets/javascripts/chat_interface_manager.js.erb

@@ -1,3 +1,5 @@
+var global;
+
 ////////////////////
 //Reconnect button interface functions
 ////////////////////
@@ -30,8 +32,15 @@ function requestConnectToChat(){
 //Chat interface: Connection boxes
 ////////////////////
 
+var focusSearchContactsFlag=false;
+
 function setUserFunctions(){
-  
+
+	settingTooltips();
+	
+	///////////////////////
+	//Open chatbox function
+	///////////////////////
   $("div.user_presence").click(function(event, ui){
     var guest_name = $(this).attr("name");
     var guest_slug = $(this).attr("slug");
@@ -43,10 +52,21 @@ function setUserFunctions(){
     };
   });
   
+	
+	//Hide tooltips on mouseleave
+	$("div.user_presence").mouseleave(function(e){
+		var div = $(this);
+		$.each($(".tooltip:visible"), function(index, value) {
+			if ( $($(".tooltip:visible")[0]).html() == $(div).attr("name") ){
+				$($(".tooltip:visible")[index]).hide();
+			}
+		});
+  });
   
-////////////////////
-//Chat interface: Status selector
-////////////////////
+	
+	////////////////////
+	//Chat interface: Status selector
+	////////////////////
 
   //JQuery DropdwanStatus
   
@@ -78,15 +98,105 @@ function setUserFunctions(){
   
   $(document).bind('click', function(e) {
     var $clicked = $(e.target);
+		
     if (! $clicked.parents().hasClass("dropdown")){
       //Click outside the select...
         $(".dropdown dd ul").hide();
         setStatusWidgetTitle(userStatus);
     }
   });
+	
+	///////////////
+	//Search contacts enabling
+	///////////////
+	$("select.flexselect").flexselect({
+    allowMismatch: true
+  });
+	
+	//Select contact function
+	//callback in changeSelectContactValue()
+
+  
+  $("#search_chat_contact_flexselect").focus(function(e) {
+		changeContactListVisibility(true);
+	});
+	
+	$("#search_chat_contact_flexselect").blur(function(e) {
+    changeContactListVisibility(false);
+  });
+
+}
+
+
+function changeSelectContactValue(name,value){
+	$("#search_chat_contact_flexselect").blur();
+	
+	if(value == "ZERO_CONTACTS"){
+		return;
+	}
+	
+  var guest_slug = value;
+  var guest_name = name;
+  var guest_jid = guest_slug + "@" + domain;
+  if (createChatBox(guest_slug, guest_name, guest_jid, user_name, user_jid)) {
+  } else {
+    window[getChatVariableFromSlug(guest_slug)].chatbox("option", "boxManager").toggleBox(true);
+  };
+  
+  //Check for online status and show notification
+  if (getAllConnectedSlugs().indexOf(guest_slug)==-1) {
+		showOfflineChatNotificationForSlug(guest_slug);
+  }
   
+	changeContactListVisibility(false);
 }
 
+
+function settingTooltips(){
+  if (mainChatBox == null) {
+    //Enabling default tooltips
+      $(".user_presence a[title]").tooltip();
+  } else {
+    //Enabling tooltips with center left position
+    
+    //Changing Tooltip CSS class by JQuery
+    var ss = document.styleSheets;
+    for (var i=0; i<ss.length; i++) {
+        var rules = ss[i].cssRules || ss[i].rules;
+        for (var j=0; j<rules.length; j++) {
+            if (rules[j].selectorText === ".tooltip") {
+                rules[j].style.background = 'url("black_arrow9.png") repeat scroll 0% 0% transparent'
+            }
+        }
+    } 
+    $(".user_presence a[title]").tooltip({
+      opacity: 0.95,
+      relative: false,
+      position: 'top left',
+      offset: [0,37]
+    });
+  }
+}
+
+
+function changeContactListVisibility(visible){
+  var nItems = $("#search_chat_contact_flexselect_dropdown ul li").length-1;
+	if (visible){
+		  focusSearchContactsFlag=true;
+		  if(nItems > 9){
+				changeMainChatBoxHeight(mainChatBoxHeightWhileSearchContacts);
+			} else {
+				var mainChatBoxMinRequiredHeight= mainChatBoxaddonsHeight + 20 + nItems * 19;
+				changeMainChatBoxHeight(mainChatBoxMinRequiredHeight);
+			}
+			$(".users_connected").hide();
+  } else {
+      changeMainChatBoxHeight(getChatBoxHeightRequiredForConnectionBoxes());
+			$(".users_connected").show();
+  }
+}
+
+
 function setStatusWidgetTitle(status){
   
 	if((status in sstreamChatStatus)){
@@ -179,14 +289,18 @@ function updateChatWindow(){
   $.post("/chatWindow", { userConnected: stropheConnectedAndOnlineStatus }, function(data){
       $(".tooltip").hide() //Prevent tooltips
       $("#chat_partial").html(modifyChatPartialIfMainBox(data));
+			updateConnectedUsersOfMainChatBox();
       if (isStropheConnected()) {
         setStatusWidgetTitle(userStatus);
-        $(".user_presence a[title]").tooltip();
-        setUserFunctions();
-				updateConnectedUsersOfMainChatBox();
+				setUserFunctions();
         if (afterNewConnectionFlag){
           afterNewConnectionFlag = false;
-          restoreChatData();
+					if(afterFirstConnectionFlag){
+						restoreChatData();
+						afterFirstConnectionFlag = false;
+					} else {
+						updateAllNotifications();
+					}
         }
       }
   });
@@ -201,11 +315,23 @@ function getConnectionBoxFromSlug(slug){
 }
 
 var cacheConnectedUsers = [];
+
 function hideConnectionBoxFromSlug(slug){
   if ($('div.user_presence[slug=' + slug + ']').length > 0){
     $('div.user_presence[slug=' + slug + ']').hide();
     if(cacheConnectedUsers.indexOf(slug)==-1){
       cacheConnectedUsers.push(slug);
+    }
+		updateMainChatBoxAfterUserDisconnect();
+		
+		//Last user disconnected?
+		if (getAllConnectedSlugs().length ==0){
+			if($(".users_connected p.zero_users_connected").length > 0){
+				$(".users_connected p.zero_users_connected").show();
+			} else {
+				var msg = '<%=I18n.t('chat.zerousers')%>';
+        $(".users_connected").append('<p class="zero_users_connected">' + msg + '</p>')
+			}
     }
   }
 }
@@ -214,6 +340,7 @@ function showConnectionBoxFromSlug(slug){
   if ($('div.user_presence[slug=' + slug + ']').length > 0){
     if (!($('div.user_presence[slug=' + slug + ']').is(":visible"))){
        $('div.user_presence[slug=' + slug + ']').show();
+			 $(".users_connected p.zero_users_connected").hide();
     }
   }
 }
@@ -229,17 +356,29 @@ function setUserIconStatus(slug, status){
 }
 
 function getAllConnectedSlugs(){
-  connectedSlugs=[];
+  return getAllSlugsByChatConnectedState()[0];
+}
+
+function getAllDisconnectedSlugs(){
+  return getAllSlugsByChatConnectedState()[1];
+}
+
+function getAllSlugsByChatConnectedState(){
+  var onlineSlugs=[];
+	var offlineSlugs=[];
+	var allSlugs=[];
   connectionBoxes = $('div.user_presence[slug]');
   $.each(connectionBoxes, function(index, value) {
-		if($(value).css("display")!="none"){
-          connectedSlugs.push($(value).attr("slug"))
-      }
+    if($(value).css("display")!="none"){
+        onlineSlugs.push($(value).attr("slug"))
+    } else {
+				offlineSlugs.push($(value).attr("slug"))
+		}
+		allSlugs.push($(value).attr("slug"))
   });
-  return connectedSlugs
+  return [onlineSlugs,offlineSlugs,allSlugs]
 }
 
-
 ////////////////////
 //Insert received message in chatbox
 ////////////////////
@@ -293,20 +432,24 @@ function putReceivedMessageOnChatWindow(from_jid,from_slug,body,msgID){
 //Notifications on chat Window
 ////////////////////
 
-function showChatNotificationForSlug(slug,msg){
-  var notification = $("#" + slug).parent().find("div.ui-chatbox-notify");
-  showChatNotification(notification,msg);
-}
-
 function showChatNotification(notification,msg){
   notification.html("<p class==\"ui-chatbox-notify-text\">" + msg + "</p>");
   notification.css("visibility","visible");
   notification.fadeIn();
 }
 
-function hideChatNotificationForSlug(slug){
+function showChatNotificationForSlug(slug,msg){
   var notification = $("#" + slug).parent().find("div.ui-chatbox-notify");
-  hideChatNotification(notification);
+  showChatNotification(notification,msg);
+}
+
+function showOfflineChatNotificationForSlug(slug){
+	var slug_chat_box = getChatBoxForSlug(slug);
+	if(slug_chat_box!=null){
+		var name = slug_chat_box.attr("name")
+    var msg =  name + ' ' + '<%=I18n.t('chat.notify.guestOffline')%>';
+    showChatNotificationForSlug(slug,msg);
+	}
 }
 
 function hideChatNotification(notification){
@@ -314,6 +457,11 @@ function hideChatNotification(notification){
   notification.css("visibility","hidden");
 }
 
+function hideChatNotificationForSlug(slug){
+  var notification = $("#" + slug).parent().find("div.ui-chatbox-notify");
+  hideChatNotification(notification);
+}
+
 function notifyWhenUsersDisconnect(){
   var notification = $("div.ui-chatbox-notify");
   var msg = '<%=I18n.t('chat.notify.offline')%>';
@@ -325,6 +473,17 @@ function hideAllNotifications(){
   hideChatNotification(notification);
 }
 
+function updateAllNotifications(){
+	hideAllNotifications();
+	if(disconnectionFlag){
+		notifyWhenUsersDisconnect();
+	} else {
+		//Notification for offline contacts
+		$.each(getAllDisconnectedSlugsWithChatBoxes(), function(index, value) {
+			showOfflineChatNotificationForSlug(value)
+    }); 
+	}
+}
 
 
 ////////////////////
@@ -332,6 +491,15 @@ function hideAllNotifications(){
 ////////////////////
 
 function updateConnectedUsersOfMainChatBox(){
-	var connectedUsers = getAllConnectedSlugs().length;
-	changeMainChatBoxHeaderTitle( '<%=I18n.t('chat.title')%>' + " (" + connectedUsers + ")");
+  if(mainChatBox!=null){
+    var connectedUsers = getAllConnectedSlugs().length;
+    changeMainChatBoxHeaderTitle( '<%=I18n.t('chat.title')%>' + " (" + connectedUsers + ")");
+    changeMainChatBoxHeight(getChatBoxHeightRequiredForConnectionBoxes());
+  }
 }
+
+
+function updateMainChatBoxAfterUserDisconnect(){
+  changeMainChatBoxHeight(getChatBoxHeightRequiredForConnectionBoxes());
+  updateConnectedUsersOfMainChatBox();
+}

data/app/assets/javascripts/chat_persistence.js

@@ -64,11 +64,19 @@ function storeConversations() {
 
 
 function storeChatConnectionParametres() {
-	if (sessionStorage.getItem("cookie") == null){
-    sessionStorage.setItem("cookie", cookie);
-    sessionStorage.setItem("chat_user_name", user_name);
-    sessionStorage.setItem("chat_user_slug", user_slug);
-    sessionStorage.setItem("chat_user_jid", user_jid);
+	if ((sessionStorage.getItem("cookie") == null)||(sessionStorage.getItem("chat_user_name") == null)){
+		if ((typeof cookie != 'undefined')&&(cookie!=null)){
+			sessionStorage.setItem("cookie", cookie);
+		}
+    if ((typeof user_name != 'undefined') && (user_name != null)) {
+			sessionStorage.setItem("chat_user_name", user_name);
+	  }
+		if ((typeof user_slug != 'undefined') && (user_slug != null)) {
+			sessionStorage.setItem("chat_user_slug", user_slug);
+	  }
+		if ((typeof user_jid != 'undefined') && (user_jid != null)) {
+			sessionStorage.setItem("chat_user_jid", user_jid);
+	  }
 	}	
 }
 
@@ -104,6 +112,7 @@ function getRestoreUserChatStatus(){
 
 
 function restoreChatData(){
+	
   //Check for Session Storage support
   if (! window.sessionStorage){
     return
@@ -162,7 +171,7 @@ function restoreConversations() {
 							 window[getChatVariableFromSlug(guest_slug)].parent().toggle(false);
 						}			
 						if ((visibleMaxSlugs.indexOf(guest_slug)==-1)&&(visibleMinSlugs.indexOf(guest_slug)==-1)){
-              window[getChatVariableFromSlug(guest_slug)].chatbox("option", "boxManager").toggleBox(false);  
+							closeChatBox(guest_slug); 
             }
           } else {
 						//Always created.

data/app/assets/javascripts/chat_utilities.js

@@ -6,6 +6,16 @@ function log(msg) {
     //console.log(msg)
 }
 
+function simulate_new_user_connected(slug) {
+  var stanza_test = '<presence xmlns="jabber:client" from="' + slug + '@localhost/27825459741328802387991286" to="demo@localhost/2517285379132880233667729">'
+  onPresence(stanza_test);
+}
+
+function simulate_new_user_disconnected(slug) {
+  var stanza_test = '<presence xmlns="jabber:client" type="unavailable" from="' + slug + '@localhost/27825459741328802387991286" to="demo@localhost/2517285379132880233667729">'
+  onPresence(stanza_test);
+}
+
 
 ////////////////////
 //Blink page title when focus lost on new messages
@@ -231,6 +241,9 @@ function getNameFromSlug(slug){
 }
 
 
+
+
+
 ////////////////////
 //Next features...
 ////////////////////

data/app/assets/javascripts/chat_window_manager.js

@@ -41,17 +41,7 @@ function createChatBox(guest_slug,guest_name,guest_jid,user_name,user_jid){
 															position: position,
 															priority: visibleChatBoxes.length+1,
 															boxClosed: function(id) {
-                                
-																position = $("#" + guest_slug).chatbox("option", "position");
-																
-																for (i=position+1;i<visibleChatBoxes.length+1;i++){
-																	visibleChatBoxes[i-1].chatbox("option", "offset", visibleChatBoxes[i-1].chatbox("option", "offset") - chatBoxSeparation);
-																	visibleChatBoxes[i-1].chatbox("option", "position", visibleChatBoxes[i-1].chatbox("option", "position") - 1 );
-                                }
-																
-																visibleChatBoxes.splice(position-1,1);
-																$("#" + guest_slug).chatbox("option", "hidden", true);
-																nBox--;
+                                closeChatBox(guest_slug)
 															},
 															
                               messageSent : function(id, user, msg) {
@@ -111,30 +101,73 @@ function getBoxParams(){
 }
 
 
+function closeChatBox(guest_slug){
+	var position = $("#" + guest_slug).chatbox("option", "position");
+                                
+  for (i=position+1;i<visibleChatBoxes.length+1;i++){
+    visibleChatBoxes[i-1].chatbox("option", "offset", visibleChatBoxes[i-1].chatbox("option", "offset") - chatBoxSeparation);
+    visibleChatBoxes[i-1].chatbox("option", "position", visibleChatBoxes[i-1].chatbox("option", "position") - 1 );
+  }
+  
+  visibleChatBoxes.splice(position-1,1);
+  $("#" + guest_slug).chatbox("option", "hidden", true);
+  nBox--;
+}
+
+
 function getChatVariableFromSlug(slug){
 	return "slug_" + slug;
 }
 
-
 function getSlugFromChatVariable(variable){
 	return variable.split("_")[1];
 }
 
 function getVisibleChatBoxes(){
-	
 	for(i=0; i<visibleChatBoxes.length; i++){
 		if (visibleChatBoxes[i][0].id==chatSlugId){
       visibleChatBoxes.splice(i,1)
     }
 	}
-	
 	return visibleChatBoxes
 }
 
+
 function getAllChatBoxes(){
   return $(".chatbox").not(document.getElementById(chatSlugId))
 }
 
+function getChatBoxForSlug(slug){
+  if (typeof window[getChatVariableFromSlug(slug)] == 'undefined') {
+		return null;
+  } else {
+		return window[getChatVariableFromSlug(slug)];
+	}
+}
+
+
+function getAllSlugsWithChatBoxes(){
+	var slugsWithChatBox = [];
+	$.each(getAllChatBoxes(), function(index, value) {
+    slugsWithChatBox.push($(value).attr("id"))
+  });
+	return  slugsWithChatBox;
+}
+
+function getAllDisconnectedSlugsWithChatBoxes(){
+  var slugsWithChatBox = getAllSlugsWithChatBoxes();
+	var slugsConnected = getAllConnectedSlugs();
+	var allDisconnectedSlugsWithChatBox = [];
+	
+	$.each(slugsWithChatBox, function(index, value) {
+		if (slugsConnected.indexOf(value)==-1){
+			allDisconnectedSlugsWithChatBox.push(value);
+		}
+  });
+	return allDisconnectedSlugsWithChatBox;
+}
+
+
 ////////////////////
 //Box replacement
 ////////////////////
@@ -211,6 +244,14 @@ function getVideoEmbedForSlug(slug){
 ///////////////////////////
 
 var mainChatBox;
+var connectionBoxesForFile=5;
+var maxConnectionChatBoxesFilesWithoutOverflow = 11;
+var mainChatBoxWidth=150;
+var mainChatBoxaddonsHeight=50;
+var heightForConnectionBoxFile=30;
+var mainChatBoxHeightWhileSearchContacts=260;
+var mainChatBoxMinHeight=136;
+var mainChatBoxMaxHeight= mainChatBoxaddonsHeight + heightForConnectionBoxFile*maxConnectionChatBoxesFilesWithoutOverflow;
 var chatSlugId="SocialStream_MainChat";
 
 function createMainChatBox(){
@@ -233,22 +274,23 @@ function createMainChatBox(){
 			$(mainChatBox.parent()).find(".ui-chatbox-input").remove();
 			
 			//Set height
-			window[getChatVariableFromSlug(chatSlugId)].css( "height", "180" ); 
+			changeMainChatBoxHeight(getChatBoxHeightRequiredForConnectionBoxes());
 			
 			//Set width
-			var windowWidth=150;
-			window[getChatVariableFromSlug(chatSlugId)].parent().parent().css( "width", windowWidth );
-			$(mainChatBox.parent().parent()).find(".ui-chatbox-titlebar").css( "width", windowWidth-6 );
-			$(mainChatBox).css( "width", windowWidth-6 );
+			window[getChatVariableFromSlug(chatSlugId)].parent().parent().css( "width", mainChatBoxWidth );
+			$(mainChatBox.parent().parent()).find(".ui-chatbox-titlebar").css( "width", mainChatBoxWidth-6 );
+			$(mainChatBox).css( "width", mainChatBoxWidth-6 );
 			
 			
 			//Adjust window offset
-			offsetForFlowBox = 235-windowWidth;
+			offsetForFlowBox = 235-mainChatBoxWidth;
 			
 			//CSS Adjusts
 			$("#chat_partial").css("margin-top",-3)
       $("#chat_partial").css("margin-left",-3)
 			$(".dropdown dd ul").css("min-width",147) 
+			$(mainChatBox).css('overflow-x','hidden')
+      $(mainChatBox).css('overflow-y','hidden')
 			
 			//Header title
 			updateConnectedUsersOfMainChatBox();
@@ -280,3 +322,42 @@ function changeMainChatBoxHeaderTitle(title){
   	$($(mainChatBox.parent().parent()).find(".ui-chatbox-titlebar").find("span")[0]).html(title);
   }
 }
+
+
+function changeMainChatBoxHeight(height){
+	if (mainChatBox != null) {
+		
+		if(($("#search_chat_contact_flexselect").is(":focus"))&&(! (focusSearchContactsFlag))){
+			return;
+		} else {
+			focusSearchContactsFlag=false;
+		}
+		
+		if(height > mainChatBoxMaxHeight){
+      //overflow = true;
+			height = mainChatBoxMaxHeight;
+      $(mainChatBox).css('overflow-y','visible');
+      mainChatBox.chatbox("option", "offset","5px")
+      mainChatBox.chatbox("option", "width", mainChatBoxWidth + 5)
+    } else {
+      $(mainChatBox).css('overflow-y','hidden');
+      mainChatBox.chatbox("option", "offset","0px")
+      mainChatBox.chatbox("option", "width",mainChatBoxWidth)
+			height = Math.max(height,mainChatBoxMinHeight)
+    }
+		
+  	window[getChatVariableFromSlug(chatSlugId)].css("height", height);
+  }
+}
+
+
+function getChatBoxHeightRequiredForConnectionBoxes(){
+	if(mainChatBox!=null){
+	  var desiredHeight = mainChatBoxaddonsHeight + Math.ceil(getAllConnectedSlugs().length/connectionBoxesForFile) * heightForConnectionBoxFile;
+	  return desiredHeight;
+	} else {
+		return null;
+	}
+}
+
+