You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@falcon.apache.org by pe...@apache.org on 2016/08/22 04:48:04 UTC
[11/16] falcon git commit: FALCON-2118 Proposal for new UI changes
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/entityDetailsTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/entityDetailsTpl.html b/falcon-ui/app/html/entityDetailsTpl.html
index 6f1a4bc..2afefac 100644
--- a/falcon-ui/app/html/entityDetailsTpl.html
+++ b/falcon-ui/app/html/entityDetailsTpl.html
@@ -19,58 +19,101 @@
-->
<div class="container" id="entityDetails">
- <div class="row">
- <div class="col-sm-24">
- <button class="btn " ui-sref="main">< Back to Search</button>
+ <div class="row pt15px">
+ <div class="col-sm-24 detailsHeaders pl0px">
+ <button class="btn" title="Back to search" ui-sref="main">< </button>
+ <span class="entityName">{{entity.name}}</span>
+ <span ng-class="{'blink-success': entity.status == 'RUNNING',
+ 'text-success': entity.status == 'SUCCEEDED',
+ 'blink-warning': entity.status == 'SUSPENDED',
+ 'blink-danger': entity.status == 'UNKNOWN'}" ng-if="entity.type != 'cluster'">
+ {{entity.status}}</span>
+ <br><br>
+ <div class="pull-left">
+ <table>
+ <tbody>
+ <tr>
+ <td class="buttonCell" colspan="9">
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="scheduleEntity()" ng-if="entity.type != 'cluster' && entity.status == 'SUBMITTED'">
+ <span class="entypo play"></span> <div>Schedule</div>
+ </div>
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="resumeEntity()" ng-if="entity.type != 'cluster' && entity.status == 'SUSPENDED'">
+ <span class="entypo play"></span> <div>Resume</div>
+ </div>
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="suspendEntity()" ng-if="entity.type != 'cluster' && entity.status == 'RUNNING'">
+ <span class="entypo paus"></span> <div>Pause</div>
+ </div>
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="editEntity()"
+ ng-disabled="entity.type === 'cluster' && (!isSafeMode() || !isSuperUser())"
+ ng-class="{disabledEditBtn: entity.type === 'cluster' && (!isSafeMode() || !isSuperUser())}"
+ title="{{(entity.type === 'cluster' && !isSafeMode() || (!isSuperUser())) ? 'Cluster entity update can only be performed by superuser during safemode' : ''}}">
+ <span class="entypo cog"></span> <div>Edit</div>
+ </div>
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="cloneEntity()" ng-if="entity.type != 'cluster'">
+ <span class="entypo docs"></span> <div>Copy</div>
+ </div>
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="deleteEntity()">
+ <span class="entypo trash"></span> <div>Delete</div>
+ </div>
+ <div class="btn btn-gray btn-xs buttons-to-show" ng-click="downloadEntity()">
+ <span class="entypo down"></span> <div>XML</div>
+ </div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+
+ </div>
</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>
+ </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 class="row pt15px" ng-if="entity.type != 'cluster'">
+ <div class="col-sm-24 pl0px">
+ <div class="entityDetailsBox">
+ <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">
+ <div class="row pt15px">
+ <div class="col-sm-16 entityDetailsBox p10px" ng-if="entity.type != 'cluster'">
+ <div>
<h4>
- Instances
+ 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 ng-class="{'col-sm-8': entity.type !== 'cluster', 'col-sm-24': entity.type === 'cluster'}">
+ <div class="summaryBox" ng-init="propsOpen = entity.type === 'cluster'">
<div class="row">
<div class="col-sm-21">
<h4>
- Properties
+ 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>
+ <h4 ng-hide="entity.type === 'cluster'" 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 ng-if="entity.type == 'cluster'" ui-view="clusterSummary"></div>
+ <div ng-if="entity.type == 'process' && entityTypeLabel == 'Process'" ui-view="processSummary"></div>
+ <div ng-if="entity.type == 'process' && entityTypeLabel == 'Snapshot'" ui-view="snapshotSummary"></div>
+ <div ng-if="entity.type == 'process' && (entityTypeLabel == 'HDFS Mirror' || entityTypeLabel == 'Hive Mirror')"
+ ui-view="datasetSummary"></div>
</div>
</div>
</div>
</div>
-</div>
\ No newline at end of file
+</div>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/entitySummary.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/entitySummary.html b/falcon-ui/app/html/entitySummary.html
index 83e8a85..f3d7c2a 100644
--- a/falcon-ui/app/html/entitySummary.html
+++ b/falcon-ui/app/html/entitySummary.html
@@ -85,13 +85,13 @@
</div>
<div class="col-sm-8" ng-repeat="property in feed.properties">
- <label>{{property.key}}</label>:
+ <label>{{feedPropertiesLabels[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}}
+ <label>{{feedPropertiesLabels[property.key]}}</label>: {{property.value}}
</div>
<h4 class="col-sm-8" >
@@ -131,7 +131,7 @@
<label>Timezone</label>: {{feed.timezone}}
</div>
<div class="col-sm-24">
- <label>Retention</label>: <frequency value="cluster.retention" prefix="Archive in"/>
+ <label>Retention</label>: <frequency value="cluster.retention" prefix=""/>
</div>
</div>
<div class="clearfix hidden-md"></div>
@@ -144,4 +144,4 @@
<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
+</div>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/error.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/error.html b/falcon-ui/app/html/error.html
new file mode 100644
index 0000000..683510e
--- /dev/null
+++ b/falcon-ui/app/html/error.html
@@ -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.
+ */
+-->
+<div class="col-sm-24 dashboardBox login" ng-class="{showValidationStyle:showLoginVal.show}">
+ <div class="row">
+ <div class="col-sm-6"></div>
+ <div class="col-sm-12">
+
+ <div class="detailsBox centered">
+ <h3 class="auth" ng-if="httpError.code === 401 || httpError.code === 403">
+ Verify user name and password. If problem continues, contact your administrator.
+ </h3>
+ <h3 class="auth" ng-if="httpError.code !== 401 && httpError.code !== 403">
+ ERROR {{ httpError.code }} {{ httpError.error }}, try later.
+ </h3>
+ </div>
+
+ </div>
+ <div class="col-sm-6"></div>
+ </div>
+</div>
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormAdvancedStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormAdvancedStepTpl.html b/falcon-ui/app/html/feed/feedFormAdvancedStepTpl.html
new file mode 100644
index 0000000..e50fc29
--- /dev/null
+++ b/falcon-ui/app/html/feed/feedFormAdvancedStepTpl.html
@@ -0,0 +1,166 @@
+<!--
+/**
+ * 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 name="feedForm" novalidate id="feedFormAdvancedStep">
+ <div class="col-xs-24"><label>Job Details</label></div>
+ <div class="col-xs-24 plr0px">
+ <div ng-repeat="property in feed.properties track by $index">
+ <div ng-if="property.key === 'queueName'">
+ <div class="col-xs-4">
+ <label class="light">Queue Name</label>
+ <input type="text" class="form-control"
+ ng-model="property.value" />
+ </div>
+ </div>
+ <div ng-if="property.key === 'jobPriority'">
+ <div class="col-xs-4">
+ <label class="light">Job Priority</label>
+ <select ng-model="property.value" class="form-control padding0">
+ <option value="" disabled selected style='display:none;'>-Select job-</option>
+ <option value="VERY_HIGH">Very high</option>
+ <option value="HIGH">High</option>
+ <option value="NORMAL">Normal</option>
+ <option value="LOW">Low</option>
+ <option value="VERY_LOW">Very Low</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-4">
+ <label class="col-xs-24 light plr0px">Late Arrival Cutoff</label>
+ <input type="text" class="col-xs-4" ng-keydown="validations.acceptOnlyNumber($event)"
+ ng-model="feed.lateArrival.cutOff.quantity"
+ ng-pattern="validations.patterns.twoDigits"/>
+ <select
+ ng-model="feed.lateArrival.cutOff.unit" class="col-xs-offset-1 col-xs-19">
+ <option value="" disabled selected style='display:none;'>-Select unit-</option>
+ <option value="minutes">minutes</option>
+ <option value="hours">hours</option>
+ <option value="days">days</option>
+ <option value="months">months</option>
+ </select>
+ </div>
+ <div class="col-xs-4">
+ <label class="light">Availability Flag</label>
+ <input type="text" class="form-control"
+ ng-model="feed.availabilityFlag"
+ validation-optional-message="{{validations.messages.value}}"
+ ng-pattern="validations.patterns.alpha">
+ </div>
+ </div>
+
+ <label class="col-xs-24">Performance & Throttling - Distributed Copy</label>
+
+ <div class="col-xs-24 plr0px">
+ <div ng-repeat="property in feed.properties track by $index">
+ <div ng-if="property.key === 'mapBandwidthKB'">
+ <div class="col-xs-4">
+ <label class="light">Max Bandwidth</label>
+ <input type="text" class="form-control"
+ ng-model="property.value">
+ </div>
+ </div>
+ <div ng-if="property.key === 'maxMaps'">
+ <div class="col-xs-4">
+ <label class="light">Max map jobs</label>
+ <input type="text" class="form-control"
+ ng-model="property.value">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px">
+ <div ng-repeat="property in feed.properties track by $index">
+ <div ng-if="property.key === 'parallel'">
+ <div class="col-xs-4">
+ <label class="col-xs-24 light plr0px">Parallel</label>
+ <input type="text" class="form-control"
+ ng-model="property.value">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24"><label>Access Control List</label></div>
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-8">
+ <label class="light">Owner<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" validation-message="{{validations.messages.acl.owner}}"
+ ng-required="true"
+ ng-pattern="validations.patterns.unixId"
+ ng-model="feed.ACL.owner"/>
+ </div>
+ <div class="col-xs-8">
+ <label class="light">Group<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" validation-message="{{validations.messages.acl.group}}"
+ ng-required="true"
+ ng-pattern="validations.patterns.unixId"
+ ng-model="feed.ACL.group"/>
+ </div>
+ <div class="col-xs-24">
+ <div class="col-xs-8 plr0px">
+ <label class="light">Permissions<mandatory-field></mandatory-field></label>
+ <acl-permissions acl-model="feed.ACL.permission"></acl-permissions>
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-24"><label>Feed Schema</label></div>
+ <div class="col-xs-8">
+ <label class="light" tooltip="feed.schema.location">Location<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" validation-message="{{validations.messages.location}}"
+ ng-maxlength="200"
+ ng-pattern="validations.patterns.osPath"
+ ng-model="feed.schema.location"/>
+ </div>
+ <div class="col-xs-8">
+ <label class="light" tooltip="feed.schema.provider">Provider<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" validation-message="{{validations.messages.provider}}"
+ ng-pattern="validations.patterns.osPath"
+ ng-model="feed.schema.provider"/>
+ </div>
+ <div class="col-xs-8"></div>
+
+
+ <div class="col-xs-24 pb15px mt35">
+ <button id="feed.backToStep1" class="btn prevBtn" type="button" ng-click="goBack()" ng-disabled="buttonSpinners.backShow">
+ PREVIOUS <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow">
+ </button>
+ <div class="pull-right">
+ <a class="btn cnclBtn" ui-sref="main">
+ CANCEL
+ </a>
+ <button id="feed.step1" class="btn nextBtn"
+ ng-disabled="buttonSpinners.show"
+ ng-click="goNext(feedForm.$invalid)"
+ scroll-to-error>
+ NEXT <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+ </button>
+ <button class="btn advancedSaveBtn"
+ ng-disabled="feedForm.$invalid || buttonSpinners.saveShow"
+ ng-click="saveEntity(feedForm.$invalid)" scroll-to-error>
+ SAVE ADVANCED OPTIONS <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.saveShow" />
+ </button>
+ </div>
+ </div>
+
+</form>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormClusterDetailsTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormClusterDetailsTpl.html b/falcon-ui/app/html/feed/feedFormClusterDetailsTpl.html
new file mode 100644
index 0000000..7192fd7
--- /dev/null
+++ b/falcon-ui/app/html/feed/feedFormClusterDetailsTpl.html
@@ -0,0 +1,151 @@
+<!--
+/**
+ * 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.
+ */
+-->
+<feed-form-cluster-partitions></feed-form-cluster-partitions>
+
+<div class="row detailsBox">
+ <div class="col-xs-24 feedLocationNavBox nopointer plr0px">
+ <span class="col-xs-7" ng-show="!feed.storage.fileSystem.active">Default Storage Type</span>
+ <span class="col-xs-7" ng-show="feed.storage.fileSystem.active">Storage Type</span>
+
+ <div class="col-xs-17 feedLocationNav disabled">
+ <button class="btn btn-default pull-right"
+ ng-class="{active: feed.storage.catalog.active}"
+ ng-disabled="true">
+ Catalog Storage
+ </button>
+ <button class="btn btn-default pull-right"
+ ng-class="{active: feed.storage.fileSystem.active}"
+ ng-disabled="true">
+ File System
+ </button>
+ </div>
+ </div>
+
+ <div class="col-xs-24">
+ <label pl0px>LOCATION</label>
+ <label class="light">(if not defined, will use default location)</label>
+ </div>
+
+ <div class="col-xs-24"
+ ng-show="feed.storage.fileSystem.active"
+ ng-repeat="location in cluster.storage.fileSystem.locations">
+ <label class="light">{{capitalize(location.type)}} Path<mandatory-field></mandatory-field></label>
+ <input type="text"
+ placeholder="{{clusterLocationsPlaceHolders[location.type]}}"
+ class="form-control"
+ ng-model="location.path"
+ validation-optional-message="{{validations.messages.path}}"
+ ng-pattern="validations.patterns.osPath" />
+ </div>
+
+ <div class="col-xs-24" ng-show="feed.storage.catalog.active">
+ <label class="light">Table uri<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control"
+ ng-model="cluster.storage.catalog.catalogTable.uri"
+ validation-optional-message="{{validations.messages.path}}"
+ ng-pattern="validations.patterns.osPath"/>
+ </div>
+
+ <div class="col-xs-24">
+ <label class="mt15">VALIDITY</label>
+ </label></div>
+ <div class="col-xs-24">
+ <label class="mt15 light">Time Zone : <span>{{feed.timezone}}</span>
+ </label></div>
+ <div class="col-xs-24 validityBox plr0px">
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-6 startDateBox">
+ <label class="light">Start<mandatory-field></mandatory-field>
+ <input type="text"
+ name="startDateInput"
+ class="form-control dateInput"
+ placeholder="{{dateFormat | lowercase}}"
+ ng-model="cluster.validity.start.date"
+ simple-date-picker />
+ </label>
+ </div>
+ <div class="col-xs-6 startTimeBox">
+ <label class="light">Time<mandatory-field></mandatory-field>
+ <timepicker ng-change="constructDate()"
+ ng-model="cluster.validity.start.time"
+ hour-step="1"
+ minute-step="1"
+ show-meridian="true">
+ </timepicker>
+ </label>
+ </div>
+ </div>
+
+ <label class="col-xs-24 custom-danger validationMessageGral"
+ ng-if="!cluster.validity.start.date">
+ {{validations.messages.date.empty}}
+ </label>
+
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-6 endDateBox">
+ <label class="light">End<mandatory-field></mandatory-field>
+ <input type="text"
+ name="startDateInput"
+ class="form-control dateInput"
+ placeholder="{{dateFormat | lowercase}}"
+ ng-model="cluster.validity.end.date"
+ simple-date-picker />
+ </label>
+ </div>
+ <div class="col-xs-6 endTimeBox">
+ <label class="light">Time<mandatory-field></mandatory-field>
+ <timepicker ng-change="constructDate()"
+ ng-model="cluster.validity.end.time"
+ hour-step="1"
+ minute-step="1"
+ show-meridian="true">
+ </timepicker>
+ </label>
+ </div>
+ </div>
+
+ <label class="col-xs-24 custom-danger validationMessageGral"
+ ng-if="!cluster.validity.end.date">
+ {{validations.messages.date.empty}}
+ </label>
+ </div>
+
+ <label class="light col-xs-24">Retention<mandatory-field></mandatory-field></label>
+
+ <div class="col-xs-24 inlineInputsGroup">
+ <input type="text" class="form-control" validation-message="{{validations.messages.number}}"
+ ng-required="true" ng-model="cluster.retention.quantity" ng-keydown="validations.acceptOnlyNumber($event)"
+ ng-pattern="validations.patterns.twoDigits">
+
+ <select ng-model="cluster.retention.unit"
+ ng-required="true">
+ <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="row">
+ <button type="button" class="btn btn-default pull-right btn-xs mt5" ng-click="removeCluster($index, cluster.type)">
+ <span class="entypo minus"></span> delete
+ </button>
+ </div>
+</div>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormClusterPartitionsTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormClusterPartitionsTpl.html b/falcon-ui/app/html/feed/feedFormClusterPartitionsTpl.html
new file mode 100644
index 0000000..a09c74e
--- /dev/null
+++ b/falcon-ui/app/html/feed/feedFormClusterPartitionsTpl.html
@@ -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.
+ */
+-->
+<div class="col-xs-24" ng-show="partitionList.length > 0">
+ <input type="checkbox" ng-model="selectPartition" />
+ <label class="light">Partition</label>
+ <div class="typeButtonsBox mt5" ng-show="selectPartition">
+ <div ng-repeat="partition in partitionList">
+ <div class="col-xs-16 panel panel-default mb5">
+ <div class="partition-panel-body">
+ <div class="col-xs-4 mt5">
+ {{partition.partitionName}}
+ </div>
+ <div class="col-xs-12 form-inline">
+ <input type="radio" ng-model="partition.mapping" value="mappedPartition"
+ ng-change="preparePartitionExpression(partitionList)" />
+ <input type="text" class="form-control" ng-model="partition.partitionText"
+ ng-change="preparePartitionExpression(partitionList)"
+ ng-disabled="partition.mapping!='mappedPartition'" />
+ <input type="radio" ng-model="partition.mapping" value="any"
+ ng-change="preparePartitionExpression(partitionList)" />
+ Any
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormClustersStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormClustersStepTpl.html b/falcon-ui/app/html/feed/feedFormClustersStepTpl.html
index b33b7f3..91f7d31 100644
--- a/falcon-ui/app/html/feed/feedFormClustersStepTpl.html
+++ b/falcon-ui/app/html/feed/feedFormClustersStepTpl.html
@@ -18,179 +18,107 @@
*/
-->
<form name="feedForm" novalidate id="feedFormClusterStep">
- <button class="hidden" ng-click="goNext(feedForm.$invalid, 'forms.feed.summary')" ></button>
- <div ng-repeat="cluster in feed.clusters">
- <div class="row">
- <h4 class="col-xs-24">{{capitalize(cluster.type)}} Cluster </h4>
+ <div class="feedFormClusters">
+ <div class="col-xs-24 pt5px">
+ <label class="light">Partitions (comma separated)</label>
+ <input type="text" class="form-control" validation-optional-message="{{validations.messages.partitions}}"
+ ng-pattern="validations.patterns.commaSeparated"
+ ng-blur="createFeedClusterPartitions()"
+ ng-model="feedPartitions" />
</div>
- <div class="row detailsBox">
- <div class="col-xs-offset-1 col-xs-22">
-
- <div class="row">
- <div class="col-xs-24">
- <select ng-model="cluster.name" validation-message="{{validations.messages.cluster}}"
- ng-required="true" class="col-xs-24 form-control padding0" id="clusterNameSelect">
- <option value="" disabled selected style='display:none;'>-Select cluster-</option>
- <option id="cluster_" ng-repeat="clusterItem in clusterList">{{clusterItem.name}}</option>
- </select>
- </div>
-
-
- <div class="col-xs-24 feedLocationNavBox nopointer">
- <h4 class="col-xs-7" ng-show="!feed.storage.fileSystem.active">Default Storage type</h4>
- <h4 class="col-xs-7" ng-show="feed.storage.fileSystem.active">Storage type</h4>
-
- <div class="col-xs-17 feedLocationNav disabled">
- <button class="btn btn-default pull-right"
- ng-class="{active: feed.storage.catalog.active}"
- ng-disabled="true">
- Catalog Storage
- </button>
- <button class="btn btn-default pull-right"
- ng-class="{active: feed.storage.fileSystem.active}"
- ng-disabled="true">
- File System
- </button>
- </div>
- </div>
-
- <div class="col-xs-19">
- <label>Location</label>
- <label class="light">(if not defined, will use default location)</label>
- </div>
-
- <div class="col-xs-24"
- ng-show="feed.storage.fileSystem.active"
- ng-repeat="location in cluster.storage.fileSystem.locations">
- <label class="light">{{location.type}} path</label>
- <input type="text"
- placeholder="{{clusterLocationsPlaceHolders[location.type]}}"
- class="form-control"
- ng-model="location.path"
- validation-optional-message="{{validations.messages.path}}"
- ng-pattern="validations.patterns.osPath" />
- </div>
-
- <div class="col-xs-24 mb10" ng-show="feed.storage.catalog.active">
- <label class="light">Table uri</label>
- <input type="text" class="form-control"
- ng-model="cluster.storage.catalog.catalogTable.uri"
- validation-optional-message="{{validations.messages.path}}"
- ng-pattern="validations.patterns.osPath"/>
- </div>
- <div class="clearfix mb20"></div>
- <label class="col-xs-24"> Validity </label>
- <div class="col-xs-24 validityBox">
- <div class="startDateBox">
- <label>Start
- <input type="text"
- name="startDateInput"
- class="form-control dateInput"
- placeholder="mm/dd/yyyy"
- datepicker-popup="{{dateFormat}}"
- ng-model="cluster.validity.start.date"
- is-open="cluster.validity.start.opened"
- ng-click="openDatePicker($event, cluster.validity.start)"
- ng-change="constructDate()"
- ng-required="true"
- simple-date>
- </label>
- <label class="col-xs-24 custom-danger validationMessageGral"
- ng-if="!cluster.validity.start.date">
- {{validations.messages.date.empty}}
- </label>
- </div>
- <div class="startTimeBox">
- <label>Time
- <timepicker ng-change="constructDate()"
- ng-model="cluster.validity.start.time"
- 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="cluster.validity.end.date"
- is-open="cluster.validity.end.opened"
- ng-click="openDatePicker($event, cluster.validity.end)"
- ng-change="constructDate()"
- ng-required="true"
- min-date="cluster.validity.start.date"
- simple-date>
- </label>
- <label class="col-xs-24 custom-danger validationMessageGral"
- ng-if="!cluster.validity.end.date">
- {{validations.messages.date.empty}}
- </label>
- </div>
- <div class="endTimeBox">
- <label>Time
- <timepicker ng-change="constructDate()"
- ng-model="cluster.validity.end.time"
- hour-step="1"
- minute-step="1"
- show-meridian="true">
- </timepicker>
- </label>
- </div>
- </div>
-
- <label class="light col-xs-24"> Retention </label>
-
- <div class="col-xs-24 inlineInputsGroup">
- <input type="text" class="form-control" validation-message="{{validations.messages.number}}"
- ng-required="true" ng-model="cluster.retention.quantity" ng-keydown="validations.acceptOnlyNumber($event)"
- ng-pattern="validations.patterns.twoDigits">
-
- <select ng-model="cluster.retention.unit"
- ng-required="true">
- <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="row" ng-if="cluster.type !== 'source'">
- <button type="button" class="btn btn-default pull-right btn-xs" ng-click="removeCluster($index)">
- <span class="entypo minus"></span> delete
- </button>
- </div>
-
+ <div class="col-xs-24">
+ <label>Source Cluster<mandatory-field></mandatory-field></label>
+ </div>
- </div>
+ <div class="col-xs-24">
+ <select ng-model="sourceClusterName"
+ ng-change="clearSourceClusterFlags()"
+ class="form-control padding0 clusterSelect">
+ <option value="" disabled selected style='display:none;'>-Select source cluster-</option>
+ <option id="cluster_" ng-repeat="clusterItem in clusterList">{{clusterItem.name}}</option>
+ </select>
+
+ <button type="button" class="btn btn-default btn-xs clusterAddBtn" ng-click="addSourceCluster()">
+ Add
+ </button>
+ </div>
+ <div class="col-xs-24">
+ <label class="custom-danger" ng-show="sourceClusterNotSelected">
+ You need to select the source cluster
+ </label>
+ <label class="custom-danger" ng-show="sourceClusterExists">
+ Source cluster is already added
+ </label>
+ </div>
- </div>
+ <div class="col-xs-24 sourceClusterList" ng-show="(feed.clusters | filter:{type:'source'}).length > 0">
+ <label class="clusterListLabel mb7">Source Clusters</label>
+ <accordion close-others="false">
+ <accordion-group ng-repeat="cluster in feed.clusters | filter:{type:'source'}" is-open="cluster.isAccordionOpened">
+ <accordion-heading>{{ cluster.name }}</accordion-heading>
+ <feed-form-cluster-details></feed-form-cluster-details>
+ </accordion-group>
+ </accordion>
</div>
</div>
- <div class="col-xs-24 mt10">
- <button type="button" class="btn btn-default btn-xs" ng-click="addCluster()">
- <span class="entypo plus"></span> add cluster
+ <div class="col-xs-24" ng-show="(feed.clusters | filter:{type:'source'}).length < 1">
+ <label class="custom-danger">
+ You need to provide at least one source cluster
+ </label>
+ </div>
+
+ <div class="col-xs-24">
+ <label>Target Cluster</label>
+ </div>
+ <div class="col-xs-24">
+ <select ng-model="targetClusterName"
+ ng-change="clearTargetClusterFlags()"
+ class="form-control padding0 clusterSelect">
+ <option value="" disabled selected style='display:none;'>-Select target cluster-</option>
+ <option id="cluster_" ng-repeat="clusterItem in clusterList">{{clusterItem.name}}</option>
+ </select>
+
+ <button type="button" class="btn btn-default btn-xs clusterAddBtn" ng-click="addTargetCluster()">
+ Add
</button>
</div>
- <div class="col-xs-24 mt20">
+ <div class="col-xs-24">
+ <label class="custom-danger" ng-show="targetClusterNotSelected">
+ You need to select the target cluster
+ </label>
+ <label class="custom-danger" ng-show="targetClusterExists">
+ Target cluster is already added
+ </label>
+ </div>
+
+ <div class="col-xs-24 targetClusterList" ng-show="(feed.clusters | filter:{type:'target'}).length > 0">
+ <label class="clusterListLabel mb7">Target Clusters</label>
+ <accordion close-others="false">
+ <accordion-group ng-repeat="cluster in feed.clusters | filter:{type:'target'}" is-open="cluster.isAccordionOpened">
+ <accordion-heading>{{ cluster.name }}</accordion-heading>
+ <feed-form-cluster-details></feed-form-cluster-details>
+ </accordion-group>
+ </accordion>
+ </div>
+
+ <div class="col-xs-24 mt35 pb15px">
<button id="feed.backToStep3"
- class="btn prevBtn"
- type="button"
- ng-click="goBack('forms.feed.location')"
- ng-disabled="buttonSpinners.backShow" >
- Previous <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow" />
- </button>
- <button id="feed.step4" class="btn nextBtn pull-right"
- ng-click="goNext(feedForm.$invalid, 'forms.feed.summary')" >
- Next <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+ class="btn prevBtn"
+ type="button"
+ ng-click="goBack()"
+ ng-disabled="buttonSpinners.backShow" >
+ PREVIOUS <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow" />
</button>
- <a class="pull-right" ui-sref="main">
- Cancel
- </a>
+ <div class="pull-right">
+ <a class="btn cnclBtn" ui-sref="main">
+ CANCEL
+ </a>
+ <button id="feed.step4" class="btn nextBtn"
+ ng-click="goNext(feedForm.$invalid)" scroll-to-error>
+ NEXT <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+ </button>
+ </div>
</div>
-</form>
\ No newline at end of file
+</form>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormDataSourceTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormDataSourceTpl.html b/falcon-ui/app/html/feed/feedFormDataSourceTpl.html
new file mode 100644
index 0000000..04ea3a2
--- /dev/null
+++ b/falcon-ui/app/html/feed/feedFormDataSourceTpl.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.
+ */
+-->
+<div class="datasourceBox">
+ <div class="col-xs-24">
+ <label class="light">Datasource<mandatory-field></mandatory-field></label>
+ </div>
+ <div class="col-xs-10">
+ <select ng-model="feed[feed.dataTransferType][dataSourceType].name"
+ ng-required="true"
+ class="form-control padding0"
+ validation-message="{{validations.messages.datasource}}">
+ <option value="" disabled style='display:none;'>Select transfer datasource</option>
+ <option ng-repeat="datasourceItem in datasourceList"
+ value="{{datasourceItem.name}}">
+ {{datasourceItem.name}}
+ </option>
+ </select>
+ </div>
+
+ <div class="col-xs-24">
+ <label class="light">Table<mandatory-field></mandatory-field></label>
+ </div>
+ <div class="col-xs-10">
+ <input type="text"
+ ng-required="true"
+ placeholder="Enter table name"
+ class="form-control"
+ ng-model="feed[feed.dataTransferType][dataSourceType].tableName"
+ validation-optional-message="{{validations.messages.table}}" />
+ </div>
+ <div class="col-xs-24 plr0px" ng-if="feed.dataTransferType === 'export'">
+ <div class="col-xs-24">
+ <label class="light">Load Method<mandatory-field></mandatory-field></label>
+ </div>
+
+ <div class="col-xs-12 plr0px mt5">
+ <div class="typeButtonsBox">
+ <div class="col-xs-12">
+ <span class="radio-inline">
+ <input type="radio" name="type" value="updateonly" ng-model="feed[feed.dataTransferType][dataSourceType][dataTransferAction].type"/>
+ Update Only
+ </div>
+ <div class="col-xs-12">
+ <span class="radio-inline">
+ <input type="radio" name="type" value="allowinsert" ng-model="feed[feed.dataTransferType][dataSourceType][dataTransferAction].type"/>
+ Allow Insert
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-24 plr0px" ng-if="feed.dataTransferType === 'import'">
+ <div class="col-xs-24">
+ <label class="light">Extract Type<mandatory-field></mandatory-field></label>
+ </div>
+
+ <div class="col-xs-12 plr0px mt5">
+ <div class="typeButtonsBox">
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="type" value="full"
+ ng-model="feed[feed.dataTransferType][dataSourceType][dataTransferAction].type"/>
+ Full
+ </div>
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="type" value="incremental" disabled="disabled"
+ ng-model="feed[feed.dataTransferType][dataSourceType][dataTransferAction].type"/>
+ Incremental
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-24">
+ <label class="light">Merge Type<mandatory-field></mandatory-field></label>
+ </div>
+
+ <div class="col-xs-12 plr0px mt5">
+ <div class="typeButtonsBox">
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="mergepolicy" value="snapshot"
+ ng-model="feed[feed.dataTransferType][dataSourceType][dataTransferAction].mergepolicy"/>
+ Snapshot
+ </div>
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="mergepolicy" value="append"
+ ng-model="feed[feed.dataTransferType][dataSourceType][dataTransferAction].mergepolicy"/>
+ Append
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-24">
+ <label class="light">Columns<mandatory-field></mandatory-field></label>
+ </div>
+
+ <div class="col-xs-12 mt5 plr0px">
+ <div class="typeButtonsBox">
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="fieldsType" value="all"
+ ng-model="feed[feed.dataTransferType][dataSourceType].columnsType"/>
+ All
+ </div>
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="fieldsType" value="include"
+ ng-model="feed[feed.dataTransferType][dataSourceType].columnsType"/>
+ Include
+ </div>
+ <div class="col-xs-8">
+ <span class="radio-inline">
+ <input type="radio" name="fieldsType" value="exclude"
+ ng-model="feed[feed.dataTransferType][dataSourceType].columnsType"/>
+ Exclude
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-16 mt5" ng-if="feed[feed.dataTransferType][dataSourceType].columnsType === 'include'">
+ <input type="text"
+ ng-required="true"
+ class="form-control"
+ ng-model="feed[feed.dataTransferType][dataSourceType].includesCSV" />
+ </div>
+ <div class="col-xs-16 mt5" ng-if="feed[feed.dataTransferType][dataSourceType].columnsType === 'exclude'">
+ <input type="text"
+ ng-required="true"
+ class="form-control"
+ ng-model="feed[feed.dataTransferType][dataSourceType].excludesCSV" />
+ </div>
+</div>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormGeneralStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormGeneralStepTpl.html b/falcon-ui/app/html/feed/feedFormGeneralStepTpl.html
index 2a4f5c4..6af357c 100644
--- a/falcon-ui/app/html/feed/feedFormGeneralStepTpl.html
+++ b/falcon-ui/app/html/feed/feedFormGeneralStepTpl.html
@@ -19,106 +19,463 @@
-->
<form name="feedForm" novalidate id="feedFormGeneralStep">
- <div class="col-xs-24">
- <label class="light">Name</label>
- <input type="text" class="form-control" ng-disabled="!cloningMode" ng-keydown="validations.acceptNoSpaces($event)"
- check-name="{type:'feed', check:cloningMode}" ng-class="{fakeInvalid:!validations.nameAvailable}"
- ng-model="feed.name" ng-required="true" ng-pattern="validations.patterns.name"/>
- </div>
- <div class="col-xs-24">
- <label class="light">Description</label>
- <input type="text" class="form-control" validation-optional-message="{{validations.messages.description}}"
- ng-model="feed.description"
- ng-pattern="validations.patterns.freeText"/>
- </div>
+ <div class="col-xs-4">
+ <label class="light" tooltip="feed.name">Feed Name<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" ng-disabled="editingMode" ng-keydown="validations.acceptNoSpaces($event)"
+ check-name="{type:'feed', check:!editingMode}" ng-class="{fakeInvalid:!validations.nameAvailable}"
+ ng-model="feed.name" ng-required="true" ng-pattern="validations.patterns.name"/>
+ </div>
- <div class="col-xs-24">
- <label class="light">Tags</label>
- </div>
+ <div class="col-xs-24">
+ <label class="light">Description</label>
+ </div>
+
+ <div class="col-xs-8">
+ <input type="text" class="form-control"
+ ng-model="feed.description"
+ ng-pattern="validations.patterns.freeText"/>
+ </div>
- <div class="col-xs-24">
- <div ng-repeat="tag in feed.tags">
- <div class="row dynamic-table-spacer">
- <div class="col-xs-10">
- <input type="text" class="form-control" ng-model="tag.key"
- validation-optional-message="{{validations.messages.key}}"
- ng-pattern="validations.patterns.alpha" ng-required="tag.value" placeholder="key"/>
- </div>
- <div class="col-xs-11">
- <input type="text" class="form-control" validation-optional-message="{{validations.messages.value}}"
- ng-model="tag.value" ng-pattern="validations.patterns.alpha" ng-required="tag.key" placeholder="value"/>
- </div>
- <div class="col-xs-3">
- <button type="button" class="btn btn-default btn-xs" ng-click="removeTag($index)" ng-if="$index>0">
- <span class="entypo minus"></span> delete
- </button>
- </div>
+ <div class="col-xs-24">
+ <label class="light">Tags</label>
+ </div>
+
+ <div class="col-xs-12">
+ <div ng-repeat="tag in feed.tags">
+ <div class="row dynamic-table-spacer">
+ <div class="col-xs-8">
+ <input type="text" class="form-control" ng-model="tag.key"
+ validation-optional-message="{{validations.messages.key}}"
+ ng-pattern="validations.patterns.alpha" ng-required="tag.value" placeholder="key"/>
+ </div>
+ <div class="col-xs-8">
+ <input type="text" class="form-control" validation-optional-message="{{validations.messages.value}}"
+ ng-model="tag.value"
+ ng-pattern="validations.patterns.alpha" ng-required="tag.key" placeholder="value"/>
</div>
+ <div class="col-xs-8">
+ <button type="button" class="btn btn-default btn-xs" ng-click="removeTag($index)" ng-disabled="xmlPreview.edit" ng-if="!$first || !$last">
+ <span class="entypo minus"></span> delete
+ </button>
+ <button type="button" class="btn btn-default btn-xs" ng-click="addTag()" ng-disabled="xmlPreview.edit" ng-if="$last">
+ <span class="entypo plus"></span> add tag
+ </button>
+ </div>
</div>
</div>
- <div class="col-xs-24 dynamic-table-spacer">
- <button type="button" class="btn btn-default btn-xs" ng-click="addTag()">
- <span class="entypo plus"></span> add tag
- </button>
- </div>
+ </div>
+ <div class="col-xs-24">
+ <label class="light" tooltip="feed.groups">
+ Feed Groups (comma separated)
+ </label>
+ </div>
- <div class="col-xs-24">
- <label class="light">Groups (comma separated)</label>
- <input type="text" class="form-control" validation-optional-message="{{validations.messages.acl.group}}"
- ng-pattern="validations.patterns.commaSeparated"
- ng-model="feed.groups"/>
- </div>
+ <div class="col-xs-8">
+ <input type="text" class="form-control" validation-optional-message="{{validations.messages.acl.group}}"
+ ng-pattern="validations.patterns.commaSeparated"
+ ng-model="feed.groups"/>
+ </div>
- <div class="col-xs-24"><h4 class="tittle-in-row">Access Control List</h4></div>
- <div class="col-xs-8">
- <label class="light">Owner</label>
- <input type="text" class="form-control" validation-message="{{validations.messages.acl.owner}}"
- ng-required="true"
- ng-pattern="validations.patterns.unixId"
- ng-model="feed.ACL.owner"/>
- </div>
- <div class="col-xs-8">
- <label class="light">Group</label>
- <input type="text" class="form-control" validation-message="{{validations.messages.acl.group}}"
- ng-required="true"
- ng-pattern="validations.patterns.unixId"
- ng-model="feed.ACL.group"/>
+ <div class="col-xs-24">
+ <label class="light">Type<mandatory-field></mandatory-field></label>
+ </div>
+
+ <div class="col-xs-4">
+ <select ng-model="feed.dataTransferType" ng-required="true"
+ class="form-control padding0" ng-change="onTypeChange(feed.dataTransferType)">
+ <option value="" disabled selected style='display:none;'>-Select feed type-</option>
+ <option value="hive">Hive</option>
+ <option value="hdfs">HDFS</option>
+ <option value="import">RDBMS Import</option>
+ <option value="export">RDBMS Export</option>
+ </select>
+ </div>
+
+ <div class="col-xs-24" ng-if="feed.dataTransferType !== ''">
+ <input type="checkbox" ng-checked="feed.enableFeedReplication"
+ ng-model="feed.enableFeedReplication" ng-disabled="xmlPreview.edit"/>
+ <label class="light">Enable Replication</label>
+ </div>
+ <div class="col-xs-24 plr0px" ng-if="feed.dataTransferType !== ''">
+ <div class="col-xs-12 plr0px">
+ <div class="col-xs-24 plr0px clusterBox">
+ <h3>Source(s)</h3>
+ <div ng-if="feed.dataTransferType === 'import'">
+ <feed-form-data-source></feed-form-data-source>
+ </div>
+ <div ng-if="feed.dataTransferType === 'hdfs' || feed.dataTransferType === 'hive' || feed.dataTransferType === 'export'">
+ <div class="col-xs-24 plr0px" ng-if="feed.dataTransferType === 'export'">
+ <div class="col-xs-24">
+ <label class="light">Location</label>
+ </div>
+ <label class="custom-danger" ng-show="feedForm.$submitted && !feed.sourceClusterLocationType">
+ You need to select a source location type.
+ </label>
+ <div class="col-xs-24 mt5 plr0px">
+ <div class="typeButtonsBox">
+ <div class="col-xs-6">
+ <span class="radio-inline">
+ <input type="radio" name="sourceClusterLocationType" ng-required="!feed.sourceClusterLocationType"
+ value="hdfs" ng-model="feed.sourceClusterLocationType"
+ ng-checked="feed.dataTransferType === 'hdfs' || feed.sourceClusterLocationType === 'hdfs'"/>
+ HDFS
+ </div>
+ <div class="col-xs-6">
+ <span class="radio-inline">
+ <input type="radio" name="sourceClusterLocationType" ng-required="!feed.sourceClusterLocationType"
+ value="hive" ng-model="feed.sourceClusterLocationType"
+ ng-checked="feed.dataTransferType === 'hive' || feed.sourceClusterLocationType ==='hive'"/>
+ Hive
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id="sourceClusters">
+ <div class="col-xs-24 plr0px" ng-repeat="sourceCluster in feed.clusters | filter:{type:'source'}" ng-if="$index > 0">
+ <div ng-if="feed.sourceClusterLocationType === 'hive'">
+ <feed-form-hive-storage
+ storage-info="{'clusterStorage':sourceCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, readOnly:true}"
+ required="(feed.clusters | filter:{type:'source'}).length > 1" validations="validations">
+ </feed-form-hive-storage>
+ </div>
+ <div ng-if="feed.sourceClusterLocationType === 'hdfs'">
+ <feed-form-hdfs-storage
+ storage-info="{'clusterStorage':sourceCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, readOnly:true}"
+ required="(feed.clusters | filter:{type:'source'}).length > 1" validations="validations">
+ </feed-form-hdfs-storage>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px" ng-repeat="sourceCluster in feed.clusters | filter:{type:'source'}" ng-if='$index === 0'>
+ <div ng-if="feed.sourceClusterLocationType === 'hive'">
+ <feed-form-hive-storage storage-info="{'clusterStorage':sourceCluster,'clustersList':clustersList, 'feedClusters':feed.clusters,type:'source',validationMessage:validations.messages.number}"
+ required="(feed.clusters | filter:{type:'source'}).length === 1" validations="validations"
+ add="addClusterStorage(value)" show="toggleClusterStorage(value)"
+ open-date-picker="openDatePicker(event,container)" construct-date="constructDate()">
+ </feed-form-hive-storage>
+ </div>
+ <div ng-if="feed.sourceClusterLocationType === 'hdfs'">
+ <feed-form-hdfs-storage storage-info="{'clusterStorage':sourceCluster,'clustersList':clustersList, 'feedClusters':feed.clusters,type:'source',validationMessage:validations.messages.number}"
+ required="(feed.clusters | filter:{type:'source'}).length === 1" validations="validations"
+ add="addClusterStorage(value)" show="toggleClusterStorage(value)"
+ open-date-picker="openDatePicker(event,container)" construct-date="constructDate()">
+ </feed-form-hdfs-storage>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-12 plr0px pl5">
+ <div class="col-xs-24 plr0px clusterBox"
+ ng-if="feed.dataTransferType === 'export' || feed.dataTransferType === 'import' || feed.enableFeedReplication">
+ <h3>Target(s)</h3>
+ <div ng-if="feed.dataTransferType === 'export'">
+ <feed-form-data-source></feed-form-data-source>
+ </div>
+ <div ng-if="feed.dataTransferType === 'import'">
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-24">
+ <label class="light">Location</label>
+ </div>
+ <label class="custom-danger" ng-show="feedForm.$submitted && !feed.targetClusterLocationType">
+ You need to select a target location type.
+ </label>
+ <div class="col-xs-24 mt5 plr0px">
+ <div class="typeButtonsBox">
+ <div class="col-xs-6">
+ <span class="radio-inline">
+ <input type="radio" name="targetClusterLocationType" ng-required="!feed.targetClusterLocationType"
+ value="hdfs" ng-model="feed.targetClusterLocationType"
+ ng-checked="feed.dataTransferType === 'hdfs' || feed.targetClusterLocationType === 'hdfs'"/>
+ HDFS
+ </div>
+ <div class="col-xs-6">
+ <span class="radio-inline">
+ <input type="radio" name="targetClusterLocationType" ng-required="!feed.targetClusterLocationType"
+ value="hive" ng-model="feed.targetClusterLocationType"
+ ng-checked="feed.dataTransferType === 'hive' || feed.targetClusterLocationType ==='hive'"/>
+ Hive
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id="sourceClusters">
+ <div class="col-xs-24 plr0px" ng-repeat="sourceCluster in feed.clusters | filter:{type:'source'}" ng-if="$index > 0">
+ <div ng-if="feed.targetClusterLocationType === 'hive'">
+ <feed-form-hive-storage
+ storage-info="{'clusterStorage':sourceCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, readOnly:true}"
+ required="(feed.clusters | filter:{type:'source'}).length > 1" validations="validations">
+ </feed-form-hive-storage>
+ </div>
+ <div ng-if="feed.targetClusterLocationType === 'hdfs'">
+ <feed-form-hdfs-storage
+ storage-info="{'clusterStorage':sourceCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, readOnly:true}"
+ required="(feed.clusters | filter:{type:'source'}).length > 1" validations="validations">
+ </feed-form-hdfs-storage>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px" ng-repeat="sourceCluster in feed.clusters | filter:{type:'source'}" ng-if='$index === 0'>
+ <div ng-if="feed.targetClusterLocationType === 'hive'">
+ <feed-form-hive-storage storage-info="{'clusterStorage':sourceCluster,'clustersList':clustersList, 'feedClusters':feed.clusters,type:'source',validationMessage:validations.messages.number}"
+ required="(feed.clusters | filter:{type:'source'}).length === 1" validations="validations"
+ add="addClusterStorage(value)" show="toggleClusterStorage(value)"
+ open-date-picker="openDatePicker(event,container)" construct-date="constructDate()">
+ </feed-form-hive-storage>
+ </div>
+ <div ng-if="feed.targetClusterLocationType === 'hdfs'">
+ <feed-form-hdfs-storage storage-info="{'clusterStorage':sourceCluster,'clustersList':clustersList, 'feedClusters':feed.clusters,type:'source',validationMessage:validations.messages.number}"
+ required="(feed.clusters | filter:{type:'source'}).length === 1" validations="validations"
+ add="addClusterStorage(value)" show="toggleClusterStorage(value)"
+ open-date-picker="openDatePicker(event,container)" construct-date="constructDate()">
+ </feed-form-hdfs-storage>
+ </div>
+ </div>
+ </div>
+
+ <div ng-if="feed.enableFeedReplication && (feed.dataTransferType === 'hdfs' || feed.dataTransferType === 'hive')">
+ <div id="targetClusters">
+ <div class="col-xs-24 plr0px" ng-repeat="targetCluster in feed.clusters | filter:{type:'target'}" ng-if='$index > 0'>
+ <div ng-if="feed.targetClusterLocationType === 'hive'">
+ <feed-form-hive-storage
+ storage-info="{'clusterStorage':targetCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, readOnly:true}"
+ required="feed.enableFeedReplication && (feed.clusters | filter:{type:'target'}).length > 1"
+ validations="validations">
+ </feed-form-hive-storage>
+ </div>
+ <div ng-if="feed.targetClusterLocationType === 'hdfs'">
+ <feed-form-hdfs-storage
+ storage-info="{'clusterStorage':targetCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, readOnly:true}"
+ required="feed.enableFeedReplication && (feed.clusters | filter:{type:'target'}).length > 1"
+ validations="validations">
+ </feed-form-hdfs-storage>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px" ng-repeat="targetCluster in feed.clusters | filter:{type:'target'}" ng-if='$index === 0'>
+ <div ng-if="feed.targetClusterLocationType === 'hive'">
+ <feed-form-hive-storage
+ storage-info="{'clusterStorage':targetCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters, type:'target'}"
+ validations="validations" add="addClusterStorage(value)"
+ required="feed.enableFeedReplication && (feed.clusters | filter:{type:'target'}).length === 1"
+ show="toggleClusterStorage(value)" open-date-picker="openDatePicker(event,container)"
+ construct-date="constructDate()">
+ </feed-form-hive-storage>
+ </div>
+ <div ng-if="feed.targetClusterLocationType === 'hdfs'">
+ <feed-form-hdfs-storage
+ storage-info="{'clusterStorage':targetCluster, 'clustersList':clustersList, 'feedClusters':feed.clusters,type:'target'}"
+ validations="validations" add="addClusterStorage(value)"
+ required="feed.enableFeedReplication && (feed.clusters | filter:{type:'target'}).length === 1"
+ show="toggleClusterStorage(value)" open-date-picker="openDatePicker(event,container)"
+ construct-date="constructDate()">
+ </feed-form-hdfs-storage>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px" ng-if="feed.dataTransferType !== ''">
+ <div class="col-xs-12 plr0px clusterBoxEndLine">
</div>
- <div class="col-xs-8">
- <label class="light">Permissions</label>
- <input type="text" class="form-control" validation-message="{{validations.messages.acl.permission}}"
- ng-required="true"
- ng-pattern="validations.patterns.unixPermissions"
- ng-model="feed.ACL.permission"/>
+ <div class="col-xs-12 plr0px pl5"
+ ng-if="feed.dataTransferType === 'export' || feed.dataTransferType === 'import' || feed.enableFeedReplication">
+ <div class="col-xs-24 plr0px clusterBoxEndLine">
+ </div>
</div>
+ </div>
+
+ <div class="col-xs-24 frequencyBox plr0px">
+ <div class="col-xs-24">
+ <label>Frequency</label>
+ </div>
+ <div class="col-xs-24">
+ <label class="light">Repeat Every<mandatory-field></mandatory-field></label>
+ </div>
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-2">
+ <input type="text"
+ name="frequencyQuantity"
+ ng-model="feed.frequency.quantity"
+ ng-pattern="validations.patterns.twoDigits"
+ ng-keydown="validations.acceptOnlyNumber($event)"
+ ng-keyup="checkMininumFrequency(feed.frequency.quantity, feed.frequency.unit, feedForm.frequencyQuantity)"
+ class="form-control"
+ ng-required="true"
+ validation-message="{{validations.messages.number}}" />
+ </div>
+ <div class="col-xs-6">
+ <select ng-model="feed.frequency.unit" class="form-control padding0" ng-required="true"
+ ng-change="checkMininumFrequency(feed.frequency.quantity, feed.frequency.unit, feedForm.frequencyQuantity)">
+ <option selected value="minutes">minutes</option>
+ <option value="hours">hours</option>
+ <option value="days">days</option>
+ <option value="months">months</option>
+ </select>
+ </div>
+ </div>
+ <div class="col-xs-24 custom-danger" ng-if="!isFrequencyValid">{{validations.messages.frequency.minimum}}</div>
+
+ <div class="col-xs-24">
+ <label class="light">Timezone<mandatory-field></mandatory-field></label>
+ </div>
+ <div class="col-xs-8">
+ <time-zone-select ng-model="feed.timezone"></time-zone-select>
+ </div>
+ </div>
+
+ <div class="col-xs-24 advancedOption" ng-click="expandOptions = !expandOptions" id="feedAdvancedOption">
+ <label class="mt15 pointer blink-success">ADVANCED OPTIONS</label>
+ <i class="glyphicon glyphicon-chevron-down mt15" ng-if="!expandOptions"></i>
+ <i class="glyphicon glyphicon-chevron-up mt15" ng-if="expandOptions"></i>
+ </div>
- <div class="col-xs-24"><h4 class="tittle-in-row">Schema</h4></div>
- <div class="col-xs-12">
- <label class="light">Location</label>
+ <div id="advancedOptionsBox" class="col-xs-24 plr0px" ng-class="{expanded:expandOptions}">
+ <div class="col-xs-24"><label>Job Details</label></div>
+ <div class="col-xs-24 plr0px">
+ <div ng-repeat="property in feed.properties track by $index">
+ <div ng-if="property.key === 'queueName'">
+ <div class="col-xs-4">
+ <label class="light">Queue Name</label>
+ <input type="text" class="form-control"
+ ng-model="property.value" />
+ </div>
+ </div>
+ <div ng-if="property.key === 'jobPriority'">
+ <div class="col-xs-4">
+ <label class="light">Job Priority</label>
+ <select ng-model="property.value" class="form-control padding0">
+ <option value="" disabled selected style='display:none;'>-Select job-</option>
+ <option value="VERY_HIGH">Very high</option>
+ <option value="HIGH">High</option>
+ <option value="NORMAL">Normal</option>
+ <option value="LOW">Low</option>
+ <option value="VERY_LOW">Very Low</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-4">
+ <label class="col-xs-24 light plr0px">Late Arrival Cutoff</label>
+ <input type="text" class="col-xs-4" ng-keydown="validations.acceptOnlyNumber($event)"
+ ng-model="feed.lateArrival.cutOff.quantity"
+ ng-pattern="validations.patterns.twoDigits"/>
+ <select
+ ng-model="feed.lateArrival.cutOff.unit" class="col-xs-offset-1 col-xs-19">
+ <option value="" disabled selected style='display:none;'>-Select unit-</option>
+ <option value="minutes">minutes</option>
+ <option value="hours">hours</option>
+ <option value="days">days</option>
+ <option value="months">months</option>
+ </select>
+ </div>
+ <div class="col-xs-4">
+ <label class="light">Availability Flag</label>
+ <input type="text" class="form-control"
+ ng-model="feed.availabilityFlag"
+ validation-optional-message="{{validations.messages.value}}"
+ ng-pattern="validations.patterns.alpha">
+ </div>
+ </div>
+
+ <label class="col-xs-24">Performance & Throttling - Distributed Copy</label>
+
+ <div class="col-xs-24 plr0px">
+ <div ng-repeat="property in feed.properties track by $index">
+ <div ng-if="property.key === 'mapBandwidthKB'">
+ <div class="col-xs-4">
+ <label class="light">Max Bandwidth</label>
+ <input type="text" class="form-control"
+ ng-model="property.value">
+ </div>
+ </div>
+ <div ng-if="property.key === 'maxMaps'">
+ <div class="col-xs-4">
+ <label class="light">Max map jobs</label>
+ <input type="text" class="form-control"
+ ng-model="property.value">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24 plr0px">
+ <div ng-repeat="property in feed.properties track by $index">
+ <div ng-if="property.key === 'parallel'">
+ <div class="col-xs-4">
+ <label class="col-xs-24 light plr0px">Parallel</label>
+ <input type="text" class="form-control"
+ ng-model="property.value">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-xs-24"><label>Access Control List</label></div>
+ <div class="col-xs-24 plr0px">
+ <div class="col-xs-8">
+ <label class="light">Owner<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" validation-message="{{validations.messages.acl.owner}}"
+ ng-required="true"
+ ng-pattern="validations.patterns.unixId"
+ ng-model="feed.ACL.owner"/>
+ </div>
+ <div class="col-xs-8">
+ <label class="light">Group<mandatory-field></mandatory-field></label>
+ <input type="text" class="form-control" validation-message="{{validations.messages.acl.group}}"
+ ng-required="true"
+ ng-pattern="validations.patterns.unixId"
+ ng-model="feed.ACL.group"/>
+ </div>
+ <div class="col-xs-24">
+ <div class="col-xs-8 plr0px">
+ <label class="light">Permissions<mandatory-field></mandatory-field></label>
+ <acl-permissions acl-model="feed.ACL.permission"></acl-permissions>
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-24"><label>Feed Schema</label></div>
+ <div class="col-xs-8">
+ <label class="light" tooltip="feed.schema.location">Location<mandatory-field></mandatory-field></label>
<input type="text" class="form-control" validation-message="{{validations.messages.location}}"
ng-maxlength="200"
ng-pattern="validations.patterns.osPath"
- ng-model="feed.schema.location"
- ng-required="true"/>
+ ng-model="feed.schema.location"/>
</div>
- <div class="col-xs-12">
- <label class="light">Provider</label>
+ <div class="col-xs-8">
+ <label class="light" tooltip="feed.schema.provider">Provider<mandatory-field></mandatory-field></label>
<input type="text" class="form-control" validation-message="{{validations.messages.provider}}"
ng-pattern="validations.patterns.osPath"
- ng-model="feed.schema.provider"
- ng-required="true"/>
+ ng-model="feed.schema.provider"/>
</div>
+ <div class="col-xs-8"></div>
+ </div>
-
- <div class="col-xs-24 mt20">
- <button id="feed.step1" class="btn nextBtn col-xs-6 pull-right"
- ng-disabled="buttonSpinners.show"
- ng-click="goNext(feedForm.$invalid, 'forms.feed.properties')">
- Next <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
- </button>
- <a class="pull-right" ui-sref="main">
- Cancel
- </a>
+ <div class="col-xs-24 pb15px mt35">
+ <div class="pull-right">
+ <a class="btn cnclBtn" ui-sref="main">
+ CANCEL
+ </a>
+ <button id="feed.step1" class="btn nextBtn"
+ ng-disabled="buttonSpinners.show"
+ ng-click="goNext(feedForm.$invalid)"
+ scroll-to-error>
+ NEXT <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+ </button>
+ <button id="feed.step5" class="btn nextBtn" ng-click="saveEntity(feedForm.$invalid)"
+ ng-disabled="feedForm.$invalid || buttonSpinners.saveShow">
+ SAVE <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.saveShow" />
+ </button>
+ </div>
</div>
-</form>
\ No newline at end of file
+</form>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormLocationStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormLocationStepTpl.html b/falcon-ui/app/html/feed/feedFormLocationStepTpl.html
index 7c7355e..aefe7c0 100644
--- a/falcon-ui/app/html/feed/feedFormLocationStepTpl.html
+++ b/falcon-ui/app/html/feed/feedFormLocationStepTpl.html
@@ -20,9 +20,11 @@
<form name="feedForm" novalidate id="feedFormLocationStep">
<div class="col-xs-24 locationStep">
<div class="row">
- <div class="col-xs-24 feedLocationNavBox">
- <h4 class="col-xs-10" ng-show="feed.storage.fileSystem.active">Default Storage type </h4>
- <h4 class="col-xs-10" ng-show="feed.storage.catalog.active"> Storage type </h4>
+ <div class="col-xs-24 feedLocationNavBox plr0px mt15">
+ <span class="col-xs-10" ng-show="feed.storage.fileSystem.active"
+ tooltip="feed.location.storageType">Default Storage Type</span>
+ <span class="col-xs-10" ng-show="feed.storage.catalog.active"
+ tooltip="feed.location.storageType">Storage Type</span>
<div class="col-xs-14 feedLocationNav">
<button type="button"
@@ -41,13 +43,13 @@
</div>
<div class="clearfix"></div>
</div>
- <h4 class="col-xs-12">Default Location</h4>
+ <div class="col-xs-24"><label class="mt15">DEFAULT LOCATION</label></div>
<div class="col-xs-24">
<div ng-show="feed.storage.fileSystem.active"
ng-repeat="location in feed.storage.fileSystem.locations" class="row">
<div class="col-xs-8">
- <label class="light">{{capitalize(location.type)}} path</label>
+ <label class="light">{{capitalize(location.type)}} Path<mandatory-field></mandatory-field></label>
</div>
<div class="pull-right" ng-show="location.focused">
<label class="light">add</label>
@@ -59,10 +61,10 @@
<div class="clearfix hidden-md"></div>
<div class="col-xs-24">
<input type="text" class="form-control" validation-message="{{validations.messages.path}}"
- ng-required="true"
+ ng-required="feed.storage.fileSystem.active"
ng-model="location.path"
ng-pattern="validations.patterns.osPath"
- ng-class="{firstInput: $index === 0}"
+ focus-if="feed.storage.fileSystem.active && $index === 0"
ng-focus="location.focused = true"/>
</div>
</div>
@@ -71,12 +73,12 @@
<div ng-show="feed.storage.catalog.active">
<div class="col-xs-8">
- <label class="light">Table uri</label>
+ <label class="light">Table uri<mandatory-field></mandatory-field></label>
</div>
<div class="pull-right" ng-show="feed.storage.catalog.catalogTable.focused">
<label class="light">add</label>
- <label ng-repeat="timeVariable in ['${YEAR}', '${MONTH}', '${DAY} ', '${HOUR}']"
+ <label ng-repeat="timeVariable in ['${YEAR}', '${MONTH}', '${DAY}', '${HOUR}']"
ng-click="appendVariable(timeVariable, feed.storage.catalog.catalogTable, 'uri')">
{{timeVariable}}
</label>
@@ -87,27 +89,27 @@
ng-model="feed.storage.catalog.catalogTable.uri"
ng-pattern="validations.patterns.tableUri"
ng-required="feed.storage.catalog.active" validation-message="{{validations.messages.path}}"
+ focus-if="feed.storage.catalog.active"
ng-focus="feed.storage.catalog.catalogTable.focused = true"/>
</div>
</div>
</div>
-
- <div class="row">
- <div class="col-xs-24 mt20">
- <button type="button"
- id="feed.backToStep2" class="btn prevBtn"
- ng-click="goBack('forms.feed.properties')"
- ng-disabled="buttonSpinners.backShow">
- Previous <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow" />
- </button>
- <button id="feed.step3" class="btn nextBtn pull-right" ng-click="goNext(feedForm.$invalid, 'forms.feed.clusters')" >
- Next <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
- </button>
- <a class="pull-right" ui-sref="main">
- Cancel
+ <div class="col-xs-24 mt35 pb15px pl0px">
+ <button type="button"
+ id="feed.backToStep2" class="btn prevBtn"
+ ng-click="goBack()"
+ ng-disabled="buttonSpinners.backShow">
+ PREVIOUS <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow" />
+ </button>
+ <div class="pull-right">
+ <a class="btn cnclBtn" ui-sref="main">
+ CANCEL
</a>
+ <button id="feed.step3" class="btn nextBtn" ng-click="goNext(feedForm.$invalid)" scroll-to-error>
+ NEXT <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
+ </button>
</div>
</div>
</div>
-</form>
\ No newline at end of file
+</form>
http://git-wip-us.apache.org/repos/asf/falcon/blob/76dc2e18/falcon-ui/app/html/feed/feedFormPropertiesStepTpl.html
----------------------------------------------------------------------
diff --git a/falcon-ui/app/html/feed/feedFormPropertiesStepTpl.html b/falcon-ui/app/html/feed/feedFormPropertiesStepTpl.html
index 2e4cfd1..e2a4a44 100644
--- a/falcon-ui/app/html/feed/feedFormPropertiesStepTpl.html
+++ b/falcon-ui/app/html/feed/feedFormPropertiesStepTpl.html
@@ -19,143 +19,132 @@
-->
<form name="feedForm" novalidate id="feedFormPropertiesStep">
- <h5 class="col-xs-24 mb10">Timing</h5>
-
- <div class="col-xs-9 inlineInputsGroup">
- <div class="light">Frequency</div>
- <span>Every</span>
- <input type="text" class="form-control" validation-message="{{validations.messages.number}}"
+ <div class="col-xs-24">
+ <label class="light" tooltip="feed.properties.frequency">
+ Frequency Every<mandatory-field></mandatory-field>
+ </label>
+ <div class="row dynamic-table-spacer">
+ <div class="col-xs-10">
+ <input type="text" class="form-control" validation-message="{{validations.messages.number}}"
ng-model="feed.frequency.quantity" autofocus
ng-required="true"
ng-keydown="validations.acceptOnlyNumber($event)"
ng-pattern="validations.patterns.twoDigits"/>
-
- <select
- ng-model="feed.frequency.unit"
- ng-required="true">
- <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="col-xs-9 inlineInputsGroup">
- <div class="light"><input type="checkbox" ng-model="feed.lateArrival.active" />Late Arrival</div>
- <span>Up to</span>
-
- <input type="text" class="form-control" ng-keydown="validations.acceptOnlyNumber($event)"
- ng-model="feed.lateArrival.cutOff.quantity"
- ng-disabled="!feed.lateArrival.active"
- ng-pattern="validations.patterns.twoDigits"
- ng-required="feed.lateArrival.active"/>
-
- <select
- ng-model="feed.lateArrival.cutOff.unit" ng-disabled="!feed.lateArrival.active"
- ng-required="feed.lateArrival.active">
- <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="col-xs-6 inlineInputsGroup">
- <div class="light">Availability Flag</div>
- <input type="text" id="availInput" class="form-control"
- ng-model="feed.availabilityFlag"
- ng-pattern="validations.patterns.alpha">
- </div>
- </div>
-
- <div class="col-xs-24">
- <div class="row mt20">
- <label class="col-xs-5 light">Timezone</label>
- <time-zone-select ng-model="feed.timezone" class="col-xs-19"></time-zone-select>
-
- <h5 class="col-xs-24">Properties</h5>
-
- <div class="col-xs-5">
- <label class="light">Name</label>
- </div>
- <div class="col-xs-19">
- <label class="light">Value</label>
- </div>
- <div class="col-xs-24" id="feedPropertiesBox">
- <div ng-repeat="property in feed.properties" class="row">
-
- <label class="col-xs-5">{{property.key}}</label>
-
- <div class="col-xs-19" ng-if="property.key !== 'timeout' && property.key !== 'jobPriority'">
- <input type="text" class="form-control" placeholder="{{propPlaceholders[property.key]}}"
- ng-model="property.value" validation-optional-message="{{validations.messages.value}}"
- ng-pattern="validations.patterns.alpha"/>
</div>
- <div class="col-xs-19 inlineInputsGroup" ng-if="property.key === 'timeout'">
- At
- <input type="text" class="form-control" ng-keydown="validations.acceptOnlyNumber($event)"
- ng-model="property.value.quantity"
- ng-pattern="validations.patterns.twoDigits"/>
+ <div class="col-xs-11">
<select
- ng-model="property.value.unit">
- <option value="" disabled selected style='display:none;'>-Select timeout-</option>
- <option value="minutes">minutes</option>
- <option value="hours">hours</option>
- <option value="days">days</option>
- <option value="months">months</option>
- </select>
+ ng-model="feed.frequency.unit"
+ ng-required="true">
+ <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="col-xs-19" ng-if="property.key === 'jobPriority'">
- <select ng-model="property.value" class="form-control padding0">
- <option value="" disabled selected style='display:none;'>-Select job-</option>
- <option value="VERY_HIGH">Very high</option>
- <option value="HIGH">High</option>
- <option value="NORMAL">Normal</option>
- <option value="LOW">Low</option>
- <option value="VERY_LOW">Very Low</option>
- </select>
+ <div class="col-xs-3">
</div>
</div>
- </div>
- <div class="col-xs-24">
- <div ng-repeat="property in feed.customProperties" class="row">
- <div class="col-xs-5 mt10">
- <input type="text" class="form-control" placeholder="key"
- ng-model="property.key" validation-optional-message="{{validations.messages.key}}"
- ng-pattern="validations.patterns.alpha"
- ng-required="property.value"/>
- </div>
-
- <div class="col-xs-15 mt10">
- <input type="text" class="form-control" placeholder="value"
- ng-model="property.value" validation-optional-message="{{validations.messages.value}}"
- ng-pattern="validations.patterns.alpha"
- ng-required="property.key"/>
+ </div>
+ <div class="col-xs-24">
+ <input type="checkbox" ng-model="feed.lateArrival.active" class="labelCheckBox" />
+ <label class="light" tooltip="feed.properties.lateArrival">
+ Late Arrival Upto<mandatory-field></mandatory-field>
+ </label>
+ <div class="row dynamic-table-spacer">
+ <div class="col-xs-10">
+ <input type="text" class="form-control" ng-keydown="validations.acceptOnlyNumber($event)"
+ ng-model="feed.lateArrival.cutOff.quantity"
+ ng-disabled="!feed.lateArrival.active"
+ ng-pattern="validations.patterns.twoDigits"
+ ng-required="feed.lateArrival.active"/>
</div>
- <div class="col-xs-4 mt10">
- <button type="button" class="btn btn-default btn-xs mt1" ng-click="removeCustomProperty($index)" ng-if="$index>0">
- <span class="entypo minus"></span> delete
- </button>
+ <div class="col-xs-11">
+ <select
+ ng-model="feed.lateArrival.cutOff.unit" ng-disabled="!feed.lateArrival.active"
+ ng-required="feed.lateArrival.active">
+ <option selected value="minutes">minutes</option>
+ <option value="hours">hours</option>
+ <option value="days">days</option>
+ <option value="months">months</option>
+ </select>
</div>
+ </div>
+ </div>
+ <div class="col-xs-24">
+ <label class="light" tooltip="feed.properties.availabilityIndicator">
+ Availability Indicator<mandatory-field></mandatory-field>
+ </label>
+ <div class="row dynamic-table-spacer">
+ <div class="col-xs-10">
+ <input type="text" id="availInput" class="form-control" ng-model="feed.availabilityFlag"
+ ng-pattern="validations.patterns.alpha"
+ validation-message="{{validations.messages.availabilityFlag}}"
+ ng-required="true">
+ </div>
</div>
- </div>
- <div class="col-xs-24 mt10">
- <button type="button" class="btn btn-default btn-xs" ng-click="addCustomProperty()">
- <span class="entypo plus"></span> add property
- </button>
- </div>
</div>
- </div>
- <div class="col-xs-24 mt20">
- <button id="feed.backToStep1" class="btn prevBtn" type="button"
- ng-click="goBack('forms.feed.general')"
- ng-disabled="buttonSpinners.backShow">
- Previous <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow" />
- </button>
- <button id="feed.step2" class="btn nextBtn pull-right" ng-click="goNext(feedForm.$invalid, 'forms.feed.location')">
- Next <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show" />
- </button>
- <a class="pull-right" ui-sref="main">
- Cancel
- </a>
- </div>
-</form>
\ No newline at end of file
+ <div class="col-xs-24">
+ <label class="light" tooltip="feed.properties.timezone">Timezone<mandatory-field></mandatory-field></label>
+ <div class="row dynamic-table-spacer">
+ <div class="col-xs-24">
+ <time-zone-select ng-model="feed.timezone" required="true"></time-zone-select>
+ </div>
+ </div>
+ </div>
+ <div class="col-xs-24"><label class="mt15">PROPERTIES</label></div>
+ </div>
+ <div class="col-xs-24 plr0px mt10">
+ <table class="table properties">
+ <thead>
+ <tr>
+ <th class="no-border-bottom col-xs-4">Name</th>
+ <th class="no-border-bottom col-xs-20">Value</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="property in feed.properties" class="">
+ <td class="no-border-top font11px">{{feedPropertiesLabels[property.key]}}</td>
+ <td class="no-border-top"><div ng-if="property.key !== 'timeout' && property.key !== 'jobPriority'">
+ <input type="text" class="form-control" placeholder="{{propPlaceholders[property.key]}}" ng-model="property.value" validation-optional-message="{{validations.messages.value}}" ng-pattern="validations.patterns.alpha">
+ </div>
+ <div class="col-xs-24 plr0px" ng-if="property.key === 'timeout'">
+ <span class="col-xs-1 plr0px pt5px pb5px">at</span>
+ <input type="text" class="col-xs-2 feedFormInputBorder" ng-keydown="validations.acceptOnlyNumber($event)" ng-model="property.value.quantity" ng-pattern="validations.patterns.twoDigits">
+ <div class="col-xs-1"></div>
+ <select ng-model="property.value.unit" class="col-xs-4">
+ <option value="" disabled="" selected="" style="display:none;">-Select timeout-</option>
+ <option value="minutes">minutes</option>
+ <option value="hours">hours</option>
+ <option value="days">days</option>
+ <option value="months">months</option>
+ </select>
+ </div>
+ <div class="" ng-if="property.key === 'jobPriority'">
+ <select ng-model="property.value" class="form-control padding0">
+ <option value="" disabled="" selected="" style="display:none;">-Select job-</option>
+ <option value="VERY_HIGH">Very high</option>
+ <option value="HIGH">High</option>
+ <option value="NORMAL">Normal</option>
+ <option value="LOW">Low</option>
+ <option value="VERY_LOW">Very Low</option>
+ </select>
+ </div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <div class="col-xs-24 mt35 pb15px plr0px">
+ <button id="feed.backToStep1" class="btn prevBtn" type="button" ng-click="goBack()" ng-disabled="buttonSpinners.backShow">
+ PREVIOUS <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.backShow">
+ </button>
+ <div class="pull-right">
+ <a class="btn cnclBtn" ui-sref="main">
+ CANCEL
+ </a>
+ <button id="feed.step2" class="btn nextBtn" ng-click="goNext(feedForm.$invalid)" scroll-to-error>
+ NEXT <img src="css/img/ajax-loader.gif" ng-if="buttonSpinners.show">
+ </button>
+ </div>
+ </div>
+</form>