Commit 40d460aacb78aa8647df0ded36c8db36557f5626

Authored by Benjamin Renard
2 parents b36e5e87 48fdb91e

Merge branch 'develop' into amdadev

js/app/models/PlotObjects/PlotBaseSerieObject.js
... ... @@ -24,9 +24,12 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
24 24 {name: 'serie-yaxis', type: 'string'},
25 25 {name: 'serie-resolution', type: 'int'},
26 26 {name: 'serie-lines-activated', type: 'boolean'},
  27 + {name: 'serie-lines-color-activated', type: 'boolean'},
  28 + {name: 'serie-lines-color-auto', type: 'boolean'},
27 29 {name: 'serie-lines-style', type: 'string'},
28 30 {name: 'serie-lines-width', type: 'float'},
29 31 {name: 'serie-lines-color', type: 'string'},
  32 + {name: 'serie-lines-color-rgb', type: 'array'},
30 33 {name: 'serie-symbols-activated', type: 'boolean'},
31 34 {name: 'serie-symbols-type', type: 'string'},
32 35 {name: 'serie-symbols-size', type: 'float'},
... ... @@ -84,15 +87,30 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
84 87 }
85 88 this.dirty = false;
86 89 },
  90 + getDefaultColor:function(name){
  91 + var defaultClors = new Object();
  92 + defaultClors['serie-lines-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.color;
  93 + defaultClors['serie-symbols-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.symbols.color;
  94 + defaultClors['serie-timetick-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.color;
  95 + defaultClors['serie-timetick-symbols-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.color;
  96 + defaultClors['serie-timetick-firstsymbols-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.firstsymbols.color;
  97 + defaultClors['serie-intervaltick-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.intervaltick.color;
  98 + defaultClors['serie-intervaltick-symbols-color'] = amdaPlotObj.PlotObjectConfig.defaultValues.serie.intervaltick.symbols.color;
  99 + return defaultClors[name];
  100 + },
87 101  
88 102 setDefaultValues: function ()
89 103 {
90 104 this.set('serie-yaxis', amdaPlotObj.PlotObjectConfig.defaultValues.serie.yAxis);
91 105 this.set('serie-resolution', amdaPlotObj.PlotObjectConfig.defaultValues.serie.resolution);
  106 +
92 107 this.set('serie-lines-activated', true);
93 108 this.set('serie-lines-style', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.style);
94 109 this.set('serie-lines-width', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.width);
95 110 this.set('serie-lines-color', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.color);
  111 + this.set('serie-lines-color-activated', false);
  112 + this.set('serie-lines-color-auto', true);
  113 +
96 114 this.set('serie-symbols-activated', false);
97 115 this.set('serie-symbols-type', amdaPlotObj.PlotObjectConfig.defaultValues.serie.symbols.type);
98 116 this.set('serie-symbols-size', amdaPlotObj.PlotObjectConfig.defaultValues.serie.symbols.size);
... ... @@ -105,6 +123,7 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
105 123 this.set('serie-timetick-nbmajor', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.nbmajor);
106 124 this.set('serie-timetick-nbminor', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.nbminor);
107 125 this.set('serie-timetick-color', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.color);
  126 + this.set('serie-errorbar-lines-color-rgb', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.rgb);
108 127 this.set('serie-timetick-symbols-type', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.type);
109 128 this.set('serie-timetick-symbols-size', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.size);
110 129 this.set('serie-timetick-symbols-color', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.color);
... ... @@ -150,10 +169,15 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
150 169  
151 170 serieValues['serie-yaxis'] = this.get('serie-yaxis');
152 171 serieValues['serie-resolution'] = this.get('serie-resolution');
  172 +
153 173 serieValues['serie-lines-activated'] = this.get('serie-lines-activated');
154 174 serieValues['serie-lines-style'] = this.get('serie-lines-style');
155 175 serieValues['serie-lines-width'] = this.get('serie-lines-width');
156 176 serieValues['serie-lines-color'] = this.get('serie-lines-color');
  177 + serieValues['serie-lines-color-activated'] = this.get('serie-lines-color-activated');
  178 + serieValues['serie-lines-color-auto'] = this.get('serie-lines-color-auto');
  179 + serieValues['serie-errorbar-lines-rgb'] = this.get('serie-errorbar-lines-rgb');
  180 +
157 181 serieValues['serie-symbols-activated'] = this.get('serie-symbols-activated');
158 182 serieValues['serie-symbols-type'] = this.get('serie-symbols-type');
159 183 serieValues['serie-symbols-size'] = this.get('serie-symbols-size');
... ...
js/app/models/PlotObjects/PlotObjectConfig.js
... ... @@ -138,6 +138,7 @@ Ext.define('amdaPlotObj.PlotObjectConfig', {
138 138 }
139 139 },
140 140 projection: 'XY',
  141 + 'rgb' : [0,0,0]
141 142  
142 143 },
143 144 spectro: {
... ...
js/app/models/PlotObjects/PlotSerieObject.js
... ... @@ -24,14 +24,14 @@ Ext.define('amdaPlotObj.PlotSerieObject', {
24 24 {name: 'serie-resampling-mode', type: 'string'},
25 25  
26 26 //Only used for timePlot
27   - {name: 'serie-errorbar-activated', type: 'boolean'},
28   - {name: 'serie-errorbar-type', type: 'string'},
29   - {name: 'serie-errorbar-lines-style', type: 'string'},
  27 + {name: 'serie-errorbar-activated', type: 'boolean'},
  28 + {name: 'serie-errorbar-type', type: 'string'},
  29 + {name: 'serie-errorbar-lines-style', type: 'string'},
30 30 {name: 'serie-errorbar-lines-width', type: 'float'},
31 31 {name: 'serie-errorbar-lines-color', type: 'string'},
32   - {name: 'serie-errorbar-minparam', type: 'string'},
33   - {name: 'serie-errorbar-maxparam', type: 'string'},
34   - {name: 'serie-errorbar-deltaparam', type: 'string'}
  32 + {name: 'serie-errorbar-minparam', type: 'string'},
  33 + {name: 'serie-errorbar-maxparam', type: 'string'},
  34 + {name: 'serie-errorbar-deltaparam', type: 'string'}
35 35 ],
36 36  
37 37 constructor: function(){
... ...
js/app/views/PlotComponents/PlotColorPicker.js 0 โ†’ 100644
... ... @@ -0,0 +1,9 @@
  1 +/*
  2 + * To change this license header, choose License Headers in Project Properties.
  3 + * To change this template file, choose Tools | Templates
  4 + * and open the template in the editor.
  5 + */
  6 +Ext.define('amdaPlotComp.PlotColorPicker', {
  7 + extend: 'Ext.picker.Color',
  8 + });
  9 +
... ...
js/app/views/PlotComponents/PlotSerieForm.js
... ... @@ -82,7 +82,17 @@ Ext.define('amdaPlotComp.PlotSerieForm', {
82 82 });
83 83  
84 84 serieItems.push(this.addStandardFieldSet('Error Bar', 'serie-errorbar-activated', this.getErrorBarItems()));
85   -
  85 + /**
  86 + var colorPicker = Ext.create('Ext.menu.ColorPicker', {
  87 + value: '000000'
  88 + });
  89 + var colorMenu =Ext.create('Ext.menu.Menu', {
  90 + items: [{
  91 + text: 'Choose a color',
  92 + menu: colorPicker
  93 + }]
  94 + }).show();
  95 + serieItems.push(colorMenu); */
86 96 return serieItems;
87 97 }
88 98 });
... ...
js/app/views/PlotComponents/PlotStandardForm.js
... ... @@ -13,7 +13,8 @@ Ext.define('amdaPlotComp.PlotStandardForm', {
13 13  
14 14 requires: [
15 15 'amdaPlotObj.PlotObjectConfig',
16   - 'amdaPlotComp.EraseTrigger'
  16 + 'amdaPlotComp.EraseTrigger',
  17 + 'amdaPlotComp.PlotColorPicker'
17 18 ],
18 19  
19 20 //Object associated to this form
... ... @@ -193,13 +194,13 @@ Ext.define('amdaPlotComp.PlotStandardForm', {
193 194 };
194 195 },
195 196  
196   - addStandardFieldSet: function (title, checkboxName, items, onChangeCheck) {
  197 + addStandardFieldSet: function (title, checkboxName, items, onChangeCheck, collapsed_ = true) {
197 198 return {
198 199 xtype: 'fieldset',
199 200 cls: 'child-fieldset',
200 201 title: title,
201 202 collapsible: true,
202   - collapsed: true,
  203 + collapsed: collapsed_,
203 204 checkboxName: checkboxName,
204 205 checkboxToggle: checkboxName != '',
205 206 layout: {
... ... @@ -405,7 +406,8 @@ Ext.define('amdaPlotComp.PlotStandardForm', {
405 406 return [
406 407 this.addStandardCombo(namePrefix + '-style', 'Style', amdaPlotObj.PlotObjectConfig.availableLinesStyles),
407 408 this.addStandardFloat(namePrefix + '-width', 'Width', 1, 10),
408   - this.addStandardColor(namePrefix + '-color', 'Color', amdaPlotObj.PlotObjectConfig.availableColors)
  409 + //this.addStandardColor(namePrefix + '-color', 'Color', amdaPlotObj.PlotObjectConfig.availableColors),
  410 + this.addColorsPicker('serie-lines-color', 'Color')
409 411 ];
410 412 },
411 413  
... ... @@ -416,6 +418,170 @@ Ext.define('amdaPlotComp.PlotStandardForm', {
416 418 this.addStandardColor(namePrefix + '-color', 'Color', amdaPlotObj.PlotObjectConfig.availableColors)
417 419 ];
418 420 },
  421 + manageRGBcolors: function(namePrefix){
  422 + var rgb = this.object.get(namePrefix+'-rgb');
  423 + if(rgb && rgb.length == 3){
  424 + var hexColor = this.rgbToHex(rgb);
  425 + this.object.set(namePrefix, hexColor);
  426 + this.getForm().findField(namePrefix+'-displayer').setValue(hexColor);
  427 + }
  428 + },
  429 + manageHEXcolors: function(namePrefix){
  430 + var hex = this.object.get(namePrefix);
  431 + if(hex){
  432 + this.object.set(namePrefix+'-rgb', hexToRgb(hex));
  433 + }
  434 + },
  435 + rgbToHex : function(rgb) {
  436 + return "#" + ((1 << 24) + (rgb[0] << 16) + (rgb[1] << 8) + rgb[2] ).toString(16).slice(1).toUpperCase();
  437 + },
  438 + hexToRgb: function(hex) {
  439 + var arrBuff = new ArrayBuffer(4);
  440 + var vw = new DataView(arrBuff);
  441 + vw.setUint32(0,parseInt(hex, 16),false);
  442 + var arrByte = (new Uint8Array(arrBuff));
  443 +
  444 + return arrByte.slice(1,4);
  445 + },
  446 +
  447 + /**
  448 + *
  449 + * @param {type} namePrefix name of the variable in the opbject exp : 'serie-lines-color'
  450 + * @param {type} name name of the field exp : Color
  451 + * @returns {PlotStandardFormAnonym$0.addStandardFieldSet.PlotStandardFormAnonym$10}
  452 + */
  453 + addColorsPicker: function (namePrefix, name) {
  454 + var me = this;
  455 +
  456 + var colorPicker = Ext.create('amdaPlotComp.PlotColorPicker', {
  457 + value: '000000', // initial selected color
  458 + renderTo: Ext.getBody(),
  459 + listeners: {
  460 + select: function(picker, selColor) {
  461 + this.object.set(namePrefix, selColor);
  462 + this.getForm().findField(namePrefix+'-displayer').setValue('#'+selColor);
  463 +
  464 + rgb = this.hexToRgb(selColor);
  465 + if(rgb && rgb.length ==3 ){
  466 + this.getForm().findField(namePrefix+'-R').setValue(rgb[0]);
  467 + this.getForm().findField(namePrefix+'-G').setValue(rgb[1]);
  468 + this.getForm().findField(namePrefix+'-B').setValue(rgb[2]);
  469 + }
  470 + },
  471 + scope: this
  472 + }
  473 + });
  474 + var colorDisplayer = {
  475 + xtype: 'displayfield',
  476 + name: namePrefix + '-displayer',
  477 + border:2,
  478 + fieldLabel: 'HEX:',
  479 + value:"#000000",
  480 + region:'center',
  481 + style: {
  482 + borderStyle: 'solid',
  483 + background: '#000000',
  484 + },
  485 + listeners: {
  486 + change: function (field, newValue, oldValue, eOpts) {
  487 + field.getEl().applyStyles({'background':newValue});
  488 + },
  489 + scope: this
  490 + }
  491 + };
  492 + var rgbItems =
  493 + {
  494 + xtype: 'toolbar',
  495 + bodyStyle: { background: '#dfe8f6' },
  496 + border: false,
  497 + name:namePrefix+'-rgb',
  498 + items: [
  499 +
  500 + {
  501 + xtype: 'numberfield',
  502 + name: namePrefix+'-R',
  503 + fieldLabel: 'R',
  504 + labelWidth: 12,
  505 + width: 65,
  506 + maxValue: 255,
  507 + minValue: 0,
  508 + value: 0,
  509 + listeners: {
  510 + change: function (field, newValue, oldValue, eOpts) {
  511 + var rgb = this.object.get(namePrefix+"-rgb");
  512 + if(rgb && rgb.length ==3 )
  513 + rgb[0] = newValue;
  514 + else
  515 + rgb = [newValue,0,0];
  516 + this.object.set(namePrefix+"-rgb", rgb)
  517 + this.manageRGBcolors(namePrefix);
  518 + },
  519 + scope: this
  520 + }
  521 + },
  522 + ' ',
  523 + {
  524 + xtype: 'numberfield',
  525 + name: namePrefix+'-G',
  526 + fieldLabel: 'G',
  527 + labelWidth: 12,
  528 + width: 65,
  529 + maxValue: 255,
  530 + minValue: 0,
  531 + value: 0,
  532 + listeners: {
  533 + change: function (field, newValue, oldValue, eOpts) {
  534 + var rgb = this.object.get(namePrefix+"-rgb");
  535 + if(rgb && rgb.length ==3 )
  536 + rgb[1] = newValue;
  537 + else
  538 + rgb = [0, newValue, 0];
  539 + this.object.set(namePrefix+"-rgb", rgb);
  540 + this.manageRGBcolors(namePrefix);
  541 + },
  542 + scope: this
  543 + }
  544 + },
  545 + ' ',
  546 + {
  547 + xtype: 'numberfield',
  548 + name: namePrefix+'-B',
  549 + fieldLabel: 'B',
  550 + labelWidth: 12,
  551 + width: 65,
  552 + maxValue: 255,
  553 + minValue: 0,
  554 + value: 0,
  555 + listeners: {
  556 + change: function (field, newValue, oldValue, eOpts) {
  557 + var rgb = this.object.get(namePrefix+"-rgb");
  558 + if(rgb && rgb.length ==3 )
  559 + rgb[2] = newValue;
  560 + else
  561 + rgb = [0,0,newValue];
  562 + this.object.set(namePrefix+"-rgb", rgb);
  563 + this.manageRGBcolors(namePrefix);
  564 + },
  565 + scope: this
  566 + }
  567 + },
  568 +
  569 + ]
  570 + }
  571 +
  572 +
  573 + var items = [ this.addStandardCheck(namePrefix + '-auto','Auto', function(name, value, oldValue){
  574 + me.getForm( ).findField(namePrefix + '-activated').setValue(!value);
  575 + me.object.set(namePrefix,me.object.getDefaultColor(namePrefix));
  576 + }),
  577 +
  578 + this.addStandardFieldSet('Select Color', namePrefix + '-activated',[colorPicker,colorDisplayer, rgbItems], function(name, value, oldValue){
  579 + me.getForm( ).findField(namePrefix + '-auto').setValue(!value);
  580 + }),
  581 + ];
  582 +
  583 + return this.addStandardFieldSet(name,'', items, null, false);
  584 + },
419 585  
420 586 init: function (config) {
421 587 var me = this;
... ...