From ae5e808b6aaad02aa04a3e904930f9dec1a2fef8 Mon Sep 17 00:00:00 2001 From: abose Date: Sat, 18 Jan 2025 12:45:53 +0530 Subject: [PATCH 1/4] fix: cursor not seen if line is empty and no git gutter marker in line in git projects This was caused by fractional .7em rendering of git gutter. The css pixel approximation will hide the 1px cursor line in certain window widths, so we should not use fractional em in the gutter. if was to use a 1em gutter and set a fractional em inset border so that gutter width not fractional also added hover style so that when user hovers over 1em gutter, it expands to 2 em to have the user not work with needle threading precision to click git gutter. the green git-added-lines gutter will not expand as there is currently no action associated with it. --- src/LiveDevelopment/LiveDevMultiBrowser.js | 4 +- .../default/Git/src/GutterManager.js | 52 ++++++++++++++++++- src/extensions/default/Git/src/Panel.js | 3 +- .../default/Git/styles/git-styles.less | 42 +++++++++++---- 4 files changed, 88 insertions(+), 13 deletions(-) diff --git a/src/LiveDevelopment/LiveDevMultiBrowser.js b/src/LiveDevelopment/LiveDevMultiBrowser.js index e67bfecc4e..baeba8cbe3 100644 --- a/src/LiveDevelopment/LiveDevMultiBrowser.js +++ b/src/LiveDevelopment/LiveDevMultiBrowser.js @@ -588,7 +588,7 @@ define(function (require, exports, module) { // reload the page if the given document is a JS file related // to the current live document. - if (_liveDocument.isRelated(absolutePath)) { + if (_liveDocument.isRelated && _liveDocument.isRelated(absolutePath)) { if (doc.getLanguage().getId() === "javascript") { _setStatus(STATUS_RELOADING); _protocol.reload(); @@ -610,7 +610,7 @@ define(function (require, exports, module) { var absolutePath = doc.file.fullPath; - if (_liveDocument.isRelated(absolutePath)) { + if (_liveDocument.isRelated && _liveDocument.isRelated(absolutePath)) { // Set status to out of sync if dirty. Otherwise, set it to active status. _setStatus(_docIsOutOfSync(doc) ? STATUS_OUT_OF_SYNC : STATUS_ACTIVE); } diff --git a/src/extensions/default/Git/src/GutterManager.js b/src/extensions/default/Git/src/GutterManager.js index 064a9c96db..419dbaca8e 100644 --- a/src/extensions/default/Git/src/GutterManager.js +++ b/src/extensions/default/Git/src/GutterManager.js @@ -21,6 +21,45 @@ define(function (require, exports) { editorsWithGutters = [], openWidgets = []; + /** + * Checks if there's already a gutter marker on the given line; + * if not, inserts a blank
to prevent an empty gutter spot. + */ + function _addDummyGutterMarkerIfNotExist(cm, line) { + var lineInfo = cm.lineInfo(line); + if (!lineInfo) { + return; // If line is out of range or doc is empty + } + var gutters = cm.getOption("gutters").slice(0), + gutterEnabled = gutters.indexOf(gutterName); + if(gutterEnabled === -1){ + return; + } + var gutterMarkers = lineInfo.gutterMarkers; + var existingMarker = gutterMarkers && gutterMarkers[gutterName]; + if (!existingMarker) { + var dummy = document.createElement("div"); + dummy.className = "CodeMirror-gitGutter-none"; + cm.setGutterMarker(line, gutterName, dummy); + } + } + + function _cursorActivity(_evt, editor){ + // this is to prevent a gutter gap in the active line if there is no color on this line. + _addDummyGutterMarkerIfNotExist(editor._codeMirror, editor.getCursorPos().line); + } + + EditorManager.on("activeEditorChange", function (event, newEditor, oldEditor) { + if(newEditor){ + newEditor.off("cursorActivity.gitGutter"); + newEditor.on("cursorActivity.gitGutter", _cursorActivity); + _cursorActivity(null, newEditor); + } + if(oldEditor){ + oldEditor.off("cursorActivity.gitGutter"); + } + }); + function clearWidgets() { var lines = openWidgets.map(function (mark) { var w = mark.lineWidget; @@ -102,7 +141,7 @@ define(function (require, exports) { .html(" "); cm.setGutterMarker(obj.line, gutterName, $marker[0]); }); - + _cursorActivity(null, editor); // reopen widgets that were opened before refresh openBefore.forEach(function (obj) { gutterClick(obj.cm, obj.line, gutterName); @@ -373,7 +412,18 @@ define(function (require, exports) { } }); + function init() { + const editor = EditorManager.getActiveEditor(); + if(!editor){ + return; + } + editor.off("cursorActivity.gitGutter"); + editor.on("cursorActivity.gitGutter", _cursorActivity); + _cursorActivity(null, editor); + } + // API + exports.init = init; exports.goToPrev = goToPrev; exports.goToNext = goToNext; }); diff --git a/src/extensions/default/Git/src/Panel.js b/src/extensions/default/Git/src/Panel.js index cac77c3dc0..bc4f41a915 100644 --- a/src/extensions/default/Git/src/Panel.js +++ b/src/extensions/default/Git/src/Panel.js @@ -1083,7 +1083,7 @@ define(function (require, exports) { if ($this.attr("x-status") === Git.FILE_STATUS.DELETED) { return; } - FileViewController.addToWorkingSetAndSelect(Preferences.get("currentGitRoot") + $this.attr("x-file")); + FileViewController.openFileAndAddToWorkingSet(Preferences.get("currentGitRoot") + $this.attr("x-file")); }); } @@ -1316,6 +1316,7 @@ define(function (require, exports) { toggle(true); } _panelResized(); + GutterManager.init(); } // function init() { function enable() { diff --git a/src/extensions/default/Git/styles/git-styles.less b/src/extensions/default/Git/styles/git-styles.less index f061345535..b51edebf16 100644 --- a/src/extensions/default/Git/styles/git-styles.less +++ b/src/extensions/default/Git/styles/git-styles.less @@ -3,11 +3,14 @@ // common @git-moreDarkGrey: #868888; @git-green: #91CC41; +@dark-git-green: #78A336; @git-red: #F74687; +@dark-git-red: #D03A6F; @git-red-text: #F74687; @git-blue-text: #1976DD; @git-dark-blue-text: #51c0ff; @git-orange: #E3B551; +@dark-git-orange: #C29844; @git-orange-text: #e28200; // Diff colors ('d' for 'dark', `l` for "light") @@ -291,41 +294,58 @@ .CodeMirror { .brackets-git-gutter { + pointer-events: auto; width: @gutterWidth; - margin-left: 1px; } .brackets-git-gutter-added, .brackets-git-gutter-modified, .brackets-git-gutter-removed { + pointer-events: auto; background-size: @gutterWidth @gutterWidth; background-repeat: no-repeat; - font-size: 1em; - font-weight: bold; color: @bc-menu-bg; + border-left: 0.4em solid transparent; + transition: border-left-width 0.2s ease; .dark & { color: @dark-bc-menu-bg; + border-left-width: 0.3em; } } .brackets-git-gutter-added { - background-color: @git-green; + border-left-color: @git-green; + .dark & { + border-left-color: @dark-git-green; + } } .brackets-git-gutter-modified { - background-color: @git-orange; + border-left-color: @git-orange; + &:hover { + border-left-width: 2em; + } + .dark & { + border-left-color: @dark-git-orange; + } } .brackets-git-gutter-removed { - background-color: @git-red; + border-left-color: @git-red; + &:hover { + border-left-width: 2em; + } + .dark & { + border-left-color: @dark-git-red; + } } .brackets-git-gutter-deleted-lines { color: @bc-text; - background-color: lighten(@git-red, 25%); + border-left-color: lighten(@git-red, 25%); .selectable-text(); .dark & { - background-color: darken(@git-red, 25%); + border-left-color: darken(@dark-git-red, 25%); color: @dark-bc-text; } @@ -338,6 +358,10 @@ height: 1.2em; line-height: 0.5em; } + + &:hover { + border-left-width: 1em; + } } } @@ -814,7 +838,7 @@ // main -@gutterWidth: 0.65em; // using ems so that it'll be scalable on cmd +/- +@gutterWidth: 1em; // using ems so that it'll be scalable on cmd +/- #editor-holder { .git.spinner { From ae3dd204b3752d0773e74de8019ee2f5d1631841 Mon Sep 17 00:00:00 2001 From: abose Date: Sat, 18 Jan 2025 12:48:44 +0530 Subject: [PATCH 2/4] refactor: renaming .bracketsGitTemp file to .phoenixGitTemp --- src/extensions/default/Git/src/Utils.js | 2 +- src/extensions/default/Git/src/git/GitCli.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/extensions/default/Git/src/Utils.js b/src/extensions/default/Git/src/Utils.js index d55400bd80..b82b3ce4a8 100644 --- a/src/extensions/default/Git/src/Utils.js +++ b/src/extensions/default/Git/src/Utils.js @@ -273,7 +273,7 @@ define(function (require, exports, module) { } // create entry for temporary file - var fileEntry = FileSystem.getFileForPath(folder + ".bracketsGitTemp"); + var fileEntry = FileSystem.getFileForPath(folder + ".phoenixGitTemp"); function finish(bool) { // delete the temp file and resolve diff --git a/src/extensions/default/Git/src/git/GitCli.js b/src/extensions/default/Git/src/git/GitCli.js index a18884eb9f..2ee6efd59a 100644 --- a/src/extensions/default/Git/src/git/GitCli.js +++ b/src/extensions/default/Git/src/git/GitCli.js @@ -606,10 +606,10 @@ define(function (require, exports) { } else { return new Promise(function (resolve, reject) { // FUTURE: maybe use git commit --file=- - var fileEntry = FileSystem.getFileForPath(Preferences.get("currentGitRoot") + ".bracketsGitTemp"); + var fileEntry = FileSystem.getFileForPath(Preferences.get("currentGitRoot") + ".phoenixGitTemp"); jsPromise(FileUtils.writeText(fileEntry, message)) .then(function () { - args.push("-F", ".bracketsGitTemp"); + args.push("-F", ".phoenixGitTemp"); return git(args, {progressTracker}); }) .then(function (res) { From cdc813c9f24adf2f755373d562ed80d410b826ac Mon Sep 17 00:00:00 2001 From: abose Date: Sat, 18 Jan 2025 12:54:00 +0530 Subject: [PATCH 3/4] chore: should be able to copy commit text from history viewer commit detail pane --- src/extensions/default/Git/styles/git-styles.less | 1 + 1 file changed, 1 insertion(+) diff --git a/src/extensions/default/Git/styles/git-styles.less b/src/extensions/default/Git/styles/git-styles.less index b51edebf16..c892eb4969 100644 --- a/src/extensions/default/Git/styles/git-styles.less +++ b/src/extensions/default/Git/styles/git-styles.less @@ -613,6 +613,7 @@ } .commitBody { padding: 0 30px; + user-select: text; } .commit-files { padding: 0 20px; From 296fcc525e3635fdbac7fc5e6f5e686cfa9a404b Mon Sep 17 00:00:00 2001 From: abose Date: Sat, 18 Jan 2025 12:59:47 +0530 Subject: [PATCH 4/4] chore: should be able to copy commit text from history viewer commit detail pane in safari too --- src/extensions/default/Git/styles/git-styles.less | 1 - src/extensions/default/Git/templates/history-viewer.html | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/extensions/default/Git/styles/git-styles.less b/src/extensions/default/Git/styles/git-styles.less index c892eb4969..b51edebf16 100644 --- a/src/extensions/default/Git/styles/git-styles.less +++ b/src/extensions/default/Git/styles/git-styles.less @@ -613,7 +613,6 @@ } .commitBody { padding: 0 30px; - user-select: text; } .commit-files { padding: 0 20px; diff --git a/src/extensions/default/Git/templates/history-viewer.html b/src/extensions/default/Git/templates/history-viewer.html index 22d9c759c4..3c8fcce5cb 100644 --- a/src/extensions/default/Git/templates/history-viewer.html +++ b/src/extensions/default/Git/templates/history-viewer.html @@ -33,7 +33,7 @@

{{commit.subject}}

-
{{{bodyMarkdown}}}
+
{{{bodyMarkdown}}}