Skip to content

Commit 329c083

Browse files
author
Cris
committed
modifying layout
1 parent f571bbc commit 329c083

17 files changed

+7049
-6330
lines changed

‎resources/src/[email protected]/components/[email protected]‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
riot.tag2('rts-configuration-panel', '<div class="container-fluid p-0 h-100"> <ul class="headers" data-role="tabs" data-expand="true"> <li class="active"><a href="#config-panel-blank">Default</a></li> <li><a class="date-settings-button" href="#date-settings">Date settings</a></li> <li><a class="change-point-settings-button" href="#change-point-settings">Change point settings</a></li> </ul> <div class="h-100" style="background-color: #f5f6f7;"> <div id="config-panel-blank" class="h-100 w-100 tab"> </div> <div id="date-settings" class="h-100 tab"> <rts-configuration-date-panel ref="date"></rts-configuration-date-panel> </div> <div id="change-point-settings" class="h-100 tab"> <rts-configuration-changepoint-panel ref="changepoint"></rts-configuration-changepoint-panel> </div> </div> </div>', 'rts-configuration-panel ul.tabs-list.headers,[data-is="rts-configuration-panel"] ul.tabs-list.headers{ display: none!important; } rts-configuration-panel .input.calendar-picker,[data-is="rts-configuration-panel"] .input.calendar-picker{ left: 0; } rts-configuration-panel input[data-validate],[data-is="rts-configuration-panel"] input[data-validate],rts-configuration-panel .input,[data-is="rts-configuration-panel"] .input{ zoom: 0.8; } rts-configuration-panel .input.calendar-picker .calendar,[data-is="rts-configuration-panel"] .input.calendar-picker .calendar{ top: 100% !important; bottom: unset !important; z-index: 500000 !important; } rts-configuration-panel *,[data-is="rts-configuration-panel"] *{ -webkit-user-drag: none !important; user-select: none; cursor: default; } rts-configuration-panel .tab form,[data-is="rts-configuration-panel"] .tab form{ padding: 6px; padding-top: 10px; } rts-configuration-panel .tabs-list,[data-is="rts-configuration-panel"] .tabs-list{ text-align: center; }', '', function(opts) {
1+
riot.tag2('rts-configuration-panel', '<div class="container-fluid p-0 h-100"> <ul class="headers" data-role="tabs" data-expand="true"> <li class="active"><a href="#config-panel-blank">Default</a></li> <li><a class="date-settings-button" href="#date-settings">Date settings</a></li> <li><a class="change-point-settings-button" href="#change-point-settings">Change-point settings</a></li> </ul> <div class="h-100" style="background-color: #f5f6f7;"> <div id="config-panel-blank" class="h-100 w-100 tab"> </div> <div id="date-settings" class="h-100 tab"> <rts-configuration-date-panel ref="date"></rts-configuration-date-panel> </div> <div id="change-point-settings" class="h-100 tab"> <rts-configuration-changepoint-panel ref="changepoint"></rts-configuration-changepoint-panel> </div> </div> </div>', 'rts-configuration-panel ul.tabs-list.headers,[data-is="rts-configuration-panel"] ul.tabs-list.headers{ display: none!important; } rts-configuration-panel .input.calendar-picker,[data-is="rts-configuration-panel"] .input.calendar-picker{ left: 0; } rts-configuration-panel input[data-validate],[data-is="rts-configuration-panel"] input[data-validate],rts-configuration-panel .input,[data-is="rts-configuration-panel"] .input{ zoom: 0.8; } rts-configuration-panel .input.calendar-picker .calendar,[data-is="rts-configuration-panel"] .input.calendar-picker .calendar{ top: 100% !important; bottom: unset !important; z-index: 500000 !important; } rts-configuration-panel *,[data-is="rts-configuration-panel"] *{ -webkit-user-drag: none !important; user-select: none; cursor: default; } rts-configuration-panel .tab form,[data-is="rts-configuration-panel"] .tab form{ padding: 6px; padding-top: 10px; } rts-configuration-panel .tabs-list,[data-is="rts-configuration-panel"] .tabs-list{ text-align: center; }', '', function(opts) {
22

33

44
const self = this;

‎resources/src/[email protected]/components/[email protected]‎

Lines changed: 152 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@
1313
</div>
1414
<div class="model-mini-info">
1515
<ul class="v-menu model-information" style="width:100%;">
16-
<li class="menu-title">Change point</li>
16+
<li class="menu-title">Change-point estimate</li>
1717
<li class="change-point">{change_point(opts.model)}</li>
1818
<!---->
19-
<li class="menu-title">Slope estimate</li>
19+
<li class="menu-title">Change in trend estimate</li>
2020
<li class="info-before-TET">
2121
{mean_estimate['slope'](opts.model, 0)}
2222
</li>
@@ -30,7 +30,8 @@
3030
{confidence_interval['slope'](opts.model, 1)}
3131
</li>
3232
<!---->
33-
<li class="menu-title">Intercept estimate</li>
33+
<!--
34+
<li class="menu-title">Change in intercept estimate***</li>
3435
<li class="info-before-TET">
3536
{mean_estimate['intercept'](opts.model, 0)}
3637
</li>
@@ -43,8 +44,18 @@
4344
<li class="info-95CI">
4445
{confidence_interval['intercept'](opts.model, 1)}
4546
</li>
47+
-->
4648
<!---->
47-
<li class="menu-title">White noise estimate</li>
49+
<li class="menu-title">Change in level estimate</li>
50+
<li class="info-diff">
51+
{estimate_difference_on['level'](opts.model)}
52+
</li>
53+
<li class="info-95CI">
54+
{confidence_interval['level'](opts.model, 1)}
55+
</li>
56+
<!---->
57+
<!--
58+
<li class="menu-title">Change in white noise estimate***</li>
4859
<li class="info-before-TET">
4960
{mean_estimate['white_noise'](opts.model, 0)}
5061
</li>
@@ -57,6 +68,31 @@
5768
<li class="info-95CI">
5869
{confidence_interval['white_noise'](opts.model, 1)}
5970
</li>
71+
-->
72+
<!---->
73+
<li class="menu-title">Change in adjacent correlation estimate</li>
74+
<li class="info-before-TET">
75+
{mean_estimate['autocorrelation'](opts.model, 0)}
76+
</li>
77+
<li class="info-after-TET">
78+
{mean_estimate['autocorrelation'](opts.model, 1)}
79+
</li>
80+
<li class="info-diff">
81+
{estimate_difference_on['autocorrelation'](opts.model)}
82+
</li>
83+
<!--
84+
<li class="info-95CI">
85+
{confidence_interval['autocorrelation'](opts.model, 1)}
86+
</li>
87+
-->
88+
<!---->
89+
<li class="menu-title">Supremum Wald test</li>
90+
<li class="info-estimate-TET">
91+
{estimate_difference_on['existence_change_point_hypothesis'](opts.model, 0)}
92+
</li>
93+
<li class="info-pvalue-TET">
94+
{pvalues_difference_on['existence_change_point_hypothesis'](opts.model, 0)}
95+
</li>
6096
</ul>
6197
</div>
6298
</div>
@@ -83,7 +119,7 @@
83119
width: 100%;
84120
background-color: #efefef;
85121
font-size: 15pt;
86-
font-weight: 300
122+
font-weight: 300;
87123
}
88124

89125
.model-information li {
@@ -144,6 +180,14 @@
144180
content: "95% C.I.:";
145181
}
146182

183+
.model-information .info-estimate-TET::before {
184+
content: "Estimate:";
185+
}
186+
187+
.model-information .info-pvalue-TET::before {
188+
content: "p-value:";
189+
}
190+
147191
.model-information-table .model-title {
148192
width: 100%;
149193
background-color: #efefef;
@@ -193,25 +237,51 @@
193237
config.model = !!config.model ? config.model : null;
194238
self.change_point = (model) => moment(model.dates[model.estimations.change_point_index]).format(
195239
"MMM DD, YYYY");
240+
console.log(config)
241+
window.__config=config
196242

197-
const rnd = (f) => Math.round(f * 1000) / 1000;
243+
//const rnd = (f) => Math.round(f * 1000) / 1000;
244+
const rnd = (f) => f.fmt("7.4g")
245+
const mean_estimate_difference = (model, estimator) => model.estimations.increment_change[estimator].mean
246+
const mean_estimate_difference_acf = (model, estimator) => model.estimations.increment_change[estimator].mean - model.estimations.initial[estimator].mean
198247
self.estimate_difference_on = {
199-
slope: (model) => rnd(model.estimations.increment_change.slope.mean),
200-
intercept: (model) => rnd(model.estimations.increment_change.intercept.mean),
201-
white_noise: (model) => rnd(model.estimations.increment_change.noise.mean),
248+
slope: (model) => rnd(mean_estimate_difference(model, "slope")),
249+
level: (model) => rnd(mean_estimate_difference(model, "level")),
250+
intercept: (model) => rnd(mean_estimate_difference(model, "intercept")),
251+
white_noise: (model) => rnd(mean_estimate_difference(model, "noise")),
252+
autocorrelation: (model) => rnd(mean_estimate_difference_acf(model, "autocorrelation")),
253+
existence_change_point_hypothesis: (model) => rnd(model.estimations.existence_change_point_hypothesis.score),
202254
};
255+
256+
const pval_rnd = (f) => `${(f < 1e-20 ? "< 1e-20": f.fmt(".4g"))}`
257+
self.pvalues_difference_on = {
258+
slope: (model) => pval_rnd(model.estimations.increment_change.slope.p_value),
259+
level: (model) => pval_rnd(model.estimations.increment_change.level.p_value),
260+
intercept: (model) => pval_rnd(model.estimations.increment_change.intercept.p_value),
261+
white_noise: (model) => pval_rnd(model.estimations.increment_change.noise.p_value),
262+
autocorrelation: (model) => pval_rnd(model.estimations.increment_change.autocorrelation.p_value),
263+
existence_change_point_hypothesis: (model) => pval_rnd(model.estimations.existence_change_point_hypothesis.p_value),
264+
};
265+
266+
//const mean_estimates = (model, estimator) => [model.estimations.initial[estimator].mean, model.estimations.initial[estimator].mean + model.estimations.increment_change[estimator].mean]
203267
const mean_estimates = (model, estimator) => [model.estimations.initial[estimator].mean, model.estimations.initial[estimator].mean + model.estimations.increment_change[estimator].mean]
204268
self.mean_estimate = {
205269
slope: (model, idx) => rnd(mean_estimates(model, "slope")[idx]),
270+
///////level: (model, idx) => rnd(mean_estimates(model, "level")[idx]),
206271
intercept: (model, idx) => rnd(mean_estimates(model, "intercept")[idx]),
207272
white_noise: (model, idx) => rnd(mean_estimates(model, "noise")[idx]),
273+
autocorrelation: (model, idx) => rnd(mean_estimates(model, "autocorrelation")[idx]),
208274
};
275+
209276
const format_confidence_interval = (ci) => `(${rnd(ci[0])}, ${rnd(ci[1])})`
210277
const confidence_intervals = (model, estimator) => [model.estimations.initial[estimator].confidence_interval, model.estimations.increment_change[estimator].confidence_interval]
211278
self.confidence_interval = {
212279
slope: (model, idx) => format_confidence_interval(confidence_intervals(model, "slope")[idx]),
280+
level: (model, idx) => format_confidence_interval(confidence_intervals(model, "level")[idx]),
213281
intercept: (model, idx) => format_confidence_interval(confidence_intervals(model, "intercept")[idx]),
214282
white_noise: (model, idx) => format_confidence_interval(confidence_intervals(model, "noise")[idx]),
283+
autocorrelation: (model, idx) => format_confidence_interval(confidence_intervals(model, "autocorrelation")[idx]),
284+
//existence_change_point_hypothesis: (model, idx) => format_confidence_interval(model.estimations.existence_change_point_hypothesis.null_confidence_interval),
215285
};
216286

217287
self.on("update", () => {
@@ -238,28 +308,28 @@ <h4 class="text-light">Data summary</h4>
238308
<div></div>
239309
</div>
240310
<div class="cell-3">
241-
<div>Impact on slope</div>
311+
<div>Estimate of slope change</div>
242312
</div>
243313
<div class="cell-3">
244-
<div>Impact on level</div>
314+
<div>Estimate of level change</div>
245315
</div>
246316
<div class="cell-3">
247-
<div>Changes on noise</div>
317+
<div>Estimated change in adjacent correlation</div>
248318
</div>
249319
</div>
250320
</li>
251321
<virtual each={model, index in opts.models}>
252322
<li class="">
253-
<div class="row">
323+
<div class={"row " + (changepoint_is_significant(model) ? "unit-significant" : "" ) }>
254324
<!--Name-->
255325
<div class="cell-3">
256-
<div class="centered-cell">
326+
<div class="centered-cell unit-name-cell">
257327
<span class="icon"><svg class={"unit-" + (index + 1) + " unit-miniplot" }></svg></span>
258-
<span>{model.unit_name}</span>
328+
<span>{model.unit_name} {changepoint_significance_stars(model)}</span>
259329
</div>
260330
</div>
261331
<!--Slope-->
262-
<virtual each={parameter in ['slope', 'intercept' , 'white_noise' ]}>
332+
<virtual each={parameter in ['slope', 'level', 'autocorrelation' ]}>
263333
<div class="cell">
264334
<div class="centered-cell">
265335
<span class="mif-move-up mif-2x parameter-indication" if={ estimate_difference_on[parameter](model)>=
@@ -272,17 +342,19 @@ <h4 class="text-light">Data summary</h4>
272342
</span>
273343
</div>
274344
</div>
275-
<div class="cell-2">
345+
<div class="cell-2 parameter-estimates">
276346
<div>
277-
<div class="parameter-changes">
278-
<span class="label">Changes:</span>
279-
<span class="values">
280-
<span class="value-before">{mean_estimate[parameter](model, 0)}</span>
281-
<span class="mif-forward" style="position: relative;top: 2px;"></span>
282-
<span class="value-after">{mean_estimate[parameter](model, 1)}</span>
283-
</span>
347+
<div class="parameter-changes" if={ mean_estimate[parameter] }>
348+
<div >
349+
<span class="label">Changes:</span>
350+
<span class="values">
351+
<span class="value-before">{mean_estimate[parameter](model, 0)}</span>
352+
<span class="mif-forward" style="position: relative;top: 2px;"></span>
353+
<span class="value-after">{mean_estimate[parameter](model, 1)}</span>
354+
</span>
355+
</div>
284356
</div>
285-
<div class="parameter-confidence-interval">
357+
<div class="parameter-confidence-interval" if={ confidence_interval[parameter] }>
286358
<span class="label">95% C.I.:</span>
287359
<span class="values">
288360
{confidence_interval[parameter](model, 1)}
@@ -330,6 +402,10 @@ <h4 class="text-light">Data summary</h4>
330402
text-align: center;
331403
}
332404

405+
.parameter-changes{
406+
min-height: 1em;
407+
}
408+
333409
.parameter-changes,
334410
.parameter-confidence-interval {
335411
font-size: 80%;
@@ -357,6 +433,35 @@ <h4 class="text-light">Data summary</h4>
357433
margin-right: -5px;
358434
width: 5px;
359435
}
436+
437+
.paper-style .menu-title{
438+
height: 2.7em;
439+
line-height: 1.2;
440+
padding-bottom: 0.1em;
441+
padding-top: 0.1em;
442+
}
443+
444+
.unit-significant.row {
445+
background-color: rgba(255, 0, 0, 0.05);
446+
background-color: rgba(15, 87, 219, 0.1);
447+
448+
}
449+
.unit-significant .unit-name-cell {
450+
color: rgb(171, 21, 21);
451+
color: rgb(34, 93, 208);
452+
}
453+
454+
.cell-2.parameter-estimates > div > div{
455+
min-height: 1.5em;
456+
}
457+
458+
.cell-2.parameter-estimates > div{
459+
position: absolute;
460+
top: 0;
461+
bottom: 0;
462+
margin: auto;
463+
}
464+
360465
</style>
361466
<script>
362467
/* globals opts: false */
@@ -375,25 +480,47 @@ <h4 class="text-light">Data summary</h4>
375480
const config = opts;
376481
config.models = !!config.models ? config.models : [];
377482

483+
self.changepoint_is_significant = (model) => model.estimations.existence_change_point_hypothesis.p_value < 0.05
484+
self.changepoint_significance_stars = (model) => (
485+
model.estimations.existence_change_point_hypothesis.p_value >= 0.1 ? "" : (
486+
model.estimations.existence_change_point_hypothesis.p_value >= 0.05 ? "+" : ( // 0.05-0.1
487+
model.estimations.existence_change_point_hypothesis.p_value >= 0.01 ? "*" : ( // 0.01-0.05
488+
model.estimations.existence_change_point_hypothesis.p_value >= 0.001 ? "**" : ( // 0.001-0.01
489+
model.estimations.existence_change_point_hypothesis.p_value >= 0.001 ? "***" : // 0.0001-0.001
490+
"****" //
491+
)
492+
)
493+
)
494+
)
495+
)
378496

379497
const rnd = (f) => Math.round(f * 100) / 100;
498+
const mean_estimate_difference_acf = (model, estimator) => model.estimations.increment_change[estimator].mean - model.estimations.initial[estimator].mean
499+
380500
self.estimate_difference_on = {
381501
slope: (model) => rnd(model.estimations.increment_change.slope.mean),
502+
level: (model) => rnd(model.estimations.increment_change.level.mean),
382503
intercept: (model) => rnd(model.estimations.increment_change.intercept.mean),
383504
white_noise: (model) => rnd(model.estimations.increment_change.noise.mean),
505+
autocorrelation: (model) => rnd(mean_estimate_difference_acf(model, "autocorrelation")),
384506
};
385507
const mean_estimates = (model, estimator) => [model.estimations.initial[estimator].mean, model.estimations.initial[estimator].mean + model.estimations.increment_change[estimator].mean]
508+
const mean_estimates_acf = (model, estimator) => [model.estimations.initial[estimator].mean, model.estimations.increment_change[estimator].mean]
386509
self.mean_estimate = {
387510
slope: (model, idx) => rnd(mean_estimates(model, "slope")[idx]),
511+
/////level: (model, idx) => rnd(mean_estimates(model, "level")[idx]),
388512
intercept: (model, idx) => rnd(mean_estimates(model, "intercept")[idx]),
389513
white_noise: (model, idx) => rnd(mean_estimates(model, "noise")[idx]),
514+
autocorrelation: (model, idx) => rnd(mean_estimates_acf(model, "autocorrelation")[idx]),
390515
};
391516
const format_confidence_interval = (ci) => `(${rnd(ci[0])}, ${rnd(ci[1])})`
392517
const confidence_intervals = (model, estimator) => [model.estimations.initial[estimator].confidence_interval, model.estimations.increment_change[estimator].confidence_interval]
393518
self.confidence_interval = {
394519
slope: (model, idx) => format_confidence_interval(confidence_intervals(model, "slope")[idx]),
520+
level: (model, idx) => format_confidence_interval(confidence_intervals(model, "level")[idx]),
395521
intercept: (model, idx) => format_confidence_interval(confidence_intervals(model, "intercept")[idx]),
396522
white_noise: (model, idx) => format_confidence_interval(confidence_intervals(model, "noise")[idx]),
523+
//autocorrelation: (model, idx) => format_confidence_interval(confidence_intervals(model, "autocorrelation")[idx]),
397524
};
398525

399526
self.on("mount", () => {

0 commit comments

Comments
 (0)