Index: lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/PermissionGateDTO.java
===================================================================
diff -u
--- lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/PermissionGateDTO.java	(revision 0)
+++ lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/PermissionGateDTO.java	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,81 @@
+package org.lamsfoundation.lams.monitoring.dto;
+
+import org.lamsfoundation.lams.learningdesign.Activity;
+
+/**
+ * DTO used to return the activity details needed for the contribute activities list
+ *
+ * @author Andrey Balan
+ */
+public class PermissionGateDTO {
+
+    private String title;
+    private String url;
+    private Long activityID;
+    private Integer activityTypeID;
+    private Integer orderID;
+    private int waitingLearnersCount;
+    private boolean complete;
+
+    public PermissionGateDTO(Activity activity) {
+	this.title = activity.getTitle();
+	this.activityID = activity.getActivityId();
+    }
+
+    /**
+     * @return Returns the activityID.
+     */
+    public Long getActivityID() {
+	return activityID;
+    }
+
+    /**
+     * @return Returns the activityTypeID.
+     */
+    public Integer getActivityTypeID() {
+	return activityTypeID;
+    }
+
+    /**
+     * @return Returns the description.
+     */
+    public String getUrl() {
+	return url;
+    }
+
+    public void setUrl(String url) {
+	this.url = url;
+    }
+
+    /**
+     * @return Returns the orderID.
+     */
+    public Integer getOrderID() {
+	return orderID;
+    }
+
+    /**
+     * @return Returns the title.
+     */
+    public String getTitle() {
+	return title;
+
+    }
+
+    public int getWaitingLearnersCount() {
+	return waitingLearnersCount;
+    }
+
+    public void setWaitingLearnersCount(int waitingLearnersCount) {
+	this.waitingLearnersCount = waitingLearnersCount;
+    }
+
+    public boolean isComplete() {
+	return complete;
+    }
+
+    public void setComplete(boolean complete) {
+	this.complete = complete;
+    }
+
+}
Index: lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/TblGroupDTO.java
===================================================================
diff -u
--- lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/TblGroupDTO.java	(revision 0)
+++ lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/TblGroupDTO.java	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,92 @@
+package org.lamsfoundation.lams.monitoring.dto;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import org.lamsfoundation.lams.learningdesign.Group;
+import org.lamsfoundation.lams.util.AlphanumComparator;
+
+public class TblGroupDTO implements Comparable {
+
+    private Long groupID;
+    private String groupName;
+    private int orderID;
+    private List<TblUserDTO> userList;
+
+    private TblUserDTO groupLeader;
+
+    private Double traScore;
+
+    /**
+     * Get the DTO for this group. Does not include the GroupBranchActivities as they will be in a separate array for
+     * Flash.
+     *
+     * @param group
+     */
+    @SuppressWarnings("unchecked")
+    public TblGroupDTO(Group group) {
+	groupID = group.getGroupId();
+	groupName = group.getGroupName();
+	orderID = group.getOrderId();
+	userList = new ArrayList<TblUserDTO>();
+    }
+
+    @Override
+    public int compareTo(Object o) {
+	TblGroupDTO castOther = (TblGroupDTO) o;
+
+	String grp1Name = castOther != null && castOther.getGroupName() != null ? castOther.getGroupName() : "";
+	String grp2Name = this.groupName != null ? this.groupName : "";
+
+	AlphanumComparator comparator = new AlphanumComparator();
+	return -comparator.compare(grp1Name, grp2Name);
+    }
+
+    public Long getGroupID() {
+	return groupID;
+    }
+
+    public void setGroupID(Long groupID) {
+	this.groupID = groupID;
+    }
+
+    public String getGroupName() {
+	return groupName;
+    }
+
+    public void setGroupName(String groupName) {
+	this.groupName = groupName;
+    }
+
+    public int getOrderID() {
+	return orderID;
+    }
+
+    public void setOrderID(int orderID) {
+	this.orderID = orderID;
+    }
+
+    public List<TblUserDTO> getUserList() {
+	return userList;
+    }
+
+    public void setUserList(List<TblUserDTO> userList) {
+	this.userList = userList;
+    }
+
+    public TblUserDTO getGroupLeader() {
+	return groupLeader;
+    }
+
+    public void setGroupLeader(TblUserDTO groupLeader) {
+	this.groupLeader = groupLeader;
+    }
+
+    public void setTraScore(Double traScore) {
+	this.traScore = traScore;
+    }
+
+    public Double getTraScore() {
+	return traScore;
+    }
+}
Index: lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/TblUserDTO.java
===================================================================
diff -u
--- lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/TblUserDTO.java	(revision 0)
+++ lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/dto/TblUserDTO.java	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,32 @@
+package org.lamsfoundation.lams.monitoring.dto;
+
+import org.lamsfoundation.lams.usermanagement.dto.UserDTO;
+
+public class TblUserDTO extends UserDTO {
+
+    private boolean groupLeader;
+    private Double iraScore;
+
+    public TblUserDTO(UserDTO userDto) {
+	super(userDto.getUserID(), userDto.getFirstName(), userDto.getLastName(), userDto.getLocaleCountry(),
+		userDto.getLocaleLanguage(), userDto.getLocaleCountry(), userDto.getDirection(), userDto.getEmail(),
+		userDto.getTheme(), userDto.getTimeZone(), null, null, null, null, null, null, userDto.getPortraitUuid());
+    }
+
+    public void setGroupLeader(boolean groupLeader) {
+	this.groupLeader = groupLeader;
+    }
+
+    public boolean isGroupLeader() {
+	return groupLeader;
+    }
+
+    public void setIraScore(Double iraScore) {
+	this.iraScore = iraScore;
+    }
+
+    public Double getIraScore() {
+	return iraScore;
+    }
+
+}
Index: lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/web/TblMonitoringAction.java
===================================================================
diff -u
--- lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/web/TblMonitoringAction.java	(revision 0)
+++ lams_monitoring/src/java/org/lamsfoundation/lams/monitoring/web/TblMonitoringAction.java	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,435 @@
+package org.lamsfoundation.lams.monitoring.web;
+
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.HashSet;
+import java.util.LinkedList;
+import java.util.List;
+import java.util.Set;
+import java.util.TreeSet;
+
+import javax.servlet.ServletContext;
+import javax.servlet.ServletException;
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+
+import org.apache.commons.lang.StringEscapeUtils;
+import org.apache.log4j.Logger;
+import org.apache.struts.action.ActionForm;
+import org.apache.struts.action.ActionForward;
+import org.apache.struts.action.ActionMapping;
+import org.lamsfoundation.lams.gradebook.GradebookUserActivity;
+import org.lamsfoundation.lams.gradebook.service.IGradebookService;
+import org.lamsfoundation.lams.learningdesign.Activity;
+import org.lamsfoundation.lams.learningdesign.ActivityOrderComparator;
+import org.lamsfoundation.lams.learningdesign.BranchingActivity;
+import org.lamsfoundation.lams.learningdesign.ComplexActivity;
+import org.lamsfoundation.lams.learningdesign.ContributionTypes;
+import org.lamsfoundation.lams.learningdesign.GateActivity;
+import org.lamsfoundation.lams.learningdesign.Group;
+import org.lamsfoundation.lams.learningdesign.Grouping;
+import org.lamsfoundation.lams.learningdesign.GroupingActivity;
+import org.lamsfoundation.lams.learningdesign.SequenceActivity;
+import org.lamsfoundation.lams.learningdesign.ToolActivity;
+import org.lamsfoundation.lams.learningdesign.Transition;
+import org.lamsfoundation.lams.learningdesign.dao.IActivityDAO;
+import org.lamsfoundation.lams.lesson.Lesson;
+import org.lamsfoundation.lams.lesson.service.ILessonService;
+import org.lamsfoundation.lams.monitoring.dto.ContributeActivityDTO;
+import org.lamsfoundation.lams.monitoring.dto.PermissionGateDTO;
+import org.lamsfoundation.lams.monitoring.dto.TblGroupDTO;
+import org.lamsfoundation.lams.monitoring.dto.TblUserDTO;
+import org.lamsfoundation.lams.monitoring.service.IMonitoringService;
+import org.lamsfoundation.lams.tool.ToolSession;
+import org.lamsfoundation.lams.tool.service.ILamsCoreToolService;
+import org.lamsfoundation.lams.tool.service.ILamsToolService;
+import org.lamsfoundation.lams.usermanagement.User;
+import org.lamsfoundation.lams.util.CentralConstants;
+import org.lamsfoundation.lams.util.WebUtil;
+import org.lamsfoundation.lams.web.action.LamsDispatchAction;
+import org.lamsfoundation.lams.web.util.AttributeNames;
+import org.springframework.web.context.WebApplicationContext;
+import org.springframework.web.context.support.WebApplicationContextUtils;
+
+/**
+ * Displays TBL monitor.
+ *
+ * @author Andrey Balan
+ */
+public class TblMonitoringAction extends LamsDispatchAction {
+
+    private static Logger log = Logger.getLogger(TblMonitoringAction.class);
+
+    private static ILessonService lessonService;
+    private static IMonitoringService monitoringService;
+    private static ILamsCoreToolService coreToolService;
+    private static ILamsToolService toolService;
+    private static IActivityDAO activityDAO;
+    private static IGradebookService gradebookService;
+    
+    /**
+     * Displays addStudent page. 
+     */
+    public ActionForward unspecified(ActionMapping mapping, ActionForm form, HttpServletRequest request,
+	    HttpServletResponse response) throws Exception {
+	initServices();
+
+	long lessonId = WebUtil.readLongParam(request, AttributeNames.PARAM_LESSON_ID);
+	Lesson lesson = lessonService.getLesson(lessonId);
+	request.setAttribute("lesson", lesson);
+	request.setAttribute("totalLearnersNumber", lesson.getAllLearners().size());
+
+	List<Activity> lessonActivities = getLessonActivities(lesson);
+	setupAvailableActivityTypes(request, lessonActivities);
+	return mapping.findForward("tblmonitor");
+    }
+
+    /**
+     * Shows Teams page
+     */
+    public ActionForward teams(ActionMapping mapping, ActionForm form, HttpServletRequest request,
+	    HttpServletResponse response) throws IOException, ServletException {
+
+	long lessonId = WebUtil.readLongParam(request, AttributeNames.PARAM_LESSON_ID);
+	Lesson lesson = lessonService.getLesson(lessonId);
+
+	List<Activity> lessonActivities = getLessonActivities(lesson);
+	setupAvailableActivityTypes(request, lessonActivities);
+	boolean isScratchieAvailable = (request.getAttribute("isScratchieAvailable") != null)
+		&& ((Boolean) request.getAttribute("isScratchieAvailable"));
+	boolean isIraMcqAvailable = (request.getAttribute("isIraMcqAvailable") != null)
+		&& ((Boolean) request.getAttribute("isIraMcqAvailable"));
+	boolean isIraAssessmentAvailable = (request.getAttribute("isIraAssessmentAvailable") != null)
+		&& ((Boolean) request.getAttribute("isIraAssessmentAvailable"));
+	Long iraToolActivityId = request.getAttribute("iraToolActivityId") == null ? null
+		: (Long) request.getAttribute("iraToolActivityId");
+	Long traToolActivityId = request.getAttribute("traToolActivityId") == null ? null
+		: (Long) request.getAttribute("traToolActivityId");
+	Long leaderselectionToolActivityId = request.getAttribute("leaderselectionToolActivityId") == null ? null
+		: (Long) request.getAttribute("leaderselectionToolActivityId");
+
+	//get all mcq and assessment scores
+	List<GradebookUserActivity> iraGradebookUserActivities = new LinkedList<>();
+	List<GradebookUserActivity> traGradebookUserActivities = new LinkedList<>();
+	if (isIraMcqAvailable || isIraAssessmentAvailable) {
+	    iraGradebookUserActivities = gradebookService.getGradebookUserActivities(iraToolActivityId);
+	} 
+	if (isScratchieAvailable) {
+	    traGradebookUserActivities = gradebookService.getGradebookUserActivities(traToolActivityId);
+	}
+	
+	Set<Long> leaderUserIds = leaderselectionToolActivityId == null ? new HashSet<Long>()
+		: toolService.getLeaderUserId(leaderselectionToolActivityId);
+
+	GroupingActivity groupingActivity = getGroupingActivity(lesson);
+	Grouping grouping = groupingActivity == null ? null : groupingActivity.getCreateGrouping();
+	Set<Group> groups = grouping == null ? null : grouping.getGroups();
+	
+	Set<TblGroupDTO> groupDtos = new TreeSet<TblGroupDTO>();
+	if (groups != null) {
+	    for (Group group : groups) {
+		TblGroupDTO groupDto = new TblGroupDTO(group);
+		groupDtos.add(groupDto);
+
+		if (group.getUsers() != null) {
+		    for (User user : group.getUsers()) {
+			TblUserDTO userDto = new TblUserDTO(user.getUserDTO());
+			groupDto.getUserList().add(userDto);
+
+			//set up all user leaders
+			if (leaderUserIds.contains(new Long(user.getUserId()))) {
+			    userDto.setGroupLeader(true);
+			    groupDto.setGroupLeader(userDto);
+			}
+
+			if (isIraMcqAvailable || isIraAssessmentAvailable) {
+			    //find according iraGradebookUserActivity
+			    for (GradebookUserActivity iraGradebookUserActivity : iraGradebookUserActivities) {
+				if (iraGradebookUserActivity.getLearner().getUserId().equals(user.getUserId())) {
+				    userDto.setIraScore(iraGradebookUserActivity.getMark());
+				    break;
+				}
+			    }
+			}
+			
+			if (isScratchieAvailable) {
+			    //find according traGradebookUserActivity
+			    for (GradebookUserActivity traGradebookUserActivity : traGradebookUserActivities) {
+				if (traGradebookUserActivity.getLearner().getUserId().equals(user.getUserId())) {
+				    //we set traScore multiple times, but it's doesn't matter
+				    groupDto.setTraScore(traGradebookUserActivity.getMark());
+				    break;
+				}
+			    }			    
+			}
+		    }
+		}
+	    }
+	}
+	request.setAttribute("groupDtos", groupDtos);
+
+	return mapping.findForward("teams");
+    }
+
+    /**
+     * Shows Gates page
+     */
+    public ActionForward gates(ActionMapping mapping, ActionForm form, HttpServletRequest request,
+	    HttpServletResponse response) throws IOException, ServletException {
+	long lessonId = WebUtil.readLongParam(request, AttributeNames.PARAM_LESSON_ID);
+
+	List<PermissionGateDTO> permissionGates = new ArrayList<PermissionGateDTO>();
+
+	List<ContributeActivityDTO> contributeActivities = monitoringService.getAllContributeActivityDTO(lessonId);
+	if (contributeActivities != null) {
+	    for (ContributeActivityDTO contributeActivity : contributeActivities) {
+
+		if (contributeActivity.getContributeEntries() != null) {
+
+		    //check if there is any persmission gates entries
+		    for (ContributeActivityDTO.ContributeEntry contributeEntry : contributeActivity
+			    .getContributeEntries()) {
+			if (ContributionTypes.PERMISSION_GATE.equals(contributeEntry.getContributionType())) {
+
+			    Long activityId = contributeActivity.getActivityID();
+			    Activity activity = monitoringService.getActivityById(activityId);
+			    PermissionGateDTO gateDto = new PermissionGateDTO(activity);
+
+			    gateDto.setUrl(contributeEntry.getURL());
+			    gateDto.setComplete(contributeEntry.getIsComplete());
+
+			    int waitingLearnersCount = lessonService.getCountLearnersHaveAttemptedActivity(activity);
+			    gateDto.setWaitingLearnersCount(waitingLearnersCount);
+
+			    permissionGates.add(gateDto);
+			    break;
+			}
+		    }
+		}
+	    }
+	}
+
+	request.setAttribute("permissionGates", permissionGates);
+	return mapping.findForward("gates");
+    }
+    
+    /**
+     * Shows forum page
+     */
+    public ActionForward forum(ActionMapping mapping, ActionForm form, HttpServletRequest request,
+	    HttpServletResponse response) throws IOException, ServletException {
+	
+	long forumActivityId = WebUtil.readLongParam(request, "activityId");
+	ToolActivity forumActivity = (ToolActivity) monitoringService.getActivityById(forumActivityId);
+	
+	int attemptedLearnersNumber = lessonService.getCountLearnersHaveAttemptedActivity(forumActivity);
+	request.setAttribute("attemptedLearnersNumber", attemptedLearnersNumber);
+
+	Set<ToolSession> toolSessions = forumActivity.getToolSessions();
+	request.setAttribute("toolSessions", toolSessions);
+
+	return mapping.findForward("forum");
+    }
+
+    /**
+     * Shows sequence diagram page
+     */
+    public ActionForward sequence(ActionMapping mapping, ActionForm form, HttpServletRequest request,
+	    HttpServletResponse response) throws IOException, ServletException {
+	long lessonId = WebUtil.readLongParam(request, AttributeNames.PARAM_LESSON_ID);
+	Lesson lesson = lessonService.getLesson(lessonId);
+	request.setAttribute("lesson", lesson);
+	return mapping.findForward("sequence");
+    }
+
+    /**
+     * Returns lesson activities sorted by the learning design order. 
+     */
+    @SuppressWarnings("unchecked")
+    private List<Activity> getLessonActivities(Lesson lesson) {
+
+	/*
+	 * Hibernate CGLIB is failing to load the first activity in the sequence as a ToolActivity for some mysterious
+	 * reason Causes a ClassCastException when you try to cast it, even if it is a ToolActivity.
+	 *
+	 * THIS IS A HACK to retrieve the first tool activity manually so it can be cast as a ToolActivity - if it is
+	 * one
+	 */
+	Activity firstActivity = activityDAO
+		.getActivityByActivityId(lesson.getLearningDesign().getFirstActivity().getActivityId());
+	List<Activity> activities = new ArrayList<Activity>();
+	sortActivitiesByLearningDesignOrder(firstActivity, activities);
+
+	return activities;
+    }
+    
+    /**
+     * Sort all activities by the learning design order.
+     * 
+     * @param activity
+     * @param sortedActivities
+     */
+    private void sortActivitiesByLearningDesignOrder(Activity activity, List<Activity> sortedActivities) {
+	sortedActivities.add(activity);
+
+	//in case of branching activity - add all activities based on their orderId
+	if (activity.isBranchingActivity()) {
+	    BranchingActivity branchingActivity = (BranchingActivity) activity;
+	    Set<SequenceActivity> sequenceActivities = new TreeSet<SequenceActivity>(new ActivityOrderComparator());
+	    sequenceActivities.addAll(branchingActivity.getActivities());
+	    for (Activity sequenceActivityNotInitialized : sequenceActivities) {
+		SequenceActivity sequenceActivity = (SequenceActivity) monitoringService
+			.getActivityById(sequenceActivityNotInitialized.getActivityId());
+		Set<Activity> childActivities = new TreeSet<Activity>(new ActivityOrderComparator());
+		childActivities.addAll(sequenceActivity.getActivities());
+
+		//add one by one in order to initialize all activities
+		for (Activity childActivity : childActivities) {
+		    Activity activityInit = monitoringService.getActivityById(childActivity.getActivityId());
+		    sortedActivities.add(activityInit);
+		}
+	    }
+
+	    // In case of complex activity (parallel, help or optional activity) add all its children activities.
+	    // They will be sorted by orderId
+	} else if (activity.isComplexActivity()) {
+	    ComplexActivity complexActivity = (ComplexActivity) activity;
+	    Set<Activity> childActivities = new TreeSet<Activity>(new ActivityOrderComparator());
+	    childActivities.addAll(complexActivity.getActivities());
+
+	    // add one by one in order to initialize all activities
+	    for (Activity childActivity : childActivities) {
+		Activity activityInit = monitoringService.getActivityById(childActivity.getActivityId());
+		sortedActivities.add(activityInit);
+	    }
+	}
+
+	Transition transitionFrom = activity.getTransitionFrom();
+	if (transitionFrom != null) {
+	    // query activity from DB as transition holds only proxied activity object
+	    Long nextActivityId = transitionFrom.getToActivity().getActivityId();
+	    Activity nextActivity = monitoringService.getActivityById(nextActivityId);
+
+	    sortActivitiesByLearningDesignOrder(nextActivity, sortedActivities);
+	}
+    }
+
+    private GroupingActivity getGroupingActivity(Lesson lesson) {
+	Set<Activity> activities = new TreeSet<Activity>();
+
+	/*
+	 * Hibernate CGLIB is failing to load the first activity in the sequence as a ToolActivity for some mysterious
+	 * reason Causes a ClassCastException when you try to cast it, even if it is a ToolActivity.
+	 *
+	 * THIS IS A HACK to retrieve the first tool activity manually so it can be cast as a ToolActivity - if it is
+	 * one
+	 */
+	Activity firstActivity = monitoringService
+		.getActivityById(lesson.getLearningDesign().getFirstActivity().getActivityId());
+	activities.add(firstActivity);
+	activities.addAll(lesson.getLearningDesign().getActivities());
+
+	for (Activity activity : activities) {
+	    if (activity instanceof GroupingActivity) {
+		return (GroupingActivity) activity;
+	    }
+	}
+
+	return null;
+    }
+
+    private void setupAvailableActivityTypes(HttpServletRequest request, List<Activity> activities) {
+
+	boolean scratchiePassed = false;
+	boolean iraPassed = false;
+	String assessmentToolContentIds = "";
+	String assessmentActivityTitles = "";
+	for (Activity activity : activities) {
+	    if (activity instanceof ToolActivity) {
+		ToolActivity toolActivity = (ToolActivity) activity;
+		String toolSignature = toolActivity.getTool().getToolSignature();
+		Long toolContentId = toolActivity.getToolContentId();
+		Long toolActivityId = toolActivity.getActivityId();
+		String toolTitle = toolActivity.getTitle();
+
+		//count only the first MCQ or Assessmnet as iRA
+		if (!iraPassed && (CentralConstants.TOOL_SIGNATURE_MCQ.equals(toolSignature)
+			|| CentralConstants.TOOL_SIGNATURE_ASSESSMENT.equals(toolSignature))) {
+		    iraPassed = true;
+		    if (CentralConstants.TOOL_SIGNATURE_MCQ.equals(toolSignature)) {
+			request.setAttribute("isIraMcqAvailable", true);
+			
+		    } else {
+			request.setAttribute("isIraAssessmentAvailable", true);
+			request.setAttribute("iraAssessmentActivityTitle", toolTitle);
+		    }
+		    request.setAttribute("iraToolContentId", toolContentId);
+		    request.setAttribute("iraToolActivityId", toolActivityId);
+		    
+		    continue;
+		}
+		
+		//aes are counted only after Scratchie activity
+		if (scratchiePassed && CentralConstants.TOOL_SIGNATURE_ASSESSMENT.equals(toolSignature)) {
+		    request.setAttribute("isAeAvailable", true);
+		    //prepare assessment details to be passed to Assessment tool
+		    assessmentToolContentIds += toolContentId + ",";
+		    assessmentActivityTitles += toolTitle + "\\,";
+
+		} else if (CentralConstants.TOOL_SIGNATURE_FORUM.equals(toolSignature)) {
+		    request.setAttribute("isForumAvailable", true);
+		    request.setAttribute("forumActivityId", toolActivityId);
+
+		//tRA is the first scratchie activity
+		} else if (!scratchiePassed && CentralConstants.TOOL_SIGNATURE_SCRATCHIE.equals(toolSignature)) {
+		    scratchiePassed = true;
+			
+		    request.setAttribute("isScratchieAvailable", true);
+		    request.setAttribute("traToolContentId", toolContentId);
+		    request.setAttribute("traToolActivityId", toolActivityId);
+		}
+		
+		if (CentralConstants.TOOL_SIGNATURE_LEADERSELECTION.equals(toolSignature)) {
+		    request.setAttribute("leaderselectionToolActivityId", toolActivityId);
+		    request.setAttribute("leaderselectionToolContentId", toolContentId);
+		}
+
+	    } else if (activity instanceof GateActivity) {
+		request.setAttribute("isGatesAvailable", true);
+	    }
+	}
+	
+	request.setAttribute("assessmentToolContentIds", assessmentToolContentIds);
+	request.setAttribute("assessmentActivityTitles", assessmentActivityTitles);
+    }
+
+    private void initServices() {
+	ServletContext servletContext = this.getServlet().getServletContext();
+	WebApplicationContext ctx = WebApplicationContextUtils.getRequiredWebApplicationContext(servletContext);
+	if (lessonService == null) {
+	    lessonService = (ILessonService) ctx.getBean("lessonService");
+	}
+
+	if (monitoringService == null) {
+	    monitoringService = (IMonitoringService) ctx.getBean("monitoringService");
+	}
+
+	if (coreToolService == null) {
+	    coreToolService = (ILamsCoreToolService) ctx.getBean("lamsCoreToolService");
+	}
+	
+	if (toolService == null) {
+	    toolService = (ILamsToolService) ctx.getBean("lamsToolService");
+	}
+
+	if (activityDAO == null) {
+	    activityDAO = (IActivityDAO) ctx.getBean("activityDAO");
+	}
+
+	if (gradebookService == null) {
+	    gradebookService = (IGradebookService) ctx.getBean("gradebookService");
+	}
+
+    }
+
+}
Index: lams_monitoring/web/WEB-INF/struts-config.xml
===================================================================
diff -u -r225d293907a5e2976e367ee3aa790239bad38699 -rd7ed1173946998f754a2efef09d68c9e3bfe307f
--- lams_monitoring/web/WEB-INF/struts-config.xml	(.../struts-config.xml)	(revision 225d293907a5e2976e367ee3aa790239bad38699)
+++ lams_monitoring/web/WEB-INF/struts-config.xml	(.../struts-config.xml)	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -177,6 +177,39 @@
         redirect="false"
       />
     </action>
+	<action
+      path="/tblmonitor"
+      type="org.lamsfoundation.lams.monitoring.web.TblMonitoringAction"
+      parameter="method"
+      unknown="false"
+      validate="false"
+    >
+      <forward
+        name="tblmonitor"
+        path="/tblmonitor/tblmonitor.jsp"
+        redirect="false"
+      />
+      <forward
+        name="teams"
+        path="/tblmonitor/teams.jsp"
+        redirect="false"
+      />
+      <forward
+        name="gates"
+        path="/tblmonitor/gates.jsp"
+        redirect="false"
+      />
+      <forward
+        name="forum"
+        path="/tblmonitor/forum.jsp"
+        redirect="false"
+      />
+      <forward
+        name="sequence"
+        path="/tblmonitor/sequence.jsp"
+        redirect="false"
+      />
+    </action>
     <action
       path="/toolBranching"
       type="org.lamsfoundation.lams.monitoring.web.ToolOutputBranchingAction"
Index: lams_monitoring/web/WEB-INF/web.xml
===================================================================
diff -u -r2a70ed7d169b7c8fe70237c266eb6194f3392164 -rd7ed1173946998f754a2efef09d68c9e3bfe307f
--- lams_monitoring/web/WEB-INF/web.xml	(.../web.xml)	(revision 2a70ed7d169b7c8fe70237c266eb6194f3392164)
+++ lams_monitoring/web/WEB-INF/web.xml	(.../web.xml)	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -220,6 +220,21 @@
 			<role-name>SYSADMIN</role-name>
 		</auth-constraint>
 	</security-constraint>
+	<security-constraint>
+		<web-resource-collection>
+			<web-resource-name>TBL Monitor interface</web-resource-name>
+			<url-pattern>/tblmonitor.do</url-pattern>
+			<http-method>GET</http-method>
+ 			<http-method>POST</http-method>
+		</web-resource-collection>
+		<auth-constraint>
+			<!-- Author can preview the lesson -->
+			<role-name>MONITOR</role-name>
+			<role-name>GROUP ADMIN</role-name>
+			<role-name>GROUP MANAGER</role-name>
+			<role-name>SYSADMIN</role-name>
+		</auth-constraint>
+	</security-constraint>
 
 	<!-- Login Configuration -->
 	<login-config>
Index: lams_monitoring/web/css/tblmonitor.scss
===================================================================
diff -u
--- lams_monitoring/web/css/tblmonitor.scss	(revision 0)
+++ lams_monitoring/web/css/tblmonitor.scss	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,400 @@
+/*!
+ * Start Bootstrap - Simple Sidebar HTML Template (http://startbootstrap.com)
+ * Code licensed under the Apache License v2.0.
+ * For details, see http://www.apache.org/licenses/LICENSE-2.0.
+ * **LAMS** Heavily customized by LAMS.d
+ */
+
+/* Toggle Styles */
+
+@import "_lams_variables.scss";
+@import "_monitorLesson_base.scss";
+
+#wrapper {
+    padding-left: 0;
+    -webkit-transition: all 0.5s ease;
+    -moz-transition: all 0.5s ease;
+    -o-transition: all 0.5s ease;
+    transition: all 0.5s ease;
+}
+
+#wrapper.toggled {
+    padding-left: 150px;
+}
+
+#sidebar-wrapper {
+    z-index: 101;
+    position: fixed;
+    left: 154px;
+    width: 0;
+    height: 100%;
+    margin-left:-154px;
+    overflow-y: auto;
+    background: $brand-primary-darker;
+    -webkit-transition: all 0.5s ease;
+    -moz-transition: all 0.5s ease;
+    -o-transition: all 0.5s ease;
+    transition: all 0.5s ease;
+	font-size:20px;
+	text-align:center;
+	color: #eee;
+}
+
+#wrapper.toggled #sidebar-wrapper {
+    width:154px;
+}
+
+#page-content-wrapper {
+    width:100%;
+    position:absolute;
+/*    padding:15px;*/
+}
+
+#wrapper.toggled #page-content-wrapper {
+    position: absolute;
+    margin-right:-154px;
+}
+
+.content {
+	padding-left: 20px;
+    padding-right: 20px;
+    border-radius: 0 0 6px 6px;
+}
+
+#refresh-button {
+	margin-right: 15px;
+}
+
+/* Sidebar Styles */
+
+table.tablesorter {
+	text-align: left;
+	width: 100%;
+}
+
+.tablesorter a:hover {
+	text-decoration: none;
+}
+
+.courses-title {
+    padding-left: 0;
+}
+
+.offcanvas-header {
+    max-height: 160px;
+    overflow-y: hidden;
+}
+
+.tablesorter .active > a,
+.tablesorter .active > a:hover,
+.tablesorter .active > a:focus {
+	background: $main_offcanvas_link;
+}
+.tablesorter .active > a {
+    color: $main_offcanvas_link_color;
+}
+.tablesorter td.active {
+    border-right: 9px solid $brand-primary-bright;
+    background: $main_offcanvas_link;
+}
+.tablesorter a {
+    padding-left: 10px;
+}
+
+.sidebar-nav {
+    position: absolute;
+    top: 0;
+    width:154px;
+    margin:0;
+    padding:0;
+    list-style: none;  
+}
+
+.sidebar-nav li {
+    text-indent: 20px;
+    line-height: 40px;
+}
+
+.sidebar-nav li a {
+    display: block;
+    text-decoration: none;
+    color: #999999;
+}
+
+.sidebar-nav li a:hover {
+    text-decoration: none;
+    color: $body-bg;
+    background: rgba(255,255,255,0.2);
+}
+
+.li.active {
+  border-left: 4px solid $brand-primary;
+  background: #edbae9;
+}
+
+
+.sidebar-nav li a:active,
+.sidebar-nav li a:focus {
+    text-decoration: none;
+}
+
+.sidebar-nav > .sidebar-brand {
+    height: 65px;
+    font-size: 22px;
+    line-height: 60px;
+}
+
+.sidebar-nav > .sidebar-brand a {
+    color: #999999;
+}
+
+.sidebar-nav > .sidebar-brand a:hover {
+    color: $body-bg;
+    background: none;
+}
+
+.top-nav div {
+    padding-top: 13px;
+}
+
+@media(min-width:768px) {
+    #wrapper {
+        padding-left: 154px;
+    }
+
+    #wrapper.toggled {
+        padding-left: 0;
+    }
+
+    #sidebar-wrapper {
+        width: 154px;
+    }
+
+    #wrapper.toggled #sidebar-wrapper {
+        width: 0;
+    }
+
+    #page-content-wrapper {
+        padding: 20px;
+        position: relative;
+    }
+
+    #wrapper.toggled #page-content-wrapper {
+        position: relative;
+        margin-right: 0;
+    }
+   
+   .top-nav div {
+	    padding-top: 20px;
+	}
+
+}
+
+@media (max-width: 500px) {
+
+  h1 {
+    font-size: 20px;
+  }
+  
+  * {
+    font-size: 12px;
+  }
+  
+  .no-gutter > [class*='col-'] {
+    padding-right:5px;
+    padding-left:5px;
+    padding-top:3px;
+  }
+  
+}
+
+.fa bars {
+  background-color: $brand-primary;
+  border-color: $brand-primary;
+}
+
+.btn-gate-open {
+    float: right;
+	padding:5px;
+}
+
+.btn-success {
+    float: right;
+}
+
+.btn-gate-open {
+    background-color:lightgreen;
+    float: right;
+	padding:5px;
+}
+
+
+.timeline {
+    list-style: none;
+    text-align: left;
+}
+
+.timeline > li {
+    margin-left: -40px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    background: $body-bg;   
+    position: relative;
+}
+
+.timeline > li.active {
+    background: $brand-primary-light;   
+}
+
+.timeline > li.active > a {
+	color: $body-bg;
+}
+
+.timeline > li a:hover {
+    text-decoration: none;
+    color: $body-bg;
+}
+
+.timeline > li:hover {
+    color: $body-bg;
+    background: $brand-primary-light;
+}
+ 
+ i.fa.fa-sign-in{
+	 color:#2E6DA4;
+	 font-size:1.2em;
+	 margin-top:-8px;
+	 padding: 3px 5px 3px 5px;
+}
+
+i.fa.fa-check-square{
+     float: right;
+     color:green;
+	 font-size:2.2em;
+	 margin-top:-8px;
+	 padding: 3px 5px 3px 5px;
+}
+
+i.fa.fa-minus-square{
+     float: right;
+     color:red;
+	 font-size:2.2em;
+	 margin-top:-8px;
+	 padding: 3px 5px 3px 5px;
+}
+ 
+i.fa.fa-user{
+	 color:#F0AD4E;
+	 font-size:1.2em;
+	 margin-top:-8px;
+	 padding: 3px 5px 3px 5px;
+ }
+
+ i.fa.fa-users, i.fa.fa-comments {
+	 color:#3F903F;
+	 font-size:1.2em;
+	 margin-top:-8px;
+	 padding: 3px 5px 3px 5px;
+ }
+
+ i.fa.fa-users-at-gate {
+	 color:darkorange;
+	 font-size:1.0em;
+ }
+ 
+ i.fa.fa-question-circle {
+	 color:#D9534F;
+	 font-size:1.2em;
+	 margin-top:-8px;
+     padding: 3px 5px 3px 5px;
+ }
+
+ i.fa.fa-dashboard {
+	 color:#D9534F;
+	 font-size:1.2em;
+	 margin-top:-8px;
+     padding: 3px 5px 3px 5px;
+ }
+ 
+ i.fa.fa-cubes {
+	 color:#D9534F;
+	 font-size:1.2em;
+	 margin-top:-8px;
+     padding: 3px 5px 3px 5px;
+ }
+
+
+.lesson {
+	padding-top:10px;
+	padding-bottom:10px;
+	background-color:#F0F0F0;
+	font-size:0.6em;
+    font-weight: bold;
+}
+
+.form-group {
+	padding:15px;	
+}
+
+.m-r {
+    font-size:0.7em;
+    margin-right: 15px;
+}
+
+.panel-heading a:after {
+    font-family:'Glyphicons Halflings';
+    content:"\e114";
+    float: right;
+    color: grey;
+}
+.panel-heading a.collapsed:after {
+    content:"\e080";
+}
+
+.table > tbody > tr > td.success,
+.table > tbody > tr > td.warning,
+.table > tbody > tr > td.normal,
+.table > tbody > tr > td.danger {
+    text-align: center;
+}
+
+.float-left {
+	float: left;
+} 
+.space-right {
+	margin-right: 10px;
+}
+div#sequenceCanvas {
+	text-align: center;
+	overflow: auto;
+	padding: 40px !important;
+}
+div#sequenceCanvas text {
+	font-size: 10px;
+}
+div#sequenceCanvas svg {
+	display: block;
+	overflow: hidden;
+}
+
+.table > tbody > tr > td.danger {
+	background-color: $brand-danger;
+} 
+.table > tbody > tr > td.success {
+	background-color: $brand-success;
+} 
+
+#closeBranchingButton {
+	font-weight: inherit !important;
+	margin-left: 7px;
+}
+#disable-sequence-button {
+	display: inline;
+}
+.voffset10 {
+  margin-top: 10px;
+}
+
+.burning-question-description div, .burning-question-count {
+	display: inline; 
+}
\ No newline at end of file
Index: lams_monitoring/web/monitor.jsp
===================================================================
diff -u -rfe122f9f7ac40f3a3696a7c69043fc34df7994d4 -rd7ed1173946998f754a2efef09d68c9e3bfe307f
--- lams_monitoring/web/monitor.jsp	(.../monitor.jsp)	(revision fe122f9f7ac40f3a3696a7c69043fc34df7994d4)
+++ lams_monitoring/web/monitor.jsp	(.../monitor.jsp)	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -216,8 +216,8 @@
 			refreshMonitor();
 			<c:if test="${not empty lesson.lessonDescription}">
 				$('#description').readmore({
-						  speed: 500,
-						  collapsedHeight: 85
+					speed: 500,
+					collapsedHeight: 85
 				});
 			</c:if>
 			
@@ -226,30 +226,38 @@
 		});
 			
         function doSelectTab(tabId) {
-        	if ( tourInProgress )  {
-        		alert(LABELS.TOUR_DISABLED_ELEMENT);
-        		return;
-        	}
-        	actualDoSelectTab(tabId);
+	        	if ( tourInProgress )  {
+	        		alert(LABELS.TOUR_DISABLED_ELEMENT);
+	        		return;
+	        	}
+	        	actualDoSelectTab(tabId);
         }
 
         function actualDoSelectTab(tabId) {
-	    	selectTab(tabId);
+	    		selectTab(tabId);
 			var sequenceInfoDialog = $('#sequenceInfoDialog');
-	    	if ( tabId == '2' ) {
+	    		if ( tabId == '2' ) {
 				if (sequenceTabShowInfo) {
 					sequenceInfoDialog.modal("show");
 					sequenceTabShowInfo = false; // only show it once
                 }
 			} else {
 				sequenceInfoDialog.modal("hide");
             }
-	    	if ( tabId == '4' ) {
-	    		updateGradebookTab();
-	    	}
+	    		if ( tabId == '4' ) {
+	    			updateGradebookTab();
+	    		}
         }
-        
 
+        function switchToTblMonitor() {
+			$("#content").load(
+				"<c:url value='tblmonitor.do'/>",
+				{
+					lessonID: ${lesson.lessonID}
+				}
+			);
+    		}
+
     	<%@ include file="monitorTour.jsp" %> 
 
 	</script>
@@ -266,7 +274,14 @@
 	</div>
 	
 	<lams:Page type="navbar">
-		<lams:Tabs control="true">
+		<c:if test="${isTBLSequence}">
+			<c:set var="tblMonitorButton">
+				<i class="fa fa fa-heartbeat" title="<fmt:message key="label.tblmonitor" />"
+			 		onclick="javascript:switchToTblMonitor();" id="tbl-monitor-control">  <fmt:message key="label.tbl.monitor"/></i>
+			</c:set>
+		</c:if>
+	
+		<lams:Tabs control="true" extraControl="${tblMonitorButton}">
 			<lams:Tab id="1" key="tab.lesson" />
 			<lams:Tab id="2" key="tab.sequence" />
 			<lams:Tab id="3" key="tab.learners" />
Index: lams_monitoring/web/tblmonitor/forum.jsp
===================================================================
diff -u
--- lams_monitoring/web/tblmonitor/forum.jsp	(revision 0)
+++ lams_monitoring/web/tblmonitor/forum.jsp	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,62 @@
+<%@ include file="/template/taglibs.jsp"%>
+<%@ page import="org.lamsfoundation.lams.util.CentralConstants"%>
+<script>
+	$(document).ready(function(){
+		//insert total learners number taken from the parent tblmonitor.jsp
+		$("#total-learners-number").html(TOTAL_LESSON_LEARNERS_NUMBER);
+	});
+</script>
+
+<!-- Header -->
+<div class="row no-gutter">
+	<div class="col-xs-12 col-md-12 col-lg-8">
+		<h3>
+			<fmt:message key="label.forum"/>
+		</h3>
+	</div>
+</div>
+<!-- End header -->
+
+<!-- Notifications -->  
+<div class="row no-gutter">
+	<div class="col-xs-6 col-md-4 col-lg-4 ">
+		<div class="panel panel-default">
+			<div class="panel-heading">
+				<h4 class="panel-title">
+					<i class="fa fa-users" style="color:gray" ></i> 
+					<fmt:message key="label.attendance"/>: ${attemptedLearnersNumber}/<span id="total-learners-number"></span>
+				</h4> 
+			</div>
+		</div>
+	</div>                       
+</div>
+<!-- End notifications -->
+
+<!-- Tables -->
+<div class="row no-gutter">
+<div class="col-xs-12 col-md-12 col-lg-10">
+
+<h4><fmt:message key="label.grouping.group.heading"/></h4>
+
+<c:forEach var="toolSession" items="${toolSessions}" varStatus="i">
+	<div class="panel panel-default">
+		<div class="panel-heading">
+			<h4 class="panel-title">
+				<c:out value="${toolSession.toolSessionName}" escapeXml="false"/>
+			</h4>
+		</div>
+		
+		<div class="panel-body">
+			<div class="table-responsive">
+				<a href="/lams/tool/<%= CentralConstants.TOOL_SIGNATURE_FORUM %>/learning/viewForum.do?toolSessionID=${toolSession.toolSessionId}&mode=teacher&hideReflection=true" target="_blank" class="btn btn-default btn-sm">
+					<i class="fa fa-comments"></i> <fmt:message key="label.view.forum" />
+				</a>
+			</div>
+		</div>
+	</div>
+</c:forEach>
+
+</div>
+</div>
+<!-- End tables -->
+
Index: lams_monitoring/web/tblmonitor/gates.jsp
===================================================================
diff -u
--- lams_monitoring/web/tblmonitor/gates.jsp	(revision 0)
+++ lams_monitoring/web/tblmonitor/gates.jsp	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,58 @@
+<%@ include file="/template/taglibs.jsp"%>
+
+<!-- Header -->
+<div class="row no-gutter">
+	<div class="col-xs-12 col-md-12 col-lg-8">
+		<h3>
+			<fmt:message key="label.gates"/>
+		</h3>
+	</div>
+</div>
+<!-- End header -->
+
+<!-- Tables -->
+<div class="row no-gutter">
+<div class="col-xs-12 col-md-12 col-lg-10">
+
+	<c:forEach var="permissionGate" items="${permissionGates}">
+			
+		<div class="panel panel-default">
+			<div class="panel-heading">
+			</div>
+			
+			<div class="panel-body">
+				<c:out value="${permissionGate.title}" escapeXml="false"/>
+			
+				<c:choose>
+					<c:when test="${permissionGate.complete}">
+						<i class="fa fa-check-square"></i>
+						<!-- <br/>
+							<small class="m-r">Opened 2 hours ago</small>
+						 -->
+					</c:when>
+					<c:otherwise>
+						<c:if test="${permissionGate.waitingLearnersCount > 0}">
+							<br/>
+							<small class="m-r">
+								<i class="fa fa-users fa-users-at-gate"></i>
+													 
+								<fmt:message key="label.users.knocking.on.gate">
+									<fmt:param>${permissionGate.waitingLearnersCount}</fmt:param>
+								</fmt:message>
+							</small>
+						</c:if>
+
+						<button type="button" class="btn btn-sm btn-primary pull-right"
+								onClick="javascript:openPopUp('${permissionGate.url}','ContributeActivity', 600, 800, true)">
+							<fmt:message key="label.gate.open"/>
+						</button>
+					</c:otherwise>
+				</c:choose>
+						
+			</div>
+		</div>			
+			
+	</c:forEach> 
+
+</div>
+</div>
Index: lams_monitoring/web/tblmonitor/sequence.jsp
===================================================================
diff -u
--- lams_monitoring/web/tblmonitor/sequence.jsp	(revision 0)
+++ lams_monitoring/web/tblmonitor/sequence.jsp	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,353 @@
+<%@ include file="/template/taglibs.jsp"%>
+
+<lams:css webapp="monitoring" suffix="monitorLesson"/>
+<style>
+	#content {
+		padding: 0 20px;
+	}
+</style>
+
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
+<script type="text/javascript" >
+	$(document).bind("mobileinit", function(){
+	  $.mobile.loadingMessage = false;
+	  $.mobile.ignoreContentEnabled = true;
+	  $('body').attr('data-enhance', 'false');
+	});
+</script>
+
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery-ui.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery-ui.timepicker.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/snap.svg.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/readmore.min.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL />includes/javascript/d3.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL />includes/javascript/chart.js"></script>
+<script type="text/javascript" src="<lams:WebAppURL/>includes/javascript/monitorLesson.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/bootstrap.min.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/bootstrap.tabcontroller.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL />includes/javascript/bootstrap-tour.min.js"></script> 
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/dialog.js"></script>
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/portrait.js"></script>
+<script>
+	var lessonId = ${lesson.lessonId},
+	userId = '<lams:user property="userID"/>',
+	ldId = ${lesson.learningDesign.learningDesignId},
+	lessonStateId = ${lesson.lessonStateId},
+	// settings for progress bar
+	isHorizontalBar = true,
+	hasContentFrame = false,
+	presenceEnabled =  false,
+	hasDialog = false,
+	enableExportPortfolio = false,
+	sequenceTabShowInfo = true,
+	LAMS_URL = '<lams:LAMSURL/>',
+	decoderDiv = $('<div />'),
+	LABELS = {
+		<fmt:message key="force.complete.click" var="FORCE_COMPLETE_CLICK_VAR"/>
+		FORCE_COMPLETE_CLICK : decoderDiv.html('<c:out value="${FORCE_COMPLETE_CLICK_VAR}" />').text(),
+		<fmt:message key="button.force.complete" var="FORCE_COMPLETE_BUTTON_VAR"/>
+		FORCE_COMPLETE_BUTTON : '<c:out value="${FORCE_COMPLETE_BUTTON_VAR}" />',
+		<fmt:message key="force.complete.end.lesson.confirm" var="FORCE_COMPLETE_END_LESSON_CONFIRM_VAR"/>
+		FORCE_COMPLETE_END_LESSON_CONFIRM : decoderDiv.html('<c:out value="${FORCE_COMPLETE_END_LESSON_CONFIRM_VAR}" />').text(),
+		<fmt:message key="force.complete.activity.confirm" var="FORCE_COMPLETE_ACTIVITY_CONFIRM_VAR"/>
+		FORCE_COMPLETE_ACTIVITY_CONFIRM : decoderDiv.html('<c:out value="${FORCE_COMPLETE_ACTIVITY_CONFIRM_VAR}" />').text(),
+		<fmt:message key="force.complete.remove.content" var="FORCE_COMPLETE_REMOVE_CONTENT_VAR"/>
+		FORCE_COMPLETE_REMOVE_CONTENT : decoderDiv.html('<c:out value="${FORCE_COMPLETE_REMOVE_CONTENT_VAR}" />').text(),
+		<fmt:message key="force.complete.remove.content.yes" var="FORCE_COMPLETE_REMOVE_CONTENT_YES_VAR"/>
+		FORCE_COMPLETE_REMOVE_CONTENT_YES : '<c:out value="${FORCE_COMPLETE_REMOVE_CONTENT_YES_VAR}" />',
+		<fmt:message key="force.complete.remove.content.no" var="FORCE_COMPLETE_REMOVE_CONTENT_NO_VAR"/>
+		FORCE_COMPLETE_REMOVE_CONTENT_NO : '<c:out value="${FORCE_COMPLETE_REMOVE_CONTENT_NO_VAR}" />',
+		<fmt:message key="force.complete.drop.fail" var="FORCE_COMPLETE_DROP_FAIL_VAR"/>
+		FORCE_COMPLETE_DROP_FAIL : '<c:out value="${FORCE_COMPLETE_DROP_FAIL_VAR}" />',
+		<fmt:message key="learner.group.count" var="LEARNER_GROUP_COUNT_VAR"/>
+		LEARNER_GROUP_COUNT : '<c:out value="${LEARNER_GROUP_COUNT_VAR}" />',
+		<fmt:message key="learner.group.show" var="LEARNER_GROUP_SHOW_VAR"/>
+		LEARNER_GROUP_SHOW : '<c:out value="${LEARNER_GROUP_SHOW_VAR}" />',
+		<fmt:message key="learner.group.remove.progress" var="LEARNER_GROUP_REMOVE_PROGRESS_VAR"/>
+		LEARNER_GROUP_REMOVE_PROGRESS : decoderDiv.html('<c:out value="${LEARNER_GROUP_REMOVE_PROGRESS_VAR}" />').text(),
+		<fmt:message key="button.view.learner" var="VIEW_LEARNER_BUTTON_VAR"/>
+		VIEW_LEARNER_BUTTON : '<c:out value="${VIEW_LEARNER_BUTTON_VAR}" />',
+		<fmt:message key="button.email" var="EMAIL_BUTTON_VAR"/>
+		EMAIL_BUTTON : '<c:out value="${EMAIL_BUTTON_VAR}" />',
+		<fmt:message key="button.close" var="CLOSE_BUTTON_VAR"/>
+		CLOSE_BUTTON : '<c:out value="${CLOSE_BUTTON_VAR}" />',
+		<fmt:message key="email.notifications" var="NOTIFCATIONS_VAR"/>
+		NOTIFCATIONS : '<c:out value="${NOTIFCATIONS_VAR}" />',
+		<fmt:message key="button.save" var="SAVE_BUTTON_VAR"/>
+		SAVE_BUTTON : '<c:out value="${SAVE_BUTTON_VAR}" />',
+		<fmt:message key="button.cancel" var="CANCEL_BUTTON_VAR"/>
+		CANCEL_BUTTON : '<c:out value="${CANCEL_BUTTON_VAR}" />',
+		<fmt:message key="learner.finished.count" var="LEARNER_FINISHED_COUNT_VAR"/>
+		LEARNER_FINISHED_COUNT : '<c:out value="${LEARNER_FINISHED_COUNT_VAR}" />',
+		<fmt:message key="learner.finished.dialog.title" var="LEARNER_FINISHED_DIALOG_TITLE_VAR"/>
+		LEARNER_FINISHED_DIALOG_TITLE : '<c:out value="${LEARNER_FINISHED_DIALOG_TITLE_VAR}" />',
+		<fmt:message key="lesson.enable.presence.alert" var="LESSON_PRESENCE_ENABLE_ALERT_VAR"/>
+		LESSON_PRESENCE_ENABLE_ALERT : decoderDiv.html('<c:out value="${LESSON_PRESENCE_ENABLE_ALERT_VAR}" />').text(),
+		<fmt:message key="lesson.disable.presence.alert" var="LESSON_PRESENCE_DISABLE_ALERT_VAR"/>
+		LESSON_PRESENCE_DISABLE_ALERT : decoderDiv.html('<c:out value="${LESSON_PRESENCE_DISABLE_ALERT_VAR}" />').text(),
+		<fmt:message key="lesson.enable.im.alert" var="LESSON_IM_ENABLE_ALERT_VAR"/>
+		LESSON_IM_ENABLE_ALERT : decoderDiv.html('<c:out value="${LESSON_IM_ENABLE_ALERT_VAR}" />').text(),
+		<fmt:message key="lesson.disable.im.alert" var="LESSON_IM_DISABLE_ALERT_VAR"/>
+		LESSON_IM_DISABLE_ALERT : decoderDiv.html('<c:out value="${LESSON_IM_DISABLE_ALERT_VAR}" />').text(),
+		<fmt:message key="lesson.remove.alert" var="LESSON_REMOVE_ALERT_VAR"/>
+		LESSON_REMOVE_ALERT : decoderDiv.html('<c:out value="${LESSON_REMOVE_ALERT_VAR}" />').text(),
+		<fmt:message key="lesson.remove.doublecheck.alert" var="LESSON_REMOVE_DOUBLECHECK_ALERT_VAR"/>
+		LESSON_REMOVE_DOUBLECHECK_ALERT : decoderDiv.html('<c:out value="${LESSON_REMOVE_DOUBLECHECK_ALERT_VAR}" />').text(),
+		<fmt:message key="lesson.state.created" var="LESSON_STATE_CREATED_VAR"/>
+		LESSON_STATE_CREATED : '<c:out value="${LESSON_STATE_CREATED_VAR}" />',
+		<fmt:message key="lesson.state.scheduled" var="LESSON_STATE_SCHEDULED_VAR"/>
+		LESSON_STATE_SCHEDULED : '<c:out value="${LESSON_STATE_SCHEDULED_VAR}" />',
+		<fmt:message key="lesson.state.started" var="LESSON_STATE_STARTED_VAR"/>
+		LESSON_STATE_STARTED : '<c:out value="${LESSON_STATE_STARTED_VAR}" />',
+		<fmt:message key="lesson.state.suspended" var="LESSON_STATE_SUSPENDED_VAR"/>
+		LESSON_STATE_SUSPENDED : '<c:out value="${LESSON_STATE_SUSPENDED_VAR}" />',
+		<fmt:message key="lesson.state.finished" var="LESSON_STATE_FINISHED_VAR"/>
+		LESSON_STATE_FINISHED : '<c:out value="${LESSON_STATE_FINISHED_VAR}" />',
+		<fmt:message key="lesson.state.archived" var="LESSON_STATE_ARCHIVED_VAR"/>
+		LESSON_STATE_ARCHIVED : '<c:out value="${LESSON_STATE_ARCHIVED_VAR}" />',
+		<fmt:message key="lesson.state.removed" var="LESSON_STATE_REMOVED_VAR"/>
+		LESSON_STATE_REMOVED : '<c:out value="${LESSON_STATE_REMOVED_VAR}" />',
+		<fmt:message key="lesson.state.action.disable" var="LESSON_STATE_ACTION_DISABLE_VAR"/>
+		LESSON_STATE_ACTION_DISABLE : '<c:out value="${LESSON_STATE_ACTION_DISABLE_VAR}" />',
+		<fmt:message key="lesson.state.action.activate" var="LESSON_STATE_ACTION_ACTIVATE_VAR"/>
+		LESSON_STATE_ACTION_ACTIVATE : '<c:out value="${LESSON_STATE_ACTION_ACTIVATE_VAR}" />',
+		<fmt:message key="lesson.state.action.remove" var="LESSON_STATE_ACTION_REMOVE_VAR"/>
+		LESSON_STATE_ACTION_REMOVE : '<c:out value="${LESSON_STATE_ACTION_REMOVE_VAR}" />',
+		<fmt:message key="lesson.state.action.archive" var="LESSON_STATE_ACTION_ARCHIVE_VAR"/>
+		LESSON_STATE_ACTION_ARCHIVE : '<c:out value="${LESSON_STATE_ACTION_ARCHIVE_VAR}" />',
+		<fmt:message key="error.lesson.schedule.date" var="LESSON_ERROR_SCHEDULE_DATE_VAR"/>
+		LESSON_ERROR_SCHEDULE_DATE : decoderDiv.html('<c:out value="${LESSON_ERROR_SCHEDULE_DATE_VAR}" />').text(),
+		<fmt:message key="button.edit.class" var="LESSON_EDIT_CLASS_VAR"/>
+		LESSON_EDIT_CLASS : '<c:out value="${LESSON_EDIT_CLASS_VAR}" />',
+		<fmt:message key="lesson.group.dialog.class" var="LESSON_GROUP_DIALOG_CLASS_VAR"/>
+		LESSON_GROUP_DIALOG_CLASS : '<c:out value="${LESSON_GROUP_DIALOG_CLASS_VAR}" />',
+		<fmt:message key="label.learner.progress.activity.current.tooltip" var="CURRENT_ACTIVITY_VAR"/>
+		CURRENT_ACTIVITY : '<c:out value="${CURRENT_ACTIVITY_VAR}" />',
+		<fmt:message key="label.learner.progress.activity.completed.tooltip" var="COMPLETED_ACTIVITY_VAR"/>
+		COMPLETED_ACTIVITY : '<c:out value="${COMPLETED_ACTIVITY_VAR}" />',
+		<fmt:message key="label.learner.progress.activity.attempted.tooltip" var="ATTEMPTED_ACTIVITY_VAR"/>
+		ATTEMPTED_ACTIVITY : '<c:out value="${ATTEMPTED_ACTIVITY_VAR}" />',
+		<fmt:message key="label.learner.progress.activity.tostart.tooltip" var="TOSTART_ACTIVITY_VAR"/>
+		TOSTART_ACTIVITY : '<c:out value="${TOSTART_ACTIVITY_VAR}" />',
+		<fmt:message key="label.learner.progress.activity.support.tooltip" var="SUPPORT_ACTIVITY_VAR"/>
+		SUPPORT_ACTIVITY : '<c:out value="${SUPPORT_ACTIVITY_VAR}" />',
+		<fmt:message key="label.learner.progress.not.started" var="PROGRESS_NOT_STARTED_VAR"/>
+		PROGRESS_NOT_STARTED : '<c:out value="${PROGRESS_NOT_STARTED_VAR}" />',
+		<fmt:message key="button.export" var="EXPORT_PORTFOLIO_VAR"/>
+		EXPORT_PORTFOLIO : '<c:out value="${EXPORT_PORTFOLIO_VAR}" />',
+		<fmt:message key="button.export.learner.tooltip" var="EXPORT_PORTFOLIO_LEARNER_TOOLTIP_VAR"/>
+		EXPORT_PORTFOLIO_LEARNER_TOOLTIP : '<c:out value="${EXPORT_PORTFOLIO_LEARNER_TOOLTIP_VAR}" />',
+	    <fmt:message key="button.timechart" var="TIME_CHART_VAR"/>
+	    TIME_CHART : '<c:out value="${TIME_CHART_VAR}" />',
+	    <fmt:message key="button.timechart.tooltip" var="TIME_CHART_TOOLTIP_VAR"/>
+	    TIME_CHART_TOOLTIP : '<c:out value="${TIME_CHART_TOOLTIP_VAR}" />',
+		<fmt:message key="button.live.edit.confirm" var="LIVE_EDIT_CONFIRM_VAR"/>
+		LIVE_EDIT_CONFIRM : decoderDiv.html('<c:out value="${LIVE_EDIT_CONFIRM_VAR}" />').text(),
+		<fmt:message key="lesson.task.gate" var="CONTRIBUTE_GATE_VAR"/>
+		CONTRIBUTE_GATE : '<c:out value="${CONTRIBUTE_GATE_VAR}" />',
+		<fmt:message key="lesson.task.grouping" var="CONTRIBUTE_GROUPING_VAR"/>
+		CONTRIBUTE_GROUPING : '<c:out value="${CONTRIBUTE_GROUPING_VAR}" />',
+		<fmt:message key="lesson.task.branching" var="CONTRIBUTE_BRANCHING_VAR"/>
+		CONTRIBUTE_BRANCHING : '<c:out value="${CONTRIBUTE_BRANCHING_VAR}" />',
+		<fmt:message key="lesson.task.content.edited" var="CONTRIBUTE_CONTENT_EDITED_VAR"/>
+		CONTRIBUTE_CONTENT_EDITED : '<c:out value="${CONTRIBUTE_CONTENT_EDITED_VAR}" />',
+		<fmt:message key="button.task.go.tooltip" var="CONTRIBUTE_TOOLTIP_VAR"/>
+		CONTRIBUTE_TOOLTIP : '<c:out value="${CONTRIBUTE_TOOLTIP_VAR}" />',
+		<fmt:message key="button.task.go" var="CONTRIBUTE_BUTTON_VAR"/>
+		CONTRIBUTE_BUTTON : '<c:out value="${CONTRIBUTE_BUTTON_VAR}" />',
+		<fmt:message key="lesson.task.attention" var="CONTRIBUTE_ATTENTION_VAR"/>
+		CONTRIBUTE_ATTENTION : '<c:out value="${CONTRIBUTE_ATTENTION_VAR}" />'
+	}
+
+	$(document).ready(function(){
+		initSequenceTab();
+		updateSequenceTab();
+
+		//Disable sequence button handler 
+		$('#disable-sequence-button').click(function () {
+	        var method = (lessonStateId == 3) ? "suspendLesson" : "unsuspendLesson";
+			$.ajax({
+				dataType : 'xml',
+				url : LAMS_URL + 'monitoring/monitoring.do',
+				cache : false,
+				data : {
+					'method'    : method,
+					'lessonID'  : '${lesson.lessonId}'
+				},
+				success : function() {
+			       	if (lessonStateId == 3) {
+			       		lessonStateId = 4;
+			       		$("#disable-sequence-label").html("<fmt:message key='lesson.state.action.activate'/>");
+			       		
+				    } else {
+			       		lessonStateId = 3;
+			       		$("#disable-sequence-label").html("<fmt:message key='lesson.state.action.disable'/>");
+					}
+				}
+			});
+		});
+
+		// assigne svg 'auto' width and height 
+		if (sequenceCanvas) {
+			var svg = $('svg','#sequenceCanvas');
+			if ( svg ) {
+				var svgWidth = svg.attr('width'),
+					svgHeight = svg.attr('height');
+				if ( svgWidth > 280 ) {
+					svg.attr('width', '100%');
+					svg.attr('height', '100%');
+					svg.css('max-width', svgWidth);
+					svg.css('max-height', svgHeight);
+				} 
+				$('#sequenceCanvas').css('width', 'auto').css('height', 'auto');
+			}
+		}
+	});
+</script>
+		
+<!-- Header -->
+<div class="row no-gutter">
+	<div class="col-xs-12 col-md-12 col-lg-8">
+		<h3>
+			<fmt:message key="label.sequence.diagram"/>
+		</h3>
+	</div>
+</div>
+<!-- End header -->    
+
+<!-- Notifications -->  
+<c:if test="${(lesson.lessonStateId == 3) || (lesson.lessonStateId == 4) }">
+	<div class="row no-gutter">
+		<div class="col-xs-6 col-md-4 col-lg-4 ">
+			<a href="#nogo" type="button" id="disable-sequence-button" class="btn btn-sm btn-default">
+				<span id="disable-sequence-label">
+					<c:choose>
+						<c:when test="${lesson.lessonStateId == 4}">
+							<fmt:message key="lesson.state.action.activate"/>
+						</c:when>
+						<c:otherwise>
+							<fmt:message key="lesson.state.action.disable"/>
+						</c:otherwise>
+					</c:choose>
+				</span>
+			</a>
+		</div>                                 
+	</div>
+	<br>
+</c:if>
+<!-- End notifications -->              
+
+<!-- Tables -->
+	<div class="row no-gutter">
+	<div class="col-xs-12">
+	<div class="panel panel-success">
+	
+	<div id="tabSequence">
+		<div id="sequenceCanvas"></div>
+		<div id="completedLearnersContainer" title="<fmt:message key='force.complete.end.lesson.tooltip' />">
+			<img id="completedLearnersDoorIcon" src="<lams:LAMSURL/>images/icons/door_open.png" />
+		</div>
+		<img id="sequenceCanvasLoading"
+		     src="<lams:LAMSURL/>images/ajax-loader-big.gif" />
+		<img id="sequenceSearchedLearnerHighlighter"
+		     src="<lams:LAMSURL/>images/pedag_down_arrow.gif" />
+	</div>
+		
+	</div>  
+	</div>
+	</div>
+<!-- End tables -->
+
+	<div id="learnerGroupDialogContents" class="dialogContainer">
+		<span id="learnerGroupMultiSelectLabel"><fmt:message key='learner.group.multi.select'/></span>
+		<table id="listLearners" class="table table-condensed">
+			<tr id="learnerGroupSearchRow">
+				<td>
+					<span class="dialogSearchPhraseIcon fa fa-xs fa-search"
+						  title="<fmt:message key='search.learner.textbox' />"></span>
+				</td>
+				<td colspan="4">
+					<input class="dialogSearchPhrase" 
+						   title="<fmt:message key='search.learner.textbox' />"/>
+				</td>
+				<td>
+					<span class="dialogSearchPhraseClear fa fa-xs fa-times-circle"
+						  onClick="javascript:learnerGroupClearSearchPhrase()"
+						  title="<fmt:message key='learners.search.phrase.clear.tooltip' />" 
+					></span>
+				</td>
+			</tr>
+			<tr>
+				<td class="navCell pageMinus10Cell"
+					title="<fmt:message key='learner.group.backward.10'/>"
+					onClick="javascript:shiftLearnerGroupList(-10)">
+						<span class="ui-icon ui-icon-seek-prev"></span>
+				</td>
+				<td class="navCell pageMinus1Cell"
+					title="<fmt:message key='learner.group.backward.1'/>"
+					onClick="javascript:shiftLearnerGroupList(-1)">
+					<span class="ui-icon ui-icon-arrowthick-1-w"></span>
+				</td>
+				<td class="pageCell"
+					title="<fmt:message key='learners.page'/>">
+				</td>
+				<td class="navCell pagePlus1Cell"
+					title="<fmt:message key='learner.group.forward.1'/>"
+					onClick="javascript:shiftLearnerGroupList(1)">
+						<span class="ui-icon ui-icon-arrowthick-1-e"></span>
+				</td>
+				<td class="navCell pagePlus10Cell" 
+					title="<fmt:message key='learner.group.forward.10'/>"
+					onClick="javascript:shiftLearnerGroupList(10)">
+						<span class="ui-icon ui-icon-seek-next"></span>
+				</td>
+				<td class="navCell sortCell" 
+					title="<fmt:message key='learner.group.sort.button'/>" 
+					onClick="javascript:sortLearnerGroupList()">
+						<span class="ui-icon ui-icon-triangle-1-n"></span>
+				</td>
+			</tr>
+			<tr>
+				<td colspan="6" class="dialogList"></td>
+			</tr>
+		</table>
+		<div class="btn-group pull-right">
+			<button id="learnerGroupDialogForceCompleteButton" class="learnerGroupDialogSelectableButton btn btn-default roffset5">
+				<span><fmt:message key="button.force.complete" /></span>
+			</button>
+			<button id="learnerGroupDialogViewButton" class="learnerGroupDialogSelectableButton btn btn-default roffset5">
+				<span><fmt:message key="button.view.learner" /></span>
+			</button>
+			<button id="learnerGroupDialogEmailButton" class="learnerGroupDialogSelectableButton btn btn-default roffset5">
+				<span><fmt:message key="button.email" /></span>
+			</button>
+			<button id="learnerGroupDialogCloseButton" class="btn btn-default">
+				<span><fmt:message key="button.close" /></span>
+			</button>
+		</div>
+	</div>
+	
+	<div id="saveSequenceDialogContents" class="dialogContainer" title="Save sequence">
+	</div>
+	
+	<div id="sequenceInfoDialogContents" class="dialogContainer">
+	  <fmt:message key="sequence.help.info"/>
+	</div>
+		
+	<div id="forceBackwardsDialogContents" class="dialogContainer">
+		<div id="forceBackwardsMsg"></div>
+        <div class="btn-group pull-right voffset10">
+
+               <button id="forceBackwardsRemoveContentNoButton" class="btn btn-default roffset5">
+                       <span><fmt:message key="force.complete.remove.content.no"/></span>
+               </button>
+
+               <button id="forceBackwardsRemoveContentYesButton" class="btn btn-default roffset5">
+                       <span><fmt:message key="force.complete.remove.content.yes" /></span>
+               </button>
+
+               <button id="forceBackwardsCloseButton" class="btn btn-default">
+                       <span><fmt:message key="button.close" /></span>
+               </button>
+       </div>
+	</div>
Index: lams_monitoring/web/tblmonitor/tblmonitor.jsp
===================================================================
diff -u
--- lams_monitoring/web/tblmonitor/tblmonitor.jsp	(revision 0)
+++ lams_monitoring/web/tblmonitor/tblmonitor.jsp	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,289 @@
+<%@ include file="/template/taglibs.jsp"%>
+
+<!DOCTYPE html>
+<lams:html>
+<lams:head>
+    <title><fmt:message key="label.tbl.monitor"/></title>
+	
+	<lams:css/>
+	<lams:css suffix="main"/>
+    <link href="css/tblmonitor.css" rel="stylesheet">
+	
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/bootstrap.min.js"></script>
+	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/progressBar.js"></script>
+	<script>
+		var TOTAL_LESSON_LEARNERS_NUMBER = ${totalLearnersNumber};
+	
+		$(document).ready(function(){
+			<!-- Menu Toggle Script -->
+			$("#menu-toggle-bars").click(function(e) {
+				e.preventDefault();
+				$("#wrapper").toggleClass("toggled");
+			});
+
+			//handler for all tab opener links
+			$('.tab-link').on('click', function () {
+				$('.tab-link').parent().removeClass("active");
+				$(this).parent().addClass("active");
+
+				loadTab($(this).data("method"));
+			});
+
+			//open sequence tab by default
+			$("#tab-link-sequence").click();
+
+			//hide burning-questions if it's disabled in a tool
+			if ("${traToolContentId}" != "") {
+		        $.ajax({
+		            url: '<lams:LAMSURL/>tool/lascrt11/tblmonitoring.do',
+		            data: 'method=isBurningQuestionsEnabled&toolContentID=${traToolContentId}',
+		            type: 'post',
+		            success: function (json) {
+			            if (!json.isBurningQuestionsEnabled) {
+				            $("#burning-questions-tr").hide();
+						}
+		            }
+		       	});
+			}
+		});
+
+		function loadTab(method, toolContentID, isIraAssessment) {
+			var url = "<c:url value='tblmonitor.do'/>";
+			var options = {};
+			
+			if (method == "tra" || method == "traStudentChoices" || method == "burningQuestions") {
+				toolContentID = "${traToolContentId}";
+				url = "<lams:LAMSURL/>tool/lascrt11/tblmonitoring.do";
+				
+			} else if (method == "iraMcq" || method == "mcqStudentChoices") {
+				toolContentID = "${iraToolContentId}";
+				url = "<lams:LAMSURL/>tool/lamc11/tblmonitoring.do";
+				
+			} else if (method == "iraAssessment") {
+				url = "<lams:LAMSURL/>tool/laasse10/tblmonitoring.do";
+				options = {
+					assessmentToolContentIds: "${iraToolContentId}",
+					assessmentActivityTitles: "${iraAssessmentActivityTitle}"
+				};
+	
+			} else if (method == "aes" || method == "aesStudentChoices") {
+				url = "<lams:LAMSURL/>tool/laasse10/tblmonitoring.do";
+				options = {
+					assessmentToolContentIds: "${assessmentToolContentIds}",
+					assessmentActivityTitles: "${assessmentActivityTitles}"
+				};
+
+			} else if (method == "forum") {
+				options = {
+					activityId: "${forumActivityId}"
+				};
+			}
+
+			// Merge additional options into existing options object
+			$.extend( options, {
+				method: method,
+				lessonID: ${lesson.lessonId},
+				toolContentID: toolContentID,
+				isIraAssessment: isIraAssessment
+			});
+
+			$("#tblmonitor-tab-content").load(
+				url,
+				options
+			);
+		}
+
+		function printTable() {
+	        var title = document.title;
+	        var divElements = document.getElementById('questions-data').outerHTML;
+	        var printWindow = window.open("", "_blank", "");
+	        //open the window
+	        printWindow.document.open();
+	        //write the html to the new window, link to css file
+	        printWindow.document.write('<html><head><title>' + title + '</title>\n');
+	        printWindow.document.write('<style type="text/css">\n');
+            printWindow.document.write('body {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; -webkit-print-color-adjust: exact;}\n');
+	        printWindow.document.write('.table > tbody > tr > td.success {background-color: #81c466;}\n');
+	        printWindow.document.write('table { border: 1px solid #ddd; width: 100%; max-width: 100%; margin-bottom: 20px; background-color: transparent; border-spacing: 0; border-collapse: collapse; }\n');
+	        printWindow.document.write('* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 16px; }\n');
+	        printWindow.document.write('.table-striped > tbody > tr:nth-of-type(2n+1) {background-color: #f9f9f9; }\n');
+	        printWindow.document.write('.table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {  border: 1px solid #ddd;  }\n');
+	        printWindow.document.write('a { color: #337ab7; text-decoration: none; }\n');
+	        printWindow.document.write('.text-center { text-align: center; }\n');
+	        printWindow.document.write('</style>\n');
+	        printWindow.document.write('</head><body>\n');
+	        printWindow.document.write(divElements);
+	        printWindow.document.write('\n</body></html>');
+	        printWindow.document.close();
+	        printWindow.focus();
+	        //The Timeout is ONLY to make Safari work, but it still works with FF, IE & Chrome.
+	        setTimeout(function() {
+	            printWindow.print();
+	            printWindow.close();
+	        }, 100);
+		}
+
+		function refresh() {
+			$('.tab-link').parent().removeClass("active");
+			$("#tab-link-sequence").parent().addClass("active");
+
+			loadTab("sequence");
+		}
+
+        function switchToRegularMonitor() {
+        		location.href = "<lams:LAMSURL/>home.do?method=monitorLesson&lessonID=${lesson.lessonId}";
+    		}
+	</script>
+</lams:head>
+
+<body>
+	<div id="wrapper">
+	
+		<!-- Offcanvas Bar -->
+	    <nav id="sidebar-wrapper" role="navigation">
+	        <div class="offcanvas-scroll-area">
+	        
+	        <!-- 
+				<div class="offcanvas-logo">
+					<div class="logo">
+					</div>
+				</div>
+			 -->
+				
+			<div class="offcanvas-header">
+				<span class="courses-title ">
+					${lesson.lessonName}
+				</span>
+			</div>
+
+			<table class="tablesorter">
+				<c:set var="actionUrl"><c:url value='tblmonitor.do'/></c:set>
+				<tr>
+					<td id="menu-item-teams">
+						<a class="tab-link" href="#nogo" data-method="teams">
+							<i class="fa fa-users"></i>
+							<fmt:message key="label.teams"/>
+						</a>
+					</td>
+				</tr>
+				
+				<c:if test="${not empty isGatesAvailable}">
+					<tr>
+						<td id="menu-item-gates">
+							<a class="tab-link" href="#nogo" data-method="gates">
+								<i class="fa fa-sign-in"></i>
+								<fmt:message key="label.gates"/>
+							</a>
+						</td>
+					</tr>
+				</c:if>
+				
+				<c:if test="${not empty isIraMcqAvailable || not empty isIraAssessmentAvailable}">
+					<c:set var="iraMethodName">
+						<c:choose>
+							<c:when test="${not empty isIraMcqAvailable}">iraMcq</c:when>
+							<c:otherwise>iraAssessment</c:otherwise>
+						</c:choose>
+					</c:set>
+				
+					<tr>
+						<td id="menu-item-ira">
+							<a class="tab-link" href="#nogo" data-method="${iraMethodName}">
+								<i class="fa fa-user"></i>
+								<fmt:message key="label.ira"/>
+							</a>
+						</td>
+					</tr>
+				</c:if>
+
+				<c:if test="${not empty isScratchieAvailable}">
+					<tr>
+						<td id="menu-item-tra">
+							<a class="tab-link" href="#nogo" data-method="tra">
+								<i class="fa fa-users"></i>
+								<fmt:message key="label.tra"/>
+							</a>
+						</td>
+					</tr>
+
+					<tr id="burning-questions-tr">
+						<td id="menu-item-burning-questions">
+							<a class="tab-link" href="#nogo" data-method="burningQuestions">
+								<i class="fa fa-question-circle"></i>
+								<fmt:message key="label.burning.questions"/>
+							</a>
+						</td>
+					</tr>
+				</c:if>
+				
+				<c:if test="${not empty isForumAvailable}">
+					<tr>
+						<td id="menu-item-forum">
+							<a class="tab-link" href="#nogo" data-method="forum">
+								<i class="fa fa-comments"></i>
+								<fmt:message key="label.forum"/>
+							</a>
+						</td>
+					</tr>
+				</c:if>
+				
+				<c:if test="${not empty isAeAvailable}">
+					<tr>
+						<td id="menu-item-aes">
+							<a class="tab-link" href="#nogo" data-method="aes">
+								<i class="fa fa-dashboard"></i>
+								<fmt:message key="label.aes"/>
+							</a>
+						</td>
+					</tr>
+				</c:if>
+				
+				<tr>
+					<td id="menu-item-sequence" class="active">
+						<a id="tab-link-sequence" class="tab-link" href="#nogo" data-method="sequence">
+							<i class="fa fa-cubes"></i>
+							<fmt:message key="label.sequence"/>
+						</a>
+					</td>
+				</tr>
+				
+			</table>
+	        </div>
+	    </nav>
+		<!-- /Offcanvas Bar -->
+    
+    		<!-- Page Content -->
+		<div id="page-content-wrapper">
+
+			<!-- Top bar -->
+			<div class="top-nav">
+				<div class="col-xs-6 col-md-4 col-lg-4">
+					<a href="#">
+						<i class="fa fa-bars fa-lg" id="menu-toggle-bars"></i>
+					</a>
+				</div>
+						
+				<div>
+					<button id="regular-monitor-button" type="button" class="btn btn-sm btn-default pull-right" onclick="return switchToRegularMonitor();" style="margin-right: 10px;">
+						<i class="fa fa-heartbeat" title="<fmt:message key="label.monitor" />"></i> <fmt:message key="label.switch.to.regular.monitor" />
+					</button>
+					
+					<button id="refresh-button" type="button" class="btn btn-sm btn-default pull-right" onclick="Javascript: refresh(); return false;">
+						<i class="fa fa-refresh"></i> <fmt:message key="button.refresh"/>
+					</button>
+				</div>
+			</div>
+			<!-- End top bar -->
+			
+			<div class="content" id="tblmonitor-tab-content">
+				
+			</div>
+		</div>
+		<!-- /#page-content-wrapper -->
+
+	</div>
+    <!-- /#wrapper -->
+
+</body>
+</lams:html>
Index: lams_monitoring/web/tblmonitor/teams.jsp
===================================================================
diff -u
--- lams_monitoring/web/tblmonitor/teams.jsp	(revision 0)
+++ lams_monitoring/web/tblmonitor/teams.jsp	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,425 @@
+<%@ include file="/template/taglibs.jsp"%>
+
+<!-- ChartJS-->
+<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/chartjs.js"></script>
+<script>
+	$(document).ready(function(){
+	
+		//Change leader button handler 
+		$('.change-leader-button').click(function () {
+			var groupId = $(this).data("group-id");
+			var leaderUserId = $('#change-leader-select-' + groupId).val();
+
+	        $.ajax({
+	            url: '<lams:LAMSURL/>/tool/lalead11/tblmonitoring.do',
+	            data: 'method=changeLeader&userID=' + leaderUserId + "&toolContentID=${leaderselectionToolContentId}",
+	            type: 'post',
+	            success: function (json) {
+		            if (json.isSuccessful) {
+		            		alert("<fmt:message key='label.leader.successfully.changed'/>");
+						loadTab("teams");
+					} else {
+						alert("Leader was not changed.");
+					}
+	            }
+	       	});
+		});
+
+		//Comparison button modal window
+		var chart;
+		$('#comparison-modal').on('shown.bs.modal', function (event) {
+			
+			var link = $(event.relatedTarget);
+			var iraScores = link.data('ira-scores').split(',');
+			for (var i = 0; i < iraScores.length; i++) {
+				iraScores[i] = iraScores[i].trim();
+			}
+
+			//construct traScores Array
+			var traScore = link.data('tra-scores');
+			var traScores = new Array(iraScores.length);
+			for (var i=0; i<iraScores.length; i++) {
+				traScores[i] = traScore;
+			}
+
+			//titles
+			var groupId = link.data('group-id');
+			var groupName = $("#group-name-" + groupId).html();
+			var title = groupName + ": iRA vs tRA comparison";
+
+			var userNames = [];
+			$(".belong-to-group-" + groupId).each(function() { 
+				userNames.push($(this).html().trim());
+			 });
+			
+			var canvas = $(this).find('.modal-body canvas');
+			$(this).find('.modal-title').html(title);
+			var ctx = canvas[0].getContext('2d');
+
+			//draw chart
+			chart = new Chart(ctx).Bar({
+				responsive: true,
+				labels: userNames,
+				datasets: [
+				{
+	                label: "iRA",
+	                fillColor: "rgba(26,179,148,0.5)",
+	                strokeColor: "rgba(26,179,148,0.8)",
+	                highlightFill: "rgba(26,179,148,0.75)",
+	                highlightStroke: "rgba(26,179,148,1)",
+	                data: iraScores
+				},
+				{
+	                label: "tRA",
+	                fillColor: "rgba(220,220,220,0.5)",
+	                strokeColor: "rgba(220,220,220,0.8)",
+	                highlightFill: "rgba(220,220,220,0.75)",
+	                highlightStroke: "rgba(220,220,220,1)",              
+	                data: traScores
+				}]
+			}, {});
+
+		//on hiding chart modal window
+		}).on('hidden.bs.modal', function (event) {
+			var canvas = $(this).find('.modal-body canvas');
+			canvas.attr('width', '568px');
+			canvas.attr('height', '300px');
+			chart.destroy();
+			$(this).data('bs.modal', null);
+		});
+
+		//ira button modal window
+		$('#ira-modal').on('shown.bs.modal', function (event) {
+
+			var link = $(event.relatedTarget);
+			var userId = link.data('user-id');
+
+			//populate user name
+			var userName = $("#user-name-" + userId).html();
+			$('#ira-user-name-label').html(userName);
+
+			//populate user score
+			var userScore = link.data('ira-score');
+			$('#ira-user-score').html(userScore);
+
+			//load modal dialog content using Ajax
+			var url = "${isIraMcqAvailable}" == "true" ? "<lams:LAMSURL/>tool/lamc11/tblmonitoring.do" : "<lams:LAMSURL/>tool/laasse10/tblmonitoring.do";
+			$('#ira-modal .modal-body').load(
+				url, 
+				{
+					method: "getModalDialogForTeamsTab",
+					toolContentID: "${iraToolContentId}",
+					userID: userId
+				},
+				function( response, status, xhr ) {
+					if ( status == "error" ) {
+						alert("Unable to load iRA modal dialog: " + xhr.status);
+					} 
+				}
+			);
+		});
+
+		//tra button modal window
+		$('#tra-modal').on('shown.bs.modal', function (event) {
+
+			var link = $(event.relatedTarget);
+			var userId = link.data('user-id');
+
+			//Populate real user name
+			var userName = $("#user-name-" + userId).html();
+			$('#tra-user-name-label').html(userName);
+
+			//populate user score
+			var userScore = link.data('tra-score');
+			$('#tra-user-score').html(userScore);
+
+			//load modal dialog content using Ajax
+			$('#tra-modal .modal-body').load(
+				"<lams:LAMSURL/>tool/lascrt11/tblmonitoring.do", {
+					method: "getModalDialogForTeamsTab",
+					toolContentID: "${traToolContentId}",
+					userID: userId
+				},
+				function( response, status, xhr ) {
+					if ( status == "error" ) {
+						alert("Unable to load tRA modal dialog: " + xhr.status);
+					} 
+				}
+			);
+		});
+
+	});
+</script>            
+
+<!-- Header -->
+<div class="row no-gutter">
+	<div class="col-xs-12 col-md-12 col-lg-8">
+		<h3>
+			<fmt:message key="label.students.teams"/>
+		</h3>
+	</div>
+</div>
+<!-- End header -->              
+
+<!-- Tables -->
+<div class="row no-gutter">
+<div class="col-xs-12 col-md-12 col-lg-10">
+
+	<c:forEach var="groupDto" items="${groupDtos}">
+		<div class="panel panel-default">
+			<div class="panel-heading">
+				<h4 class="panel-title panel-collapse">
+					<a data-toggle="collapse" data-target="#collapseOne" href="#collapseOne" class="collapsed" id="group-name-${groupDto.groupID}">
+						${groupDto.groupName}
+					</a>
+				</h4>
+			</div>
+	
+			<div id="collapseOne" class="panel-collapse collapse in">
+				<div class="panel-body">
+	
+					<div class="table-responsive">
+						<table class="table table-striped table-hover table-condensed">
+							<thead>
+								<tr>
+									<th>
+										<fmt:message key="label.student"/>
+									</th>
+									
+									<c:if test="${isIraAssessmentAvailable || isIraMcqAvailable}">
+										<th class="text-center">
+											<fmt:message key="label.ira"/>
+										</th>
+									</c:if>
+									
+									<c:if test="${isScratchieAvailable}">
+										<th class="text-center">
+											<fmt:message key="label.tra"/>
+										</th>
+									</c:if>               
+								</tr>
+							</thead>
+	
+							<tbody>
+								<c:forEach var="userDto" items="${groupDto.userList}">
+								
+									<tr>
+										<td class="col-md-7">
+											<c:choose>
+												<c:when test="${userDto.groupLeader}">
+													<strong>
+														<span id="user-name-${userDto.userID}" class="belong-to-group-${groupDto.groupID}">${userDto.firstName} ${userDto.lastName}</span>
+													</strong>
+													<abbr title="Leader" class="fa fa-user-plus" style="color:darkorange"></abbr>
+												</c:when>
+												<c:otherwise>
+													<span id="user-name-${userDto.userID}" class="belong-to-group-${groupDto.groupID}">${userDto.firstName} ${userDto.lastName}</span>
+												</c:otherwise>
+											</c:choose>
+										</td>
+										
+										<c:if test="${isIraAssessmentAvailable || isIraMcqAvailable}">
+											<td class="col-md-2 text-center">
+												<c:choose>
+													<c:when test="${userDto.iraScore != null}">
+														<a data-toggle="modal" href="#ira-modal"
+																data-user-id="${userDto.userID}"
+																data-ira-score="${userDto.iraScore}">
+															${userDto.iraScore}
+														</a>													
+													</c:when>
+													<c:otherwise>
+														0
+													</c:otherwise>
+												</c:choose>
+											</td>
+										</c:if>
+										
+										<c:if test="${isScratchieAvailable}">
+											<td class="col-md-2 text-center">
+												<a data-toggle="modal" href="#tra-modal"
+														data-user-id="${userDto.userID}"
+														data-tra-score="${groupDto.traScore}">
+													${groupDto.traScore}
+												</a>
+											</td>
+										</c:if>
+									</tr>
+									
+								</c:forEach>
+							</tbody>
+						</table>
+					</div>
+	
+					<!-- Change leader and Compare buttons -->
+					<div class="row">
+						<div class="col-xs-12 col-md-12 col-lg-12">
+							<c:if test="${(isIraAssessmentAvailable || isIraMcqAvailable) && isScratchieAvailable}">
+								<button href="#" data-toggle="modal" data-target="#comparison-modal" type="button" class="btn btn-sm btn-default pull-right"
+										data-ira-scores="
+										<c:forEach var="userDto" items="${groupDto.userList}">
+											${userDto.iraScore},
+										</c:forEach>" 
+										data-tra-scores="${groupDto.traScore}" 
+										data-group-id="${groupDto.groupID}"
+										data-user-names="">
+									<i class="fa fa-bar-chart"></i> 
+									<fmt:message key="label.comparison"/>
+								</button>
+							</c:if>
+
+							<c:if test="${not empty leaderselectionToolContentId}">
+								<button data-toggle="modal" href="#change-leader-modal-${groupDto.groupID}" type="button" class="btn btn-sm btn-default pull-right" style="margin-right: 5px">
+									<fmt:message key="label.change.leader"/>
+								</button>
+							</c:if>
+						</div>
+					</div>
+					<!-- End change leader -->                       
+	
+				</div>
+	
+			</div>
+		</div>
+	</c:forEach>     
+
+</div>
+</div>
+
+<!-- modal chart -->
+<div class="modal fade" id="comparison-modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
+<div class="modal-dialog">
+<div class="modal-content">
+	<div class="modal-header">
+		<button type="button" class="close" data-dismiss="modal">
+			<span aria-hidden="true">&times;</span>
+			<span class="sr-only">
+				<fmt:message key="button.close"/>
+			</span>
+		</button>
+		<h4 class="modal-title" id="exampleModalLabel">
+			<fmt:message key="label.bar.chart"/>
+		</h4>
+	</div>
+          
+	<div class="modal-body">
+		<canvas id="canvas" width="568" height="300"></canvas>
+	</div>
+</div>
+</div>
+</div>
+<!-- end modal chart -->
+
+<!-- iRA Modal -->
+<div class="modal fade" id="ira-modal">
+<div class="modal-dialog modal-lg">
+<div class="modal-content">
+
+	<div class="modal-header">
+		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">ח</button>
+		<h4 class="modal-title">
+			<fmt:message key="label.ira.responses.for"/>: <span id="ira-user-name-label"></span> 
+		</h4>
+		<fmt:message key="label.score"/>: <span id="ira-user-score"></span>
+	</div>
+          
+	<!-- Begin -->
+	<div class="modal-body">
+	</div>
+	<!-- end -->  
+	
+	<div class="modal-footer">	
+		<a href="#" data-dismiss="modal" class="btn btn-default">
+			<fmt:message key="button.ok"/>
+		</a>
+	</div>
+
+</div>
+</div>
+</div>
+<!-- End iRA Modal -->
+
+<!-- tRA Modal -->
+<div class="modal fade" id="tra-modal">
+<div class="modal-dialog modal-lg">
+<div class="modal-content">
+
+	<div class="modal-header">
+		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">ח</button>
+		<h4 class="modal-title">
+			<fmt:message key="label.tra.responses.for"/>: <span id="tra-user-name-label"></span> 
+		</h4>
+		<fmt:message key="label.score"/>: <span id="tra-user-score"></span>
+	</div>
+          
+	<!-- Begin -->
+	<div class="modal-body">
+	</div>
+	<!-- end -->  
+	
+	<div class="modal-footer">	
+		<a href="#" data-dismiss="modal" class="btn btn-default">
+			<fmt:message key="button.ok"/>
+		</a>
+	</div>
+
+</div>
+</div>
+</div>
+<!-- End tRA Modal -->
+
+<!-- Change leader Modal -->
+<c:forEach var="groupDto" items="${groupDtos}">
+	<div class="modal fade" id="change-leader-modal-${groupDto.groupID}">
+	<div class="modal-dialog modal-lg">
+	<div class="modal-content">
+	
+		<div class="modal-header">
+			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">�</button>
+			<h4 class="modal-title">
+				<fmt:message key="label.change.leader"/>
+			</h4>
+			<small>
+				<fmt:message key="label.note.leader.change"/>
+			</small>
+		</div>
+	          
+		<!-- Begin -->
+		<div class="modal-body">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h4 class="panel-title">${groupDto.groupName}:</h4> 
+					<small>
+						<fmt:message key="label.current.leader"/>
+						<c:if test="${not empty groupDto.groupLeader}">
+							${groupDto.groupLeader.firstName} ${groupDto.groupLeader.lastName}
+						</c:if>
+					</small>
+				</div>
+				
+				<div class="panel-body">
+					<select class="select-picker" id="change-leader-select-${groupDto.groupID}">
+						<c:forEach var="userDto" items="${groupDto.userList}">
+							<option value="${userDto.userID}">${userDto.firstName} ${userDto.lastName}</option>
+						</c:forEach>
+					</select>
+				</div>
+			</div>
+			<!-- end -->  
+	              
+			<div class="modal-footer">	
+				<a href="#" data-dismiss="modal" class="btn btn-default">
+					<fmt:message key="button.close"/>
+				</a>
+				<a href="#" data-dismiss="modal" class="btn btn-default change-leader-button" 
+						data-group-id="${groupDto.groupID}">
+					<fmt:message key="button.save"/>
+				</a>
+			</div>
+		</div>
+	          
+	</div>
+	</div>
+	</div>
+</c:forEach>
+<!-- End Change leader Modal -->
Index: lams_monitoring/web/template/taglibs.jsp
===================================================================
diff -u
--- lams_monitoring/web/template/taglibs.jsp	(revision 0)
+++ lams_monitoring/web/template/taglibs.jsp	(revision d7ed1173946998f754a2efef09d68c9e3bfe307f)
@@ -0,0 +1,14 @@
+<%@ page contentType="text/html; charset=utf-8" language="java"%>
+<%@ taglib uri="tags-tiles" prefix="tiles" %>
+<%@ taglib uri="tags-bean" prefix="bean" %>
+<%@ taglib uri="tags-html" prefix="html" %>
+<%@ taglib uri="tags-logic" prefix="logic" %>
+<%@ taglib uri="tags-function" prefix="fn" %>
+<%@ taglib uri="tags-core" prefix="c" %>
+<%@ taglib uri="tags-fmt" prefix="fmt" %>
+<%@ taglib uri="tags-xml" prefix="x" %>
+<%@ taglib uri="tags-lams" prefix="lams" %>
+
+<c:set var="ALPHABET" value="${fn:split('a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z', ',')}" scope="request"/>
+<c:set var="ALPHABET_CAPITAL_LETTERS" value="${fn:split('A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z', ',')}" scope="request"/>
+