[LNT] update summary report edit to use bootstrap
Daniel Dunbar
daniel at zuster.org
Fri Oct 18 13:15:20 PDT 2013
LGTM.
Feel free to commit changes to the summary report directly, I will review
post commit if I have comments.
- Daniel
On Fri, Oct 18, 2013 at 1:10 PM, Chris Matthews <chris.matthews at apple.com>wrote:
> A few updates to the summary report UI. Make it use bootstrap to do
> layout. Change some text that was clickable into buttons.
> diff --git a/lnt/server/ui/static/v4_summary_report_ui.js
> b/lnt/server/ui/static/v4_summary_report_ui.js
> index
> 0015a4d0ff97df0ab6d3b50d51f05a736e4ccdb8..514bd933c6e4860b327aec571a0179d11b31ff66
> 100644
> --- a/lnt/server/ui/static/v4_summary_report_ui.js
> +++ b/lnt/server/ui/static/v4_summary_report_ui.js
> @@ -25,7 +25,7 @@ function init() {
> for (var i = 0; i != g.config.orders.length; ++i) {
> var order = g.config.orders[i];
> var name = order[0];
> - var item = $('<li class="list-item"></li>');
> + var item = $('<button class="btn" style="width:90%;" ></button>');
> g.list_items.push(item);
>
> // Add the item contents.
> @@ -44,7 +44,7 @@ function init() {
> // Initialize the machines list.
> var machines = $('#report-machines');
> machines.empty();
> - var machine_select = $('<select multiple="multiple"
> size="10"></select>');
> + var machine_select = $('<select multiple="multiple"
> style="width:300px;" size=20></select>');
> for (var j = 0; j != g.all_machines.length; ++j) {
> var selected_str = '';
> if ($.inArray(g.all_machines[j], g.config.machine_names) != -1)
> @@ -101,7 +101,7 @@ function update_machine_items(select_elt) {
> if (option.selected)
> g.config.machine_names.push(g.all_machines[option.value]);
> }
> -}
> +} s
>
> // Select a report order entry to edit.
> function select_order(index) {
> @@ -116,7 +116,7 @@ function select_order(index) {
> name_elt.change(function() { update_selected_order_name(name_elt[0]);
> });
>
> elt.append('<br>');
> - var order_select = $('<select multiple="multiple" size="10"></select>');
> + var order_select = $('<select multiple="multiple" style="width:300px;"
> size=20></select>');
> for (var i = 0; i != g.all_orders.length; ++i) {
> var selected_str = '';
> if ($.inArray(g.all_orders[i], g.selected_order[1]) != -1)
> diff --git a/lnt/server/ui/templates/v4_summary_report_ui.html
> b/lnt/server/ui/templates/v4_summary_report_ui.html
> index
> b1ec24914cee0e8c5e73f9a9235c45048e8e9f09..797db9de924b024fd6aa699af9d30607e48b403b
> 100644
> --- a/lnt/server/ui/templates/v4_summary_report_ui.html
> +++ b/lnt/server/ui/templates/v4_summary_report_ui.html
> @@ -8,60 +8,58 @@
> filename='jquery/1.5/jquery.min.js')
> }}"></script>
> <script src="{{
> url_for('.static',filename='v4_summary_report_ui.js')}}"></script>
>
> -<style>
> -.ui-box {
> - border : 1px dashed #000;
> - padding : 3px;
> - margin : 20px;
> -}
>
> -.list {
> - list-style-type : none;
> - margin: 0;
> - padding : 0;
> -}
> +<script>
> + g.config = {{ config|tojson(indent=2)|safe }};
> + g.all_orders = {{ all_orders|tojson(indent=2)|safe }};
> + g.all_machines = {{ all_machines|tojson(indent=2)|safe }};
> + g.save_url = {{ db_url_for("v4_summary_report_ui")|tojson|safe }};
> +</script>
>
> -.list-item {
> - border : 1px solid #672;
> - padding : 1px;
> - margin : 2px;
> +<style>
> +/* Base class */
> +.smbox {
> + position: relative;
> + height: 550px;
> + margin: 15px 0;
> + padding: 39px 19px 14px;
> + *padding-top: 19px;
> + background-color: #fff;
> + border: 1px solid #ddd;
> + -webkit-border-radius: 4px;
> + -moz-border-radius: 4px;
> + border-radius: 4px;
> +
> }
> </style>
>
> -<script>
> -g.config = {{ config|tojson(indent=2)|safe }};
> -g.all_orders = {{ all_orders|tojson(indent=2)|safe }};
> -g.all_machines = {{ all_machines|tojson(indent=2)|safe }};
> -g.save_url = {{ db_url_for("v4_summary_report_ui")|tojson|safe }};
> -</script>
> {% endblock %}
> {% block title %}Summary Report Editor{% endblock %}
> {% block body %}
>
> -<div>
> -<div style="width : 250px; float : left;">
> - <h2><center>Report Orders</center></h2>
> - <div class="ui-box" style="width : 200px; height : 200px">
> - <ul class="list" id="report-order-list">
> - </ul>
> -
> - <br>
> - <input type="button" value="Add" onclick="add_order();">
> +<div class="span2 smbox">
> + <h3><center>Report Orders</center></h3>
> + <div class="btn-group btn-group-vertical" style="width:100%"
> id="report-order-list">
> </div>
> + <br>
> + <br>
> + <input type="button" value="Add" onclick="add_order();">
> </div>
> -<div style="width : 250px; float : left;">
> - <h2><center>Order Items</center></h2>
> - <div class="ui-box" style="width : 200px; height : 200px;"
> id="report-order-items">
> +
> +<div class="span4 smbox">
> + <h3><center>Order Items</center></h3>
> + <div class="ui-box" id="report-order-items">
> </div>
> </div>
> -<div style="width : 280px; float : left;">
> - <h2><center>Machines</center></h2>
> - <div class="ui-box" style="width : 230px; height : 200px"
> id="report-machines">
> +
> +<div class="span4 smbox">
> + <h3><center>Machines</center></h3>
> + <div class="ui-box" id="report-machines">
> </div>
> </div>
> -<br style="clear: left;" />
> -</div>
> -
> -<input type="button" value="Save" onclick="save_config();">
>
> +<div class="span9 form-actions" >
> + <button type="submit" class="btn btn-primary"
> onclick="save_config();">Save changes</button>
> + <button type="button" class="btn"
> onClick="document.location.reload(true)">Cancel</button>
> +</div>
> {% endblock %}
>
>
> Chris Matthews
> chris.matthews at apple.com
>
>
> _______________________________________________
> llvm-commits mailing list
> llvm-commits at cs.uiuc.edu
> http://lists.cs.uiuc.edu/mailman/listinfo/llvm-commits
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.llvm.org/pipermail/llvm-commits/attachments/20131018/a56a6974/attachment.html>
More information about the llvm-commits
mailing list