242 lines
8.8 KiB
HTML
242 lines
8.8 KiB
HTML
{% load i18n %}
|
|
<script id="configs_template" type="text/template">
|
|
<tr id_attr="$id" class="row data-row">
|
|
<td class="col-sm-5 small-padding">
|
|
<input type="text" class="form-control" field="key" list="properties" placeholder="{% trans "Select property name" %}"
|
|
onkeyup="trySetValue(this)" onchange="trySetValue(this)" onclick="trySetValue(this)"
|
|
value="$name" />
|
|
</td>
|
|
<td class="col-sm-5 small-padding">
|
|
<input type="text" class="form-control" field="value"
|
|
onkeyup="set_props()" onchange="set_props()" onclick="set_props()"
|
|
value="$value" />
|
|
</td>
|
|
<td class="col-sm-2 small-padding">
|
|
<input type="button" class="btn btn-danger"
|
|
onclick="delete_prop(this)" value="{% trans "Remove" %}" />
|
|
</td>
|
|
</tr>
|
|
</script>
|
|
<script id="args_template" type="text/template">
|
|
<tr id_attr="$id" class="row data-row">
|
|
<td class="col-sm-5 small-padding">
|
|
<input type="text" class="form-control" field="key"
|
|
onkeyup="set_props()" onchange="set_props()" onclick="set_props()"
|
|
value="$name" />
|
|
</td>
|
|
<td class="col-sm-5 small-padding">
|
|
<input type="text" class="form-control" field="value"
|
|
onkeyup="set_props()" onchange="set_props()" onclick="set_props()"
|
|
value="$value" />
|
|
</td>
|
|
<td class="col-sm-2 small-padding">
|
|
<input type="button" class="btn btn-danger"
|
|
onclick="delete_prop(this)" value="{% trans "Remove" %}" />
|
|
</td>
|
|
</tr>
|
|
</script>
|
|
<script id="args_array_template" type="text/template">
|
|
<tr id_attr="$id" class="row data-row">
|
|
<td class="col-sm-10 small-padding">
|
|
<input type="text" class="form-control" field="value"
|
|
onkeyup="set_props()" onchange="set_props()" onclick="set_props()"
|
|
value="$value" />
|
|
</td>
|
|
<td class="col-sm-2 small-padding">
|
|
<input type="button" class="btn btn-danger"
|
|
onclick="delete_prop(this)" value="{% trans "Remove" %}" />
|
|
</td>
|
|
</tr>
|
|
</script>
|
|
<script id="table_template" type="text/template">
|
|
<table>
|
|
<tr class="row">
|
|
<td class="col-sm-5 small-padding"><label>{% trans "Name" %}</label></td>
|
|
<td class="col-sm-5 small-padding"><label>{% trans "Value" %}</label></td>
|
|
</tr>
|
|
</table>
|
|
<div class="input">
|
|
<a class="btn btn-default btn-inline" onclick="add_prop('$target');">{% trans "Add" %}</a>
|
|
</div>
|
|
</script>
|
|
<script id="array_table_template" type="text/template">
|
|
<table>
|
|
<tr class="row">
|
|
<th class="col-sm-10 small-padding"><label>{% trans "Value" %}</label></th>
|
|
</tr>
|
|
</table>
|
|
<div class="input">
|
|
<a class="btn btn-default btn-inline" onclick="add_prop('$target');">{% trans "Add" %}</a>
|
|
</div>
|
|
</script>
|
|
<script type="text/javascript">
|
|
function get_next_id(target) {
|
|
var max = -1;
|
|
$("#" + target + " tr.data-row").each(function () {
|
|
max = Math.max(max, parseInt($(this).attr("id_attr")));
|
|
});
|
|
return max + 1;
|
|
}
|
|
|
|
function set_props() {
|
|
$(targets).each(function (index, target) {
|
|
if (target.match(/.*?array.*/) != null) {
|
|
var configs = [];
|
|
$("#" + target + " tr.data-row").each(function (index) {
|
|
configs[index] = $(this).find("td input[field=value]").val();
|
|
});
|
|
$("#job_" + target).val(JSON.stringify(configs));
|
|
} else {
|
|
var configs = {};
|
|
$("#" + target + " tr.data-row").each(function () {
|
|
var key = $(this).find("td input[field=key]").val();
|
|
configs[key] = $(this).find("td input[field=value]").val();
|
|
});
|
|
$("#job_" + target).val(JSON.stringify(configs));
|
|
}
|
|
});
|
|
}
|
|
|
|
function add_prop(target, name, value) {
|
|
var name = (typeof name === 'undefined') ? '' : name;
|
|
var value = (typeof value === 'undefined') ? '' : value;
|
|
$("#" + target + " table").show();
|
|
var id = get_next_id(target);
|
|
var tmpl_from = target == "params" ? "args" : target;
|
|
var template = $("#" + tmpl_from + "_template").text()
|
|
.replace(/\$id/g, id);
|
|
template = template.replace(/\$name/g, name);
|
|
template = template.replace(/\$value/g, value);
|
|
$("#" + target + " tr").last().after(template);
|
|
set_props();
|
|
return id
|
|
}
|
|
|
|
function delete_prop(el) {
|
|
var tr = $(el).closest("tr");
|
|
var target = $(tr).closest("div").attr("id");
|
|
tr.remove();
|
|
var id = get_next_id(target);
|
|
if (id == 0) {
|
|
$("#" + target + " table").hide();
|
|
}
|
|
set_props();
|
|
}
|
|
|
|
function trySetValue(el) {
|
|
var prop_id = $(el).parent().attr("id_attr");
|
|
if (properties[$(el).val()] != "undefined") {
|
|
$("#configs").find("tr[id_attr='" + prop_id + "']")
|
|
.find("td input[field=value]").val(properties[$(el).val()])
|
|
}
|
|
set_props();
|
|
}
|
|
|
|
function get_targets(job_type) {
|
|
var res = ["configs"];
|
|
if ($.inArray(job_type, ["Hive", "Pig", "Shell"]) != -1) {
|
|
res.push("params");
|
|
}
|
|
if ($.inArray(job_type, ["Java", "Pig", "Spark", "Shell", "Storm"]) != -1) {
|
|
res.push("args_array");
|
|
}
|
|
return res;
|
|
}
|
|
|
|
function load_prior_configs() {
|
|
for(targ in targets) {
|
|
if ($("#id_job_" + targets[targ]).val()!= "") {
|
|
var configs = JSON.parse($("#id_job_" + targets[targ]).val());
|
|
for(conf in configs) {
|
|
add_prop(targets[targ], conf, configs[conf]);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
function hide_unnecessary_fields() {
|
|
if ($.inArray(job_type, ["Java", "Spark", "Shell", "Storm"]) != -1) {
|
|
$("[name=job_input]").closest(".form-group").hide();
|
|
$("[name=job_output]").closest(".form-group").hide();
|
|
}
|
|
if ($.inArray(job_type, ["Hive", "MapReduce", "MapReduce.Streaming", "Pig", "Shell"]) != -1) {
|
|
$("[name=java_opts]").closest(".form-group").hide();
|
|
$("[name=main_class]").closest(".form-group").hide();
|
|
}
|
|
if (job_type != "MapReduce.Streaming") {
|
|
$("[name=streaming_mapper]").closest(".form-group").hide();
|
|
$("[name=streaming_reducer]").closest(".form-group").hide();
|
|
}
|
|
if (job_type != "Java") {
|
|
$("[name=hbase_common_lib]").closest(".form-group").hide();
|
|
$("[name=adapt_oozie]").closest(".form-group").hide();
|
|
}
|
|
}
|
|
|
|
function override_field_labels() {
|
|
if (job_type == "Shell") {
|
|
$("#params > label").text(gettext('Environment Variables'));
|
|
}
|
|
}
|
|
|
|
properties = {};
|
|
$("label[for=id_property_name]").hide();
|
|
$("#id_property_name").hide().find("option")
|
|
.each(function () {
|
|
properties[$(this).text()] = $(this).val()
|
|
});
|
|
$.each(properties, function (key, value) {
|
|
$("#properties")
|
|
.append($("<option></option>")
|
|
.attr("value", key)
|
|
.text(value))
|
|
});
|
|
$("#job_cfg").children().hide();
|
|
|
|
var targets;
|
|
var job_type;
|
|
|
|
$.ajax({
|
|
url: "{% url 'horizon:project:data_processing.jobs:launch-job' %}",
|
|
data: {"job_id": $("#id_job").val(),
|
|
"json": true },
|
|
success: function (data, textStatus, jqXHR) {
|
|
job_type = data["job_type"];
|
|
$("#job_type").val(job_type);
|
|
targets = get_targets(job_type);
|
|
},
|
|
complete: function (jqXHR, textStatus) {
|
|
$(targets).each(function (index, target) {
|
|
var template = target == "args_array" ? "#array_table_template" : "#table_template";
|
|
$("#" + target).show().append($(template).text()
|
|
.replace(/\$target/g, target));
|
|
});
|
|
$("#job_cfg table").hide();
|
|
hide_unnecessary_fields();
|
|
override_field_labels();
|
|
load_prior_configs();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
{% include "horizon/common/_form_fields.html" %}
|
|
|
|
<input type="hidden" value="{}" name="job_configs" id="job_configs">
|
|
<input type="hidden" value="[]" name="job_args_array" id="job_args_array">
|
|
<input type="hidden" value="{}" name="job_params" id="job_params">
|
|
<input type="hidden" value="" name="job_type" id="job_type">
|
|
|
|
<datalist id="properties"></datalist>
|
|
|
|
<div id="job_cfg">
|
|
<div id="configs">
|
|
<label>{% trans "Configuration" %}</label>
|
|
</div>
|
|
<div id="params">
|
|
<label>{% trans "Parameters" %}</label>
|
|
</div>
|
|
<div id="args_array">
|
|
<label>{% trans "Arguments" %}</label>
|
|
</div>
|
|
</div>
|