Agent List Demo

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

Use chatapi.aspx to embed monitor tag and hide button/link/box.
Use ZChat.Departments[i].Agents method to get all agents of the specific department.
Use ZChat.Departments[i].Agents[j].Online method to determine whether the specific agent is online or not.
Integrate online and offline agents to web site page
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 apiagents = [];
    var apiagentsonline = [];
    var apiagentsoffline = [];
    for(var i=0; i<ZChat.Departments.length; i++)
    {
      var Department = ZChat.Departments[i];
      if(Department.Agents.length==0)continue;
      for(var j=0;j<Department.Agents.length; j++)
      {
        var Agent = Department.Agents[j];
        Agent.DeptpartmentName = Department.Name;
        apiagents.push(Agent);
        if(Agent.Online)
          apiagentsonline.push(Agent);
        else
          apiagentsoffline.push(Agent);
      }
    }
    var html="";
    var csstext = "color:black;"
	var departmentname =  "";
    for(var i=0; i<apiagentsonline.length; i++)
    {
      if(i==0)document.write("<b>Online agents :</b> ");
      var Agent = apiagentsonline[i];
      if(departmentname!=Agent.DeptpartmentName)
      {
        departmentname = Agent.DeptpartmentName;
        document.write("<b>"+departmentname+" : </b>");
      }
      html+="<a href='#' style='"+csstext+"' onclick='ZChat_OpenDialog"+"();'>";
      html+=Agent.Name;
      html+="</a>  ";
    }

csstext = "color:gray;"
    departmentname =  "";
    for(var i=0; i<apiagentsoffline.length; i++)
    {
      if(i==0)document.write("<br/><b>Offline agents :</b> ");
      var Agent = apiagentsoffline[i];
      if(departmentname!=Agent.DeptpartmentName)
      {
        departmentname = Agent.DeptpartmentName;
        document.write("<b>"+departmentname+" : </b>");
      }
      html+="  <a href='#' style='"+csstext+"' onclick='ZChat_OpenDialog"+"();'>";
      html+=Agent.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)}