Commit 2c0e15153f2cebc32b2adf1ff9e37f46d72c82a3

Authored by Goutte
1 parent d9453685

Refactor loading and removal of plots for the start and stop dates.

Showing 2 changed files with 111 additions and 65 deletions   Show diff stats
web/static/js/swapp.js
... ... @@ -9,14 +9,15 @@
9 9 this.slug = slug;
10 10 this.name = name;
11 11 this.config = config;
12   - this.active = true;
  12 + this.active = this.config.active;
13 13 }
14 14 return Target;
15 15 }());
16 16 out$.SpaceWeather = SpaceWeather = (function(){
17 17 "The main app, instanciated from an inline script.\nIt defaults to an interval starting a year ago, and ending in seven days.\n(both at midnight)";
18 18 SpaceWeather.displayName = 'SpaceWeather';
19   - var timeSeries, prototype = SpaceWeather.prototype, constructor = SpaceWeather;
  19 + var API_TIME_FORMAT, timeSeries, prototype = SpaceWeather.prototype, constructor = SpaceWeather;
  20 + API_TIME_FORMAT = "YYYY-MM-DDTHH:mm:ss";
20 21 function SpaceWeather(configuration){
21 22 var configs, res$, k, this$ = this;
22 23 this.configuration = configuration;
... ... @@ -37,35 +38,14 @@
37 38 }
38 39 SpaceWeather.prototype.init = function(){
39 40 "This is called by the inline bootstrap javascript code.\nThis ain't in the constructor because it might return a Promise later on.\n(for the loader, for example)";
40   - var active_targets, res$, k, started_at, stopped_at, this$ = this;
41   - res$ = [];
42   - for (k in this.targets) {
43   - if (this.targets[k].config.active) {
44   - res$.push(this.targets[k]);
45   - }
46   - }
47   - active_targets = res$;
  41 + var started_at, stopped_at, this$ = this;
48 42 this.orbits = new Orbits(this.configuration.orbits_container, this.configuration);
49 43 this.started_at = moment().subtract(1, 'years').hours(0).minutes(0).seconds(0);
50 44 this.stopped_at = moment().add(7, 'days').hours(0).minutes(0).seconds(0);
51   - started_at = this.started_at.format("YYYY-MM-DDTHH:mm:ss");
52   - stopped_at = this.stopped_at.format("YYYY-MM-DDTHH:mm:ss");
  45 + started_at = this.started_at.format(API_TIME_FORMAT);
  46 + stopped_at = this.stopped_at.format(API_TIME_FORMAT);
53 47 console.info("Setting time interval from " + started_at + " to " + stopped_at + "…");
54   - active_targets.forEach(function(target){
55   - var targetButton;
56   - console.info("Loading CSV data of " + target.name + "…");
57   - targetButton = $(".orbiters_filters .target." + target.slug);
58   - targetButton.addClass('loading');
59   - return this$.loadData(target.slug, started_at, stopped_at).then(function(data){
60   - console.info("Loaded CSV data of " + target.name + ".");
61   - this$.createTimeSeries(target, data);
62   - this$.orbits.initOrbiter(target.slug, target.config, data['hci']);
63   - targetButton.removeClass('loading');
64   - return this$.hideLoader();
65   - }, function(error){
66   - return console.error('Failed to load CSV data.', error);
67   - });
68   - });
  48 + this.loadAndCreatePlots(started_at, stopped_at);
69 49 return window.addEventListener('resize', function(){
70 50 return this$.resize();
71 51 });
... ... @@ -82,14 +62,6 @@
82 62 this.targets[target.slug] = target;
83 63 return this;
84 64 };
85   - SpaceWeather.prototype.enableAllTargets = function(){
86   - var slug, ref$, target;
87   - for (slug in ref$ = this.targets) {
88   - target = ref$[slug];
89   - showTarget(slug);
90   - }
91   - return this;
92   - };
93 65 SpaceWeather.prototype.enableTarget = function(target_slug){
94 66 var this$ = this;
95 67 timeSeries.forEach(function(ts){
... ... @@ -118,14 +90,17 @@
118 90 return ts.resize();
119 91 });
120 92 };
  93 + SpaceWeather.prototype.showLoader = function(){
  94 + return $("#plots_loader").show();
  95 + };
121 96 SpaceWeather.prototype.hideLoader = function(){
122 97 return $("#plots_loader").hide();
123 98 };
124 99 SpaceWeather.prototype.loadData = function(target_slug, started_at, stopped_at){
125 100 "Load the data as CSV for the specified target and interval,\nand return it in a Promise.";
126   - var sw, promise;
  101 + var sw;
127 102 sw = this;
128   - promise = new Promise(function(resolve, reject){
  103 + return new Promise(function(resolve, reject){
129 104 var url;
130 105 url = sw.buildDataUrlForTarget(target_slug, started_at, stopped_at);
131 106 return d3.csv(url, function(csv){
... ... @@ -159,7 +134,42 @@
159 134 return resolve(data);
160 135 });
161 136 });
162   - return promise;
  137 + };
  138 + SpaceWeather.prototype.loadAndCreatePlots = function(started_at, stopped_at){
  139 + var active_targets, res$, k, this$ = this;
  140 + this.showLoader();
  141 + res$ = [];
  142 + for (k in this.targets) {
  143 + if (this.targets[k].active) {
  144 + res$.push(this.targets[k]);
  145 + }
  146 + }
  147 + active_targets = res$;
  148 + return active_targets.forEach(function(target){
  149 + var targetButton;
  150 + console.info("Loading CSV data of " + target.name + "…");
  151 + targetButton = $(".orbiters_filters .target." + target.slug);
  152 + targetButton.addClass('loading');
  153 + return this$.loadData(target.slug, started_at, stopped_at).then(function(data){
  154 + console.info("Loaded CSV data of " + target.name + ".");
  155 + this$.createTimeSeries(target, data);
  156 + this$.orbits.initOrbiter(target.slug, target.config, data['hci']);
  157 + targetButton.removeClass('loading');
  158 + return this$.hideLoader();
  159 + }, function(error){
  160 + return console.error("Failed loading CSV data of " + target.name + ".", error);
  161 + });
  162 + });
  163 + };
  164 + SpaceWeather.prototype.clearPlots = function(){
  165 + var timeSeries;
  166 + this.orbits.clear();
  167 + timeSeries.forEach(function(ts){
  168 + return ts.clear();
  169 + });
  170 + this.orbits = null;
  171 + timeSeries = [];
  172 + return this;
163 173 };
164 174 timeSeries = [];
165 175 SpaceWeather.prototype.createTimeSeries = function(target, data){
... ... @@ -268,7 +278,10 @@
268 278 }
269 279 });
270 280 this.orbits.resizeDomain(started_at, stopped_at);
  281 + return;
271 282 }
  283 + this.clearPlots();
  284 + return this.loadAndCreatePlots(started_at, stopped_at);
272 285 };
273 286 SpaceWeather.prototype.resetZoom = function(){
274 287 timeSeries.forEach(function(ts){
... ... @@ -385,6 +398,10 @@
385 398 }
386 399 return this;
387 400 };
  401 + TimeSeries.prototype.clear = function(){
  402 + $(this.svg.node()).remove();
  403 + return this.visible = false;
  404 + };
388 405 TimeSeries.prototype.show = function(){
389 406 $(this.svg.node()).show();
390 407 return this.visible = true;
... ... @@ -584,6 +601,9 @@
584 601 $(this.svg.node()).show();
585 602 return this;
586 603 };
  604 + Orbits.prototype.clear = function(){
  605 + return $(this.svg.node()).remove();
  606 + };
587 607 Orbits.prototype.resize = function(){
588 608 var width, height, slug, ref$, config;
589 609 width = Math.ceil($(this.container).width() - this.margin.left - this.margin.right);
... ...
web/static/js/swapp.ls
... ... @@ -24,7 +24,7 @@ const GOLDEN_RATIO = 2 / (1 + Math.sqrt(5)) # Between 0 and 1 (0.618...)
24 24  
25 25 class Target
26 26 (@slug, @name, @config) ->
27   - @active = true # by default, all targets are active at first
  27 + @active = @config.active
28 28  
29 29 ###############################################################################
30 30  
... ... @@ -35,6 +35,8 @@ export class SpaceWeather
35 35 (both at midnight)
36 36 """
37 37  
  38 + API_TIME_FORMAT = "YYYY-MM-DDTHH:mm:ss"
  39 +
38 40 (@configuration) ->
39 41 console.info """
40 42 _ _ _ _ ____
... ... @@ -67,29 +69,15 @@ https://gitlab.irap.omp.eu/CDPP/SPACEWEATHERONLINE
67 69 This ain't in the constructor because it might return a Promise later on.
68 70 (for the loader, for example)
69 71 """
70   - active_targets = [ @targets[k] for k of @targets when @targets[k].config.active ]
71 72 @orbits = new Orbits(@configuration.orbits_container, @configuration)
72   - # Set the h/m/s to zero so that files are cached per whole days
  73 + # Default time interval is from one year ago to one week ahead.
  74 + # We set the h/m/s to zero to benefit from a daily cache.
73 75 @started_at = moment().subtract(1, 'years').hours(0).minutes(0).seconds(0)
74 76 @stopped_at = moment().add(7, 'days').hours(0).minutes(0).seconds(0)
75   - started_at = @started_at.format("YYYY-MM-DDTHH:mm:ss")
76   - stopped_at = @stopped_at.format("YYYY-MM-DDTHH:mm:ss")
  77 + started_at = @started_at.format(API_TIME_FORMAT)
  78 + stopped_at = @stopped_at.format(API_TIME_FORMAT)
77 79 console.info "Setting time interval from #{started_at} to #{stopped_at}…"
78   - active_targets.forEach((target) ~>
79   - console.info "Loading CSV data of #{target.name}…"
80   - targetButton = $(".orbiters_filters .target.#{target.slug}")
81   - targetButton.addClass('loading')
82   - @loadData(target.slug, started_at, stopped_at).then(
83   - (data) ~>
84   - console.info "Loaded CSV data of #{target.name}."
85   - @createTimeSeries(target, data)
86   - @orbits.initOrbiter(target.slug, target.config, data['hci'])
87   - targetButton.removeClass('loading')
88   - @hideLoader()
89   - ,
90   - (error) -> console.error('Failed to load CSV data.', error)
91   - )
92   - )
  80 + @loadAndCreatePlots(started_at, stopped_at)
93 81 window.addEventListener 'resize', ~> @resize()
94 82  
95 83 buildDataUrlForTarget: (target_slug, started_at, stopped_at) ->
... ... @@ -103,10 +91,10 @@ https://gitlab.irap.omp.eu/CDPP/SPACEWEATHERONLINE
103 91 @targets[target.slug] = target
104 92 this
105 93  
106   - enableAllTargets: ->
107   - for slug, target of @targets
108   - showTarget(slug)
109   - this
  94 +# enableAllTargets: ->
  95 +# for slug, target of @targets
  96 +# enableTarget(slug)
  97 +# this
110 98  
111 99 enableTarget: (target_slug) ->
112 100 timeSeries.forEach((ts) ~> ts.show() if ts.target.slug == target_slug && @parameters[ts.parameter].active)
... ... @@ -122,6 +110,9 @@ https://gitlab.irap.omp.eu/CDPP/SPACEWEATHERONLINE
122 110 @orbits?.resize();
123 111 timeSeries.forEach((ts) -> ts.resize())
124 112  
  113 + showLoader: ->
  114 + $("\#plots_loader").show();
  115 +
125 116 hideLoader: ->
126 117 $("\#plots_loader").hide();
127 118  
... ... @@ -131,7 +122,7 @@ https://gitlab.irap.omp.eu/CDPP/SPACEWEATHERONLINE
131 122 and return it in a Promise.
132 123 """
133 124 sw = this
134   - promise = new Promise((resolve, reject) ->
  125 + new Promise((resolve, reject) ->
135 126 url = sw.buildDataUrlForTarget(target_slug, started_at, stopped_at)
136 127 d3.csv(url, (csv) ->
137 128 timeFormat = d3.timeParse('%Y-%m-%dT%H:%M:%S%Z')
... ... @@ -151,7 +142,32 @@ https://gitlab.irap.omp.eu/CDPP/SPACEWEATHERONLINE
151 142 resolve(data)
152 143 )
153 144 )
154   - promise
  145 +
  146 + loadAndCreatePlots: (started_at, stopped_at) ->
  147 + @showLoader()
  148 + active_targets = [@targets[k] for k of @targets when @targets[k].active]
  149 + active_targets.forEach((target) ~>
  150 + console.info "Loading CSV data of #{target.name}…"
  151 + targetButton = $(".orbiters_filters .target.#{target.slug}")
  152 + targetButton.addClass('loading')
  153 + @loadData(target.slug, started_at, stopped_at).then(
  154 + (data) ~>
  155 + console.info "Loaded CSV data of #{target.name}."
  156 + @createTimeSeries(target, data)
  157 + @orbits.initOrbiter(target.slug, target.config, data['hci'])
  158 + targetButton.removeClass('loading')
  159 + @hideLoader()
  160 + ,
  161 + (error) -> console.error("Failed loading CSV data of #{target.name}.", error)
  162 + )
  163 + )
  164 +
  165 + clearPlots: ->
  166 + @orbits.clear()
  167 + timeSeries.forEach((ts) -> ts.clear())
  168 + @orbits = null
  169 + timeSeries = [] # do we de-reference all existing TimeSeries ? #memleak?
  170 + this
155 171  
156 172 timeSeries = [] # deprecated (was for scoping) ; use @property with ~>
157 173 createTimeSeries: (target, data) ->
... ... @@ -217,7 +233,10 @@ https://gitlab.irap.omp.eu/CDPP/SPACEWEATHERONLINE
217 233 @orbits.resizeDomain started_at, stopped_at
218 234 return
219 235  
220   - # todo: fetch new data and remake the plots
  236 + # fetch new data and remake the plots
  237 + @clearPlots()
  238 + @loadAndCreatePlots(started_at, stopped_at)
  239 +
221 240  
222 241 resetZoom: ->
223 242 timeSeries.forEach((ts) -> ts.resetZoom())
... ... @@ -408,6 +427,10 @@ export class TimeSeries
408 427 unless @visible then @hide()
409 428 this
410 429  
  430 + clear: ->
  431 + $(@svg.node()).remove()
  432 + @visible = false
  433 +
411 434 show: ->
412 435 $(@svg.node()).show()
413 436 @visible = true
... ... @@ -607,6 +630,9 @@ export class Orbits
607 630  
608 631 this
609 632  
  633 + clear: ->
  634 + $(@svg.node()).remove()
  635 +
610 636 resize: ->
611 637 width = Math.ceil($(@container).width() - @margin.left - @margin.right)
612 638 height = Math.ceil(1.0 * width)
... ...