http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/services/workspace-manager.js ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/services/workspace-manager.js b/contrib/views/wfmanager/src/main/resources/ui/app/services/workspace-manager.js new file mode 100644 index 0000000..f5eb6e7 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/services/workspace-manager.js @@ -0,0 +1,62 @@ +/* +* 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. +*/ + +import Ember from 'ember'; + +export default Ember.Service.extend({ + tabsInfo : {}, + workInProgress : {}, + setLastActiveTab(tabId){ + console.log("setting last active tabId "+tabId); + localStorage.setItem('lastActiveTab', tabId); + }, + getLastActiveTab(){ + console.log("get last active "+localStorage.getItem('lastActiveTab')); + return localStorage.getItem('lastActiveTab'); + }, + restoreTabs(){ + var tabs = localStorage.getItem('tabsInfo'); + console.log("Restoring tabs "+tabs); + return JSON.parse(tabs); + }, + saveTabs(tabs){ + if(!tabs){ + return; + } + var tabArray = []; + tabs.forEach((tab)=>{ + tabArray.push({ + type : tab.type, + id : tab.id, + name : tab.name + }); + }); + console.log("Saving tabs "+JSON.stringify(tabArray)); + localStorage.setItem('tabsInfo', JSON.stringify(tabArray)); + }, + restoreWorkInProgress(id){ + console.log("Restoring workInProgress "+id); + return localStorage.getItem(id); + }, + saveWorkInProgress(id, workInProgress){ + console.log("Restoring workInProgress "+id); + localStorage.setItem(id, workInProgress); + }, + deleteWorkInProgress(id){ + localStorage.removeItem(id); + } +});
http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/styles/app.less ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/styles/app.less b/contrib/views/wfmanager/src/main/resources/ui/app/styles/app.less new file mode 100644 index 0000000..5d1b3a3 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/styles/app.less @@ -0,0 +1,1497 @@ +/* + * 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. + */ + +@bgColor: #eee; +@bgGreenActive: #5bb75b; +@moduleHeaderBgColor: #fafafa; +@nodeDefaultHeight: 40px; +@nodeDefaultWidth: 40px; +@defaultRed: red; +@defaultBorderRadius: 5px; +@nodeActionBgColor: #E5E5E5; +@defaultPropertiesEditorHeight: 350px; + +body { + background: @bgColor; + padding: 0; + margin: 0; +} +a { + color: #000; +} +.padding0 { + padding: 0px; +} +.paddingtop7{ + padding-top:7px; +} +.paddingtop8{ + padding-top:7px; +} +.paddingbottom8{ + padding-bottom:7px; +} +.paddingtop10{ + padding-top:10px; +} +.padding10{ + margin-top: 10px; +} +.padding20{ + margin-top: 20px; +} +.marginleft20{ + margin-left: 20px !important; +} +.paddingright10{ + padding-right: 10px; +} +.marginright5{ + margin-right: 5px !important; +} +#arrow{ + top: 24%; + left: -22px; + margin-top: -11px; + border-right-color: #999 !important; + border-right-color: rgba(0, 0, 0, .25); + border-left-width: 0; + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + border-width: 11px; +} + +.container-custom { + background-color: @moduleHeaderBgColor; +} + +.disabled { + cursor:none; +} +#header { + white-space: nowrap; + background: @bgGreenActive; + background-position: 10px; + color: yellow; + height: 50px; + padding: 10px; + font-size: 20px; +} +.branch{ + padding: 0px !important; + border: 0px !important; + background: inherit !important; +} + +.branch input { + border: 0px; + text-align: center; +} + +#designer { + position: relative; +} + +#wf_title { + border-bottom: 1px dotted #000; +} + +.editable { + padding: 5px 10px; + border: 1px solid transparent; + background: transparent; + white-space: nowrap; + text-align: left; + margin: 0 2px; +} + +.editable:focus, +.editable:hover { + border: 1px solid #999; + background: #fff; + cursor: text; +} + +.action { + float: left; + padding: 5px; + margin: 2px; + height: 60px; + line-height: 50px; + width: 62px; + font-size: small; + overflow: hidden; + text-align: center; +} + +.node, +.actions_list_left li:hover { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */ + background: #ffffff; +} + +.node { + text-align: center; + position: absolute; + left: 50%; + border: 1px solid #bbb; + overflow: visible; + background: transparent; + border: none; +} + +.node-item{ + background:#e5e5e5; + border: 1px solid #ABABAB; + z-index:4; + +} + +.action_node { + min-width: 195px; +} + +.fork, +.join { + border-radius: 70px; + width: @nodeDefaultWidth; + height: @nodeDefaultHeight; + white-space: wrap; + padding-top: 10px; +} + +.start, +.end { + border-radius: 60px; + width: @nodeDefaultWidth; + height: @nodeDefaultHeight; + background: #fff; + line-height: 25px; + cursor: not-allowed; +} + +.start { + top: 20px; + padding-left: 7px; + padding-top: 6px; +} +.kill{ + border-radius: @defaultBorderRadius; + min-width: 178px; + height: @nodeDefaultHeight; +} +.kill .fa-ban { + color: @defaultRed; +} +.hrClass{ + margin-bottom: 10px; + margin-top: 10px; +} + +.kill-name{ + padding-left: 40px; + margin-top: -35px; +} + +.node .editable { + padding: 2px 5px; + width: 8em; + text-align: center; +} + +.node .error{ + border: 1px solid #a94442; +} + +.connector_overlay { + transition: all .3s ease-in; + white-space: nowrap; + opacity: .8; + border: 1px solid #ddd; + background: #1a8cff; + border-radius: 30px; + width: 30px; + height: 30px; + line-height: 28px; + text-align: center; + cursor: pointer; + transform: scale(0.8); + +} + +.jsplumb-hover .connector_overlay, +.connector_overlay:hover { + opacity: 1; +} + +.node_actions { + transition: opacity 1s ease-in; + opacity: 0; + position: absolute; + white-space: nowrap; + border: 1px solid #999; + background: @nodeActionBgColor; + border-radius: 3px; + min-width: 20px; + height: 28px; + cursor: pointer; +} +.node_actions i{ + padding: 5px; +} +.node_properties { + border-radius: 30px; + cursor: pointer; +} +.node_properties:hover { + cursor: pointer; +} +.decision_node .node_properties { + margin-top: -16px; +} +.decisionNodeError{ + position: relative; + left: 50px; + } +.action-node { + border-radius: @defaultBorderRadius; + height: 38px; +} +.node_left .fa-trash-o{ + color: @defaultRed; +} +.node_left { + right: -45px; + top: -61%; +} +.decision_node .node_left{ + transform: rotate(315deg) scale(1.4); + right: -50px; + top: -126%; +} +.nodeEnd{ + top:15%; + position: relative; +} +.nodeStart{ + right:5%; + position: relative; +} +.node_bottom { + bottom: 50%; + left: 50%; + z-index: 5; + transform: translate(-50%, -20%) scale(0.8); + opacity: 1; + border-radius: 3px; + width: 40px; + height: 24px; +} +.fork .node_bottom { + top: 80%; +} +.node_bottom_actions{ + position: absolute; + background: @nodeActionBgColor; + white-space: nowrap; +} +.node:hover .node_actions { + opacity: 1; +} + +.action_node { + border-radius: 4px; +} + +input:invalid { + border: 1px solid @defaultRed; +} + +.fa-exclamation-triangle { + color: @defaultRed; +} + +.actions_list_left { + list-style: none; + padding: 0; + margin: 0; +} + +.actions_list_left li.disabled { + cursor: not-allowed; + background: #eee; + color: #ccc; +} + +.actions_list_left li { + background: #fff; + width: 60px; + padding: 10px; + border: 1px solid silver; + border-radius: @defaultBorderRadius; + margin: 2px 0; + cursor: move; + z-index: 1000; + display: inline-block; + position: relative; + text-align: center; +} + +.control_flow_node, +.control_flow li:hover { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fdfeea+0,e8f135+100 */ + /*background: #fdfeea;*/ + /* Old browsers */ + /*background: -moz-linear-gradient(top, #fdfeea 0%, #e8f135 100%);*/ + /* FF3.6-15 */ + /*background: -webkit-linear-gradient(top, #fdfeea 0%, #e8f135 100%);*/ + /* Chrome10-25,Safari5.1-6 */ + /*background: linear-gradient(to bottom, #fdfeea 0%, #e8f135 100%);*/ + /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + /*filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fdfeea', endColorstr='#e8f135', GradientType=0);*/ + /* IE6-9 */ +} +.decision-condition { + white-space: nowrap; + width: 10em; + overflow: hidden; + text-overflow: ellipsis; + border: 1px solid #D0D0D0; + border-radius: 3px; + background-color: #F5F5F5; + padding: 3px; + font-size: 11px; + opacity: 0.8; +} +.decision_node { + transform: rotate(45deg) scale(.7); + width: 60px; + height: 60px; + padding: 5px; + float: right; + margin: 0 2px; +} +.decision-data-wrapper{ + transform: rotate(-45deg) scale(1.3); ; +} +.decision_node_data .editable{ + margin-right: 10px; +} +.decision_node_data { + padding-right: 31px; + float: right; + margin: 0 2px; +} +.fork_node_data { + float: right; + margin-top: -15px; +} +.fork_node_data .editable { + margin-right: 5px; +} +.decision_node .content { + text-align: center; + position: absolute; + padding: 0 5px; + width: 120px; + height: 70px; + transform: rotate(-45deg) scale(1.2) translate(-13%, 30%); + white-space: nowrap; +} + +.breadcrumb { + margin: 0; +} + +.collapse.width { + height: auto; + -webkit-transition: width 0.35s ease; + -moz-transition: width 0.35s ease; + -o-transition: width 0.35s ease; + transition: width 0.35s ease; +} + +.highlighter-always { + opacity: 1; + animation-name: highlighter; + animation-duration: 1s; + animation-iteration-count: infinite; + animation-timing-function: ease-out; +} + +@keyframes highlighter { + 0% { + transform: scale(1) + } + 50% { + transform: scale(1.5) + } + 100% { + transform: scale(1) + } +} + +.control_flow li._fork { + margin: 4px 8px; +} + +.control_flow li.switch { + border-radius: 0px; + transform: rotate(45deg) translate(0%, -0%) scale(.9); +} + +.action_node_data { + padding: 5px; + float: left; + margin: 0 2px; +} + +#content { + padding: 0; + margin: 0; + float: left; + position: relative; + transition: left .6s cubic-bezier(0.175, 0.885, 0.320, 1.275); +} + +.expanded { + left: 0px; +} + +.expanded:after { + content: "\f100" !important; +} + +.collapsed { + left: -215px; +} + +.title-btn, +.title-btn:hover { + border: 0; + background: transparent; +} + +.back_button { + height: 30px; + background-color: #fff; + position: relative; + margin-left: 13px; + border-radius: @defaultBorderRadius; + border: 1px solid #ccc; +} + +.back_button:before { + content: ""; + position: absolute; + top: -1px; + left: -13px; + border-style: solid; + border-width: 15px 15px 15px 0; + border-color: transparent #ccc transparent transparent; +} + +.back_button:after { + content: ""; + position: absolute; + top: 0px; + left: -12px; + border-style: solid; + border-width: 14px 14px 14px 0; + border-color: transparent #fff transparent transparent; +} + +.back_button > a { + display: block; + text-decoration: none; + text-align: center; + color: #000; + padding: 0 10px 0 5px; + line-height: 27px; + font-size: smaller; +} + +.ambari-view #header { + display: none; +} + +.ambari-view #content { + padding: 0; +} + +.ambari-view body { + background: #fff; +} + +.messageDiv { + position: absolute; + left: 40%; + top: 100px; + z-index: 1; +} + +.workflow-error { + top:50px; + left: 75%; + z-index: 1; +} + +#action_properties_dialog .modal-body { + max-height: @defaultPropertiesEditorHeight; + overflow-y: scroll; + overflow-x: hidden; +} + +#action_properties_dialog .container, +#global_properties_dialog .container { + max-width: 180%; +} + +#action_properties_dialog .blank-form { + right: 15px; + position: relative; +} + +#action_properties_dialog .modal-dialog, +#workflow_sla_dialog .modal-dialog, +#global_properties_dialog .modal-dialog, +#workflow_parameters_dialog .modal-dialog, +#workflow_credentials_dialog .modal-dialog, +#version-settings-dialog .modal-dialog, +#control-dialog .modal-dialog, +#ConfirmDialog .modal-dialog, +#killnode-manager-dialog .modal-dialog { + width: 800px; +} +#configureJob .modal-dialog{ + width: 650px; +} +#collapseOne{ + margin: 10px; +} +.panel-heading { + padding: 4px 15px; +} + +#action_properties_dialog .panel-default > .panel-heading, +#global_properties_dialog .panel-default > .panel-heading, +#workflow_sla_dialog .panel-default > .panel-heading, +#workflow_credentials_dialog .panel-default > .panel-heading, +#configureWorkfowModal .panel-default > .panel-heading, +#workflow_parameters_dialog .panel-default > .panel-heading, +#killnode-manager-dialog .panel-default > .panel-heading, + .whiteLabel, .whiteLabel:hover, .whiteLabel:focus, .whiteLabel:visited, .whiteLabel:active { + background-color: @bgGreenActive; + color: #fff; +} +.btn-primary{ + background-color: @bgGreenActive !important; + border-color: #289028 !important; + color: #fff; +} +.btn-primary:visited,.btn-primary:focus,.btn-primary:active,.btn-primary.active{ + background-color: @bgGreenActive !important; + border-color: #289028 !important; + color: #fff; +} +.btn-primary:hover{ + background-color: #289028 !important; + border-color: #289028 !important; + color: #fff; +} +._actions_popup { + padding: 4px; +} + +._actions_popup .control_flow { + padding-left: 20%; +} + +._actions_popup ul { + padding: 0; + margin: 0; +} + +._actions_popup h4 { + font-size: 10px; + font-weight: bold; + border-bottom: 1px solid #e5e5e5; + padding-bottom: 5px; +} + +._actions_popup li { + list-style: none; + float: left; + width: 53px; + height: 50px; + border: 1px solid silver; + margin: 3px; + padding: 10px; + text-align: center; + font-size: 11px; + border-radius: 6px; + cursor: pointer; +} +.labels { + width:70px; +} +.error{ + border: 2px solid @defaultRed; +} +.validated{ + border: 2px solid #4cae4c; +} +.notification { + width:40%; + left:50%; + position: relative; +} +.redColor{ + color: @defaultRed; +} +.killNode{ + width: 150px; +} +.zoom-buttons { + position: absolute; + top: 9px; + right: 2%; +} +.legend { + right: 1%; + +} +.globlaPropetiesInfo{ + width: 80%; + left: 10%; + position: relative; +} +.zoom-buttons .btn { + font-size: 8px; +} + +.requiredField { + color: @defaultRed; +} +#search-bar .twitter-typeahead { + position: inherit !important; +} +#search-bar .tt-hint { + display: none !important; +} +#search-bar .bootstrap-tagsinput { + width: 260px; + border-radius: 0px; + line-height: 20px; + vertical-align: top; + height: 30px; + overflow-y: auto; +} +#search-bar .bootstrap-tagsinput .label-info{ + background-color : @bgGreenActive; +} +#search-bar .tt-menu { + position: absolute; + top: 100%; + left: inherit !important; + z-index: 100; + border: 1px solid rgba(0,0,0,0.2); + margin-top: 7px; + background-color: white; + width: 60% !important; + padding: 0 5px; +} +#job-detail-app-path{ + overflow-x: scroll; +} + +#search-bar .search-icon { + display: inline-block; + border: 1px solid #ccc; + padding: 4px 10px; + border-left: 0px; + border-bottom-right-radius: 3px; + border-top-right-radius: 3px; +} + +#startDate, #endDate { + height: 30px; + width: 162px; +} + +.jobTitle { + height: 24px; + margin-left: 10px; + line-height: 30px; +} + +.info { + float: left; + margin-right: 20px; + color: #777; + padding-top: 4px; +} + +.pages { + margin-right: 40px; +} + +.listing-footer { + border-top: 1px solid #d2d2d2; + border-bottom: 1px solid #d2d2d2; + padding: 3px 0px; + margin: 0 0 5px 0; +} + +.page-selector { + padding: 4px 12px; + border-radius: 0px; +} + +.listing thead { + background: #f5f5f5; +} + +.listing th { + border-left : 1px solid #ddd; + border-bottom: 1px solid #ddd !important; +} + +.listing tr th:first-child { + border-left: 0; +} + +.listing > tbody > tr > td { + vertical-align: middle; + padding: 5px; + border-left: 0; + border-right: 0; +} + +.job-listing > tbody > tr > td { + border-bottom: 1px solid #ddd; +} + + +.pointer { + cursor: pointer; +} + +#job-details .nav-tabs { + background: #eee; + margin-bottom: 10px; +} + +.preview pre.prettyprint { + border: none; + background: #fff; +} + +.preview pre { + border: none; + background: #fff; +} + +.date-picker { + position: relative; +} + +.actions-col .loading-container{ + position: relative; +} + +#bulk-action-loader .loading-container{ + position: relative; +} + +.decisionNodeHandler { + left: 10%; + bottom: 30%; + position: relative; +} + +.decisionBox { + right: 10px; + top: 13%; + width:75px; + position: relative; +} + +.pages .open .dropdown-menu { + max-height: 120px; + overflow-y: scroll; + min-width : 75px; + width : 75px; +} + +#action-details .panel-heading { + padding: 10px 15px; +} + +#bulk-action-button .dropdown-menu li .fa { + margin-right: 10px; +} + +#dashboard, #dashboard .panel, .panel-heading, .panel-body { + border-radius: 0px; +} + +#job-details, #job-details .panel, .panel-heading, .panel-body { + border-radius: 0px; +} + +#dashboard .listing-error{ + text-align: center; +} + +#dashboard .panel { + border: 0; + border-bottom: 1px solid #ddd; +} + +#loading { + position: absolute; + top: 90px; + left: 0; + display: none; + width: 100vw; + height: 80vh; + overflow: hidden; + z-index: 1; +} + +.loader img { + height: 40px; + width: 50px; +} + +#search-table { + margin-bottom: 0px; +} + +#search-table .bulk-actions-buttons { + margin-left: -124px; + margin-top: 3px; + position: fixed; + transition: all .5s ease; +} + +#search-table .bulk-actions-buttons:before { + display: block; + content: ""; + width: 0; + height: 0; + left: -10px; + top: 10px; + border: 5px solid transparent; + border-right: 10px solid #666; + position: absolute; +} + +#search-table .bulk-actions-buttons.shown { + margin-left: 30px; +} + +#search-table .actions-col { + white-space: nowrap; + text-align: center; + min-width: 150px; + } + + .btn-kill:hover, + .btn-kill:focus { + background: #d9534f; + color: #fff; + border-color: @defaultRed; + } + + .actions-col .btn { + color: gray; + cursor: not-allowed; + opacity: .5; + font-size: 10px; + } + + .actions-col .btn.isOn { + color: #000; + cursor: pointer; + opacity: 1; + } + .pages .btn { + /*color: @bgGreenActive;*/ + } + + .pages .btn.disabled { + color: gray; + } + + .pages .btn-primary { + color: #fff; + } + .cbox { + width: 20px; + } + + .main-panel { + padding: 0px; + } + + #dashboard .main-panel { + padding: 5px; + } + + .first-col { + text-align: center; + } + + + +.DONEWITHERROR, +.FAILED, +.KILLED { + color: #d9534f; +} + +.RUNNING { + color: green; +} + +.PAUSED, +.PAUSEDWITHERROR, +.PREPPAUSED, +.RUNNINGWITHERROR, +.SUSPENDED, +.SUSPENDEDWITHERROR { + color: #f0ad4e; +} + +.SUCCEEDED { + color: #5cb85c; +} + +.mb0 { + margin-bottom: 0; +} + +.pb5 { + padding-bottom: 5px; +} + +.navbar-header { + width: 100%; +} + +#create-new-button { + float: right; + padding-top: 8px; +} + +.width100Per{ + width: 100%; +} +.hdfs-browse{ + max-height: 500px; + overflow: scroll; +} +#wf_title{ + margin-left: 2px; + width: 150px; + font-size: 12px; +} +.backto-dashboard{ + text-decoration: blink !important; +} +.file-upload-control input[type="file"]{ + width: 200px; + display: inline; + border: 1px solid #ccc; +} +.file-upload-control input[type="button"], input[type="submit"], input[type="reset"], input[type="file"]::-webkit-file-upload-button, button { + padding: 6px 12px; + border-radius: 4px; + background-color: #fff; + line-height: 1.42857143; + border: none; +} +.close-icon{ + font-size: 18px; + font-weight: bold; + line-height: 1; + text-shadow: 0 1px 0 #fff; + color: #AFAFAF; + background: transparent; + padding: 3px; +} +#flow-designer{ + position: relative; + top:10%; +} +.designer-main-panel{ + position: relative; + width: 100%; + border: none; + height: 0px; +} +.connector_overlay_new { + white-space: nowrap; + border: 1px solid #ddd; + background: #E5E5E5; + border-radius: 30px; + width: 24px; + height: 24px; + line-height: 24px; + text-align: center; + cursor: pointer; + transform: scale(0.8); + font-size: 12px; +} +.connector_overlay_new:hover .node_actions{ + opacity: 1; +} +.placeholder-node{ + width:1px; + height: 1px; + background: transparent; + padding-left: 0px; + padding-right: 0px; + margin-left: 4px; + /* transform: translate(0%, -6%);*/ +} +.decision_end{ + width: 10px; + height: 10px; + border-radius: 16px; +} +#decision-properties-table { + width: 70%; + margin-left: 50px; +} +.preview-xml{ + border: none; + padding: 8px; +} +.workflow-actions-pop{ + width: 250px; +} +#killnodes-container{ + width: 300px; + height: 100px; + padding: 5px; + border-radius: 3px; +} +.decision-add-branch-popover{ + position: absolute; + left: 44px; + top: -7px; + z-index: 5; +} + +.jsplumb-connector { z-index:1; } +.jsplumb-endpoint { z-index:2; } +.jsplumb-overlay { z-index:3; } +#selector-content .panel-body{ + width:400px; +} + +.decisionSplit { + border-radius: 24px; + width: 24px; + height: 24px; + left: 70% !important; + top: 67% !important; + transform:rotate(315deg) !important; +} + +.forkSplit { + border-radius: 24px; + width: 24px; + height: 18px; + left: 50% !important; + top: 75% !important; +} + +.control_flow_node { + cursor: not-allowed; +} +.join { + background: #fff; +} +.default-condition{ + background-color: blue; +} +.query-text-area { + width: 540px; +} +.decisionText{ + position: absolute; + transform: rotate(315deg); + top: 30%; + left: 0px; + right: 0px; +} +.decisionIcon{ + position: relative; + right: 5px; +} +.actionNodes li{ + padding: 10px 0px !important; + height: auto; +} +.dr_action_fork{ + width: 45px !important; + height: auto !important; + padding: 10px 0px !important; + border-radius: 0px !important; +} +.dr_action_switch{ + width: 45px !important; + height: 45px !important; + padding: 10px 0px !important; +} +.paddingClass{ + padding-top: 0.5%; +} +.margin0{ + margin-bottom: 0px; +} +.editor-icon-title span{ + padding-left: 5px; +} +.icon_map_red{ + background: url(data:image/png;base64,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) +} +.node_actions i{ + border-right: 1px solid #ababab; + border-radius: 0px; + min-width: 26px; +} +.node_actions i:last-child { + border-right:none; +} +.wf-path { + font-size: 12px; + float: left; + color: gray; + margin-top: 17px; + max-width: 150px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; +} +.cred-type{ + font-size: 12px; + color: gray; + margin-left: 5px; +} +.labelCheckbox{ + padding-left:35px !important; +} +.file-op-setting{ + padding-left: 105px; +} +.rightAlign{ + text-align: left !important; +} +.bottom-margin-zero{ + margin-bottom: 5px !important; +} +#credentials_config .fa-trash-o{ + color: @defaultRed; + cursor: pointer; +} +.credential-list { + margin-top: 37px; +} +.credential-list .fa-trash-o{ + color: @defaultRed; + cursor: pointer; +} +.credential-list .fa-pencil{ + color : @bgGreenActive; + cursor: pointer; +} +.check-class{ + padding-left: 3%; +} +.popover-title{ + background-color:#fff +} +.centralize-panel{ + margin-left: 17%; +} +.dataset-list { + margin-top: 37px; +} + +.dataset-list .fa-trash-o{ + color: @defaultRed; + cursor: pointer; +} + +.dataset-list .fa-pencil{ + color : @bgGreenActive; + cursor: pointer; +} + +.node { + stroke: #fff; + stroke-width: 2px; +} + +.link { + fill: none; + stroke: #000; +} + +.cy-panel { + height: 500px; + position: relative; + border: 1px solid #ccc; + border-radius: 3px; +} + +.cy-panzoom { + left: 90%; + z-index: 999; +} + +.overlay_node_editor { + position: absolute; + z-index: 100; + overflow: hidden; + margin-top: 3px; + margin-left: 5px; + display: none; +} + +.overlay-node-label { + position: absolute; + z-index: 100; + display: none; + background-color: #fbfbfb; + min-width: 110px; + border: 1px solid #999; + padding: 0 5px; + height: 18px; + font-size: 12px; +} + +#cyRenderer .editable { + padding: 7px 10px; + border: 1px solid #999; + background: #fff; + cursor: text; + white-space: nowrap; + text-align: left; + width: 140px; +} + +#cyRenderer .error { + padding: 5px 10px; + border: 1px solid @defaultRed; + background: #fff; + cursor: text; + white-space: nowrap; + text-align: left; + width: 140px; +} + +#cyRenderer input:invalid { + border: 1px solid @defaultRed; +} + +.decision-condition-label { + border-bottom: 1px solid #D0D0D0; + padding: 3px; + min-width: 120px; +} + +.decision-condition-header { + font-weight: bold; +} + +.overlay-transition-content, +.overlay-node-actions { + position: absolute; + z-index: 100; + overflow: hidden; + display: none; + border: 1px solid #999; + background: #fff; + border-radius: 3px; + min-width: 25px; +} + +.overlay-node-actions { + height: 32px; + cursor: pointer; + padding: 2px; +} + +.overlay-transition-actions { + float: right; + height: 30px; + cursor: pointer; + padding: 2px; +} + +.overlay-node-actions span { + display: none; +} + +.overlay-transition-actions span i, +.overlay-node-actions span i { + min-width: 20px; + padding: 5px; + border: 1px solid transparent; + border-radius: 2px; +} + +.overlay-transition-actions span i:hover, +.overlay-node-actions span i:hover{ + border: 1px solid #ababab; +} + +.overlay-trash-transition-icon .fa-trash-o, +.overlay-trash-icon .fa-trash-o { + color: @defaultRed; +} + +.overlay-plus-icon .fa-plus-square { + color: @bgGreenActive; +} +.cyScrollMsg { + text-align: center; +} + +.cyScrollMsgContent { + width: 30px; + background-color: #ccc; +} + +.text-bold { + font-weight: bold; +} + +.green-border { + border-color: green; +} + +.configuration-property-table .propertyName { + word-break: break-all; + width: 20%; +} + +.configuration-property-table .propertyValue { + width: 80%; + word-break: break-all; +} + +.undo { + cursor: pointer; +} + +.paste-action { + font-size: 10px; +} + +.paste-action-btn { + border: 1px solid silver; + border-radius: 6px; + margin-left: 5px; + margin-bottom: 4px +} +#notificationWidget{ + width: 20%; + float: left; + position: fixed; + top: 15%; + left: 66%; + word-break: break-all; + height: 50%; + max-height: 600px; + overflow-y: scroll; + z-index: 1040; +} + +.closeTab { + margin-left: 10px; + cursor: pointer; + color: @defaultRed; +} + +.tab-panel-heading { + margin-top: 2px; +} + +.borderTopNone { + border-top: none; +} + +.borderRadiusNone { + border-radius: 0px; +} + +.borderRightRadiusNone { + border-top-right-radius: 0px; + border-bottom-right-radius: 0px; +} + +.kill-message { + font-style: italic; + color: gray; +} + +.ok-to-warning { + font-style: italic; + color: #8a6d3b; + background-color: #fcf8e3; +} + +.kill-nodes-list { + height: 200px; + overflow-y: auto; +} + +.kill-nodes-list .fa-trash-o{ + color: @defaultRed; + cursor: pointer; +} + +.kill-nodes-list .fa-pencil{ + color : @bgGreenActive; + cursor: pointer; +} + +#killnode-manager-dialog .panel-footer { + background-color: #fff; +} + +.plr0px { + padding-left: 0px; + padding-right: 0px; +} +#stackTrace{ + white-space: pre-wrap; + max-width: 100%; + max-height: 400px; + overflow: scroll; +} http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/.gitkeep ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/.gitkeep b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/.gitkeep new file mode 100644 index 0000000..e69de29 http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-config.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-config.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-config.hbs new file mode 100644 index 0000000..27168a4 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-config.hbs @@ -0,0 +1,129 @@ +{{! +* 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="main"> + <nav class="navbar navbar-default mb0 borderTopNone"> + <div class="container-fluid container-custom"> + <div class="navbar-header"> + <div class="form-inline col-xs-6 paddingtop8"> + <div class="form-group {{if (v-get this 'bundle.name' 'isInvalid') 'has-error'}}" > + <label for="wf_title">Name<span class="requiredField"> *</span></label> + {{input class="form-control" type="text" name="bundle_title" value=bundle.name title="Bundle Name" placeholder="Bundle Name"}} + {{#if (v-get this 'bundle.name' 'isInvalid')}} + <span class="text-danger" title="Name is required"><i class="fa fa-close"></i>Name is required</span> + {{/if}} + </div> + </div> + <div class="navbar-brand pull-right paddingtop8 col-xs-18"> + <div class="btn-group" role="group" aria-label="..."> + <button type="button" class="btn btn-default" data-toggle="modal" data-target="#ConfirmDialog" title="New Workflow" {{action "confirmReset"}}> + <i class="fa fa-refresh"> Reset</i> + </button> + <button type="button" class="btn btn-default" title="Import workflow" {{action "openFileBrowser" "bundleFilePath"}}> + <i class="fa fa-download"> Import</i> + </button> + <button id="import-bundle-test" type="button" class="btn btn-default hide" title="Import Bundle Test" {{action "importBundleTest"}}> + <i class="fa fa-download"></i> + </button> + <div class="btn-group"> + <div class="dropdown"> + <button class="btn btn-default dropdown-toggle borderRadiusNone" type="button" data-toggle="dropdown"><i class="marginright5"></i>More + <span class="caret"></span></button> + <ul class="dropdown-menu"> + <li> + <a href="javascript:void(0)" data-toggle="modal" data-target="#previewModal" title="Preview Xml" {{action "preview"}}> + <i class="fa fa-eye marginright5"></i>Preview xml + </a> + </li> + <!-- <li> + <a href="javascript:void(0)" data-toggle="modal" title="Download workflow" {{action "downloadWorkflowXml"}}> + <i class="fa fa-download marginright5"></i>Download xml + </a> + </li> --> + </ul> + </div> + </div> + <button type="button" class="btn btn-primary" title="Submit Bundle" {{action "submitBundle"}}> + <i class="fa fa-upload"> Submit</i> + </button> + </div> + </div> + </div> + </div> + </nav> + <div class="container-fluid"> + <form class="form-horizontal"> + <div class="col-sm-12 paddingtop10"> + <div class="col-sm-8 centralize-panel"> + + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Coordinators</h4> + <button id="coordinator-create-btn" {{action 'createCoordinator'}} type="button" class="btn btn-default pull-right"> + <i class="fa fa-plus-circle"></i> Add Coordinator + </button> + </div> + <div class="panel-body"> + <ul class="list-group"> + {{#each bundle.coordinators as |coordinator index|}} + <li class="list-group-item"> + {{coordinator.name}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteCoordinator" index bubbles=false}}></i> + </span> + <span class="pull-right paddingright10"> + <i class="fa fa-pencil" title="Edit" {{action "editCoordinator" index bubbles=false}}></i> + </span> + </li> + {{else}} + <li class="list-group-item">No Coordinators Configured.</li> + {{/each}} + </ul> + {{#field-error model=this field='bundle.coordinators' showErrorMessage=true}}{{/field-error}} + + {{#if coordinatorCreateMode}} + {{#bundle-coord-config coordinator=currentCoordinator openTab="openTab" openFileBrowser="openFileBrowser" add="addCoordinator" cancel="cancelCoordinatorOperation" createMode=coordinatorCreateMode}}{{/bundle-coord-config}} + {{/if}} + {{#if coordinatorEditMode}} + {{#bundle-coord-config coordinator=currentCoordinator openTab="openTab" openFileBrowser="openFileBrowser" update="updateCoordinator" cancel="cancelCoordinatorOperation" editMode=coordinatorEditMode}}{{/bundle-coord-config}} + {{/if}} + </div> + </div> + <div class="panel panel-default"> + <div class="panel-body"> + {{#date-with-expr inputName="kickOffTime" label="Kick off Time" inputPlaceholder="Kick Off Time" dateField=bundle.kickOffTime}}{{/date-with-expr}} + </div> + </div> + </div> + </div> + </form> + </div> +</div> +{{#if showingFileBrowser}} + {{hdfs-browser closeFileBrowser="closeFileBrowser" selectFileCallback=selectFileCallback filePath=filePath}} +{{/if}} +{{#if showingJobConfig}} + {{job-config type='bundle' closeJobConfigs="closeBundleSubmitConfig" jobFilePath=bundleFilePath openFileBrowser="openFileBrowser" closeFileBrowser="closeFileBrowser" jobConfigs=bundleConfigs}} +{{/if}} +{{#if showingResetConfirmation}} + {{#confirmation-dialog title="Confirm Bundle Reset" + confirmationMessage="Any unsaved changes may be lost. Do you want to proceed resetting the bundle ?" + okBtnText="Continue" cancelBtnText="Cancel" onOk="resetBundle"}}{{/confirmation-dialog}} +{{/if}} +{{#if showingPreview}} + {{#preview-dialog title="Bundle XML Preview" previewXml=previewXml}}{{/preview-dialog}} +{{/if}} http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-coord-config.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-coord-config.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-coord-config.hbs new file mode 100644 index 0000000..86a49b9 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-coord-config.hbs @@ -0,0 +1,58 @@ +{{! +* 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="well"> + <div class="form-group"> + <label class="control-label col-xs-2">Coordinator Name<span class="requiredField"> *</span></label> + <div class="col-xs-7"> + {{input type="text" class="form-control" name="name" value=coordinator.name placeholder="Coordinator Name"}} + {{#field-error model=this field='coordinator.name' showErrorMessage=showErrorMessage}}{{/field-error}} + </div> + </div> + <div class="form-group"> + <label class="control-label col-xs-2">Coordinator Path<span class="requiredField"> *</span></label> + <div class="col-xs-7"> + <div class="input-group"> + {{input type="text" class="form-control" name="appPath" focus-out="showCoordinatorName" value=coordinator.appPath placeholder="Path of the coordinator file"}} + <span class="input-group-btn"> + <button class="btn btn-primary" type="button" {{action "openFileBrowser" "coordinator.appPath"}}>Browse</button> + <button class="btn btn-default" type="button" {{action "openTab" 'coord' coordinator.appPath}} name="button"><i class="fa fa-external-link"></i></button> + </span> + </div> + {{#if coordinatorName}} + <span title="Name of the coordinator">({{coordinatorName}})</span> + {{/if}} + {{#field-error model=this field='coordinator.appPath' showErrorMessage=showErrorMessage}}{{/field-error}} + </div> + </div> + <div class="panel panel-default"> + <div class="panel-heading">Configuration</div> + <div class="panel-body handlerPanel"> + {{#name-value-config configuration=coordinator.configuration}}{{/name-value-config}} + </div> + </div> + <div class="form-group"> + <div class="col-xs-7 pull-right"> + <button id="coordinator-cancel-btn" {{action 'cancelCoordinatorOperation'}} type="button" class="btn btn-default">Cancel</button> + {{#if createMode}} + <button id="coordinator-add-btn" {{action 'addCoordinator'}} type="button" class="btn btn-primary">Add</button> + {{else}} + <button id="coordinator-update-btn" {{action 'updateCoordinator'}} type="button" class="btn btn-primary"> Update </button> + {{/if}} + </div> + </div> +</div> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-job-details.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-job-details.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-job-details.hbs index b1f1d7e..f6b491b 100644 --- a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-job-details.hbs +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/bundle-job-details.hbs @@ -95,7 +95,22 @@ <div role="tabpanel" class="tab-pane" id="jobConfig"> <div class="panel panel-default"> <div class="panel-body preview"> - <pre class="prettyprint">{{model.conf}}</pre> + <table class="table table-striped configuration-property-table"> + <thead> + <tr> + <th class="propertyName">Name</th> + <th class="propertyValue">Value</th> + </tr> + </thead> + <tbody> + {{#each model.configurationProperties as |configurationProperty|}} + <tr> + <td class="propertyName">{{configurationProperty.name}}</td> + <td class="propertyValue">{{configurationProperty.value}}</td> + </tr> + {{/each}} + </tbody> + </table> </div> </div> </div> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/conditional-data-input.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/conditional-data-input.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/conditional-data-input.hbs new file mode 100644 index 0000000..03eb0d8 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/conditional-data-input.hbs @@ -0,0 +1,64 @@ +{{! +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +}} +<div class="form-inline"> + <select onchange={{action (mut condition.operator) value="target.value"}} name="select-input" class="form-control" data-show-icon="true"> + {{#each conditionsList as |condition index|}} + <option value={{condition.value}} selected={{eq condition.operator condition.value}}>{{condition.displayName}}</option> + {{/each}} + </select> + {{#if (not (eq condition.operator "combine"))}} + <button id="data-add-btn" {{action 'addCondition'}} type="button" class="btn btn-default form-control"> + <i class="fa fa-plus-circle"></i> Condition</button> + {{/if}} + <button id="data-add-btn" {{action 'addDataInput'}} type="button" class="btn btn-default form-control"> + <i class="fa fa-plus-circle"></i> Data Input</button> + {{#if showAdvanced}} + {{input type="text" class="form-control" name="conditionName" title="Condition Name" value=condition.name placeholder="Condition Name"}} + {{input type=text class="form-control" value=condition.min placeholder="Mininum Inputs"}} + {{input type=text class="form-control" value=condition.wait placeholder="Wait Time"}} + <button id="data-add-btn" {{action 'hideAdvanced'}} type="button" title="Configure Advanced Options" class="form-control btn btn-default"> + <i class="fa fa-chevron-left"></i> Advanced + </button> + {{else}} + <button id="data-add-btn" {{action 'showAdvanced'}} type="button" title="Configure Advanced Options" class="form-control btn btn-default"> + <i class="fa fa-chevron-right"></i> Advanced + </button> + {{/if}} + {{yield}} + {{field-error model=this field='condition.operator' showErrorMessage=showErrorMessage}} + {{field-error model=this field='condition.operands' showErrorMessage=showErrorMessage}} +</div> +<ul class="list-group"> + {{#each condition.operands as |operand index|}} + <li class="list-group-item"> + {{#if (eq operand.type 'condition') }} + {{#conditional-data-input condition=operand datasets=datasets}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteOperand" index bubbles=false}}></i> + </span> + {{/conditional-data-input}} + {{else}} + {{#data-input datasets=datasets dataInput=operand register="registerChild" deregister="deregisterChild"}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteOperand" index bubbles=false}}></i> + </span> + {{/data-input}} + {{/if}} + </li> + {{/each}} +</ul> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/confirmation-dialog.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/confirmation-dialog.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/confirmation-dialog.hbs new file mode 100644 index 0000000..fc86286 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/confirmation-dialog.hbs @@ -0,0 +1,34 @@ +{{! +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +}} +<div id="ConfirmDialog" class="modal fade" role="dialog"> + <div class="modal-dialog"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal">×</button> + <h4 class="modal-title">{{title}}</h4> + </div> + <div class="modal-body"> + {{confirmationMessage}} + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">{{cancelBtnText}}</button> + <button type="button" class="btn btn-primary" {{action "onOk"}} data-dismiss="modal">{{okBtnText}}</button> + </div> + </div> + </div> +</div> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-config.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-config.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-config.hbs new file mode 100644 index 0000000..a6edcec --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-config.hbs @@ -0,0 +1,352 @@ +{{! +* 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="main"> + <nav class="navbar navbar-default mb0 borderTopNone"> + <div class="container-fluid container-custom"> + <div class="navbar-header"> + <div class="form-inline col-xs-6 paddingtop8"> + <div class="form-group {{if (v-get this 'coordinator.name' 'isInvalid') 'has-error'}}"> + <label for="wf_title">Name </label> + {{input class="form-control" type="text" name="coord_title" value=coordinator.name title="Coordinator Name" placeholder="Coordinator Name"}} + {{#if (v-get this 'coordinator.name' 'isInvalid')}} + <span class="text-danger" title="Name is required"><i class="fa fa-close"></i>Name is required</span> + {{/if}} + </div> + </div> + <div class="navbar-brand pull-right paddingtop8 col-xs-18"> + <div class="btn-group" role="group" aria-label="..."> + <button type="button" class="btn btn-default" data-toggle="modal" data-target="#ConfirmDialog" title="New Workflow" {{action "confirmReset"}}> + <i class="fa fa-refresh"> Reset</i> + </button> + <button type="button" class="btn btn-default" title="Import workflow" {{action "openFileBrowser" "coordinatorFilePath"}}> + <i class="fa fa-download"> Import</i> + </button> + + <button id="import-test" type="button" class="btn btn-default hide" title="Import coordinator Test" {{action "importCoordinatorTest"}}> + <i class="fa fa-download"></i> + </button> + <button type="button" class="btn btn-default" title="Parameters Configuration" {{action "showParameterSettings" true}}> + <i class="fa fa-cog marginright5"></i>Parameters + </button> + <button type="button" class="btn btn-default" data-toggle="modal" data-target="#control-dialog" title="Coordinator Controls" {{action "showControlConfig"}}> + <i class="fa fa-wrench marginright5"></i>Controls + </button> + <div class="btn-group"> + <div class="dropdown"> + <button class="btn btn-default dropdown-toggle borderRadiusNone" type="button" data-toggle="dropdown"><i class="marginright5"></i>More + <span class="caret"></span></button> + <ul class="dropdown-menu"> + <li> + <a href="javascript:void(0)" data-toggle="modal" data-target="#previewModal" title="Preview Xml" {{action "preview"}}> + <i class="fa fa-eye marginright5"></i>Preview xml + </a> + </li> + <!-- <li> + <a href="javascript:void(0)" data-toggle="modal" title="Download workflow" {{action "downloadWorkflowXml"}}> + <i class="fa fa-download marginright5"></i>Download xml + </a> + </li> --> + </ul> + </div> + </div> + <button type="button" class="btn btn-primary" title="Submit Coordinator" {{action "submitCoordinator"}}> + <i class="fa fa-upload marginright5"></i>Submit + </button> + </div> + </div> + </div> + </div> + </nav> + <div class="container-fluid"> + <form class="form-horizontal"> + <div class="col-sm-12 paddingtop10"> + <div class="col-sm-8 centralize-panel"> + <div class="panel panel-default"> + <div class="panel-body"> + <div class="form-group"> + <label class="control-label col-xs-2">Workflow Path<span class="requiredField"> *</span></label> + <div class="col-xs-7"> + <div class="input-group"> + {{input type="text" class="form-control" name="appPath" focus-out="showWorkflowName" value=coordinator.workflow.appPath placeholder="Path of the workflow file"}} + <span class="input-group-btn"> + <button class="btn btn-primary" type="button" {{action "openFileBrowser" "coordinator.workflow.appPath"}}>Browse</button> + <button class="btn btn-default" type="button" {{action "openTab" 'wf' coordinator.workflow.appPath}} name="button"><i class="fa fa-external-link"></i></button> + </span> + </div> + {{#if workflowName}} + <span title="Name of the workflow">({{workflowName}})</span> + {{/if}} + {{#field-error model=this field='coordinator.workflow.appPath' showErrorMessage=showErrorMessage}}{{/field-error}} + </div> + </div> + <div class="form-group"> + <label class="control-label col-xs-2">Frequency<span class="requiredField"> *</span></label> + <div class="col-xs-2"> + <select class="form-control" name="frequency-type" title="Frequency type" onchange={{action (mut coordinator.frequency.type) value="target.value"}}> + {{#each timeUnitOptions as |timeUnit|}} + <option value={{timeUnit.value}} selected={{eq timeUnit.value coordinator.frequency.type}}>{{timeUnit.displayName}}</option> + {{/each}} + </select> + {{#field-error model=this field='coordinator.frequency.type' showErrorMessage=showErrorMessage}}{{/field-error}} + </div> + <div class="col-xs-3"> + {{input class="form-control" type="text" value=coordinator.frequency.value placeholder="frequency" title="Periodic intervals at which datasets that are produced, and coordinator applications are scheduled to run"}} + {{field-error model=this field='coordinator.frequency.value' showErrorMessage=showErrorMessage}} + </div> + </div> + {{#date-with-expr required=true inputName="start" label="Start" inputPlaceholder="Start Time" dateField=coordinator.start timezone=coordinator.timezone register="registerChild" deregister="deregisterChild"}}{{/date-with-expr}} + {{#date-with-expr required=true inputName="end" label="End" inputPlaceholder="End Time" dateField=coordinator.end timezone=coordinator.timezone register="registerChild" deregister="deregisterChild"}}{{/date-with-expr}} + <div class="form-group"> + <label for="" class="control-label col-xs-2">Time Zone<span class="requiredField"> *</span></label> + <div class="col-xs-7"> + <select onchange={{action (mut coordinator.timezone) value="target.value"}} name="select-input" class="form-control" data-show-icon="true"> + {{#each timezoneList as |timezone index|}} + <option value={{timezone.value}} selected={{eq timezone.value coordinator.timezone}}>{{timezone.displayName}}</option> + {{/each}} + </select> + {{field-error model=this field='coordinator.timezone' showErrorMessage=showErrorMessage}} + </div> + </div> + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Configuration</h4> + </div> + <div class="panel-body handlerPanel"> + {{#name-value-config configuration=coordinator.workflow.configuration}}{{/name-value-config}} + </div> + </div> + {{#sla-info slaInfo=coordinator.slaInfo register="registerChild" slaEnabled=coordinator.slaEnabled}}{{/sla-info}} + </div> + </div> + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Data</h4> + </div> + <div class="panel-body handlerPanel"> + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Datasets</h4> + <button id="dataset-create-btn" {{action 'createDataset'}} type="button" class="btn btn-default pull-right"> + <i class="fa fa-plus-circle"></i> Add Dataset + </button> + </div> + <div class="panel-body"> + <ul class="list-group"> + {{#each coordinator.datasets as |dataset index|}} + <li class="list-group-item"> + {{dataset.name}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteDataset" index bubbles=false}}></i> + </span> + <span class="pull-right paddingright10"> + <i class="fa fa-pencil" title="Edit" {{action "editDataset" index bubbles=false}}></i> + </span> + </li> + {{else}} + <li class="list-group-item">No Datasets Configured.</li> + {{/each}} + </ul> + {{#if datasetCreateMode}} + {{#dataset-config dataset=currentDataset add="addDataset" cancel="cancelDatasetOperation" createMode=datasetCreateMode}}{{/dataset-config}} + {{/if}} + {{#if datasetEditMode}} + {{#dataset-config dataset=currentDataset update="updateDataset" cancel="cancelDatasetOperation" editMode=datasetEditMode}}{{/dataset-config}} + {{/if}} + </div> + </div> + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Inputs</h4> + </div> + <div class="panel-body handlerPanel"> + {{#if coordinator.supportsConditionalDataInput}} + <div class=""> + <label for="" class="control-label col-xs-2">Data Input Type</label> + <div class="btn-group"> + <button {{action 'toggleDataTnput' 'simple'}} type="button" class="btn btn-default {{if (eq coordinator.dataInputType 'simple') 'btn-primary' ''}} scope-btn"> + Simple + </button> + <button {{action 'toggleDataTnput' 'logical'}} type="button" class="btn btn-default {{if (eq coordinator.dataInputType 'logical') 'btn-primary' ''}} scope-btn"> + Conditional + </button> + </div> + </div> + {{/if}} + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Datasets</h4> + {{#if (eq coordinator.dataInputType 'simple')}} + <button id="dataset-create-btn" {{action 'createDataInput'}} type="button" class="btn btn-default pull-right"> + <i class="fa fa-plus-circle"></i> Add Data Input + </button> + {{else}} + {{#if (not conditionalDataInExists)}} + <button id="condition-create-btn" {{action 'createCondition'}} type="button" class="btn btn-default pull-right"> + <i class="fa fa-plus-circle"></i> Add Condition + </button> + {{/if}} + {{/if}} + </div> + <div class="panel-body"> + {{#if (eq coordinator.dataInputType 'simple')}} + <ul class="list-group"> + {{#each coordinator.dataInputs as |data index|}} + <li class="list-group-item"> + {{data.name}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteDataInput" index bubbles=false}}></i> + </span> + <span class="pull-right paddingright10"> + <i class="fa fa-pencil" title="Edit" {{action "editDataInput" index bubbles=false}}></i> + </span> + </li> + {{else}} + <li class="list-group-item">No Data inputs Configured</li> + {{/each}} + </ul> + {{#if dataInputCreateMode}} + {{#data-input-output-config datasets=datasetsForInputs data=currentDataInput type="input" add="addDataInput" cancel="cancelDataInputOperation" createMode=dataInputCreateMode}}{{/data-input-output-config}} + {{/if}} + {{#if dataInputEditMode}} + {{#data-input-output-config datasets=datasetsForInputs data=currentDataInput type="input" update="updateDataInput" cancel="cancelDataInputOperation" editMode=dataInputEditMode}}{{/data-input-output-config}} + {{/if}} + {{/if}} + {{#if (eq coordinator.dataInputType 'logical')}} + <ul class="list-groups"> + {{#if conditionalDataInExists}} + <li class="list-group-item"> + {{#conditional-data-input condition=coordinator.conditionalDataInput datasets=datasetsForInputs isToplevel=true register="registerChild" deregister="deregisterChild"}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteCondition" index bubbles=false}}></i> + </span> + {{/conditional-data-input}} + </li> + {{else}} + <li class="list-group-item">No Conditional Data Inputs Configured</li> + {{/if}} + </ul> + {{/if}} + </div> + </div> + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Conditional Inputs</h4> + {{#if (not inputLogicExists)}} + <button id="condition-create-btn" {{action 'createInputLogic'}} type="button" class="btn btn-default pull-right"> + <i class="fa fa-plus-circle"></i> Add Condition + </button> + {{/if}} + </div> + <div class="panel-body handlerPanel"> + <ul class="list-group"> + {{#if inputLogicExists}} + <li class="list-group-item"> + {{#conditional-data-input condition=coordinator.inputLogic datasets=datasetsForInputs isToplevel=true register="registerChild" deregister="deregisterChild"}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteInputLogic" index bubbles=false}}></i> + </span> + {{/conditional-data-input}} + </li> + {{else}} + <li class="list-group-item">No Conditional Data Inputs Configured</li> + {{/if}} + </ul> + </div> + </div> + </div> + </div> + <div class="panel panel-default"> + <div class="panel-heading clearfix"> + <h4 class="panel-title pull-left paddingtop7">Outputs</h4> + <button id="dataset-create-btn" {{action 'createDataOutput'}} type="button" class="btn btn-default pull-right"> + <i class="fa fa-plus-circle"></i> Add Data Output + </button> + </div> + <div class="panel-body"> + <ul class="list-group"> + {{#each coordinator.dataOutputs as |data index|}} + <li class="list-group-item"> + {{data.name}} + <span class="pull-right"> + <i class="fa fa-trash-o" title="Delete" {{action "deleteDataOutput" index bubbles=false}}></i> + </span> + <span class="pull-right paddingright10"> + <i class="fa fa-pencil" title="Edit" {{action "editDataOutput" index bubbles=false}}></i> + </span> + </li> + {{else}} + <li class="list-group-item">No Data Ouputs Configured</li> + {{/each}} + </ul> + {{#if dataOutputCreateMode}} + {{#data-input-output-config datasets=datasetsForOutputs data=currentDataOutput type="output" add="addDataOutput" cancel="cancelDataOutputOperation" createMode=dataOutputCreateMode}}{{/data-input-output-config}} + {{/if}} + {{#if dataOutputEditMode}} + {{#data-input-output-config datasets=datasetsForOutputs data=currentDataOutput type="output" update="updateDataOutput" cancel="cancelDataOutputOperation" editMode=dataOutputEditMode}}{{/data-input-output-config}} + {{/if}} + </div> + </div> + </div> + </div> + </div> + </div> + </form> + </div> +</div> +{{#if showingFileBrowser}} + {{hdfs-browser closeFileBrowser="closeFileBrowser" selectFileCallback=selectFileCallback filePath=filePath}} +{{/if}} +{{#if showingJobConfig}} + {{job-config type='coord' closeJobConfigs="closeCoordSubmitConfig" jobFilePath=coordinatorFilePath openFileBrowser="openFileBrowser" closeFileBrowser="closeFileBrowser" jobConfigs=coordinatorConfigs}} +{{/if}} +{{#if showingResetConfirmation}} + {{#confirmation-dialog title="Confirm Coordinator Reset" + confirmationMessage="Any unsaved changes may be lost. Do you want to proceed resetting the coordinator ?" + okBtnText="Continue" cancelBtnText="Cancel" onOk="resetCoordinator"}}{{/confirmation-dialog}} +{{/if}} +{{#if showingPreview}} + {{#preview-dialog title="Coordinator XML Preview" previewXml=previewXml}}{{/preview-dialog}} +{{/if}} +{{#if showParameterSettings}} + {{#workflow-parameters type='coord' closeWorkFlowParam="closeWorkFlowParam" saveWorkFlowParam="saveWorkFlowParam" parameters=parameters}}{{/workflow-parameters}} +{{/if}} +{{#if showControlConfig}} + <div id="control-dialog" class="modal fade" role="dialog"> + <div class="modal-dialog"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal">×</button> + <h4 class="modal-title">Controls</h4> + </div> + <div class="modal-body"> + <div class="panel panel-default"> + <div class="panel-body handlerPanel form-horizontal"> + {{#each coordinatorControls as |property|}} + {{#named-properties property=property labelWidthClass="col-xs-4" inputWidthClass="col-xs-8"}}{{/named-properties}} + {{/each}} + </div> + </div> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal" {{action "saveCoordControls"}}>Save</button> + <button type="button" class="btn btn-default" data-dismiss="modal" onclick={{action (mut showControlConfig) false}}>Cancel</button> + </div> + </div> + </div> + </div> +{{/if}} http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-job-details.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-job-details.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-job-details.hbs index 65aed2d..350f873 100644 --- a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-job-details.hbs +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/coord-job-details.hbs @@ -119,7 +119,22 @@ <div role="tabpanel" class="tab-pane" id="jobConfig"> <div class="panel panel-default"> <div class="panel-body preview"> - <pre class="prettyprint">{{model.conf}}</pre> + <table class="table table-striped configuration-property-table"> + <thead> + <tr> + <th class="propertyName">Name</th> + <th class="propertyValue">Value</th> + </tr> + </thead> + <tbody> + {{#each model.configurationProperties as |configurationProperty|}} + <tr> + <td class="propertyName">{{configurationProperty.name}}</td> + <td class="propertyValue">{{configurationProperty.value}}</td> + </tr> + {{/each}} + </tbody> + </table> </div> </div> </div> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/credentials-config.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/credentials-config.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/credentials-config.hbs index 129b7df..366920d 100644 --- a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/credentials-config.hbs +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/credentials-config.hbs @@ -18,26 +18,18 @@ <form class="form-horizontal" id="credentials_config"> <div class="panel panel-default"> {{#if (eq mode 'edit')}} - <div class="panel-heading" id="credential-head" {{action 'togglePanel'}}> - <span>{{credential.name}}</span><span class="cred-type">({{credential.type}})</span> - {{#if isOpen}} - <i class="indicator glyphicon glyphicon-chevron-up pull-right"></i> - {{else}} - <i class="indicator glyphicon glyphicon-chevron-down pull-right"></i> - {{/if}} - <span class="col-xs-1 pull-right"> - <i class="fa fa-trash-o" title="Delete" {{action "delete" credential.name bubbles=false}}></i> - </span> + <div class="panel-heading" id="credential-head"> + <span>Edit - {{credential.name}}</span><span class="cred-type">({{credential.type}})</span> </div> {{else if (eq mode 'create')}} - <div class="panel-heading" id="credential-head" {{action 'togglePanel'}}>Create New</div> + <div class="panel-heading" id="credential-head">Create New</div> {{/if}} - <div class="panel-body handlerPanel collapse panel-collapse"> + <div class="panel-body"> <div class="form-group"> <label class="control-label col-xs-2">Name<span class="requiredField"> *</span></label> <div class=" col-xs-4"> {{input class="form-control" type="text" value=credential.name}} - {{field-error error=errors.credential.name}} + {{field-error model=this field='credential.name' showErrorMessage=showErrorMessage}} </div> </div> <div class="form-group"> @@ -48,7 +40,7 @@ <option value={{type.value}} selected={{eq type.value credential.type}}>{{type.displayName}}</option> {{/each}} </select> - {{field-error error=errors.credential.type}} + {{field-error model=this field='credential.type' showErrorMessage=showErrorMessage}} </div> </div> {{#if credential.type}} @@ -56,7 +48,7 @@ <div class="panel-heading">Properties</div> <div class="panel-body handlerPanel"> {{#each staticProps as |property|}} - {{#named-properties property=property required=true register="register" labelWidthClass="col-xs-4" inputWidthClass="col-xs-4"}}{{/named-properties}} + {{#named-properties property=property unregisterRequired=true required=true unregister="unregister" register="register" labelWidthClass="col-xs-4" inputWidthClass="col-xs-8"}}{{/named-properties}} {{/each}} </div> </div> @@ -73,11 +65,14 @@ {{#name-value-config configuration=credential register="register"}}{{/name-value-config}} </div> </div> - {{#if (eq mode 'create')}} - <div class="col-xs-2 pull-right"> - <input class="form-control btn btn-success" type="button" {{action "add"}} value="Add"> + <div class="col-xs-24 pull-right"> + <input class="btn btn-default marginright5" type="button" {{action "cancel"}} value="Cancel"> + {{#if (eq mode 'create')}} + <input class="btn btn-primary" type="button" {{action "add"}} value="Add"> + {{else}} + <input class="btn btn-primary" type="button" {{action "add"}} value="Update"> + {{/if}} </div> - {{/if}} </div> </div> </form> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input-output-config.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input-output-config.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input-output-config.hbs new file mode 100644 index 0000000..2185d0d --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input-output-config.hbs @@ -0,0 +1,68 @@ +{{! +* 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="well"> + <div class="form-group"> + <label for="" class="control-label col-xs-2">Name<span class="requiredField"> *</span></label> + <div class="col-xs-7"> + {{input type="text" class="form-control" name="coord-name" value=data.name placeholder="Name"}} + {{field-error model=this field='data.name' showErrorMessage=showErrorMessage}} + </div> + </div> + <div class="form-group"> + <label class="control-label col-xs-2">Dataset<span class="requiredField"> *</span></label> + <div class="col-xs-7"> + <select onchange={{action (mut data.dataset) value="target.value"}} name="select-input" class="form-control" data-show-icon="true"> + <option value="">Select Dataset</option> + {{#each datasets as |dataset index|}} + <option value={{dataset.name}} selected={{eq dataset.name data.dataset}}>{{dataset.name}}</option> + {{/each}} + </select> + {{field-error model=this field='data.dataset' showErrorMessage=showErrorMessage}} + </div> + </div> + {{#if (eq type 'input')}} + <div class="form-group"> + <label class="control-label col-xs-2">Instance Type<span class="requiredField"> *</span></label> + <div class="col-xs-3"> + <input type="radio" class="marginright5" name="instanceType" checked={{if (eq data.isList true) 'checked'}} onChange={{action "onInstanceTypeChange" true}}>List of Instances + </div> + <div class="col-xs-3"> + <input type="radio" class="marginright5" name="instanceType" checked={{if (eq data.isList false) 'checked'}} onChange={{action "onInstanceTypeChange" false}}>With Start and End + </div> + </div> + {{#if data.isList}} + {{#instance-list-config instances=data.instances title="Instance"}}{{/instance-list-config}} + {{else}} + {{#date-with-expr required=true inputName="start" label="Start" inputPlaceholder="Start Time" dateField=data.start register="registerChild" deregister="deregisterChild"}}{{/date-with-expr}} + {{#date-with-expr required=true inputName="end" label="End" inputPlaceholder="End Time" dateField=data.end register="registerChild" deregister="deregisterChild"}}{{/date-with-expr}} + {{/if}} + {{/if}} + {{#if (eq type 'output')}} + {{#date-with-expr required=true inputName="instance" label="Instance" inputPlaceholder="Instance" dateField=data.instance register="registerChild" deregister="deregisterChild"}}{{/date-with-expr}} + {{/if}} + <div class="form-group"> + <div class="col-xs-7 pull-right"> + <button id="data-add-btn" {{action 'cancel'}} type="button" class="btn btn-default">Cancel</button> + {{#if createMode}} + <button id="data-add-btn" {{action 'add'}} type="button" class="btn btn-primary">Save</button> + {{else}} + <button id="data-update-btn" {{action 'update'}} type="button" class="btn btn-primary"> Update </button> + {{/if}} + </div> + </div> +</div> http://git-wip-us.apache.org/repos/asf/ambari/blob/d1b0bb9e/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input.hbs b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input.hbs new file mode 100644 index 0000000..b09d763 --- /dev/null +++ b/contrib/views/wfmanager/src/main/resources/ui/app/templates/components/data-input.hbs @@ -0,0 +1,40 @@ +{{! +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +}} +<div class="form-inline"> + <label class="control-label">Data Input</label> + <select onchange={{action (mut dataInput.dataset) value="target.value"}} name="select-input" class="form-control" data-show-icon="true"> + <option value="">Select Dataset</option> + {{#each datasets as |dataset index|}} + <option value={{dataset.name}} selected={{eq dataset.name dataInput.dataset}}>{{dataset.name}}</option> + {{/each}} + </select> + {{#if showAdvanced}} + {{input type=text class="form-control" value=dataInput.name placeholder="Data Input Name"}} + {{input type=text class="form-control" value=dataInput.min placeholder="Mininum Inputs"}} + {{input type=text class="form-control" value=dataInput.wait placeholder="Wait Time"}} + <button id="data-add-btn" {{action 'hideAdvanced'}} type="button" title="Configure Advanced Options" class="form-control btn btn-default"> + <i class="fa fa-chevron-left"></i> Advanced + </button> + {{else}} + <button id="data-add-btn" {{action 'showAdvanced'}} type="button" title="Configure Advanced Options" class="form-control btn btn-default"> + <i class="fa fa-chevron-right"></i> Advanced + </button> + {{/if}} + {{yield}} +</div> +{{field-error model=this field='dataInput.dataset' showErrorMessage=showErrorMessage}}
