Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
112 commits
Select commit Hold shift + click to select a range
efe0cae
Add renovate.json
renovate[bot] Dec 15, 2023
b6d7bb5
feat: live preview hover inspect ui initial
abose Jul 3, 2025
b81369b
feat: live preview hover highlights improved
abose Jul 3, 2025
adb1623
feat: element selection and content editable setting
abose Jul 6, 2025
740acea
feat: create the DOM manipulation option box when an element is click…
devvaannsh Jul 16, 2025
a7fb976
feat: add click handler to the DOM advance option buttons
devvaannsh Jul 16, 2025
8acbde4
fix: dom more options box background color changing when hovered
devvaannsh Jul 16, 2025
c98d690
feat: add border when a element is clicked
devvaannsh Jul 17, 2025
ea7338f
fix: change border to outline to prevent content shifting
devvaannsh Jul 17, 2025
c06b02b
fix: more options box positioning when live preview is scrolled
devvaannsh Jul 17, 2025
c6c3e1e
fix: offset height gives invalid px and puts the more options box bel…
devvaannsh Jul 17, 2025
7bfd6f7
fix: box getting out of viewport horizontally
devvaannsh Jul 17, 2025
4160604
fix: positioning of the element info box
devvaannsh Jul 17, 2025
a0cd589
fix: horizontal positioning of both the boxes
devvaannsh Jul 17, 2025
40673e3
feat: enable deletion of elements in source code from live preview
devvaannsh Jul 18, 2025
1cf48a2
fix: use existing APIs to reference the source code of the element gi…
devvaannsh Jul 18, 2025
72c423f
fix: remove the popup after it is handled
devvaannsh Jul 18, 2025
5fc4515
feat: implement live preview duplicate option functionality
devvaannsh Jul 18, 2025
0221abc
feat: implement select-parent option in live preview edit
devvaannsh Jul 19, 2025
2a182eb
fix: implement shadow DOM to prevent box styles being overridden by u…
devvaannsh Jul 19, 2025
f691e5a
fix: box now moves along with the selected element when scrolled
devvaannsh Jul 19, 2025
bf9a787
fix: positioning of the info box
devvaannsh Jul 19, 2025
f0cc1f4
fix: remove properties after setting values
devvaannsh Jul 20, 2025
a7e3140
feat: add event listener for dragging inside live preview
devvaannsh Jul 20, 2025
6e9df29
feat: implement live preview edit text functionality
devvaannsh Jul 20, 2025
04c5914
fix: duplication issue when there is some content before the element
devvaannsh Jul 21, 2025
717a498
fix: disbale live preview edit for html & body tags
devvaannsh Jul 21, 2025
9e54784
fix: show more options box at the correct position when live preview …
devvaannsh Jul 21, 2025
45be328
fix: bold italic type of tags break inside live preview and leaks int…
devvaannsh Jul 21, 2025
49ce40c
fix: use current live doc instead of active editor
devvaannsh Jul 21, 2025
1865d3e
fix: editing text inside live preview leaks phoenix internal attributes
devvaannsh Jul 22, 2025
a5e478a
fix: file rename to make it consistent
devvaannsh Jul 22, 2025
04036c2
fix: typo in file name
devvaannsh Jul 22, 2025
cd95ddf
fix: show info box along with more option box when a DOM element is c…
devvaannsh Jul 22, 2025
37c44a1
fix: overlapping issue between the info box and the more options box
devvaannsh Jul 23, 2025
c69d127
fix: calculate info box width based on char count
devvaannsh Jul 23, 2025
183458b
fix: positioning of the info box
devvaannsh Jul 23, 2025
c03e6e6
fix: info box getting out of bounds
devvaannsh Jul 23, 2025
0918e2e
fix: remove redundant positioning checks
devvaannsh Jul 23, 2025
e6fbfb4
feat: enable undo in live preview to undo live preview edit operations
devvaannsh Jul 23, 2025
a312acb
feat: drag drop live preview implementation
devvaannsh Jul 24, 2025
5c5be80
fix: indent of target element after drag & drop operation
devvaannsh Jul 24, 2025
97e56ad
feat: allow dropping before as well as after the element
devvaannsh Jul 24, 2025
c3005e3
fix: internal live preview editing styles leak on users source code
devvaannsh Jul 25, 2025
869f79a
fix: remove extra line after drag-drop operation
devvaannsh Jul 25, 2025
36c692f
feat: remove boxes when escape key is pressed or user clicks on a emp…
devvaannsh Jul 25, 2025
397fa78
fix: delete empty lines when deleting an element from the live preview
devvaannsh Jul 25, 2025
b089bc2
fix: error when trying to remove node info box
devvaannsh Jul 25, 2025
d851f1d
fix: live preview not handling escape keypress when highlight pref is on
devvaannsh Jul 25, 2025
5734768
feat: enable redo when ctrl + y is pressed in live preview
devvaannsh Jul 26, 2025
3dee3d6
fix: prevent links and buttons to move to another webpage when edit m…
devvaannsh Jul 26, 2025
f1c9d37
feat: add pen icon to edit text in the more options box
devvaannsh Jul 26, 2025
d7cf691
fix: more options box doesn't appear because click event was removed
devvaannsh Jul 26, 2025
b2f32ec
fix: do delete and duplicate operation in batch so that undo and redo…
devvaannsh Jul 26, 2025
c4ec986
feat: hide edit option when element is non-editable
devvaannsh Jul 26, 2025
adda9e8
feat: hide select-parent option when element doesn't supports it
devvaannsh Jul 26, 2025
d53e3df
fix: unable to edit text inside elements with no text content
devvaannsh Jul 26, 2025
36f4817
fix: more options box gets out of viewport with very long elements
devvaannsh Jul 26, 2025
59c51e3
fix: button's onclick was overriding more options box
devvaannsh Jul 26, 2025
7b3efd2
fix: revert code as it broke the existing tests
devvaannsh Jul 26, 2025
ae85c59
fix: more option box reappearing after operation performed
devvaannsh Jul 27, 2025
eff2f9a
fix: info box not visible in viewport when element is at the very bottom
devvaannsh Jul 27, 2025
88e960e
fix: more options box not getting hidden after drag & drop operation
devvaannsh Jul 27, 2025
0973692
fix: make sure info box is within live preview bounds
devvaannsh Jul 27, 2025
90ad7d1
fix: remove boxes when user scrolls the live preview
devvaannsh Jul 27, 2025
7f5b85e
fix: remove more options box when user starts editing
devvaannsh Jul 27, 2025
ad694e3
fix: drag & drop logic breaks when target is after source
devvaannsh Jul 27, 2025
4fc3002
fix: move cursor to end of the text content when editing a text
devvaannsh Jul 27, 2025
d4a0689
fix: unable to select text because start editing was called again and…
devvaannsh Jul 27, 2025
ba7d06e
fix: text content becomes undefined when user presses escape
devvaannsh Jul 27, 2025
8d8822c
fix: duplication and deletion gives syntax error when code is not bea…
devvaannsh Jul 30, 2025
4cc200e
fix: use start range from instead of the current cursor position to f…
devvaannsh Jul 30, 2025
9cf2933
fix: use findMatchingTag to get the end position as it is more robust
devvaannsh Jul 30, 2025
92ed8b3
fix: fix architecture of move function by using the getMatchingTag fu…
devvaannsh Jul 30, 2025
e98c07e
fix: browser removing incorrect css syntax from code which is uninten…
devvaannsh Jul 31, 2025
422bada
refactor: remove dead code
devvaannsh Aug 1, 2025
73172fa
fix: operations doesn't work for empty tags as we were relying on the…
devvaannsh Aug 1, 2025
24c1ca0
refactor: allow buttons to be editable
devvaannsh Aug 1, 2025
1ae042b
fix: text formatting not working when trying to edit text in live pre…
devvaannsh Aug 2, 2025
72acb62
fix: body tag gets removed from source code when trying to edit a bod…
devvaannsh Aug 2, 2025
e3bf8f1
refactor: calculate the position of the boxes
devvaannsh Aug 2, 2025
ff87685
fix: move boxes to down when no space at top
devvaannsh Aug 2, 2025
910b8af
feat: update background color when a option button is hovered
devvaannsh Aug 3, 2025
3e47d63
fix: positioning of the info box
devvaannsh Aug 3, 2025
e3945a1
fix: node more options box positioning
devvaannsh Aug 3, 2025
e8bc9c6
fix: boxes overlapping each other
devvaannsh Aug 3, 2025
2577a9f
fix: use screenOffset to calculate overflow
devvaannsh Aug 3, 2025
ef89512
fix: phoenix internal attributes leaking into users source code
devvaannsh Aug 3, 2025
3963fe1
fix: boxes gets out of viewport
devvaannsh Aug 3, 2025
fb5ca41
feat: disable all the live preview advance features when its disabled
devvaannsh Aug 3, 2025
071ced4
feat: add a setting to show elements highlights on hover or click
devvaannsh Aug 4, 2025
911226e
feat: change live preview effect when setting is changed
devvaannsh Aug 4, 2025
9acfcb7
fix: element highlights setting not getting applied immediately directly
devvaannsh Aug 5, 2025
e0b719d
feat: add strings for elements highlight feature
devvaannsh Aug 5, 2025
0ddeb9b
feat: improve styles for element highlight setting
devvaannsh Aug 5, 2025
a47562f
fix: make sure the info box never gets out of bounds
devvaannsh Aug 5, 2025
40cd145
feat: show element highlights boxes when user edits source code for a…
devvaannsh Aug 5, 2025
7820b94
fix: don't remove the boxes when the preview is scrolled
devvaannsh Aug 5, 2025
6f90b03
fix: don't show boxes on non-existant elements
devvaannsh Aug 6, 2025
468f8a7
fix: cursor jump to that start of element when an element in clicked …
devvaannsh Aug 6, 2025
544865f
fix: don't show UI boxes when element is hidden
devvaannsh Aug 6, 2025
642ae78
refactor: update duplicate icon
devvaannsh Aug 6, 2025
71b013c
Merge branch 'renovate/configure' into pluto/lp
Amro1984 Aug 7, 2025
9d51431
fix: live preview jumping automatically
devvaannsh Aug 7, 2025
f5a2227
Merge branch 'pluto/lp' of https://github.com/phcode-dev/phoenix into…
Aug 7, 2025
1ce8e78
Remove unused _shouldShowEditTextOption function
Aug 7, 2025
00c5c43
Main
Aug 7, 2025
ccb8a4f
Merge branch 'pluto/lp'
Aug 7, 2025
5857ae8
Update livePreviewSettings.html
Aug 7, 2025
7f67c6e
Adds VS Code config and JS project setup files
Aug 9, 2025
868b8d7
Configures Copilot Chat virtual tools threshold to 0
Aug 9, 2025
672dad6
Adds ignored pull request branches configuration to settings.json
Aug 9, 2025
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"recommendations": []
}
6 changes: 6 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"github.copilot.chat.virtualTools.threshold": 0,
"githubPullRequests.ignoredPullRequestBranches": [
"main"
]
}
6 changes: 6 additions & 0 deletions renovate.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
"extends": [
"config:recommended"
]
}
3 changes: 3 additions & 0 deletions src/LiveDevelopment/BrowserScripts/.vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"recommendations": []
}
3 changes: 3 additions & 0 deletions src/LiveDevelopment/BrowserScripts/.vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"C_Cpp.autocompleteAddParentheses": true
}
78 changes: 61 additions & 17 deletions src/LiveDevelopment/BrowserScripts/LiveDevProtocolRemote.js
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,8 @@
}
};

global._Brackets_MessageBroker = MessageBroker;

/**
* Runtime Domain. Implements remote commands for "Runtime.*"
*/
Expand Down Expand Up @@ -390,27 +392,69 @@
function onDocumentClick(event) {
// Get the user's current selection
const selection = window.getSelection();

// Check if there is a selection
if (selection.toString().length > 0) {
// if there is any selection like text or others, we don't see it as a live selection event
// Eg: user may selects ome text in live preview to copy, in which case we should nt treat it
// as a live select.
return;
}
var element = event.target;
if (element && element.hasAttribute('data-brackets-id')) {
MessageBroker.send({
"tagId": element.getAttribute('data-brackets-id'),
"nodeID": element.id,
"nodeClassList": element.classList,
"nodeName": element.nodeName,
"allSelectors": _getAllInheritedSelectorsInOrder(element),
"contentEditable": element.contentEditable === 'true',
"clicked": true
});
// Check if it's a double-click for direct editing
if (event.detail === 2 && !['INPUT', 'TEXTAREA', 'SELECT'].includes(element.tagName)) {
// Double-click detected, enable direct editing
// Make the element editable
if (window._LD && window._LD.DOMEditHandler) {
// Use the existing DOMEditHandler to handle the edit
window._LD.startEditing(element);
} else {
MessageBroker.send({
"tagId": element.getAttribute('data-brackets-id'),
"nodeID": element.id,
"nodeClassList": element.classList,
"nodeName": element.nodeName,
"allSelectors": _getAllInheritedSelectorsInOrder(element),
"contentEditable": element.contentEditable === 'true',
"clicked": true,
"edit": true
});
}

// Prevent default behavior and stop propagation
event.preventDefault();
event.stopPropagation();
} else {
// Regular click, just send the information
// Check if there is a selection
if (selection.toString().length > 0) {
// if there is any selection like text or others, we don't see it as a live selection event
// Eg: user may selects ome text in live preview to copy, in which case we should nt treat it
// as a live select.
return;
}
MessageBroker.send({
"tagId": element.getAttribute('data-brackets-id'),
"nodeID": element.id,
"nodeClassList": element.classList,
"nodeName": element.nodeName,
"allSelectors": _getAllInheritedSelectorsInOrder(element),
"contentEditable": element.contentEditable === 'true',
"clicked": true
});
}
}
}
window.document.addEventListener("click", onDocumentClick);
window.document.addEventListener("keydown", function (e) {
// for undo. refer to LivePreviewEdit.js file 'handleLivePreviewEditOperation' function
if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "z") {
MessageBroker.send({
livePreviewEditEnabled: true,
undoLivePreviewOperation: true
});
}

// for redo
if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "y") {
MessageBroker.send({
livePreviewEditEnabled: true,
redoLivePreviewOperation: true
});
}
});

}(this));
Loading