workflow.modal.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. // Licensed to Cloudera, Inc. under one
  2. // or more contributor license agreements. See the NOTICE file
  3. // distributed with this work for additional information
  4. // regarding copyright ownership. Cloudera, Inc. licenses this file
  5. // to you under the Apache License, Version 2.0 (the
  6. // "License"); you may not use this file except in compliance
  7. // with the License. You may obtain a copy of the License at
  8. //
  9. // http://www.apache.org/licenses/LICENSE-2.0
  10. //
  11. // Unless required by applicable law or agreed to in writing, software
  12. // distributed under the License is distributed on an "AS IS" BASIS,
  13. // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14. // See the License for the specific language governing permissions and
  15. // limitations under the License.
  16. /**
  17. * Modal Control
  18. * Displays a single node in a modal window of your choosing.
  19. * Make sure to update the 'context' member and 'template' members.
  20. * IMPORTANT: Use 'setTemplate', then 'show'.
  21. */
  22. var ModalModule = function($, ko) {
  23. var module = function(modal, template) {
  24. var self = this;
  25. self.el = self.modal = $(modal);
  26. self.context = ko.observable();
  27. self.template = ko.observable(template || '');
  28. self.bound = false;
  29. // exit with escape key.
  30. $(window).on('keyup', function(e) {
  31. if (e.keyCode == 27) {
  32. $('.modal-backdrop').click();
  33. }
  34. });
  35. };
  36. module.prototype.show = function(context) {
  37. var self = this;
  38. if (context) {
  39. self.context(context);
  40. }
  41. ko.applyBindings(self, self.modal[0]);
  42. self.modal.modal('show');
  43. };
  44. module.prototype.hide = function() {
  45. var self = this;
  46. self.modal.modal('hide');
  47. if (self.modal.length > 0 && !!ko.dataFor(self.modal[0])) {
  48. ko.cleanNode(self.modal[0]);
  49. }
  50. };
  51. module.prototype.setTemplate = function(template) {
  52. var self = this;
  53. if (self.modal.length > 0 && !!ko.dataFor(self.modal[0])) {
  54. ko.cleanNode(self.modal[0]);
  55. }
  56. self.template( template );
  57. };
  58. module.prototype.recenter = function(offset_x, offset_y) {
  59. var self = this;
  60. var MARGIN = 10; // pixels around the modal
  61. var modalContentHeight = (($(window).height() - MARGIN*2) -
  62. (self.modal.find(".modal-header").outerHeight() + self.modal.find(".modal-header").outerHeight())) - 20;
  63. self.modal.css("width", ($(window).width() - MARGIN*2)+"px");
  64. self.modal.find(".modal-content").css("max-height", modalContentHeight+"px").css("height", modalContentHeight+"px");
  65. var top = ( ($(window).height() - self.modal.outerHeight(false)) / 2 );
  66. var left = ( ($(window).width() - self.modal.outerWidth(false)) / 2 );
  67. if (top < 0) {
  68. top = 0;
  69. }
  70. if (left < 0) {
  71. left = 0;
  72. }
  73. top += offset_y || 0;
  74. left += offset_x || 0;
  75. self.modal.css({top: top +'px', left: left+'px'});
  76. };
  77. module.prototype.addDecorations = function () {
  78. $(".popover").remove();
  79. $("input[name='job_xml']:not(.pathChooser)").addClass("pathChooser").after(getFileBrowseButton($("input[name='job_xml']:not(.pathChooser)")));
  80. $("input[name='jar_path']").addClass("pathChooser").after(getFileBrowseButton($("input[name='jar_path']")));
  81. $("input[name='script_path']").addClass("pathChooser").after(getFileBrowseButton($("input[name='script_path']")));
  82. $("input[name='command']").addClass("pathChooser").after(getFileBrowseButton($("input[name='command']")));
  83. if (typeof CodeMirror !== 'undefined' && $("textarea[name='xml']").length > 0) {
  84. $("textarea[name='xml']").hide();
  85. var xmlEditor = $("<textarea>").attr("id", "tempXml").prependTo($("textarea[name='xml']").parent())[0];
  86. var codeMirror = CodeMirror(function (elt) {
  87. xmlEditor.parentNode.replaceChild(elt, xmlEditor);
  88. }, {
  89. value:$("textarea[name='xml']").val(),
  90. lineNumbers:true,
  91. autoCloseTags:true
  92. });
  93. codeMirror.on("update", function () {
  94. ko.dataFor($("textarea[name='xml']")[0]).xml(codeMirror.getValue());
  95. });
  96. }
  97. $("*[rel=popover]").each(function(){
  98. if ($(this).find("input").length > 0){
  99. $(this).popover({
  100. placement:'right',
  101. trigger:'hover',
  102. selector: 'input'
  103. });
  104. }
  105. else {
  106. $(this).popover({
  107. placement:'right',
  108. trigger:'hover'
  109. });
  110. }
  111. });
  112. $(".propKey").typeahead({
  113. source:(typeof AUTOCOMPLETE_PROPERTIES != 'undefined') ? AUTOCOMPLETE_PROPERTIES : []
  114. });
  115. }
  116. return module;
  117. };