Merge pull request #5 from jpraetorius/improvements

Improvements
datacontract · Jun 26, 2024 · 7bc9a75 · 7bc9a75
2 parents 9817470 + 48e0326
commit 7bc9a75
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 7 deletions.
diff --git a/scripts/load_templates.js b/scripts/load_templates.js
@@ -8,6 +8,7 @@ function updateTemplateCode(template) {
     .replace(/\.items\(\)/gm, '')
     .replace(/True/gm, 'true')
     .replace(/False/gm, 'false')
+    .replace(/\.ref/gm, '.$ref')
     .replace(/cli\.datacontract\.com/gm, 'editor.datacontract.com')
     .replace(/Data Contract CLI/gm, 'Data Contract Editor');
 	return updated_template;

diff --git a/src/index.js b/src/index.js
@@ -29,3 +29,5 @@ editor.addEventListener('editor-content-changed', (e) => {
 	const document = e.detail.content;
 	previewPane.document = document;
 });
+// now that everything is wired up make the editor spit put the content for a first render
+document.dispatchEvent(new CustomEvent('request-document'));
diff --git a/src/templates/templates.js b/src/templates/templates.js
@@ -1180,9 +1180,9 @@ output += "</span><br>\n      ";
 }
 output += "\n      <span class=\"font-mono flex\">";
 output += runtime.suppressValue(runtime.contextOrFrameLookup(context, frame, "field_name"), env.opts.autoescape);
-if(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "field")),"ref")) {
+if(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "field")),"$ref")) {
 output += " <a href=\"";
-output += runtime.suppressValue(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "field")),"ref"), env.opts.autoescape);
+output += runtime.suppressValue(runtime.memberLookup((runtime.contextOrFrameLookup(context, frame, "field")),"$ref"), env.opts.autoescape);
 output += "\">\n        <svg title=\"Definition\" class=\"mr-1.5 h-5 w-5 flex-shrink-0\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-0.75 -0.75 24 24\"><defs></defs><path d=\"M3.046875 5.15625h16.40625s0.9375 0 0.9375 0.9375v10.3125s0 0.9375 -0.9375 0.9375H3.046875s-0.9375 0 -0.9375 -0.9375v-10.3125s0 -0.9375 0.9375 -0.9375\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"></path><path d=\"m12.568125 10.3125 4.6875 0\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"></path><path d=\"m12.568125 13.125 4.6875 0\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"></path><path d=\"M5.068124999999999 8.4375h4.6875v4.6875h-4.6875Z\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"></path></svg>\n      </a>";
 ;
 }

diff --git a/src/ui/elements/editor-element.js b/src/ui/elements/editor-element.js
@@ -44,9 +44,13 @@ export class EditorElement extends LitElement {
 		editor.onDidChangeModelContent(() => {
 			const content = editor.getValue();
 			storeDataContractYaml(content);
-			this.dispatchEvent(new CustomEvent('editor-content-changed', { detail:  { content } }));
+			this.dispatchEvent(new CustomEvent('editor-content-changed', { detail: { content } }));
 		});
 
+		document.addEventListener('request-document', () => {
+			this.dispatchEvent(new CustomEvent('editor-content-changed', { detail: { content: editor.getValue() }}));
+		})
+
 		// set up to detect editor errors and emit them
 		monaco.editor.onDidChangeMarkers((resource) => {
 			const markers = monaco.editor.getModelMarkers({resource});
@@ -59,7 +63,7 @@ export class EditorElement extends LitElement {
             column: marker.startColumn
         }))
 
-			this.dispatchEvent(new CustomEvent('editor-errors', { detail:  { validationErrors } }));
+			this.dispatchEvent(new CustomEvent('editor-errors', { detail: { validationErrors } }));
     });
 
 
@@ -68,9 +72,6 @@ export class EditorElement extends LitElement {
 			editor.layout();
 		});
 		resizeObserver.observe(this.editor);
-
-		// emit current content for a first render
-		this.dispatchEvent(new CustomEvent('editor-content-changed', { detail:  { content: editor.getValue() } }));
 	}
 }
 customElements.define("dce-editor", EditorElement);