Save is now working.

Run button now sets scale and debug symbol.
Run button now displays preview image.

Progrart.Core/Graphics/Line.cs

@@ -2,20 +2,16 @@
 using Jint.Native;
 using Progrart.Core.JSExecution;
 using SkiaSharp;
+using System.Diagnostics;
 
 namespace Progrart.Core.Graphics
 {
 	public class Line : BaseElement
 	{
 		float Size;
-		float StartX;
+		SKPoint Start;
-		float StartY;
+		SKPoint End;
-		float EndX;
+		SKColorF Color;
-		float EndY;
-		float ColorR;
-		float ColorG;
-		float ColorB;
-		float ColorA;
 		SKShader? shader = null;
 		public override void SetupProperties(Engine engine)
 		{
@@ -48,15 +44,19 @@ namespace Progrart.Core.Graphics
 				{
 					if (__object.Get("Start") is JsObject Start)
 					{
-						StartX = (float)Start.Get("x").AsNumber();
+						this.Start = ProgrartConversion.ObtainSKPointFromJsObject(Start);
-						StartY = (float)Start.Get("y").AsNumber();
 					}
 				}
 				{
 					if (__object.Get("End") is JsObject End)
 					{
-						EndX = (float)End.Get("x").AsNumber();
+						this.End = ProgrartConversion.ObtainSKPointFromJsObject(End);
-						EndY = (float)End.Get("y").AsNumber();
+					}
+				}
+				{
+					if (__object.Get("Color") is JsObject Color)
+					{
+						this.Color = ProgrartConversion.ObtainSKColorFFromJsObject(Color);
 					}
 				}
 
@@ -67,17 +67,20 @@ namespace Progrart.Core.Graphics
 		public override void Render(RenderContext context)
 		{
 			base.Render(context);
+			LoadProperties();
+			SKPoint FinalStartPos = context.TranslatePoint(Start);
+			SKPoint FinalEndPos = context.TranslatePoint(End);
+			Trace.WriteLine($"Draw Line from {FinalStartPos} to {FinalEndPos} using {Color} with size of {Size}.");
 			context.DrawingCore.canvas.DrawLine(
-				context.TranslatePoint((float)StartX, (float)StartY),
+				FinalStartPos,
-				context.TranslatePoint((float)EndX, (float)EndY),
+				FinalEndPos,
 				new SKPaint()
 				{
-					ColorF = new SKColorF(ColorR, ColorG, ColorB, ColorA),
+					ColorF = Color,
 					StrokeWidth = Size,
 					Shader = shader
 				}
 			);
-
 		}
 	}
 }

Progrart.Core/Graphics/Rectangle.cs

@@ -0,0 +1,7 @@
+namespace Progrart.Core.Graphics
+{
+    public class Rectangle : BaseElement
+	{
+
+	}
+}

Progrart.Core/Graphics/VisualRoot.cs

@@ -5,6 +5,14 @@ namespace Progrart.Core.Graphics
 {
 	public class ImageRoot : BaseElement
 	{
+		public override void Render(RenderContext context)
+		{
+			base.Render(context);
+			foreach (var item in Children)
+			{
+				item.Render(context);
+			}
+		}
 	}
 	public class VisualRoot : BaseElement
 	{
@@ -18,11 +26,13 @@ namespace Progrart.Core.Graphics
 		{
 			context.canvas.Translate(tx, ty);
 			context.canvas.RotateDegrees(rotate, context.DrawingCore.Width / 2, context.DrawingCore.Height / 2);
+			if (scale != 1)
 				context.canvas.Scale(scale, scale, context.DrawingCore.Width / 2, context.DrawingCore.Height / 2);
 		}
 		void Untransform(RenderContext context)
 		{
-			context.canvas.Scale(scale, scale, context.DrawingCore.Width / 2, context.DrawingCore.Height / 2);
+			if (scale != 1)
+				context.canvas.Scale(1 / scale, 1 / scale, context.DrawingCore.Width / 2, context.DrawingCore.Height / 2);
 			context.canvas.RotateDegrees(rotate, context.DrawingCore.Width / 2, context.DrawingCore.Height / 2);
 			context.canvas.Translate(-tx, -ty);
 		}
@@ -41,7 +51,7 @@ namespace Progrart.Core.Graphics
 				scale = (float)__object.Get("scale").AsNumber();
 			}
 			{
-				scale = (float)__object.Get("rotation").AsNumber();
+				rotate = (float)__object.Get("rotation").AsNumber();
 			}
 			w = (float)__object.Get("width").AsNumber();
 			h = (float)__object.Get("height").AsNumber();

Progrart.Core/JSExecution/ProgrartConversion.cs

@@ -10,6 +10,10 @@ namespace Progrart.Core.JSExecution
 {
 	public static class ProgrartConversion
 	{
+		public static SKPoint ObtainSKPointFromJsObject(JsObject jsObject)
+		{
+			return new SKPoint((float)jsObject.Get("x").AsNumber(), (float)jsObject.Get("y").AsNumber());
+		}
 		public static SKColorF ObtainSKColorFFromJsObject(JsObject jsObject)
 		{
 			var r = (float)jsObject.Get("r").AsNumber();

Progrart.Core/JSExecution/ProgrartExecutor.cs

@@ -1,6 +1,7 @@
 using Jint;
 using Jint.Native;
 using Jint.Native.Function;
+using Jint.Native.Json;
 using Progrart.Core.Graphics;
 using System.Diagnostics;
 using System.Text.Json;
@@ -62,28 +63,26 @@ namespace Progrart.Core.JSExecution
 		}
 		public RenderContext RenderImage(int Scale, string script, ExecuteArguments arguments)
 		{
-			int width = 1;
+			float width = 1;
-			int height = 1;
+			float height = 1;
-			foreach (var item in arguments.data)
+			engine.Symbols = arguments.data;
-			{
+			engine.Execute(script);
-				engine.Engine.SetValue(item.Key, item.Value);
-			}
 			if (engine.Engine.GetValue("Width") is JsNumber js_width)
 			{
-				width = (int)(js_width.AsNumber());
+				width = (float)(js_width.AsNumber());
 			}
 			if (engine.Engine.GetValue("Height") is JsNumber js_height)
 			{
-				height = (int)(js_height.AsNumber());
+				height = (float)(js_height.AsNumber());
 			}
-			RenderContext renderContext = new RenderContext(width * Scale, width * Scale);
+			RenderContext renderContext = new RenderContext((int)(width * Scale), (int)(width * Scale));
 			ImageRoot imageRoot = new ImageRoot();
 
-			engine.Execute(script);
 			var img = engine.Engine.Call("main");
 			if (ObjectPool[$"{img.Get("id")}"] is BaseElement element)
 				imageRoot.Add(element);
 			imageRoot.Render(renderContext);
+			renderContext.canvas.Flush();
 			return renderContext;
 		}
 		public string RegisterObject(object obj)
@@ -92,8 +91,8 @@ namespace Progrart.Core.JSExecution
 			ObjectPool[v] = obj;
 			return v;
 		}
-		public JsObject linear_gradient()=>ProgrartFunctions.linear_gradient(engine.Engine);
+		public JsObject linear_gradient() => ProgrartFunctions.linear_gradient(engine.Engine);
-		public JsObject radial_gradient()=>ProgrartFunctions.radial_gradient(engine.Engine);
+		public JsObject radial_gradient() => ProgrartFunctions.radial_gradient(engine.Engine);
 		public void Dispose()
 		{
 			engine.Dispose();

Progrart.Core/JSExecution/ProgrartFunctions.cs

@@ -112,10 +112,10 @@ namespace Progrart.Core.JSExecution
 		}
 		public static JsObject CreateLine(ProgrartExecutor executor)
 		{
-			Line root = new();
+			Line element = new();
-			var obj = WrapObject(executor, executor.RegisterObject(root));
+			var obj = WrapObject(executor, executor.RegisterObject(element));
-			root.__object = obj;
+			element.__object = obj;
-			root.SetupProperties(executor.engine.Engine);
+			element.SetupProperties(executor.engine.Engine);
 			return obj;
 		}
 	}

Progrart.Core/RenderContext.cs

@@ -1,4 +1,5 @@
 using SkiaSharp;
+using System.Diagnostics;
 
 namespace Progrart.Core
 {
@@ -15,6 +16,10 @@ namespace Progrart.Core
 		{
 			return new SKPoint(x * DrawingCore.Width, y * DrawingCore.Height);
 		}
+		public SKPoint TranslatePoint(SKPoint point)
+		{
+			return TranslatePoint(point.X, point.Y);
+		}
 		public RenderContext(int W, int H)
 		{
 			DrawingCore = new PrimitiveDrawingCore(W, H);
@@ -32,10 +37,11 @@ namespace Progrart.Core
 		{
 			Width = W;
 			Height = H;
+			Trace.WriteLine($"Createing Surface as: {W} x {H}");
 			info = new SKImageInfo(W, H);
 			surface = SKSurface.Create(info);
 			canvas = surface.Canvas;
-
+			canvas.Clear();
 		}
 		public SKData ToData()
 		{

Progrart/Pages/ProgrartEditorPage.axaml.cs

@@ -40,11 +40,25 @@ public partial class ProgrartEditorPage : UserControl, ITabPage, IEditorPage
 		using ProgrartExecutor executor = new ProgrartExecutor();
 		try
 		{
-			var result = executor.RenderImage(100, CodeEditor.Text, new ExecuteArguments());
+			int Scale = 1024;
+			if (args is not null)
+			{
+				if (args.data.TryGetValue("Scale", out var scale))
+				{
+					if (!int.TryParse(scale, out Scale)) Scale = 1024;
+				}
+			}
+			var result = executor.RenderImage(1024, CodeEditor.Text, args ?? new ExecuteArguments());
 			var data = result.DrawingCore.ToData();
-			using MemoryStream stream = new MemoryStream();
+			var imgFile = Path.GetTempFileName();
+			Trace.WriteLine($"Generated to:{imgFile}");
+			using (var stream = File.OpenWrite(imgFile))
+			{
 				data.SaveTo(stream);
-			Bitmap image = new Bitmap(stream);
+				stream.Flush();
+				stream.Close();
+			}
+			Bitmap image = new Bitmap(imgFile);
 			PreviewImage.SetImage(image);
 		}
 		catch (System.Exception e)
@@ -84,6 +98,18 @@ public partial class ProgrartEditorPage : UserControl, ITabPage, IEditorPage
 
 	public void Save()
 	{
+		if (file is not null)
+		{
+			string content = CodeEditor.Text;
+			Task.Run(async () =>
+			{
+				using var stream = await file.OpenWriteAsync();
+				stream.SetLength(0);
+				using var sw = new StreamWriter(stream);
+				await sw.WriteAsync(content);
+				await sw.FlushAsync();
+			});
+		}
 	}
 
 	public void SetHost(TabHost host)

Progrart/Views/MainView.axaml

@@ -116,7 +116,7 @@
 										</Viewbox>
 									</Button>
 									<Border Margin="4,6" Width="1" Background="#8888"></Border>
-									<Button Name="SaveButton">
+									<Button Name="SaveButton" Click="SaveButton_Click">
 										<PathIcon Foreground="#2288EE" Data="F1 M 3 6.799999 C 3 6.240001 3.193333 5.766666 3.58 5.379999 C 3.966666 4.993332 4.44 4.799999 5 4.799999 L 13.36 4.799999 C 13.92 4.799999 14.4 5 14.799999 5.4 L 16.4 7 C 16.799999 7.4 17 7.879999 17 8.44 L 17 16.799999 C 17 17.360001 16.806667 17.833332 16.42 18.219999 C 16.033333 18.606667 15.559999 18.799999 15 18.799999 L 5 18.799999 C 4.44 18.799999 3.966666 18.606667 3.58 18.219999 C 3.193333 17.833332 3 17.360001 3 16.799999 Z M 5 5.799999 C 4.733333 5.799999 4.5 5.9 4.3 6.099999 C 4.1 6.3 4 6.533334 4 6.799999 L 4 16.799999 C 4 17.066666 4.1 17.299999 4.3 17.5 C 4.5 17.699999 4.733333 17.799999 5 17.799999 L 5 13.28 C 5 12.88 5.146667 12.533333 5.44 12.24 C 5.733333 11.946667 6.093333 11.799999 6.52 11.799999 L 13.52 11.799999 C 13.92 11.799999 14.266666 11.946667 14.559999 12.24 C 14.853333 12.533333 14.999999 12.893333 15 13.32 L 15 17.799999 C 15.266665 17.799999 15.499999 17.699999 15.7 17.5 C 15.9 17.299999 16 17.066666 16 16.799999 L 16 8.44 C 16 8.146667 15.906666 7.906667 15.719999 7.719999 L 14.08 6.08 C 13.893332 5.893333 13.653332 5.799999 13.36 5.799999 L 13 5.799999 L 13 8.28 C 13 8.706667 12.853333 9.066667 12.559999 9.36 C 12.266665 9.653334 11.906666 9.799999 11.48 9.799999 L 7.52 9.799999 C 7.093333 9.799999 6.733333 9.653334 6.44 9.36 C 6.146667 9.066667 6 8.706667 6 8.28 L 6 5.799999 Z M 7 5.799999 L 7 8.28 C 7 8.440001 7.046667 8.566667 7.14 8.66 C 7.233333 8.753333 7.346666 8.799999 7.48 8.799999 L 11.52 8.799999 C 11.653333 8.799999 11.766666 8.753333 11.86 8.66 C 11.953333 8.566667 12 8.453333 12 8.32 L 12 5.799999 Z M 14 17.799999 L 14 13.28 C 14 13.146667 13.953333 13.033333 13.86 12.94 C 13.766665 12.846666 13.653332 12.799999 13.52 12.799999 L 6.52 12.799999 C 6.36 12.799999 6.233333 12.846666 6.14 12.94 C 6.046666 13.033333 6 13.146667 6 13.28 L 6 17.799999 Z " VerticalAlignment="Center" HorizontalAlignment="Center" />
 									</Button>
 									<Button Name="SaveAsButton">

Progrart/Views/MainView.axaml.cs

@@ -2,6 +2,7 @@ using Avalonia.Controls;
 using Avalonia.Platform.Storage;
 using Avalonia.Threading;
 using Progrart.Controls;
+using Progrart.Core;
 using Progrart.Core.JSExecution;
 using Progrart.Pages;
 using System;
@@ -79,7 +80,10 @@ public partial class MainView : UserControl
 		{
 			if (MainTabHost.GetCurrentPage() is IEditorPage editor)
 			{
-				editor.Execute(null);
+				ExecuteArguments args = new ExecuteArguments();
+				args.data["Scale"] = $"{SizeBox.Value}";
+				args.data["Debug"] = $"{IsDebugBox.IsChecked ?? false}".ToLower();
+				editor.Execute(args);
 			}
 		};
 	}
@@ -93,13 +97,6 @@ public partial class MainView : UserControl
 	{
 		Dispatcher.UIThread.Invoke(() =>
 		Output.Text += message);
-		try
-		{
-			Output.Text += message;
-		}
-		catch (Exception)
-		{
-		}
 	}
 	public void WriteLine(string message)
 	{
@@ -107,12 +104,6 @@ public partial class MainView : UserControl
 		{
 			Output.Text += $"{message}\n";
 		});
-		try
-		{
-		}
-		catch (Exception)
-		{
-		}
 	}
 	private class ConsoleLogger : TraceListener
 	{
@@ -126,4 +117,12 @@ public partial class MainView : UserControl
 			Instance?.WriteLine(message ?? "");
 		}
 	}
+
+	private void SaveButton_Click(object? sender, Avalonia.Interactivity.RoutedEventArgs e)
+	{
+		if (MainTabHost.GetCurrentPage() is IEditorPage editor)
+		{
+			editor.Save();
+		}
+	}
 }