You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@tez.apache.org by sr...@apache.org on 2016/04/26 12:18:50 UTC

[19/31] tez git commit: TEZ-3227. Tez UI: Replace UI1 with UI2 (sree)

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/column-selector.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/column-selector.hbs b/tez-ui/src/main/webapp/app/templates/components/column-selector.hbs
new file mode 100644
index 0000000..a5dcf9c
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/column-selector.hbs
@@ -0,0 +1,50 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="selection-list">
+  <div class="filter-option highlight">
+    <div class="form-group">
+      {{input class="form-control" placeholder="Filter..." value=searchText}}
+    </div>
+    <div class="select-all">
+      <input type="checkbox"
+             checked={{selectAll}}
+             onclick={{action "selectAll" value="target.checked"}} />
+      &nbsp;Select All
+    </div>
+  </div>
+  <div class="options">
+    {{#if filteredOptions.length}}
+      {{#each filteredOptions as |option|}}
+        <div class="select-option {{option.css}}">
+          {{input type="checkbox" classNames='checkbox' checked=option.selected}}
+          {{option.displayText}}
+        </div>
+      {{/each}}
+    {{else}}
+      <h4>&nbsp;No options available...</h4>
+    {{/if}}
+  </div>
+</div>
+<div class="form-actions">
+  <span class="message">
+    {{{content.message}}}
+  </span>
+  <button type="button" class="btn btn-primary" {{action "ok"}} data-dismiss="modal" aria-label="Close">Ok</button>
+  <button type="button" class="btn" data-dismiss="modal" aria-label="Close">Cancel</button>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/counter-table.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/counter-table.hbs b/tez-ui/src/main/webapp/app/templates/components/counter-table.hbs
deleted file mode 100644
index fcbbd15..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/counter-table.hbs
+++ /dev/null
@@ -1,58 +0,0 @@
-{{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-}}
-
-<table class='countertable'>
-  <thead>
-    <tr>
-      <th>Counter Name</th>
-      <th>Counter Value</th>
-    </tr>
-    <tr>
-      <td class='filter'>
-        <div {{bind-attr class=":input-group validFilter::has-error"}}>
-          {{input size='60' class="form-control" type='search' results='1' placeholder='Search...' valueBinding='nameFilter'}}
-        </div>
-      </td>
-      <td class='filter'></td>
-    </tr>
-    <tbody>
-      {{#each counterGroup in filteredData}}
-        <tr class='group-header'>
-          <td colspan='2'>
-            {{#if counterGroup.counterGroupDisplayName}}
-              {{counterGroup.counterGroupDisplayName}}
-            {{else}}
-              {{counterGroup.counterGroupName}}
-            {{/if}}
-          </td>
-        </tr>
-        {{#each counter in counterGroup.counters}}
-          <tr>
-            <td>{{#if counter.counterDisplayName}}
-                  {{counter.counterDisplayName}}
-                {{else}}
-                  {{counter.counterName}}
-                {{/if}}
-            </td>
-            <td>{{formatNumThousands counter.counterValue}}</td>
-          </tr>
-        {{/each}}
-      {{/each}}
-    </tbody>
-  </thead>
-</table>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/dag-view.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/dag-view.hbs b/tez-ui/src/main/webapp/app/templates/components/dag-view.hbs
deleted file mode 100644
index eb9c661..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/dag-view.hbs
+++ /dev/null
@@ -1,110 +0,0 @@
-{{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-}}
-
-{{#if errMessage}}
-  <div class="text-align-center">
-    <h1>Rendering failed! </h1><h5>{{errMessage}}</h5>
-  </div>
-{{else}}
-  <div class="svg-container">
-    <svg>
-      <defs>
-        <rect id="vertex-bg"
-            class="vertex-node-bg"
-            style="fill: url(#vertex-grad); filter: url(#grey-glow)"
-            rx="5" ry="5" width="80" height="30" x="-40" y="-15"/>
-        <rect id="input-bg"
-            class="input-node-bg"
-            style="fill: url(#input-grad); filter: url(#grey-glow)"
-            rx="15" ry="15" width="80" height="30" x="-40" y="-15"/>
-        <rect id="output-bg"
-            class="output-node-bg"
-            style="fill: url(#output-grad); filter: url(#grey-glow)"
-            rx="15" ry="15" width="80" height="30" x="-40" y="-15"/>
-        <circle id="task-bubble" class="task-bubble-bg"
-            style="fill: url(#task-grad); filter: url(#grey-glow)"
-            r="10"/>
-        <circle id="io-bubble" class="input-node-bg"
-            style="fill: url(#input-grad); filter: url(#grey-glow)"
-            r="10"/>
-        <circle id="group-bubble" class="group-bubble-bg"
-            style="fill: url(#group-grad); filter: url(#grey-glow)"
-            r="8"/>
-
-        <marker id="arrow-marker" viewBox="0 -5 10 10" markerWidth="2" markerHeight="2" orient="auto">
-          <path style="fill: #AAA;" d="M0,-5L10,0L0,5"/>
-        </marker>
-
-        <radialGradient id="vertex-grad" cx="50%" cy="50%" r="100%" fx="50%" fy="50%">
-          <stop offset="0%" style="stop-color:#b0c4de;" />
-          <stop offset="100%" style="stop-color:#769ccd;" />
-        </radialGradient result="gradient">
-
-        <radialGradient id="input-grad" cx="50%" cy="50%" r="100%" fx="50%" fy="50%">
-          <stop offset="0%" style="stop-color:#adff2e;" />
-          <stop offset="100%" style="stop-color:#91d723;" />
-        </radialGradient result="gradient">
-
-        <radialGradient id="output-grad" cx="50%" cy="50%" r="100%" fx="50%" fy="50%">
-          <stop offset="0%" style="stop-color:#fa8072;" />
-          <stop offset="100%" style="stop-color:#d26457;" />
-        </radialGradient result="gradient">
-
-        <radialGradient id="task-grad" cx="50%" cy="50%" r="100%" fx="50%" fy="50%">
-          <stop offset="0%" style="stop-color:#D0BFD1;" />
-          <stop offset="100%" style="stop-color:#af8fb1;" />
-        </radialGradient result="gradient">
-
-        <radialGradient id="group-grad" cx="50%" cy="50%" r="100%" fx="50%" fy="50%">
-          <stop offset="0%" style="stop-color:#BBBBBB;" />
-          <stop offset="100%" style="stop-color:#999999;" />
-        </radialGradient result="gradient">
-
-        <filter id="grey-glow">
-          <feColorMatrix type="matrix" values=
-              "0 0 0 0   0
-               0 0 0 0   0
-               0 0 0 0   0
-               0 0 0 0.3 0"/>
-          <feGaussianBlur stdDeviation="2.5" result="coloredBlur"/>
-          <feMerge>
-            <feMergeNode in="coloredBlur"/>
-            <feMergeNode in="SourceGraphic"/>
-          </feMerge>
-        </filter>
-      </defs>
-    </svg>
-  </div>
-  <div class="button-panel">
-    <i {{bind-attr class=':tgl-additionals hideAdditionals'}} {{action 'tglAdditionals'}} title="Toggle source/sink visibility"></i>
-    <i {{bind-attr class=':config :jq-tooltip'}} {{action 'configure'}} title="Customize vertex tooltip"></i>
-    <i {{bind-attr class=':timeline :no-display'}} {{action 'configure'}} title="Toggle Timeline"></i>
-    <i class="seperator"></i>
-    <i {{bind-attr class=':tgl-orientation isHorizontal:fa-rotate-270:fa-rotate-180'}} {{action 'tglOrientation'}} title="Toggle orientation"></i>
-    <i {{bind-attr class=':fit-graph'}} {{action 'fitGraph'}} title="Fit DAG to viewport"></i>
-    <i {{bind-attr class=':tgl-fullscreen'}} {{action 'fullscreen'}} title="Toggle fullscreen"></i>
-  </div>
-  <div class="tool-tip">
-    <div class="bubble">
-      <div class="tip-title">Title</div>
-      <div class="tip-text"></div>
-      <div class="tip-list"></div>
-    </div>
-  </div>
-  <div id="dialog-container"></div>
-{{/if}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/dags-page-search.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/dags-page-search.hbs b/tez-ui/src/main/webapp/app/templates/components/dags-page-search.hbs
new file mode 100644
index 0000000..60a0958
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/dags-page-search.hbs
@@ -0,0 +1,77 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="form-group">
+  <div class="search-element dag-name">
+    <label for="pwd">DAG Name:</label>
+    {{input value=dagName
+      type="text"
+      class="form-control input-sm"
+      placeholder="Search..."
+      enter="search"
+    }}
+  </div><div class="search-element">
+    <label for="pwd">ID:</label>
+    {{input value=dagID
+      type="text"
+      class="form-control input-sm"
+      placeholder="Search..."
+      enter="search"
+    }}
+  </div><div class="search-element">
+    <label for="pwd">Submitter:</label>
+    {{input value=submitter
+      type="text"
+      class="form-control input-sm"
+      placeholder="Search..."
+      enter="search"
+    }}
+  </div><div class="search-element">
+    <label for="pwd">Status:</label>
+    <select value={{status}}
+        class="form-control input-sm"
+        onchange={{action "statusChanged" value="target.value"}}
+        {{action "statusKeyPress" on="keyPress"}}>
+      <option value="">All</option>
+      <option value="SUBMITTED">Submitted</option>
+      <option value="RUNNING">Running</option>
+      <option value="SUCCEEDED">Succeeded</option>
+      <option value="FAILED">Failed</option>
+      <option value="ERROR">Error</option>
+    </select>
+  </div><div class="search-element">
+    <label for="pwd">Application ID:</label>
+    {{input value=appID
+      type="text"
+      class="form-control input-sm"
+      placeholder="Search..."
+      enter="search"
+    }}
+  </div><div class="search-element">
+    <label for="pwd">Caller ID:</label>
+    {{input value=callerID
+      type="text"
+      class="form-control input-sm"
+      placeholder="Search..."
+      enter="search"
+    }}
+  </div>
+</div>
+<button type="button" class="btn btn-success" {{action 'search'}}>
+  <i class="fa fa-search" aria-hidden="true"></i>
+</button>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/dags-pagination-ui.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/dags-pagination-ui.hbs b/tez-ui/src/main/webapp/app/templates/components/dags-pagination-ui.hbs
new file mode 100644
index 0000000..d4ebe4f
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/dags-pagination-ui.hbs
@@ -0,0 +1,50 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<ul class="page-list">
+  <li class="{{unless atFirst 'clickable'}}" {{action 'changePage' 1}}>
+    {{#if dataProcessor.processedRows.length}}
+      First
+    {{else}}
+      No Records!
+    {{/if}}
+  </li>
+  {{#each _possiblePages as |page|}}
+    <li class="{{if page.isCurrent 'is-current' 'clickable'}}" {{action 'changePage' page.pageNum}}>
+      {{#if page.isLoadPage}}
+        {{#if tableDefinition.loadingMore}}
+          <i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
+        {{else}}
+          {{page.pageNum}}
+        {{/if}}
+      {{else}}
+        {{page.pageNum}}
+      {{/if}}
+    </li>
+  {{/each}}
+</ul>
+
+<div class='row-select'>
+  <select title="Select rows to display" class="form-control" onchange={{action "rowSelected" value="target.value"}}>
+    {{#each rowCountOptions as |option|}}
+      <option value={{option.value}} selected={{option.selected}}>
+        {{option.value}} Rows
+      </option>
+    {{/each}}
+  </select>
+</div>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/date-formatter.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/date-formatter.hbs b/tez-ui/src/main/webapp/app/templates/components/date-formatter.hbs
new file mode 100644
index 0000000..0f740cb
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/date-formatter.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{txt content type="date" timeZone=timeZone}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-blocking-event.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-blocking-event.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-blocking-event.hbs
new file mode 100644
index 0000000..0fabd16
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-blocking-event.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="event-line"></div>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-consolidated-process.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-consolidated-process.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-consolidated-process.hbs
new file mode 100644
index 0000000..0507469
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-consolidated-process.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+&nbsp;
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event-bar.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event-bar.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event-bar.hbs
new file mode 100644
index 0000000..b2cc9bd
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event-bar.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="event-bar"></div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event.hbs
new file mode 100644
index 0000000..e5ddfa9
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-event.hbs
@@ -0,0 +1,20 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="event-line"></div>
+<div class="event-bubble"></div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-line.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-line.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-line.hbs
new file mode 100644
index 0000000..bd790fa
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-line.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="process-line"></div>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-name.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-name.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-name.hbs
new file mode 100644
index 0000000..98ef757
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-name.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{process.name}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
new file mode 100644
index 0000000..2c6a9e2
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-process-visual.hbs
@@ -0,0 +1,57 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="base-line"></div>
+{{em-swimlane-process-line
+  process=process
+  processor=processor
+  showTooltip="showTooltip"
+  hideTooltip="hideTooltip"
+  click="click"
+}}
+{{#each process.blocking key="_id" as |blocking|}}
+  {{em-swimlane-blocking-event
+    process=process
+    blocking=blocking
+    processor=processor
+    showTooltip="showTooltip"
+    hideTooltip="hideTooltip"
+    click="click"
+  }}
+{{/each}}
+{{#each process.eventBars as |bar index|}}
+  {{em-swimlane-event-bar
+    bar=bar
+    barIndex=index
+    process=process
+    processor=processor
+    showTooltip="showTooltip"
+    hideTooltip="hideTooltip"
+    click="click"
+  }}
+{{/each}}
+{{#each process.events key="name" as |event|}}
+  {{em-swimlane-event
+    process=process
+    event=event
+    processor=processor
+    showTooltip="showTooltip"
+    hideTooltip="hideTooltip"
+    click="click"
+  }}
+{{/each}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-ruler.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-ruler.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-ruler.hbs
new file mode 100644
index 0000000..d832c13
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-ruler.hbs
@@ -0,0 +1,30 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="ruler-line"></div>
+<div class="mark-container">
+  {{#each marks as |mark|}}
+    <div class="ruler-mark" style={{markDef.style}}>
+      <ul class="sub-marks"><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li></ul>
+      &nbsp;{{mark.duration}}
+    </div>
+  {{/each}}
+</div>
+<div class="unit-text" style={{unitTextStyle}}>
+  {{markDef.unit}}
+</div>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane-vertex-name.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane-vertex-name.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-vertex-name.hbs
new file mode 100644
index 0000000..8c977ee
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane-vertex-name.hbs
@@ -0,0 +1,23 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{progressText}}
+{{em-table-status-cell content=process.vertex.finalStatus}}
+<span class="name-text {{if useEllipsis 'ellipsis'}}">
+  {{processName}}
+</span>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-swimlane.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-swimlane.hbs b/tez-ui/src/main/webapp/app/templates/components/em-swimlane.hbs
new file mode 100644
index 0000000..9857cbb
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-swimlane.hbs
@@ -0,0 +1,63 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="process-names">
+  {{#each normalizedProcesses key="_id" as |process|}}
+    {{component nameComponent
+      process=process
+      showTooltip="showTooltip"
+      hideTooltip="hideTooltip"
+      click="click"
+    }}
+  {{/each}}
+  <div class="consolidated-view-label">
+    Consolidated
+  </div>
+</div><div class="process-visuals">
+  <div class="zoom-panel">
+    {{#each normalizedProcesses key="_id" as |process|}}
+      {{component visualComponent
+        process=process
+        processor=processor
+        showTooltip="showTooltip"
+        hideTooltip="hideTooltip"
+        click="click"
+      }}
+    {{/each}}
+
+    {{#if consolidate}}
+      <div class="consolidated-view">
+        {{#each normalizedProcesses key="_id" as |process|}}
+          {{em-swimlane-consolidated-process
+            focusedProcess=focusedProcess
+            process=process
+            processor=processor
+            showTooltip="showTooltip"
+            hideTooltip="hideTooltip"
+            click="click"
+          }}
+        {{/each}}
+      </div>
+    {{/if}}
+
+    {{em-swimlane-ruler scroll=scroll processor=processor zoom=zoom}}
+
+  </div>
+</div>
+
+{{em-tooltip contents=tooltipContents}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-table-status-cell.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-table-status-cell.hbs b/tez-ui/src/main/webapp/app/templates/components/em-table-status-cell.hbs
new file mode 100644
index 0000000..9783b6c
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-table-status-cell.hbs
@@ -0,0 +1,26 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if content}}
+  <span class="status {{statusName}}">
+    <i class="status-icon"></i>
+    {{content}}
+  </span>
+{{else}}
+  <span class="txt-message"> Not Available! </span>
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/em-tooltip.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/em-tooltip.hbs b/tez-ui/src/main/webapp/app/templates/components/em-tooltip.hbs
new file mode 100644
index 0000000..65f33db
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/em-tooltip.hbs
@@ -0,0 +1,54 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#each _contents as |content|}}
+
+  <div class="bubble-container">
+    <div class="bubble">
+      {{#if content.title}}{{show_}}
+        <div class="tip-title">{{content.title}}</div>
+      {{/if}}
+      {{#if content.description}}
+        <div class="tip-desc">{{content.description}}</div>
+      {{/if}}
+      {{#if content.properties}}
+        <div class="tip-props">
+          <table>
+            {{#each content.properties as |prop|}}
+              <tr>
+                <td>
+                  {{prop.name}}
+                </td>
+                <td>
+                  {{txt prop.value
+                  type=prop.type
+                  format=prop.format
+                  timeZone=prop.timeZone
+                  valueFormat=prop.valueFormat
+                  valueTimeZone=prop.valueTimeZone
+                  valueUnit=prop.valueUnit}}
+                </td>
+              </tr>
+            {{/each}}
+          </table>
+        </div>
+      {{/if}}
+    </div>
+  </div>
+
+{{/each}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/error-bar.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/error-bar.hbs b/tez-ui/src/main/webapp/app/templates/components/error-bar.hbs
new file mode 100644
index 0000000..a21bba0
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/error-bar.hbs
@@ -0,0 +1,31 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="message" {{action "toggleDetailsDisplay"}}>
+  <i class="fa fa-exclamation-circle"></i>
+  {{#if code}}
+    <b>{{code}}</b> :
+  {{/if}}
+  {{message}}
+  <i class="show-details fa {{if showDetails 'fa-minus-circle' 'fa-plus-circle'}}"></i>
+</div>
+<div class="details {{if showDetails "visible"}}">{{{details}}}{{#if stack}}<b>Stack:</b>
+    {{stack}}
+  {{/if}}
+</div>
+<i class="close-button fa fa-arrow-circle-down" {{action "close"}}></i>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/extended-table/extable.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/extended-table/extable.hbs b/tez-ui/src/main/webapp/app/templates/components/extended-table/extable.hbs
deleted file mode 100644
index 6f58aed..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/extended-table/extable.hbs
+++ /dev/null
@@ -1,30 +0,0 @@
-{{!
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
-}}
-
-{{#if controller.hasHeader}}
-  {{view Ember.Table.HeaderTableContainer}}
-{{/if}}
-{{#if controller.hasFilter}}
-	{{view App.ExTable.FilterTableContainer}}
-{{/if}}
-{{view Ember.Table.BodyTableContainer}}
-{{#if controller.hasFooter}}
-  {{view Ember.Table.FooterTableContainer}}
-{{/if}}
-{{view Ember.Table.ScrollContainer}}
-{{view Ember.Table.ColumnSortableIndicator}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-cell.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-cell.hbs b/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-cell.hbs
deleted file mode 100644
index 2e0773e..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-cell.hbs
+++ /dev/null
@@ -1,23 +0,0 @@
-{{!
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
-}}
-
-<div class="ember-table-content-container" style='cursor: auto;'>
-  <span class="ember-table-content" style='white-space: nowrap; cursor: auto;'>
-    {{view view.inputFieldView}}
-  </span>
-</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-container.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-container.hbs b/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-container.hbs
deleted file mode 100644
index 6a05936..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-container.hbs
+++ /dev/null
@@ -1,33 +0,0 @@
-{{!
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
-}}
-
-<div class="ember-table-table-fixed-wrapper">
-  {{#if controller.numFixedColumns}}
-    {{view App.ExTable.FilterBlock classNames="ember-table-left-table-block"
-      columnsBinding="controller.fixedColumns"
-      widthBinding="controller._fixedBlockWidth"
-      heightBinding="controller.filterHeight"
-    }}
-  {{/if}}
-  {{view App.ExTable.FilterBlock classNames="ember-table-right-table-block"
-    columnsBinding="controller.tableColumns"
-    scrollLeftBinding="controller._tableScrollLeft"
-    widthBinding="controller._tableBlockWidth"
-    heightBinding="controller.filterHeight"
-  }}
-</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-row.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-row.hbs b/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-row.hbs
deleted file mode 100644
index 8647a31..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/extended-table/filter-row.hbs
+++ /dev/null
@@ -1,23 +0,0 @@
-{{!
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
-}}
-
-{{view Ember.MultiItemViewCollectionView
-  contentBinding="view.content"
-  itemViewClassField="filterCellViewClass"
-  widthBinding="controller._tableColumnsWidth"
-}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/kv-table.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/kv-table.hbs b/tez-ui/src/main/webapp/app/templates/components/kv-table.hbs
deleted file mode 100644
index bc359d8..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/kv-table.hbs
+++ /dev/null
@@ -1,47 +0,0 @@
-{{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-}}
-
-<table class='kv-table'>
-  <thead>
-    <tr>
-      <th>Key</th>
-      <th>Value</th>
-    </tr>
-    <tr>
-      <td class='filter' colspan='2'>
-        <div>
-          {{bs-button title="showAll" size="small" class="align-right" clicked="showAllButtonClicked" classBinding="showAllButtonClass"}}
-          <span class="input-wrapper">
-            {{input size='60' type='search' results='1' placeholder='Search...' valueBinding='filterExp'}}
-          </span>
-        </div>
-        <div>
-          {{bs-label content="Invalid regex" type="warning" classBinding="errorMsgClass"}}
-        </div>
-      </td>
-    </tr>
-    <tbody>
-      {{#each kv in filteredKVs}}
-        <tr>
-          <td>{{unbound kv.key}}</td>
-          <td>{{unbound formatNumThousands kv.value}}</td>
-        </tr>
-      {{/each}}
-    </tbody>
-  </thead>
-</table>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/load-time.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/load-time.hbs b/tez-ui/src/main/webapp/app/templates/components/load-time.hbs
deleted file mode 100644
index 90bac27..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/load-time.hbs
+++ /dev/null
@@ -1,47 +0,0 @@
-{{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-}}
-
-<div class="panel panel-default load-component">
-  <div class="panel-body">
-    <div class="horizontal-half">
-      <i class='fa fa-clock-o'></i>
-
-      {{#if targetObject.showAutoUpdate}}
-        <div class="auto-update">
-          {{view App.Checkbox
-          classNames='inline-display checkbox'
-          checked=targetObject.pollingEnabled
-          }}
-          Auto Refresh
-        </div>
-      {{/if}}
-    </div><div class="horizontal-half align-children-right">
-      <span class="margin-small-horizontal">
-        {{#if displayTime}}
-          Last refreshed at <b>{{displayTime}}</b>
-        {{else}}
-          Load time not available!
-        {{/if}}
-      </span>
-      <button type="button" {{bind-attr class=":btn :btn-success :btn-sm isRefreshable::no-display"}} {{action 'refresh'}}>
-        <i class='fa fa-refresh'></i>
-        Refresh
-      </button>
-    </div>
-  </div>
-</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/page-nav.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/page-nav.hbs b/tez-ui/src/main/webapp/app/templates/components/page-nav.hbs
deleted file mode 100644
index dad7c82..0000000
--- a/tez-ui/src/main/webapp/app/templates/components/page-nav.hbs
+++ /dev/null
@@ -1,24 +0,0 @@
-{{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-}}
-
-<div class="page-count">
-  <div class="text">Page</div><span class="counter">{{page}}</span>
-</div>
-<i {{bind-attr class=':nav-first hasPrev:enabled:disabled'}} {{action 'gotoFirst'}}></i>
-<i {{bind-attr class=':nav-prev hasPrev:enabled:disabled'}} {{action 'gotoPrev'}}></i>
-<i {{bind-attr class=':nav-next hasNext:enabled:disabled'}} {{action 'gotoNext'}}></i>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/stats-link.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/stats-link.hbs b/tez-ui/src/main/webapp/app/templates/components/stats-link.hbs
new file mode 100644
index 0000000..0d91ae9
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/stats-link.hbs
@@ -0,0 +1,25 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if value}}
+  {{#link-to routeName (query-params searchText=searchText)}}
+    {{txt value type="number"}} {{_statsType}}
+  {{/link-to}}
+{{else}}
+  {{txt value type="number"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/tab-n-refresh.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/tab-n-refresh.hbs b/tez-ui/src/main/webapp/app/templates/components/tab-n-refresh.hbs
new file mode 100644
index 0000000..e489f00
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/tab-n-refresh.hbs
@@ -0,0 +1,44 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<ul class="nav nav-tabs tab-n-refresh">
+  {{#each normalizedTabs as |tab|}}
+    <li class="{{if tab.active 'active'}}">
+      {{#link-to tab.routeName}}
+        {{tab.text}}
+      {{/link-to}}
+    </li>
+  {{/each}}
+  <span class="refresh-ui">
+    <span class="text-elements">
+      <span class="auto-refresh {{unless autoRefreshVisible 'no-visible'}}">
+        {{input type="checkbox" name="autoEnabled" checked=autoRefreshEnabled}}
+        Auto Refresh
+        <br/>
+      </span>
+      {{#if loadTime}}
+        Last refreshed at <b>{{date-formatter content=loadTime}}</b>
+      {{else}}
+        Load time not available!
+      {{/if}}
+    </span>
+    <button type="button" class="btn btn-success" {{action "refresh"}}>
+      <i class='fa fa-refresh'></i> Refresh
+    </button>
+  </span>
+</ul>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/table-controls.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/table-controls.hbs b/tez-ui/src/main/webapp/app/templates/components/table-controls.hbs
new file mode 100644
index 0000000..1894cb7
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/table-controls.hbs
@@ -0,0 +1,19 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<i class='fa fa-cog' title="Customize" {{action 'cogClicked'}}></i>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/components/zip-download-modal.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/components/zip-download-modal.hbs b/tez-ui/src/main/webapp/app/templates/components/zip-download-modal.hbs
new file mode 100644
index 0000000..03b820e
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/components/zip-download-modal.hbs
@@ -0,0 +1,36 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+<div class="message">
+  {{#if content.downloader.failed}}
+    <i class="fa fa-lg fa-exclamation-circle"></i>
+    Error downloading data!
+  {{else}}
+    <i class="fa fa-lg fa-spinner fa-spin"></i>
+    Downloading data for dag: <b>{{content.dag.entityID}}</b>
+  {{/if}}
+</div>
+
+
+<div class="form-actions">
+  {{#if content.downloader.failed}}
+    <button type="button" class="btn btn-primary" data-dismiss="modal" aria-label="Close">Ok</button>
+  {{else}}
+    <button type="button" class="btn" data-dismiss="modal" aria-label="Close" {{action "cancel"}}>Cancel</button>
+  {{/if}}
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag.hbs b/tez-ui/src/main/webapp/app/templates/dag.hbs
index 93af52e..8906371 100644
--- a/tez-ui/src/main/webapp/app/templates/dag.hbs
+++ b/tez-ui/src/main/webapp/app/templates/dag.hbs
@@ -16,21 +16,5 @@
  * limitations under the License.
 }}
 
-<ul class="breadcrumb">
-  <li>{{#link-to 'application'}}<i class="fa fa-home"> All DAGs</i>{{/link-to}} <span class="divider"></span></li>
-  <li class="active">DAG [ {{name}} ]</li>
-</ul>
-
-{{#unless loading}}
-  <div class='type-table fill-full margin-small'>
-    <div class='pill-container align-right'>
-      {{bs-pills contentBinding='childDisplayViews' selectedBinding='childDisplayViewSelected' size='lg'}}
-    </div>
-
-  </div>
-  <div class='margin-small-vertical'>
-    {{outlet}}
-  </div>
-{{else}}
-  {{partial 'partials/loading-spinner'}}
-{{/unless}}
+{{tab-n-refresh tabs=tabs loadTime=loadTime autoRefreshEnabled=polling.active}}
+{{outlet}}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/attempts.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/attempts.hbs b/tez-ui/src/main/webapp/app/templates/dag/attempts.hbs
new file mode 100644
index 0000000..d36678a
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/dag/attempts.hbs
@@ -0,0 +1,37 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if loaded}}
+  {{em-table
+    columns=visibleColumns
+    rows=model
+
+    headerComponentNames=headerComponentNames
+
+    definition=definition
+
+    searchAction="searchChanged"
+    sortAction="sortChanged"
+    rowAction="rowCountChanged"
+    pageAction="pageChanged"
+
+    rowsChanged="rowsChanged"
+  }}
+{{else}}
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/counters.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/counters.hbs b/tez-ui/src/main/webapp/app/templates/dag/counters.hbs
new file mode 100644
index 0000000..649cfe2
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/dag/counters.hbs
@@ -0,0 +1,34 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if loaded}}
+  {{em-table
+  columns=columns
+  rows=counters
+
+  rowCount=countersCount
+  definition=definition
+
+  enablePagination=false
+
+  searchAction="searchChanged"
+  sortAction="sortChanged"
+  }}
+{{else}}
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/graphical.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/graphical.hbs b/tez-ui/src/main/webapp/app/templates/dag/graphical.hbs
new file mode 100644
index 0000000..1b4e110
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/dag/graphical.hbs
@@ -0,0 +1,32 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if loaded}}
+  <br/>
+  <div id="graphical-view-component-container">
+    {{em-tgraph
+      data=viewData
+      vertexProperties=visibleColumns
+      entityClicked='entityClicked'
+      configure='openColumnSelector'
+    }}
+    <div class="dag-view-legend">Refresh updates only the tooltip values. When sources & sinks are hidden, double click green bubble to toggle visibility locally.</div>
+  </div>
+{{else}}
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/index.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/index.hbs b/tez-ui/src/main/webapp/app/templates/dag/index.hbs
index c287584..9bc6a80 100644
--- a/tez-ui/src/main/webapp/app/templates/dag/index.hbs
+++ b/tez-ui/src/main/webapp/app/templates/dag/index.hbs
@@ -1,136 +1,100 @@
 {{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
 }}
 
-<div class="margin-small-vertical">
-  {{load-time-component
-    isRefreshable=isRefreshable
-    time=timeStamp
-    refresh='refresh'
-  }}
-</div>
-<div class='type-table fill-full margin-small-horizontal'>
-  <div class='align-left'>
-    <table class='detail-list'>
-       <thead>
-         <tr>
-            <th colspan=2>DAG Details</th>
-         </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td colspan="2">
-            {{bs-button icon="fa fa-download" title="Download data" type="info" clicked="downloadDagJson"}}
-          </td>
-        </tr>
-        <tr>
-          <td>{{t 'common.applicationId'}}</td>
-          <td>
-            {{#if controllers.dag.enableAppIdLink}}
-              {{#link-to 'tez-app' applicationId class='ember-table-content'}}{{applicationId}}{{/link-to}}
-            {{else}}
-              <span class='ember-table-content'>{{applicationId}}</span>
-            {{/if}}
-          </td>
-        </tr>
-        <tr>
-          <td>{{t 'common.id'}}</td>
-          <td>{{id}}</td>
-        </tr>
-        <tr>
-          <td>{{t 'common.user'}}</td>
-          <td>{{user}}</td>
-        </tr>
-        <tr>
-          <td>{{t 'common.status'}}</td>
-          <td>
-            <i {{bind-attr class=':task-status taskIconStatus'}}></i> {{status}}
-            {{#if progressStr}} {{bs-badge content=progressStr}}{{/if}}
-            {{#if hasFailedTasks}}
-              [ <a href='{{unbound failedTasksLink}}'>Failed Tasks</a> ]
-            {{/if}}
-            {{#if hasFailedTaskAttempts}}
-              [ <a href='{{unbound failedTaskAttemptsLink}}'>Failed TaskAttempts</a> ]
-            {{/if}}
-          </td>
-        </tr>
-        <tr>
-          <td>{{t 'common.time.start'}}</td>
-          <td>{{formatUnixTimestamp startTime}}</td>
-        </tr>
-        <tr>
-          <td>{{t 'common.time.end'}}</td>
-          <td>{{formatUnixTimestamp endTime}}</td>
-        </tr>
-        <tr>
-          <td>{{t 'common.time.duration'}}</td>
-          <td>{{formatDuration startTime endTime}}</td>
-        </tr>
-        <tr>
-          <td>Logs</td>
-              <td>
-            {{#each log in containerLogs}}
-              <a target="_blank" a href='{{unbound log.containerLog}}'>{{log.id}}</a>
-            {{else}}
-              <span class="message">Not Available!</span>
-            {{/each}}
-              </td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
-</div>
+{{#if loaded}}
+  <table class='detail-list'>
+    <thead>
+      <tr>
+        <th colspan=2>Details</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td colspan="2">
+          {{bs-button icon="fa fa-download" title="Download data" defaultText="Download data" type="info" action="downloadDagJson"}}
+        </td>
+      </tr>
+      <tr>
+        <td>Application ID</td>
+        <td>
+          {{#link-to 'app' model.appID class='ember-table-content'}}
+            {{model.appID}}
+          {{/link-to}}
+        </td>
+      </tr>
+      <tr>
+        <td>ID</td>
+        <td>{{model.entityID}}</td>
+      </tr>
+      <tr>
+        <td>Name</td>
+        <td>{{model.name}}</td>
+      </tr>
+      <tr>
+        <td>Submitter</td>
+        <td>{{model.submitter}}</td>
+      </tr>
+      <tr>
+        <td>Status</td>
+        <td>{{em-table-status-cell content=model.status}}</td>
+      </tr>
+      <tr>
+        <td>Progress</td>
+        <td>{{em-table-progress-cell content=model.progress}}</td>
+      </tr>
+      <tr>
+        <td>Start Time</td>
+        <td>{{date-formatter content=model.startTime}}</td>
+      </tr>
+      <tr>
+        <td>End Time</td>
+        <td>{{date-formatter content=model.endTime}}</td>
+      </tr>
+      <tr>
+        <td>Duration</td>
+        <td>{{txt model.duration type="duration"}}</td>
+      </tr>
+      <tr>
+        <td>Logs</td>
+        <td>
+          {{em-table-linked-cell content=model.containerLogs}}
+        </td>
+      </tr>
+    </tbody>
+  </table>
 
-{{#if data.content}}
-  <br/>
-  <h4>DAG Progress
-    {{#if progressDetails}}
-      ( Vertices {{progressDetails.completedVertices}}/{{data.length}} )
-      {{#if progressDetails.totalTasks}}
-        ( Tasks {{progressDetails.succeededTasks}}/{{progressDetails.totalTasks}} )
-      {{/if}}
-      :
-      {{progressStr}}
-    {{/if}}
-  </h4>
-  {{bs-progress-animated progressDecimal=progress}}
+  {{#if model.callerInfo}}
+    {{caller-info type=model.callerType info=model.callerInfo}}
+  {{/if}}
 
-  {{basic-table-component
-    columns=defaultColumnConfigs
-    rows=data.content
-    rowCount=data.content.length
+  {{#if model.diagnostics}}
+    <div class="panel panel-danger">
+      <div class="panel-heading">
+        Diagnostics
+      </div>
+      <div class="diagnostics">
+        {{{model.diagnostics}}}
+      </div>
+    </div>
+  {{/if}}
 
-    enableStatus=false
-    enableSort=true
-  }}
-{{/if}}
-
-{{#if diagnostics}}
-  <div class="margin-small-vertical">
-    {{#bs-panel heading="Diagnostics" collapsible=false dismiss=false type='danger'}}
-      {{formatDiagnostics diagnostics}}
-    {{/bs-panel}}
-  </div>
-{{/if}}
+  {{outlet}}
 
-{{#if appContext}}
-  <div class='margin-small-vertical code-mirror-container'>
-    {{#bs-panel heading=appContextHeading collapsible=false dismiss=false type='info'}}
-      {{code-mirror value=appContext mode=appInfoContextType classNames='additional-dag-info'}}
-    {{/bs-panel}}
-  </div>
+{{else}}
+  {{partial "loading"}}
 {{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/index/index.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/index/index.hbs b/tez-ui/src/main/webapp/app/templates/dag/index/index.hbs
new file mode 100644
index 0000000..c6864fb
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/dag/index/index.hbs
@@ -0,0 +1,81 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if loaded}}
+  <table class='detail-list'>
+    <thead>
+    <tr>
+      <th colspan=2>Stats</th>
+    </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td>Succeeded Vertices</td>
+        <td>{{stats-link value=stats.succeededVertices routeName="dag.vertices" statsType="SUCCEEDED"}}</td>
+      </tr>
+      <tr>
+        <td>Total Vertices</td>
+        <td>{{stats.totalVertices}}</td>
+      </tr>
+      <tr>
+        <td>Succeeded Tasks</td>
+        <td>{{stats-link value=stats.succeededTasks routeName="dag.tasks" statsType="SUCCEEDED"}}</td>
+      </tr>
+      <tr>
+        <td>Total Tasks</td>
+        <td>{{stats.totalTasks}}</td>
+      </tr>
+      <tr>
+        <td>Failed Tasks</td>
+        <td>{{stats-link value=stats.failedTasks routeName="dag.tasks" statsType="FAILED"}}</td>
+      </tr>
+      <tr>
+        <td>Killed Tasks</td>
+        <td>{{stats-link value=stats.killedTasks routeName="dag.tasks" statsType="KILLED"}}</td>
+      </tr>
+      <tr>
+        <td>Failed Task Attempts</td>
+        <td>{{stats-link value=stats.failedTaskAttempts routeName="dag.attempts" statsType="FAILED"}}</td>
+      </tr>
+      <tr>
+        <td>Killed Task Attempts</td>
+        <td>{{stats-link value=stats.killedTaskAttempts routeName="dag.attempts" statsType="KILLED"}}</td>
+      </tr>
+    </tbody>
+  </table>
+
+  {{em-table
+  columns=visibleColumns
+  rows=model
+
+  definition=definition
+
+  enableSearch=false
+  enablePagination=false
+
+  rowCount=model.length
+  searchAction="searchChanged"
+  sortAction="sortChanged"
+  rowAction="rowCountChanged"
+  pageAction="pageChanged"
+
+  rowsChanged="rowsChanged"
+  }}
+{{else}}
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/swimlane.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/swimlane.hbs b/tez-ui/src/main/webapp/app/templates/dag/swimlane.hbs
new file mode 100644
index 0000000..7c50e81
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/dag/swimlane.hbs
@@ -0,0 +1,42 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if loaded}}
+  <div class="swimlane-page">
+    <div class="button-panel">
+      <div class="zoom-range">
+        {{zoom}}%
+        {{input type="range" value=zoom min=100 max=1000}}
+      </div>
+      <i class='fa fa-cog fa-border' {{action 'openColumnSelector'}} title="Customize vertex tooltip"></i>
+      <i class='fa fa-expand fa-border' {{action 'toggleFullscreen'}} title="Toggle fullscreen"></i>
+      <i class='fa fa-compress fa-border' {{action 'toggleFullscreen'}} title="Toggle fullscreen"></i>
+    </div>
+
+    {{em-swimlane
+      columns=visibleColumns
+      processes=processes
+      nameComponent="em-swimlane-vertex-name"
+      zoom=zoom
+      click="click"
+      consolidate=true
+    }}
+  </div>
+{{else}}
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/tasks.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/tasks.hbs b/tez-ui/src/main/webapp/app/templates/dag/tasks.hbs
new file mode 100644
index 0000000..d36678a
--- /dev/null
+++ b/tez-ui/src/main/webapp/app/templates/dag/tasks.hbs
@@ -0,0 +1,37 @@
+{{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+
+{{#if loaded}}
+  {{em-table
+    columns=visibleColumns
+    rows=model
+
+    headerComponentNames=headerComponentNames
+
+    definition=definition
+
+    searchAction="searchChanged"
+    sortAction="sortChanged"
+    rowAction="rowCountChanged"
+    pageAction="pageChanged"
+
+    rowsChanged="rowsChanged"
+  }}
+{{else}}
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/vertices.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/vertices.hbs b/tez-ui/src/main/webapp/app/templates/dag/vertices.hbs
index 28a4305..d36678a 100644
--- a/tez-ui/src/main/webapp/app/templates/dag/vertices.hbs
+++ b/tez-ui/src/main/webapp/app/templates/dag/vertices.hbs
@@ -1,49 +1,37 @@
 {{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
 }}
 
-{{#unless loading}}
-  <div class='margin-small'>
-    <span class="left-divider align-right">
-      <i {{bind-attr class=':fa-action :fa-cog'}} {{action 'selectColumns'}}></i>
-    </span>
-    <span class='align-right'>
-      {{page-nav-component
-        hasPrev=hasPrev
-        hasNext=hasNext
-        navNext='navigateNext'
-        navPrev='navigatePrev'
-        navFirst='navigateFirst'
-      }}
-    </span>
-    <div class='align-clear'> </div>
-  </div>
+{{#if loaded}}
+  {{em-table
+    columns=visibleColumns
+    rows=model
 
-  <div class='table-container'>
-  {{extended-table-component
-    hasFooter=false
-    enableContentSelection=true
-    columnsBinding="columns"
-    contentBinding="sortedContent"
-    forceFillColumns=true
-    hasFilter=true
-    onFilterUpdated='filterUpdated'
+    headerComponentNames=headerComponentNames
+
+    definition=definition
+
+    searchAction="searchChanged"
+    sortAction="sortChanged"
+    rowAction="rowCountChanged"
+    pageAction="pageChanged"
+
+    rowsChanged="rowsChanged"
   }}
-  </div>
 {{else}}
-  {{partial 'partials/loading-spinner'}}
-{{/unless}}
\ No newline at end of file
+  {{partial "loading"}}
+{{/if}}

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dag/view.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dag/view.hbs b/tez-ui/src/main/webapp/app/templates/dag/view.hbs
deleted file mode 100644
index 9c5e2e4..0000000
--- a/tez-ui/src/main/webapp/app/templates/dag/view.hbs
+++ /dev/null
@@ -1,38 +0,0 @@
-{{!
-* Licensed to the Apache Software Foundation (ASF) under one
-* or more contributor license agreements.  See the NOTICE file
-* distributed with this work for additional information
-* regarding copyright ownership.  The ASF licenses this file
-* to you under the Apache License, Version 2.0 (the
-* "License"); you may not use this file except in compliance
-* with the License.  You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-}}
-
-<div {{bind-attr class=":margin-small-vertical loading:no-visible"}}>
-  {{load-time-component
-    isRefreshable=isRefreshable
-    time=data.content.0.timeStamp
-    refresh='refresh'
-  }}
-</div>
-<div class="dag-view-component-container">
-  {{#unless loading}}
-    {{dag-view-component
-      data=viewData
-      vertexProperties=columns
-      entityClicked='entityClicked'
-      configure='selectColumns'
-    }}
-    <div class="dag-view-legend">When sources & sinks are hidden, double click green bubble to toggle visibility locally.</div>
-  {{else}}
-    {{partial 'partials/loading-spinner'}}
-  {{/unless}}
-</div>

http://git-wip-us.apache.org/repos/asf/tez/blob/13132ec7/tez-ui/src/main/webapp/app/templates/dags.hbs
----------------------------------------------------------------------
diff --git a/tez-ui/src/main/webapp/app/templates/dags.hbs b/tez-ui/src/main/webapp/app/templates/dags.hbs
index 373ac0e..d2e35de 100644
--- a/tez-ui/src/main/webapp/app/templates/dags.hbs
+++ b/tez-ui/src/main/webapp/app/templates/dags.hbs
@@ -16,104 +16,27 @@
  * limitations under the License.
 }}
 
-<ul class="breadcrumb">
-  <li>{{#link-to 'application'}}<i class="fa fa-home"> All DAGs</i>{{/link-to}} <span class="divider"></span></li>
-</ul>
+{{tab-n-refresh tabs=tabs autoRefreshVisible=false loadTime=loadTime}}
 
-<div class='margin-small-vertical'>
-  {{#unless loading}}
-    {{load-time-component
-      isRefreshable=isRefreshable
-      time=sortedContent.0.timeStamp
-      refresh='refresh'
-    }}
-    <div class='dag-header'>
-      <div class="align-children-left">
-        {{#if visibleFilters.dagName}}
-          <div class='filter-elements'>
-            <div>Dag Name</div>
-            {{input
-              action="filterUpdated"
-              value=boundFilterValues.dagName
-              placeholder="Search..."
-            }}
-          </div>
-        {{/if}}
-        {{#if visibleFilters.id}}
-          <div class='filter-elements'>
-            <div>Id</div>
-            {{input
-              action="filterUpdated"
-              value=boundFilterValues.id
-              placeholder="Search..."
-            }}
-          </div>
-        {{/if}}
-        {{#if visibleFilters.user}}
-          <div class='filter-elements'>
-            <div>Submitter</div>
-            {{input
-              action="filterUpdated"
-              value=boundFilterValues.user
-              placeholder="Search..."
-            }}
-          </div>
-        {{/if}}
-        {{#if visibleFilters.status}}
-          <div class='filter-elements'>
-            <div>Status</div>
-            {{view App.Dropdown
-              optionValuePath='content.id'
-              optionLabelPath='content.label'
-              classNames='inline-display'
-              action='filterUpdated'
-              content=App.Helpers.misc.dagStatusUIOptions
-              value=boundFilterValues.status
-            }}
-          </div>
-        {{/if}}
-        {{#if visibleFilters.appId}}
-          <div class='filter-elements'>
-            <div>Application ID</div>
-            {{input
-              action="filterUpdated"
-              value=boundFilterValues.appId
-              placeholder="Search..."
-            }}
-          </div>
-        {{/if}}
-        {{#if visibleFilters.callerId}}
-          <div class='filter-elements'>
-            <div>Context ID (Hive Query ID or Pig Script ID)</div>
-            {{input
-              action="filterUpdated"
-              value=boundFilterValues.callerId
-              placeholder="Search..."
-            }}
-          </div>
-        {{/if}}
-      </div><div class="align-children-right">
-        {{view App.BasicTableComponent.PaginationView
-          pageNum=page
-          totalPages=lastPage
-          hideLast=true
-        }}
-        <i {{bind-attr class=':fa-action :fa-cog :left-divider'}} {{action 'selectColumns'}}></i>
-      </div>
-    </div>
-    {{basic-table-component
-      columns=columns
-      rows=sortedContent
+{{#if loaded}}
+  {{em-table
+    columns=visibleColumns
+    rows=model
+    rowCount=rowCount
 
-      rowCountBinding='rowCount'
+    classNames="all-dags-table"
 
-      statusMessage=statusMessage
-    }}
-  {{else}}
-    {{partial 'partials/loading-spinner'}}
-    <div class="text-align-center">
-      {{statusMessage}}
-    </div>
-  {{/unless}}
+    headerComponentNames=headerComponentNames
 
-</div>
+    definition=definition
+    enableSort=false
+
+    rowAction="rowCountChanged"
+
+    search="search"
+    loadPage="loadPage"
+    reload="reload"
+  }}
+{{else}}
+  {{partial "loading"}}
+{{/if}}