Return-Path: 
 <commits-return-1633-apmail-falcon-commits-archive=falcon.apache.org@falcon.apache.org>
X-Original-To: apmail-falcon-commits-archive@minotaur.apache.org
Delivered-To: apmail-falcon-commits-archive@minotaur.apache.org
Received: from mail.apache.org (hermes.apache.org [140.211.11.3])
	by minotaur.apache.org (Postfix) with SMTP id 2AC15188DC
	for <apmail-falcon-commits-archive@minotaur.apache.org>;
 Tue, 13 Oct 2015 00:03:55 +0000 (UTC)
Received: (qmail 25767 invoked by uid 500); 13 Oct 2015 00:03:55 -0000
Delivered-To: apmail-falcon-commits-archive@falcon.apache.org
Received: (qmail 25671 invoked by uid 500); 13 Oct 2015 00:03:55 -0000
Mailing-List: contact commits-help@falcon.apache.org; run by ezmlm
Precedence: bulk
List-Help: <mailto:commits-help@falcon.apache.org>
List-Unsubscribe: <mailto:commits-unsubscribe@falcon.apache.org>
List-Post: <mailto:commits@falcon.apache.org>
List-Id: <commits.falcon.apache.org>
Reply-To: dev@falcon.apache.org
Delivered-To: mailing list commits@falcon.apache.org
Received: (qmail 25284 invoked by uid 99); 13 Oct 2015 00:03:54 -0000
Received: from git1-us-west.apache.org (HELO git1-us-west.apache.org)
 (140.211.11.23)
    by apache.org (qpsmtpd/0.29) with ESMTP; Tue, 13 Oct 2015 00:03:54 +0000
Received: by git1-us-west.apache.org (ASF Mail Server at
 git1-us-west.apache.org, from userid 33)
	id 4DBC1E09E6; Tue, 13 Oct 2015 00:03:54 +0000 (UTC)
Content-Type: text/plain; charset="us-ascii"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
From: sowmya_kr@apache.org
To: commits@falcon.apache.org
Date: Tue, 13 Oct 2015 00:04:05 -0000
Message-Id: <34d7a66e6a954479b75e961bcf62c19f@git.apache.org>
In-Reply-To: <63df3cab2cfa4f5c88ed350ed916ecc7@git.apache.org>
References: <63df3cab2cfa4f5c88ed350ed916ecc7@git.apache.org>
X-Mailer: ASF-Git Admin Mailer
Subject: [12/22] falcon git commit: FALCON-1315 Update falcon ui for HiveDR,
 secure clusters and bug fixes. Contributed by Armando Reyna/Venkat
 Ranganathan.

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/dataset/datasetFormGeneralStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/dataset/datasetFormGeneralStepTpl.html b/falcon-ui/app/html/dataset/datasetFormGeneralStepTpl.html
new file mode 100644
index 0000000..458a25b
--- /dev/null
+++ b/falcon-ui/app/html/dataset/datasetFormGeneralStepTpl.html
@@ -0,0 +1,718 @@
+<!--
+/**
+ * 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.
+ */
+-->
+<form id="formGeneralBox"
+      name="datasetForm"
+      class="col-xs-24"
+      novalidate>
+
+  <div class="row">
+    <div class="col-xs-24">
+      <label class="db"> Mirror Name
+        <input type="text"
+               name="nameInput"
+               class="form-control"
+               ng-model="UIModel.name"
+               placeholder=""
+               ng-disabled="!cloningMode"
+               ng-pattern="validations.patterns.name"
+               ng-required="true"
+               check-name="{type:'process', check:clone}"/>
+      </label>
+    </div>
+
+    <div class="col-xs-24 tagsBox mt10">
+      <label class="db">Tags
+
+        <div class="row mb10">
+          <div class="col-xs-10">
+            <input type="text"
+                   name="newTagKeyInput"
+                   class="form-control"
+                   ng-model="UIModel.tags.newTag.key"
+                   placeholder="key"
+                   ng-pattern="validations.patterns.alpha"
+                   ng-required="UIModel.tags.newTag.value"
+                   validation-optional-message="{{validations.messages.key}}"/>
+          </div>
+          <div class="col-xs-10">
+            <input type="text"
+                   name="newTagValueInput"
+                   class="form-control"
+                   ng-model="UIModel.tags.newTag.value"
+                   placeholder="value"
+                   ng-pattern="validations.patterns.alpha"
+                   ng-required="UIModel.tags.newTag.key"
+                   validation-optional-message="{{validations.messages.value}}"/>
+          </div>
+          <div class="col-xs-4">
+            <button type="button"
+                    class="btn btn-default btn-xs"
+                    ng-click="addTag()"
+                    ng-disabled="!UIModel.tags.newTag.key || !UIModel.tags.newTag.value"
+                    ng-disabled="false">
+              <span class="glyphicon glyphicon-plus"></span> add tag
+            </button>
+          </div>
+        </div>
+
+        <div ng-repeat="tag in UIModel.tags.tagsArray" class="row">
+          <div class="col-xs-10">
+            <h6>{{tag.key}}</h6>
+          </div>
+          <div class="col-xs-10">
+            <h6>{{tag.value}}</h6>
+          </div>
+          <div class="col-xs-4" ng-if="tag.key !== '_falcon_mirroring_type'">
+            <button type="button"
+                    class="btn btn-default btn-xs"
+                    ng-click="removeTag($index)"
+                    ng-disabled="false">
+              <span class="glyphicon glyphicon-minus"></span> delete
+            </button>
+          </div>
+        </div>
+
+      </label>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-xs-24 mt10">
+      <label class="db">Mirror type
+        <div class="typeButtonsBox">
+          <button type="button"
+                  ng-class="{active:UIModel.formType === 'HDFS'}"
+                  class="btn btn-default btn-xs"
+                  ng-click="switchModel('HDFS')">
+            File System
+          </button>
+          <button type="button"
+                  ng-class="{active:UIModel.formType === 'HIVE'}"
+                  class="btn btn-default btn-xs"
+                  ng-click="switchModel('HIVE')">
+            HIVE(catalog Storage)
+          </button>
+        </div>
+      </label>
+    </div>
+  </div>
+
+  <div class="row">
+    <div class="col-xs-24 clusterBox">
+      <h3>Source</h3>
+      <div class="runJobOnBox">
+        <input type="radio"
+               id="runJobOnSourceRadio"
+               ng-model="UIModel.runOn",
+               value="source"
+               ng-required="true"
+               ng-disabled="UIModel.source.location !== 'HDFS'"/>
+        Run job here
+      </div>
+
+      <div class="locationBox" ng-if="UIModel.formType === 'HDFS'">
+        <label class="db">Location:
+          <span>
+            <input type="radio"
+                   ng-change="checkFromSource()"
+                   id="sourceHDFSRadio"
+                   ng-model="UIModel.source.location"
+                   value="HDFS"
+                   ng-required="!UIModel.source.location"/> HDFS
+          </span>
+          <span ng-if="UIModel.target.location === 'HDFS'">
+            <input type="radio"
+                   ng-change="checkFromSource()"
+                   id="sourceAzureRadio"
+                   ng-model="UIModel.source.location"
+                   value="azure"
+                   ng-required="!UIModel.source.location"/> Azure
+          </span>
+          <span ng-if="UIModel.target.location === 'HDFS'">
+            <input type="radio"
+                   ng-change="checkFromSource()"
+                   id="sourceS3Radio"
+                   ng-model="UIModel.source.location"
+                   value="s3"
+                   ng-required="!UIModel.source.location"/> S3
+          </span>
+
+        </label>
+      </div>
+
+      <div>
+        <select ng-if="UIModel.source.location === 'HDFS' || UIModel.formType === 'HIVE'"
+                ng-model="UIModel.source.cluster"
+                name="sourceClusterSelect"
+                ng-change="getSourceDefinition()"
+                ng-required="UIModel.source.location === 'HDFS' || UIModel.formType === 'HIVE'"
+                class="col-xs-24 form-control"
+                id="sourceClusterSelect">
+
+          <option value="" disabled style='display:none;'>-Select cluster-</option>
+          <option ng-selected="UIModel.source.cluster === cluster.name"
+                  ng-repeat="cluster in clustersList"
+                  value="{{cluster.name}}">
+            {{cluster.name}}
+          </option>
+        </select>
+      </div>
+
+      <div ng-if="UIModel.source.location === 'azure' && UIModel.formType === 'HDFS'">
+        <label class="db">Base URL
+          <input type="text"
+                 name="sourceClusterUrlInput"
+                 class="form-control"
+                 ng-model="UIModel.source.url"
+                 placeholder="URL"
+                 ng-pattern="validations.patterns.azure"
+                 ng-required="UIModel.source.location === 'azure'"
+                 validation-message="{{validations.messages.azure}}" />
+        </label>
+      </div>
+      <div ng-if="UIModel.source.location === 's3' && UIModel.formType === 'HDFS'">
+        <label class="db">Base URL
+          <input type="text"
+                 name="sourceClusterUrlInput"
+                 class="form-control"
+                 ng-model="UIModel.source.url"
+                 placeholder="URL"
+                 ng-pattern="validations.patterns.s3"
+                 ng-required="UIModel.source.location === 's3'"
+                 validation-message="{{validations.messages.s3}}" />
+        </label>
+      </div>
+
+      <div ng-if="UIModel.formType === 'HDFS'">
+        <label class="db">Path
+          <input type="text"
+                 name="sourceClusterPathInput"
+                 class="form-control"
+                 ng-model="UIModel.source.path"
+                 placeholder="Path"
+                 ng-pattern="validations.patterns.osPath"
+                 ng-required="UIModel.source.location === 'HDFS' || UIModel.formType === 'HIVE'"
+                 validation-message="{{validations.messages.path}}"/>
+        </label>
+      </div>
+
+      <div ng-if="UIModel.formType === 'HIVE'">
+        <h5 class="hiveDatabasesTitol">I want to copy</h5>
+        <div class="databaseRadioBox">
+          <input type="radio"
+                 id="targetHIVEDatabaseRadio"
+                 ng-model="UIModel.source.hiveDatabaseType"
+                 value="databases"
+                 ng-required="!UIModel.source.location"/> Entire databases
+          <input type="radio"
+                 id="targetHIVETablesRadio"
+                 ng-model="UIModel.source.hiveDatabaseType"
+                 value="tables"
+                 ng-required="!UIModel.source.hiveDatabaseType"/> Tables in a single database
+        </div>
+
+        <div ng-if="UIModel.source.hiveDatabaseType === 'databases'">
+          <label class="db">Databases (comma separated)
+            <textarea name="sourceDatabasesInput"
+                      class="form-control databasesTextArea"
+                      ng-model="UIModel.source.hiveDatabases"
+                      ng-pattern="validations.patterns.textarea"
+                      ng-required="UIModel.target.location === 'HDFS'"
+                      validation-message="{{validations.messages.databases}}"
+                      ng-keydown="validations.acceptNoSpaces($event)">
+            </textarea>
+          </label>
+        </div>
+        <div ng-if="UIModel.source.hiveDatabaseType === 'tables'">
+          <label class="db">Database
+            <input type="text"
+                   name="sourceDatabaseInput"
+                   class="form-control"
+                   ng-model="UIModel.source.hiveDatabase"
+                   ng-pattern="validations.patterns.textarea"
+                   ng-required="UIModel.target.location === 'HDFS'"
+                   validation-message="{{validations.messages.database}}"
+                   ng-keydown="validations.acceptNoSpaces($event)"/>
+          </label>
+          <label class="db">Tables (comma separated)
+            <textarea name="sourceTablesInput"
+                      class="form-control tablesTextArea"
+                      ng-model="UIModel.source.hiveTables"
+                      ng-pattern="validations.patterns.textarea"
+                      ng-required="UIModel.target.location === 'HDFS'"
+                      validation-message="{{validations.messages.tables}}"
+                      ng-keydown="validations.acceptNoSpaces($event)">
+            </textarea>
+          </label>
+        </div>
+      </div>
+
+    </div>
+
+    <div class="col-xs-24 clusterBox">
+      <h3>Target</h3>
+      <div class="runJobOnBox">
+        <input type="radio"
+               id="runJobOnTargetRadio"
+               ng-model="UIModel.runOn"
+               value="target"
+               ng-required="true"
+               ng-disabled="UIModel.target.location !== 'HDFS'"/>
+        Run job here
+      </div>
+
+      <div class="locationBox" ng-if="UIModel.formType === 'HDFS'">
+        <label class="db">Location:
+
+          <input type="radio"
+                 ng-change="checkFromTarget()"
+                 id="targetHDFSRadio"
+                 ng-model="UIModel.target.location"
+                 value="HDFS"
+                 ng-required="!UIModel.target.location"/> HDFS
+          <span ng-if="UIModel.source.location === 'HDFS'">
+            <input type="radio"
+                   ng-change="checkFromTarget()"
+                   id="targetAzureRadio"
+                   ng-model="UIModel.target.location"
+                   value="azure"
+                   ng-required="!UIModel.target.location"/> Azure
+          </span>
+          <span ng-if="UIModel.source.location === 'HDFS'">
+            <input type="radio"
+                   ng-change="checkFromTarget()"
+                   id="targetS3Radio"
+                   ng-model="UIModel.target.location"
+                   value="S3"
+                   ng-required="!UIModel.target.location"/> S3
+          </span>
+        </label>
+      </div>
+
+      <div>
+        <select ng-if="UIModel.target.location === 'HDFS' || UIModel.formType === 'HIVE'"
+                ng-model="UIModel.target.cluster"
+                ng-change="getTargetDefinition()"
+                name="targetClusterSelect"
+                ng-required="UIModel.target.location === 'HDFS' || UIModel.formType === 'HIVE'"
+                class="col-xs-24 form-control"
+                id="targetClusterSelect">
+          <option value="" disabled selected style='display:none;'>-Select cluster-</option>
+          <option ng-selected="UIModel.target.cluster === clusterItem.name"
+                  ng-repeat="clusterItem in clustersList"
+                  value="{{clusterItem.name}}">
+            {{clusterItem.name}}
+          </option>
+        </select>
+      </div>
+
+      <div ng-if="UIModel.target.location === 'azure' && UIModel.formType === 'HDFS'">
+        <label class="db">Base URL
+          <input type="text"
+                 name="targetClusterUrlInput"
+                 class="form-control"
+                 ng-model="UIModel.target.url"
+                 placeholder="URL"
+                 ng-pattern="validations.patterns.azure"
+                 ng-required="UIModel.target.location === 'azure'"
+                 validation-message="{{validations.messages.azure}}"/>
+        </label>
+      </div>
+      <div ng-if="UIModel.target.location === 'S3' && UIModel.formType === 'HDFS'">
+        <label class="db">Base URL
+          <input type="text"
+                 name="targetClusterUrlInput"
+                 class="form-control"
+                 ng-model="UIModel.target.url"
+                 placeholder="URL"
+                 ng-pattern="validations.patterns.s3"
+                 ng-required="UIModel.target.location === 'S3'"
+                 validation-message="{{validations.messages.s3}}"/>
+        </label>
+      </div>
+
+      <div ng-if="UIModel.formType === 'HDFS'">
+        <label class="db">Path
+          <input type="text"
+                 name="targetClusterPathInput"
+                 class="form-control"
+                 ng-model="UIModel.target.path"
+                 placeholder="Path"
+                 ng-pattern="validations.patterns.osPath"
+                 ng-required="UIModel.target.location === 'HDFS'"
+                 validation-message="{{validations.messages.path}}"/>
+        </label>
+      </div>
+
+    </div>
+  </div>
+
+  <div class="row">
+    <div class="col-xs-24 validityBox">
+      <h4>Validity </h4>
+      <div class="startDateBox">
+        <label>Start
+          <input type="text"
+                 name="startDateInput"
+                 class="form-control dateInput"
+                 placeholder="mm/dd/yyyy"
+                 datepicker-popup="{{dateFormat}}"
+                 ng-model="UIModel.validity.start"
+                 is-open="$parent.startOpened"
+                 ng-click="openStartDatePicker($event)"
+                 ng-change="constructDate()"
+                 ng-required="true"
+                 simple-date>
+        </label>
+      </div>
+      <div class="startTimeBox">
+        <label>Time
+          <timepicker ng-change="constructDate()"
+                      ng-model="UIModel.validity.startTime"
+                      hour-step="1"
+                      minute-step="1"
+                      show-meridian="true">
+          </timepicker>
+        </label>
+      </div>
+      <div class="endDateBox">
+        <label>End
+          <input type="text"
+                 name="startDateInput"
+                 class="form-control dateInput"
+                 placeholder="mm/dd/yyyy"
+                 datepicker-popup="{{dateFormat}}"
+                 ng-model="UIModel.validity.end"
+                 is-open="$parent.endOpened"
+                 ng-click="openEndDatePicker($event)"
+                 ng-change="constructDate()"
+                 min-date="UIModel.validity.start"
+                 ng-required="true"
+                 simple-date>
+        </label>
+      </div>
+      <div class="endTimeBox">
+        <label>Time
+          <timepicker ng-change="constructDate()"
+                      ng-model="UIModel.validity.endTime"
+                      hour-step="1"
+                      minute-step="1"
+                      show-meridian="true">
+          </timepicker>
+        </label>
+      </div>
+      <div class="tzBox">
+        <label> &nbsp;
+          <time-zone-select
+                  ng-model="UIModel.validity.tz"
+                  class="">
+          </time-zone-select>
+          </label>
+      </div>
+    </div>
+  </div>
+
+  <div class="row">
+    <div class="col-xs-24 alertsBox">
+      <div class="emailBox">
+        <label>
+          <h4>Send alerts to </h4>
+          <input class="form-control"
+                 name="emailAlertInput"
+                 ng-model="UIModel.alerts.alert.email"
+                 type="text"
+                 placeholder="Email"
+                 ng-pattern="validations.patterns.email"
+                 validation-optional-message="{{validations.messages.email}}">
+        </label>
+      </div>
+      <div class="addAlertBox">
+        <button class="btn btn-default btn-xs"
+                ng-disabled="!UIModel.alerts.alert.email"
+                type="button"
+                ng-click="addAlert()">
+          <span class="glyphicon glyphicon-plus"></span>add alert
+        </button>
+      </div>
+
+      <div class="emailArrayRow" ng-repeat="email in UIModel.alerts.alertsArray">
+        <span>{{email}}</span>
+        <button class="btn btn-default btn-xs"
+                type="button"
+                ng-click="removeAlert()">
+          <span class="glyphicon glyphicon-minus"></span> delete
+        </button>
+      </div>
+
+    </div>
+  </div>
+
+  <div class="row advancedOptionsButton" ng-click="expandOptions = !expandOptions">
+    <h4>Advanced options
+      <span class="entypo chevron-down" ng-if="!expandOptions"></span>
+      <span class="entypo chevron-up" ng-if="expandOptions"></span>
+      <hr />
+    </h4>
+  </div>
+
+  <div id="advancedOptionsBox" ng-class="{expanded:expandOptions}">
+    <div class="frequencyBox">
+      <h4>Frequency</h4>
+      <label>Every</label>
+      <input type="text"
+             name="frequencyEveryInput"
+             ng-model="UIModel.frequency.number"
+             ng-pattern="validations.patterns.twoDigits"
+             ng-keydown="validations.acceptOnlyNumber($event)"
+             class="form-control"
+             validation-optional-message="{{validations.messages.number}}" />
+
+      <select ng-model="UIModel.frequency.unit" class="form-control">
+        <option selected value="minutes">minutes</option>
+        <option value="hours">hours</option>
+        <option value="days">days</option>
+        <option value="months">months</option>
+      </select>
+    </div>
+
+    <div class="allocationBox">
+      <h4>Allocation</h4>
+
+      <div ng-if="UIModel.formType === 'HDFS'">
+        <div>
+          <label>Max Maps for Distcp
+            <input type="text"
+                   name="maxMapsInput"
+                   ng-model="UIModel.allocation.hdfs.maxMaps"
+                   ng-pattern="validations.patterns.number"
+                   ng-keydown="validations.acceptOnlyNumber($event)"
+                   class="form-control"
+                   validation-optional-message="{{validations.messages.allocationNumber}}"/>
+          </label>
+        </div>
+        <div>
+          <label>Max bandwidth (MB)
+            <input type="text"
+                   name="maxBandwidthInput"
+                   ng-model="UIModel.allocation.hdfs.maxBandwidth"
+                   ng-pattern="validations.patterns.number"
+                   ng-keydown="validations.acceptOnlyNumber($event)"
+                   class="form-control"
+                   validation-optional-message="{{validations.messages.allocationNumber}}" />
+          </label>
+        </div>
+      </div>
+
+      <div ng-if="UIModel.formType === 'HIVE'">
+        <div>
+          <label>Max Maps for Distcp
+            <input type="text"
+                   name="hiveMaxMapsInput"
+                   ng-model="UIModel.allocation.hive.maxMapsDistcp"
+                   ng-pattern="validations.patterns.number"
+                   ng-keydown="validations.acceptOnlyNumber($event)"
+                   class="form-control"
+                   validation-optional-message="{{validations.messages.allocationNumber}}"/>
+          </label>
+        </div>
+        <div>
+          <label>Max Maps for Mirror
+            <input type="text"
+                   name="maxBandwidthInput"
+                   ng-model="UIModel.allocation.hive.maxMapsMirror"
+                   ng-pattern="validations.patterns.number"
+                   ng-keydown="validations.acceptOnlyNumber($event)"
+                   class="form-control"
+                   validation-optional-message="{{validations.messages.allocationNumber}}" />
+          </label>
+        </div>
+        <div>
+          <label>Max Events
+            <input type="text"
+                   name="maxMapsEventsInput"
+                   ng-model="UIModel.allocation.hive.maxMapsEvents"
+                   ng-pattern="validations.patterns.number"
+                   ng-keydown="validations.acceptOnlyNumber($event)"
+                   class="form-control"
+                   validation-optional-message="{{validations.messages.allocationNumber}}" />
+          </label>
+        </div>
+        <div>
+          <label>Max bandwidth (MB)
+            <input type="text"
+                   name="maxBandwidthInput"
+                   ng-model="UIModel.allocation.hive.maxBandwidth"
+                   ng-pattern="validations.patterns.number"
+                   ng-keydown="validations.acceptOnlyNumber($event)"
+                   class="form-control"
+                   validation-optional-message="{{validations.messages.allocationNumber}}" />
+          </label>
+        </div>
+      </div>
+
+    </div>
+
+    <div class="hiveOptBox" ng-if="UIModel.formType === 'HIVE'">
+      <h4>Source</h4>
+
+      <label>Staging path
+        <input type="text"
+               name="sourceStagingPathInput"
+               ng-model="UIModel.hiveOptions.source.stagingPath"
+               ng-pattern="validations.patterns.path"
+               class="form-control"
+               validation-optional-message="{{validations.messages.path}}" />
+      </label>
+      <label>HiveServer2 endpoint
+        <input type="text"
+               name="sourceHiveServerInput"
+               ng-model="UIModel.hiveOptions.source.hiveServerToEndpoint"
+               ng-pattern="validations.patterns.path"
+               class="form-control"
+               validation-optional-message="{{validations.messages.path}}" />
+      </label>
+
+      <h4>Target</h4>
+      <label>Staging path
+        <input type="text"
+               name="targetStagingPathInput"
+               ng-model="UIModel.hiveOptions.target.stagingPath"
+               ng-pattern="validations.patterns.path"
+               class="form-control"
+               validation-optional-message="{{validations.messages.path}}" />
+      </label>
+      <label>HiveServer2 endpoint
+        <input type="text"
+               name="targetHiveServerInput"
+               ng-model="UIModel.hiveOptions.target.hiveServerToEndpoint"
+               ng-pattern="validations.patterns.path"
+               class="form-control"
+               validation-optional-message="{{validations.messages.path}}" />
+      </label>
+    </div>
+
+    <div class="retryBox">
+      <h4>Retry</h4>
+
+      <div class="policyBox">
+        <label>Policy</label>
+        <select ng-model="UIModel.retry.policy"
+                class="form-control">
+          <option selected value="periodic">PERIODIC</option>
+          <option value="exp-backoff">EXPONENTIAL_BACKOFF</option>
+          <option value="final">FINAL</option>
+        </select>
+      </div>
+
+      <div>
+        <label>Delay</label>
+        <input type="text"
+               name="frequencyEveryInput"
+               ng-model="UIModel.retry.delay.number"
+               ng-pattern="validations.patterns.twoDigits"
+               ng-keydown="validations.acceptOnlyNumber($event)"
+               class="form-control"
+               validation-optional-message="{{validations.messages.number}}" />
+
+        <select ng-model="UIModel.retry.delay.unit"
+                class="form-control">
+          <option selected value="minutes">minutes</option>
+          <option value="hours">hours</option>
+          <option value="days">days</option>
+          <option value="months">months</option>
+        </select>
+      </div>
+
+      <div>
+        <label>Attempts</label>
+        <input type="text"
+               name="frequencyEveryInput"
+               ng-model="UIModel.retry.attempts"
+               ng-pattern="validations.patterns.twoDigits"
+               ng-keydown="validations.acceptOnlyNumber($event)"
+               class="form-control"
+               validation-optional-message="{{validations.messages.number}}" />
+      </div>
+    </div>
+
+    <div class="aclBox col-xs-24">
+      <h4>Access Control List</h4>
+      <div class="col-xs-8">
+        <label>Owner
+          <input type="text"
+                 name="aclOwnerInput"
+                 ng-model="UIModel.acl.owner"
+                 ng-pattern="validations.patterns.unixId"
+                 class="form-control"
+                 ng-required="true"
+                 validation-message="{{validations.messages.acl.owner}}"/>
+        </label>
+      </div>
+      <div class="col-xs-8">
+        <label>Group
+          <input type="text"
+                 name="aclGroupInput"
+                 ng-model="UIModel.acl.group"
+                 ng-pattern="validations.patterns.unixId"
+                 class="form-control"
+                 ng-required="true"
+                 validation-message="{{validations.messages.acl.group}}" />
+        </label>
+      </div>
+      <div class="col-xs-8">
+        <label>Permissions
+          <input type="text"
+                 name="aclPermissionsInput"
+                 ng-model="UIModel.acl.permissions"
+                 ng-pattern="validations.patterns.unixPermissions"
+                 class="form-control"
+                 ng-required="true"
+                 validation-message="{{validations.messages.acl.permission}}" />
+        </label>
+      </div>
+    </div>
+
+
+
+
+
+  </div>
+
+
+  <div class="row">
+    <div class="col-xs-24 mt20">
+
+      <button class="btn nextBtn pull-right"
+              ng-disabled="buttonSpinners.show"
+              ng-click="goNext(datasetForm.$invalid, 'forms.dataset.summary')" >
+        Next <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+      </button>
+      <a class="pull-right" ui-sref="main">
+        Cancel
+      </a>
+
+    </div>
+  </div>
+
+
+
+
+
+
+</form>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/dataset/datasetFormSummaryStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/dataset/datasetFormSummaryStepTpl.html b/falcon-ui/app/html/dataset/datasetFormSummaryStepTpl.html
new file mode 100644
index 0000000..6d73af5
--- /dev/null
+++ b/falcon-ui/app/html/dataset/datasetFormSummaryStepTpl.html
@@ -0,0 +1,146 @@
+<!--
+/**
+ * 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 id="formSummaryBox" class="col-xs-24">
+  <div>
+    <h4 class="lightSubtitle">Name</h4>
+    {{UIModel.name}}
+  </div>
+  <div>
+    <h4 class="lightSubtitle">Type</h4>
+    {{UIModel.formType}}
+  </div>
+  <div>
+    <h4 class="lightSubtitle">Tags</h4>
+    <div ng-repeat="tag in UIModel.tags.tagsArray"><span>{{tag.key}}</span> - {{tag.value}}</div>
+  </div>
+
+  <div>
+    <h4 class="lightSubtitle">Source</h4>
+  </div>
+  <div class="box">
+    <h3 ng-if="UIModel.formType === 'HIVE' || UIModel.source.location === 'HDFS'">{{UIModel.source.cluster}}</h3>
+
+    <h4 ng-if="UIModel.formType === 'HDFS'">Location</h4>
+    <div ng-if="UIModel.formType === 'HDFS'">{{UIModel.source.location}}</div>
+    <div ng-if="UIModel.formType === 'HDFS'"><span>Path:</span> {{UIModel.source.path}}</div>
+    <div ng-if="UIModel.formType === 'HDFS' && UIModel.source.location !== 'HDFS'"><span>URL:</span>{{UIModel.source.url}}</div>
+
+
+
+
+
+    <div ng-if="UIModel.formType === 'HIVE'">I want to copy <span>{{UIModel.source.hiveDatabaseType}}</span></div>
+    <div ng-if="UIModel.formType === 'HIVE' && UIModel.source.hiveDatabaseType === 'databases'"><span>Databases:</span> {{UIModel.source.hiveDatabases}}</div>
+    <div ng-if="UIModel.formType === 'HIVE' && UIModel.source.hiveDatabaseType === 'tables'"><span>From Database </span>{{UIModel.source.hiveDatabase}}</div>
+    <div ng-if="UIModel.formType === 'HIVE' && UIModel.source.hiveDatabaseType === 'tables'"><span>Tables:</span> {{UIModel.source.hiveTables}}</div>
+
+
+
+
+  </div>
+  <div>
+    <h4 class="lightSubtitle">Target</h4>
+  </div>
+  <div class="box">
+    <h3 ng-if="(UIModel.formType === 'HDFS' && UIModel.target.location === 'HDFS') || UIModel.formType === 'HIVE'">{{UIModel.target.cluster}}</h3>
+
+    <h4 ng-if="UIModel.formType === 'HDFS'">Location</h4>
+    <div ng-if="UIModel.formType === 'HDFS'">{{UIModel.target.location}}</div>
+    <div ng-if="UIModel.formType === 'HDFS'"><span>Path:</span> {{UIModel.target.path}}</div>
+    <div ng-if="UIModel.formType === 'HDFS' && UIModel.target.location !== 'HDFS'"><span>URL:</span> {{UIModel.target.url}}</div>
+
+  </div>
+
+  <div>
+    <h4 class="lightSubtitle">Run On</h4>
+    <div ng-if="UIModel.runOn === 'source'">{{UIModel.source.cluster}}</div>
+    <div ng-if="UIModel.runOn === 'target'">{{UIModel.target.cluster}}</div>
+  </div>
+
+  <hr />
+
+  <div>
+    <h4 class="lightSubtitle">Schedule</h4>
+    <span>Start on: </span>{{UIModel.validity.startISO}} <br />
+    <span>End on: </span>{{UIModel.validity.endISO}}
+  </div>
+
+  <div ng-if="UIModel.formType === 'HDFS'">
+    <h4 class="lightSubtitle">Max Maps</h4>
+    {{UIModel.allocation.hdfs.maxMaps}}
+
+    <h4 class="lightSubtitle">Max Bandwidth</h4>
+    {{UIModel.allocation.hdfs.maxBandwidth}}
+  </div>
+  <div ng-if="UIModel.formType === 'HIVE'">
+
+    <h4 class="lightSubtitle">Max Maps for Distcp</h4>
+    {{UIModel.allocation.hive.maxMapsDistcp}}
+
+    <h4 class="lightSubtitle">Max Bandwidth</h4>
+    {{UIModel.allocation.hive.maxBandwidth}}
+
+    <h4 class="lightSubtitle">Max Events</h4>
+    {{UIModel.allocation.hive.maxMapsEvents}}
+
+    <h4 class="lightSubtitle">Max Maps for mirror</h4>
+    {{UIModel.allocation.hive.maxMapsMirror}}
+  </div>
+
+  <div>
+    <h4 ng-if="UIModel.alerts.alertsArray.length > 0" class="lightSubtitle">Alerts</h4>
+    {{ UIModel.alerts.alertsArray.join() }}
+  </div>
+
+  <hr />
+  <h4 class="lightSubtitle">ACL</h4>
+  <div><span>Owner:</span> {{UIModel.acl.owner}}</div>
+  <div><span>Group:</span> {{UIModel.acl.group}}</div>
+  <div><span>Permissions:</span> {{UIModel.acl.permissions}}</div>
+
+  <h4 class="lightSubtitle">Retry</h4>
+  <div><span>Policy: </span> {{UIModel.retry.policy}}</div>
+  <div><span>delay: </span> {{UIModel.retry.delay.number}} {{UIModel.retry.delay.unit}}</div>
+  <div><span>Attempts: </span> {{UIModel.retry.attempts}}</div>
+
+  <h4 class="lightSubtitle">Frequency</h4>
+  <div>{{UIModel.frequency.number}} {{UIModel.frequency.unit}}</div>
+
+  <hr />
+
+  <div class="row">
+    <div class="col-xs-24 mt20">
+      <button type="button" class="btn prevBtn"
+              ng-click="goBack('forms.dataset.general')"
+              ng-disabled="buttonSpinners.backShow">
+        Previous <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow" />
+      </button>
+      <button class="btn nextBtn pull-right"
+              ng-disabled="buttonSpinners.show"
+              ng-click="save()">
+        Save <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+      </button>
+      <a class="pull-right" ui-sref="main">
+        Cancel
+      </a>
+    </div>
+  </div>
+
+</div>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/dataset/datasetFormTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/dataset/datasetFormTpl.html b/falcon-ui/app/html/dataset/datasetFormTpl.html
new file mode 100644
index 0000000..d471d40
--- /dev/null
+++ b/falcon-ui/app/html/dataset/datasetFormTpl.html
@@ -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 id="formBox">
+  <div class="formTitol">
+    <a>Falcon Mirrors</a>
+    <h1>New Mirror</h1>
+  </div>
+
+  <div class="col-sm-24">
+    <div class="formBoxWrapper">
+
+      <div class="progressBox col-xs-24" ng-class="{ general:isActive('forms.dataset.general'),
+                                                 summary:isActive('forms.dataset.summary')}">
+        <div class="progressBar">
+          <div class="bar1"></div>
+          <span>
+            <div class="fir">
+              <b>1</b>
+              <span class="glyphicon glyphicon-ok"></span>
+              <h6>General</h6>
+            </div>
+          </span>
+          <span>
+            <div class="sec">
+              <b>2</b>
+              <span class="glyphicon glyphicon-ok"></span>
+              <h6>Summary</h6>
+            </div>
+          </span>
+        </div>
+      </div>
+
+      <div class="row" ui-view></div>
+    </div>
+  </div>
+
+  <div class="col-sm-24">
+
+  </div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/autocomplete-template.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/autocomplete-template.html b/falcon-ui/app/html/directives/autocomplete-template.html
new file mode 100644
index 0000000..4f49d84
--- /dev/null
+++ b/falcon-ui/app/html/directives/autocomplete-template.html
@@ -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="tags-wrapper">
+  <div id="tagsList" class="tags-cloud">
+    <div ng-repeat="selectedTag in selectedTags" class="tag">
+      <span class="tagName">{{selectedTag}}</span>
+      <span>&nbsp;<b ng-click="removeTag($index)" class="fa fa-times cross"></b></span>
+    </div>
+    <input type="text" placeholder="Start typing a programming language name" id="searchInput" ng-keydown="checkKeyDown($event)" class="form-control" ng-model="searchText" ng-change="search()"/>
+  </div>
+  <ul id="suggestions" class="suggestions-list">
+    <li ng-repeat="suggestion in suggestions" class="blockSpan" ng-click="addToSelectedTags($index)" ng-mouseover="$parent.selectedIndex=$index" ng-class="{active : selectedIndex===$index}">{{suggestion}}</li>
+  </ul>
+</div>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/dependenciesGraphDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/dependenciesGraphDv.html b/falcon-ui/app/html/directives/dependenciesGraphDv.html
new file mode 100644
index 0000000..7fbba06
--- /dev/null
+++ b/falcon-ui/app/html/directives/dependenciesGraphDv.html
@@ -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.
+ */
+-->
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/entitiesListDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/entitiesListDv.html b/falcon-ui/app/html/directives/entitiesListDv.html
index 6ac950f..7016de1 100644
--- a/falcon-ui/app/html/directives/entitiesListDv.html
+++ b/falcon-ui/app/html/directives/entitiesListDv.html
@@ -17,82 +17,91 @@
  * limitations under the License.
  */
 -->
-<table class="listTable table">
+<table class="listTable table" id="entitiesList">
   <thead>
-    
+
     <tr>
       <th colspan="3">
-        <div class="filtersBox">Name <input type="text" class="form-control" ng-model="simpleFilter.name"/></div> 
-       
-        <div class="filtersBox">Tags <input type="text" class="form-control" ng-model="simpleFilter.tags"/></div> 
-      
-        <div ng-if="type !== 'cluster'" class="filtersSelectBox">Status 
-          
+        <div class="filtersBox" ng-class="{clusterFilters: type === 'cluster'}">Name <input type="text" class="form-control" ng-model="simpleFilter.name"/></div>
+
+        <div class="filtersBox" ng-class="{clusterFilters: type === 'cluster'}">Tags <input type="text" class="form-control" ng-model="simpleFilter.tags"/></div>
+
+        <div ng-if="type !== 'cluster'" class="filtersSelectBox">Status
+
           <select class="form-control" ng-model="simpleFilter.status">
             <option value="" selected="true">ALL</option>
             <option>SUBMITTED</option>
             <option>RUNNING</option>
             <option>SUSPENDED</option>
-            <option>UNKNOWN</option>           
+            <option>UNKNOWN</option>
           </select>
-     
+
         </div>
-      
+
       </th>
     </tr>
   </thead>
   <tbody>
-    
+
     <tr ng-if="input.length > 0" class="buttonsRow">
       <td class="buttonCell" colspan="4">
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="scopeSchedule()" ng-hide="selectedDisabledButtons.schedule" ng-if="type !== 'cluster'">
-            <span class="entypo play"></span> Schedule
+            <span class="entypo play"></span> <div>Schedule</div>
         </div>
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="scopeResume()" ng-hide="selectedDisabledButtons.resume" ng-if="type !== 'cluster'">
-            <span class="entypo play"></span> Resume
+            <span class="entypo play"></span> <div>Resume</div>
         </div>
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="scopeSuspend()" ng-hide="selectedDisabledButtons.suspend" ng-if="type !== 'cluster'">
-            <span class="entypo paus"></span> Suspend
+            <span class="entypo paus"></span> <div>Suspend</div>
         </div>
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="scopeEdit()" ng-hide="selectedRows.length === 0 || selectedRows.length > 1" ng-if="type !== 'cluster'">
-            <span class="entypo cog"></span> Edit
+            <span class="entypo cog"></span> <div>Edit</div>
         </div>
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="scopeClone()" ng-hide="selectedRows.length === 0 || selectedRows.length > 1">
-            <span class="entypo docs"></span> Copy
+            <span class="entypo docs"></span> <div>Copy</div>
         </div>
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="scopeRemove()" ng-hide="selectedRows.length === 0">
-            <span class="entypo trash"></span> Delete
+            <span class="entypo trash"></span> <div>Delete</div>
         </div>
         <div class="btn btn-default btn-xs buttons-to-show" ng-click="download()" ng-hide="selectedRows.length === 0 || selectedRows.length > 1">
-            <span class="entypo down"></span> Download XML
+            <span class="entypo down"></span> <div>XML</div>
         </div>
       </td>
-    </tr> 
+    </tr>
     <tr ng-if="input.length === 0 && !server.responses.listLoaded[type]">
       <td> loading {{ type }}s </td>
     </tr>
     <tr ng-if="input.length === 0 && server.responses.listLoaded[type]">
       <td> There are no {{ type }}s </td>
     </tr>
-    <tr ng-if="input.length !== 0" ng-repeat="item in input | filter:{'name':simpleFilter.name} | filter:{'status':simpleFilter.status} | tagFilter | filter:{'list':simpleFilter.tags}" class="entityRow">
+    <tr ng-if="input.length !== 0"
+          ng-repeat="item in input | filter:{'name':simpleFilter.name} | filter:{'status':simpleFilter.status} |
+                       tagFilter | filter:{'list':simpleFilter.tags}"
+          class="entityRow"
+          ng-class="{
+            firstEntityRow:$first, lastEntityRow:$last,
+            rowSelected:checkedRow(item.name)
+          }">
       <td class="checkboxCell">
-          <input type="checkbox" checklist-model="selectedRows" checklist-value="{name:item.name, type:item.type, status:item.status}" ng-change="checkButtonsToShow()"/>
+          <input type="checkbox" checklist-model="selectedRows" ng-model="$index"
+                 checklist-value="{name:item.name, type:item.type, status:item.status}"
+                 ng-change="checkButtonsToShow()"/>
       </td>
-      <td class="nameCell" ng-click="goEntityDetails(item.name, type)">
+      <td class="nameCell" ng-click="goEntityDefinition(item.name, type)">
           {{ item.name }}
       </td>
       <td class="stateCell">
           <span ng-if="type !== 'cluster'" ng-class="{'text-success': item.status === 'RUNNING', 'text-warning': item.status === 'SUSPENDED', 'text-danger': item.status === 'UNKNOWN'}">{{ item.status }}</span>
       </td>
-      
+
     </tr>
     <tr>
       <td ng-if="server.responses.multiRequest[type] > 0 || server.responses.listLoaded[type] === false">
-        <div class="spinner" ng-class="{active: server.responses.multiRequest[type] > 0 || server.responses.listLoaded[type] === false}"> 
+        <div class="spinner" ng-class="{active: server.responses.multiRequest[type] > 0 || server.responses.listLoaded[type] === false}">
           <img src="css/img/ajax-loader.gif" />
         </div>
       </td>
     </tr>
   </tbody>
-  
+
 </table>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/entitiesSearchListDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/entitiesSearchListDv.html b/falcon-ui/app/html/directives/entitiesSearchListDv.html
new file mode 100644
index 0000000..3e356fc
--- /dev/null
+++ b/falcon-ui/app/html/directives/entitiesSearchListDv.html
@@ -0,0 +1,128 @@
+<!--
+/**
+ * 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="listTable table" id="entitiesSearchList">
+  <thead>
+    <tr>
+      <th><div class="filtersSearchBox"><input type="checkbox" ng-model="selectedAll" ng-click="checkAll()"/></div></th>
+      <th><div class="filtersSearchBox pointer" ng-click="toggleSortOrder()">Name <span class="glyphicon glyphicon-sort"></span></div> </th>
+      <th><div class="filtersSearchBox">Tags</div></th>
+      <th><div class="filtersSearchBox">Cluster</div></th>
+      <th><div class="filtersSearchBox">Type</div></th>
+      <th><div class="filtersSearchBox">Status</div></th>
+    </tr>
+  </thead>
+
+  <tbody>
+    <tr ng-if="input.length > 0" class="buttonsRow">
+      <td class="buttonCell" colspan="9">
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeSchedule()" ng-disabled="selectedDisabledButtons.schedule">
+          <span class="entypo play"></span> <div>Schedule</div>
+        </div>
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeResume()" ng-disabled="selectedDisabledButtons.resume">
+          <span class="entypo play"></span> <div>Resume</div>
+        </div>
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeSuspend()" ng-disabled="selectedDisabledButtons.suspend">
+          <span class="entypo paus"></span> <div>Suspend</div>
+        </div>
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeEdit()" ng-disabled="selectedRows.length === 0 || selectedRows.length > 1">
+          <span class="entypo cog"></span> <div>Edit</div>
+        </div>
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeClone()" ng-disabled="selectedRows.length === 0 || selectedRows.length > 1">
+          <span class="entypo docs"></span> <div>Copy</div>
+        </div>
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeRemove()" ng-disabled="selectedRows.length === 0">
+          <span class="entypo trash"></span> <div>Delete</div>
+        </div>
+        <div class="btn btn-gray btn-xs buttons-to-show" ng-click="download()" ng-disabled="selectedRows.length === 0 || selectedRows.length > 1">
+          <span class="entypo down"></span> <div>XML</div>
+        </div>
+      </td>
+    </tr>
+
+    <tr ng-if="input.length === 0 && !server.responses.listLoaded">
+      <td> loading... </td>
+    </tr>
+    <tr ng-if="input.length === 0 && server.responses.listLoaded">
+      <td> There are no results </td>
+    </tr>
+
+    <tr ng-if="input.length !== 0"
+        ng-repeat="item in input | filter:{'name':simpleFilter.name} | filter:{'status':simpleFilter.status} |
+                          filter:{'list':simpleFilter.tags}"
+        class="entityRow"
+        ng-class="{
+              firstEntityRow:$first, lastEntityRow:$last,
+              rowSelected:checkedRow(item.name)
+            }">
+      <td class="checkboxCell">
+        <input type="checkbox" checklist-model="selectedRows" ng-model="$index"
+               checklist-value="{name:item.name, type:item.type, status:item.status}"
+               ng-change="checkButtonsToShow()"/>
+      </td>
+      <td class="nameCell" ng-init="entityType = item.type | uppercase">
+        <button type="button" class="btn btn-default" ng-click="goEntityDetails(item.name, item.type)">
+          <span ng-class="displayIcon((item.type | uppercase), item.tags.tag)"></span> {{ item.name }}
+        </button>
+      </td>
+      <td>
+        <span ng-repeat="tag in item.tags.tag" ng-click="addTag(tag)" class="tag">
+          {{ tag }}{{$last ? '' : ', '}}
+        </span>
+      </td>
+      <td>
+        <span ng-repeat="cluster in item.clusters.cluster">
+          {{ cluster }}{{$last ? '' : ', '}}
+        </span>
+      </td>
+      <td>
+        <span ng-repeat="tag in item.tags.tag" ng-init="type = displayType(tag)">
+          {{ type | uppercase}}
+        </span>
+      </td>
+      <td class="stateCell">
+        <span ng-class="{'blink-success': item.status == 'RUNNING',
+                         'text-success': item.status == 'SUCCEEDED',
+                         'blink-warning': item.status == 'SUSPENDED',
+                         'blink-danger': item.status == 'UNKNOWN'}">{{ item.status }}</span>
+      </td>
+    </tr>
+
+    <tr>
+      <td ng-if="server.responses.multiRequest[type] > 0 || server.responses.count.pending > 0">
+        <div class="spinner" ng-class="{active: server.responses.multiRequest[type] > 0 || server.responses.count.pending > 0}">
+          <img src="css/img/ajax-loader_2.gif" />
+        </div>
+      </td>
+    </tr>
+
+    <tr>
+      <td colspan="9">
+        <nav class="pull-right">
+          <ul class="pagination">
+            <li ng-repeat="page in pages"><a href="javascript:void(0);" ng-click="page.enabled ? scopeGoPage(page.index) : void(0)" ng-class="page.enabled ? '' : 'pagDisabled'">{{ page.label }}</a></li>
+          </ul>
+        </nav>
+      </td>
+    </tr>
+  </tbody>
+
+</table>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/entitySummaryDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/entitySummaryDv.html b/falcon-ui/app/html/directives/entitySummaryDv.html
index c64074b..6cd10f5 100644
--- a/falcon-ui/app/html/directives/entitySummaryDv.html
+++ b/falcon-ui/app/html/directives/entitySummaryDv.html
@@ -17,26 +17,31 @@
  * limitations under the License.
  */
 -->
-<div class="row entitySummary">
+<div class="row entitySummary" id="entitySummary">
 
-  <div class="col-xs-6">     
-    <h3>{{statusCount.TOTAL_AMOUNT}}</h3>   
-    <h5>Submitted</h5>      
+  <div class="whiteBox col-xs-6">
+    <div>
+      <h3>{{statusCount.TOTAL_AMOUNT}}</h3>
+      <h5 class="notBold">Total</h5>
+    </div>
   </div>
-  
-  <div class="col-xs-6 text-success" ng-if="type !== 'cluster'">     
-    <h3>{{statusCount.RUNNING}}</h3>   
-    <h5>Running</h5>      
-  </div>
-  
-  <div class="col-xs-6 text-warning" ng-if="type !== 'cluster'">     
-    <h3>{{statusCount.SUSPENDED}}</h3>   
-    <h5>Suspended</h5>      
+
+
+  <div class="whiteBox col-xs-16 pull-right" ng-if="type !== 'cluster'">
+    <div class="col-xs-8 text-success">
+      <h3>{{statusCount.RUNNING}}</h3>
+      <h5>RUNNING</h5>
+    </div>
+
+    <div class="col-xs-8 text-warning">
+      <h3>{{statusCount.SUSPENDED}}</h3>
+      <h5>SUSPENDED</h5>
+    </div>
+
+    <div class="col-xs-8 text-danger">
+      <h3>{{statusCount.UNKNOWN}}</h3>
+      <h5>UNKNOWN</h5>
+    </div>
   </div>
-  
-  <div class="col-xs-6 text-danger" ng-if="type !== 'cluster'">     
-    <h3>{{statusCount.UNKNOWN}}</h3>   
-    <h5>Unknown</h5>      
-  </div> 
-    
+
 </div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/instancesListDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/instancesListDv.html b/falcon-ui/app/html/directives/instancesListDv.html
new file mode 100644
index 0000000..5abc9d3
--- /dev/null
+++ b/falcon-ui/app/html/directives/instancesListDv.html
@@ -0,0 +1,148 @@
+<!--
+/**
+ * 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="listTable table" id="instancesList">
+  <thead>
+  <tr>
+    <th><div class="filtersSearchBox vertical-align"><input type="checkbox" ng-model="selectedAll" ng-click="checkAll()"/></div></th>
+    <th><div class="filtersSearchBox vertical-align">Instance</div></th>
+    <th><div class="filtersSearchBox">Started&nbsp;<span class="glyphicon glyphicon-sort pointer" ng-click="filterInstances('startTime')"></span>
+      <input type="text" class="form-control dateInput" ng-model="startFilter" ng-keypress="validateDate($event, 'start');"
+             ng-enter="filterInstances('startTime')" placeholder="mm/dd/yyyy hh:mm">
+      <label class="error" ng-if="startFilterError">Incorrect Date Format</label>
+      <label class="error" ng-if="startAfterEndError">Start date should be before end date</label>
+      <label class="error" ng-if="startAfterNominalError">Start date should be after nominal start date {{ start }}</label>
+      <label class="error" ng-if="startBeforeNominalError">Start date should be before nominal end date {{ end }}</label>
+    </div></th>
+    <th><div class="filtersSearchBox">Ended&nbsp;<span class="glyphicon glyphicon-sort pointer" ng-click="filterInstances('endTime')"></span>
+      <input type="text" class="form-control dateInput" ng-model="endFilter" ng-keypress="validateDate($event, 'end');"
+             ng-enter="filterInstances('endTime')" placeholder="mm/dd/yyyy hh:mm">
+      <label class="error" ng-if="endFilterError">Incorrect Date Format</label>
+      <label class="error" ng-if="endAfterNominalError">End date should be after nominal start date {{ start }}</label>
+      <label class="error" ng-if="endBeforeNominalError">End date should be before nominal end date {{ end }}</label>
+    </div></th>
+    <th>
+      <div class="filtersSearchBox">Status&nbsp;<span class="glyphicon glyphicon-sort pointer" ng-click="filterInstances('status')"></span>
+        <select class="form-control padding0" ng-model="statusFilter" ng-change="filterInstances('startTime')">
+          <option value="">ALL</option>
+          <option value="RUNNING">RUNNING</option>
+          <option value="SUCCEEDED">SUCCEEDED</option>
+          <option value="SUSPENDED">SUSPENDED</option>
+          <option value="WAITING">WAITING</option>
+          <option value="KILLED">KILLED</option>
+        </select>
+      </div>
+    </th>
+  </tr>
+  </thead>
+
+  <tbody>
+  <tr ng-if="input.length > 0" class="buttonsRow">
+    <td class="buttonCell" colspan="9">
+      <div class="btn btn-gray btn-xs buttons-to-show" ng-click="download()" ng-disabled="selectedRows.length === 0 || selectedRows.length > 1">
+        <span class="entypo down"></span> <div>Log</div>
+      </div>
+      <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeResume()" ng-disabled="selectedDisabledButtons.resume">
+        <span class="entypo play"></span> <div>Resume</div>
+      </div>
+      <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeRerun()" ng-disabled="selectedDisabledButtons.rerun">
+        <span class="entypo play"></span> <div>Rerun</div>
+      </div>
+      <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeSuspend()" ng-disabled="selectedDisabledButtons.suspend">
+        <span class="entypo paus"></span> <div>Suspend</div>
+      </div>
+      <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeKill()" ng-disabled="selectedDisabledButtons.stop">
+        <span class="entypo stop"></span> <div>Kill</div>
+      </div>
+    </td>
+  </tr>
+  <tr ng-if="input.length < 1" class="buttonsRow">
+    <td class="buttonCell" colspan="9">
+      <div ng-if="" class="btn btn-gray btn-xs buttons-to-show" ng-click="scopeSchedule()" ng-disabled="selectedDisabledButtons.schedule">
+        <span class="entypo play"></span> <div>Schedule</div>
+      </div>
+    </td>
+  </tr>
+
+  <tr ng-if="input.length === 0 && !server.responses.listLoaded">
+    <td> loading... </td>
+  </tr>
+  <tr ng-if="input.length === 0 && server.responses.listLoaded">
+    <td> There are no results </td>
+  </tr>
+
+  <tr ng-if="input.length !== 0"
+      ng-repeat="item in input"
+      class="entityRow"
+      ng-class="{
+              firstEntityRow:$first, lastEntityRow:$last,
+              rowSelected:checkedRow(item.instance)
+            }">
+    <td class="checkboxCell">
+      <input type="checkbox" checklist-model="selectedRows" ng-model="$index"
+             checklist-value="{'instance':item.instance, 'startTime':item.startTime, 'endTime':item.endTime, 'status':item.status, 'type':type, 'logFile':item.logFile}"
+             ng-change="checkButtonsToShow()"/>
+    </td>
+    <td class="nameCell">
+      <button type="button" class="btn btn-default" ng-click="goInstanceDetails(item)">
+        {{ item.instance }}
+      </button>
+    </td>
+    <td>
+      <!--{{ item.startTime }}<br/>-->
+      <!--{{ item.startTime | date :'yyyy-MM-ddTHH:mm:ssZ' }}<br/>-->
+      {{ item.startTime | date :'MM/dd/yyyy HH:mm'}}
+    </td>
+    <td>
+      {{ item.endTime | date :'MM/dd/yyyy HH:mm'}}
+    </td>
+    <td class="stateCell">
+      <span ng-class="{
+      'blink-success': item.status == 'RUNNING',
+      'text-success': item.status == 'SUCCEEDED',
+      'blink-warning': item.status == 'WAITING' || item.status == 'UNKNOWN',
+      'blink-danger': item.status == 'SUSPENDED',
+      'text-danger': item.status == 'FAILED' || item.status == 'KILLED',
+      }">{{ item.status }}</span>
+    </td>
+
+  </tr>
+  <tr>
+    <td ng-if="server.responses.multiRequest[type] > 0 || server.responses.listLoaded[type] === false">
+      <div class="spinner" ng-class="{active: server.responses.multiRequest[type] > 0 || server.responses.listLoaded[type] === false}">
+        <img src="css/img/ajax-loader.gif" />
+      </div>
+    </td>
+  </tr>
+
+  <tr>
+    <td colspan="5">
+      <nav class="pull-right">
+        <ul class="pagination">
+          <li ng-show="prevPages"><a href="javascript:void(0);" ng-click="scopePrevOffset(0)"> < </a></li>
+          <li ng-repeat="page in pages" ng-show="page.show"><a href="javascript:void(0);" ng-click="page.enabled ? scopeGoPage(page.index) : void(0)" ng-class="page.enabled ? '' : 'pagDisabled'">{{ page.label }}</a></li>
+          <li ng-show="nextPages"><a href="javascript:void(0);" ng-click="scopeNextOffset(0)"> > </a></li>
+        </ul>
+      </nav>
+    </td>
+  </tr>
+
+  </tbody>
+
+</table>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/lineageGraphDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/lineageGraphDv.html b/falcon-ui/app/html/directives/lineageGraphDv.html
new file mode 100644
index 0000000..93a2896
--- /dev/null
+++ b/falcon-ui/app/html/directives/lineageGraphDv.html
@@ -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 id="lineageGraph">
+  <h4><small>Legends</small></h4>
+  <ul class="lineage-legend">
+    <li class="lineage-legend-feed-inst">Feed instance</li>
+    <li class="lineage-legend-feed-inst lineage-legend-terminal">Feed instance (terminal)</li>
+    <li class="lineage-legend-process-inst">Process instance</li>
+    <li class="lineage-legend-process-inst lineage-legend-terminal">Process instance (terminal)</li>
+  </ul>
+</div>
+<div>
+  <center>
+    <svg id="lineage-graph"></svg>
+  </center>
+</div>
+<div>
+  <div id="lineage-info-panel"></div>
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/navDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/navDv.html b/falcon-ui/app/html/directives/navDv.html
index ad1223d..63046f6 100644
--- a/falcon-ui/app/html/directives/navDv.html
+++ b/falcon-ui/app/html/directives/navDv.html
@@ -18,33 +18,83 @@
  */
 -->
 <nav class="col-sm-24 navbar navbar-default" role="navigation">
-  <div class="navbar">
-
-      <h1 class="navbar-header" ui-sref="main">
-        <img src="css/img/falcon.png" /> Falcon
+  <div class="col-sm-offset-1 col-sm-22">
+    <button class="logoTitle" ui-sref="main">
+      <h1 class="navbar-header">
+        <span class="falconLogo"></span> <span>Falcon</span>
       </h1>
+    </button>
 
-      <div class="createNavWrapper">
+      <div class="createNavWrapper" ng-show="userLogged()">
         <h4>Create an entity</h4>
-        <div ng-click="resetCluster()">
-          <span class="entypo archive"></span> Cluster
-        </div>
-        <div ng-click="resetFeed()">
-          <span class="entypo download"></span> Feed
-        </div>
-        <div id="createProcessButton" ng-click="resetProcess()">
-          <span class="entypo cycle"></span> Process
-        </div>
+        <button type="button"
+                id="cluster.create"
+                ng-click="resetCluster()"
+                ng-disabled="isInForm('cluster')"
+                ng-class="{disabled:isInForm('cluster')}">
+          <span class="entypo archive"></span> <span>Cluster</span>
+        </button>
+        <button type="button"
+                id="feed.create"
+                ng-click="resetFeed()"
+                ng-disabled="isInForm('feed')"
+                ng-class="{disabled:isInForm('feed')}">
+          <span class="entypo download"></span> <span>Feed</span>
+        </button>
+        <button type="button"
+                id="process.create"
+                ng-click="resetProcess()"
+                ng-disabled="isInForm('process')"
+                ng-class="{disabled:isInForm('process')}">
+          <span class="entypo cycle"></span> <span>Process</span>
+        </button>
+        <button type="button"
+                id="dataset.create"
+                ng-click="resetDataset()"
+                ng-disabled="isInForm('dataset')"
+                ng-class="{disabled:isInForm('dataset')}">
+          <span class="glyphicon glyphicon-duplicate"></span> <span>Mirror</span>
+        </button>
       </div>
 
-      <div class="uploadNavWrapper">
-        <h4>Upload an entity</h4>
-        <div class="btn-file">
-          <span class="entypo up"></span>
-          <input type="file" id="files" name="files[]" multiple fileinput-change="handleFile" ng-model="fileJson">
-          Browse for the XML file
-        </div>
+    <div class="uploadNavWrapper" ng-show="userLogged()">
+      <h4>Upload an entity</h4>
+      <div class="btn-file" ng-class="{fakeFocus: fake.focus}">
+        <span class="entypo up"></span>
+        <input type="file"
+               id="files"
+               ng-focus="fake.focus = true"
+               ng-blur="fake.focus = false"
+               name="files[]"
+               multiple
+               fileinput-change="handleFile"
+               ng-model="fileJson">
+        <span>Browse for the XML file</span>
+      </div>
+    </div>
+
+    <div class="loginHeaderBox">
+      <div ng-show="userLogged()">
+        <span class="user"></span> <div><strong>{{userToken}}</strong></div>
       </div>
-      
+
+      <button ng-show="userLogged() && !ambariView() && !isSecureMode()" ng-click="logOut()" ng-class="responses.unreaded > 0 ? 'logoutBT' : ''">
+        <span class="glyphicon glyphicon-log-out header-icon"></span> <div><strong class="pointer">Logout</strong></div>
+      </button>
+
+      <button ng-click="notify()" ng-blur="hideNotifs()" class="no-outline">
+        <span class="badge badge-notify" ng-show="responses.unreaded > 0">{{ responses.unreaded }}</span>
+        <span class="glyphicon glyphicon-bell bell-notif header-icon"></span>
+        <strong class="pointer">Notifications</strong>
+        <div class="notifications">
+          <server-messages></server-messages>
+        </div>
+      </button>
+
+      <a href="http://hortonworks.com/hadoop/falcon/">
+        <span class="glyphicon glyphicon-question-sign header-icon"></span> <div>Help</div>
+      </a>
+    </div>
+
   </div>
 </nav>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/notify.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/notify.html b/falcon-ui/app/html/directives/notify.html
new file mode 100644
index 0000000..795753a
--- /dev/null
+++ b/falcon-ui/app/html/directives/notify.html
@@ -0,0 +1,35 @@
+<!--
+/**
+ * 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="messagesArrow"></div>
+<div class="messages">
+  <div ng-repeat="message in server.responses.queue | limitTo: -1" class="message"
+       ng-class="{ 'color-warning' : message.type === 'warning' || message.type === 'cancel',
+                    'color-success' : message.type === 'success',
+                     'color-danger' : message.type === 'error' }">
+
+    <span class="glyphicon icon-notif"
+          ng-class="{ 'glyphicon-warning-sign' : message.type === 'warning' || message.type === 'cancel',
+          'glyphicon-ok' : message.type === 'success' }"></span>
+
+    {{ message.message }}
+    <a class="color-warning" ng-if="message.type === 'cancel'" ng-click="restore(message.state)">UNDO</a>
+
+  </div>
+</div>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/serverMessagesDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/serverMessagesDv.html b/falcon-ui/app/html/directives/serverMessagesDv.html
index df4e20c..dd5a2a2 100644
--- a/falcon-ui/app/html/directives/serverMessagesDv.html
+++ b/falcon-ui/app/html/directives/serverMessagesDv.html
@@ -17,15 +17,37 @@
  * limitations under the License.
  */
 -->
-<div class="col-xs-24 messages-to-show" ng-show="server.responses.display">
-    
-    <div ng-repeat="message in server.responses.queue" class="alert repeat-animation" 
-      ng-class="{'bg-success': message.success, 'bg-danger': !message.success}">
-      
-      <span ng-class="{'text-success': message.success, 'text-danger': !message.success}">{{ message.status }}</span> 
-      {{ message.message }} 
-      <div class="entypo cross" ng-class="{'text-success': message.success, 'text-danger': !message.success}" ng-click="closeAlert($index)"></div>
-      
-    </div> 
-</div>
 
+<div class="messagesArrow notifs" ng-show="server.responses.queue.length > 0"></div>
+<div class="messages notifs">
+
+  <div ng-show="server.responses.showAll" ng-repeat="message in server.responses.queue | reverse" class="message"
+      ng-class="{ 'color-warning' : message.type === 'warning' || message.type === 'cancel',
+                    'color-success' : message.type === 'success',
+                    'color-danger' : message.type === 'error',
+                    'unreaded-notif' : !message.readed }">
+
+    <span class="glyphicon icon-notif"
+          ng-class="{ 'glyphicon-warning-sign' : message.type === 'warning' || message.type === 'cancel' || message.type === 'error',
+          'glyphicon-ok' : message.type === 'success' }"></span>
+
+    {{ message.message }}
+    <a class="color-warning" ng-if="message.type === 'cancel'" ng-click="restore(message.state)">UNDO</a>
+
+  </div>
+
+  <div ng-show="!server.responses.showAll" ng-repeat="message in server.responses.queue | limitTo: -1" class="message"
+       ng-class="{ 'color-warning' : message.type === 'warning' || message.type === 'cancel',
+                    'color-success' : message.type === 'success',
+                    'color-danger' : message.type === 'error' }">
+
+    <span class="glyphicon icon-notif"
+          ng-class="{ 'glyphicon-warning-sign' : message.type === 'warning' || message.type === 'cancel' || message.type === 'error',
+          'glyphicon-ok' : message.type === 'success' }"></span>
+
+    {{ message.message }}
+    <a class="color-warning" ng-if="message.type === 'cancel'" ng-click="restore(message.state)">UNDO</a>
+
+  </div>
+
+</div>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/tags-input.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/tags-input.html b/falcon-ui/app/html/directives/tags-input.html
new file mode 100644
index 0000000..53273eb
--- /dev/null
+++ b/falcon-ui/app/html/directives/tags-input.html
@@ -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="host" tabindex="-1" ti-transclude-append="">
+<div class="tags" ng-class="{focused: hasFocus}">
+<ul class="tag-list">
+<li class="tag-item" ng-repeat="tag in tagList.items track by track(tag)" ng-class="{ selected: tag == tagList.selected }">
+  <strong ng-bind="getDisplayLabel($index, tag)"></strong>
+  <span ng-bind="getDisplayText(tag)" ng-class="tag.striked"></span>
+<a class="remove-button" ng-click="tagList.remove($index)" ng-bind="options.removeTagSymbol"></a>
+</li></ul>
+  <input autofocus id="tagsInput" class="input" ng-model="newTag.text" ng-change="newTagChange()"
+         ng-trim="false" ng-class="{'invalid-tag': newTag.invalid}"
+         ti-bind-attrs="{type: options.type, placeholder: options.placeholder, tabindex: options.tabindex}" ti-autosize="">
+</div></div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/directives/timeZoneSelectDv.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/directives/timeZoneSelectDv.html b/falcon-ui/app/html/directives/timeZoneSelectDv.html
index 110c2ee..f15bed7 100644
--- a/falcon-ui/app/html/directives/timeZoneSelectDv.html
+++ b/falcon-ui/app/html/directives/timeZoneSelectDv.html
@@ -19,6 +19,7 @@
 -->
 <select class="padding0 TZSelect form-control" ng-model="ngModel">
   <option value="" disabled style='display:none;'>-Select timezone-</option>
+  <option value="UTC">UTC</option>
   <option value="GMT-12:00">(GMT -12:00) Eniwetok, Kwajalein</option>
   <option value="GMT-11:00">(GMT -11:00) Midway Island, Samoa</option>
   <option value="GMT-10:00">(GMT -10:00) Hawaii</option>

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/entityDefinitionTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/entityDefinitionTpl.html b/falcon-ui/app/html/entityDefinitionTpl.html
new file mode 100644
index 0000000..bdf29eb
--- /dev/null
+++ b/falcon-ui/app/html/entityDefinitionTpl.html
@@ -0,0 +1,35 @@
+<!--
+/**
+ * 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="container" id="entityDefinition">
+
+  <h3 class="link-icons entity-title entity-link-null" id="entity-title">
+    {{entity.name}} <span class="label label-success">{{entity.type | titleCase}}</span>
+  </h3>
+
+  <div class="col-sm-24 detailsBox">
+    <h5>
+      Definition
+    </h5>
+    <div>
+      <textarea ng-model="prettyXml" rows="25" ng-disabled="true"></textarea>
+    </div>
+  </div>
+
+</div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/entityDetailsTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/entityDetailsTpl.html b/falcon-ui/app/html/entityDetailsTpl.html
index 0897638..6f1a4bc 100644
--- a/falcon-ui/app/html/entityDetailsTpl.html
+++ b/falcon-ui/app/html/entityDetailsTpl.html
@@ -17,18 +17,60 @@
  * limitations under the License.
  */
 -->
-<div class="col-sm-24 detailsHeaders"> 
-  <h3>
-    <small>{{clusterEntity._name}}</small>
-    {{ viewDock._name }}
-  </h3>
-</div>
-<div class="col-sm-23 detailsBox">
-  <h5>
-    Definition
-  </h5>
-  <div>
-    <textarea ng-model="prettyXml" rows="25" ng-disabled="true"></textarea>
+<div class="container" id="entityDetails">
+
+  <div class="row">
+    <div class="col-sm-24">
+      <button class="btn " ui-sref="main">< Back to Search</button>
+    </div>
   </div>
-    
+
+	<h3 class="link-icons entity-title entity-link-null" id="entity-title">
+		{{entity.name}} <button type="button" class="detailsBT">
+		<span ng-class="displayIcon((entity.type | uppercase), entity.model)"></span> {{entityTypeLabel}}
+	</button>
+	</h3>
+
+	<div class="row">
+		<div class="col-sm-24">
+			<div class="detailsBox">
+				<h4>
+					Dependencies
+				</h4>
+        <div class="dependencies-graph"><dependencies-graph name="entity.name" type="entity.type"/></div>
+			</div>
+		</div>
+	</div>
+
+	<div class="row">
+		<div class="col-sm-16">
+			<div class="detailsBox">
+				<h4>
+					Instances
+				</h4>
+				<instances-list input="instancesList" type="entity.type" name="entity.name" instance-details="instanceDetails"
+												pages="pages" go-page="goPage" next-pages="nextPages" prev-pages="prevPages" change-pages-set="changePagesSet"
+												start="entity.start" end="entity.end"/>
+			</div>
+		</div>
+		<div class="col-sm-8">
+			<div class="summaryBox" ng-init="propsOpen = false">
+				<div class="row">
+					<div class="col-sm-21">
+						<h4>
+							Properties
+						</h4>
+					</div>
+					<div class="col-sm-3">
+						<h4 class="pointer glyphicon" ng-click="propsOpen = !propsOpen" ng-class="propsOpen ? 'glyphicon-chevron-up':'glyphicon-chevron-down'"></h4>
+					</div>
+				</div>
+        <div ng-show="propsOpen" class="animate-show">
+					<div ng-if="entity.type == 'feed'" ui-view="feedSummary"></div>
+					<div ng-if="entity.type == 'process'" ui-view="processSummary"></div>
+				</div>
+			</div>
+		</div>
+	</div>
+
 </div>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/falcon/blob/86180d93/falcon-ui/app/html/entitySummary.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/entitySummary.html b/falcon-ui/app/html/entitySummary.html
new file mode 100644
index 0000000..83e8a85
--- /dev/null
+++ b/falcon-ui/app/html/entitySummary.html
@@ -0,0 +1,147 @@
+<!--
+/**
+ * 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="row" id="entitySummary">
+  <h4 class="col-sm-24">
+    General
+  </h4>
+  <div class="col-sm-12">
+    <label>Name</label>: {{feed.name}}
+  </div>
+  <div class="col-sm-12">
+    <label>Description</label>: {{optional(feed.description)}}
+  </div>
+
+  <h4 class="col-sm-24">
+    Tags
+  </h4>
+  <div class="col-sm-24">
+    <div ng-repeat="tag in feed.tags | filter:{key: '!!'}">
+      {{tag.key}} = {{tag.value}}
+    </div>
+    <div ng-show="!hasTags()">No tags selected</div>
+  </div>
+
+  <h4 class="col-sm-24">
+    Groups
+  </h4>
+  <div class="col-sm-24">
+    {{feed.groups}}
+    <div ng-show="!feed.groups">No groups selected</div>
+  </div>
+
+  <h4 class="col-sm-24">
+    Access Control List
+  </h4>
+  <div class="col-sm-8">
+    <label>Owner</label>: {{optional(feed.ACL.owner)}}
+  </div>
+  <div class="col-sm-8">
+    <label>Group</label>: {{optional(feed.ACL.group)}}
+  </div>
+  <div class="col-sm-8">
+    <label>Permissions</label>: {{optional(feed.ACL.permission)}}
+  </div>
+
+  <h4 class="col-sm-24">
+    Schema
+  </h4>
+
+  <div class="col-sm-12">
+    <label>Location</label>: {{optional(feed.schema.location)}}
+  </div>
+  <div class="col-sm-12">
+    <label>Provider</label>: {{optional(feed.schema.provider)}}
+  </div>
+
+  <h4 class="col-sm-24">
+    Properties
+  </h4>
+
+  <div class="col-sm-8">
+    <label>Frequency</label>: <frequency value="feed.frequency" prefix="Every"/>
+  </div>
+  <div class="col-sm-8">
+    <label>Late Arrival</label>: <frequency value="feed.lateArrival.cutOff" prefix="Up to"/>
+  </div>
+  <div class="col-sm-8">
+    <label>Availability Flag</label>: {{optional(feed.availabilityFlag)}}
+  </div>
+
+  <div class="col-sm-8" ng-repeat="property in feed.properties">
+    <label>{{property.key}}</label>:
+    <span ng-if="property.key !== 'timeout'">{{optional(property.value)}}</span>
+    <frequency ng-if="property.key === 'timeout'" value="property.value" prefix="at"/>
+  </div>
+
+  <div class="col-sm-8" ng-repeat="property in feed.customProperties | filter: {key: '!!'}">
+    <label>{{property.key}}</label>: {{property.value}}
+  </div>
+
+  <h4 class="col-sm-8" >
+    Default Storage Type:
+  </h4>
+
+  <div class="col-sm-8 light" ng-show="feed.storage.fileSystem.active">File System</div>
+  <div class="col-sm-8 light" ng-show="feed.storage.catalog.active">Catalog Storage</div>
+
+  <h4 class="col-sm-24" >Default Location:</h4>
+
+  <div ng-repeat="location in feed.storage.fileSystem.locations" ng-show="feed.storage.fileSystem.active">
+    <label class="col-sm-24" >{{capitalize(location.type)}}</label>
+    <div class="col-sm-24">{{optional(location.path)}}</div>
+  </div>
+
+  <div ng-show="feed.storage.catalog.active">
+    <label class="col-sm-24" >Table uri</label>
+    <div class="col-sm-24">{{optional(feed.storage.catalog.catalogTable.uri)}}</div>
+  </div>
+
+  <div ng-repeat="cluster in feed.clusters" >
+    <h4 class="col-sm-24" >{{capitalize(cluster.type)}} Cluster</h4>
+
+    <div class="col-sm-12">
+      <label>Name</label>: {{cluster.name}}
+    </div>
+    <div class="clearfix hidden-md"></div>
+
+    <div class="col-sm-12">
+      <label>Start</label>: {{cluster.validity.start.date}} {{cluster.validity.start.time}}
+    </div>
+    <div class="col-sm-12">
+      <label>End</label>: {{cluster.validity.end.date}} {{cluster.validity.end.time}}
+    </div>
+    <div class="col-sm-24">
+      <label>Timezone</label>: {{feed.timezone}}
+    </div>
+    <div class="col-sm-24">
+      <label>Retention</label>: <frequency value="cluster.retention" prefix="Archive in"/>
+    </div>
+  </div>
+  <div class="clearfix hidden-md"></div>
+  <h4 class="col-sm-24" >Location</h4>
+  <div ng-repeat="location in cluster.storage.fileSystem.locations" ng-show="cluster.storage.fileSystem">
+    <label class="col-sm-24" >{{capitalize(location.type)}}</label>
+    <div class="col-sm-24">{{optional(location.path)}}</div>
+  </div>
+  <div ng-show="cluster.storage.catalog.active">
+    <label class="col-sm-24" >Table uri</label>
+    <div class="col-sm-24">{{optional(cluster.storage.catalog.catalogTable.uri)}}</div>
+  </div>
+</div>
\ No newline at end of file