From b9df226b0fd2d758a741dc4d913b94b15521f49e Mon Sep 17 00:00:00 2001 From: Lucas Oskorep Date: Fri, 8 Nov 2024 02:27:04 -0500 Subject: [PATCH] Initial commit --- .idea/.gitignore | 5 + .idea/modules.xml | 8 ++ .idea/prettyborders@lucaso.io.iml | 12 +++ extension.js | 166 ++++++++++++++++++++++++++++++ metadata.json | 8 ++ stylesheet.css | 37 +++++++ 6 files changed, 236 insertions(+) create mode 100644 .idea/.gitignore create mode 100644 .idea/modules.xml create mode 100644 .idea/prettyborders@lucaso.io.iml create mode 100644 extension.js create mode 100644 metadata.json create mode 100644 stylesheet.css diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..b58b603 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,5 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..dc01314 --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/prettyborders@lucaso.io.iml b/.idea/prettyborders@lucaso.io.iml new file mode 100644 index 0000000..24643cc --- /dev/null +++ b/.idea/prettyborders@lucaso.io.iml @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/extension.js b/extension.js new file mode 100644 index 0000000..fb49406 --- /dev/null +++ b/extension.js @@ -0,0 +1,166 @@ +import St from 'gi://St'; + +import {Extension} from 'resource:///org/gnome/shell/extensions/extension.js'; +import * as Main from 'resource:///org/gnome/shell/ui/main.js'; + + +export default class ActiveBorderExtension extends Extension { + constructor(metadata) { + super(metadata); + // Initialize instance variables + this.borderActor = null; + this.focusWindowSignals = []; + this.lastFocusedWindow = null; + this._focusSignal = null; + } + enable() { + console.log("STARTING PRETTY BORDERS!") + // Connect to the focus window signal to track the active window + this._focusSignal = global.display.connect('notify::focus-window', () => { + this._updateBorder(global.display.focus_window); + }); + // Set initial border on the current window, if there is one + this._updateBorder(global.display.focus_window); + + } + + _updateBorder(window) { + console.log("UPDATING THE BORDER") + // Clear the previous border if there's a last focused window + // if (this.lastFocusedWindow) { + // this._clearBorder(this.lastFocusedWindow); + // } + this._clearBorder(); + // Set a new border for the currently focused window + if (window) { + this._setBorder(window); + this.lastFocusedWindow = window; + } + } + + _setBorder(window) { + console.log("SETTING THE BORDER") + if (!window) return; + + const rect = window.get_frame_rect(); + if (!rect) return; + + // Create a new actor for the border using St.Widget + this.borderActor = new St.Widget({ + name: 'active-window-border', + style_class: 'active-window-border', + reactive: false, + x: rect.x - 4, // Adjust for border width + y: rect.y - 4, + width: rect.width + 8, + height: rect.height + 8, + }); + + // Add the border actor to the UI group + Main.layoutManager.uiGroup.add_child(this.borderActor); + + // Listen to window's changes in position and size + this.focusWindowSignals.push(window.connect('position-changed', () => this._updateBorderPosition(window))); + this.focusWindowSignals.push(window.connect('size-changed', () => this._updateBorderPosition(window))); + this.focusWindowSignals.push(window.connect('unmanaged', () => this._clearBorder())); + + this._updateBorderPosition(window); + // Add the effect to the window + // actor.add_effect_with_name('bor/der-effect', borderEffect); + } + + _updateBorderPosition(window) { + if (!this.borderActor || !window) return; + + const rect = window.get_frame_rect(); + if (!rect) return; + + this.borderActor.set_position(rect.x - 4, rect.y - 4); + this.borderActor.set_size(rect.width + 8, rect.height + 8); + } + + _clearBorder() { + if (this.borderActor) { + this.borderActor.destroy(); + this.borderActor = null; + } + + // Disconnect any signals connected to the window + if (this.lastFocusedWindow && this.focusWindowSignals.length > 0) { + this.focusWindowSignals.forEach(signal => { + this.lastFocusedWindow.disconnect(signal); + }); + this.focusWindowSignals = []; + } + } + + disable() { + // Disconnect the signal and remove any existing borders + if (this._focusSignal) { + global.display.disconnect(this._focusSignal); + this._focusSignal = null; + } + + // Clear the border on the last focused window if it exists + this._clearBorder(); + this.lastFocusedWindow = null; + } + +} + +// class ActiveBorderExtension extends Extension { +// constructor(metadata) { +// super(metadata); +// } +// +// enable() { +// // Connect to the focus window signal to track the active window +// this._focusSignal = global.display.connect('notify::focus-window', () => { +// this._updateBorder(global.display.focus_window); +// }); +// +// // Set initial border on the current window, if there is one +// this._updateBorder(global.display.focus_window); +// } +// +// disable() { +// // Disconnect the signal and remove any existing borders +// if (this._focusSignal) { +// global.display.disconnect(this._focusSignal); +// this._focusSignal = null; +// } +// +// // Clear the border on the last focused window if it exists +// if (lastFocusedWindow) { +// this._clearBorder(lastFocusedWindow); +// lastFocusedWindow = null; +// } +// } +// +// _updateBorder(window) { +// // Clear the previous border if there's a last focused window +// if (lastFocusedWindow) { +// this._clearBorder(lastFocusedWindow); +// } +// +// // Set a new border for the currently focused window +// if (window) { +// this._setBorder(window); +// lastFocusedWindow = window; +// } +// } +// +// _setBorder(window) { +// if (!window || !window.get_compositor_private()) return; +// window.get_compositor_private().set_style(` +// border: 4px solid rgba(0, 150, 255, 0.8); +// border-radius: 5px; +// `); +// } +// +// _clearBorder(window) { +// if (!window || !window.get_compositor_private()) return; +// window.get_compositor_private().set_style(""); +// } +// } + diff --git a/metadata.json b/metadata.json new file mode 100644 index 0000000..76659e0 --- /dev/null +++ b/metadata.json @@ -0,0 +1,8 @@ +{ + "name": "pretty-borders", + "description": "Adds pretty borders to the active and inactive windows", + "uuid": "prettyborders@lucaso.io", + "shell-version": [ + "47" + ] +} diff --git a/stylesheet.css b/stylesheet.css new file mode 100644 index 0000000..838bd01 --- /dev/null +++ b/stylesheet.css @@ -0,0 +1,37 @@ +/* Add your custom extension styling here */ +.active-window-border { + border: 2px solid rgba(191, 0, 255, 0.8); + border-radius: 3px; + + /*border-image-source: linear-gradient(to left, #743ad5, #d53a9d);*/ + /*border: 4px solid transparent;*/ + /*border-radius: 5px;*/ + + /*/* Gradient border using border-image */ + /*border-image: linear-gradient(45deg, red, orange, yellow, green, blue, indigo, violet) 1;*/ + +} + +/*.border-gradient-purple {*/ +/* border-image-source: linear-gradient(to left, #743ad5, #d53a9d);*/ +/*}*/ + +@keyframes rainbow-border { + 0% { + border-image: linear-gradient(0deg, red, orange, yellow, green, blue, indigo, violet, red) 1; + } + 100% { + border-image: linear-gradient(360deg, red, orange, yellow, green, blue, indigo, violet, red) 1; + } +} + +/*.active-window-border {*/ +/* border: 4px solid transparent;*/ +/* border-radius: 5px;*/ + +/* !* Initial gradient border *!*/ +/* border-image: linear-gradient(0deg, red, orange, yellow, green, blue, indigo, violet, red) 1;*/ + +/* !* Apply animation *!*/ +/* animation: rainbow-border 5s linear infinite;*/ +/*}*/ \ No newline at end of file