From 8200521725e8557112b29701549fab9feb05b37a Mon Sep 17 00:00:00 2001
From: Luis Fernando Molina <Luis-Fernando-Molina@users.noreply.github.com>
Date: Fri, 20 Apr 2018 23:00:43 +0200
Subject: [PATCH] Panels Working

---
 .vs/AAWeb/v15/.suo | Bin 41984 -> 43008 bytes
 ProductCard.js     |   1 +
 TimeMachine.js     | 121 +++------------------------------------------
 TimelineChart.js   |  72 +++++++++++++++++++++++----
 4 files changed, 69 insertions(+), 125 deletions(-)

diff --git a/.vs/AAWeb/v15/.suo b/.vs/AAWeb/v15/.suo
index cf5017af6d679a6133cefc1502d5b0e623351702..16b544c1ba749386de0ed642abdd79aeaf11d907 100644
GIT binary patch
delta 2182
zcmd^9TTI(k82_Ks3#Ie|v|I)hT5jt$#!bWpJJ#91j6s1Gii>XHGDlKS9G4mf8ZB{V
zQwenc4;jl`G=1?&BODW7OopK`dodE-gYk)1ADlikOGsq+ebADM8l#Dci6{SG&hP)-
z&iTIY<O|>9;SC;fG0VzHGY7BMZrU8Z)$_x5-?AD>lGe&#Mmqy>ew77aI_(vRtDG7g
zDjeWXFMKu|*-m10BG;z;n~@i!{O2M+jwnr$*^w6_iV)?95=0r|(G9<)q5?@W_|XKf
z#k~$uk9Z8x3Sa38HBTaQ!H>EpD%z2ej~Dk2L>|JQkdeF_IR^hs;V-6d_KmnG&tma1
zS24;@bxqM(hq6-a$w!U<R)h(WiO4|YBPe-2!iZ=?kgW}O10tDx4)RARr{qab>k#rv
zEMLi?!^oV7BM1+Iv{krQ!;1QxgZyOtdm7P#ID?>k$ck1M#;|C7D8Y>GD*6V|V2Y?j
z%=kJ7kD(4inHwM*Yax{7Gf?68ymoeA_H21N1xJ}A!M0^e(}2V#rkmOs#BypilpPma
zS!q0)&y^xs$faS_*lIPDyIO1=NmDCM*+370T1Sy7stDE3v8bD`+GA+`xJ$8yG{;a+
zp|7!MC0F!nq0at=DfxD=d&^*5i`Vo9bkx%QAaSpOMO{2vt&X1HN=qq}wmOWA>Ovh)
znn9>_17aN0J3AL`<Vv$$*bDA+5id0`r8#DxlqipV`*`!$be?7eg>Q(ht~9Q+p-*u+
z7jgro=Ws>K`Jbk>`jm$oci)~RC8`L?AG5!{pwfLM?Gn0qq$Zg4=fGn3QEfole1K)k
zUoNseL>1kY_E!-BL~=3M?zTb1Z-TH-4aGfHaQ8IAYd*aQ_tY@90iOiMAnfjksorOR
z_ZDPspeIXU01p&9=iXGYK5)!<z`LY__R4IPBxzvwd||Rq^tun$DQ~w<iCft4-Ba2+
zX%T$y^k)QyM~6BFpAQbdGz2S`kFh0^f_W?xz6@T6v2hdRjXU9X-%ThO8Gw&osDt|c
z0k|`zhw7k{?Z$x4;e5sGp_Yh{caDK$ycn(D-_ssEL9LVI-yc0bQDsTFO7+NOji>2C
z@2c+#|1Xw1<KHP`<3A{y`9RrVyx;LhvfuQ<A8N^^ftOq#BB5a?zq{N1$fz0g{Z2SO
z`UTW*9bB9o#Ma->y2O(XKi`cb&lB#;0hYT=k2JA9MZSo9ug8f8^nLEBq#pM!1kIa-
zN#}4Qyf?9GII(YXdQChxd6F4vmh7$5Yp39+(O~l3LGxSppycgAu{<%$pnkaMf0QuJ
zH~Uf}bR0H;eY#D|&wb9|>UkL+&KI+byQ5)#z8s=AWLS3>!Gi@YSQlnQe8Iql`;MCl
o_sum9-vp{~g6RKdl=L8tJ?VnfE4FW~bFmhoc!{9u=m+%u3XuoD_5c6?

delta 2670
zcmds2Z%k8H6o2>eN};sSLJ{Oofr3&C1&igM*5Pb*4zUFUMI;Ie#u>ILw2VJ)?WUO^
z4B;K)G}$s&U9u0lX`fk^%|B!#i_118+n0UxquGbW4|JKCu{)=}nu42VOZH_q`Mq<`
zx%ZxX{@wHZbG-j1KV@eLm)EB7&=8-Wc<|c?7q0*O6DyXy@o|hbz>xBoDCGEZIF5@)
zgk#3?MSP~rH^_7;QY|76k%cHgs1ZvLq$VAy9#Moym1VgyrS*sO!C{~yCR|v7D3Ldm
zBHaL&6Sh}6aOOnN_KiqiK-425XYsQc=NSlhjI0r+g^cOW3nJf}+<3A66>`~(>)bLJ
z=7$+Ti1#VdkjDVTjj$33Df4`ZF$zez4tasj$a31Bf=H5i4bmn=w#?I+Xe?+>gJO{%
zvraOKMY1d_L@LLD4;!ICNLyx!*<LQsS0c3{)*x0PZ197St)PRO9(kGr`3k|Z1()cC
z=x`xVp^5U%IB$`8J6@JO-FZ?}*>saAJAs%&Od~|es``?NS`RaWSM6gfAf)v%ljPOh
z;w6XrO{R|40%-<TR|NAKtt99lFfrAms6Z7045j|T4B$=kv0MnHmFrX}rO;7{Q0S7O
zK%cRN3WN%U0!5~hVk#^uC<-hUCizLA;N~N!(2NKQ9u*fQh>EosHKs`y^eu70nt7h3
zLMYS6bl_d;Q&61>(*3&4yyP_c8O%ED!OU5tYwQ6hA6U+d2B(@LOZPo?%46`e6bKoP
z@S_Zd^WF|*34t=<ueM4a!vqViCyj;nKou|6J0wTNwMaP1B6klJ9b<t~UaZN7eEWHr
zjb91#_S+gpg`N;|sp0@KN2L3CN<O&B!D|@R1C?IXD#=sv2?L`&@GKp0e^otv&0E1^
zn^RNukOmr&gn23_#C2$kt?=1<%!L|82W<<?=$K%l+41BGc+4#cl-KB8(!5#Cf}MlB
zavMq=+-i8UE*(y~%**<@JHLj*16&W+$CYshxPDy!nCCdEccKkQTcFF81|2Sy=*|L@
zJ5$3@7##xCxvRndoWOW##BF2jCR}Pf2s2aL!Pm4642?$ZP25XI2%UJj6kf~tVDr&9
z)&Ymc98fx1Bf1(GgDtL-I5aRKY#Y<-{>~6B+~M_fCzQJNi>zUFCAgwaqRY^J8t|g4
zJVkb#>)=|^$(~36#4%$!&e3%WfPf`RX-?oyz=v(S;Xz*_+-f($tsU>eZ|$8>)~+lq
zJJ5gl@QBscZLO}YvRd}_R9Y>zDqFXu)@rp{_S(AkS*_jG-L<t{uTP<pHQ5y1r$<!_
z4_%qdKbuQk-TT#??#g=ZY*Bsgk7PHQPi{~Pq|w5G-Mu=I5*x8v^0`+oj<?uq!zcbc
zH_Um_tscm2EPOKlb<MBw=@zaAJ6bJv_W!`~-Ee701)V!haJKDt@C{T!&5l!G*!2Nh
z5L+REb1o3TM}6mXzsPwbpIIEo*`-epb}*)bYlHhK3)TN13#!K6S3RDdK0Hza%xi@5
z_IM$d0lt4Dgb%3`6?hx90w<b$8bbY_>#mRik#Xn7EYf1>x~GBZ$|xuDsH8bu_jIF=
zccE(JJ8<t*!W+91A!D!vULJHrT3U3sbak+cVMk})f~W1-!59aQt!tHSx2a`waHe?$
zT-vIIb*(1)edAB44!<M#Big`i#3Wj|sz|GjKBqnSq!M7RH4~1uI$?6O0%iiE^vuA2
z&b(+X2yAHEzsb_w$62~}V;<)j|D!DJWsx@rs=xqT9QXng`wir~7KBck9KFieo=C5{
zcf3e$Ws}DZ%!9Hf_<r03`tg0z{J5Hjx5jK@lK^9<mPpBC_NO1qf|-e#q~6EfSOdE8
kmy-5V*M8Kzr0^LQFP@%(_lt9+_ue_rB>$A31<ne80^dSsS^xk5

diff --git a/ProductCard.js b/ProductCard.js
index 3dceb314b..757e2d466 100644
--- a/ProductCard.js
+++ b/ProductCard.js
@@ -78,6 +78,7 @@
         let plotterModule = ecosystem.getPlotterModule(plotter, thisObject.product.plotter.moduleName);
 
         thisObject.product.plotter.profilePicture = plotterModule.profilePicture;
+        thisObject.product.plotter.module = plotterModule;
 
         /* Lets set the basic dimensions of this thisObject. */
 
diff --git a/TimeMachine.js b/TimeMachine.js
index 5baaa4cb1..df903ffb3 100644
--- a/TimeMachine.js
+++ b/TimeMachine.js
@@ -117,113 +117,6 @@ function newTimeMachine() {
 
     }
 
-    function otherCharts() {
-                   /* Chart 1 */
-            /*
-            var orderBookChart = newOrderBookChart();
-    
-            orderBookChart.container.displacement.parentDisplacement = timeMachine.container.displacement;
-            orderBookChart.container.zoom.parentZoom = timeMachine.container.zoom;
-            orderBookChart.container.frame.parentFrame = timeMachine.container.frame;
-    
-            orderBookChart.container.parentContainer = timeMachine.container;
-    
-            orderBookChart.container.frame.width = timeMachine.container.frame.width * 0.50;          
-            orderBookChart.container.frame.height = timeMachine.container.frame.height * 0.50;      
-    
-            orderBookChart.container.frame.position.x = timeMachine.container.frame.width * 0;
-            orderBookChart.container.frame.position.y = timeMachine.container.frame.height * 0.50;
-    
-            orderBookChart.initialize(1);
-    
-
-            orderBookChart.setDatetime(controlPanel.datetimeDisplay.currentDatetime);
-    
-            timeMachine.charts.push(orderBookChart);
-
-            
-    
-            controlPanel.container.eventHandler.listenToEvent('Datetime Changed', orderBookChart.setDatetime, undefined);
-            */
-            /* Chart 2 */
-            /*
-            var orderBookChart = newOrderBookChart();
-    
-            orderBookChart.container.displacement.parentDisplacement = timeMachine.container.displacement;
-            orderBookChart.container.zoom.parentZoom = timeMachine.container.zoom;
-            orderBookChart.container.frame.parentFrame = timeMachine.container.frame;
-    
-            orderBookChart.container.parentContainer = timeMachine.container;
-    
-            orderBookChart.container.frame.width = timeMachine.container.frame.width * 0.50;
-            orderBookChart.container.frame.height = timeMachine.container.frame.height * 0.50;
-    
-            orderBookChart.container.frame.position.x = timeMachine.container.frame.width * 0.50;
-            orderBookChart.container.frame.position.y = timeMachine.container.frame.height * 0.50;
-    
-            orderBookChart.initialize(2);
-    
-
-            orderBookChart.setDatetime(controlPanel.datetimeDisplay.currentDatetime);
-    
-            timeMachine.charts.push(orderBookChart);
-    
-            controlPanel.container.eventHandler.listenToEvent('Datetime Changed', orderBookChart.setDatetime, undefined);
-            */
-            /* Chart 3 */
-            /*
-            var priceChart = newPriceChart();
-    
-            priceChart.container.displacement.parentDisplacement = timeMachine.container.displacement;
-            priceChart.container.zoom.parentZoom = timeMachine.container.zoom;
-            priceChart.container.frame.parentFrame = timeMachine.container.frame;
-    
-            priceChart.container.parentContainer = timeMachine.container;
-    
-            priceChart.container.frame.width = timeMachine.container.frame.width * 1;
-            priceChart.container.frame.height = timeMachine.container.frame.height * 1 / 3;
-    
-            priceChart.container.frame.position.x = timeMachine.container.frame.width * 0;
-            priceChart.container.frame.position.y = timeMachine.container.frame.height * 0;
-    
-            priceChart.initialize(1, 2, marketTrades);
-    
-
-            priceChart.setDatetime(controlPanel.datetimeDisplay.currentDatetime);
-    
-            timeMachine.charts.push(priceChart);
-    
-            controlPanel.container.eventHandler.listenToEvent('Datetime Changed', priceChart.setDatetime, undefined);
-            */
-
-            /* Chart 5 */
-            /*
-             var spreadChart = newSpreadChart();
-     
-             spreadChart.container.displacement.parentDisplacement = timeMachine.container.displacement;
-             spreadChart.container.zoom.parentZoom = timeMachine.container.zoom;
-             spreadChart.container.frame.parentFrame = timeMachine.container.frame;
-     
-             spreadChart.container.parentContainer = timeMachine.container;
-     
-             spreadChart.container.frame.width = timeMachine.container.frame.width * 1;
-             spreadChart.container.frame.height = timeMachine.container.frame.height * 1 / 3;
-     
-             spreadChart.container.frame.position.x = timeMachine.container.frame.width * 0;
-             spreadChart.container.frame.position.y = timeMachine.container.frame.height * 1 / 3;
-     
-             spreadChart.initialize(1, 2, marketTrades);
-     
-
-             spreadChart.setDatetime(controlPanel.datetimeDisplay.currentDatetime);
-     
-             timeMachine.charts.push(spreadChart);
-     
-             controlPanel.container.eventHandler.listenToEvent('Datetime Changed', spreadChart.setDatetime, undefined);
-             */
-
-
-    }
 
     function draw() {
 
@@ -272,19 +165,17 @@ function newTimeMachine() {
                 return container;
             }
 
-            
-            
-            //for (var i = 0; i < this.charts.length; i++) {
+            for (var i = 0; i < this.charts.length; i++) {
 
-            //    container = this.charts[i].getContainer(point);
+                container = this.charts[i].getContainer(point);
 
-           //     if (container !== undefined) {
+                if (container !== undefined) {
 
                     /* We found an inner container which has the point. We return it. */
 
-            //        return container;
-            //    }
-            //}
+                    return container;
+                }
+            }
             
             /* The point does not belong to any inner container, so we return the current container. */
 
diff --git a/TimelineChart.js b/TimelineChart.js
index 5fe9a46ff..53e2d0fb6 100644
--- a/TimelineChart.js
+++ b/TimelineChart.js
@@ -166,23 +166,17 @@ function newTimelineChart() {
 
             switch (thisSet.type) {
                 case 'Market Files': {
-
                     storage.eventHandler.listenToEvent('Market File Loaded', pProductCard.onMarketFileLoaded);
-
                 }
                     break;
 
                 case 'Daily Files': {
-
                     storage.eventHandler.listenToEvent('Daily File Loaded', pProductCard.onDailyFileLoaded);
-
                 }
                     break;
 
                 case 'Single File': {
-
                     storage.eventHandler.listenToEvent('Single File Loaded', pProductCard.onSingleFileLoaded);;
-
                 }
                     break;
             }
@@ -234,6 +228,29 @@ function newTimelineChart() {
 
                 storage.eventHandler.listenToEvent('Daily File Loaded', plotter.onDailyFileLoaded);
 
+                /* Lets load now this plotter panels. */
+
+                productPlotter.panels = [];
+
+                for (let i = 0; i < pProductCard.product.plotter.module.panels.length; i++) {
+
+                    let panel = pProductCard.product.plotter.module.panels[i];
+
+                    let plotterPanel = getNewPlotterPanel(pProductCard.product.plotter.devTeam, pProductCard.product.plotter.codeName, pProductCard.product.plotter.moduleName, panel.codeName);
+
+                    plotterPanel.initialize();
+
+                    /* Connect Panel to the Plotter via an Event. */
+
+                    if (panel.event !== undefined) {
+
+                        productPlotter.plotter.container.eventHandler.listenToEvent(panel.event, plotterPanel.onEventRaised);
+
+                    }
+
+                    productPlotter.panels.push(plotterPanel);
+                }
+
                 /* Add the new Active Protter to the Array */
 
                 productPlotters.push(productPlotter);
@@ -398,7 +415,26 @@ function newTimelineChart() {
 
         if (this.container.frame.isThisPointHere(point) === true) {
 
-            return this.container;
+            for (let i = 0; i < productPlotters.length; i++) {
+
+                let productPlotter = productPlotters[i];
+
+                for (let j = 0; j < productPlotter.panels.length; j++) {
+
+                    let panel = productPlotter.panels[j];
+
+                    let panelContainer = panel.getContainer(point);
+
+                    if (panelContainer !== undefined) {
+
+                        /* We found an inner container which has the point. We return it. */
+
+                        return panelContainer;
+                    }
+                }
+            }
+
+            // return this.container;    Currently there is a BUG in which if this is enabled the datetime of the control panel is not recalculated.
 
         } else {
 
@@ -454,20 +490,36 @@ function newTimelineChart() {
 
             chartGrid.draw(thisObject.container, timeLineCoordinateSystem);
 
-            for (var i = 0; i < productPlotters.length; i++) {
+            /* First the Product Plotters. */
+
+            for (let i = 0; i < productPlotters.length; i++) {
 
                 let productPlotter = productPlotters[i];
                 productPlotter.plotter.draw();
 
             }
 
+            /* Then the competition plotters. */
+
             for (let i = 0; i < competitionPlotters.length; i++) {
 
                 let competitionPlotter = competitionPlotters[i];
-
                 competitionPlotter.plotter.draw();
-
             }
+
+            /* Finally the panels. */
+
+            for (let i = 0; i < productPlotters.length; i++) {
+
+                let productPlotter = productPlotters[i];
+
+                for (let j = 0; j < productPlotter.panels.length; j++) {
+
+                    let panel = productPlotter.panels[j];
+                    panel.draw();
+                }
+            }
+
         }
     }