<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
   ______                  __  __
  / ____/___  __  ______  / /_/ /_  __
 / /   / __ \/ / / / __ \/ __/ / / / /
/ /___/ /_/ / /_/ / / / / /_/ / /_/ /
\____/\____/\__,_/_/ /_/\__/_/\__, /
              http://count.ly/____/
-->
<html>
<head>
	<title><%- countlyTitle %></title>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <meta name="referrer" content="no-referrer">
    <script><%- javascript %></script>
	<link rel="icon" type="image/png" href="<%- cdn %><%- countlyFavicon %>">
    <script type="text/javascript">
        //no one should really need this
        window.eval = function(){
            console.log("eval not available");
            window.Countly = window.Countly || {};
            Countly.q = Countly.q || [];
            Countly.q.push(['log_error', new Error("eval not available")]);
        };
        window.paceOptions = {
            ajax: {
                ignoreURLs: ["action=refresh", "method=live", "stats.count.ly", "method=get_events", "display_loader=false"]
            }
        };
    </script>
    <link rel="stylesheet" href="<%- cdn %>stylesheets/font-awesome/css/font-awesome.min.css?<%= countlyVersion %>" />
    <link rel="stylesheet" href="<%- cdn %>stylesheets/ionicons/css/ionicons.min.css?<%= countlyVersion %>" />
    <link rel="stylesheet" href="<%- cdn %>stylesheets/material/material-icons.css?<%= countlyVersion %>" />
	<link rel="stylesheet" href="<%- cdn %>javascripts/dom/jqueryui/jquery.ui.base.css?<%= countlyVersion %>" />
	<link rel="stylesheet" href="<%- cdn %>javascripts/dom/jqueryui/jquery.ui.theme.css?<%= countlyVersion %>" />
    <% if (production) { %>
		<link rel="stylesheet" href="<%- cdn %>stylesheets/main.min.css?<%= countlyVersion %>" />
		<link rel="stylesheet" href="<%- cdn %>stylesheets/plugins.min.css?<%= countlyVersion %>&<%= pluginsSHA %>" />
    	<!-- PRODUCTION -->
    	<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.dom.js?<%= countlyVersion %>"></script>
    	<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.utils.js?<%= countlyVersion %>"></script>
    <% } else { %>
		<link rel="stylesheet" href="<%- cdn %>stylesheets/main.css?<%= countlyVersion %>" />
		<link rel="stylesheet" href="<%- cdn %>stylesheets/vue/clyvue.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/tipsy/tipsy.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/amaranjs/amaran.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/selectize/selectize.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/jsoneditor/codemirror.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/visualization/rickshaw/rickshaw.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/pace/pace-theme-flash.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/utils/tooltipster/tooltipster.bundle.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/drop/drop-theme-countly.min.css?<%= countlyVersion %>" />
        <% if (stylesheets) { %>
			<% for(var i=0, l=stylesheets.length; i<l; i++) {%>
        <link rel="stylesheet" href="<%- cdn %><%= stylesheets[i] %>?<%= countlyVersion %>" />
			<% } %>
		<% } %>
	    <!-- DEVELOPMENT -->
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery/jquery.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.form.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/tipsy/jquery.tipsy.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.noisy.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.sticky.headers.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jqueryui/jquery-ui.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jqueryui/jquery-ui-i18n.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/slimScroll.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.easing.1.3.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/polyfills.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/underscore-min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/prefixfree.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/moment/moment-with-locales.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/handlebars.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/backbone-min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.i18n.properties.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jstz.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/store+json2.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.idle-timer.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/initialAvatar.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.amaran.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.titlealert.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.hoverIntent.minified.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/tooltipster/tooltipster.bundle.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/highlight/highlight.pack.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/dropzone.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.xss.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/webfont.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/selectize.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/polyfill/es6-promise.auto.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vuex.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-color.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vuelidate.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/v-tooltip.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-good-table.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/validators.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue2Dropzone.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/dataTables/js/jquery.dataTables.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/dataTables/js/TableTools.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/pace/pace.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/drop/tether.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/drop/drop.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/simpleUpload.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/codemirror.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/javascript.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/json2.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/jsonlint.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/minify.json.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/jsoneditor.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/simpleUpload.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/Sortable.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vuedraggable.umd.min.js?<%= countlyVersion %>"></script>

    <% } %>
    <% if (themeFiles && themeFiles.css) { %>
        <% for(var i=0, l=themeFiles.css.length; i<l; i++) {%>
    <link href='<%= themeFiles.css[i]%>?<%= countlyVersion %>' rel='stylesheet' type='text/css'>
        <% } %>
    <% } %>
    <script type="text/javascript">
	window.production = <%= production ? true : false %>;

	function loadMeterialIcons(canRetry) {
		WebFont.load({
			custom: {
				families: ['Material Icons'],
				urls: ['stylesheets/material/material-icons.css']
			},
			fontinactive: function (family, fvd) {
				if(canRetry){
					loadMeterialIcons(false); /* only try one more time */
				}
			},
			timeout: 5000
		})
	}
	loadMeterialIcons(true);
    </script>
    <% if (typeof inject_template.css != 'undefined') { %>
	<style><%- inject_template.css %></style>
	<% } %>
</head>
<body>
	<div id="top-bar">
		<div class="logo-container">
			<div id="hide-sidebar-button"></div>
			<!--
			Community Edition license doesn't include the right to remove Countly branding.
			If you wish to implement your own branding (e.g. your own logo, colors, etc.), you must license Countly Enterprise Edition.
			-->
			<a href="#/"><div class="logo"></div></a>
		</div>
		<div class="left-menu">
			<div id="app-navigation" class="dropdown bordered large">
				<div class="selected">
					<div id="active-app-icon" style="<% if (defaultApp){ %> background-image:url('<%- cdn %>appimages/<%= defaultApp._id %>.png'); <% } %>"></div>
					<div id="active-app-name" title="<% if (defaultApp){ %><%= defaultApp.name %><% } %>"><% if (defaultApp){ %><%= defaultApp.name %><% } %></div>
				</div>
				<div class="empty-state">Apps</div>
				<div class="menu">
					<div class="search nav-search">
						<input type="text" autofocus readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}">
					</div>
					<div class="list"></div>
				</div>
			</div>
		</div>
		<div class="right-menu">
			<div class="dropdown icon manage-long-tasks-menu-dropdown">
				<div id="manage-long-tasks-icon" class="empty-state unread">
                    <i class="fa fa-clock"></i>
					<div class="orange-side-notification-banner-wrapper">
						<div class="orange-side-notification-banner" data-localize="taskmanager.query-added-long"></div>
					</div>
                </div>
				<div class="menu right manage-long-tasks-menu" style="width:400px;">
                    <div class="menu-category-title">
						<p data-localize="sidebar.long-running-queries"></p>
						<a class="see-all"  href="#/manage/tasks#report-automatically"><span data-localize="common.see-all"></span>&rarr;</a>
					</div>
					<div class="tasks-wrapper">
						<div class="tasks scrollable"></div>
						</div>
				</div>
			</div>
            <div class="dropdown icon">
				<div class="empty-state">
                    <i class="fa fa-cog"></i>
                </div>
				<div class="menu right manage-menu">
                    <div class="menu-category-title" data-localize="sidebar.management"></div>
					<div id="manage-menu" class="list"></div>
				</div>
			</div>
			<div class="dropdown icon">
				<div class="empty-state">
					<i class="ion-person"></i>
				</div>
				<div class="menu right" style="width: 200px;">
					<div class="list">
						<span class="item_info">
							<div class="user_name">
								<div>
									<%= member.full_name %>
								</div>
								<div>
									<%= member.email %>
								</div>
								<div class="member_image">
								</div>
							</div>
							<div class="api_key">
								<div data-localize="sidebar.api_key">
								</div>
                                <div id="user_api_key_item">
                                    <input value="<%= member.api_key %>" readonly=true type="text"/>
								</div>
							</div>
						</span>
                        <div id="user-menu">
                            <a class="item" href='#/manage/user-settings' data-priority="10">
                                <i class="ion-gear-a icon"></i>
                                <div data-localize="plugins.user-configs"></div>
                            </a>
                            <a href="#/manage/token_manager" class="item" data-priority="11">
                                <i class="ion-key icon"></i>
                                <div data-localize="token_manager.page-title"></div>
                            </a>

                            <% if (typeof helpCenterLink === "string") { %>
                            <a class="item" href="<%= helpCenterLink %>" target="_blank" data-priority="19">
                                <i class="ion-help-buoy icon"></i>
                                <div data-localize="common.help-center"></div>
                            </a>
                            <% } %>
                            <% if (typeof helpCenterLink === "boolean" && helpCenterLink) { %>
                            <a class="item" href="https://support.count.ly" target="_blank" data-priority="19">
                                <i class="ion-help-buoy icon"></i>
                                <div data-localize="common.help-center"></div>
                            </a>
                            <% } %>

                            <% if (typeof documentationLink === "string") { %>
                            <a class="item" href="<%= documentationLink %>" target="_blank" data-priority="20">
                                <i class="ion-android-document icon"></i>
                                <div data-localize="common.documentation"></div>
                            </a>
                            <% } %>
                            <% if (typeof documentationLink === "boolean" && documentationLink) { %>
                            <a class="item" href="https://support.count.ly/hc/en-us/categories/360002373332-Knowledge-Base" target="_blank" data-priority="20">
                                <i class="ion-android-document icon"></i>
                                <div data-localize="common.documentation"></div>
                            </a>
                            <% } %>

                            <% if(typeof feedbackLink === "string") { %>
                            <a target="_new" href="<%= feedbackLink %>" class="item" data-priority="30">
                                <i class="ion-ios-star icon"></i>
                                <div data-localize="common.provide-feedback"></div>
                            </a>
                            <% } %>

                            <% if (typeof featureRequestLink === "string") { %>
                            <a class="item" href="<%= featureRequestLink %>" target="_blank" data-priority="40">
                                <i class="ion-android-textsms icon"></i>
                                <div data-localize="common.feature-request"></div>
                            </a>
                            <% } %>
                            <% if (typeof featureRequestLink === "boolean" && featureRequestLink) { %>
                            <a class="item" href="https://support.count.ly/hc/en-us/community/topics/360001464272-Feature-Requests" target="_blank" data-priority="40">
                                <i class="ion-android-textsms icon"></i>
                                <div data-localize="common.feature-request"></div>
                            </a>
                            <% } %>

                            <a id="user-logout" class="item" href="#" data-priority="1000000000">
                                <i class="ion-android-exit icon"></i>
                                <div data-localize="sidebar.logout"></div>
                            </a>
                        </div>
					</div>
				</div>
			</div>
			<div class="dropdown icon">
				<div class="empty-state reveal-language-menu">EN</div>
				<div class="menu right" style="width: 150px;">
					<div id="language-menu" class="list">
						<% for(var i=0, l=languages.length; i<l; i++) {%>
    						<a data-language-code="<%=languages[i].code%>" class="item"><%=languages[i].name%></a>
  						<% } %>
					</div>
				</div>
			</div>
		</div>
		<div style="clear: both"></div>
	</div>

	<div id="main-views-container">
		<div id="dashboards-main-view" class="main-view">
			<div id="custom-dashboard"></div>
		</div>
		<div id="analytics-main-view" class="main-view">
			<div id="sidebar">
				<div id="new-install-overlay"></div>
				<div id="sidebar-menu">
                    <div id="default-type" class="sidebar-menu" style="display: none;"></div>
                </div>
				<div id="version-info"><%= countlyTypeName %></div>
			</div>
			<div id="content-container">
				<div id="content-top"></div>
				<div id="content"></div>
			</div>
		</div>
	</div>

	<div id="overlay"></div>
    <div id="cly-resource" class="dialog black" style="max-width: 800px; max-height: 600px;">
        <div class="content"></div>
    </div>
	<div id="cly-popup" class="dialog black">
		<div class="indicator"></div>
		<div class="content"></div>
	</div>
	<div id="cly-loading" class="dialog black">
 		<div class="indicator"></div>
 		<div class="message"></div>
 		<div class="content">
 			<div class="loading-bars"> </div>
 		</div>
 	</div>
	<div id="cly-alert" class="dialog">
		<div class="indicator"></div>
        <div class="image"></div>
        <div class="title"></div>
		<div class="message"></div>
		<div class="buttons">
				<a id="dialog-ok" class="icon-button light" data-localize="common.ok"></a>
		</div>
	</div>
	<div id="cly-confirm" class="dialog">
		<div class="indicator"></div>
        <div class="image"></div>
        <div class="title"></div>
		<div class="message"></div>
		<div class="buttons">
            <div><div id="dialog-continue" class="icon-button light" data-localize="common.continue"></div></div>
            <div><div id="dialog-cancel" class="icon-button light" data-localize="common.cancel"></div></div>
		</div>
    </div>
    <div id="cly-json-editor" class="dialog json-dialog">
        <div class="header">
            <div class="title" data-localize="common.json-editor"></div>
            <div class="json-options">
                <div class="valid-json json-status">
                    <i class="material-icons">check_circle</i>
                    <span class="text" data-localize="common.valid-json"></span>
                </div>
                <div class="invalid-json json-status" style="display:none">
                    <i class="material-icons">warning</i>
                    <span class="text" data-localize="common.invalid-json"></span>
                </div>
                <div id="dialog-format" class="icon-button light" data-localize="common.format"></div>
            </div>
        </div>
        <div class="body">
        </div>
        <div class="buttons">
            <div id="dialog-cancel" class="icon-button light" data-localize="common.cancel"></div>
            <div id="dialog-continue" class="icon-button light" data-localize="common.saveJSON"></div>
        </div>
    </div>
    <div id="cly-export" class="dialog export-dialog">
		<p data-localize="export.export-as"></p>
        <div id="export-type-selector" class="button-selector light">
            <div class="button selected active" id="export-csv">.CSV</div>
			<div class="button" id="export-xlsx">.XLSX</div>
			<div class="button" id="export-json">.JSON</div>
        </div>
		<div class="export-columns-selector">
            <p data-localize="export.columns-to-export"></p>
            <p class="checkbox-line"><a data-index="" class="fa fa-square-o check-green check-header data-table-toggle-column export-all-columns"></a><span data-localize="export.export-all-columns"></span></p>
			
			<div class="export-columns-search"><table><tr><td><input type="text" placeholder="Search" data-localize="placeholder.search-columns" /></td><td><i class="fa fa-search"></i></td><tr></table></div>
            <div class="columns-height-wrapper">
				<div class="columns-wrapper"></div>
            </div>
        </div>
		<p class="checkbox-line export-format-option"><a data-index="" class="fa fa-square-o check-green check-header data-table-toggle-column export-format-columns"></a><span data-localize="export.format-if-possible"></span><i class="ion-information-circled"></i></p>
        <div class="icon-button green export-data" data-localize="export.export"></div>
	</div>
    <div id="cly-drawer-template" class="cly-drawer">
        <div class="title">
            <span></span>
            <div class="close"><i class="ion-ios-close-empty"></i></div>
        </div>
        <div class="details"></div>
        <div class="buttons">
            <div class="icon-button green disabled save-drawer-button"></div>
        </div>
    </div>

	<div id="edit-account-details">
		<div class="message">
			<div>
				<div class="title" data-localize="user-settings.username"></div>
				<div class="input"><input id="username" type="text" value="" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}"/></div>
			</div>
			<div style="margin-top:15px;">
				<div class="title" data-localize="user-settings.change-password"></div>
				<div class="input">
					<div><input id="old_pwd" type="password" placeholder="Old password..." data-localize="placeholder.old-password"/></div>
					<div style="margin-top:10px;"><input id="new_pwd" type="password" placeholder="New password..." data-localize="placeholder.new-password"/></div>
					<div style="margin-top:5px;"><input id="re_new_pwd" type="password" placeholder="Again..." data-localize="placeholder.again"/></div>
				</div>
			</div>
			<div style="margin-top:15px;">
				<div class="title" data-localize="user-settings.api-key"></div>
				<div class="input"><input id="api-key" type="text" value=""/></div>
			</div>
		</div>
		<div class="buttons">
			<div id="settings-save-result" class="result-message"></div>
			<a id="save-account-details" class="icon-button light" data-localize="common.save"></a>
			<a id="dialog-cancel" class="icon-button light" data-localize="common.close"></a>
		</div>
	</div>

    <script id="template-date-selector" type="text/x-handlebars-template">
		<div id="date-selector" class="help-zone-vs">
            <div class="calendar" id="date-picker-button">
                <i class="material-icons">date_range</i>
                <span id="selected-date"></span>
                <span class="down ion-chevron-down"></span>
                <span class="up ion-chevron-up"></span>
            </div>
			<div id="date-picker">
                <div class="date-selector-buttons">
                    <div class="button date-selector" id="yesterday" data-localize="common.yesterday"></div>
                    <div class="button date-selector" id="hour" data-localize="common.today"></div>
                    <div class="button date-selector" id="7days" data-localize="taskmanager.last-7days"></div>
                    <div class="button date-selector" id="30days" data-localize="taskmanager.last-30days"></div>
                    <div class="button date-selector" id="60days" data-localize="taskmanager.last-60days"></div>
                    <div class="button date-selector" id="day"></div>
                    <div class="button date-selector" id="month"></div>

                    <!--<div class="button date-selector" id="90days" data-localize="common.90days"></div>-->
                    <div class="button-container">
                        <div id="date-submit" class="icon-button green" data-localize="common.apply"></div>
                        <div id="date-cancel" class="icon-button" data-localize="common.cancel"></div>
                    </div>
                </div>
                <div class="calendar-container">
                    <table>
                        <tr>
                            <td class="calendar-block">
                                <div id="date-from" class="calendar"></div>
                            </td>
                            <td class="calendar-block">
                                <div id="date-to" class="calendar"></div>
                            </td>
                        </tr>
                        <tr>
                            <td class="calendar-block">
                                <input type="text" class="calendar-input-field" id="date-from-input"></input><span class="date-input-label" data-localize="common.from"></span>
                            </td>
                            <td class="calendar-block">
                                <input type="text" class="calendar-input-field" id="date-to-input"></input><span class="date-input-label" data-localize="common.to"></span>
                            </td>
                        </tr>
                    </table>

				</div>
			</div>
		</div>
    </script>

	<script id="template-date-time-selector" type="text/x-handlebars-template">
		<div class="date-time-selector-container">
			<div class="calendar" id="date-picker-button">
				<i class="material-icons">date_range</i>
				<span class="date-time-value-show">Set date & time </span>
				<span class="ion-chevron-down" style="float:right;width: 15px; height: 100%; line-height: 27px;font-size: 12px; opacity: 0.8;margin-right: 5px;"></span>
			</div>
			<div class="date-time-picker">
				<div class="button-container">
					<div  class="date-submit icon-button green" data-localize="common.apply" style="float:right; margin-right:11px;"></div>
					<div  class="date-clear icon-button" data-localize="common.close" style="float:right;"></div>
				</div>
				<div class="time-field">
					<span class="time-label" data-localize="datepicker.pick-time"></span>
					<input name="hour" type="number"  onchange="if( this.value.length == 1 ) this.value='0'+this.value;" class="time-input hour" min="0" max="23" value="00"/>
					<span class="time-split"> : </span>
					<input name="minute" type="number"  onchange="if( this.value.length == 1 ) this.value='0'+this.value;" class="time-input minute" min="0" max="59" value="00"/>
				</div>
			</div>
		</div>
	</script>

	<script id="template-app-categories" type="text/x-handlebars-template">
		<div data-value="1" class="item" data-localize="application-category.books"></div>
		<div data-value="2" class="item" data-localize="application-category.business"></div>
		<div data-value="3" class="item" data-localize="application-category.education"></div>
		<div data-value="4" class="item" data-localize="application-category.entertainment"></div>
		<div data-value="5" class="item" data-localize="application-category.finance"></div>
		<div data-value="6" class="item" data-localize="application-category.games"></div>
		<div data-value="7" class="item" data-localize="application-category.health-fitness"></div>
		<div data-value="8" class="item" data-localize="application-category.lifestyle"></div>
		<div data-value="9" class="item" data-localize="application-category.medical"></div>
		<div data-value="10" class="item" data-localize="application-category.music"></div>
		<div data-value="11" class="item" data-localize="application-category.navigation"></div>
		<div data-value="12" class="item" data-localize="application-category.news"></div>
		<div data-value="13" class="item" data-localize="application-category.photography"></div>
		<div data-value="14" class="item" data-localize="application-category.productivity"></div>
		<div data-value="15" class="item" data-localize="application-category.reference"></div>
		<div data-value="16" class="item" data-localize="application-category.social-networking"></div>
		<div data-value="17" class="item" data-localize="application-category.sports"></div>
		<div data-value="18" class="item" data-localize="application-category.travel"></div>
		<div data-value="19" class="item" data-localize="application-category.utilities"></div>
		<div data-value="20" class="item" data-localize="application-category.weather"></div>
	</script>

	<script id="template-analytics-common"  type="text/x-handlebars-template">
		<div class="widget">
			<div class="widget-header">
				<div class="left">
					<div class="title">{{page-title}}</div>
				</div>
				{{> date-selector }}
			</div>

            {{#if graph-description}}
            <div class="graph-description">{{graph-description}}</div>
            {{/if}}

			{{#if drill-filter}}
			<div id="view-filter" style="background-color: #ededed !important; border-top: none !important">
				<div class="separator in-retention"></div>
				<div id="toggle-filter" style="padding:10px; cursor:pointer; position:relative; min-height:20px">
					<div id="current-filter" style="display:none; font-family:Ubuntu; font-size:15px; text-align:center; color:#999;">
					<div class="text"></div>
					<div id="remove-filter" style="position: absolute;font-size: 16px;right: 0px;top: 0px;width: 33px;height: 29px;padding-top: 11px;"><i class='ion-close'></i></div>
					</div>
					<div id="no-filter" style="font-size:13px; text-transform: uppercase;color:#5f5f5f;">
					<div class="on-off-switch" id="switch-trigger"><input type="checkbox" class="on-off-switch-checkbox" id="apply-filter-cbox"><label class="on-off-switch-label" for="apply-filter-cbox"></label></div>
					<span style="user-select: none; top: 1px; position: relative;" data-localize="drill.apply-filter">Apply Filter</span>
					</div>
				</div>
				<div class="filter-view-container centered in-retention">
					{{> filter-view }}
				</div>
			</div>
			{{/if}}

            <div class="widget-content help-zone-vb" data-help-localize="help.{{{chart-helper}}}" style="{{#if graph-type-double-pie}} overflow:hidden; {{else}} {{#if chartHTML}}  {{else}} height:300px; padding-top:35px; padding-bottom:10px; {{/if}}{{/if}}">
				{{#if graph-type-double-pie}}
				<div class="pie-chart-container">
					<div style="border-right:1px solid #CCC; width: 100%; height: 100%">
						<div class="pie-overlay one {{logo-class}}">
                            <div class="logo ion ion-person-stalker"></div>
							<div class="title">{{pie-titles.left}}</div>
						</div>
						<div id="dashboard-graph" class="graph" style="margin:0 auto !important; height:360px; font-family:'Ubuntu';"></div>
					</div>
				</div>
				<div class="pie-chart-container">
					<div class="pie-overlay two {{logo-class}}">
                        <div class="logo ion ion-person-add"></div>
						<div class="title">{{pie-titles.right}}</div>
					</div>
					<div id="dashboard-graph2" class="graph" style="margin:0 auto !important; height:360px; font-family:'Ubuntu';"></div>
				</div>
				{{else}}
                    {{#if chartHTML}}
                        {{{chartHTML}}}
                    {{else}}
                    <div id="dashboard-graph" class="graph" style="height:100%; margin-left:-10px; {{#if isChartEmpty}} display:none; {{/if}}"></div>
                    <div class="graph-no-data" {{#if isChartEmpty}} style="display:block;" {{/if}}>
                        <div class="inner">
                            <div class="icon"></div>
                            <div class="text" data-localize="common.graph.no-data"></div>
                        </div>
                    </div>
                    {{/if}}
				{{/if}}
			</div>
			{{#if big-numbers}}
			<div class="widget-footer big-numbers-v2">
				<div id="big-numbers-container">
					{{#each big-numbers.items}}
					<div class="big-numbers {{#if ../../big-numbers.class}}{{../../big-numbers.class}}{{else}}three-column{{/if}} help-zone-vs" data-help-localize="help.{{this.help}}">
						<div class="inner">
                            <div class="color"></div>
							<div class="select">{{this.title}}</div>
							<div class="number">{{getFormattedNumber this.total}}</div>
                            <div class="trend {{this.trend}}">
                                {{#ifCond this.trend "==" "u"}}
                                <i class="material-icons">trending_up</i>
                                {{else}}
                                <i class="material-icons">trending_down</i>
                                {{/ifCond}}
                            </div>
                        </div>
					</div>
					{{/each}}
				</div>
			</div>
			{{/if}}
		</div>
		{{#if bars}}
		<div class="dashboard-summary {{#if bars-class}}{{bars-class}}{{else}}three{{/if}}">
			{{#each bars}}
			<div class="item help-zone-vs device-bar-item" data-help-localize="help.{{this.help}}">
				<div class="inner inner-new">
					<div class="title title-new">{{this.title}}</div>
					{{#if this.data}}
					<div class="bar bar-new">
						{{#each this.data}}
							{{#if this.type}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);"
									data-item="{{this.name}} ({{this.count}} visits)" data-percent="{{this.percent}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{else}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);"
									data-item="{{this.name}}" data-percent="{{this.percent}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{/if}}
						{{/each}}
						{{#forNumberOfTimesCalc 3 data.length}}
				    		<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);">
							</div>
				        {{/forNumberOfTimesCalc}}
				    </div>
					{{else}}
					<div class="bar bar-new" style="width:100% !important">
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important"
							data-item="" data-localize="common.bar.no-data" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
					</div>
					{{/if}}
				</div>
			</div>
			{{/each}}
		</div>
		{{/if}}
        <table id="dataTableOne" class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        {{#if two-tables}}
            {{#if segmentation}}
            <div class="widget segmentation-widget">
                <div class="widget-header">
                    <div class="left">
                        <div class="title small">{{segment-title}}</div>
                        <div>
                            <div class="cly-select float">
                                <div class="select-inner">
                                    <div class="text-container">
                                        <div class="text">{{active-segment}}</div>
                                    </div>
                                    <div class="right combo"></div>
                                </div>
                                <div class="select-items square" style="width:220px;">
                                    <div>
                                        {{#eachOfArray segmentation}}
                                        <div data-value="{{value.value}}" class="segmentation-option item">{{value.name}}</div>
                                        {{/eachOfArray}}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="segmentation-table">
                <table id="dataTableTwo" class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
            {{else}}
            <table id="dataTableTwo" class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            {{/if}}
        {{/if}}
	</script>

	<script id="template-analytics-countries"  type="text/x-handlebars-template">
		<div class="widget">
			<div class="widget-header">
				<div class="left">
					<div class="title">{{page-title}}</div>
				</div>
				{{> date-selector }}
                <div class="right">
                    <a id='country-toggle' class='icon-button light btn-header'></a>
                </div>
			</div>
            <div class="widget-tips"><a href="#/manage/configurations/frontend"><span data-localize="countries.google-api-key-remind"></a></span></div>
			<div class="widget-content help-zone-vb" data-help-localize="help.{{{chart-helper}}}" style="height:480px;">
				<div id="geo-chart-outer" class="big"><div><div id="geo-chart"></div></div></div>
			</div>
			<div class="widget-footer big-numbers-v2 geo-switch">
                {{#if big-numbers}}
				<div id="big-numbers-container">
					{{#each big-numbers.items}}
					<div data-id="{{this.radio-button-id}}" class="big-numbers radio {{#if ../../big-numbers.class}}{{../../big-numbers.class}}{{else}}three-column{{/if}} help-zone-vs {{this.radio-button-class}}" data-help-localize="help.{{this.help}}">
						<div class="inner">
                            <div class="color"></div>
							<div class="select">{{this.title}}</div>
							<div class="number">{{getFormattedNumber this.total}}</div>
                            <div class="trend {{this.trend}}">
                                {{#ifCond this.trend "==" "u"}}
                                <i class="material-icons">trending_up</i>
                                {{else}}
                                <i class="material-icons">trending_down</i>
                                {{/ifCond}}
                            </div>
						</div>
					</div>
					{{/each}}
				</div>
                {{/if}}
			</div>
		</div>
		<table class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
	</script>

	<script id="template-management-applications" type="text/x-handlebars-template">
		<div id="app-management-bar">
			<div id="app-nav-head">
				<div id="app-nav-title" data-localize="management-applications.title"></div>
			</div>
            <% if(member['global_admin'] || config.autonomous) { %>
            <a id="add-app-button" class="help-zone-vs" data-help-localize="help.manage-apps.app-add-button" >
                <i class="icon ion-plus-circled"></i>
                <span data-localize="common.add-new-app-button">Add new App</span>
            </a>
            <% } %>
            <div class="nav-search">
                <i class="fa fa-search"></i>
                <input type="search" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}">
            </div>
			<div id="management-app-container" class="scrollable">
				{{#eachOfObjectValue admin_apps}}
				<div class="app-container searchable" data-key="{{this.key}}" data-id="{{this._id}}">
					<div class="logo" style="background-image: url('<%- cdn %>appimages/{{this._id}}.png');"></div>
					<div class="name">{{this.name}}</div>
				</div>
				{{/eachOfObjectValue}}
			</div>
			<div id="manage-new-app">
				<div class="app-container">
					<div class="logo"></div>
					<div class="name" data-localize="management-applications.my-new-app"></div>
				</div>
			</div>
		</div>
		<div class="widget" style="margin-left:199px;">
			<div id="add-new-app">
				<div class="widget-header">
					<div class="left">
						<div class="title new-app-name" data-localize="management-applications.my-new-app"></div>
					</div>
				</div>
				<div>
					<table class="d-table horizontal" cellpadding="0" cellspacing="0">
						<tbody>
							<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-name">
								<td data-localize="management-applications.application-name"></td>
								<td>
									<input type="text" value="" placeholder="Enter application name..." data-localize="placeholder.app-name" id="app-add-name" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}">
								</td>
							</tr>
                            <tr class="help-zone-vs" data-help-localize="help.manage-apps.app-type">
								<td data-localize="management-applications.type"></td>
								<td>
									<div class="cly-select select-app-types" style="width:283px;">
										<div class="select-inner">
											<div class="text-container">
												<div class="text" id="app-add-type" data-localize="management-applications.type.tip"></div>
											</div>
											<div class="right combo"></div>
										</div>
										<div class="select-items square" style="width:283px;">
											<div>
												{{#eachOfObject app_types}}
                                                    <div data-value="{{property}}" class="item">{{value}}</div>
                                                {{/eachOfObject}}
											</div>
										</div>
									</div>
                                    <div class="hint" data-localize="management-applications.type.hint"></div>
                                </td>
							</tr>
							<!--<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-category">
								<td data-localize="management-applications.category"></td>
								<td>
									<div class="cly-select" style="width:280px;">
										<div class="select-inner">
											<div class="text-container">
												<div class="text" id="app-add-category" data-localize="management-applications.category.tip"></div>
											</div>
											<div class="right combo"></div>
										</div>
										<div class="select-items square" style="width:280px;">
											<div>
												{{> app-categories }}
											</div>
										</div>
									</div>
								</td>
							</tr>-->
							<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-timezone">
								<td data-localize="management-applications.time-zone"></td>
								<td id="app-add-timezone" >
                                    <div>
                                        <div style="float:left;">
                                            <div id="country-select" class="cly-select" style="width:283px;">
                                                <div class="select-inner">
                                                    <div class="text-container">
                                                        <div class="text"></div>
                                                    </div>
                                                    <div class="right combo"></div>
                                                </div>
                                                <div class="select-items square" style="width:283px;">
                                                    <div id="country-items"></div>
                                                </div>
                                            </div>
                                            <div id="timezone-select" class="cly-select" style="width:200px; display:none;">
                                                <div class="select-inner">
                                                    <div class="text-container">
                                                        <div class="text"></div>
                                                    </div>
                                                    <div class="right combo"></div>
                                                </div>
                                                <div class="select-items square" style="width:200px;">
                                                    <div id="timezone-items"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div id="selected" style="float:left; font-size:14px; padding:8px 10px 5px; color:#666;"></div>
                                        <input type="hidden" value="" id="app-timezone"/>
                                        <input type="hidden" value="" id="app-country"/>
                                    </div>
                                    <div class="hint" data-localize="management-applications.time-zone.hint"></div>
                                </td>
							</tr>
                            <tr class="help-zone-vs" data-help-localize="help.manage-apps.app-icon">
								<td data-localize="management-applications.icon"></td>
								<td>
									<form action="/apps/icon" enctype="multipart/form-data" id="add-app-image-form" method="post">
										<input type="file" id="app_add_image" name="app_image" />
										<input type="hidden" id="app_add_image_id" name="app_image_id" />
									</form>
								</td>
							</tr>
							<tr class="table-add">
								<td colspan="2">
									<a id="save-app-add" class="icon-button light" data-localize="management-applications.add-application"></a>
									<a id="cancel-app-add" class="icon-button light" data-localize="common.cancel"></a>
								</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
			<div id="add-first-app">
				<div class="add-app-input-wrapper">
					<label class="add-app-input-label" data-localize="management-applications.application-name"></label>
					<input value="" placeholder="Enter application name..." data-localize="placeholder.app-name" class="add-app-input-text" type="text" id="first-app-add-name" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}">
				</div>
				<div class="add-app-input-wrapper">
					<label class="add-app-input-label" id="select-app-type-label" data-localize="management-applications.type"></label>
					<div class="add-app-input cly-select select-app-types" id="select-app-type" style="width:100%;">
						<div class="select-inner">
							<div class="text-container">
								<div class="text" id="first-app-add-type" data-localize="management-applications.type.tip"></div>
							</div>
							<div class="right combo"></div>
						</div>
						<div class="select-items square" style="width:100%;">
							<div>
								{{#eachOfObject app_types}}
								<div data-value="{{property}}" class="item">{{value}}</div>
								{{/eachOfObject}}
							</div>
						</div>
					</div>
				</div>
				<div class="add-app-input-wrapper">
					<label class="add-app-input-label" data-localize="management-applications.time-zone"></label>
					<div id="first-app-add-timezone">
						<div>
							<div id="country-select" class="cly-select" style="width:100%;">
								<div class="select-inner">
									<div class="text-container">
										<div class="text"></div>
									</div>
									<div class="right combo"></div>
								</div>
								<div class="select-items square" style="width:100%;">
									<div id="country-items"></div>
								</div>
							</div>
							<div id="timezone-select" class="cly-select" style="width:100%; display:none;">
								<div class="select-inner">
									<div class="text-container">
										<div class="text"></div>
									</div>
									<div class="right combo"></div>
								</div>
								<div class="select-items square" style="width:100%;">
									<div id="timezone-items"></div>
								</div>
							</div>
						</div>
						<div id="selected" style="display:none; float:left; font-size:14px; padding:8px 10px 5px; color:#666;"></div>
						<input type="hidden" value="" id="first-app-timezone"/>
						<input type="hidden" value="" id="first-app-country"/>
					</div>
				</div>
				<div class="add-app-input-wrapper">
					<br>
					<label class="add-app-input-label" data-localize="management-applications.icon"></label>
					<form action="/apps/icon" enctype="multipart/form-data" id="add-first-app-image-form" method="post">
						<input type="file" id="first-app_add_image" name="app_image" />
						<input type="hidden" id="first-app_image_id" name="app_image_id" />
					</form>
				</div>
				<div class="add-app-input-wrapper">
					<a id="save-first-app-add" class="add-first-app-button" data-localize="management-applications.add-application"></a>
				</div>
				<div style="clear:both"></div>
			</div>
			<div id="view-app">
				<div class="widget-header">
					<div class="left">
						<div class="title"></div>
						<div class="lock-status"><i></i><span></span></div>
					</div>
					<div style="float:right; min-width:260px; overflow:hidden; margin-top:6px;">
                        <a class="right icon-button light cly-button-menu-trigger ion-more"></a>
                        <div class="cly-button-menu app-management-menu" tabindex="100">
                            <div id="app-edit-button" class="item" data-help-localize="help.manage-apps.app-edit-button">
                                <span data-localize="common.edit"></span>
                            </div>
                            <hr/>
                            <div id="app-lock-button" class="item">
                                <div>
                                    <span class="lock-status" style="margin-right: 3px;"><i></i></span>
                                    <span class="lock-action"></span>
                                </div>
                                <div class="hint" data-localize="management-applications.application-lock-tooltip"></div>
                            </div>
                            <div id="app-reset-button" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-reset-data"></span>
                                <div class="hint" data-localize="management-applications.clear-reset-explanation"></div>
                            </div>
                            <div id="app-clear-button" class="item">
                                <div class="container">
                                    <span class="red" data-localize="management-applications.clear-data"></span>
                                    <div class="hint" data-localize="help.manage-apps.app-clear-button-hint"></div>
                                </div>
                                <i class="ion-chevron-right"></i>
                            </div>
                            <div id="app-delete-button" class="item">
                                <span class="red" data-localize="common.delete"></span>
                                <div class="hint" data-localize="help.manage-apps.app-delete-button-hint"></div>
                            </div>
                        </div>
                        <div class="cly-button-menu app-management-clear-menu" tabindex="100">
                            <div class="item back">
                                <i class="ion-chevron-left"></i>
                                <span data-localize="common.back"></span>
                            </div>
                            <div id="clear-1month" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-1month-data"></span>
                            </div>
                            <div id="clear-3month" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-3month-data"></span>
                            </div>
                            <div id="clear-6month" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-6month-data"></span>
                            </div>
                            <div id="clear-1year" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-1year-data"></span>
                            </div>
                            <div id="clear-2year" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-2year-data"></span>
                            </div>
                            <div id="clear-all" class="item clear-item">
                                <span class="red" data-localize="management-applications.clear-all-data"></span>
                            </div>
                        </div>
					</div>
				</div>
				<div class="app-details">
					<input type="hidden" id="app-edit-id"/>
					<table class="d-table horizontal" cellpadding="0" cellspacing="0">
						<tbody>
							<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-name">
								<td data-localize="management-applications.application-name"></td>
								<td id="app-edit-name">
									<div class="read"><span></span><a id="app_details" data-localize="management-applications.application-details"></a></div>
									<div class="edit">
										<input type="text" value="" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}">
									</div>
								</td>
							</tr>
                            <tr class="help-zone-vs" data-help-localize="help.manage-apps.app-type">
								<td data-localize="management-applications.type"></td>
								<td id="app-edit-type">
									<div class="read"></div>
									<div class="edit">
										<div class="cly-select select-app-types">
											<div class="select-inner">
												<div class="text-container">
													<div class="text"></div>
												</div>
												<div class="right combo"></div>
											</div>
											<div class="select-items square">
												<div>
													{{#eachOfObject app_types}}
                                                        <div data-value="{{property}}" class="item">{{value}}</div>
                                                    {{/eachOfObject}}
												</div>
											</div>
										</div>
									</div>
                                    <div class="hint" data-localize="management-applications.type.hint"></div>
								</td>
							</tr>
							<!--<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-category">
								<td data-localize="management-applications.category"></td>
								<td id="app-edit-category">
									<div class="read"></div>
									<div class="edit">
										<div class="cly-select">
											<div class="select-inner">
												<div class="text-container">
													<div class="text"></div>
												</div>
												<div class="right combo"></div>
											</div>
											<div class="select-items square">
												<div>
													{{> app-categories }}
												</div>
											</div>
										</div>
									</div>
								</td>
							</tr>-->
							<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-key">
								<td data-localize="management-applications.app-key"></td>
								<td id="app-edit-key">
									<div class="read"></div>
									<div class="edit">
										<input type="text" value="">
										<input type="hidden" id="app_key_hidden" name="app_key_hidden" />
									</div>
                                    <div class="hint" data-localize="management-applications.app-key.hint"></div>
                                </td>
							</tr>
							<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-timezone">
								<td data-localize="management-applications.time-zone"></td>
								<td id="app-edit-timezone">
									<div class="read">
											<div class="flag"></div>
											<div class="country"></div>
											<div class="timezone"></div>
									</div>
									<div class="edit">
										<div style="float:left;">
											<div id="country-select" class="cly-select" style="width:283px;">
												<div class="select-inner">
													<div class="text-container">
														<div class="text"></div>
													</div>
													<div class="right combo"></div>
												</div>
												<div class="select-items square" style="width:283px;">
													<div id="country-items"></div>
												</div>
											</div>
											<div id="timezone-select" class="cly-select" style="width:200px; display:none;">
												<div class="select-inner">
													<div class="text-container">
														<div class="text"></div>
													</div>
													<div class="right combo"></div>
												</div>
												<div class="select-items square" style="width:200px;">
													<div id="timezone-items">

													</div>
												</div>
											</div>
										</div>
										<div id="selected" style="float:left; font-size:14px; padding:8px 10px 5px; color:#666;"></div>
										<input type="hidden" value="" id="app-timezone"/>
										<input type="hidden" value="" id="app-country"/>
									</div>
                                    <div class="hint" data-localize="management-applications.time-zone.hint"></div>
                                </td>
							</tr>
							<tr class="help-zone-vs" data-help-localize="help.manage-apps.app-icon">
								<td data-localize="management-applications.icon"></td>
								<td id="app-edit-image">
									<div class="read">
										<div class="logo"></div>
									</div>
									<div class="edit">
										<form action="/apps/icon" enctype="multipart/form-data" id="add-edit-image-form" method="post">
											<input type="file" id="app_edit_image" name="app_image" />
											<input type="hidden" id="app_edit_image_id" name="app_image_id" />
										</form>
									</div>
								</td>
							</tr>
                            <tr class="help-zone-vs" data-help-localize="help.manage-apps.checksum-salt">
								<td data-localize="management-applications.checksum-salt"></td>
								<td id="app-edit-salt">
									<div class="read"></div>
									<div class="edit">
										<input type="text" value="" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}">
									</div>
                                    <div class="hint" data-localize="management-applications.checksum-salt.hint"></div>
								</td>
							</tr>
                            <tr class="help-zone-vs" data-help-localize="help.manage-apps.app-id">
                                <td data-localize="management-applications.app-id"></td>
                                <td>
                                    <div id="view-app-id"></div>
                                    <div class="hint" data-localize="management-applications.app-id.hint"></div>
                                </td>
                            </tr>
							<tr class="table-edit">
								<td colspan="2">
									<a id="save-app-edit" class="icon-button green" data-localize="common.save-changes"></a>
									<a id="cancel-app-edit" class="icon-button light" data-localize="common.cancel"></a>
								</td>
							</tr>
						</tbody>
					</table>
				</div>
				<div class="widget-header">
					<div class="left">
						<div class="title" data-localize="management-applications.plugins"></div>
					</div>
				</div>
				<div id="management-applications-description" class="graph-description" style="border-bottom-width: 0px;" data-localize="management-applications.plugins-description"></div>
				<div class="app-details-plugins">
				</div>
			</div>
			</div>
            <div id="code-countly" style="display: none;">
                <div id="code-countly-logo"></div>
                <div id="code-countly-content">
                    <h3 data-localize="common.integrate-sdks"></h3>
                    <p data-localize="common.integrate-sdks-text"></p>
                    <p class="select-platforms" data-localize="common.integrate-sdks-platforms"></p>
                    <div class="sdks"></div>
                </div>
			</div>
			<div id="no-app-warning" class="alert danger" data-localize="management-applications.no-app-warning"></div>
			<div id="first-app-success" class="alert success" data-localize="management-applications.first-app-message2"></div>
		</div>
	</script>
    <script id="template-management-plugins"  type="text/x-handlebars-template">
    	<div class="mgmt-plugins">
    	{{#eachOfArray plugins}}
    		<h3 data-index="{{value.index}}">{{value.title}}</h3>
    		<form>
    		</form>
    	{{/eachOfArray}}
    	</div>
    </script>
    <script id="template-events-blueprint"  type="text/x-handlebars-template">
        <div id="events-custom-settings">
        <div class="widget">
            <div id="evens-blueprint-config">
                <div id="tabs" style="position: unset;">
                    <ul>
                        <li><a href="#events-events" data-localize="events.blueprint-events-tab-title"></a></li>
                        <li><a href="#events-event-groups" data-localize="events.blueprint-eventgroups-tab-title"></a></li>
                    </ul>
                    <div id="events-events">
                        <div class="widget-header">
                            <div class="left">
                                <div style="overflow:auto">
                                    <div class="title small" data-localize="events.blueprint-title"></div>
                                </div>
                                <div class="cly-select float" id="events-general-filter">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text"><span data-localize="events.blueprint-events-show.all"></span></div>
                                        </div>
                                        <div class="drop-icn"></div>
                                    </div>
                                    <div id="event-filter-types" class="select-items square">
                                        <div data-value="all" class="segmentation-option item"><span data-localize="events.blueprint-events-show.all"></span></div>
                                        <div data-value="visible" class="segmentation-option item"><span data-localize="events.blueprint-events-show.visible"></span></div>
                                        <div data-value="hidden" class="segmentation-option item"><span data-localize="events.blueprint-events-show.hidden"></span></div>
                                    </div>
                                </div>
                            </div>
                            <div class="right">
                                <div class="icon-button green" id="events-apply-order" data-localize="plugins.apply"></div>
                                <div class="cly-select green disabled" id="events-general-action" style="margin-top:7px;">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text" data-localize="events.general.action.perform-action"></div>
                                        </div>
                                        <div class="right combo"></div>
                                    </div>
                                    <div class="select-items square">
                                        <div data-value="show" class="event-option item" data-localize="events.general.action.show">Show</div>
                                        <div data-value="hide" class="event-option item" data-localize="events.general.action.hide">Hide</div>
                                        <div data-value="delete" class="event-option item" data-localize="events.general.action.delete">Delete</div>
                                    </div>
                                </div>
            
                            </div>
                        </div>
                        <div class="" id="events-custom-settings-table">
                            <div class="cly-button-menu event-settings-menu" tabindex="1">
                                <a class="item event_toggle_visibility" data-changeto="hide"><i class="fa fa-eye-slash"></i><span data-localize="events.general.action.hide"></span></a>
                                <a class="item event_toggle_visibility" data-changeto="show"><i class="fa fa-eye" ></i><span data-localize="events.general.action.show"></span></a>
                                <a class="item delete_single_event"><i class="fa fa-trash"></i><span data-localize="common.delete"></span></a>
                            </div>
                            <table class="d-table help-zone-vb no-fix events-table" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
                        </div>
                    </div>

                    <div id="events-event-groups">
                        <div class="widget-header">
                            <div class="left">
                                <div style="overflow:auto">
                                    <div class="title small" data-localize="events.blueprint-event-group-title"></div>
                                </div>
                                <div class="cly-select float" id="event-group-general-filter">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text"><span data-localize="events.blueprint-event-group-show.all"></span></div>
                                        </div>
                                        <div class="drop-icn"></div>
                                    </div>
                                    <div id="event-group-filter-types" class="select-items square">
                                        <div data-value="all" class="segmentation-option item"><span data-localize="events.blueprint-event-group-show.all"></span></div>
                                        <div data-value="visible" class="segmentation-option item"><span data-localize="events.blueprint-event-group-show.visible"></span></div>
                                        <div data-value="hidden" class="segmentation-option item"><span data-localize="events.blueprint-event-group-show.hidden"></span></div>
                                    </div>
                                </div>
                            </div>
                            <div class="right">
                                <div class="icon-button green" style="display:block !important;margin-top: 7px;margin-right: 10px;" id="new-event-group-button" data-localize="events.blueprint-event-group-new"></div>
                                <div class="icon-button green" style="margin-top: 7px;margin-right: 10px;" id="event-groups-apply-order" data-localize="plugins.apply"></div>
                                <div class="cly-select green disabled" id="event-groups-general-action" style="margin-top:7px;">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text" data-localize="events.general.action.perform-action"></div>
                                        </div>
                                        <div class="right combo"></div>
                                    </div>
                                    <div class="select-items square">
                                        <div data-value="show" class="event-option item" data-localize="events.general.action.show">Show</div>
                                        <div data-value="hide" class="event-option item" data-localize="events.general.action.hide">Hide</div>
                                        <div data-value="delete" class="event-option item" data-localize="events.general.action.delete">Delete</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="" id="event-groups-settings-table">
                            <div class="cly-button-menu event-groups-settings-menu" tabindex="1">
                                <a class="item event_toggle_visibility" data-changeto="hide"><i class="fa fa-eye-slash"></i><span data-localize="events.general.action.hide"></span></a>
                                <a class="item event_toggle_visibility" data-changeto="show"><i class="fa fa-eye" ></i><span data-localize="events.general.action.show"></span></a>
                                <a class="item delete_single_event"><i class="fa fa-trash"></i><span data-localize="common.delete"></span></a>
                            </div>
                            <table class="d-table help-zone-vb no-fix event-groups-table" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
                        </div>
                        </div>
                </div>
            </div>
        </div>
    </div>
    <div id="events-event-settings">
        {{#if active-event}}
        <div class="widget" style="margin-left:200px;">
            <div class="widget-header widget">
                <div class="left">
                    <div class="title dynamic-title" >{{active-event.key}}</div>
                </div>
                <div class="right">
                    <div class="icon-button green" id="events-apply-changes" data-localize="plugins.apply"></div>
                </div>
            </div>
            <div class="configs title-rows-hidden" id="events-settings-table">
                <table class="d-table help-zone-vb">
                    <tr class="config-table-row">
                        <td>
                            <table class="d-table help-zone-vb">
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-key"></div>
                                        <span data-localize="events.edit.event-key-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        {{active-event.key}}
                                        <input type="hidden" value="{{active-event.key}}" name="event_key" class="event_key" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-name"></div>
                                        <span data-localize="events.edit.event-name-description"  class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_name" value="{{active-event.name}}" maxlength="127" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-description"></div>
                                        <span data-localize="events.edit.event-description-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <textarea rows="5" style="width: 100%;" class="event_description" >{{{active-event.description}}}</textarea>
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-visible"></div>
                                        <span data-localize="events.edit.event-visible-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <div class="on-off-switch">
                                            <input id="events.event_visible" class="on-off-switch-checkbox event_visible" type="checkbox"  {{#if active-event.is_visible}}checked {{/if}}/>
                                            <label class="on-off-switch-label" for="events.event_visible"></label>
                                            <span class="text">Enable</span>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.display-count"></div>
                                        <span data-localize="events.edit.display-count-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_count" maxlength="25" value="{{active-event.count}}" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.display-sum"></div>
                                        <span data-localize="events.edit.display-sum-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_sum" maxlength="25" value="{{active-event.sum}}" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.display-duration"></div>
                                        <span data-localize="events.edit.display-duration-description"  class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_dur" maxlength="25" value="{{active-event.dur}}" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.omit-event-segments"></div>
                                        <span data-localize="events.edit.omit-event-segments-description"  class="config-help"></span>
                                        {{#if have_drill}}
                                            <span data-localize="events.edit.omit-event-segments-description-drill"  class="config-help"></span>
                                        {{/if}}
                                    </td>
                                    <td>
                                        <select id="event-management-projection">
                                        </select>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        {{/if}}
    </div>

<div id="events-blueprint-drawer" class="cly-drawer">
    <div class="title" style="width: 100%;top: 0px; box-sizing:border-box">
        <span id="edit-event-blueprint-title" data-localize="events.blueprint-drawer-title"></span>
        <div class="close"><i class="ion-ios-close-empty"></i></div>
    </div>

    <div class="details">
        <div class="section">
            <div class="label" style="margin-bottom:4px;" data-localize="events.edit.event-key"></div>
            <div class="label-desc" data-localize="events.edit.event-key-description" class="config-help"></div>
            <div>
                <input id="eb-key-name" class="input" type="text" disabled="true"">
            </div>
        </div>
        <div class="section">
            <div class="label" style="margin-bottom:4px;" data-localize="events.edit.event-name"></div>
            <div class="label-desc" data-localize="events.edit.event-name-description" class="config-help"></div>
            <div>
                <input id="eb-event-name" class="input" type="text">
            </div>
        </div>
        <div class="section" id="eb-description-section">
            <div class="label" style="position: relative; margin-bottom: 4px;">
                <a class='fa fa-square-o check-green' id="eb-description-checkbox" style="position:relative; vertical-align:middle; bottom: 1px"></a>
                <span data-localize="events.blueprint-drawer-use-description" style="position: absolute; left: 20px"></span>
            </div>
            <div class="description" data-localize="events.edit.event-description-description" style="margin-bottom: 8px;"></div>
            <input id="eb-event-desc-input" class="input" data-localize="placeholder.events.edit.description" type="text" style="display: none;" />
        </div>
        <div class="section" id="eb-event-visibility">
            <div class="label" style="margin-bottom:4px;" data-localize="events.edit.event-visibility"></div>
            <div class="label-desc" data-localize="events.edit.event-visible-description" class="config-help"></div>
            <div class="on-off-switch">
                <input style="vertical-align: middle;" type="checkbox" class="on-off-switch-checkbox alert-switcher" id="event-status-toggler">
                <label style="vertical-align: middle;" class="on-off-switch-label" for="event-status-toggler"></label>
                <span class="text" style="vertical-align: middle; margin-bottom: 0px;opacity: 1" data-localize="events.edit.event-visible"></span>
            </div>
        </div>
        <div class="section" id="eb-event-properties-section">
            <div class="panel">
                <div class="panel-heading">
                    <div class="left">
                        <div style="float: left" data-localize='events.edit.event-properties'></div>
                        <i style="margin-left:10px;float: left;opacity: 0.5" class="eb-event-properties-tooltip ion-information-circled show-tooltip"></i>
                    </div>
                    <div style="clear: both" class="right">
                        <div data-localize=""></div>
                    </div>
                </div>
                <div class="panel-body">
                    <div class="section">
                        <div class="label" style="margin-bottom:4px;" data-localize="events.edit.display-count"></div>
                        <div class="label-desc" data-localize="events.edit.display-count-description" class="config-help"></div>
                        <div>
                            <input id="eb-count-name" data-localize="placeholder.events.edit.count" class="input" type="text">
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" style="margin-bottom:4px;" data-localize="events.edit.display-sum"></div>
                        <div class="label-desc" data-localize="events.edit.display-sum-description" class="config-help"></div>
                        <div>
                            <input id="eb-sum-name" data-localize="placeholder.events.edit.sum" class="input" type="text">
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" style="margin-bottom:4px;" data-localize="events.edit.display-duration"></div>
                        <div class="label-desc" data-localize="events.edit.display-duration-description" class="config-help"></div>
                        <div>
                            <input id="eb-duration-name" data-localize="placeholder.events.edit.duration" class="input" type="text">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="section" id="eb-event-omit-section">
            <div class="panel">
                <div class="panel-heading" data-localize="events.edit.omit-event-segments"></div>
                <div class="panel-body">
                    <div class="section">
                        <div class="label-desc" data-localize="events.edit.omit-event-segments-description" class="config-help"></div>
                        <div class="label-desc" style="margin-bottom: 12px;" data-localize="events.edit.omit-event-segments-description-drill" class="config-help"></div>
                        <div class="label" data-localize="events.edit.omit-event-segments-to-omit"></div>
                        <div id="eb-multi-omit-segments-drop" class="cly-multi-select" data-max="10" style="width: 100%; box-sizing: border-box;">
                            <div class="select-inner">
                                <div class="text-container">
                                    <div class="text">
                                        <div class="default-text" data-localize="events.edit.omit-event-select-segments"></div>
                                    </div>
                                </div>
                                <div class="right combo"></div>
                            </div>
                            <div class="select-items square" style="width: 100%;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="buttons">
        <div id="save-event" class="icon-button green" data-localize="common.save"></div>
    </div>
</div>

<div id="event-groups-blueprint-drawer" class="cly-drawer">
    <div class="details">
        <input type="text" id="current_group_id" hidden/>

        <div class="section">
            <div class="label" data-localize='events.event-group-name' ></div>
            <div>
                <input id="group-name-input" class="input" type="text" placeholder="Enter event group name"/>
            </div>
        </div>

        <div class="section">
            <div class="use-description">
                <label class="container">
                    <input id="use-description-checkbox" type="checkbox" />
                    <span class="fas far fa-square"></span>
                    <span data-localize="events.group-use-description">Use description</span>
                </label>
            </div>
            <div>
                <input id="event-group-description" class="input" type="text" placeholder="Enter event group description" disabled/>
            </div>
        </div>

        <div class="section">
            <div class="panel">
                <div class="panel-heading">
                    <div class="left">
                        <div style="float: left" data-localize='events.group-include-events'></div>
                        <i style="margin-left:10px;float: left;opacity: 0.5" class="eb-event-group-include-events-tooltip ion-information-circled show-tooltip"></i>
                    </div>
                    <div style="clear: both" class="right">
                        <div data-localize=""></div>
                    </div>
                </div>

                <div class="panel-body include-events-block">
                        <div class="label" data-localize='events.group-select-events'></div>
                        <div id="event-group-include-events-dropdown" class="cly-multi-select" style="width: 100%; box-sizing: border-box;" data-max="100">
                            <div class="select-inner">
                                <div class="text-container">
                                    <div class="text">
                                        <div class="default-text" data-localize='events.group-select-events-remind'></div>
                                    </div>
                                </div>
                                <div class="right combo"></div>
                            </div>
                            <div class="select-items square" style="width: 100%;"></div>
                        </div>
                </div>
            </div>
        </div>

        <div class="section">
            <div class="label" data-localize="events.group-visibility"></div>
            <div class="description" style="margin-bottom: 10px" data-localize="events.group-visibility-description"></div>
            <div class="event-group-visibility-switcher">
                <div class="on-off-switch" id="switch-trigger">
                    <input type="checkbox" class="on-off-switch-checkbox" id="event-group-visibility-checkbox" checked="">
                    <label class="on-off-switch-label" for="event-group-visibility-checkbox"></label>
                    <span class="text" style="opacity: 1" data-localize="events.group-visibility-checkbox"></span>
                </div>
            </div>
        </div>

        <div class="section">
            <div class="panel">
                <div class="panel-heading">
                    <div class="left">
                        <div style="float: left" data-localize='events.group-properties'></div>
                        <i style="margin-left:10px;float: left;opacity: 0.5" class="eb-event-group-properties-events-tooltip ion-information-circled show-tooltip"></i>
                    </div>
                    <div style="clear: both" class="right">
                        <div data-localize=""></div>
                    </div>
                </div>

                <div class="panel-body event-group-properties-block">
                     <div class="section">
                        <div class="label" data-localize='events.event-group-count' ></div>
                        <div class="description" data-localize='events.event-group-count-description'></div>
                        <div>
                            <input id="group-count-input" class="input" type="text" placeholder="Count"/>
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" data-localize='events.event-group-sum' ></div>
                        <div class="description" data-localize='events.event-group-sum-description'></div>
                        <div>
                            <input id="group-sum-input" class="input" type="text" placeholder="Sum"/>
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" data-localize='events.event-group-duration' ></div>
                        <div class="description" data-localize='events.event-group-duration-description'></div>
                        <div>
                            <input id="group-duration-input" class="input" type="text" placeholder="Duration"/>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        
    </div>
    <div class="buttons">
        <div id="create-widget" class="icon-button green disabled" data-localize='events.create-group'></div>
        <div id="save-widget" class="icon-button green disabled" data-localize='events.save-group'></div>
    </div>
</div>
    </script>

    <script id="template-events-overview"  type="text/x-handlebars-template">
		<div id="event-main">
            <div class="widget">
				<div id="top-events-widget-container">
                    {{#if topEventsIsVisible}}
                    <div class="top-events-widget">
                        <div class="widget-header top-events-widget-header" data-localize="events.top-events.title"></div>
                        <div class="outer">
                            <div class="row border">
                                <div class="left title" data-localize="events.top-events.yesterday"></div>
                                <div class="right">
                                    {{#eachOfObjectValue getTopEventDataDaily}}
                                    {{isDeletedEvent}}
                                        {{#ifCond isDeletedEvent "==" true}} 
                                            <div style="cursor: default;pointer-events: none;" class="col">
                                                <h4 style="cursor: default;color:#DDD">{{this.name}}</h4>
                                                <label style="cursor: default;color:#DDD">{{this.count}}</label> <span style="color:#DDD"; class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                        {{else}}
                                            <div class="col">
                                                <h4><a href="#/analytics/events/key/{{encodeURIComponent this.name}}">{{this.name}}</a></h4>
                                                <label>{{this.count}}</label> <span class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                        {{/ifCond}}
                                    {{/eachOfObjectValue}}
                                </div>
                            </div>
                            <div class="row">
                                <div class="left title" data-localize="events.top-events.30days"></div>
                                <div class="right">
                                    {{#eachOfObjectValue getTopEventData30Day}}
                                    {{isDeletedEvent}}
                                    {{#ifCond isDeletedEvent "==" true}} 
                                            <div style="cursor: default;pointer-events: none;" class="col">
                                                <h4 style="cursor: default;color:#DDD">{{this.name}}</h4>
                                                <label style="cursor: default;color:#DDD">{{this.count}}</label> <span style="color:#DDD"; class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                        {{else}}
                                            <div class="col">
                                            
                                                <h4><a href="#/analytics/events/key/{{encodeURIComponent this.name}}">{{this.name}}</a></h4>
                                                <label>{{this.count}}</label> <span class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                    {{/ifCond}}
                                    {{/eachOfObjectValue}}
                                </div>
                            </div>
                            <div class="info_text" data-localize="events.top-events.info-text"></div>
                        </div>
                        {{/if}}
                    </div>
				</div>
                <div class="widget-header">
                    <div class="left">
                        <div class="title dynamic-title" data-localize="events.overview.title"></div>

                    </div>
                    <div class="right">
                        {{#ifCond admin_rights "==" true}}{{#ifCond event-count "!=" "0"}}<div class="icon-button green" id="events-overview-show-configure" data-localize="events.overview.configure"></div>{{/ifCond}}{{/ifCond}}
                        {{> date-selector }}
                    </div>
                </div>
                <div id="eventOverviewContainer" class="widget-content">
                    <div id="eventOverviewWidgets">
                    {{#ifCond event-count "==" "0"}}
                        <div style=" min-height:100px; padding:0px;">
                            <div class="events-empty-block" >
                                 <table>
                                    <tr>
                                        <td>
                                            <p class="events-empty-title" data-localize="events.all.empty-title"></p>
                                            <p class="events-empty-text" data-localize="events.all.empty-text">
                                        </td>
                                        <td>
                                            <div class="events-empty-image events-overview-noevents"></div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    {{else}}
                    {{#ifCond overview-length "==" "0"}}
                        <div style=" min-height:100px; padding:0px;">
                            <div class="events-empty-block" >
                                <table>
                                    <tr>
                                        <td>
                                            <p class="events-empty-title" data-localize="events.overview.empty-title"></p>
                                            {{#ifCond admin_rights "==" true}}<p class="events-empty-text" data-localize="events.overview.empty-text-admin"></p>{{else}}
                                            <p class="events-empty-text" data-localize="events.overview.empty-text-user">
                                            {{/ifCond}}
                                        </td>
                                        <td>
                                            <div class="events-empty-image events-overview-configure"></div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    {{else}}
                        <div class="tooltip_templates">
                            {{#eachOfArray overview-graph}}
                            <div id="event-description-box-{{this.value.ord}}" >
                                <div style="width:200px;">
                                    <div class="flow-config-popup-block">{{{this.value.description}}}</div>
                                </div>
                            </div>
                            {{/eachOfArray}}
                        </div>
                        <table style="width:100%;  table-layout: fixed; border:1px solid #D0D0D0;">
                            {{#eachOfArray tabledGraph}}
                                <tr>
                                    {{#eachOfArray this.value}}

                                        {{#if this.value.name}}
                                        <td class="event-overview-grid-block cly-widget">
                                            <div class="title"><a href="#/analytics/events/key/{{encodeURIComponent this.value.key}}">{{this.value.name}}</a></div>
                                            {{#ifCond this.value.description "!=" ""}}<i class="fa fa-info-circle show-my-event-description"  data-tooltip-content=" #event-description-box-{{this.value.ord}}"></i>{{/ifCond}}
                                            <table>
                                                <tr>
                                                     <td colspan="2">
                                                        <div class="spark spark-{{this.value.property}}" values="{{this.value.data}}"></div >
                                                    </td>
                                                </tr>
                                                <tr class="number">
                                                    <td colspan="2">
                                                        <table>
                                                        <tr><td class="value">{{this.value.count}}</td>
                                                        <td class="trend {{this.value.classdiv}}">
                                                            <i class="material-icons">{{this.value.arrow_class}}</i>
                                                            <span class="val {{this.value.trendClass}}">{{this.value.trendText}}</span>
                                                        </td></tr>
                                                        </table>
                                                    </td>
                                                </tr>
                                            </table>
                                            <div class="overview-item-property">{{this.value.prop}}</div>
                                          </td>
                                         {{else}}
                                           <td class="empty_cell"><div><div class="title"></div></div></td>
                                        {{/if}}
                                    </td>
                                    {{/eachOfArray}}
                                </tr>
                            {{/eachOfArray}}
                        </table>
                    {{/ifCond}}
                    {{/ifCond}}
                    </div>
                </div>

            </div>

        </div>
        <div id="event-overview-drawer" class="cly-drawer">
            <div class="title">
                <span data-localize="events.overview.drawer-title">Overview</span>
                <div class="close"><i class="ion-ios-close-empty"></i></div>
            </div>
            <div class="details">
                <div class="settings section">
                    <div  class="label" data-localize="events.overview.add-item"></div>
                    <div class="adding-to-overview">
                        <div><div class="wrap-overview-item">
                            <div class="cly-select" id="events-overview-event" >
                                <div class="select-inner">
                                    <div class="text-container">
                                        <div class="text" data-localize="events.overview.choose-event"></div>
                                    </div>
                                    <div class="right combo"></div>
                                </div>
                                <div class="select-items square">
                                    {{#eachOfObjectValue event-map}}
                                        <div data-value="{{this.key}}" class="event-option item" >{{this.name}}</div>
                                    {{/eachOfObjectValue}}
                                </div>
                            </div>
                            </div>
                        </div>
                        <div><div class="wrap-overview-item">
                            <div class="cly-select" id="events-overview-attr" >
                                <div class="select-inner">
                                    <div class="text-container">
                                        <div class="text" data-localize="events.overview.choose-property"></div>
                                    </div>
                                    <div class="right combo"></div>
                                </div>
                                <div class="select-items square">
                                    <div data-value="sum" class="event-option item" data-localize="events.table.sum"></div>
                                    <div data-value="dur" class="event-option item" data-localize="events.table.dur"></div>
                                    <div data-value="count" class="event-option item" data-localize="events.table.count"></div>
                                </div>
                            </div>
                            </div>
                        </div>
                        <div>
                            <div id="add_to_overview" class="icon-button green disabled" data-localize="events.overview.add-item" ></div>
                        </div>
                    </div>
                </div>
                <div class="settings section" id="events-overview-table-wrapper">
                    <div  class="label" data-localize="events.overview.added-items" {{#ifCond overview-table-length "==" "0"}} style="display:none" {{/ifCond}} ></div>
                    <div id="events-overview-table" {{#ifCond overview-table-length "==" "0"}} style="display:none" {{/ifCond}} >
                     <table class="events-table">
                        <thead>
                            <tr>
                                <th></th>
                                <th data-localize="events.overview.table.title-event"></th>
                                <th data-localize="events.overview.table.title-property"></th>
                                <th></th>
                            </tr>
                        </thead>
                        {{#eachOfObjectValue overview-list}}
                        <tr data-order-key ="{{this.order}}" >
                            <td style="text-align:center;"><i class="fa fa-reorder event-order"></i></td>
                            <td>{{this.eventName}}</td>
                            <td>{{this.propertyName}}</td>
                            <td ><a data-order-key ="{{this.order}}" class="ion-backspace delete-event-overview"></a></td>
                         </tr>
                        {{/eachOfObjectValue}}
                    </table>
                    </div>
                </div>
            </div>
            <div class="buttons">
                <div id="update_overview_button" class="icon-button green disabled" data-localize="events.overview.save-changes" >Save</div>
            </div>
        </div>
    </script>
	<script id="template-events"  type="text/x-handlebars-template">

        {{#ifCond event-count "==" "0"}}
        <div style="min-height:100px; padding:50px; 10px 0 10px">
            <div class="events-empty-block" >
                <table>
                    <tr>
                        <td>
                            <p class="events-empty-title" data-localize="events.all.empty-title"></p>
                            <p class="events-empty-text" data-localize="events.all.empty-text">
                        </td>
                        <td>
                            <div class="events-empty-image all-events-empty"></div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        {{else}}
        
		<div id="event-nav">
			<div id="event-nav-head">
				<div id="event-nav-title" style="max-width: 120px;" data-localize="events.title"></div>
				<div style="overflow:hidden; position:absolute; top:14px; right:10px;">
					<div class="icon-button help-zone-vs" id="edit-events-button" style="<% if(!member['global_admin']) { %> display:none; <% } %>">
                      <a href="#/analytics/manage-events"> <i class="ion-gear-a"></i></a>
					</div>
				</div>
			</div>
            <div class="nav-search">
                <i class="fa fa-search"></i>
                <input type="search" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}"/>
            </div>
			<div class="scrollable" style="max-height:450px;">
				{{#eachOfArray events}}
                    <div class="searchable event-container {{#if value.is_active}}active{{/if}}" data-key="{{value.key}}">
                        <div class="name">
                        {{value.name}}
                        {{#if value.is_event_group}}
                        	<div class="group-badge">GROUP</div>
                    	{{/if}}
                    	</div>
                    </div>
				{{/eachOfArray}}
			</div>
		</div>

		<div id="event-main" style="margin-left:199px;">
        <div id="event-alert"></div>
		<div class="widget">
			<div class="widget-header" id="events-widget-header">
				<div class="left">
					<div id="event-update-area">
                        {{#if segmentations}}
						<div class="title dynamic-title small">
							<div class="event-title">{{page-title}}</div>
							{{#if is_event_group}}
								<div class="tag">GROUP</div>
							{{/if}}
						</div>
                        {{else}}
                        <div class="title dynamic-title">
                        	<div class="event-title">{{page-title}}</div>
                        	{{#if is_event_group}}
								<div class="tag">GROUP</div>
							{{/if}}
                        </div>
                        {{/if}}
						<div class="event-segmentation">
							{{#if segmentations}}
							<div class="cly-select float">
								<div class="select-inner">
									<div class="text-container">
										<div class="text">{{active-segmentation}}</div>
									</div>
									<div class="right combo"></div>
								</div>
								<div class="select-items square" style="width:220px;">
									<div>
										<div data-value="" class="segmentation-option item" data-localize="events.no-segmentation"></div>
										{{#eachOfArray segmentations}}
										<div data-value="{{value}}" class="segmentation-option item">{{value}}</div>
										{{/eachOfArray}}
									</div>
								</div>
							</div>
							{{/if}}
						</div>
					</div>
				</div>
                {{> date-selector }}
			</div>

            <div class="events-general-description">{{{event-description}}}</div>
			<div class="widget-content" style="{{#if graph-type-double-pie}} overflow:hidden; {{else}} height:300px; padding-top:20px; padding-bottom:10px; {{/if}}">
				{{#if graph-type-double-pie}}
				<div class="pie-chart-container">
					<div style="border-right:1px solid #CCC; width: 100%; height: 100%">
						<div class="pie-overlay one {{logo-class}}"></div>
						<div id="dashboard-graph" class="graph" style="margin:0 auto; height:360px; font-family:'Ubuntu';"></div>
					</div>
				</div>
				<div class="pie-chart-container">
					<div class="graph-segment-container">
					{{#if graph-segmentation}}
						<div class="graph-segment {{graph-segmentation.class}}" data-name="{{graph-segmentation.name}}"></div>
					{{/if}}
					</div>
					<div class="pie-overlay two {{logo-class}}"></div>
					<div id="dashboard-graph2" class="graph" style="margin:0 auto; height:360px; font-family:'Ubuntu';"></div>
				</div>
				{{else}}
				<div id="dashboard-graph" class="graph" style="height:100%; margin-left:-10px;"></div>
				{{/if}}
			</div>
			{{#if big-numbers}}
			<div class="widget-footer event-numbers big-numbers-v2">
				<div id="big-numbers-container" class="{{big-numbers.class}} event-numbers">
					{{#each big-numbers.items}}
					<div class="big-numbers selected check {{this.class}}" data-type="{{this.class}}">
						<div class="inner">
                            <div class="color"></div>
							<div class="select">{{this.title}}</div>
							<div class="number">{{getFormattedNumber this.total}}</div>
                            <div class="trend {{this.trend}}">
                                {{#ifCond this.trend "==" "u"}}
                                <i class="material-icons">trending_up</i>
                                {{else}}
                                <i class="material-icons">trending_down</i>
                                {{/ifCond}}
                            </div>
						</div>
					</div>
					{{/each}}
				</div>
			</div>
			{{/if}}
		</div>
		{{#if bars}}
		<div class="dashboard-summary three">
			{{#each bars}}
			<div class="item">
				<div class="inner">
					<div class="title">{{this.title}}</div>
					{{#if this.data}}
					<div class="bar">
						{{#each this.data}}
							<div class="bar-inner" style="width:{{this.percent}}%;" data-item="{{this.name}}"></div>
						{{/each}}
					</div>
					<div class="number" data-item="{{this.data.0.name}}">{{this.data.0.name}}</div>
					{{else}}
					<div class="no-data" data-localize="common.bar.no-data"></div>
					{{/if}}
				</div>
			</div>
			{{/each}}
		</div>
		{{/if}}
        </div>
        {{/ifCond}}
	</script>

    <script id="dashboard-template" type="text/x-handlebars-template">
		<div class="widget">
			<div class="widget-header">
				<div class="title" style="letter-spacing:-1px; font-size:19px; margin-top:10px; margin-left:5px;">{{toUpperCase page-title}}</div>
				{{> date-selector }}
			</div>
			<div class="widget-content" style="border:none;">
                {{#if usage}}
				<div id="big-numbers-container" class="dashboard">
					{{#each usage}}
					<div class="big-numbers top {{#if ../../usage-class}}{{../../usage-class}}{{else}}six-column{{/if}} help-zone-vs" data-help-localize="help.{{this.help}}">
						<div class="inner">
                            <div class="logo {{#if this.ion-icon}} ion {{this.ion-icon}} {{/if}} {{#if this.material-icon}} material {{/if}}">
                                {{#if this.material-icon}}
                                <i class="material-icons">{{this.material-icon}}</i>
                                {{/if}}
                            </div>
							<div class="number">
                                <span class="value">{{getShortNumber this.data.total}}</span>
                                {{#if this.data.isEstimate}}
                                    <span id="total-user-estimate-ind"><i class="fa fa-asterisk"></i></span>
                                    <div id="total-user-estimate-exp" style="display:none;">
                                        <div style="line-height:20px;">
                                            Total (unique) user count for this period is estimated and corrected using the biggest time buckets from available daily, weekly and monthly stats.<br/><br/>
                                            Exact total user counts are available for this year, month and day.
                                        </div>
                                    </div>
                                {{/if}}
                            </div>
                            <div class="title">{{this.title}}</div>
                            <div class="trend {{this.data.trend}}">
                                {{#ifCond this.data.change "==" "NA"}}
                                <i class="material-icons">trending_flat</i>
                                {{else}}
                                {{#ifCond this.data.change "==" "0%"}}
                                <i class="material-icons">trending_flat</i>
                                {{else}}
                                    {{#ifCond this.data.trend "==" "u"}}
                                        <i class="material-icons">trending_up</i>
                                    {{else}}
                                        <i class="material-icons">trending_down</i>
                                    {{/ifCond}}
                                {{/ifCond}}
                                {{/ifCond}}
                                <div class="change">{{this.data.change}}</div>
                            </div>
							<div class="spark"><span class="{{this.data.trend}}sparkline">{{this.data.sparkline}}</span></div>
                            <div class="select" id="{{this.id}}"></div>
						</div>
					</div>
					{{/each}}
				</div>
                {{/if}}
			</div>
			<div class="widget-footer" style="height:220px; padding-top:20px; padding-bottom:10px; overflow:visible; box-shadow:none; position:relative;">
				<div id="dashboard-graph" class="graph" style="height:100%; margin-left:-10px;"></div>
			</div>
		</div>
		<div class="dashboard-summary" id="bar-summary">
			{{#each bars}}
			<div class="item help-zone-vs overview-new-item" data-help-localize="help.{{this.help}}">
				<div class="inner inner-new">
					<div class="title title-new">{{this.title}}</div>
					{{#if this.data}}
					<div class="bar bar-new">
						{{#each this.data}}
							{{#if this.type}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);"
									data-item="{{#limitString this.name 15}}{{/limitString}} ({{this.count}} {{this.unit}})" data-percent="{{this.percent}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{else}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);"
									data-item="{{#limitString this.name 15}}{{/limitString}}" data-percent="{{this.percent}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{/if}}
						{{/each}}
						{{#forNumberOfTimesCalc 3 data.length}}
							<div class="bar-inner bar-inner-new-e" style="width:calc(100% - 30px);">
							</div>
						{{/forNumberOfTimesCalc}}
					</div>
					{{else}}
					<div class="bar bar-new" style="width:100% !important">
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important"
							data-item="" data-localize="common.bar.no-data" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
					</div>
					{{/if}}
				</div>
			</div>
			{{/each}}
		</div>
		<div class="widget map-list geo-switch help-zone-vb" data-help-localize="help.dashboard.map">
            <div class="data-type-selector-group">
                <div id="map-list-sessions" class="selector big-numbers top cly-grid-3 active">
                    <div class="inner">
                        <div class="select">
                            <div class="title" data-localize="sidebar.analytics.sessions"></div>
                        </div>
                    </div>
                </div>
                <div id="map-list-users" class="selector big-numbers top cly-grid-3">
                    <div class="inner">
                        <div class="select">
                            <div class="title" data-localize="sidebar.analytics.users"></div>
                        </div>
                    </div>
                </div>
                <div id="map-list-new" class="selector big-numbers top cly-grid-3">
                    <div class="inner">
                        <div class="select">
                            <div class="title" data-localize="common.table.new-users"></div>
                        </div>
                    </div>
                </div>
            </div>
			<div id="geo-chart-outer"><div id="geo-chart"></div></div>
            <div id="map-list-right"></div>
		</div>
	</script>

    <script id="table-template" type="text/x-handlebars-template">
        <div class="widget">
            <div class="widget-header">
                <div class="left">
                    <div style="overflow: auto">
                        {{#if filter1}}
                        <div class="title small">{{page-title}}</div>
                        {{else}}
                        <div class="title">{{page-title}}</div>
                        {{/if}}
                    </div>
                    {{#if filter1}}
                    <div style="width:300px; display: block;">
                    <div class="cly-select float filter1-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter1}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter1}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{#if filter2}}
                    <div class="cly-select float filter2-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter2}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter2}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{/if}}
                    </div>
                    {{/if}}
                </div>
                {{> date-selector }}
            </div>
        </div>
        <div class="data-table table-template" data-help-localize="help.{{{chart-helper}}}">
            <table id="data-table" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        </div>
    </script>


	<script id="report-manager-template" type="text/x-handlebars-template">
        <div class="widget" id="report-manager-view">
			<div id="reports-manager-tabs">
				<ul>
					<li><a href="#report-manaully"   data-localize="report-maanger.manually-created"></a></li>
					<li><a href="#report-automatically" data-localize="report-maanger.automatically-created"></a></li>
				</ul>
				<div id="report-manaully" class='user-tab'></div>
				<div id="report-automatically" class='user-tab'></div>
			</div>

            <div class="widget-header report-manager-widget-header">
                <div class="left">
                    <div style="overflow: auto">
                        {{#if filter1}}
                        <div class="title small" id="report-manager-table-title">{{page-title}}</div>
                        {{else}}
                        <div class="title">{{page-title}}</div>
                        {{/if}}
                    </div>
                    {{#if filter1}}
                    <div class="cly-select float filter1-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter1}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter1}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{#if filter2}}
                    <div class="cly-select float filter2-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter2}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter2}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
					{{/if}}
					{{#if filter3}}
                    <div class="cly-select float filter3-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter3}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter3}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
					{{/if}}
                    {{/if}}
				</div>
			</div>
			{{#if graph-description}}
			<div id="report-manager-graph-description" class="graph-description" style="border-bottom-width: 0px;">{{graph-description}}</div>
			{{/if}}
        </div>
        <div class="report-manager-table data-table table-template" data-help-localize="help.{{{chart-helper}}}">
            <table id="data-table" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        </div>

		<div id="report-widget-drawer" class="cly-drawer">
			<div class="title">
				<span data-localize='drill.reportmanager-title'></span>
					<div class="close"><i id='report-widge-close' class="ion-ios-close-empty"></i></div>
			</div>

			<div class="details">
				<input type="text" id="current_report_id" hidden/>

				<div class="section">
					<div class="label" data-localize='drill.report-name'></div>
					<div>
						<input id="report-name-input" class="input" type="text" placeholder="Enter report name">
					</div>
				</div>

				<div class="section">
					<div class="label" data-localize='drill.report-desc' ></div>
					<div>
						<input id="report-desc-input" class="input" type="text" placeholder="Enter report description">
					</div>
				</div>

				<div class="section">
					<div class="label" data-localize='drill.report-visibility' ></div>
					<div class="checks">
						<div id="report-global-option" class="check selected">
							<div class="box"></div>
							<div class="text"  data-localize='drill.report-global-option'></div>
							<div class="description" data-localize="drill.report-global-option-desc"></div>
						</div>
						<div id="report-private-option" class="check">
							<div class="box"></div>
							<div class="text"  data-localize='drill.report-private-option'></div>
							<div class="description" data-localize="drill.report-private-option-desc"></div>
						</div>
					</div>

				</div>

				<div class="section" id="report-data-block">
					<div class="label" data-localize='drill.report-data' ></div>
					<div class="checks">
						<div id="report-refresh-option" class="check selected">
							<div class="box"></div>
							<div class="text"  data-localize = 'drill.report-auto-refresh'></div>
							<div class="description" data-localize = "drill.report-auto-refresh-desc"></div>
						</div>
						<div id="report-onetime-option" class="check">
							<div class="box"></div>
							<div class="text"  data-localize='drill.report-onetime-option'></div>
							<div class="description" data-localozie="drill.report-oentime-option-desc"></div>
						</div>
					</div>
					<div class="description" data-localize="drill.report-data-desc">

					</div>
				</div>

				<div  class="section" id="report-period-block">
					<div class="label" data-localize='drill.report-period' ></div>
					<div id="single-period-dropdown" class="cly-select" style="width: 100%; box-sizing: border-box;">
						<div class="select-inner">
							<div class="text-container">
								<div class="text">
									<div class="default-text" data-localize='drill.report-period-remind'></div>
								</div>
							</div>
							<div class="right combo"></div>
						</div>
						<div class="select-items square" style="width: 100%;"></div>
					</div>
				</div>
			</div>
			<div class="buttons">
					<div id="create-report" class="icon-button green disabled" data-localize='drill.report-save'></div>
			</div>
		</div>
    </script>
    <script id="version-history-template" type="text/x-handlebars-template">
		<div class="widget">
            <div>{{ package-version }}</div>
            <br>
			<div class="widget-header">
				<div class="title" style="margin-top:10px; margin-left:5px;">{{toUpperCase fs-title}}</div>
			</div>
            <div class="data-table table-template"  data-help-localize="help.{{{chart-helper}}}">
                <table id="data-table-fs" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
            <br>
			<div class="widget-header">
				<div class="title" style="margin-top:10px; margin-left:5px;">{{toUpperCase db-title}}</div>
			</div>
            <div class="data-table table-template"  data-help-localize="help.{{{chart-helper}}}">
                <table id="data-table-db" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
        </div>
    </script>
    <script id="token-manager-template" type="text/x-handlebars-template">
        <div class="widget" id="token-manager-view">
            <div class="widget-header">
                <div class="left">
                    <div style="overflow: auto">
                        {{#if filter1}}
                            <div class="title small">{{page-title}}</div>
                        {{else}}
                            <div class="title">{{page-title}}</div>
                        {{/if}}
                    </div>
                </div>
                <div class="right btn-header" >
                    <div class="icon-button green configs-changes" data-localize="token_manager.create-token" id="show_token_form"></div>
                </div>
            </div>
            <div class="data-table table-template"  data-help-localize="help.{{{chart-helper}}}">
                <table id="data-table" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
        </div>
        <div id="create-token-drawer" class="cly-drawer">
            <div class="title">
                <span data-localize="token_manager.create-token">Create token</span>
                <div class="close"><i class="ion-ios-close-empty"></i></div>
            </div>
            <div class="details">
                <div class="settings section">
                    <div class="label" data-localize="token_manager.table.purpose"></div>
                    <input type="text" class="input" id="token_purpose" placeholder="{{purpose-desc}}" />
                </div>
                <div class="settings section">
                    <div class="label"><span data-localize="token_manager.table.endpoint"></span><span style="float:right; color:#A0A0A0;" data-localize="common.optional"></span></div>
                    <div class="desc" data-localize="token_manager.table.endpoint-desc"></div>
                    <div class="endpoint_blocks_wrapper">
                        <div class="token_endpoint_block" >
                            <div class="delete-endpoint-block"><a class="cly-list-options"></a></div>
                            <div class="label" data-localize="token_manager.table.endpoint-name"></div>
                            <input type="text" class="input endpoint-text"  placeholder="{{endpoint}}" style="margin-bottom:10px;" />
                            <div class="label" data-localize="token_manager.query-param"></div>
                            <div class="param_blocks_wrapper">
                                <div class="param_block">
                                    <table>
                                        <tr>
                                            <td><input type="text" class="input param-key-input" placeholder="{{query-param}}" /></td>
                                            <td ><input type="text" class="input param-value-input" placeholder="{{query-param-value}}" /></td>
                                            <td style="padding-top:2px;"><i class="delete-param material-icons">highlight_off</i></td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                            <a class="text-orange add-query-block">+ <span data-localize="token_manager.add-param"></span></a>
                        </div>
                        <div class="delete-new-endpoint-block-menu" tabindex="1">
                            <a class="item clear-endpoint-block-item"><span data-localize="common.clear-values"></span></a>
                            <a class="item delete-endpoint-block-item"><i class="fa fa-trash"></i><span data-localize="common.delete"></span></a>
                        </div>
                    </div>
                    <div class="btn btn-orange add-endpoint-block" > + <span data-localize="token_manager.add-new-endpoint"></span></div>
                    <div style="clear:both;"></div>
                </div>
                <div class="settings section">
                    <a class="fa check-green check-header fa-square-o" id="use_multi" style="float:left; margin-right: 5px;"></a>
                    <div class="label" data-localize="token_manager.table.multi-desc"></div>
                </div>
                <div class="settings section">
                    <div class="label" data-localize="token_manager.table.apps-title">Token exp</div>
                    <div id="data-token-apps-selector" class="checks">
                        <div data-from="apps-allow" class="check">
                            <div class="box"></div>
                            <div class="text" data-localize="token_manager.table.apps-allow"></div>
                        </div>
                        <div data-from="apps-limit" class="check selected">
                            <div class="box"></div>
                            <div class="text" data-localize="token_manager.table.apps-limit"></div>
                        </div>
                    </div>
                </div>

                <div class="settings section" id="limit_apps">
                    <div id="multi-app-dropdown" class="cly-multi-select" style="width: 100%; box-sizing: border-box;">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">
                                    <div class="default-text" data-localize="token_manager.select-apps"></div>
                                </div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width: 100%;"></div>
                    </div>
                </div>
                <div class="settings section">
                    <div class="label" data-localize="token_manager.table.limit-title">Token exp</div>
                    <div id="data-token-exp-selector" class="checks">
                        <div data-from="time-allow" class="check selected">
                            <div class="box"></div>
                            <div class="text" data-localize="token_manager.table.limit-allow"></div>
                        </div>
                        <div data-from="time-limit" class="check">
                            <div class="box"></div>
                            <div class="text" data-localize="token_manager.table.limit-limit">Token will expire after some time</div>
                        </div>
                    </div>
                </div>

                <div class="settings section" id="limit_life" style="display:none;">
                    <div class="label" data-localize="token_manager.token-expiration-time"></div>
                    <div><input type="text" class="input" placeholder="{{enter-number}}" id="select_limit_value" /></div>
                    <div>
                        <div id="select_limit_span" class="cly-select" style="width: 100%; box-sizing: border-box;">
                            <div class="select-inner">
                                <div class="text-container">
                                    <div class="text">
                                        <div class="default-text" data-localize="token_manager.select-time-unit"></div>
                                    </div>
                                </div>
                                <div class="right combo"></div>
                            </div>
                            <div class="select-items square" style="width: 100%;"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="buttons">
                <div class="icon-button green disabled" id='create_new_token' data-localize="token_manager.create-token">Create token</div>
            </div>
        </div>
    </script>

	<script id="graph-note-create" type="text/x-handlebars-template">
		<div class="graph-note-create">
			<div class="title"><span class="note-form-hearder" data-localize="notes.add-note-form-title"></span></div>
			<div class="fields">
				<div class="section">
                    <div class="label" data-localize="notes.note"></div>
                    <textarea maxlength="150" class="note graph-note-textarea"  rows="5" ></textarea>
                    </div>
				<div class="section" style="display: flex;">
                    <div style="width:50%">
                        <div class="label" data-localize="notes.note-date-time"></div>
                        <div class="date-time"> {{> date-time-selector }} </div>
                    </div>
                    <div class="note-types-selector" style="width:50%">
                        <div class="label" data-localize="notes.note-types"></div>
                        <div  data-note-type="private" class="button note-type active" data-localize="notes.note-private"></div>
                        <div  data-note-type="shared" class="button note-type" data-localize="notes.note-shared"> </div>
                        <div  data-note-type="public" class="button note-type" data-localize="notes.note-public"> </div>
                    </div>
				</div>
				<div>
                <div class="section email-select-block" style="display:none;">
                    <div class="label" data-localize='notes.note-share-with'></div>
                    <select id="email-list-input" placeholder="{{email-placeholder}}">
                    </select>
                </div>

				<div>
				<div class="label" data-localize="notes.note-indicator-color"></div>
					<div id="online-widget-section-bar-color" class="settings section" style="margin-bottom: 30px;">
					<div class="colors">
						<div data-color="1" class="color alt1 selected"></div>
						<div data-color="2" class="color alt2"></div>
						<div data-color="3" class="color alt3"></div>
						<div data-color="4" class="color alt4"></div>
						<div data-color="5" class="color alt5"></div>
						<div data-color="6" class="color alt6"></div>
					</div>
					</div>
				</div>
				</div>
			</div>
            <div class="footer">
                <div class="cancel-add-note icon-button white" data-localize="common.cancel"></div>
                <div class="add-note icon-button green" data-localize="notes.note-add-note"></div>
            </div>
		</div>
	</script>

    <script id="template-graph-notes-view" type="text/x-handlebars-template">
        <div class="note-table-view-navigator">
            <a href="#/" class="back-link" >
                <span data-localize="notes.note-back-to-overview"></span>
            </a>
        </div>

        <div class="widget">
            <div class="widget-header">
                <div class="left">
                    <div style="overflow: auto">
                        {{#if filter1}}
                        <div class="title small">{{page-title}}</div>
                        {{else}}
                        <div class="title">{{page-title}}</div>
                        {{/if}}
                    </div>
                    {{#if filter1}}
                    <div style="width:300px; display: block;">
                    <div class="cly-select float filter1-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter1}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter1}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{#if filter2}}
                    <div class="cly-select float filter2-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter2}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter2}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{/if}}
                    </div>
                    {{/if}}
                </div>
                {{> date-selector }}
            </div>
        </div>
        <div class="data-table table-template" data-help-localize="help.{{{chart-helper}}}">
            <table id="data-table" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        </div>
    </script>

    <script id="graph-notes-popup" type="text/x-handlebars-template">
        <div class="graph-note-popup">
            <div class="title">
                <span> {{this.notePopupTitleTime}}</span>
            </div>
            <div class="popup-content">
                {{#if this.notes}}
                    {{#each this.notes}}
                        <div class="note">
														<div class="note-time"> {{this.ts_display}}</div>
														<div class="note-app" style="display:flex; line-height: 15px;">
															<div class='icon' style='display:inline-block; border-radius: 2px; width:15px; height:15px; margin-right: 5px; background: url(appimages/{{this.app_id}}.png) center center / cover no-repeat;'>
															</div>
															{{this.app_name}}
														</div>
                            <div class="note-content">{{this.note}}</div>
                            <div class="note-footer">
                                <span class="note-owner"> {{this.owner_name }}</span> | <span class="note-type">{{this.noteType}}</span>
                            </div>
                        </div>
                    {{/each}}
                {{/if}}
            </div>
            <div class="popup-footer">
                <div class="icon-button white close-note-popup-button">Close</div>
            </div>
        </div>
	</script>
<% if (!offline_mode) { %>
    <% if (use_google) { %>
        <script language="javascript" type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <% } %>
<% } %>
<% if (production) { %>
	    <!-- PRODUCTION -->
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.visualization.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.config.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.lib.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.plugins.js?<%= countlyVersion %>&<%= pluginsSHA %>"></script>
    <% } else { %>
	    <!-- DEVELOPMENT -->
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/textcounter.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/jquery.peity.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/jquery.sparkline.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.tickrotor.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.pie.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.resize.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.stack.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.spline.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.crosshair.js"?<%= countlyVersion %>></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.orderBars.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.navigate.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/gauge.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/d3/d3.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/rickshaw/rickshaw.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/rickshaw/rickshaw.x.axis.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.analytics.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.common.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.config.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.helpers.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.event.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.session.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.city.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.location.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.map.helper.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.list.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.detail.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.app.version.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.carrier.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.total.users.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.task.manager.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.app.users.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.token.manager.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.version.history.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.template.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.vue.components.js?<%= countlyVersion %>"></script>
		<% if (javascripts) { %>
			<% for(var i=0, l=javascripts.length; i<l; i++) {%>
				<script language="javascript" type="text/javascript" src="<%- cdn %><%= javascripts[i] %>?<%= countlyVersion %>"></script>
			<% } %>
		<% } %>
	<% } %>

    <% if (themeFiles && themeFiles.js) { %>
        <% for(var i=0, l=themeFiles.js.length; i<l; i++) {%>
    		<script language="javascript" type="text/javascript" src="<%=themeFiles.js[i]%>?<%= countlyVersion %>"></script>
        <% } %>
    <% } %>

	<script>Backbone.history.start();</script>
    <% if (!offline_mode) { %>
        <% if (!track || track == "GA" && member['global_admin'] || track == "noneGA" && !member['global_admin']) { %>
            <!--Countly script-->
            <script type='text/javascript' src='<%- cdn %>sdk/web/countly.min.js?<%= countlyVersion %>'></script>
            <script type='text/javascript'>

            //initializing countly with params
            Countly.init({
                app_key: "<%= frontend_app || "386012020c7bf7fcb2f1edf215f1801d6146913f" %>",
                url: "<%= frontend_server || "https://stats.count.ly/" %>",
                device_id: countlyGlobal["member"]["email"],
                app_version: "<%= countlyVersion %>",
                interval:1000
            });

            //track sessions automatically
            Countly.track_sessions();

            Countly.getViewName = function(){
                var view = "/dashboard#";
                var fragment = Backbone.history.getFragment();
                var parts = fragment.split("/");
                if (fragment.indexOf("/analytics/retention/") === 0) {
                    parts[4] = ":event";
                }
                if (fragment.indexOf("/attribution/") === 0) {
                    parts[2] = ":campaign_id";
                }
                for (var i = 1; i < parts.length; i++) {
                    if (/\d/.test(parts[i])) {
                        parts[i] = ":id";
                    }
                    if (parts[i][0] === "{") {
                        parts[i] = ":query";
                    }
                }
                return view + parts.join("/");
            };

            Countly.getViewUrl = function(){
                var view = "/dashboard#";
                var fragment = Backbone.history.getFragment();
                var parts = fragment.split("/");
                if (fragment.indexOf("/analytics/retention/") === 0) {
                    parts[4] = "[CLY]_session";
                }
                if (fragment.indexOf("/attribution/") === 0) {
                    parts[2] = "";
                }
                for (var i = 1; i < parts.length; i++) {
                    if (/\d/.test(parts[i])) {
                        parts[i] = "";
                    }
                    if (parts[i][0] === "{") {
                        parts[i] = "{}";
                    }
                }
                return view + parts.join("/");
            };

            //track pageviews automatically
            Countly.track_pageview(Countly.getViewName());

            $(window).on('hashchange', function() {
                Countly.track_pageview(Countly.getViewName());
            });

            //track any clicks to webpages automatically
            Countly.track_clicks();

            //track javascript errors
            Countly.track_errors();
            
            if (Countly.report_trace && window.performance && window.performance.timing) {
                $(window).on( "load", function(){
                    setTimeout(function(){
                        var trace = {
                            type: "device",
                            name: Countly.getViewName(),
                            stz: window.performance.timing.navigationStart,
                            etz: window.performance.timing.domContentLoadedEventEnd,
                            apm_metrics: {}
                        };
                        if (window.performance.timing.domLoading && window.performance.timing.navigationStart) {
                            trace.apm_metrics.first_paint = window.performance.timing.domLoading - window.performance.timing.navigationStart;
                        }
                        if (window.performance.timing.domContentLoadedEventStart && window.performance.timing.navigationStart) {
                            trace.apm_metrics.first_contentful_paint = window.performance.timing.domContentLoadedEventStart - window.performance.timing.navigationStart;
                        }
                        if (window.performance.timing.domInteractive && window.performance.timing.navigationStart) {
                            trace.apm_metrics.dom_interactive = window.performance.timing.domInteractive - window.performance.timing.navigationStart;
                        }
                        if (window.performance.timing.domContentLoadedEventEnd && window.performance.timing.domContentLoadedEventStart) {
                            trace.apm_metrics.dom_content_loaded_event_end = window.performance.timing.domContentLoadedEventEnd - window.performance.timing.domContentLoadedEventStart;
                        }
                        if (window.performance.timing.loadEventEnd && window.performance.timing.loadEventStart) {
                            trace.apm_metrics.load_event_end = window.performance.timing.loadEventEnd - window.performance.timing.loadEventStart;
                        }
                        if (Object.keys(trace.apm_metrics).length) {
                            Countly.report_trace(trace);
                        }
                    },1);
                });
            }

            Countly.user_details({
                "name": countlyGlobal["member"]["full_name"] || "",
                "username": countlyGlobal["member"]["username"] || "",
                "email": countlyGlobal["member"]["email"]
            });

            Countly.userData.set("lastServer", window.location.hostname);
            Countly.userData.set("lastVersion", "<%= countlyVersion %>");
            Countly.userData.set("lastEdition", "<%= countlyTypeTrack %>");
            Countly.userData.set("isTrial", <%= countlyTrial %>);
            <% if (!offline_mode) { %>
                Countly.userData.set("cpus", <%= cpus %>);
            <% } %>
            Countly.userData.push_unique("servers", window.location.hostname);
            Countly.userData.push_unique("versions", "<%= countlyVersion %>");
            Countly.userData.push_unique("editions", "<%= countlyTypeTrack %>");
            Countly.userData.save();

            <% if (installed) { %>
            Countly.add_event({
                key:"INSTALL"
            });
            <% } %>
            </script>
        <% } %>
    <% } %>
    <script type='text/javascript'>
    app.recordEvent = function (event) {
        if (typeof Countly !== "undefined" && Countly.add_event) {
            Countly.add_event(event);
        }
    };
    </script>

    <% if (typeof inject_template.html != "undefined") { %>
        <%- inject_template.html %>
    <% } %>
    <% if (typeof inject_template.js != 'undefined') { %>
	<script><%- inject_template.js %></script>
	<% } %>
    <!-- The last countly script to load -->
    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.loaded.js?<%= countlyVersion %>"></script>
</body>
</html>
