User interface updates

lcopt/analysis.py

@@ -9,6 +9,8 @@
 
 from copy import deepcopy
 from itertools import groupby
+import time
+import datetime
 
 import json
 
@@ -168,6 +170,9 @@ def run_analyses(self, demand_item, demand_item_code,  amount = 1, methods = [('
 
                 fu = {product_demand:amount}
                 parameter_sets = self.modelInstance.evaluated_parameter_sets
+
+                ts = time.time()
+                ts_format = datetime.datetime.fromtimestamp(ts).strftime('%Y-%m-%d %H:%M:%S')
 
                 result_dict = {
                     'settings':{
@@ -179,6 +184,8 @@ def run_analyses(self, demand_item, demand_item_code,  amount = 1, methods = [('
                         'item_code': demand_item_code,
                         'amount': amount,
                         'ps_names': [name for name in parameter_sets.keys()],
+                        'item_unit':product_demand['unit'],
+                        'timestamp': ts_format,
                         }
                     }
                 result_sets = []

lcopt/interact.py

@@ -6,6 +6,7 @@
 from collections import OrderedDict
 from itertools import groupby
 
+
 from lcopt.bw2_export import Bw2Exporter
 
 class FlaskSandbox():
@@ -32,6 +33,7 @@ def __init__(self, modelInstance):
             'simaPro_export': self.simaPro_export,
             'removeInput': self.removeInput,
             'unlinkIntermediate':self.unlinkIntermediate,
+            'update_settings':self.update_settings,
         }
 
         #print (self.modelInstance.newVariable)
@@ -542,6 +544,25 @@ def simaPro_export(self, postData):
         self.modelInstance.generate_parameter_set_excel_file()
 
         return "OK"
+
+    def update_settings(self, postData):
+
+        #print(postData)
+
+        try: 
+            new_amount = float(postData['settings_amount'])
+        except:
+            new_amount = self.modelInstance.analysis_settings['amount']
+
+        if new_amount != 0:
+            self.modelInstance.analysis_settings['amount'] = new_amount
+
+        myjson = json.loads(postData['settings_methods'])
+        self.modelInstance.analysis_settings['methods'] = [tuple(x) for x in myjson]
+
+        #print (self.modelInstance.analysis_settings)
+
+        return "OK"
 
     def create_app(self):
 
@@ -658,7 +679,7 @@ def analyse_preload():
             args = {'model':{'name': self.modelInstance.name}}
             item = request.args.get('item')
             item_code = request.args.get('item_code')
-            print(request.args)
+            #print(request.args)
 
             args['item'] = item
             args['item_code'] = item_code
@@ -682,9 +703,27 @@ def analysis():
             args['result_sets'] = self.modelInstance.result_set
 
 
-            return render_template('analysis.html', args = args)
+            #return render_template('analysis.html', args = args)
             #return render_template('testbed.html', args = args)
+            #redirect to the cached results so that reloading doesnt rerun the analysis
+            return redirect("/results?latest=True")
 
+        @app.route('/results')
+        def analysis_shortcut():
+            if hasattr(self.modelInstance, 'result_set'):
+
+                is_latest = request.args.get('latest')
+
+                item = self.modelInstance.result_set['settings']['item']
+
+                args = {'model':{'name': self.modelInstance.name}}
+
+                args['item'] = item
+                args['latest'] = is_latest
+                args['result_sets'] = self.modelInstance.result_set
+                return render_template('analysis.html', args = args)
+            else:
+                return render_template('analysis_fail.html')
 
         #@app.route('/network.json')
         #def network_as_json():
@@ -703,6 +742,31 @@ def sorted_parameter_setup():
             return render_template('parameter_set_table_sorted.html',
                                  args = args)
 
+        @app.route('/methods.json')
+        def methods_as_json():
+
+            import brightway2 as bw2
+            from lcopt.utils import DEFAULT_DB_NAME
+
+            if self.modelInstance.name in bw2.projects:
+                print('getting custom methods')
+                bw2.projects.set_current(self.modelInstance.name)
+            else:
+                print('getting default methods')
+                bw2.projects.set_current(DEFAULT_DB_NAME)
+
+            method_list = list(bw2.methods)
+
+            return json.dumps(method_list)
+
+
+        @app.route('/settings')
+        def settings():
+            args = {}
+            args['current_methods'] = json.dumps(self.modelInstance.analysis_settings['methods'])
+            args['current_amount'] = self.modelInstance.analysis_settings['amount']
+            return render_template('settings.html', args = args)
+
         @app.errorhandler(404)
         def page_not_found(e):
             return render_template('404.html'), 404

lcopt/static/css/methods_box.css

@@ -0,0 +1,41 @@
+.name{
+	color:#ddd;
+}
+.hide_me{
+	display: none;
+}
+
+.optgroup-header{
+	font-weight: bold;
+	font-size: 0.7em;
+}
+
+.item_biosphere{
+	background-color: #EFFFF7;
+
+
+}
+.item_method{
+	background-color: aliceblue;
+	display: block;
+}
+
+.item_intermediate{
+	background-color: #FEFFEF;
+}
+
+.item_input{
+	background-color: #FAEFFF;
+}
+.item_number{
+	background-color: #ddd
+}
+
+.item_global{
+	background-color: #FEF9F9;
+}
+
+.method_group{
+	display: block;
+	font-size: 0.7em;
+}

lcopt/static/css/style.css

@@ -246,3 +246,21 @@ ul {
 .light{
 	color:rgba(180, 180, 180, 0.25);
 }
+
+/* Rules for sizing the icon. */
+.material-icons.md-18 { font-size: 18px; vertical-align: middle;}
+.material-icons.md-24 { font-size: 24px; vertical-align: middle;}
+.material-icons.md-36 { font-size: 36px; vertical-align: middle;}
+.material-icons.md-48 { font-size: 48px; vertical-align: middle;}
+
+/* Rules for using icons as black on a light background. */
+.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
+.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }
+
+/* Rules for using icons as white on a dark background. */
+.material-icons.md-light { color: rgba(255, 255, 255, 1); }
+.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }
+
+.top-padding{
+    padding-top: 20px;
+}

lcopt/static/js/methods_box.js

@@ -0,0 +1,79 @@
+function setUpSelectize(external_data, current_methods){
+	////console.log('Hello from setUpSelectize')
+	console.log(external_data);
+
+	// set up the operators in the options and optgroups
+	var my_optgroups = [],
+		my_options = [],
+		optgroup_list = [];
+
+	for(m in external_data){
+		this_method = external_data[m]
+		//console.log(this_method)
+		//console.log($.inArray(this_method[0], my_optgroups))
+		if ($.inArray(this_method[0], optgroup_list) == -1){
+			optgroup_list.push(this_method[0])
+			my_optgroups.push({label: this_method[0], value: this_method[0]})
+		}
+
+		my_description = this_method.slice(1).join(", ")
+
+		my_options.push({value: this_method , text: my_description, optgroup: this_method[0]});
+	}
+
+
+	console.log(current_methods)
+
+
+	$select = $('#settings_methods').selectize({
+		delimiter: ',',
+		items: current_methods,
+		options: my_options,
+		optgroups: my_optgroups,
+		optgroupField: 'optgroup',
+		labelField: 'text',
+		searchField: ['optgroup', 'text'],
+		render: {
+			optgroup_header: function(data, escape){
+				return '<div class="optgroup-header">' + escape(data.label) + '</div>';
+			},
+			option: custom_option,
+			item: custom_item,
+
+		},
+
+	})// end of selectize
+
+
+	function custom_option(data, escape){
+		////console.log(data)
+		$option = $("<div></div>");
+		$option.append(data.text)
+
+		$option.append('<span class="grey pull-right">'+data.optgroup+'</span>')
+
+		html = $option.prop('outerHTML');
+
+		////console.log(html)
+
+		return html
+	}//end of custom_option
+
+	function custom_item(data, escape){
+		$item = $("<div></div>");
+		$item.append('<span class="grey method_group">' + data.value[0] + '</span> <span>' + data.text + '</span>') 
+		//console.log(data)
+
+		$item.addClass("item_method")
+
+		html = $item.prop('outerHTML');
+
+		//console.log(html)
+
+		return html
+	}
+
+
+
+}//end of setUpSelectize
+

lcopt/static/js/pie2.js

@@ -6,13 +6,13 @@ $(document).ready(function(){
 
 // set up some global variables
 var pieDimensions = {
-	height : 300,
-	width: 600,
+	height : 600,
+	width: 900,
 	innerRadius : 0,
-	outerRadius: 100,
+	outerRadius: 175,
 	labelInset: 30,
 	pointerInset: 5,
-	labelRadius:125,
+	labelRadius:200,
 };
 
 

lcopt/static/js/sandbox_functions.js

@@ -71,12 +71,12 @@ var newNodeExternal = function(name, type, id, x, y, instance, outputlabel = '')
   var d = $('<div>').attr('id', id).addClass('w ' + type);
   var title =  $('<div>').addClass('title').text(name);
   var buttons = $('<div>').addClass('buttons');
-  var connect =  $('<div>').addClass('ep').html('<i class="ep2 material-icons w3-small" data-toggle="popover" data-placement= "left" data-trigger="hover" title="Connect" data-content="Drag to connect to another process">trending_flat</i>');
-  var input =  $('<div>').addClass('ip').html('<i class="material-icons w3-small" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Technosphere exchange" data-content="Add an input from the \'Technosphere\' (materials and energy) to this process">business</i>');
-  var output =  $('<div>').addClass('op').html('<i class="material-icons w3-small" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Biosphere exchange" data-content="Add an emission (or resource flow) to/from the environment (biosphere) to this process">local_florist</i>');
-  var analyse =  $('<div>').addClass('analyse').html('<i class="material-icons w3-small" data-toggle="popover" data-placement= "right" data-trigger="hover" title="Analyse" data-content="Run LCA for this process">pie_chart</i>');
+  var connect =  $('<div>').addClass('ep').html('<i class="ep2 material-icons md-18" data-toggle="popover" data-placement= "left" data-trigger="hover" title="Connect" data-content="Drag to connect to another process">trending_flat</i>');
+  var input =  $('<div>').addClass('ip').html('<i class="material-icons md-18" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Technosphere exchange" data-content="Add an input from the \'Technosphere\' (materials and energy) to this process">business</i>');
+  var output =  $('<div>').addClass('op').html('<i class="material-icons md-18" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Biosphere exchange" data-content="Add an emission (or resource flow) to/from the environment (biosphere) to this process">local_florist</i>');
+  var analyse =  $('<div>').addClass('analyse').html('<i class="material-icons md-18" data-toggle="popover" data-placement= "right" data-trigger="hover" title="Analyse" data-content="Run LCA for this process">pie_chart</i>');
   //var edit = $('<div>').addClass('ed').html('<i class="material-icons w3-medium" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Edit" data-content="Edit quantity">edit</i>');
-  var unlink = $('<div>').addClass('unlink').html('<i class="material-icons w3-medium" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Remove" data-content="Remove this input/emision">clear</i>');
+  var unlink = $('<div>').addClass('unlink').html('<i class="material-icons md-18" data-toggle="popover" data-placement= "bottom" data-trigger="hover" title="Remove" data-content="Remove this input/emision">cancel</i>');
 
   if(type == 'transformation'){
     buttons.append(connect).append(input).append(output).append(analyse);

lcopt/static/js/sunburst.js

@@ -27,10 +27,10 @@
 
     var partition = d3.partition();
 
-    var break1 = 0.4,
+    var break1 = 0.5,
         break2 = 0.6;
-    var show1 = 0.1,
-        show2 = 0.9;
+    var show1 = 0.2,
+        show2 = 0.6;
 
     var rscale 
     rscale = d3.scaleLinear().domain([0, break1*radius, break2*radius, 1.0*radius]).range([0, show1*radius, show2*radius, 1.0*radius]);
@@ -48,21 +48,23 @@
 
     function create_sunburst(){
     //var svg = d3.select("body").append("svg")
+      console.log('create sunburst')
       console.log('bound_data')
       console.log(bound_data)
         var svg = d3.select("#sunburst")        
             .attr("width", width)
             .attr("height", height);
             svg.selectAll("*").remove();
-            svg.append('circle').attr('id', 'tipfollowscursor').attr("transform", "translate(" + width * 0.1 + "," + (height * 0.95) + ")");; /*  to debug */;
+            svg.append('circle').attr('id', 'tipfollowscursor').attr("transform", "translate(" + width * 0.05 + "," + (height * 0.2) + ")");; /*  to debug */;
             svg = svg.append("g")
             .attr("transform", "translate(" + (0.45* width) + "," + (height / 2) + ")");
 
         //svg.append('circle').attr('id', 'tipfollowscursor')    .attr('r',5) /*  to debug */
         svg.append("g")
           .attr("class", "legendNew")
           .attr("transform", 
-            "translate(" + (0.35*width) + "," + (-height / 2)+ ")");
+            "translate(" + (0.35*width) + "," + (-height / 2)+ ")")
+          .attr("height", height +"px");
 
 
         var ps = $('#parameterSetChoice').val() - 1
@@ -229,6 +231,13 @@
     //create_force_layout()
   })
 
+  $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
+    var target = $(e.target).attr("href") // activated tab
+    if (target=="#tab-hotspots"){
+      create_sunburst()
+    };
+  });
+
   $('.radio').change(function(){
     if($("#radio_small").prop("checked") == true){
       console.log("small")