Commit ba2fd748ef27c08c42d76c3861baee6799e97f2a

Authored by Hacene SI HADJ MOHAND
1 parent 9b729ba5

selector ok

js/app/models/PlotObjects/PlotBaseSerieObject.js
... ... @@ -24,9 +24,11 @@ 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'},
27 28 {name: 'serie-lines-style', type: 'string'},
28 29 {name: 'serie-lines-width', type: 'float'},
29 30 {name: 'serie-lines-color', type: 'string'},
  31 + {name: 'serie-lines-color-rgb', type: 'array'},
30 32 {name: 'serie-symbols-activated', type: 'boolean'},
31 33 {name: 'serie-symbols-type', type: 'string'},
32 34 {name: 'serie-symbols-size', type: 'float'},
... ... @@ -89,10 +91,13 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
89 91 {
90 92 this.set('serie-yaxis', amdaPlotObj.PlotObjectConfig.defaultValues.serie.yAxis);
91 93 this.set('serie-resolution', amdaPlotObj.PlotObjectConfig.defaultValues.serie.resolution);
  94 +
92 95 this.set('serie-lines-activated', true);
93 96 this.set('serie-lines-style', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.style);
94 97 this.set('serie-lines-width', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.width);
95 98 this.set('serie-lines-color', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.color);
  99 + this.set('serie-lines-color-activated', false);
  100 +
96 101 this.set('serie-symbols-activated', false);
97 102 this.set('serie-symbols-type', amdaPlotObj.PlotObjectConfig.defaultValues.serie.symbols.type);
98 103 this.set('serie-symbols-size', amdaPlotObj.PlotObjectConfig.defaultValues.serie.symbols.size);
... ... @@ -105,6 +110,7 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
105 110 this.set('serie-timetick-nbmajor', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.nbmajor);
106 111 this.set('serie-timetick-nbminor', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.nbminor);
107 112 this.set('serie-timetick-color', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.color);
  113 + this.set('serie-errorbar-lines-color-rgb', amdaPlotObj.PlotObjectConfig.defaultValues.serie.lines.rgb);
108 114 this.set('serie-timetick-symbols-type', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.type);
109 115 this.set('serie-timetick-symbols-size', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.size);
110 116 this.set('serie-timetick-symbols-color', amdaPlotObj.PlotObjectConfig.defaultValues.serie.timetick.symbols.color);
... ... @@ -150,10 +156,14 @@ Ext.define('amdaPlotObj.PlotBaseSerieObject', {
150 156  
151 157 serieValues['serie-yaxis'] = this.get('serie-yaxis');
152 158 serieValues['serie-resolution'] = this.get('serie-resolution');
  159 +
153 160 serieValues['serie-lines-activated'] = this.get('serie-lines-activated');
154 161 serieValues['serie-lines-style'] = this.get('serie-lines-style');
155 162 serieValues['serie-lines-width'] = this.get('serie-lines-width');
156 163 serieValues['serie-lines-color'] = this.get('serie-lines-color');
  164 + serieValues['serie-lines-color-activated'] = this.get('serie-lines-color-activated');
  165 + serieValues['serie-errorbar-lines-rgb'] = this.get('serie-errorbar-lines-rgb');
  166 +
157 167 serieValues['serie-symbols-activated'] = this.get('serie-symbols-activated');
158 168 serieValues['serie-symbols-type'] = this.get('serie-symbols-type');
159 169 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/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
... ... @@ -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')
409 411 ];
410 412 },
411 413  
... ... @@ -416,6 +418,123 @@ 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 + this.object.set(namePrefix, this.rgbToHex(rgb));
  425 + },
  426 + manageHEXcolors: function(namePrefix){
  427 + var hex = this.object.get(namePrefix);
  428 + if(hex)
  429 + this.object.set(namePrefix+'-rgb', hexToRgb(hex));
  430 + },
  431 + rgbToHex : function(rgb) {
  432 + return "#" + ((1 << 24) + (rgb[0] << 16) + (rgb[1] << 8) + rgb[2] ).toString(16).slice(1).toUpperCase();
  433 + },
  434 + hexToRgb: function(hex) {
  435 + var arrBuff = new ArrayBuffer(4);
  436 + var vw = new DataView(arrBuff);
  437 + vw.setUint32(0,parseInt(hex, 16),false);
  438 + var arrByte = new Uint8Array(arrBuff);
  439 +
  440 + return arrByte[1] + "," + arrByte[2] + "," + arrByte[3];
  441 + },
  442 + addColorsPicker: function (namePrefix) {
  443 +
  444 + var colorPicker = Ext.create('amdaPlotComp.PlotColorPicker', {
  445 + value: '993300', // initial selected color
  446 + renderTo: Ext.getBody(),
  447 + listeners: {
  448 + select: function(picker, selColor) {
  449 + this.object.set(namePrefix, selColor);
  450 + },
  451 + scope: this
  452 + }
  453 + });
  454 + var colorItems = [
  455 + colorPicker ,
  456 + {
  457 + xtype: 'toolbar',
  458 + bodyStyle: { background: '#dfe8f6' },
  459 + border: false,
  460 +
  461 + items: [
  462 +
  463 + {
  464 + xtype: 'numberfield',
  465 + name: 'color-R',
  466 + fieldLabel: 'R',
  467 + labelWidth: 15,
  468 + width: 80,
  469 + maxValue: 255,
  470 + minValue: 0,
  471 + value: 0,
  472 + listeners: {
  473 + change: function (field, newValue, oldValue, eOpts) {
  474 + var rgb = this.object.get(namePrefix+"-rgb");
  475 + if(rgb && rgb.length ==3 )
  476 + rgb[0] = newValue;
  477 + else
  478 + rgb = [newValue,0,0];
  479 + this.object.set(namePrefix+"-rgb", rgb)
  480 + this.manageRGBcolors(namePrefix);
  481 + },
  482 + scope: this
  483 + }
  484 + },
  485 + ' ',
  486 + {
  487 + xtype: 'numberfield',
  488 + name: 'color-G',
  489 + fieldLabel: 'G',
  490 + labelWidth: 15,
  491 + width: 80,
  492 + maxValue: 255,
  493 + minValue: 0,
  494 + value: 0,
  495 + listeners: {
  496 + change: function (field, newValue, oldValue, eOpts) {
  497 + var rgb = this.object.get(namePrefix+"-rgb");
  498 + if(rgb && rgb.length ==3 )
  499 + rgb[1] = newValue;
  500 + else
  501 + rgb = [0, newValue, 0];
  502 + this.object.set(namePrefix+"-rgb", rgb);
  503 + this.manageRGBcolors(namePrefix);
  504 + },
  505 + scope: this
  506 + }
  507 + },
  508 + ' ',
  509 + {
  510 + xtype: 'numberfield',
  511 + name: 'color-B',
  512 + fieldLabel: 'B',
  513 + labelWidth: 15,
  514 + width: 80,
  515 + maxValue: 255,
  516 + minValue: 0,
  517 + value: 0,
  518 + listeners: {
  519 + change: function (field, newValue, oldValue, eOpts) {
  520 + var rgb = this.object.get(namePrefix+"-rgb");
  521 + if(rgb && rgb.length ==3 )
  522 + rgb[2] = newValue;
  523 + else
  524 + rgb = [0,0,newValue];
  525 + this.object.set(namePrefix+"-rgb", rgb);
  526 + this.manageRGBcolors(namePrefix);
  527 + },
  528 + scope: this
  529 + }
  530 + },
  531 +
  532 + ]
  533 + }
  534 + ];
  535 +
  536 + return this.addStandardFieldSet('Color', namePrefix + '-activated', colorItems);
  537 + },
419 538  
420 539 init: function (config) {
421 540 var me = this;
... ...