瀏覽代碼

[oozie] Support for start and end node outside the workflow editor

Enrico Berti 11 年之前
父節點
當前提交
741292258b

+ 1 - 1
apps/oozie/src/oozie/models2.py

@@ -67,7 +67,7 @@ class Workflow():
           'layout': [
               {"size":12, "rows":[
                     {"widgets":[{"size":12, "name":"Start", "id":"3f107997-04cc-8733-60a9-a4bb62cebffc", "widgetType":"start-widget", "properties":{}, "offset":0, "isLoading":False, "klass":"card card-widget span12"}]},
-                    {"widgets":[]},  
+                    # {"widgets":[]},
                     {"widgets":[{"size":12, "name":"End", "id":"33430f0f-ebfa-c3ec-f237-3e77efa03d0a", "widgetType":"end-widget", "properties":{}, "offset":0, "isLoading":False, "klass":"card card-widget span12"}]}], 
                  "drops":[ "temp"],
                  "klass":"card card-home card-column span12"}              

+ 37 - 6
apps/oozie/src/oozie/templates/editor/workflow_editor.mako

@@ -178,6 +178,24 @@ ${ commonheader(_("Workflow Editor"), "Oozie", user) | n,unicode }
 </div>
 
 <script type="text/html" id="column-template">
+  <div data-bind="css: klass">
+    <div data-bind="template: { name: 'row-template', data: oozieStartRow }"></div>
+
+    <div class="container-fluid" data-bind="visible: $root.isEditing() && oozieRows().length > 0">
+      <div data-bind="click: function(){$data.addEmptyRow(true)}, css: {'dropTarget': true, 'is-editing': $root.isEditing}, sortable: { data: drops, isEnabled: $root.isEditing, 'afterMove': function(event){var widget=event.item; var _r = $data.addEmptyRow(true); _r.addWidget(widget);$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)}); columnDropAdditionalHandler(widget)}, options: {'placeholder': 'dropTargetHighlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"></div>
+    </div>
+    <div data-bind="template: { name: 'internal-row-template', foreach: oozieRows}">
+    </div>
+    <div class="container-fluid" data-bind="visible: $root.isEditing() && (rows().length > 0 ||  $root.isNested())">
+      <div data-bind="click: function(){$data.addEmptyRow()}, css: {'dropTarget': true, 'is-editing': $root.isEditing}, sortable: { data: drops, isEnabled: $root.isEditing, 'afterMove': function(event){var widget=event.item; var _r = $data.addEmptyRow(); _r.addWidget(widget);$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)}); columnDropAdditionalHandler(widget)}, options: {'placeholder': 'dropTargetHighlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"></div>
+    </div>
+
+    <div data-bind="template: { name: 'row-template', data: oozieEndRow }"></div>
+  </div>
+</script>
+
+
+<script type="text/html" id="internal-column-template">
   <div data-bind="css: klass">
 ##
 ##    <div class="container-fluid">
@@ -197,7 +215,7 @@ ${ commonheader(_("Workflow Editor"), "Oozie", user) | n,unicode }
     <div class="container-fluid" data-bind="visible: $root.isEditing()">
       <div data-bind="click: function(){$data.addEmptyRow(true)}, css: {'dropTarget': true, 'is-editing': $root.isEditing}, sortable: { data: drops, isEnabled: $root.isEditing, 'afterMove': function(event){var widget=event.item; var _r = $data.addEmptyRow(true); _r.addWidget(widget);$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)}); columnDropAdditionalHandler(widget)}, options: {'placeholder': 'dropTargetHighlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"></div>
     </div>
-    <div data-bind="template: { name: 'row-template', foreach: rows}">
+    <div data-bind="template: { name: 'internal-row-template', foreach: rows}">
     </div>
     <div class="container-fluid" data-bind="visible: $root.isEditing() && (rows().length > 0 ||  $root.isNested())">
       <div data-bind="click: function(){$data.addEmptyRow()}, css: {'dropTarget': true, 'is-editing': $root.isEditing}, sortable: { data: drops, isEnabled: $root.isEditing, 'afterMove': function(event){var widget=event.item; var _r = $data.addEmptyRow(); _r.addWidget(widget);$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)}); columnDropAdditionalHandler(widget)}, options: {'placeholder': 'dropTargetHighlight', 'greedy': true, 'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});}}}"></div>
@@ -206,6 +224,22 @@ ${ commonheader(_("Workflow Editor"), "Oozie", user) | n,unicode }
 </script>
 
 <script type="text/html" id="row-template">
+  <div class="container-fluid">
+    <div class="row-fluid">
+      <div class="span12">
+        <div data-bind="css: {'row-fluid': true, 'row-container':true, 'is-editing': $root.isEditing},
+          sortable: { template: 'widget-template', data: widgets, allowDrop: $root.isEditing() && (! $root.isNested() || ($root.isNested() && widgets().length < 1)), isEnabled: $root.isEditing() && (! $root.isNested() || ($root.isNested() && widgets().length < 1)),
+          options: {'handle': '.move-widget', 'opacity': 0.7, 'placeholder': 'row-highlight', 'greedy': true,
+              'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});},
+              'helper': function(event){lastWindowScrollPosition = $(window).scrollTop(); $('.card-body').slideUp('fast'); var _par = $('<div>');_par.addClass('card card-widget');var _title = $('<h2>');_title.addClass('card-heading simple');_title.text($(event.toElement).text());_title.appendTo(_par);_par.height(80);_par.width(180);return _par;}},
+              dragged: function(widget){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});widgetDraggedAdditionalHandler(widget)}}">
+        </div>
+      </div>
+    </div>
+  </div>
+</script>
+
+<script type="text/html" id="internal-row-template">
   <div class="emptyRow" data-bind="visible: widgets().length == 0 && $index() == 0 && $root.isEditing() && $parent.size() > 4 && $parent.rows().length == 1 && ! $root.isNested">
     <img src="/static/art/hint_arrow_flipped.png" style="float:left; margin-right: 10px"/>
     <div style="float:left; text-align: center; width: 260px">${_('Drag any of the widgets inside your empty row')}</div>
@@ -220,7 +254,7 @@ ${ commonheader(_("Workflow Editor"), "Oozie", user) | n,unicode }
       <div class="span10">
 
 
-      <div data-bind="visible: columns().length == 0, style: { 'border-bottom': $root.isNested() ? 'none' : '' }, css: {'row-fluid': true, 'row-container':true, 'is-editing': $root.isEditing},
+      <div data-bind="visible: columns().length == 0, css: {'row-fluid': true, 'row-container':true, 'is-editing': $root.isEditing},
         sortable: { template: 'widget-template', data: widgets, allowDrop: $root.isEditing() && (! $root.isNested() || ($root.isNested() && widgets().length < 1)), isEnabled: $root.isEditing() && (! $root.isNested() || ($root.isNested() && widgets().length < 1)),
         options: {'handle': '.move-widget', 'opacity': 0.7, 'placeholder': 'row-highlight', 'greedy': true,
             'stop': function(event, ui){$('.card-body').slideDown('fast', function(){$(window).scrollTop(lastWindowScrollPosition)});},
@@ -229,14 +263,12 @@ ${ commonheader(_("Workflow Editor"), "Oozie", user) | n,unicode }
     </div>
     <div class="container-fluid" data-bind="visible: $root.isNested() && columns().length > 0" style="border: 1px solid #e5e5e5; border-top: none; background-color: #F3F3F3;">
       <div data-bind="css: {'row-fluid': true, 'row-container':true, 'is-editing': $root.isEditing}">
-        <div data-bind="template: { name: 'column-template', foreach: columns}">
+        <div data-bind="template: { name: 'internal-column-template', foreach: columns}">
         </div>
       </div>
     </div>
 
 
-
-
       </div>
       <div class="span1">
         <div data-bind="css: {'dropTarget': true, 'is-editing': $root.isEditing}, droppable: {enabled: $root.isEditing, onDrop: function(){ console.log('dropped'); $data.addEmptyColumn(); } }"></div>
@@ -746,7 +778,6 @@ ${ dashboard.import_bindings() }
   viewModel.init();
   fullLayout(viewModel);
 
-
   function columnDropAdditionalHandler(widget) {
     widgetDraggedAdditionalHandler(widget);
   }

+ 0 - 1
apps/oozie/static/js/workflow-editor.ko.js

@@ -79,7 +79,6 @@ function loadLayout(viewModel, json_layout) {
     var column = new Column(json_col.size, _rows);
     _columns = _columns.concat(column);
   });
-
   viewModel.columns(_columns);
 }
 

+ 32 - 1
desktop/core/static/js/ko.layout.js

@@ -28,6 +28,37 @@ var Column = function (size, rows) {
   var self = this;
   self.size = ko.observable(size);
   self.rows = ko.observableArray(rows);
+  self.oozieStartRow = ko.computed(function() {
+    var _row = null;
+    ko.utils.arrayForEach(self.rows(), function(row) {
+      if ((row.widgets().length > 0 && row.widgets()[0].widgetType() == "start-widget")){
+        _row = row;
+      }
+    });
+    return _row;
+  }, self);
+
+  self.oozieEndRow = ko.computed(function() {
+    var _row = null;
+    ko.utils.arrayForEach(self.rows(), function(row) {
+      if ((row.widgets().length > 0 && row.widgets()[0].widgetType() == "end-widget")){
+        _row = row;
+      }
+    });
+    return _row;
+  }, self);
+
+
+  self.oozieRows = ko.computed(function() {
+    var _rows = [];
+    ko.utils.arrayForEach(self.rows(), function(row) {
+      if ((row.widgets().length > 0 && row.widgets()[0].widgetType() != "start-widget" && row.widgets()[0].widgetType() != "end-widget") || row.widgets().length == 0){
+        _rows.push(row);
+      }
+    });
+    return _rows;
+  }, self);
+
   self.drops = ko.observableArray(["temp"]);
   self.klass = ko.computed(function () {
     return "card card-home card-column span" + self.size();
@@ -223,7 +254,7 @@ function setLayout(colSizes, vm) {
   $(vm.columns()).each(function (cnt, col) {
     var _tRows = [];
     $(col.rows()).each(function (icnt, row) {
-      if (row.widgets().length > 0) {
+      if (row.widgets().length > 0 || (typeof vm.isNested != "undefined" && vm.isNested())) {
         _tRows.push(row);
       }
     });