Skip to content

Commit 325ad9b

Browse files
committed
feat(FillStyle): Add fill color/opacity controls for shapes, vector layers, and feature actions
BREAKING CHANGE: Adds required argument to function os.ui.file.kml.AbstractKMLExporter.prototype.createStyle
1 parent 1e3e8ca commit 325ad9b

36 files changed

+1949
-81
lines changed

src/os/command/feature/featurecolorcmd.js

+2-7
Original file line numberDiff line numberDiff line change
@@ -112,14 +112,9 @@ os.command.FeatureColor.prototype.applyLabelValue = function(configs, value) {
112112
*/
113113
os.command.FeatureColor.prototype.finish = function(configs) {
114114
// dispatch the color change event on the source for the histogram
115-
var feature = /** @type {ol.Feature} */ (this.getFeature());
116-
var source = /** @type {plugin.file.kml.KMLSource} */ (os.feature.getSource(feature));
117-
var rootNode = source.getRootNode();
118-
var children = rootNode.getChildren();
115+
var feature = this.getFeature();
119116

120-
for (var i = 0; i < children.length; i++) { // update icon color
121-
children[i].dispatchEvent(new os.events.PropertyChangeEvent('icons'));
122-
}
117+
feature.dispatchEvent(new os.events.PropertyChangeEvent('colors'));
123118

124119
os.command.FeatureColor.base(this, 'finish', configs);
125120
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
goog.provide('os.command.FeatureFillColor');
2+
3+
goog.require('os.command.AbstractFeatureStyle');
4+
goog.require('os.events.PropertyChangeEvent');
5+
goog.require('os.metrics');
6+
7+
8+
9+
/**
10+
* Changes the fill color of a feature
11+
* @extends {os.command.AbstractFeatureStyle}
12+
* @param {string} layerId
13+
* @param {string} featureId
14+
* @param {Array<number>|string} color
15+
* @param {(Array<number>|string)=} opt_oldColor
16+
* @constructor
17+
*/
18+
os.command.FeatureFillColor = function(layerId, featureId, color, opt_oldColor) {
19+
os.command.FeatureFillColor.base(this, 'constructor', layerId, featureId, color, opt_oldColor);
20+
this.title = 'Change Feature Fill Color';
21+
this.metricKey = os.metrics.Layer.FEATURE_FILL_COLOR;
22+
23+
if (!color) {
24+
var feature = this.getFeature();
25+
var config = /** @type {Object|undefined} */ (feature.get(os.style.StyleType.FEATURE));
26+
27+
if (config) {
28+
if (goog.isArray(config)) {
29+
config = config[0];
30+
}
31+
var configColor = /** @type {Array<number>|string|undefined} */ (os.style.getConfigColor(config));
32+
33+
if (configColor) {
34+
color = os.color.toHexString(color);
35+
}
36+
}
37+
}
38+
39+
// Make sure the value is a string
40+
this.value = os.style.toRgbaString(color);
41+
};
42+
goog.inherits(os.command.FeatureFillColor, os.command.AbstractFeatureStyle);
43+
44+
45+
/**
46+
* @type {string}
47+
* @const
48+
*/
49+
os.command.FeatureFillColor.DEFAULT_COLOR = 'rgba(255,255,255,0)';
50+
51+
52+
/**
53+
* @inheritDoc
54+
*/
55+
os.command.FeatureFillColor.prototype.getOldValue = function() {
56+
var feature = /** @type {ol.Feature} */ (this.getFeature());
57+
var config = /** @type {Array<Object>|Object|undefined} */ (this.getFeatureConfigs(feature));
58+
if (goog.isArray(config)) {
59+
config = config[0];
60+
}
61+
62+
if (config) {
63+
return os.style.getConfigColor(config, false, os.style.StyleField.FILL);
64+
} else {
65+
return os.command.FeatureFillColor.DEFAULT_COLOR;
66+
}
67+
};
68+
69+
70+
/**
71+
* Gets the old label color
72+
* @return {Array<number>|string|undefined}
73+
*/
74+
os.command.FeatureFillColor.prototype.getLabelValue = function() {
75+
var feature = /** @type {ol.Feature} */ (this.getFeature());
76+
var labelColor = /** @type {Array<number>|string|undefined} */ (feature.get(os.style.StyleField.LABEL_COLOR));
77+
return labelColor ? labelColor : os.style.DEFAULT_LAYER_COLOR;
78+
};
79+
80+
81+
/**
82+
* @inheritDoc
83+
*/
84+
os.command.FeatureFillColor.prototype.applyValue = function(configs, value) {
85+
var color = os.style.toRgbaString(/** @type {string} */ (value));
86+
for (var i = 0; i < configs.length; i++) {
87+
os.style.setConfigColor(configs[i], color, [os.style.StyleField.FILL]);
88+
}
89+
90+
os.command.FeatureFillColor.base(this, 'applyValue', configs, value);
91+
};
92+
93+
94+
/**
95+
* Set the label color
96+
* @param {Object} configs The style config
97+
* @param {string} value The value to apply
98+
*/
99+
os.command.FeatureFillColor.prototype.applyLabelValue = function(configs, value) {
100+
var feature = /** @type {ol.Feature} */ (this.getFeature());
101+
feature.set(os.style.StyleField.LABEL_COLOR, value);
102+
103+
for (var i = 0; i < configs.length; i++) {
104+
configs[i][os.style.StyleField.LABEL_COLOR] = value;
105+
}
106+
};
107+
108+
109+
/**
110+
* @inheritDoc
111+
*/
112+
os.command.FeatureFillColor.prototype.finish = function(configs) {
113+
// dispatch the color change event on the source for the histogram
114+
var feature = this.getFeature();
115+
116+
feature.dispatchEvent(new os.events.PropertyChangeEvent('colors'));
117+
118+
os.command.FeatureFillColor.base(this, 'finish', configs);
119+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
goog.provide('os.command.FeatureFillOpacity');
2+
3+
goog.require('os.command.AbstractFeatureStyle');
4+
goog.require('os.events.PropertyChangeEvent');
5+
goog.require('os.metrics');
6+
goog.require('os.ui');
7+
8+
9+
10+
/**
11+
* Changes the fill opacity of a feature
12+
* @extends {os.command.AbstractFeatureStyle}
13+
* @param {string} layerId
14+
* @param {string} featureId
15+
* @param {number} opacity
16+
* @param {number=} opt_oldOpacity
17+
* @constructor
18+
*/
19+
os.command.FeatureFillOpacity = function(layerId, featureId, opacity, opt_oldOpacity) {
20+
os.command.FeatureFillOpacity.base(this, 'constructor', layerId, featureId, opacity, opt_oldOpacity);
21+
this.title = 'Change Feature Fill Opacity';
22+
this.metricKey = os.metrics.Layer.FEATURE_FILL_OPACITY;
23+
24+
this.value = opacity;
25+
};
26+
goog.inherits(os.command.FeatureFillOpacity, os.command.AbstractFeatureStyle);
27+
28+
29+
/**
30+
* @type {number}
31+
* @const
32+
*/
33+
os.command.FeatureFillOpacity.DEFAULT_OPACITY = 1;
34+
35+
36+
/**
37+
* @inheritDoc
38+
*/
39+
os.command.FeatureFillOpacity.prototype.getOldValue = function() {
40+
var feature = this.getFeature();
41+
var config = /** @type {Array<Object>|Object|undefined} */ (this.getFeatureConfigs(feature));
42+
if (goog.isArray(config)) {
43+
config = config[0];
44+
}
45+
46+
return config ? os.style.getConfigOpacityColor(config) : os.command.FeatureFillOpacity.DEFAULT_OPACITY;
47+
};
48+
49+
50+
/**
51+
* @inheritDoc
52+
*/
53+
os.command.FeatureFillOpacity.prototype.applyValue = function(configs, value) {
54+
var color;
55+
for (var i = 0; i < configs.length; i++) {
56+
color = os.style.getConfigColor(configs[i], true, os.style.StyleField.FILL);
57+
color[3] = value;
58+
os.style.setConfigColor(configs[i], color, [os.style.StyleField.FILL]);
59+
}
60+
61+
os.command.FeatureFillOpacity.base(this, 'applyValue', configs, value);
62+
};
63+
64+
65+
/**
66+
* @inheritDoc
67+
*/
68+
os.command.FeatureFillOpacity.prototype.finish = function(configs) {
69+
// dispatch the color change event on the source for the histogram
70+
var feature = this.getFeature();
71+
72+
feature.dispatchEvent(new os.events.PropertyChangeEvent('colors'));
73+
74+
os.command.FeatureFillOpacity.base(this, 'finish', configs);
75+
};

src/os/command/feature/featureopacitycmd.js

+15-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
goog.provide('os.command.FeatureOpacity');
22

33
goog.require('os.command.AbstractFeatureStyle');
4+
goog.require('os.events.PropertyChangeEvent');
45
goog.require('os.metrics');
56
goog.require('os.ui');
67

@@ -22,7 +23,7 @@ os.command.FeatureOpacity = function(layerId, featureId, opacity, opt_oldOpacity
2223
this.metricKey = os.metrics.Layer.FEATURE_OPACITY;
2324

2425
if (!opacity) {
25-
var feature = /** @type {ol.Feature} */ (this.getFeature());
26+
var feature = this.getFeature();
2627
var config = /** @type {Object|undefined} */ (feature.get(os.style.StyleType.FEATURE));
2728

2829
if (config) {
@@ -69,3 +70,16 @@ os.command.FeatureOpacity.prototype.applyValue = function(configs, value) {
6970

7071
os.command.FeatureOpacity.base(this, 'applyValue', configs, value);
7172
};
73+
74+
75+
/**
76+
* @inheritDoc
77+
*/
78+
os.command.FeatureOpacity.prototype.finish = function(configs) {
79+
// dispatch the color change event on the source for the histogram
80+
var feature = this.getFeature();
81+
82+
feature.dispatchEvent(new os.events.PropertyChangeEvent('colors'));
83+
84+
os.command.FeatureOpacity.base(this, 'finish', configs);
85+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
goog.provide('os.command.FeatureStrokeColor');
2+
3+
goog.require('os.command.AbstractFeatureStyle');
4+
goog.require('os.events.PropertyChangeEvent');
5+
goog.require('os.metrics');
6+
7+
8+
9+
/**
10+
* Changes the stroke color of a feature
11+
* @extends {os.command.AbstractFeatureStyle}
12+
* @param {string} layerId
13+
* @param {string} featureId
14+
* @param {Array<number>|string} color
15+
* @param {(Array<number>|string)=} opt_oldColor
16+
* @constructor
17+
*/
18+
os.command.FeatureStrokeColor = function(layerId, featureId, color, opt_oldColor) {
19+
os.command.FeatureStrokeColor.base(this, 'constructor', layerId, featureId, color, opt_oldColor);
20+
this.title = 'Change Feature Stroke Color';
21+
this.metricKey = os.metrics.Layer.FEATURE_STROKE_COLOR;
22+
23+
if (!color) {
24+
var feature = this.getFeature();
25+
var config = /** @type {Object|undefined} */ (feature.get(os.style.StyleType.FEATURE));
26+
27+
if (config) {
28+
if (goog.isArray(config)) {
29+
config = config[0];
30+
}
31+
var configColor = /** @type {Array<number>|string|undefined} */ (os.style.getConfigColor(config));
32+
33+
if (configColor) {
34+
color = os.color.toHexString(color);
35+
}
36+
}
37+
}
38+
39+
// Make sure the value is a string
40+
this.value = os.style.toRgbaString(color);
41+
};
42+
goog.inherits(os.command.FeatureStrokeColor, os.command.AbstractFeatureStyle);
43+
44+
45+
/**
46+
* @type {string}
47+
* @const
48+
*/
49+
os.command.FeatureStrokeColor.DEFAULT_COLOR = 'rgba(255,255,255,1)';
50+
51+
52+
/**
53+
* @inheritDoc
54+
*/
55+
os.command.FeatureStrokeColor.prototype.getOldValue = function() {
56+
var feature = /** @type {ol.Feature} */ (this.getFeature());
57+
var config = /** @type {Array<Object>|Object|undefined} */ (this.getFeatureConfigs(feature));
58+
if (goog.isArray(config)) {
59+
config = config[0];
60+
}
61+
62+
if (config) {
63+
return os.style.getConfigColor(config, false, os.style.StyleField.STROKE);
64+
} else {
65+
return os.command.FeatureStrokeColor.DEFAULT_COLOR;
66+
}
67+
};
68+
69+
70+
/**
71+
* Gets the old label color
72+
* @return {Array<number>|string|undefined}
73+
*/
74+
os.command.FeatureStrokeColor.prototype.getLabelValue = function() {
75+
var feature = /** @type {ol.Feature} */ (this.getFeature());
76+
var labelColor = /** @type {Array<number>|string|undefined} */ (feature.get(os.style.StyleField.LABEL_COLOR));
77+
return labelColor ? labelColor : os.style.DEFAULT_LAYER_COLOR;
78+
};
79+
80+
81+
/**
82+
* @inheritDoc
83+
*/
84+
os.command.FeatureStrokeColor.prototype.applyValue = function(configs, value) {
85+
var color = os.style.toRgbaString(/** @type {string} */ (value));
86+
for (var i = 0; i < configs.length; i++) {
87+
os.style.setConfigColor(configs[i], color, [os.style.StyleField.STROKE, os.style.StyleField.IMAGE]);
88+
}
89+
90+
if (this.oldValue == this.getLabelValue()) {
91+
this.applyLabelValue(configs, value);
92+
}
93+
94+
os.command.FeatureStrokeColor.base(this, 'applyValue', configs, value);
95+
};
96+
97+
98+
/**
99+
* Set the label color
100+
* @param {Object} configs The style config
101+
* @param {string} value The value to apply
102+
*/
103+
os.command.FeatureStrokeColor.prototype.applyLabelValue = function(configs, value) {
104+
var feature = /** @type {ol.Feature} */ (this.getFeature());
105+
feature.set(os.style.StyleField.LABEL_COLOR, value);
106+
107+
for (var i = 0; i < configs.length; i++) {
108+
configs[i][os.style.StyleField.LABEL_COLOR] = value;
109+
}
110+
};
111+
112+
113+
/**
114+
* @inheritDoc
115+
*/
116+
os.command.FeatureStrokeColor.prototype.finish = function(configs) {
117+
// dispatch the color change event on the source for the histogram
118+
var feature = this.getFeature();
119+
120+
feature.dispatchEvent(new os.events.PropertyChangeEvent('colors'));
121+
122+
os.command.FeatureStrokeColor.base(this, 'finish', configs);
123+
};

0 commit comments

Comments
 (0)