VERSION 9.0!!!

Happy New Year! 🎊 🎺 🎉 🥳 Version 9 is here!

Version 9.0 Updates

My main goal was to get all of the killer updates for version 7 to work in GNOME versions 46 and 47. Previously it was just 48 and 49, but now it's GNOME 46 through 49. YES!! 👍👍

Give Me Some Ubuntu Love!

This is my gift to all you Ubuntu 24.04 people who won't see a GNOME update beyond version 46 for some time (unless you manually do it). This includes me because Ubuntu 24.04 is my main system at work and at home! (That is until 26.04.01 comes out... which will purportedly use GNOME 50 - more work!)

But that's not all! I've also incorporated rulers to the grid. It's super-duper fantastico.

When you press Ctrl + G to activate the grid you will now see a horizontal ruler (bottom) and a vertical rule (left) with tick marks, numbers, and a blue measuring line that follows your stylus/mouse. This makes is a lot easier to create extremely accurate rectangles and other polygons.

This work was mostly done in area.js.

Plenty of other fixes as well including text tool cleanup (blinking issue and breakage), SVG export fix, Highlighter transparency failure on save/open fix, palette cycling fix (with auto color selection), Persistent Restart fix, and more... "We few, we happy few, we band of debuggers!" ⚔️

I've tested this on:

Manjaro - GNOME 49.1
Fedora 43 - GNOME 49
Debian Sid - GNOME 49
Debian Sid - GNOME 48.5
Fedora 41 - GNOME 47
Ubuntu Desktop - GNOME 46

Read on for all the details!

GJS Compatibility

Something was rotten in the state of GNOME 46. Not to place blame, but GNOME likes to make changes, and my JavaScript was not up to task. The villain? Older JS syntax support in GJS 1.78 and 1.80, and modified naming conventions for cursors.

Therefore, I let slip the dogs of backward compatibility. Exempli gratia:

The nullish coalescing operator was great:

const Color = Clutter.Color ?? Cogl.Color;

but not great enough. I needed support for 46, 47, 48, and 49. So, I needed a ternary operator:

const Color = Clutter.Color ? Clutter.Color : Cogl.Color;

The differences are minor, but they are there, and work in a fallback fashion. I modified this in area.js and elements.js

This now supports GNOME 46 (GJS 1.78), GNOME 47 (GJS 1.80) and GNOME 48+ (1.82).
Chaining operators needed to be modified. It was a matter of "to chain, or not to chain - optionally". For example:
```
event.get_device?.()
//became this
(event.get_device ? event.get_device() : null)
```
There were 11 instances of this type of chaining that I modified with explicit null checks within area.js, areamanager.js, elements.js, and files.js. This takes care of the varying GJS versions mentioned above.
Curses! My kingdom for a cursor!

The problem: GNOME would crash when moving, resizing, or mirroring (among other things) because of incorrect cursor names. GNOME had made a change somewhere around GNOME 47.x+/48. DND_MOVE became MOVE. POINTING_HAND became POINTER. BLANK became NONE. and IBEAM became TEXT. At least, I believe those are all the changes.

So, the main modification in `areamanager.js is:
```
setCursor(sourceActor_, cursorName) {
    // Map cursor names for GNOME 46/47 fallback compatibility
    let cursorMap = {
        'MOVE': this._SHELL_MAJOR_VERSION >= 48 ? 'MOVE' : 'DND_MOVE',
        'POINTER': this._SHELL_MAJOR_VERSION >= 48 ? 'POINTER' : 'POINTING_HAND', 
        'NONE': this._SHELL_MAJOR_VERSION >= 48 ? 'NONE' : 'BLANK',
        'CROSSHAIR': 'CROSSHAIR',
        'TEXT': this._SHELL_MAJOR_VERSION >= 48 ? 'TEXT' : 'IBEAM',
        'DEFAULT': 'DEFAULT'
    };
```
This allows for a fallback in case the defaults don't work. Is it the most elegant solution? Nuh-uh. Does it work? Yes. Does it slow down D.O.G. on GNOME 46/47? Yes, infinitesimally. It is a risk I am willing to take.

The Text Error of DOOM!

After typing text and when selecting another tool, the text blinks for a moment and a log error is written:

JS ERROR: TypeError: textEntry.is_finalized is not a function
_stopWriting/<@file:///home/dave3/.local/share/gnome-shell/extensions/draw-on-gnome@daveprowse.github.io/area.js:1100:41
@resource:///org/gnome/shell/ui/init.js:21:20

This causes the polygon and polyline tools to fail- by not creating matrices properly. Some other tools might act erratically (Save as SVG, dotted line, etc...) (Save as file still works.)

"Out, out, damned text widget! The fix: Modify the _stopWriting() method:

//replaced
!textEntry.is_finalized()
//with
textEntry.get_stage()

The get_stage() (unless I am mistaken) returns null if the widget is destroyed. This should work on all versions.

Save to SVG Fails after Image Paste or Mirror Action

Double, double toil and trouble; Fire burn and caldron bubble!" 🧙‍♂️

This one was hard to troubleshoot, but I finally found the tools that were causing the SVG save to fail. It appears that it dealt with copying/duplicating tools, such as move, copy, and mirroring.

It required a lot of thought and changes to the _drawSVG() method in elements.js. It is done.

Highlighted Box Shows up as solid white box after save and open

This was driving me mad! I had to modify the _startDrawing() method in area.js eith the following:

// Yellow highlighter with 50% transparency
            let highlighterColor = HIGHLIGHTER_YELLOW.copy();
            highlighterColor.alpha = 128;

            // Add toJSON method so color saves properly
            highlighterColor.toJSON = function() {
                return this.to_string();
            };
            highlighterColor.toString = function() {
                return this.to_string();
            };

            // Use RECTANGLE shape with fill enabled for highlighting
            this.currentElement = new Elements.DrawingElement({
                shape: Shape.RECTANGLE,
                color: highlighterColor,

It now writes the correct color while creating it and saving it. It is persistent when closing and reopening and when restarting the computer.

Palette Cycling Issue

You can use Ctrl+/ and Ctrl+Shift+/ to cycle through the different palettes of colors, but it was only "cycling" through two of them.

I've been using some fun grep and sed commands to debug on Manjaro system running D.O.G. for example, for this one:

cd ~/.local/share/gnome-shell/extensions/draw-on-gnome@daveprowse.github.io
grep -n "this.currentPalette =" area.js
sed -n '240,255p' area.js

Lots of changes in area.js for this. Had to modify the selectColor(index) method (again), the switchColorPalette method (again), and the currentColorIndex method. Phew!

Change to Fill Rule Behavior

There is a strange bug in KVM-based VMs that run GNOME. It causes Ctrl+8 and Ctrl+* to be conflated. Ctrl+* was used to select the type of fill rule (non-zero or evenodd) via shortcut. Because this is a rarely used feature (maybe 0.1% of users even understand, or care about, path winding algorithms), I removed the shortcut altogether. However, you can still access the fill rule functionality in the right-click menu after the "Fill" slider is activated.

Persistent Restart Fix

If a person was to enable the "Persistent over Restarts" fix, the extension would crash and give the message:

TypeError: can't access property "JSONS", this._extension.FILES is undefined

I repaired this by fixing the race condition in extension.js in the enable method.

"Thus, conscience does make coders of us all."