summaryrefslogtreecommitdiffstats
path: root/js/ui/barLevel.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/ui/barLevel.js')
-rw-r--r--js/ui/barLevel.js234
1 files changed, 234 insertions, 0 deletions
diff --git a/js/ui/barLevel.js b/js/ui/barLevel.js
new file mode 100644
index 0000000..f4fdb6e
--- /dev/null
+++ b/js/ui/barLevel.js
@@ -0,0 +1,234 @@
+/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */
+/* exported BarLevel */
+
+const { Atk, Clutter, GObject, St } = imports.gi;
+
+var BarLevel = GObject.registerClass({
+ Properties: {
+ 'value': GObject.ParamSpec.double(
+ 'value', 'value', 'value',
+ GObject.ParamFlags.READWRITE,
+ 0, 2, 0),
+ 'maximum-value': GObject.ParamSpec.double(
+ 'maximum-value', 'maximum-value', 'maximum-value',
+ GObject.ParamFlags.READWRITE,
+ 1, 2, 1),
+ 'overdrive-start': GObject.ParamSpec.double(
+ 'overdrive-start', 'overdrive-start', 'overdrive-start',
+ GObject.ParamFlags.READWRITE,
+ 1, 2, 1),
+ },
+}, class BarLevel extends St.DrawingArea {
+ _init(params) {
+ this._maxValue = 1;
+ this._value = 0;
+ this._overdriveStart = 1;
+ this._barLevelWidth = 0;
+
+ let defaultParams = {
+ style_class: 'barlevel',
+ accessible_role: Atk.Role.LEVEL_BAR,
+ };
+ super._init(Object.assign(defaultParams, params));
+ this.connect('notify::allocation', () => {
+ this._barLevelWidth = this.allocation.get_width();
+ });
+
+ this._customAccessible = St.GenericAccessible.new_for_actor(this);
+ this.set_accessible(this._customAccessible);
+
+ this._customAccessible.connect('get-current-value', this._getCurrentValue.bind(this));
+ this._customAccessible.connect('get-minimum-value', this._getMinimumValue.bind(this));
+ this._customAccessible.connect('get-maximum-value', this._getMaximumValue.bind(this));
+ this._customAccessible.connect('set-current-value', this._setCurrentValue.bind(this));
+
+ this.connect('notify::value', this._valueChanged.bind(this));
+ }
+
+ get value() {
+ return this._value;
+ }
+
+ set value(value) {
+ value = Math.max(Math.min(value, this._maxValue), 0);
+
+ if (this._value == value)
+ return;
+
+ this._value = value;
+ this.notify('value');
+ this.queue_repaint();
+ }
+
+ // eslint-disable-next-line camelcase
+ get maximum_value() {
+ return this._maxValue;
+ }
+
+ // eslint-disable-next-line camelcase
+ set maximum_value(value) {
+ value = Math.max(value, 1);
+
+ if (this._maxValue == value)
+ return;
+
+ this._maxValue = value;
+ this._overdriveStart = Math.min(this._overdriveStart, this._maxValue);
+ this.notify('maximum-value');
+ this.queue_repaint();
+ }
+
+ // eslint-disable-next-line camelcase
+ get overdrive_start() {
+ return this._overdriveStart;
+ }
+
+ // eslint-disable-next-line camelcase
+ set overdrive_start(value) {
+ if (this._overdriveStart == value)
+ return;
+
+ if (value > this._maxValue) {
+ throw new Error(`Tried to set overdrive value to ${value}, ` +
+ `which is a number greater than the maximum allowed value ${this._maxValue}`);
+ }
+
+ this._overdriveStart = value;
+ this.notify('overdrive-start');
+ this.queue_repaint();
+ }
+
+ vfunc_repaint() {
+ let cr = this.get_context();
+ let themeNode = this.get_theme_node();
+ let [width, height] = this.get_surface_size();
+
+ let barLevelHeight = themeNode.get_length('-barlevel-height');
+ let barLevelBorderRadius = Math.min(width, barLevelHeight) / 2;
+ let fgColor = themeNode.get_foreground_color();
+
+ let barLevelColor = themeNode.get_color('-barlevel-background-color');
+ let barLevelActiveColor = themeNode.get_color('-barlevel-active-background-color');
+ let barLevelOverdriveColor = themeNode.get_color('-barlevel-overdrive-color');
+
+ let barLevelBorderWidth = Math.min(themeNode.get_length('-barlevel-border-width'), 1);
+ let [hasBorderColor, barLevelBorderColor] =
+ themeNode.lookup_color('-barlevel-border-color', false);
+ if (!hasBorderColor)
+ barLevelBorderColor = barLevelColor;
+ let [hasActiveBorderColor, barLevelActiveBorderColor] =
+ themeNode.lookup_color('-barlevel-active-border-color', false);
+ if (!hasActiveBorderColor)
+ barLevelActiveBorderColor = barLevelActiveColor;
+ let [hasOverdriveBorderColor, barLevelOverdriveBorderColor] =
+ themeNode.lookup_color('-barlevel-overdrive-border-color', false);
+ if (!hasOverdriveBorderColor)
+ barLevelOverdriveBorderColor = barLevelOverdriveColor;
+
+ const TAU = Math.PI * 2;
+
+ let endX = 0;
+ if (this._maxValue > 0)
+ endX = barLevelBorderRadius + (width - 2 * barLevelBorderRadius) * this._value / this._maxValue;
+
+ let overdriveSeparatorX = barLevelBorderRadius + (width - 2 * barLevelBorderRadius) * this._overdriveStart / this._maxValue;
+ let overdriveActive = this._overdriveStart !== this._maxValue;
+ let overdriveSeparatorWidth = 0;
+ if (overdriveActive)
+ overdriveSeparatorWidth = themeNode.get_length('-barlevel-overdrive-separator-width');
+
+ /* background bar */
+ cr.arc(width - barLevelBorderRadius - barLevelBorderWidth, height / 2, barLevelBorderRadius, TAU * (3 / 4), TAU * (1 / 4));
+ cr.lineTo(endX, (height + barLevelHeight) / 2);
+ cr.lineTo(endX, (height - barLevelHeight) / 2);
+ cr.lineTo(width - barLevelBorderRadius - barLevelBorderWidth, (height - barLevelHeight) / 2);
+ Clutter.cairo_set_source_color(cr, barLevelColor);
+ cr.fillPreserve();
+ Clutter.cairo_set_source_color(cr, barLevelBorderColor);
+ cr.setLineWidth(barLevelBorderWidth);
+ cr.stroke();
+
+ /* normal progress bar */
+ let x = Math.min(endX, overdriveSeparatorX - overdriveSeparatorWidth / 2);
+ cr.arc(barLevelBorderRadius + barLevelBorderWidth, height / 2, barLevelBorderRadius, TAU * (1 / 4), TAU * (3 / 4));
+ cr.lineTo(x, (height - barLevelHeight) / 2);
+ cr.lineTo(x, (height + barLevelHeight) / 2);
+ cr.lineTo(barLevelBorderRadius + barLevelBorderWidth, (height + barLevelHeight) / 2);
+ if (this._value > 0)
+ Clutter.cairo_set_source_color(cr, barLevelActiveColor);
+ cr.fillPreserve();
+ Clutter.cairo_set_source_color(cr, barLevelActiveBorderColor);
+ cr.setLineWidth(barLevelBorderWidth);
+ cr.stroke();
+
+ /* overdrive progress barLevel */
+ x = Math.min(endX, overdriveSeparatorX) + overdriveSeparatorWidth / 2;
+ if (this._value > this._overdriveStart) {
+ cr.moveTo(x, (height - barLevelHeight) / 2);
+ cr.lineTo(endX, (height - barLevelHeight) / 2);
+ cr.lineTo(endX, (height + barLevelHeight) / 2);
+ cr.lineTo(x, (height + barLevelHeight) / 2);
+ cr.lineTo(x, (height - barLevelHeight) / 2);
+ Clutter.cairo_set_source_color(cr, barLevelOverdriveColor);
+ cr.fillPreserve();
+ Clutter.cairo_set_source_color(cr, barLevelOverdriveBorderColor);
+ cr.setLineWidth(barLevelBorderWidth);
+ cr.stroke();
+ }
+
+ /* end progress bar arc */
+ if (this._value > 0) {
+ if (this._value <= this._overdriveStart)
+ Clutter.cairo_set_source_color(cr, barLevelActiveColor);
+ else
+ Clutter.cairo_set_source_color(cr, barLevelOverdriveColor);
+ cr.arc(endX, height / 2, barLevelBorderRadius, TAU * (3 / 4), TAU * (1 / 4));
+ cr.lineTo(Math.floor(endX), (height + barLevelHeight) / 2);
+ cr.lineTo(Math.floor(endX), (height - barLevelHeight) / 2);
+ cr.lineTo(endX, (height - barLevelHeight) / 2);
+ cr.fillPreserve();
+ cr.setLineWidth(barLevelBorderWidth);
+ cr.stroke();
+ }
+
+ /* draw overdrive separator */
+ if (overdriveActive) {
+ cr.moveTo(overdriveSeparatorX - overdriveSeparatorWidth / 2, (height - barLevelHeight) / 2);
+ cr.lineTo(overdriveSeparatorX + overdriveSeparatorWidth / 2, (height - barLevelHeight) / 2);
+ cr.lineTo(overdriveSeparatorX + overdriveSeparatorWidth / 2, (height + barLevelHeight) / 2);
+ cr.lineTo(overdriveSeparatorX - overdriveSeparatorWidth / 2, (height + barLevelHeight) / 2);
+ cr.lineTo(overdriveSeparatorX - overdriveSeparatorWidth / 2, (height - barLevelHeight) / 2);
+ if (this._value <= this._overdriveStart)
+ Clutter.cairo_set_source_color(cr, fgColor);
+ else
+ Clutter.cairo_set_source_color(cr, barLevelColor);
+ cr.fill();
+ }
+
+ cr.$dispose();
+ }
+
+ _getCurrentValue() {
+ return this._value;
+ }
+
+ _getOverdriveStart() {
+ return this._overdriveStart;
+ }
+
+ _getMinimumValue() {
+ return 0;
+ }
+
+ _getMaximumValue() {
+ return this._maxValue;
+ }
+
+ _setCurrentValue(_actor, value) {
+ this._value = value;
+ }
+
+ _valueChanged() {
+ this._customAccessible.notify("accessible-value");
+ }
+});