Refactor/styles separate css file explorer #587
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -11,6 +11,7 @@ | |
|
|
||
| import * as UI from 'solid-ui' | ||
| import * as $rdf from 'rdflib' | ||
| import './styles/dataContentPane.css' | ||
|
|
||
| const ns = UI.ns | ||
|
|
||
|
|
@@ -42,6 +43,21 @@ | |
| return store.whether(subject, UI.ns.rdf('type'), UI.ns.link('RDFDocument')) | ||
| }, | ||
| */ | ||
| /* This code was generated by Generative AI (GPT-5.3-Codex in GitHub Copilot) based on the following prompt: | ||
| Only the class assignments of dataContentPaneNestedLight and dataContentPaneNestedDark | ||
| are the only things added by AI. | ||
|
|
||
| This is the comment I got from copilot, but suggested fix remove the dark | ||
| class as well The nested table shading logic checks | ||
| UI.utils.ancestor(newTable, 'TABLE') immediately after | ||
| creating newTable, but at that moment newTable typically has no | ||
| parent in the DOM yet. This makes parentTable null and will | ||
| always apply dataContentPaneNestedLight, preventing the | ||
| intended alternating light/dark nested backgrounds. | ||
| Consider assigning the class after appending newTable into | ||
| its parent table, or pass the parent table (or current nesting | ||
| depth) into objectTree() so the decision can be made reliably. | ||
| can you help me fix this without removing the dark altering */ | ||
| statementsAsTables: function statementsAsTables (sts, context, initialRoots) { | ||
| const myDocument = context.dom | ||
| // const outliner = context.getOutliner(myDocument) | ||
|
|
@@ -52,13 +68,13 @@ | |
| const subjects = res.subjects | ||
| const loopBreakers = res.loopBreakers | ||
| for (const x in loopBreakers) { | ||
| console.log('\tdataContentPane: loopbreaker:' + x) | ||
|
Check warning on line 71 in src/dataContentPane.js
|
||
| } | ||
| const doneBnodes = {} // For preventing looping | ||
| const referencedBnodes = {} // Bnodes which need to be named alas | ||
|
|
||
| // The property tree for a single subject or anonymous node | ||
| function propertyTree (subject, nestingLevel = 0) { | ||
| // print('Proprty tree for '+subject) | ||
| const rep = myDocument.createElement('table') | ||
| let lastPred = null | ||
|
|
@@ -74,6 +90,7 @@ | |
| for (let i = 0; i < sts.length; i++) { | ||
| const st = sts[i] | ||
| const tr = myDocument.createElement('tr') | ||
| tr.classList.add('dataContentPaneTopAlignedRow') | ||
| if (st.predicate.uri !== lastPred) { | ||
| if (lastPred && same > 1) { | ||
| predicateTD.setAttribute('rowspan', '' + same) | ||
|
|
@@ -99,7 +116,7 @@ | |
| } | ||
| same++ | ||
| const objectTD = myDocument.createElement('td') | ||
| objectTD.appendChild(objectTree(st.object, nestingLevel + 1)) | ||
| tr.appendChild(objectTD) | ||
| rep.appendChild(tr) | ||
| } | ||
|
|
@@ -108,7 +125,7 @@ | |
| } | ||
|
|
||
| // Convert a set of statements into a nested tree of tables | ||
| function objectTree (obj, nestingLevel = 0) { | ||
| let res, anchor | ||
| switch (obj.termType) { | ||
| case 'NamedNode': | ||
|
|
@@ -125,15 +142,15 @@ | |
| case 'Literal': | ||
| if (!obj.datatype || !obj.datatype.uri) { | ||
| res = myDocument.createElement('div') | ||
| res.classList.add('contentPaneLiteral') | ||
| res.textContent = obj.value | ||
| return res | ||
| } else if ( | ||
| obj.datatype.uri === | ||
| 'http://www.w3.org/1999/02/22-rdf-syntax-ns#XMLLiteral' | ||
| ) { | ||
| res = myDocument.createElement('div') | ||
| res.classList.add('embeddedXHTML') | ||
| res.innerHTML = obj.value // Try that @@@ beware embedded dangerous code | ||
| return res | ||
| } | ||
|
|
@@ -150,16 +167,12 @@ | |
| return anchor | ||
| } | ||
| doneBnodes[obj.toNT()] = true // Flag to prevent infinite recursion in propertyTree | ||
| const newTable = propertyTree(obj, nestingLevel) | ||
| doneBnodes[obj.toNT()] = newTable // Track where we mentioned it first | ||
| if (nestingLevel % 2 === 1) { | ||
| newTable.classList.add('dataContentPaneNestedLight') | ||
| } else { | ||
| newTable.classList.add('dataContentPaneNestedDark') | ||
| } | ||
|
Comment on lines
+170
to
176
There was a problem hiding this comment. The new nesting alternation looks inverted relative to the class names/CSS: |
||
| return newTable | ||
| } | ||
|
|
@@ -169,7 +182,7 @@ | |
| for (let i = 0; i < obj.elements.length; i++) { | ||
| const tr = myDocument.createElement('tr') | ||
| res.appendChild(tr) | ||
| tr.appendChild(objectTree(obj.elements[i], nestingLevel + 1)) | ||
| } | ||
| return res | ||
| case 'Graph': | ||
|
|
@@ -200,7 +213,7 @@ | |
| } | ||
| for (let i = 0; i < roots.length; i++) { | ||
| const tr = myDocument.createElement('tr') | ||
| tr.classList.add(i % 2 === 0 ? 'dataContentPaneRowEven' : 'dataContentPaneRowOdd') | ||
| rep.appendChild(tr) | ||
| const subjectTD = myDocument.createElement('td') | ||
| tr.appendChild(subjectTD) | ||
|
|
@@ -210,9 +223,9 @@ | |
| if (root.termType === 'BlankNode') { | ||
| subjectTD.appendChild(myDocument.createTextNode(UI.utils.label(root))) // Don't recurse! | ||
| } else { | ||
| subjectTD.appendChild(objectTree(root, 0)) // won't have tree | ||
| } | ||
| TDTree.appendChild(propertyTree(root, 0)) | ||
| } | ||
| for (const bNT in referencedBnodes) { | ||
| // Add number to refer to | ||
|
|
@@ -248,9 +261,9 @@ | |
| return div | ||
| } | ||
| for (let i = 0; i < roots.length; i++) { | ||
| const tr = myDocument.createElement('tr') | ||
| tr.classList.add('dataContentPaneTopAlignedRow') | ||
| const root = roots[i] | ||
| const td = outliner.outlineObjectTD(root, undefined, tr) | ||
| tr.appendChild(td) | ||
| div.appendChild(tr) | ||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| .contentPaneLiteral { | ||
| white-space: pre-wrap; | ||
| } | ||
|
|
||
| .dataContentPaneRowEven { | ||
| background-color: #f0f0f0; | ||
| } | ||
|
|
||
| .dataContentPaneRowOdd { | ||
| background-color: var(--color-background, white); | ||
| } | ||
|
|
||
| .dataContentPaneTopAlignedRow { | ||
| vertical-align: top; | ||
| } | ||
|
|
||
| .dataContentPaneNestedLight { | ||
| background-color: var(--color-background, white); | ||
| } | ||
|
|
||
| .dataContentPaneNestedDark { | ||
| background-color: #eee; | ||
| } |
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This large in-source comment includes a full Copilot prompt and troubleshooting narrative. It’s brittle (easily becomes inaccurate as code evolves) and makes the file harder to maintain; consider replacing it with a short rationale for the nesting-level approach and referencing the README policy section instead.