<commit_before><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>NorthScale Console</title>
<link rel="stylesheet" type="text/css" href="/css/screen.css">
<link rel="stylesheet" type="text/css" href="/css/tabs.css">
<script src="/js/all.js"></script>
</head>
<body>
  <div id="container">
    <div id="header">
      <div class="cnt_holder">
        <div class="topper_nav">
          <a href="#">About</a>
          <b>&bull;</b>
          <a href="#">Help</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <a href="#">Sign Out</a>
        </div>
        <a href="/index.html"><span></span></a>
      </div>
    </div> <!-- header -->

    <div id="mainContainer">
<table width="100%">
<tr>

      <td class="leftNav">
        <h1>RUN</h1>
        <ul>
          <!--<li class="line"></li>-->
          <li class="line"><a id="switch_overview" href="javascript:nav.go('overview');">Cluster Overview</a></li>
          <li class="line"><a id="switch_analytics" href="javascript:nav.go('analytics');">Analytics</a></li>
          <li class="line"><a id="switch_buckets" href="javascript:nav.go('buckets');">Buckets</a></li>
          <li class="line"><a id="switch_alerts" href="javascript:nav.go('alerts');">Alerts/Logs</a></li>
        </ul>
		<h1>Configure</h1>
		<ul>
      <li class="line"><a id="switch_settings" href="javascript:nav.go('settings');">Cluster Settings</a></li>
		</ul>
		<!-- test cluster -->
		<div class="blue_round_block test_cluster">
			<div class="top">
				<div></div>
			</div>
			<div class="content">
				<span class="label">Test Cluster</span>
				<a href="#" class="start">Start</a>
				<div class="right">
					<a href="#">Clear Test Data</a>
				</div>
			</div>
			<div class="bottom">
				<div></div>
			</div>
		</div>
		<!-- End test cluster -->
      </td>
<!--
  <div class="notify">
  notification will go here
  </div>
-->

  <td id="mainPanel">

  <div id="overview" style="display:none;">
    <!-- shadow box -->
	<h1>Overview</h1>
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <h2 class="header_2" id="get_started_expander"><span class="expander_2 block"></span>Get Started</h2>
    <div class="pad_10" id="get_started">
        Congratulations! You may also want to review our <a>Developer Guide</a> or <a>Getting Started Guide</a> before proceding.
        <div class="pat_10">
            <div class="gray_rb">
                <div class="left">
                    <div class="right">
                        <div class="pad">
                            <a href="#" class="button_big">
                                <span>
                                    <span>
                                        Test Server
                                    </span>
                                </span>
                            </a>
                            <a href="#" class="button_big button_big_click">
                                <span>
                                    <span>
                                        Secure Server
                                    </span>
                                </span>
                            </a>
                            <a class="button_big" href="javascript:OverviewSection.startJoinCluster();">
                                <span>
                                    <span>
                                        Join Cluster
                                    </span>
                                </span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
	<!-- shadow box -->
	<h1>Status</h1>
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="darker_block with_devider pat_10" id="cluster_status_container">
    </div><div class="template" id="cluster_status_template">
        <div class="labeled_line">
            <h2 class="label">Cluster Health:</h2>
            <div class="line_cnt">
                {% if (canJoinCluster) { %}
                <a href="#" class="button_medium float_right" style="margin-top:-9px;">Join Cluster</a>
                {% }; %}
                <div class="alert_1">{%=V.setAttribute('class', isCritical ? 'alert_1' : '')%}</div>
                <a>{%= isCritical ? 'Critical' : 'Healthy' %}</a>
                <span class="comment">({%= h(V.count(nodesCount, 'server node')) %} managing <a href="javascript:nav.go('buckets');">{%=h(V.count(bucketsCount, 'bucket'))%}</a>)</span>
            </div>
        </div>
        <div class="labeled_line">
            <h2 class="label for_usage_big">Cluster Memory Usage:</h2>
            <div class="line_cnt">
                <div class="usage_big">
                    <div class="unused">
                        <div class="used" style="width:1%;"></div>
                    </div>{%=V.setPersentBar(memoryUtilization)%}
                    <div class="comment">{%=memoryUtilization%}% Utilized ({%=memoryFreeMB%}MB Free)</div>
                </div>
            </div>
        </div>
        <div class="labeled_line">
            <h2 class="label for_usage_big">Cluster Disk Usage:</h2>
            <div class="line_cnt">
                <div class="usage_big red">
                    <div class="unused">
                        <div class="used" style="width:50%;"></div>
                    </div>
                    <div class="comment">TODO: 50% Utilized (500MB Free)</div>
                </div>
            </div>
        </div>
    </div>
    <div class="section">
      <div class="labeled_line">
          <h2 class="label for_server_line">Server Nodes:</h2>
          <p class="line_cnt" id="server_list_container">
          </p>
          <div id="server_list_template" class="template">
            <table class="server_list"><tbody>
              <!-- {% $.each(rows, function (index) { %} -->
              <tr class="primary">
                <td class="expander"><div></div></td>
                <td class="name"><div>{%= h(this.hostname) %}</div></td>
                <td class="status"><div class="{%=V.renderHealhClass(this.status)%}"></div></td>
              </tr>
              <tr class="details"><td colspan="3">
                <div class="first gong_rb">
                  <div class="side side_1"></div>
                  <div class="side side_2"></div>
                  <div class="side side_3"></div>
                  <div class="side side_4"></div>
                  <div class="pad">
                      <table>
                        <col width="230" />
                        <col width="" />
                        <tr>
                            <td>Uptime: <span>{%= h(formatUptime(this.uptime)) %}</span></td>
                            <td>
                                <div class="float_left">Memory Usage:</div>
                                <div class="float_left usage_small">
                                    <div class="side_shadow">
                                        <div class="unused">
                                            <div class="used" style="width:50%;"></div>
                                        </div>
                                    </div>
                                </div>
                                <span class="float_left">50% used</span></td>
                        </tr>
                        <tr>
                            <td>OS: <span>{%= h(this.os) %}</span></td>
                            <td>Cache Port: <span>{%=h(this.ports.direct)%}</span></td>
                        </tr>
                        <tr>
                            <td>Version: <span>{%= h(this.version) %}</span></td>
                            <td>Proxy Port: <span>{%=h(this.ports.proxy)%}</span></td>
                        </tr>
                      </table>
                  </div>
                </div>
                <div class="right block tdn bolder">
                  <a href="#">Remove Server from Cluster</a>
                </div>
              </td></tr>
             <!-- {% }); %} -->
            </tbody></table>
          </div>
      </div>
    </div>
	</div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
  </div>

  <div id="analytics" style="display:none">
	<h1>
		<span class="block nav float_right"><a>Configure View</a></span>
		Analytics: <span class="stat_target_name"></span>
	</h1>
	<!-- shadow box -->
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="section">
      <h2 class="header_2">
        <span class="block nav float_right">
          <a class="current">1 Hour</a>
        </span>
        System overview: <span><a id='analytics_graph_zoom_real_time'>Live View</a></span>
  	  </h2>
      <p class="analytics_graph_main">
		<span class="graph_info_label block right">3 active nodes last collected 5 seconds ago</span>
		<span id="analytics_main_graph"></span>
	  </p>
      <p class="darker_block graph_nav">
      <span class="analytics-small-graph" id="analytics_graph_hit_ratio"></span>
      <span class="analytics-small-graph" id="analytics_graph_updates"></span>
      <span class="analytics-small-graph" id="analytics_graph_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_ops"></span>
      <span class="analytics-small-graph" id="analytics_graph_total_items"></span>
      <span class="analytics-small-graph" id="analytics_graph_curr_items"></span>
      <span class="analytics-small-graph" id="analytics_graph_bytes_read"></span>
      <span class="analytics-small-graph" id="analytics_graph_cas_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_delete_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_conn_yields"></span>
      <span class="analytics-small-graph" id="analytics_graph_get_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_delete_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_total_connections"></span>
      <span class="analytics-small-graph" id="analytics_graph_curr_connections"></span>
      <span class="analytics-small-graph" id="analytics_graph_threads"></span>
      <span class="analytics-small-graph" id="analytics_graph_bytes_written"></span>
      <span class="analytics-small-graph" id="analytics_graph_incr_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_get_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_listen_disabled_num"></span>
      <span class="analytics-small-graph" id="analytics_graph_decr_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_cmd_flush"></span>
      <span class="analytics-small-graph" id="analytics_graph_engine_maxbytes"></span>
      <span class="analytics-small-graph" id="analytics_graph_bytes"></span>
      <span class="analytics-small-graph" id="analytics_graph_incr_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_cmd_set"></span>
      <span class="analytics-small-graph" id="analytics_graph_decr_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_accepting_conns"></span>
      <span class="analytics-small-graph" id="analytics_graph_cas_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_limit_maxbytes"></span>
      <span class="analytics-small-graph" id="analytics_graph_cmd_get"></span>
      <span class="analytics-small-graph" id="analytics_graph_connection_structures"></span>
      <span class="analytics-small-graph" id="analytics_graph_cas_badval"></span>
      <span class="analytics-small-graph" id="analytics_graph_auth_cmds"></span>
      <b class="clear"></b>
      </p>
    </div>
	</div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
	<h1>Key Values: <span class="stat_target_name"></span></h1>
	<!-- shadow box -->
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="section">
      <h2 class="header_2">
      <!--><span class="stat_target_name"></span> - Top Key Values <span>Interval
      <a id='analytics_keys_zoom_real_time'>Real time</a>
      </span>-->
          <span class="block nav float_right">
            <a class="current">1 Hour</a>
          </span>
          Interval Zoom: <span><a>Live View</a></span>
      </h2>
      <p id="top_keys_container">
      </p>
      <div id="top_keys_template" class="template">
        <table>
          <tr><th>Top Key Values
            <th>Type
            <th>Gets
            <th>Misses
            <th>Total
          {% $.each(rows, function () { %}
            <tr><td>{%= h(this.name) %}
                <td>{%= h(this.type) %}
                <td>{%= h(this.gets) %}
                <td>{%= h(this.misses) %}
                <td>{%= h(this.total) %}
          {% }); %}
        </table>
      </div>
    </div>
	</div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
  </div>

  <div id="buckets" style="display:none">
    <!-- shadow box -->
    <h1>Buckets</h1>
    <div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="darker_block">
        <div class="pad_10">
            <div class="pat_10 right">
                <!--<a href="javascript:nav.go('overview')">Cluster Overview</a> &gt; Buckets-->
                <button class="button_medium" onclick="BucketsSection.startCreate();">Add a New Bucket</button>
            </div>
        </div>
    </div>
    <div id="bucket_list_container">
    </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
    <div id="bucket_list_template" class="template">
        <table class="lined_tab">
          <col width="" />
          <col width="" />
          <col width="" />
          <col width="135" />
          <col width="" />
          <tr>
            <!-- to display sort arrow correctly you need to switch between "sort_desc" and "sort_asc" classes in span -->
            <th>Name <span class="sort_desc"><img src="images/sort_down.gif" class="sort_down" /><img src="images/sort_up.gif" class="sort_up" /></span></th>
            <th>Ops/Sec</th>
            <th>Evictions/Sec</th>
            <th>Cache Used</th>
            <th>Cache Size</th>
          </tr>
          <!-- {% $.each(rows, function () { %} -->
            <tr>
              <td>
              <a class="float_right text_11" href="{%=jsLink('BucketsSection.showBucket',this.uri)%}">Properties</a>
              <a class="gray_link" href="{%=jsLink('AnalyticsSection.visitBucket',this.uri)%}">{%= h(this.name) %}</a></td>
              <td>{%= h(this.basicStats.opsPerSec) %}</td>
              <td>{%= h(this.basicStats.evictionsPerSec) %}</td>
              <td>
                <div class="usage_smallest_info">
                    <div class="usage_smallest">
                        <div class="side_shadow">
                            <div class="unused">
                                <div class="used" style="width:1%;"></div>
                            </div>
                        </div>
                    </div>{%= V.setPersentBar(this.basicStats.cachePercentUsed) %}
                    {%= h(this.basicStats.cachePercentUsed) %}%
                </div>
              </td>
              <td>{%= h(this.basicStats.cacheSize) %}MB</td>
            </tr> <!-- This tr is important. Otherwise browser may close row after end of loop, causing incorrect resultant markup -->
          <!-- {% }); %} -->
        </table>
    </div>
  </div>

  <div id="alerts" style="display:none">
    <!-- Shadow box -->
    <h1>Alerts/Log</h1>
    <div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
        <div class="darker_block with_devider">
            <div class="pat_10">
                <ul class="tabs">
                  <li><a href="#">Current Alerts</a>
                  <!-- <li><a href="#">Alert Settings</a> -->
                  <li><a href="#">Log</a>
                </ul>
            </div>
        </div>
        <div class="panes">
          <div class="pad_10">
            <div id="alerts_list" class="alerts_list">
              <p class="pab_10">Alerts are being sent to: <span id="alerts_email_setting" class="bolder"></span> <a href='javascript:AlertsSection.changeEmail(),void(0);' class="text_11">Change</a></p>
              <ol id="alert_list_container">
              </ol>
              <ol id="alert_list_template" class="template">
                <!-- {% _.each(rows, function (alert) { %} -->
                <li class="alert_{%= h(alert.type) %}">
                  <div class="block pad_10">
                    <h3><strong>{%= formatAlertType(alert.type) %}</strong> - {%= h(alert.shortText) %}</h3>
                    <span class="time">{%= h(formatAlertTStamp(alert.tstamp)) %}</span>
                    <p>
                      <a class="dismiss point">Dismiss</a>
                      {%= h(alert.text) %}
                    </p>
                  </div>
                </li>
                <!-- {% }); %} -->
              </ol>
            </div>
          </div>
          <!-- <div>
            <h3>Alert Setting</h3>
            <input type="hidden" id="alerts_settings_form_is_clean" value="1">
            <form id="alerts_settings_form" onsubmit="javascript:return false;">
            <p><label><input type="checkbox" name="sendAlerts" value="1"><input type="hidden" value="0" name="sendAlerts">
            Notify me by email with alerts</label></p>
            <div id="alerts_settings_guts" style="display:none;">
              <p><label>Email Address <input type="text" name="email"></label></p>
              <h4>Alert Types</h4>
              <p>Alert me when:
              <ul>
                <li><label><input type="checkbox" value="1" name="sendForLowSpace"><input type="hidden" value="0" name="sendForLowSpace">
                ... a server is low on disk space.</label>
                <li><label><input type="checkbox" value="1" name="sendForLowMemory"><input type="hidden" value="0" name="sendForLowMemory">
                ... a server is low on available memory.</label>
                <li><label><input type="checkbox" value="1" name="sendForNotResponding"><input type="hidden" value="0" name="sendForNotResponding">
                ... a server is not responding.</label>
                <li><label><input type="checkbox" value="1" name="sendForJoinsCluster"><input type="hidden" value="0" name="sendForJoinsCluster">
                ... a new server joins cluster.</label>
                <li><label><input type="checkbox" value="1" name="sendForOpsAboveNormal"><input type="hidden" value="0" name="sendForOpsAboveNormal">
                ... average daily ops/second is above normal.</label>
                <li><label><input type="checkbox" value="1" name="sendForSetsAboveNormal"><input type="hidden" value="0" name="sendForSetsAboveNormal">
                ... average daily sets/second is above normal.</label>
              </ul>
            </div>
            <p><a href="javascript:AlertsSection.settingsCancel(),void(0);">Cancel</a>
              <button type="submit">Save</button></p>
            </form>
          </div> -->
          <div class="tab_holder">
            <table class="lined_tab">
              <tr>
                <th>Event</th>
                <th>Code</th>
                <th>Time</th>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
            </table>
          </div>
        </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
    <!-- END shadow box -->
  </div>
  <div id="settings" style="display:none">
    <!-- shadow box -->
    <div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
      <div class="darker_block with_devider">
          <div class="pat_10">
              <ul class="tabs">
                <li><a href="#">Basic</a></li>
                <li><a href="#">Advanced</a></li>
              </ul>
          </div>
      </div>
      <div class="panes">
        <div class="brdr_exl_t" style="display:none;">
          <div class="pad_10">
            <div class="advanced">
              <h2 class="head_2_underline">Port Configuration <a class="text_11">What’s this?</a></h2>
              <div class="form">
                <div class="labeled_line">
                  <label class="block label for_input">Proxy Port:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Cache Port:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
              </div>
              <h2 class="head_2_underline">Alert settings</h2>
              <div class="form">
                <div>
                  <label><input type="checkbox" class="check"> Notify me by email with alerts</label>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Email Address:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <h2 class="form_section_title">Mail Server Settings</h2>
                <div class="labeled_line">
                  <label class="block label for_input">Username:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Password:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Mail Server Address:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                    Port:
                    <select class="select select_short">
                      <option></option>
                      <option></option>
                      <option></option>
                      <option></option>
                    </select>
                  </div>
                </div>
                <div class="labeled_line">
                  <div class="line_cnt">
                    <div>
                      <label><input type="checkbox" class="check"> Notify me by email with alerts</label>
                    </div>
                  </div>
                </div>
                <h2 class="form_section_title">Alert me when there are...</h2>
                <div class="pat_10">
                  <table class="lined_tab brdr_exl_r">
                    <col width="" />
                    <col width="115" />
                    <col width="50" />
                    <tr>
                      <th>Critical Issues</th>
                      <th>Type</th>
                      <th>Active</th>
                    </tr>
                    <tr>
                      <td>A server is not responding</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>A server is down</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                  </table>
                </div>
                <div class="pat_10">
                  <table class="lined_tab brdr_exl_r">
                    <col width="" />
                    <col width="115" />
                    <col width="50" />
                    <tr>
                      <th>Attention Required</th>
                      <th>Type</th>
                      <th>Active</th>
                    </tr>
                    <tr>
                      <td>A bucket has been deleted</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>Bucket authentication failure</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                  </table>
                </div>
                <div class="pat_10">
                  <table class="lined_tab brdr_exl_r">
                    <col width="" />
                    <col width="115" />
                    <col width="50" />
                    <tr>
                      <th>Informational Issues</th>
                      <th>Type</th>
                      <th>Active</th>
                    </tr>
                    <tr>
                      <td>A new server joins a cluster</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>A server leaves a cluster</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>A new bucket has been created</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>Bucket authentication failure</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                  </table>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="brdr_exl_t">
          <div class="pad_10">
            <div class="basic">
              <h2 class="head_2_underline">Web Console</h2>
              <div class="form">
                <div class="labeled_line">
                  <label class="block label for_input">Port:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short"/>
                  </div>
                </div>
              </div>
              <h2 class="head_2_underline">Security <a class="text_11">What’s this?</a></h2>
              <div class="form">
                <div>
                  <label><input type="checkbox" class="check"/> Secure this Server</label>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Username:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short"/>
                    <a href="#" class="text_11">Setup Email Alerts</a>
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Password:</label>
                  <div class="line_cnt">
                    <input type="password" class="text inp_short"/>
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Verify Password:</label>
                  <div class="line_cnt">
                    <input type="password" class="text inp_short"/>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="darker_block">
        <div class="pad_10">
          <div class="right save_cancel">
            <a href="#" class="save_button float_right">SAVE</a>
            <a href="#" class="cancel_button float_right">CANCEL</a>
          </div>
        </div>
      </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
    <!-- END shadow box -->
  </div>

</tr>
</table>


</div> <!-- mainContainer -->

<div id="footer">
  <h1>Copyright 2010 <a href="http://northscale.com">NorthScale, Inc.</a> All rights reserved.</h1>
</div>

</div> <!-- container -->

<!-- dialogs -->
<div class="jqmWindow" id="login_dialog">
  <div>Dev. hint: use <a href="/index.html?noauth&amp;ajaxDelay=350">noauth</a> version</div>
<form id="login_form">
  <label>Login:<input name="login"></label>
  <label>Password:<input name="password"></label>
  <input type="submit">
</form>
<script>
  $('#login_form').bind('submit', function (e) {
    e.preventDefault();
    loginFormSubmit();
  });
</script>
</div>
<div class="jqmWindow" id="bucket_details_dialog_container">
</div>
<div id="bucket_details_dialog_template" class="template">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">Bucket properties for {%= h(b.name) %}</p>
        <div class="pas_20">
          <!-- <a href="#" class="jqmClose">Close</a> -->
          <p class="u_line"><span class="label">Bucket name:</span><a class="float_right remove_bucket">Remove</a> {%= h(b.name) %}</p>
          <p class="u_line"><span class="label">Cache size:</span>
          <a class="float_right" href="{%=jsLink('BucketsSection.startFlushCache',b.uri)%}">Flush All</a>
          {%= h(b.basicStats.cacheSize) %} MB 
          </p>
          <p class="u_line"><span class="label">Password:</span>
          <a class="float_right" href="javascript:BucketsSection.startPasswordChange()">Change Password</a>
          ***** </p>
          <div class="pat_10">
            <p class="normal text_12">
            Sample connection string:<br />
            <textarea rows="3" readonly>sample connection string here</textarea>
            </p>
            <div class="right save_cancel">
              <button class="save_button float_right" type="submit">DONE</button>
              <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="add_new_bucket_dialog">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">Add New Bucket</p>
        <div id="add_new_bucket_errors_container" class="warning" style="padding:10px 20px;"></div>
        <div id="add_new_bucket_errors_template" class="template">
          <strong>Couldn't create bucket due to:</strong>
          <ul>
            <!-- {% _.each(rows, function (e) { %} -->
            <li>{%= h(e) %}
            <!-- {% }); %} -->
          </ul>
        </div>

        <form id="add_new_bucket_form">
          <p><label><b>Bucket Name:</b><input type="text" name="name" class="inp" style="width:290px;" value="No spaces, alphanumeric up to 12 characters"></label></p>
          <p><label><b>Cache Size:</b><input type="text" name="cacheSize" class="inp" style="width:40px;"><span class="cache-details"></span>MB x 3 server nodes = 192MB Total Cache Size/30GB Cluster memory available.</label></p>
          <p><b>&nbsp;</b> <input type="checkbox" class="chkbx" /> <span class="text_12">Reserve memory in advance</span></p>
          <p><b>Password:</b><input type="password" name="password" autocomplete="off" class="inp"></p>
          <p><b>Verify Password:</b><input type="password" name="verifyPassword" autocomplete="off" class="inp"> <span class="dont-match">Password don't match</span></p>
          <!-- <p><a href="#" class="jqmClose">cancel</a> <button type="submit">Add Bucket</button></p> -->
          <div class="pas_20">
            <div class="right save_cancel">
              <button class="save_button float_right" type="submit">ADD</button>
              <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="flush_cache_dialog_container">
</div>
<div class="template" id="flush_cache_dialog_template">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">
          Bucket Properties
        </p>
        <div class="pas_20">
          <!--
          <table>
            <tr>
              <td>
                Cache Size
              </td>
              <td>
                {%=h(bucket.basicStats.cacheSize)%}
                [MB x {%=h(DAO.getBucketNodesCount(bucket))%} = {%=h(DAO.getBucketNodesCount(bucket) * bucket.basicStats.cacheSize)%}MB Total Cache]
              </td>
            </tr>
            <tr>
              <td>Total Items Stored</td>
              <td>{%=h(bucket.basicStats.totalItemsStored)%}</td>
            </tr>
          </table>
          -->
          <p class="u_line text_14">
            <span class="label">Flushing Cache:</span>
            <strong>
              {%=h(bucket.basicStats.cacheSize)%}
                [MB x {%=h(DAO.getBucketNodesCount(bucket))%} = {%=h(DAO.getBucketNodesCount(bucket) * bucket.basicStats.cacheSize)%}MB Total Cache]
            </strong>
          </p>
          <div class="warning pat_20">
            	<strong>Warning</strong> – Flushing all the cache will result in data loss for this bucket. Are you sure you want to flush the cache?
          </div>
        </div>
        <div class="pas_20">
          <div class="right save_cancel">
            <a class="save_button float_right" href="{%=renderJSLink('BucketsSection.completeFlushCache', bucket.uri)%}">FLUSH</a>
            <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="flush_bucket_remove_dialog">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">
          Bucket Properties
        </p>
        <div class="pas_20">
          <p class="u_line text_14">
            <span class="norm_14">Removing</span>
            <strong>
              Bucket_6
            </strong>
          </p>
          <div class="warning pat_20">
            	<strong>Warning</strong> – Removing this bucket will result in complete data loss for this bucket. Are you sure you want to remove it?
          </div>
        </div>
        <div class="pas_20">
          <div class="right save_cancel">
            <a class="save_button float_right" href="#">REMOVE</a>
            <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="bucket_password_dialog">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">Bucket Properties</p>
        <br />
        <div class="pas_20">
          <p class="u_line norm_14">
            Change Password: ******
          </p>
        </div>
        <form id="bucket_password_form" class="pat_10">
          <div class="pas_20">
            <p class="u_line_sm"><span class="label">Password:</span> <input class="inp" type="password" name="password"></p>
            <p class="u_line_sm"><span class="label">New Password:</span> <input class="inp" type="password" name="verifyPassword"></p>
            <p class="u_line_sm"><span class="label">Verify Password:</span> <input class="inp" type="password" name="verifyPassword"></p>
            <div class="right save_cancel">
              <!--<a class="save_button float_right" href="#">SAVE</a>-->
              <button type="submit" class="save_button float_right">CHANGE</button>
              <a class="jqmClose cancel_button float_right" href="#">CANCEL</a>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="join_cluster_dialog">
  <h1>Join a Cluster</h1>
  <ul id="join_cluster_dialog_errors_container"></ul>
  <ul id="join_cluster_dialog_errors_template" class="template">
    <!-- {% _.each(rows, function (e) { %} -->
    <li><strong>Attention</strong> - {%= h(e) %}
    <!-- {% }); %} -->
  </ul>
  <form>
  <p><label>IP Address:<input name="clusterMemberHostIp"></label></p>
  <p><label>Port:<input name="clusterMemberHostPort"></label></p>
  <p><label>Username:<input name="user"></label></p>
  <p><label>Password:<input name="password" type="password"></label></p>
  <p><a class="jqmClose">CANCEL</a> <button type="submit">JOIN CLUSTER</button></p>
  </form>
</div>
<!-- Join cluster -->
<div class="lbox join_cluster" style="display:none;">
  <div class="top">
    <div class="top_left"></div>
    <div class="top_right"></div>
    <div class="top_center"></div>
  </div>
  <div class="center">
    <div class="pad">
      <p class="lbox_header">Join a Cluster</p>
      <div class="pas_20">
        <p class="warning pat_10" style="display:none;"><strong>Attention</strong> – the cluster you have tried to join requires a username and password.</p>
        <p class="warning pat_10" style="display:none;"><strong>Attention</strong> – hostname or IP is invalid or unreachable.</p>
        <table>
          <tr>
            <th>
              Cluster <a href="#" class="text_11">What’s this?</a>
            </th>
            <th>
              Security <a href="#" class="text_11">What’s this?</a>
            </th>
          </tr>
          <tr>
            <td>
              <div class="u_line_sm">
                <span class="label">IP Address:</span>
                <input type="text" class="inp">
              </div>
              <div class="u_line_sm">
                <span class="label">Port:</span>
                <input type="text" class="inp">
              </div>
            </td>
            <td>
              <div class="u_line_sm">
                <span class="label">Username:</span>
                <input type="text" class="inp">
              </div>
              <div class="u_line_sm">
                <span class="label">Password:</span>
                <input type="password" class="inp">
              </div>
            </td>
          </tr>
        </table>
        <div class="right save_cancel">
          <button type="submit" class="save_button button_3 float_right">JOIN CLUSTER</button>
          <a class="jqmClose cancel_button float_right" href="#">CANCEL</a>
        </div>
      </div>
    </div>
  </div>
  <div class="bottom">
    <div class="bottom_left"></div>
    <div class="bottom_right"></div>
    <div class="bottom_center"></div>
  </div>
</div>
<!-- END join cluster -->
</body>
</html>
<commit_msg>fixed 'join cluster' link on cluster status<commit_after><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>NorthScale Console</title>
<link rel="stylesheet" type="text/css" href="/css/screen.css">
<link rel="stylesheet" type="text/css" href="/css/tabs.css">
<script src="/js/all.js"></script>
</head>
<body>
  <div id="container">
    <div id="header">
      <div class="cnt_holder">
        <div class="topper_nav">
          <a href="#">About</a>
          <b>&bull;</b>
          <a href="#">Help</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <a href="#">Sign Out</a>
        </div>
        <a href="/index.html"><span></span></a>
      </div>
    </div> <!-- header -->

    <div id="mainContainer">
<table width="100%">
<tr>

      <td class="leftNav">
        <h1>RUN</h1>
        <ul>
          <!--<li class="line"></li>-->
          <li class="line"><a id="switch_overview" href="javascript:nav.go('overview');">Cluster Overview</a></li>
          <li class="line"><a id="switch_analytics" href="javascript:nav.go('analytics');">Analytics</a></li>
          <li class="line"><a id="switch_buckets" href="javascript:nav.go('buckets');">Buckets</a></li>
          <li class="line"><a id="switch_alerts" href="javascript:nav.go('alerts');">Alerts/Logs</a></li>
        </ul>
		<h1>Configure</h1>
		<ul>
      <li class="line"><a id="switch_settings" href="javascript:nav.go('settings');">Cluster Settings</a></li>
		</ul>
		<!-- test cluster -->
		<div class="blue_round_block test_cluster">
			<div class="top">
				<div></div>
			</div>
			<div class="content">
				<span class="label">Test Cluster</span>
				<a href="#" class="start">Start</a>
				<div class="right">
					<a href="#">Clear Test Data</a>
				</div>
			</div>
			<div class="bottom">
				<div></div>
			</div>
		</div>
		<!-- End test cluster -->
      </td>
<!--
  <div class="notify">
  notification will go here
  </div>
-->

  <td id="mainPanel">

  <div id="overview" style="display:none;">
    <!-- shadow box -->
	<h1>Overview</h1>
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <h2 class="header_2" id="get_started_expander"><span class="expander_2 block"></span>Get Started</h2>
    <div class="pad_10" id="get_started">
        Congratulations! You may also want to review our <a>Developer Guide</a> or <a>Getting Started Guide</a> before proceding.
        <div class="pat_10">
            <div class="gray_rb">
                <div class="left">
                    <div class="right">
                        <div class="pad">
                            <a href="#" class="button_big">
                                <span>
                                    <span>
                                        Test Server
                                    </span>
                                </span>
                            </a>
                            <a href="#" class="button_big button_big_click">
                                <span>
                                    <span>
                                        Secure Server
                                    </span>
                                </span>
                            </a>
                            <a class="button_big" href="javascript:OverviewSection.startJoinCluster();">
                                <span>
                                    <span>
                                        Join Cluster
                                    </span>
                                </span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
	<!-- shadow box -->
	<h1>Status</h1>
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="darker_block with_devider pat_10" id="cluster_status_container">
    </div><div class="template" id="cluster_status_template">
        <div class="labeled_line">
            <h2 class="label">Cluster Health:</h2>
            <div class="line_cnt">
                {% if (canJoinCluster) { %}
                <a href="javascript:OverviewSection.startJoinCluster();" class="button_medium float_right" style="margin-top:-9px;">Join Cluster</a>
                {% }; %}
                <div class="alert_1">{%=V.setAttribute('class', isCritical ? 'alert_1' : '')%}</div>
                <a>{%= isCritical ? 'Critical' : 'Healthy' %}</a>
                <span class="comment">({%= h(V.count(nodesCount, 'server node')) %} managing <a href="javascript:nav.go('buckets');">{%=h(V.count(bucketsCount, 'bucket'))%}</a>)</span>
            </div>
        </div>
        <div class="labeled_line">
            <h2 class="label for_usage_big">Cluster Memory Usage:</h2>
            <div class="line_cnt">
                <div class="usage_big">
                    <div class="unused">
                        <div class="used" style="width:1%;"></div>
                    </div>{%=V.setPersentBar(memoryUtilization)%}
                    <div class="comment">{%=memoryUtilization%}% Utilized ({%=memoryFreeMB%}MB Free)</div>
                </div>
            </div>
        </div>
        <div class="labeled_line">
            <h2 class="label for_usage_big">Cluster Disk Usage:</h2>
            <div class="line_cnt">
                <div class="usage_big red">
                    <div class="unused">
                        <div class="used" style="width:50%;"></div>
                    </div>
                    <div class="comment">TODO: 50% Utilized (500MB Free)</div>
                </div>
            </div>
        </div>
    </div>
    <div class="section">
      <div class="labeled_line">
          <h2 class="label for_server_line">Server Nodes:</h2>
          <p class="line_cnt" id="server_list_container">
          </p>
          <div id="server_list_template" class="template">
            <table class="server_list"><tbody>
              <!-- {% $.each(rows, function (index) { %} -->
              <tr class="primary">
                <td class="expander"><div></div></td>
                <td class="name"><div>{%= h(this.hostname) %}</div></td>
                <td class="status"><div class="{%=V.renderHealhClass(this.status)%}"></div></td>
              </tr>
              <tr class="details"><td colspan="3">
                <div class="first gong_rb">
                  <div class="side side_1"></div>
                  <div class="side side_2"></div>
                  <div class="side side_3"></div>
                  <div class="side side_4"></div>
                  <div class="pad">
                      <table>
                        <col width="230" />
                        <col width="" />
                        <tr>
                            <td>Uptime: <span>{%= h(formatUptime(this.uptime)) %}</span></td>
                            <td>
                                <div class="float_left">Memory Usage:</div>
                                <div class="float_left usage_small">
                                    <div class="side_shadow">
                                        <div class="unused">
                                            <div class="used" style="width:50%;"></div>
                                        </div>
                                    </div>
                                </div>
                                <span class="float_left">50% used</span></td>
                        </tr>
                        <tr>
                            <td>OS: <span>{%= h(this.os) %}</span></td>
                            <td>Cache Port: <span>{%=h(this.ports.direct)%}</span></td>
                        </tr>
                        <tr>
                            <td>Version: <span>{%= h(this.version) %}</span></td>
                            <td>Proxy Port: <span>{%=h(this.ports.proxy)%}</span></td>
                        </tr>
                      </table>
                  </div>
                </div>
                <div class="right block tdn bolder">
                  <a href="#">Remove Server from Cluster</a>
                </div>
              </td></tr>
             <!-- {% }); %} -->
            </tbody></table>
          </div>
      </div>
    </div>
	</div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
  </div>

  <div id="analytics" style="display:none">
	<h1>
		<span class="block nav float_right"><a>Configure View</a></span>
		Analytics: <span class="stat_target_name"></span>
	</h1>
	<!-- shadow box -->
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="section">
      <h2 class="header_2">
        <span class="block nav float_right">
          <a class="current">1 Hour</a>
        </span>
        System overview: <span><a id='analytics_graph_zoom_real_time'>Live View</a></span>
  	  </h2>
      <p class="analytics_graph_main">
		<span class="graph_info_label block right">3 active nodes last collected 5 seconds ago</span>
		<span id="analytics_main_graph"></span>
	  </p>
      <p class="darker_block graph_nav">
      <span class="analytics-small-graph" id="analytics_graph_hit_ratio"></span>
      <span class="analytics-small-graph" id="analytics_graph_updates"></span>
      <span class="analytics-small-graph" id="analytics_graph_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_ops"></span>
      <span class="analytics-small-graph" id="analytics_graph_total_items"></span>
      <span class="analytics-small-graph" id="analytics_graph_curr_items"></span>
      <span class="analytics-small-graph" id="analytics_graph_bytes_read"></span>
      <span class="analytics-small-graph" id="analytics_graph_cas_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_delete_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_conn_yields"></span>
      <span class="analytics-small-graph" id="analytics_graph_get_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_delete_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_total_connections"></span>
      <span class="analytics-small-graph" id="analytics_graph_curr_connections"></span>
      <span class="analytics-small-graph" id="analytics_graph_threads"></span>
      <span class="analytics-small-graph" id="analytics_graph_bytes_written"></span>
      <span class="analytics-small-graph" id="analytics_graph_incr_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_get_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_listen_disabled_num"></span>
      <span class="analytics-small-graph" id="analytics_graph_decr_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_cmd_flush"></span>
      <span class="analytics-small-graph" id="analytics_graph_engine_maxbytes"></span>
      <span class="analytics-small-graph" id="analytics_graph_bytes"></span>
      <span class="analytics-small-graph" id="analytics_graph_incr_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_cmd_set"></span>
      <span class="analytics-small-graph" id="analytics_graph_decr_misses"></span>
      <span class="analytics-small-graph" id="analytics_graph_accepting_conns"></span>
      <span class="analytics-small-graph" id="analytics_graph_cas_hits"></span>
      <span class="analytics-small-graph" id="analytics_graph_limit_maxbytes"></span>
      <span class="analytics-small-graph" id="analytics_graph_cmd_get"></span>
      <span class="analytics-small-graph" id="analytics_graph_connection_structures"></span>
      <span class="analytics-small-graph" id="analytics_graph_cas_badval"></span>
      <span class="analytics-small-graph" id="analytics_graph_auth_cmds"></span>
      <b class="clear"></b>
      </p>
    </div>
	</div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
	<h1>Key Values: <span class="stat_target_name"></span></h1>
	<!-- shadow box -->
	<div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="section">
      <h2 class="header_2">
      <!--><span class="stat_target_name"></span> - Top Key Values <span>Interval
      <a id='analytics_keys_zoom_real_time'>Real time</a>
      </span>-->
          <span class="block nav float_right">
            <a class="current">1 Hour</a>
          </span>
          Interval Zoom: <span><a>Live View</a></span>
      </h2>
      <p id="top_keys_container">
      </p>
      <div id="top_keys_template" class="template">
        <table>
          <tr><th>Top Key Values
            <th>Type
            <th>Gets
            <th>Misses
            <th>Total
          {% $.each(rows, function () { %}
            <tr><td>{%= h(this.name) %}
                <td>{%= h(this.type) %}
                <td>{%= h(this.gets) %}
                <td>{%= h(this.misses) %}
                <td>{%= h(this.total) %}
          {% }); %}
        </table>
      </div>
    </div>
	</div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
  </div>

  <div id="buckets" style="display:none">
    <!-- shadow box -->
    <h1>Buckets</h1>
    <div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
    <div class="darker_block">
        <div class="pad_10">
            <div class="pat_10 right">
                <!--<a href="javascript:nav.go('overview')">Cluster Overview</a> &gt; Buckets-->
                <button class="button_medium" onclick="BucketsSection.startCreate();">Add a New Bucket</button>
            </div>
        </div>
    </div>
    <div id="bucket_list_container">
    </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
	<!-- END shadow box -->
    <div id="bucket_list_template" class="template">
        <table class="lined_tab">
          <col width="" />
          <col width="" />
          <col width="" />
          <col width="135" />
          <col width="" />
          <tr>
            <!-- to display sort arrow correctly you need to switch between "sort_desc" and "sort_asc" classes in span -->
            <th>Name <span class="sort_desc"><img src="images/sort_down.gif" class="sort_down" /><img src="images/sort_up.gif" class="sort_up" /></span></th>
            <th>Ops/Sec</th>
            <th>Evictions/Sec</th>
            <th>Cache Used</th>
            <th>Cache Size</th>
          </tr>
          <!-- {% $.each(rows, function () { %} -->
            <tr>
              <td>
              <a class="float_right text_11" href="{%=jsLink('BucketsSection.showBucket',this.uri)%}">Properties</a>
              <a class="gray_link" href="{%=jsLink('AnalyticsSection.visitBucket',this.uri)%}">{%= h(this.name) %}</a></td>
              <td>{%= h(this.basicStats.opsPerSec) %}</td>
              <td>{%= h(this.basicStats.evictionsPerSec) %}</td>
              <td>
                <div class="usage_smallest_info">
                    <div class="usage_smallest">
                        <div class="side_shadow">
                            <div class="unused">
                                <div class="used" style="width:1%;"></div>
                            </div>
                        </div>
                    </div>{%= V.setPersentBar(this.basicStats.cachePercentUsed) %}
                    {%= h(this.basicStats.cachePercentUsed) %}%
                </div>
              </td>
              <td>{%= h(this.basicStats.cacheSize) %}MB</td>
            </tr> <!-- This tr is important. Otherwise browser may close row after end of loop, causing incorrect resultant markup -->
          <!-- {% }); %} -->
        </table>
    </div>
  </div>

  <div id="alerts" style="display:none">
    <!-- Shadow box -->
    <h1>Alerts/Log</h1>
    <div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
        <div class="darker_block with_devider">
            <div class="pat_10">
                <ul class="tabs">
                  <li><a href="#">Current Alerts</a>
                  <!-- <li><a href="#">Alert Settings</a> -->
                  <li><a href="#">Log</a>
                </ul>
            </div>
        </div>
        <div class="panes">
          <div class="pad_10">
            <div id="alerts_list" class="alerts_list">
              <p class="pab_10">Alerts are being sent to: <span id="alerts_email_setting" class="bolder"></span> <a href='javascript:AlertsSection.changeEmail(),void(0);' class="text_11">Change</a></p>
              <ol id="alert_list_container">
              </ol>
              <ol id="alert_list_template" class="template">
                <!-- {% _.each(rows, function (alert) { %} -->
                <li class="alert_{%= h(alert.type) %}">
                  <div class="block pad_10">
                    <h3><strong>{%= formatAlertType(alert.type) %}</strong> - {%= h(alert.shortText) %}</h3>
                    <span class="time">{%= h(formatAlertTStamp(alert.tstamp)) %}</span>
                    <p>
                      <a class="dismiss point">Dismiss</a>
                      {%= h(alert.text) %}
                    </p>
                  </div>
                </li>
                <!-- {% }); %} -->
              </ol>
            </div>
          </div>
          <!-- <div>
            <h3>Alert Setting</h3>
            <input type="hidden" id="alerts_settings_form_is_clean" value="1">
            <form id="alerts_settings_form" onsubmit="javascript:return false;">
            <p><label><input type="checkbox" name="sendAlerts" value="1"><input type="hidden" value="0" name="sendAlerts">
            Notify me by email with alerts</label></p>
            <div id="alerts_settings_guts" style="display:none;">
              <p><label>Email Address <input type="text" name="email"></label></p>
              <h4>Alert Types</h4>
              <p>Alert me when:
              <ul>
                <li><label><input type="checkbox" value="1" name="sendForLowSpace"><input type="hidden" value="0" name="sendForLowSpace">
                ... a server is low on disk space.</label>
                <li><label><input type="checkbox" value="1" name="sendForLowMemory"><input type="hidden" value="0" name="sendForLowMemory">
                ... a server is low on available memory.</label>
                <li><label><input type="checkbox" value="1" name="sendForNotResponding"><input type="hidden" value="0" name="sendForNotResponding">
                ... a server is not responding.</label>
                <li><label><input type="checkbox" value="1" name="sendForJoinsCluster"><input type="hidden" value="0" name="sendForJoinsCluster">
                ... a new server joins cluster.</label>
                <li><label><input type="checkbox" value="1" name="sendForOpsAboveNormal"><input type="hidden" value="0" name="sendForOpsAboveNormal">
                ... average daily ops/second is above normal.</label>
                <li><label><input type="checkbox" value="1" name="sendForSetsAboveNormal"><input type="hidden" value="0" name="sendForSetsAboveNormal">
                ... average daily sets/second is above normal.</label>
              </ul>
            </div>
            <p><a href="javascript:AlertsSection.settingsCancel(),void(0);">Cancel</a>
              <button type="submit">Save</button></p>
            </form>
          </div> -->
          <div class="tab_holder">
            <table class="lined_tab">
              <tr>
                <th>Event</th>
                <th>Code</th>
                <th>Time</th>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
              <tr>
                <td>A server is not responding</td>
                <td>NS100</td>
                <td class="text_11"><strong>02:16:57</strong> - Sat Jul 23, 2010</td>
              </tr>
            </table>
          </div>
        </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
    <!-- END shadow box -->
  </div>
  <div id="settings" style="display:none">
    <!-- shadow box -->
    <div class="shadow_box"><div class="top"><div><div></div></div></div><div class="cnt"><div class="pad"><div class="content">
      <div class="darker_block with_devider">
          <div class="pat_10">
              <ul class="tabs">
                <li><a href="#">Basic</a></li>
                <li><a href="#">Advanced</a></li>
              </ul>
          </div>
      </div>
      <div class="panes">
        <div class="brdr_exl_t" style="display:none;">
          <div class="pad_10">
            <div class="advanced">
              <h2 class="head_2_underline">Port Configuration <a class="text_11">What’s this?</a></h2>
              <div class="form">
                <div class="labeled_line">
                  <label class="block label for_input">Proxy Port:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Cache Port:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
              </div>
              <h2 class="head_2_underline">Alert settings</h2>
              <div class="form">
                <div>
                  <label><input type="checkbox" class="check"> Notify me by email with alerts</label>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Email Address:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <h2 class="form_section_title">Mail Server Settings</h2>
                <div class="labeled_line">
                  <label class="block label for_input">Username:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Password:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Mail Server Address:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short">
                    Port:
                    <select class="select select_short">
                      <option></option>
                      <option></option>
                      <option></option>
                      <option></option>
                    </select>
                  </div>
                </div>
                <div class="labeled_line">
                  <div class="line_cnt">
                    <div>
                      <label><input type="checkbox" class="check"> Notify me by email with alerts</label>
                    </div>
                  </div>
                </div>
                <h2 class="form_section_title">Alert me when there are...</h2>
                <div class="pat_10">
                  <table class="lined_tab brdr_exl_r">
                    <col width="" />
                    <col width="115" />
                    <col width="50" />
                    <tr>
                      <th>Critical Issues</th>
                      <th>Type</th>
                      <th>Active</th>
                    </tr>
                    <tr>
                      <td>A server is not responding</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>A server is down</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                  </table>
                </div>
                <div class="pat_10">
                  <table class="lined_tab brdr_exl_r">
                    <col width="" />
                    <col width="115" />
                    <col width="50" />
                    <tr>
                      <th>Attention Required</th>
                      <th>Type</th>
                      <th>Active</th>
                    </tr>
                    <tr>
                      <td>A bucket has been deleted</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>Bucket authentication failure</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                  </table>
                </div>
                <div class="pat_10">
                  <table class="lined_tab brdr_exl_r">
                    <col width="" />
                    <col width="115" />
                    <col width="50" />
                    <tr>
                      <th>Informational Issues</th>
                      <th>Type</th>
                      <th>Active</th>
                    </tr>
                    <tr>
                      <td>A new server joins a cluster</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>A server leaves a cluster</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>A new bucket has been created</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                    <tr>
                      <td>Bucket authentication failure</td>
                      <td>Email</td>
                      <td class="cntr"><input type="checkbox" /></td>
                    </tr>
                  </table>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="brdr_exl_t">
          <div class="pad_10">
            <div class="basic">
              <h2 class="head_2_underline">Web Console</h2>
              <div class="form">
                <div class="labeled_line">
                  <label class="block label for_input">Port:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short"/>
                  </div>
                </div>
              </div>
              <h2 class="head_2_underline">Security <a class="text_11">What’s this?</a></h2>
              <div class="form">
                <div>
                  <label><input type="checkbox" class="check"/> Secure this Server</label>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Username:</label>
                  <div class="line_cnt">
                    <input type="text" class="text inp_short"/>
                    <a href="#" class="text_11">Setup Email Alerts</a>
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Password:</label>
                  <div class="line_cnt">
                    <input type="password" class="text inp_short"/>
                  </div>
                </div>
                <div class="labeled_line">
                  <label class="block label for_input">Verify Password:</label>
                  <div class="line_cnt">
                    <input type="password" class="text inp_short"/>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="darker_block">
        <div class="pad_10">
          <div class="right save_cancel">
            <a href="#" class="save_button float_right">SAVE</a>
            <a href="#" class="cancel_button float_right">CANCEL</a>
          </div>
        </div>
      </div>
    </div></div></div><div class="bottom"><div><div></div></div></div></div>
    <!-- END shadow box -->
  </div>

</tr>
</table>


</div> <!-- mainContainer -->

<div id="footer">
  <h1>Copyright 2010 <a href="http://northscale.com">NorthScale, Inc.</a> All rights reserved.</h1>
</div>

</div> <!-- container -->

<!-- dialogs -->
<div class="jqmWindow" id="login_dialog">
  <div>Dev. hint: use <a href="/index.html?noauth&amp;ajaxDelay=350">noauth</a> version</div>
<form id="login_form">
  <label>Login:<input name="login"></label>
  <label>Password:<input name="password"></label>
  <input type="submit">
</form>
<script>
  $('#login_form').bind('submit', function (e) {
    e.preventDefault();
    loginFormSubmit();
  });
</script>
</div>
<div class="jqmWindow" id="bucket_details_dialog_container">
</div>
<div id="bucket_details_dialog_template" class="template">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">Bucket properties for {%= h(b.name) %}</p>
        <div class="pas_20">
          <!-- <a href="#" class="jqmClose">Close</a> -->
          <p class="u_line"><span class="label">Bucket name:</span><a class="float_right remove_bucket">Remove</a> {%= h(b.name) %}</p>
          <p class="u_line"><span class="label">Cache size:</span>
          <a class="float_right" href="{%=jsLink('BucketsSection.startFlushCache',b.uri)%}">Flush All</a>
          {%= h(b.basicStats.cacheSize) %} MB 
          </p>
          <p class="u_line"><span class="label">Password:</span>
          <a class="float_right" href="javascript:BucketsSection.startPasswordChange()">Change Password</a>
          ***** </p>
          <div class="pat_10">
            <p class="normal text_12">
            Sample connection string:<br />
            <textarea rows="3" readonly>sample connection string here</textarea>
            </p>
            <div class="right save_cancel">
              <button class="save_button float_right" type="submit">DONE</button>
              <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="add_new_bucket_dialog">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">Add New Bucket</p>
        <div id="add_new_bucket_errors_container" class="warning" style="padding:10px 20px;"></div>
        <div id="add_new_bucket_errors_template" class="template">
          <strong>Couldn't create bucket due to:</strong>
          <ul>
            <!-- {% _.each(rows, function (e) { %} -->
            <li>{%= h(e) %}
            <!-- {% }); %} -->
          </ul>
        </div>

        <form id="add_new_bucket_form">
          <p><label><b>Bucket Name:</b><input type="text" name="name" class="inp" style="width:290px;" value="No spaces, alphanumeric up to 12 characters"></label></p>
          <p><label><b>Cache Size:</b><input type="text" name="cacheSize" class="inp" style="width:40px;"><span class="cache-details"></span>MB x 3 server nodes = 192MB Total Cache Size/30GB Cluster memory available.</label></p>
          <p><b>&nbsp;</b> <input type="checkbox" class="chkbx" /> <span class="text_12">Reserve memory in advance</span></p>
          <p><b>Password:</b><input type="password" name="password" autocomplete="off" class="inp"></p>
          <p><b>Verify Password:</b><input type="password" name="verifyPassword" autocomplete="off" class="inp"> <span class="dont-match">Password don't match</span></p>
          <!-- <p><a href="#" class="jqmClose">cancel</a> <button type="submit">Add Bucket</button></p> -->
          <div class="pas_20">
            <div class="right save_cancel">
              <button class="save_button float_right" type="submit">ADD</button>
              <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="flush_cache_dialog_container">
</div>
<div class="template" id="flush_cache_dialog_template">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">
          Bucket Properties
        </p>
        <div class="pas_20">
          <!--
          <table>
            <tr>
              <td>
                Cache Size
              </td>
              <td>
                {%=h(bucket.basicStats.cacheSize)%}
                [MB x {%=h(DAO.getBucketNodesCount(bucket))%} = {%=h(DAO.getBucketNodesCount(bucket) * bucket.basicStats.cacheSize)%}MB Total Cache]
              </td>
            </tr>
            <tr>
              <td>Total Items Stored</td>
              <td>{%=h(bucket.basicStats.totalItemsStored)%}</td>
            </tr>
          </table>
          -->
          <p class="u_line text_14">
            <span class="label">Flushing Cache:</span>
            <strong>
              {%=h(bucket.basicStats.cacheSize)%}
                [MB x {%=h(DAO.getBucketNodesCount(bucket))%} = {%=h(DAO.getBucketNodesCount(bucket) * bucket.basicStats.cacheSize)%}MB Total Cache]
            </strong>
          </p>
          <div class="warning pat_20">
            	<strong>Warning</strong> – Flushing all the cache will result in data loss for this bucket. Are you sure you want to flush the cache?
          </div>
        </div>
        <div class="pas_20">
          <div class="right save_cancel">
            <a class="save_button float_right" href="{%=renderJSLink('BucketsSection.completeFlushCache', bucket.uri)%}">FLUSH</a>
            <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="flush_bucket_remove_dialog">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">
          Bucket Properties
        </p>
        <div class="pas_20">
          <p class="u_line text_14">
            <span class="norm_14">Removing</span>
            <strong>
              Bucket_6
            </strong>
          </p>
          <div class="warning pat_20">
            	<strong>Warning</strong> – Removing this bucket will result in complete data loss for this bucket. Are you sure you want to remove it?
          </div>
        </div>
        <div class="pas_20">
          <div class="right save_cancel">
            <a class="save_button float_right" href="#">REMOVE</a>
            <a href="#" class="jqmClose cancel_button float_right">CANCEL</a>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="bucket_password_dialog">
  <div class="lbox">
    <div class="top">
      <div class="top_left"></div>
      <div class="top_right"></div>
      <div class="top_center"></div>
    </div>
    <div class="center">
      <div class="pad">
        <p class="lbox_header">Bucket Properties</p>
        <br />
        <div class="pas_20">
          <p class="u_line norm_14">
            Change Password: ******
          </p>
        </div>
        <form id="bucket_password_form" class="pat_10">
          <div class="pas_20">
            <p class="u_line_sm"><span class="label">Password:</span> <input class="inp" type="password" name="password"></p>
            <p class="u_line_sm"><span class="label">New Password:</span> <input class="inp" type="password" name="verifyPassword"></p>
            <p class="u_line_sm"><span class="label">Verify Password:</span> <input class="inp" type="password" name="verifyPassword"></p>
            <div class="right save_cancel">
              <!--<a class="save_button float_right" href="#">SAVE</a>-->
              <button type="submit" class="save_button float_right">CHANGE</button>
              <a class="jqmClose cancel_button float_right" href="#">CANCEL</a>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="bottom">
      <div class="bottom_left"></div>
      <div class="bottom_right"></div>
      <div class="bottom_center"></div>
    </div>
  </div>
</div>
<div class="jqmWindow" id="join_cluster_dialog">
  <h1>Join a Cluster</h1>
  <ul id="join_cluster_dialog_errors_container"></ul>
  <ul id="join_cluster_dialog_errors_template" class="template">
    <!-- {% _.each(rows, function (e) { %} -->
    <li><strong>Attention</strong> - {%= h(e) %}
    <!-- {% }); %} -->
  </ul>
  <form>
  <p><label>IP Address:<input name="clusterMemberHostIp"></label></p>
  <p><label>Port:<input name="clusterMemberHostPort"></label></p>
  <p><label>Username:<input name="user"></label></p>
  <p><label>Password:<input name="password" type="password"></label></p>
  <p><a class="jqmClose">CANCEL</a> <button type="submit">JOIN CLUSTER</button></p>
  </form>
</div>
<!-- Join cluster -->
<div class="lbox join_cluster" style="display:none;">
  <div class="top">
    <div class="top_left"></div>
    <div class="top_right"></div>
    <div class="top_center"></div>
  </div>
  <div class="center">
    <div class="pad">
      <p class="lbox_header">Join a Cluster</p>
      <div class="pas_20">
        <p class="warning pat_10" style="display:none;"><strong>Attention</strong> – the cluster you have tried to join requires a username and password.</p>
        <p class="warning pat_10" style="display:none;"><strong>Attention</strong> – hostname or IP is invalid or unreachable.</p>
        <table>
          <tr>
            <th>
              Cluster <a href="#" class="text_11">What’s this?</a>
            </th>
            <th>
              Security <a href="#" class="text_11">What’s this?</a>
            </th>
          </tr>
          <tr>
            <td>
              <div class="u_line_sm">
                <span class="label">IP Address:</span>
                <input type="text" class="inp">
              </div>
              <div class="u_line_sm">
                <span class="label">Port:</span>
                <input type="text" class="inp">
              </div>
            </td>
            <td>
              <div class="u_line_sm">
                <span class="label">Username:</span>
                <input type="text" class="inp">
              </div>
              <div class="u_line_sm">
                <span class="label">Password:</span>
                <input type="password" class="inp">
              </div>
            </td>
          </tr>
        </table>
        <div class="right save_cancel">
          <button type="submit" class="save_button button_3 float_right">JOIN CLUSTER</button>
          <a class="jqmClose cancel_button float_right" href="#">CANCEL</a>
        </div>
      </div>
    </div>
  </div>
  <div class="bottom">
    <div class="bottom_left"></div>
    <div class="bottom_right"></div>
    <div class="bottom_center"></div>
  </div>
</div>
<!-- END join cluster -->
</body>
</html>

{'fraction_non_alphanumeric': 0.17630047399052018, 'fraction_numerical': 0.007559848803023939, 'mean_word_length': 1.7985761300288803, 'pattern_counts': {'":': 0, '<': 3135, '<?xml version=': 0, '>': 3137, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 40, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1269559', 'n_tokens_mistral': 25501, 'n_tokens_neox': 24023, 'n_words': 4700}