Department List Demo

This demo shows you how to use monitor tag and render department list directly.

Use chatapi.aspx to embed monitor tag and hide button/link/box.
Use ZChat.Departments method to get all departments of your account.
Use ZChat.Departments[i].Agents[j].Online method to determine whether the agent of Departments[i] is online.
Use ZChat_OpenDialog() method to show the chat dialog or offline message window.

{=/HttpContext/Request/Form/@scriptcode}
<div id="groupcontainer" ></div>
<script type="text/javascript">
function ZChat_OnInit() {
	var html="Department List :";
    for(var i=0; i<ZChat.Departments.length; i++)
    {
      var Department = ZChat.Departments[i];
      var csstext = "color:gray;";
      var tooltip = "No agent online";
      var deptonline = false;
      for(var j=0;j<Department.Agents.length; j++)
      {
        var Agent = Department.Agents[j];					
        if(!Agent.Online)continue;
          deptonline = true;
          break;
      }
      if(deptonline) 
      {
        csstext = "color:black;";
        tooltip = "Online";
      }        
      html+="  <a href='#' style='"+csstext+"' title='"+tooltip+"' onclick='ZChat_SetDepartment(\""+Department.Name+"\");ZChat_OpenDialog();'>";
      html+=Department.Name;
      html+="</a>";
    }
	document.getElementById("groupcontainer").innerHTML=html;
}
</script>
<script type="text/javascript" defer="defer" src='{^/Controller/UrlBase}/chatapi.aspx?hccid={^/Controller/HCCID}'></script>

{^helper:FixChromeScript(/HttpContext/Request/Form/@scriptcode)}