openstack/horizon
Code Issues Proposed changes

Data Processing post-bootstrap 3 UI fixes

Browse Source 
Some of the data processing forms were showing extra fields
that should have been hidden.  That was fixed by using
form-group rather than control-group.  Also, the cancel button
was missing its outline on some of the forms because it was
missing the btn-default class.  Other buttons used to choose
libraries and add configs were also missing btn-default.
* Details pages had a large gap, fixed row-fluid --> col-sm-12
* row-fluid --> row in other places per migration guide
* icon-plus/minus --> glyphicon-plus/minus
* select inputs have now have form-control class
* unnecessary margins deleted for "Remove" buttons
* list-style added for node processes <ul>

Co-Authored-By: Nikita Konovalov <nkonovalov@mirantis.com>
Change-Id: I5f988516290c95e6dba663aa58abeb07563c5bb4
Closes-Bug: #1350372
Closes-Bug: #1352590
Closes-Bug: #1352812
This commit is contained in:
Chad Roberts 2014-07-30 11:28:38 -04:00 committed by Nikita Konovalov
parent 516f1e2aca
commit 82fb7286c5
40 changed files with 202 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
openstack_dashboard/dashboards/project/data_processing/cluster_templates/templates/data_processing.cluster_templates/_details.html
View File

@ -1,7 +1,7 @@
{% load i18n sizeformat %}
{% load url from future %}
<h3>{% trans "Template Overview" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Name" %}</dt>
<dd>{{ template.name }}</dd>
@ -20,7 +20,7 @@
<dt>{% trans "Anti-affinity enabled for" %}</dt>
{% if template.anti_affinity %}
<dd>
<ul>
<ul class="list-bullet">
{% for process in template.anti_affinity %}
<li>{{ process }}</li>
{% endfor %}

4
openstack_dashboard/dashboards/project/data_processing/cluster_templates/templates/data_processing.cluster_templates/_nodegroups_details.html
View File

@ -1,7 +1,7 @@
{% load i18n sizeformat %}
{% load url from future %}
<h3>{% trans "Node Groups" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
{% for node_group in template.node_groups %}
<dl class="well">
<h4>{% trans "Node Group" %}: {{ node_group.name }}</h4>
@ -21,7 +21,7 @@
<dt>{% trans "Node Processes" %}</dt>
{% if node_group.node_processes %}
<dd>
<ul>
<ul class="list-bullet">
{% for process in node_group.node_processes %}
<li>{{ process }}</li>
{% endfor %}

2
openstack_dashboard/dashboards/project/data_processing/cluster_templates/templates/data_processing.cluster_templates/_upload_file.html
View File

@ -20,5 +20,5 @@
{% block modal-footer %}
<input class="btn btn-primary pull-right" id="upload_file_btn" type="submit" value="{% trans "Upload" %}"/>
<a href="{% url 'horizon:project:data_processing.cluster_templates:index' %}" class="btn secondary cancel close">{% trans "Cancel" %}</a>
<a href="{% url 'horizon:project:data_processing.cluster_templates:index' %}" class="btn btn-default secondary cancel close">{% trans "Cancel" %}</a>
{% endblock %}

97
openstack_dashboard/dashboards/project/data_processing/cluster_templates/templates/data_processing.cluster_templates/cluster_node_groups_template.html
View File

@ -1,30 +1,26 @@
<script>
var template = '<tr id_attr="$id"><td>' +
'<div class="input control-group" style="padding-right:15px;">' +
var template =
'<tr class="row data-template-row" id_attr="$id" style="padding:5px">' +
'<td class="col-sm-4 small-padding">' +
'<input id="template_id_$id" value="$template_id" type="hidden" name="template_id_$id">' +
'<input id="group_name_$id" value="$group_name" type="text" name="group_name_$id" class="input-medium">' +
'</div>' +
'</td>' +
'<td>' +
'<div class="input control-group" style="padding-right:15px;"><input disabled value="$template_name" class="input-medium" /></div>' +
'</td>' +
'<td>' +
'<div class="input control-group btn-group input-append" style="float:left;padding-right:5px;">' +
'<input id="count_$id" class="count-field" value="$node_count" type="text" max="4" maxlength="4" name="count_$id" size="4" style="width:50px">' +
'<div class="btn dec-btn" data-count-id="count_$id"><i class="icon-minus"></i></div>' +
'<div class="btn inc-btn" data-count-id="count_$id"><i class="icon-plus"></i></div>' +
'</div>' +
'<div class="input" style="float:left">' +
'</div>' +
'</td>' +
'<td>' +
'<div class="input control-group" style="float:left;padding-right:5px;">' +
'<input type="button" class="btn btn-danger" id="delete_btn_$id" data-toggle="dropdown" onclick="delete_node_group(this)" value="Remove" style="margin-bottom: 10px"/>' +
'</div>' +
'</td>' +
'</tr>';
'<input id="group_name_$id" value="$group_name" type="text" name="group_name_$id" class="form-control">' +
'</td>' +
'<td class="col-sm-3 small-padding">' +
'<input disabled value="$template_name" class="form-control" />' +
'</td>' +
'<td class="col-sm-3 small-padding">' +
'<span class="input-group input-append">' +
'<input id="count_$id" class="count-field form-control" value="$node_count" type="text" max="4" maxlength="4" name="count_$id" size="4">' +
'<span class="input-group-btn">' +
'<div class="btn btn-default dec-btn" data-count-id="count_$id"><i class="glyphicon-minus"></i></div>' +
'<div class="btn btn-default inc-btn" data-count-id="count_$id"><i class="glyphicon-plus"></i></div>' +
'</span>' +
'</span>' +
'</td>' +
'<td class="col-sm-2 small-padding">' +
'<input type="button" class="btn btn-danger" id="delete_btn_$id" data-toggle="dropdown" onclick="delete_node_group(this)" value="Remove" />' +
'</td>' +
'</tr>';
function mark_element_as_wrong(id){
$("#"+id).parent("div").addClass("error");
@ -32,7 +28,7 @@
function get_next_id() {
var max = -1;
$("#node-templates tbody tr").each(function () {
$(".data-template-row").each(function () {
max = Math.max(max, parseInt($(this).attr("id_attr")));
});
return max + 1;
@ -40,8 +36,11 @@
function set_nodes_ids() {
var ids = [];
$("#node-templates tbody tr").each(function () {
ids.push(parseInt($(this).attr("id_attr")));
$(".data-template-row").each(function () {
var id = parseInt($(this).attr("id_attr"));
if (!!id) {
ids.push(id);
}
});
$("#forms_ids").val(JSON.stringify(ids));
}
@ -54,7 +53,7 @@
replace(/\$template_id/g, template_id).
replace(/\$node_count/g, node_count).
replace(/\$template_name/g, template_name);
$("#node-templates tbody").append(tmp);
$("#header_row").after(tmp);
if (!deletable) {
$("#delete_btn_" + id).remove();
$("#group_name_" + id).prop('readonly', true);
@ -73,8 +72,7 @@
$(".count-field").change();
}
function delete_node_group(el) {
var tr = $(el).parents("tr")[0];
tr.parentNode.removeChild(tr);
$(el).closest("tr").remove();
var id = get_next_id();
if (id == 0) {
$("#node-templates").hide();
@ -91,27 +89,30 @@
$("#node-templates").hide();
</script>
<input type="hidden" value="[]" name="forms_ids" id="forms_ids">
<div class="input">
<select id="template_id" name="template">
<option>Select</option>
{% for template in form.templates %}
<option value="{{ template.id }}">{{ template.name }}</option>
{% endfor %}
</select>
<a id="add_group_button" class="btn disabled btn-inline" onclick="add_node_group_template(1);">+</a>
</div>
<label for="template_id">Select a Node Group Template to add:</label>
<span class="row">
<span class="input-group col-sm-4">
<select id="template_id" name="template" class="form-control">
<option>Select</option>
{% for template in form.templates %}
<option value="{{ template.id }}">{{ template.name }}</option>
{% endfor %}
</select>
<span class="input-group-btn">
<button type="button" id="add_group_button" class="btn btn-default disabled" onclick="add_node_group_template(1);">
<span class="glyphicon glyphicon-plus"></span>
</button>
</span>
</span>
</span>
<br/>
<div id="node-templates">
<table>
<thead>
<tr>
<td><label style="padding-bottom:5px">Group Name</label></td>
<td><label style="padding-bottom:5px">Template&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label></td>
<td><label style="padding-bottom:5px">Count</label></td>
<tr id="header_row" class="row">
<th class="col-sm-4 small-padding"><label>Group Name</label></th>
<th class="col-sm-3 small-padding"><label>Template</label></th>
<th class="col-sm-3 small-padding"><label>Count</label></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<script>

6
openstack_dashboard/dashboards/project/data_processing/cluster_templates/templates/data_processing.cluster_templates/cluster_templates.html
View File

@ -47,15 +47,15 @@
$(".configure-clustertemplate-btn")[0].href = oldHref;
return false;
});
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
}
//display version for selected plugin
$(document).on('change', '.plugin_name_choice', switch_versions);
function switch_versions() {
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
var plugin = $(this);
$("." + plugin.val() + "_version_choice").closest(".control-group").show();
$("." + plugin.val() + "_version_choice").closest(".form-group").show();
}
$(".plugin_name_choice").change();
});

4
openstack_dashboard/dashboards/project/data_processing/cluster_templates/templates/data_processing.cluster_templates/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

2
openstack_dashboard/dashboards/project/data_processing/clusters/templates/data_processing.clusters/_create_cluster.html
View File

@ -19,5 +19,5 @@
{% block modal-footer %}
<input class="btn btn-primary pull-right" id="create_cluster_btn" type="submit" value="{% trans " Done" %}"/>
<a href="{% url 'horizon:project:data_processing.clusters:index' %}" class="btn secondary cancel close">{% trans "Cancel" %}</a>
<a href="{% url 'horizon:project:data_processing.clusters:index' %}" class="btn btn-default secondary cancel close">{% trans "Cancel" %}</a>
{% endblock %}

4
openstack_dashboard/dashboards/project/data_processing/clusters/templates/data_processing.clusters/_details.html
View File

@ -1,7 +1,7 @@
{% load i18n sizeformat %}
{% load url from future %}
<h3>{% trans "Cluster Overview" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Name" %}</dt>
<dd>{{ cluster.name }}</dd>
@ -46,7 +46,7 @@
<dt>{% trans "Anti-affinity enabled for" %}</dt>
{% if cluster.anti_affinity %}
<dd>
<ul>
<ul class="list-bullet">
{% for process in cluster.anti_affinity %}
<li>{{ process }}</li>
{% endfor %}

2
openstack_dashboard/dashboards/project/data_processing/clusters/templates/data_processing.clusters/_instances_details.html
View File

@ -1,5 +1,5 @@
{% load i18n sizeformat %}
<h3>{% trans "Cluster Instances" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
{{ cluster_instances_table.render }}
</div>

4
openstack_dashboard/dashboards/project/data_processing/clusters/templates/data_processing.clusters/_nodegroups_details.html
View File

@ -4,7 +4,7 @@
<h3>{% trans "Node Groups" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
{% for node_group in cluster.node_groups %}
<dl class="well">
<h4>{% trans "Name" %}: {{ node_group.name }}</h4>
@ -29,7 +29,7 @@
<dt>{% trans "Node Processes" %}</dt>
{% if node_group.node_processes %}
<dd>
<ul>
<ul class="list-bullet">
{% for process in node_group.node_processes %}
<li>{{ process }}</li>
{% endfor %}

6
openstack_dashboard/dashboards/project/data_processing/clusters/templates/data_processing.clusters/clusters.html
View File

@ -42,15 +42,15 @@
$(".configure-cluster-btn")[0].href = oldHref;
return false;
});
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
}
//display version for selected plugin
$(document).on('change', '.plugin_name_choice', switch_versions);
function switch_versions() {
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
var plugin = $(this);
$("." + plugin.val() + "_version_choice").closest(".control-group").show();
$("." + plugin.val() + "_version_choice").closest(".form-group").show();
}
$(".plugin_name_choice").change();
});

4
openstack_dashboard/dashboards/project/data_processing/clusters/templates/data_processing.clusters/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

3
openstack_dashboard/dashboards/project/data_processing/data_image_registry/forms.py
View File

@ -29,8 +29,7 @@ class ImageForm(forms.SelfHandlingForm):
description = forms.CharField(max_length=80,
label=_("Description"),
required=False,
widget=forms.Textarea(attrs={'cols': 80,
'rows': 20}))
widget=forms.Textarea())
def handle(self, request, data):
try:

2
openstack_dashboard/dashboards/project/data_processing/data_image_registry/templates/data_processing.data_image_registry/_edit_tags.html
View File

@ -25,5 +25,5 @@
{% block modal-footer %}
<input class="btn btn-primary pull-right" id="edit_image_tags_btn" type="submit" value="{% trans "Done" %}"/>
<a href="{% url 'horizon:project:data_processing.data_image_registry:index' %}" class="btn secondary cancel close">{% trans "Cancel" %}</a>
<a href="{% url 'horizon:project:data_processing.data_image_registry:index' %}" class="btn btn-default secondary cancel close">{% trans "Cancel" %}</a>
{% endblock %}

2
openstack_dashboard/dashboards/project/data_processing/data_image_registry/templates/data_processing.data_image_registry/_register_image.html
View File

@ -23,5 +23,5 @@
{% block modal-footer %}
<input class="btn btn-primary pull-right" id="edit_image_tags_btn" type="submit" value="{% trans "Done" %}"/>
<a href="{% url 'horizon:project:data_processing.data_image_registry:index' %}" class="btn secondary cancel close">{% trans "Cancel" %}</a>
<a href="{% url 'horizon:project:data_processing.data_image_registry:index' %}" class="btn btn-default secondary cancel close">{% trans "Cancel" %}</a>
{% endblock %}

64
openstack_dashboard/dashboards/project/data_processing/data_image_registry/templates/data_processing.data_image_registry/_tag_form.html
View File

@ -3,38 +3,42 @@
<div style="clear: both;"></div>
<div id="plugin_populate_section">
<h5>{% trans "Register tags required for the Plugin with specified Data Processing Version" %}</h5>
<br>
<table style="margin-bottom: 4px">
<tr>
<td style="width: 200px">
<label for="plugin_select">{% trans "Plugin" %}</label>
<select id="plugin_select" class="plugin-choice" style="width: 100%">
{% for plugin, version_dict in plugins.items %}
<option value="{{ plugin }}">{{ plugin }}</option>
<span class="row">
<span class="col-sm-4 small-padding"><b>{% trans "Plugin" %}</b></span>
<span class="col-sm-3 small-padding"><b>{% trans "Version" %}</b></span>
</span>
<span class="row">
<span class="col-sm-4 small-padding">
<select id="plugin_select" class="plugin-choice form-control">
{% for plugin, version_dict in plugins.items %}
<option value="{{ plugin }}">{{ plugin }}</option>
{% endfor %}
</select>
</span>
<span class="col-sm-3 small-padding">
{% for plugin, version_dict in plugins.items %}
<div id="version_group_{{ plugin }}" class="data_processing-version-choice" >
<select id="data_processing_version_{{ plugin }}" class="form-control">
{% for version, tags in version_dict.items %}
<option value="{{ version }}">{{ version }}</option>
{% endfor %}
</select>
</td>
<td style="width: 200px">
{% for plugin, version_dict in plugins.items %}
<div id="version_group_{{ plugin }}" class="data_processing-version-choice" >
<label for="data_processing_version_{{ plugin }}">{% trans "Version" %}</label>
<select id="data_processing_version_{{ plugin }}" style="width: 100%">
{% for version, tags in version_dict.items %}
<option value="{{ version }}">{{ version }}</option>
{% endfor %}
</select>
</div>
{% endfor %}
</td>
</tr>
</table>
<input type="button" id="add_all_btn" class="btn btn-small" value="{% trans "Add all" %}" />
</div>
</div>
{% endfor %}
</span>
<span class="col-sm-4 small-padding">
<input type="button" id="add_all_btn" class="btn btn-default" value="{% trans "Add plugin tags" %}" />
</span>
</span>
<span class="row">
<span class="col-sm-7 small-padding">
<input type="text" class="tag-input form-control" id="_sahara_image_tag"/>
</span>
<span class="col-sm-3 small-padding">
<button type="button" id="add_tag_btn" class="btn btn-default btn-small btn-create btn-inline" onclick="add_tag_to_image()">{% trans "Add custom tag" %}</button>
</span>
</span>
<hr />
<div style="margin-top: 5px;">
<input type="text" class="tag-input" id="_sahara_image_tag" data-original-title="" onclick=""/>
<a href="#" id="add_tag_btn" class="btn btn-small btn-create btn-inline" onclick="add_tag_to_image()">{% trans "Add custom tag" %}</a>
</div>
<script type="text/javascript">
@ -53,7 +57,7 @@
add_tag_to_image(tag);
});
})
})
});
$("#_sahara_image_tag").keypress(function (event) {
if (event.keyCode == 13) {

2
openstack_dashboard/dashboards/project/data_processing/data_plugins/templates/data_processing.data_plugins/_details.html
View File

@ -14,7 +14,7 @@
<dd>{{ plugin.description }}</dd>
<dt>{% trans "Supported Versions" %}</dt>
<dd>
<ul>
<ul class="list-bullet">
{% for version in plugin.versions %}
<li>{{ version }}</li>
{% endfor %}

2
openstack_dashboard/dashboards/project/data_processing/data_sources/templates/data_processing.data_sources/_details.html
View File

@ -1,6 +1,6 @@
{% load i18n sizeformat %}
<h3>{% trans "Data Source Overview" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Name" %}</dt>
<dd>{{ data_source.name }}</dd>

4
openstack_dashboard/dashboards/project/data_processing/data_sources/templates/data_processing.data_sources/data_sources_form_script.html
View File

@ -3,8 +3,8 @@
addHorizonLoadEvent(function () {
horizon.modals.addModalInitFunction(function (modal) {
$("#id_data_source_type").change(function() {
var username = $("#id_data_source_credential_user").closest(".control-group");
var password = $("#id_data_source_credential_pass").closest(".control-group")
var username = $("#id_data_source_credential_user").closest(".form-group");
var password = $("#id_data_source_credential_pass").closest(".form-group")
switch($(this).val()) {
case "hdfs":
username.hide();

4
openstack_dashboard/dashboards/project/data_processing/data_sources/templates/data_processing.data_sources/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

2
openstack_dashboard/dashboards/project/data_processing/job_binaries/templates/data_processing.job_binaries/_create.html
View File

@ -23,5 +23,5 @@
{% block modal-footer %}
<input class="btn btn-primary pull-right" id="upload_file_btn" type="submit" value="{% trans "Create" %}"/>
<a href="{% url 'horizon:project:data_processing.job_binaries:index' %}" class="btn secondary cancel close">{% trans "Cancel" %}</a>
<a href="{% url 'horizon:project:data_processing.job_binaries:index' %}" class="btn btn-default secondary cancel close">{% trans "Cancel" %}</a>
{% endblock %}

6
openstack_dashboard/dashboards/project/data_processing/job_binaries/templates/data_processing.job_binaries/_create_job_binary_help.html
View File

@ -6,14 +6,14 @@
</p>
<p>
{% blocktrans %}Select the storage type for your job binary.{% endblocktrans %}
<ul>
<ul class="list-bullet">
<li>{% blocktrans %}Data Processing internal database{% endblocktrans %}</li>
<li>{% blocktrans %}Swift{% endblocktrans %}</li>
</ul>
</p>
<p>
{% blocktrans %}For Data Processing internal job binaries, you may choose from the following:{% endblocktrans %}
<ul>
<ul class="list-bullet">
<li>{% blocktrans %}Choose an existing file{% endblocktrans %}</li>
<li>{% blocktrans %}Upload a new file{% endblocktrans %}</li>
<li>{% blocktrans %}Create a script to be uploaded dynamically{% endblocktrans %}</ul>
@ -21,7 +21,7 @@
</p>
<p>
{% blocktrans %}For Object Store job binaries, you must:{% endblocktrans %}
<ul>
<ul class="list-bullet">
<li>{% blocktrans %}Enter the URL for the file{% endblocktrans %}</li>
<li>{% blocktrans %}Enter the username and password required to access that file{% endblocktrans %}</li>
</ul>

2
openstack_dashboard/dashboards/project/data_processing/job_binaries/templates/data_processing.job_binaries/_details.html
View File

@ -1,6 +1,6 @@
{% load i18n %}
<h3>{% trans "Job Binary Overview" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Name" %}</dt>
<dd>{{ job_binary.name }}</dd>

4
openstack_dashboard/dashboards/project/data_processing/job_binaries/templates/data_processing.job_binaries/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

34
openstack_dashboard/dashboards/project/data_processing/job_binaries/templates/data_processing.job_binaries/job_binaries_form_script.html
View File

@ -4,21 +4,21 @@
horizon.modals.addModalInitFunction(function (modal) {
hide_extra_fields();
function hide_extra_fields() {
$("[name=job_binary_username]").closest(".control-group").hide();
$("[name=job_binary_password]").closest(".control-group").hide();
$("[name=job_binary_file]").closest(".control-group").hide();
$("[name=job_binary_url]").closest(".control-group").hide();
$("[name=job_binary_internal]").closest(".control-group").hide();
$("[name=job_binary_username]").closest(".form-group").hide();
$("[name=job_binary_password]").closest(".form-group").hide();
$("[name=job_binary_file]").closest(".form-group").hide();
$("[name=job_binary_url]").closest(".form-group").hide();
$("[name=job_binary_internal]").closest(".form-group").hide();
}
$("#id_job_binary_type").change(function() {
var label = $("#id_job_binary_url_label");
var bin_file = $("[name=job_binary_file]").closest(".control-group");
var bin_choice = $("[name=job_binary_internal]").closest(".control-group");
var bin_url = $("[name=job_binary_url]").closest(".control-group");
var username = $("[name=job_binary_username]").closest(".control-group");
var password = $("[name=job_binary_password]").closest(".control-group");
var script_name = $("[name=job_binary_script_name]").closest(".control-group");
var script_text = $("[name=job_binary_script]").closest(".control-group");
var bin_file = $("[name=job_binary_file]").closest(".form-group");
var bin_choice = $("[name=job_binary_internal]").closest(".form-group");
var bin_url = $("[name=job_binary_url]").closest(".form-group");
var username = $("[name=job_binary_username]").closest(".form-group");
var password = $("[name=job_binary_password]").closest(".form-group");
var script_name = $("[name=job_binary_script_name]").closest(".form-group");
var script_text = $("[name=job_binary_script]").closest(".form-group");
switch($(this).val()) {
case "internal-db":
label.html("internal-db://");
@ -45,11 +45,11 @@
$("#id_job_binary_type").change();
$("[name=job_binary_internal]").change(function() {
var bin_file = $("[name=job_binary_file]").closest(".control-group");
var bin_choice = $("[name=job_binary_internal]").closest(".control-group");
var bin_url = $("[name=job_binary_url]").closest(".control-group");
var script_name = $("[name=job_binary_script_name]").closest(".control-group");
var script_text = $("[name=job_binary_script]").closest(".control-group");
var bin_file = $("[name=job_binary_file]").closest(".form-group");
var bin_choice = $("[name=job_binary_internal]").closest(".form-group");
var bin_url = $("[name=job_binary_url]").closest(".form-group");
var script_name = $("[name=job_binary_script_name]").closest(".form-group");
var script_text = $("[name=job_binary_script]").closest(".form-group");
switch($(this).val()) {
case "%%%NEWSCRIPT%%%":
bin_file.hide();

2
openstack_dashboard/dashboards/project/data_processing/job_executions/templates/data_processing.job_executions/_details.html
View File

@ -1,6 +1,6 @@
{% load i18n sizeformat %}
<h3>{% trans "Job Execution Overview" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Status" %}</dt>
<dd>{{ job_execution.info.status }}</dd>

4
openstack_dashboard/dashboards/project/data_processing/job_executions/templates/data_processing.job_executions/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

6
openstack_dashboard/dashboards/project/data_processing/job_executions/templates/data_processing.job_executions/job_executions.html
View File

@ -47,15 +47,15 @@
$("#hiddenbutton").click();
return false;
});
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
}
//display version for selected plugin
$(document).on('change', '.plugin_name_choice', switch_versions);
function switch_versions() {
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
var plugin = $(this);
$("." + plugin.val() + "_version_choice").closest(".control-group").show();
$("." + plugin.val() + "_version_choice").closest(".form-group").show();
}
$(".plugin_name_choice").change();
});

2
openstack_dashboard/dashboards/project/data_processing/jobs/templates/data_processing.jobs/_create_job_help.html
View File

@ -5,7 +5,7 @@
</p>
<p>
{% blocktrans %}Select the type of your job:{% endblocktrans %}
<ul>
<ul class="list-bullet">
<li>{% blocktrans %}Pig{% endblocktrans %}</li>
<li>{% blocktrans %}Hive{% endblocktrans %}</li>
<li>{% blocktrans %}MapReduce{% endblocktrans %}</li>

2
openstack_dashboard/dashboards/project/data_processing/jobs/templates/data_processing.jobs/_details.html
View File

@ -1,6 +1,6 @@
{% load i18n sizeformat %}
<h3>{% trans "Job" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Name" %}</dt>
<dd>{{ job.name }}</dd>

22
openstack_dashboard/dashboards/project/data_processing/jobs/templates/data_processing.jobs/config_template.html
View File

@ -1,7 +1,7 @@
{% load i18n %}
<script id="configs_template" type="text/template">
<tr id_attr="$id">
<div class="input control-group">
<div class="input form-group">
<td><input style="display: inline" field="key" list="properties" placeholder="Select property name"
onkeyup="trySetValue(this)" onchange="trySetValue(this)" onclick="trySetValue(this)"
value="$name"/></td>
@ -15,7 +15,7 @@
</script>
<script id="args_template" type="text/template">
<tr id_attr="$id">
<div class="input control-group">
<div class="input form-group">
<td><input style="display: inline" field="key"
onkeyup="set_props()" onchange="set_props()" onclick="set_props()"
value="$name"/></td>
@ -29,7 +29,7 @@
</script>
<script id="args_array_template" type="text/template">
<tr id_attr="$id">
<div class="input control-group">
<div class="input form-group">
<td><input style="display: inline; margin-left:10px; margin-right:10px" field="value" class="input-medium"
onkeyup="set_props()" onchange="set_props()" onclick="set_props()"
value="$value"/></td>
@ -50,7 +50,7 @@
</tbody>
</table>
<div class="input">
<a class="btn btn-inline" onclick="add_prop('$target');">Add</a>
<a class="btn btn-default btn-inline" onclick="add_prop('$target');">Add</a>
</div>
</script>
<script id="array_table_template" type="text/template">
@ -64,7 +64,7 @@
</tbody>
</table>
<div class="input">
<a class="btn btn-inline" onclick="add_prop('$target');">Add</a>
<a class="btn btn-default btn-inline" onclick="add_prop('$target');">Add</a>
</div>
</script>
<script type="text/javascript">
@ -153,15 +153,15 @@
function hide_unnecessary_fields() {
if (job_type == "Java") {
$("[name=job_input]").closest(".control-group").hide();
$("[name=job_output]").closest(".control-group").hide();
$("[name=job_input]").closest(".form-group").hide();
$("[name=job_output]").closest(".form-group").hide();
} else {
$("[name=java_opts]").closest(".control-group").hide();
$("[name=main_class]").closest(".control-group").hide();
$("[name=java_opts]").closest(".form-group").hide();
$("[name=main_class]").closest(".form-group").hide();
}
if (job_type != "MapReduce.Streaming") {
$("[name=streaming_mapper]").closest(".control-group").hide();
$("[name=streaming_reducer]").closest(".control-group").hide();
$("[name=streaming_mapper]").closest(".form-group").hide();
$("[name=streaming_reducer]").closest(".form-group").hide();
}
}

4
openstack_dashboard/dashboards/project/data_processing/jobs/templates/data_processing.jobs/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

18
openstack_dashboard/dashboards/project/data_processing/jobs/templates/data_processing.jobs/jobs.html
View File

@ -34,8 +34,8 @@
function hide_extra_fields() {
for(i=2; i <= $("[name=extra_locations]").val(); i++) {
$("[name=job_main_" + i + "]").closest(".control-group").hide();
$("[name=job_lib_" + i + "]").closest(".control-group").hide();
$("[name=job_main_" + i + "]").closest(".form-group").hide();
$("[name=job_lib_" + i + "]").closest(".form-group").hide();
}
}
@ -66,15 +66,15 @@
$(".create_job_class")[0].href = oldHref;
return false;
});
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
}
//display version for selected plugin
$(document).on('change', '.plugin_name_choice', switch_versions);
function switch_versions() {
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
var plugin = $(this);
$("." + plugin.val() + "_version_choice").closest(".control-group").show();
$("." + plugin.val() + "_version_choice").closest(".form-group").show();
}
$(".plugin_name_choice").change();
@ -82,9 +82,9 @@
function switch_job_type() {
job_type = $("#id_job_type").val();
if ($.inArray(job_type, ["MapReduce", "Java"]) != -1) {
$("#id_main_binary").closest(".control-group").hide();
$("#id_main_binary").closest(".form-group").hide();
} else {
$("#id_main_binary").closest(".control-group").show();
$("#id_main_binary").closest(".form-group").show();
}
}
$("#id_job_type").change();
@ -94,8 +94,8 @@
addExtraBinary = function (where_from) {
var loc_type = where_from.previousSibling.name.contains("main") ? "main" : "lib";
for(i=2; i <= $("[name=extra_locations]").val(); i++) {
if (!$("[name=job_" + loc_type + "_" + i + "]").closest(".control-group").is(":visible")) {
$("[name=job_" + loc_type + "_" + i + "]").closest(".control-group").show();
if (!$("[name=job_" + loc_type + "_" + i + "]").closest(".form-group").is(":visible")) {
$("[name=job_" + loc_type + "_" + i + "]").closest(".form-group").show();
break;
}
}

10
openstack_dashboard/dashboards/project/data_processing/jobs/templates/data_processing.jobs/library_template.html
View File

@ -2,15 +2,15 @@
<script type="text/javascript">
var template = '<tr id_attr="$id">' +
'<td>' +
'<div class="input control-group" style="padding-right:15px;"><input disabled value="$lib_name" class="input-medium" /></div>' +
'<div class="input form-group" style="padding-right:15px;"><input disabled value="$lib_name" class="form-control" /></div>' +
'</td>' +
'<td>' +
'<div class="input control-group" style="float:left;padding-right:5px;">' +
'<input type="button" class="btn btn-danger" id="delete_btn_$id" data-toggle="dropdown" onclick="delete_lib(this)" value="Remove" style="margin-bottom: 10px"/>' +
'<div class="input form-group" style="float:left;padding-right:5px;">' +
'<input type="button" class="btn btn-danger" id="delete_btn_$id" data-toggle="dropdown" onclick="delete_lib(this)" value="Remove" />' +
'</div>' +
'</td>' +
'<td>' +
'<div class="input control-group" style="padding-right:15px;">' +
'<div class="input form-group" style="padding-right:15px;">' +
'<input id="lib_name_$id" value="$lib_name" type="hidden" name="lib_name_$id">' +
'</div>' +
'</td>' +
@ -82,7 +82,7 @@
<div class="lib-input-div">
{% include "horizon/common/_form_fields.html" %}
<div class="input">
<a id="add_lib_button" class="btn disabled btn-inline" onclick="add_lib();">{% trans "Choose" %}</a>
<a id="add_lib_button" class="btn btn-default disabled btn-inline" onclick="add_lib();">{% trans "Choose" %}</a>
</div>
</div>
<div class="form-help-block">

4
openstack_dashboard/dashboards/project/data_processing/nodegroup_templates/templates/data_processing.nodegroup_templates/_details.html
View File

@ -1,7 +1,7 @@
{% load i18n sizeformat %}
{% load url from future %}
<h3>{% trans "Template Overview" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
<dt>{% trans "Name" %}</dt>
<dd>{{ template.name }}</dd>
@ -23,7 +23,7 @@
<dl>
<dt>{% trans "Node Processes" %}</dt>
<dd>
<ul>
<ul class="list-bullet">
{% for process in template.node_processes %}
<li>{{ process }}</li>
{% endfor %}

12
openstack_dashboard/dashboards/project/data_processing/nodegroup_templates/templates/data_processing.nodegroup_templates/_fields_help.html
View File

@ -7,8 +7,8 @@
<script type="text/javascript">
function hide_not_important_fields(element) {
var fieldset = $(element).parents("fieldset")[0];
$("[priority='2']", fieldset).parents("div.control-group").hide();
$("[priority='1']", fieldset).parents("div.control-group").show();
$("[priority='2']", fieldset).parents("div.form-group").hide();
$("[priority='1']", fieldset).parents("div.form-group").show();
var div = $(element).parents("div.field-filter")[0];
$("a.full-config-show",div).show();
$("a.full-config-hide",div).hide();
@ -16,7 +16,7 @@
function show_not_important_fields(element) {
var fieldset = $(element).parents("fieldset")[0];
$("[priority='2']", fieldset).parents("div.control-group").show();
$("[priority='2']", fieldset).parents("div.form-group").show();
var div = $(element).parents("div.field-filter")[0];
$("a.full-config-show",div).hide();
$("a.full-config-hide",div).show();
@ -37,17 +37,17 @@
oldValue = val;
var fieldset = $(input).parents("fieldset")[0];
if (val == "") {
$("label", fieldset).parents("div.control-group").show();
$("label", fieldset).parents("div.form-group").show();
if ($("a.full-config-show")[0].style.display == "inline") {
hide_not_important_fields(this);
}
} else {
$("label", fieldset).filter(function (idx, e) {
return $(e).text().toLowerCase().indexOf(val.toLowerCase()) == -1;
}).parents("div.control-group").hide();
}).parents("div.form-group").hide();
$("label", fieldset).filter(function (idx, e) {
return $(e).text().toLowerCase().indexOf(val.toLowerCase()) > -1;
}).parents("div.control-group").show();
}).parents("div.form-group").show();
}
}, 300);
}

2
openstack_dashboard/dashboards/project/data_processing/nodegroup_templates/templates/data_processing.nodegroup_templates/_service_confs.html
View File

@ -1,6 +1,6 @@
{% load i18n sizeformat %}
<h3>{% trans "Service Configurations" %}</h3>
<div class="status row-fluid detail">
<div class="status row detail">
<dl>
{% for service, config in template.node_configs.items %}
<dt>{{ service }}</dt>

4
openstack_dashboard/dashboards/project/data_processing/nodegroup_templates/templates/data_processing.nodegroup_templates/details.html
View File

@ -7,8 +7,8 @@
{% endblock page_header %}
{% block main %}
<div class="row-fluid">
<div class="span12">
<div class="row">
<div class="col-sm-12">
{{ tab_group.render }}
</div>
</div>

14
openstack_dashboard/dashboards/project/data_processing/nodegroup_templates/templates/data_processing.nodegroup_templates/nodegroup_templates.html
View File

@ -42,15 +42,15 @@
$(".configure-nodegrouptemplate-btn")[0].href = oldHref;
return false;
});
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
}
//display version for selected plugin
$(document).on('change', '.plugin_name_choice', switch_versions);
function switch_versions() {
$(".plugin_version_choice").closest(".control-group").hide();
$(".plugin_version_choice").closest(".form-group").hide();
var plugin = $(this);
$("." + plugin.val() + "_version_choice").closest(".control-group").show();
$("." + plugin.val() + "_version_choice").closest(".form-group").show();
}
$(".storage_field").change(switch_storage).change();
@ -58,11 +58,11 @@
function switch_storage() {
var show = $(".storage_field").val() == "cinder_volume";
if (show) {
$(".volume_per_node_field").closest(".control-group").show();
$(".volume_size_field").closest(".control-group").show();
$(".volume_per_node_field").closest(".form-group").show();
$(".volume_size_field").closest(".form-group").show();
} else {
$(".volume_per_node_field").closest(".control-group").hide();
$(".volume_size_field").closest(".control-group").hide();
$(".volume_per_node_field").closest(".form-group").hide();
$(".volume_size_field").closest(".form-group").hide();
}
}

12
openstack_dashboard/static/dashboard/scss/horizon.scss
View File

@ -73,6 +73,18 @@ ul {
margin: 0;
}
// Disc-styled list. This list should be used to build bullet-items lists.
.list-bullet {
list-style: disc;
}
/* Used to build compact node groups and tags tables */
.small-padding {
padding-left: 0;
padding-right: 5px;
padding-bottom: 5px;
}
dt {
font-weight: bold;
}