Commit 9ac8e6c9 authored by Christian Winter's avatar Christian Winter

general rework. wip

parent ca7f708d
...@@ -55,9 +55,9 @@ ...@@ -55,9 +55,9 @@
<script src="scripts/managers/GUI.js"></script> <script src="scripts/managers/GUI.js"></script>
<script src="scripts/saving/Exporter.js"></script> <script src="scripts/saving/Exporter.js"></script>
<script src="scripts/Color.js"></script>
<script src="scripts/Settings.js"></script> <script src="scripts/Settings.js"></script>
<script src="scripts/LineManipulator.js"></script> <script src="scripts/LineManipulator.js"></script>
<script src="scripts/Color.js"></script>
<script src="scripts/managers/Logic.js"></script> <script src="scripts/managers/Logic.js"></script>
<script src="scripts/managers/Selection.js"></script> <script src="scripts/managers/Selection.js"></script>
...@@ -74,8 +74,9 @@ ...@@ -74,8 +74,9 @@
<script src="scripts/Application.js"></script> <script src="scripts/Application.js"></script>
<script> <script>
var Application;
function onLoad() { function onLoad() {
var App = new Application(); Application = new App();
} }
</script> </script>
......
class Application { class App {
constructor() { constructor() {
console.log("Application.constructor()"); console.log("Application.constructor()");
this.initializeClasses();
this.currentState; // Drawing, EditingPrefab this.currentState; // Drawing, EditingPrefab
this.views = []; this.views = [];
this.currentView = new View(); this.currentView = new View();
this.initializeClasses();
window.addEventListener("keydown", evt => Input.keyDown(evt), false); window.addEventListener("keydown", evt => Input.keyDown(evt), false);
window.addEventListener("keyup", evt => Input.keyUp(evt), false); window.addEventListener("keyup", evt => Input.keyUp(evt), false);
GUI.genereateGridSettings(); GUI.genereateGridSettings();
Logic.start(); Logic.start();
Renderer.setContext(this.currentView.context);
} }
initializeClasses() { initializeClasses() {
GUI.init(); GUI.init();
Preferences.init(); Preferences.init();
//Key.init();
Input.init(); Input.init();
MouseHandler.init(); MouseHandler.init();
Logic.init(); Logic.init();
Saver.init(); Saver.init();
File.init(); File.init();
//Camera.init();
Renderer.init(); Renderer.init();
RenderManager.init(); RenderManager.init();
Exporter.init();
Settings.init();
Selection.init(); Selection.init();
GridManager.init(); GridManager.init();
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
GUI.buildPrefabUI(); GUI.buildPrefabUI();
Camera.resetView(); Application.currentView.camera.resetView();
} }
static createNewPrefabFromSelection() { static createNewPrefabFromSelection() {
......
// TODO check which variables are not used and remove them // TODO check which variables are not used and remove them
class Settings { Settings = new class {
static init() { constructor() {
this.emblemRed = new Color(124, 0, 0, 1);//'#7c0000'; this.emblemRed = new Color(124, 0, 0, 1);//'#7c0000';
this.artBoundsLineWidth = 2; this.artBoundsLineWidth = 2;
......
class View { class View {
constructor() { constructor() {
// canvas
this.canvas = document.getElementById('canvas'); this.canvas = document.getElementById('canvas');
this.canvas.contentEditable = true; // to make canvas.focus() working this.canvas.contentEditable = true; // to make canvas.focus() working
...@@ -13,7 +14,7 @@ ...@@ -13,7 +14,7 @@
this.canvas.style.background = Settings.canvasColor; this.canvas.style.background = Settings.canvasColor;
// context
this.context = this.canvas.getContext('2d'); this.context = this.canvas.getContext('2d');
this.camera = new Camera(this); this.camera = new Camera(this);
...@@ -22,7 +23,9 @@ ...@@ -22,7 +23,9 @@
// this.uiButtons = []; // this.uiButtons = [];
// this.uiButtonPanel= []; // this.uiButtonPanel= [];
Renderer.setContext(this.context); // renderer
// this.renderer = new Renderer();
// this.renderer.setContext(this.context);
} }
// onmouseenter // onmouseenter
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
} }
drawGrid() { drawGrid() {
let bounds = Camera.getVisibleBounds(); let bounds = Application.currentView.camera.getVisibleBounds();
let min = new Vector2(bounds.left, bounds.top); let min = new Vector2(bounds.left, bounds.top);
let max = new Vector2(bounds.right, bounds.bottom); let max = new Vector2(bounds.right, bounds.bottom);
let sMin = this.getNearestPointFor(min); let sMin = this.getNearestPointFor(min);
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
} }
drawGrid() { drawGrid() {
let bounds = Camera.getVisibleBounds(); let bounds = Application.currentView.camera.getVisibleBounds();
let min = new Vector2(bounds.left, bounds.top); let min = new Vector2(bounds.left, bounds.top);
let max = new Vector2(bounds.right, bounds.bottom); let max = new Vector2(bounds.right, bounds.bottom);
let minMax = new Vector2(bounds.left, bounds.bottom); let minMax = new Vector2(bounds.left, bounds.bottom);
......
class Key { Key = new class {
static init() { constructor() {
this.A = 65; this.A = 65;
this.B = 66; this.B = 66;
this.C = 67; this.C = 67;
......
...@@ -6,7 +6,7 @@ class MouseHandler { ...@@ -6,7 +6,7 @@ class MouseHandler {
this.processingWaitingState = false; this.processingWaitingState = false;
this.mouseMovedAfterMouseDown = false; this.mouseMovedAfterMouseDown = false;
waitingForStart.push(this); //waitingForStart.push(this);
} }
static start() { static start() {
...@@ -58,7 +58,7 @@ class MouseHandler { ...@@ -58,7 +58,7 @@ class MouseHandler {
} }
} }
//GUI.writeToStats("Camera.canvasOffset", Camera.canvasOffset.toString()); //GUI.writeToStats("Application.currentView.camera.canvasOffset", Application.currentView.camera.canvasOffset.toString());
this.oldPosScreenSpace = newPosScreenSpace; this.oldPosScreenSpace = newPosScreenSpace;
Renderer.redraw(); Renderer.redraw();
} }
...@@ -391,9 +391,9 @@ class MouseHandler { ...@@ -391,9 +391,9 @@ class MouseHandler {
} }
else if (!e.shiftKey && !e.ctrlKey) { else if (!e.shiftKey && !e.ctrlKey) {
if (e.deltaY < 0) // upscroll if (e.deltaY < 0) // upscroll
Camera.multiplyZoomBy(1.1, true); Application.currentView.camera.multiplyZoomBy(1.1, true);
else if (e.deltaY > 0) else if (e.deltaY > 0)
Camera.multiplyZoomBy(0.9, true); Application.currentView.camera.multiplyZoomBy(0.9, true);
this.mouseMove(e); this.mouseMove(e);
} }
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
this.canvasOffset = new Vector2(0, 0); this.canvasOffset = new Vector2(0, 0);
// TODO better way to initialize? // TODO better way to initialize?
this.multiplyZoomBy(1, true); //this.multiplyZoomBy(1, true);
} }
multiplyZoomBy(delta, keepCenter) multiplyZoomBy(delta, keepCenter)
...@@ -38,7 +38,6 @@ ...@@ -38,7 +38,6 @@
if (keepCenter) if (keepCenter)
this.pushCameraCenter(); this.pushCameraCenter();
console.log(this)
this.zoom = Math.min(this.maxZoom, Math.max(this.minZoom, val)); this.zoom = Math.min(this.maxZoom, Math.max(this.minZoom, val));
if (keepCenter) if (keepCenter)
......
var pivot = new Vector2(0, 0); var pivot = new Vector2(0, 0);
var canvas;
var context;
var offscreenCanvas; var offscreenCanvas;
var offscreenContext; var offscreenContext;
...@@ -34,7 +32,7 @@ function onLoad() { ...@@ -34,7 +32,7 @@ function onLoad() {
Logic.init(); Logic.init();
Saver.init(); Saver.init();
File.init(); File.init();
Camera.init(); Application.currentView.camera.init();
Renderer.init(); Renderer.init();
RenderManager.init(); RenderManager.init();
...@@ -65,12 +63,6 @@ class Logic { ...@@ -65,12 +63,6 @@ class Logic {
} }
static start() { static start() {
window.addEventListener("keydown", evt => Input.keyDown(evt), false);
window.addEventListener("keyup", evt => Input.keyUp(evt), false);
// window.addEventListener("keydown", evt => CanvasKeyHandler.KeyDown(evt), false);
// window.addEventListener("keyup", evt => CanvasKeyHandler.KeyUp(evt), false);
window.addEventListener("contextmenu", function (e) { e.preventDefault(); return false; }); window.addEventListener("contextmenu", function (e) { e.preventDefault(); return false; });
window.addEventListener('resize', this.layoutGUI, false); window.addEventListener('resize', this.layoutGUI, false);
window.addEventListener('focus', function () { window.addEventListener('focus', function () {
...@@ -89,25 +81,12 @@ class Logic { ...@@ -89,25 +81,12 @@ class Logic {
window.onerror = function () { window.onerror = function () {
if (Preferences.developerMode == true) if (Preferences.developerMode == true)
GUI.notify("<font color='red'>An error occured! Press F12 to see what went wrong.</font>"); GUI.notify("<font color='red'>An error occured! Press F12 to see what went wrong.</font>");
Logic._clearStates(); //Logic._clearStates();
}; };
canvas = document.getElementById('canvas');
canvas.contentEditable = true; // to make canvas.focus() working
context = canvas.getContext('2d');
Renderer.setContext(context);
offscreenCanvas = document.getElementById('offscreenCanvas'); offscreenCanvas = document.getElementById('offscreenCanvas');
offscreenContext = offscreenCanvas.getContext('2d'); offscreenContext = offscreenCanvas.getContext('2d');
canvas.addEventListener("mousemove", evt => MouseHandler.mouseMove(evt));
canvas.addEventListener("mouseup", evt => MouseHandler.mouseUp(evt));
canvas.addEventListener("mousedown", evt => MouseHandler.mouseDown(evt));
canvas.addEventListener("wheel", evt => MouseHandler.mouseScroll(evt));
canvas.addEventListener("mouseenter", evt => MouseHandler.canvasMouseEnter(evt));
canvas.addEventListener("mouseleave", evt => MouseHandler.canvasMouseLeave(evt));
toolbar = document.getElementById('toolbar'); toolbar = document.getElementById('toolbar');
// Setup the dnd listeners. // Setup the dnd listeners.
...@@ -115,13 +94,11 @@ class Logic { ...@@ -115,13 +94,11 @@ class Logic {
dropZone.addEventListener('dragover', Saver.handleDragOver, false); dropZone.addEventListener('dragover', Saver.handleDragOver, false);
dropZone.addEventListener('drop', Saver.handleFileSelect, false); dropZone.addEventListener('drop', Saver.handleFileSelect, false);
canvas.style.background = Settings.canvasColor;
this.layoutGUI(); this.layoutGUI();
Saver.loadAutoSave(); Saver.loadAutoSave();
File.updateStats(); File.updateStats();
Renderer.redraw();
for (var i = 0; i < waitingForStart.length; i++) { for (var i = 0; i < waitingForStart.length; i++) {
waitingForStart[i].start(); waitingForStart[i].start();
...@@ -149,14 +126,6 @@ class Logic { ...@@ -149,14 +126,6 @@ class Logic {
GUI.stats.style.left = canvas.right - 50; GUI.stats.style.left = canvas.right - 50;
// TODO magic // TODO magic
GUI.stats.style.top = GUI.menubar.offsetHeight + 75; GUI.stats.style.top = GUI.menubar.offsetHeight + 75;
/*
offscreenCanvas.width = canvas.width;
offscreenCanvas.height = canvas.height;
offscreenCanvas.style.left = canvas.width - 50;
offscreenCanvas.style.top= canvas.height - 50;
*/
Renderer.redraw();
} }
static setState(state) { static setState(state) {
......
This diff is collapsed.
class Exporter { Exporter = new class {
static init() { constructor() {
console.log("Exporter created. ");
this.renderResultWindow = null; this.renderResultWindow = null;
} }
static renderPNG() // img renderPNG() // img
{ {
let renderCanvas = document.createElement('canvas'); let renderCanvas = document.createElement('canvas');
let renderContext = renderCanvas.getContext('2d'); let renderContext = renderCanvas.getContext('2d');
...@@ -26,8 +25,8 @@ class Exporter { ...@@ -26,8 +25,8 @@ class Exporter {
this.renderResultWindow.document.write('*{margin:0;padding0;'); this.renderResultWindow.document.write('*{margin:0;padding0;');
this.renderResultWindow.document.write('</style></head>'); this.renderResultWindow.document.write('</style></head>');
// save values // save values
let prevZoom = Camera.zoom; let prevZoom = Application.currentView.camera.zoom;
let prevCanvasOffset = Camera.canvasOffset.copy(); let prevCanvasOffset = Application.currentView.camera.canvasOffset.copy();
// preparation // preparation
Logic.isRenderPreviewing = true; Logic.isRenderPreviewing = true;
...@@ -36,9 +35,9 @@ class Exporter { ...@@ -36,9 +35,9 @@ class Exporter {
offset = offset.addVector(Preferences.artBounds.size.multiply(0.5)); offset = offset.addVector(Preferences.artBounds.size.multiply(0.5));
offset = offset.subtractVector(Preferences.artBounds.origin); offset = offset.subtractVector(Preferences.artBounds.origin);
offset = offset.subtractVector((new Vector2(renderCanvas.width * 0.5, renderCanvas.height * 0.5)).divide(Preferences.renderScaleFactor)); offset = offset.subtractVector((new Vector2(renderCanvas.width * 0.5, renderCanvas.height * 0.5)).divide(Preferences.renderScaleFactor));
Camera.canvasOffset = offset; Application.currentView.camera.canvasOffset = offset;
Camera.zoom = Preferences.renderScaleFactor; Application.currentView.camera.zoom = Preferences.renderScaleFactor;
Renderer.setContext(renderContext); Renderer.setContext(renderContext);
Renderer.showCursor = false; Renderer.showCursor = false;
...@@ -48,8 +47,8 @@ class Exporter { ...@@ -48,8 +47,8 @@ class Exporter {
this.renderResultWindow.document.write("<img src='" + renderCanvas.toDataURL("image/png") + "' alt='Rendered image'/>"); this.renderResultWindow.document.write("<img src='" + renderCanvas.toDataURL("image/png") + "' alt='Rendered image'/>");
// restore // restore
Camera.zoom = prevZoom; Application.currentView.camera.zoom = prevZoom;
Camera.canvasOffset = prevCanvasOffset; Application.currentView.camera.canvasOffset = prevCanvasOffset;
Renderer.setContext(context); Renderer.setContext(context);
Renderer.showCursor = true; Renderer.showCursor = true;
Renderer.setQualitySetting(Preferences.qualitySetting); Renderer.setQualitySetting(Preferences.qualitySetting);
...@@ -60,7 +59,7 @@ class Exporter { ...@@ -60,7 +59,7 @@ class Exporter {
GUI.notify("Picture saved!"); GUI.notify("Picture saved!");
} }
static exportAsSVG() { exportAsSVG() {
var name = prompt("Save Logo as: "); var name = prompt("Save Logo as: ");
if (name) { if (name) {
...@@ -83,7 +82,7 @@ class Exporter { ...@@ -83,7 +82,7 @@ class Exporter {
return false; return false;
} }
static generateSVGString() { generateSVGString() {
PrefabManager.generateIDsForPrefabs(); PrefabManager.generateIDsForPrefabs();
let b = Preferences.artBounds; let b = Preferences.artBounds;
...@@ -126,7 +125,7 @@ class Exporter { ...@@ -126,7 +125,7 @@ class Exporter {
return svgData; return svgData;
} }
static generateSVGStringForLines(lines, indentations, dashedLines) { generateSVGStringForLines(lines, indentations, dashedLines) {
let text = ""; let text = "";
let indent = ""; let indent = "";
for (var i = 0; i < indentations; i++) { for (var i = 0; i < indentations; i++) {
...@@ -155,7 +154,7 @@ class Exporter { ...@@ -155,7 +154,7 @@ class Exporter {
} }
return text; return text;
} }
static generateSVGStringForPrefabInstances(prefabDict, indentations, dashedLines) { generateSVGStringForPrefabInstances(prefabDict, indentations, dashedLines) {
let text = ""; let text = "";
let indent = ""; let indent = "";
for (var i = 0; i < indentations; i++) { for (var i = 0; i < indentations; i++) {
...@@ -203,7 +202,7 @@ class Exporter { ...@@ -203,7 +202,7 @@ class Exporter {
return text; return text;
} }
static generateSVGStringForPrefabs(indentations) { generateSVGStringForPrefabs(indentations) {
let text = ""; let text = "";
let indent = ""; let indent = "";
for (var i = 0; i < indentations; i++) { for (var i = 0; i < indentations; i++) {
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
else if (!Input.isKeyDown(Key.Control) && !Input.isKeyDown(Key.Shift)) else if (!Input.isKeyDown(Key.Control) && !Input.isKeyDown(Key.Shift))
Logic.setState(new BrushSelectionState()); Logic.setState(new BrushSelectionState());
else if (Input.isKeyDown(Key.Shift)) { else if (Input.isKeyDown(Key.Shift)) {
Camera.resetView(); Application.currentView.camera.resetView();
} }
break; break;
case Key.V: case Key.V:
...@@ -97,7 +97,7 @@ ...@@ -97,7 +97,7 @@
if (Input.isKeyDown(Key.Control)) if (Input.isKeyDown(Key.Control))
Exporter.renderPNG(); Exporter.renderPNG();
break; break;
case Key.F: // F // TODO improve. Camera.zoom to selection / Camera.zoom fit / etc ... case Key.F: // F // TODO improve. Application.currentView.camera.zoom to selection / Application.currentView.camera.zoom fit / etc ...
Utilities.fill(Selection.getAllSelectedPoints()); Utilities.fill(Selection.getAllSelectedPoints());
break; break;
...@@ -106,13 +106,13 @@ ...@@ -106,13 +106,13 @@
let size = Preferences.artBounds.size; let size = Preferences.artBounds.size;
let x = canvas.width / size.x; let x = canvas.width / size.x;
let y = canvas.height / size.y; let y = canvas.height / size.y;
Camera.setZoom(Math.min(x, y), false); Application.currentView.camera.setZoom(Math.min(x, y), false);
// margin // margin
Camera.zoomBy(-0.1 * Camera.zoom, false); Application.currentView.camera.zoomBy(-0.1 * Application.currentView.camera.zoom, false);
// TODO maybe better way to do it? with less calls? // TODO maybe better way to do it? with less calls?
Camera.canvasOffset = (new Vector2(canvas.width * 0.5, canvas.height * 0.5)).divide(Camera.zoom).subtractVector(Preferences.artBounds.origin.addVector(Preferences.artBounds.size.multiply(0.5))); Application.currentView.camera.canvasOffset = (new Vector2(canvas.width * 0.5, canvas.height * 0.5)).divide(Application.currentView.camera.zoom).subtractVector(Preferences.artBounds.origin.addVector(Preferences.artBounds.size.multiply(0.5)));
Renderer.redraw(); Renderer.redraw();
break; break;
case Key.B: // B case Key.B: // B
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
update(screenPosDelta) update(screenPosDelta)
{ {
Camera.canvasOffset = Camera.canvasOffset.addVector(screenPosDelta.divide(Camera.zoom)); Application.currentView.camera.canvasOffset = Application.currentView.camera.canvasOffset.addVector(screenPosDelta.divide(Application.currentView.camera.zoom));
Renderer.redraw(); Renderer.redraw();
} }
......
class ZoomState extends State { class ZoomState extends State {
enter() { enter() {
this.startZoom = Camera.zoom; this.startZoom = Application.currentView.camera.zoom;
this.startPosScreenSpace = Camera.canvasSpaceToScreenSpace(mousePosition); this.startPosScreenSpace = Application.currentView.camera.canvasSpaceToScreenSpace(mousePosition);
} }
exit() { exit() {
...@@ -9,11 +9,11 @@ ...@@ -9,11 +9,11 @@
update(newPosScreenSpace) { update(newPosScreenSpace) {
// TODO ctrl+mmb zoom is MAGIC // TODO ctrl+mmb zoom is MAGIC
//Camera.setZoom(this.startZoom + (newPosScreenSpace.y - this.zoomInitScreenPos.y) / canvas.height * 4, true); //Application.currentView.camera.setZoom(this.startZoom + (newPosScreenSpace.y - this.zoomInitScreenPos.y) / canvas.height * 4, true);
Camera.zoomBy( Application.currentView.camera.zoomBy(
(newPosScreenSpace.y - this.startPosScreenSpace.y) (newPosScreenSpace.y - this.startPosScreenSpace.y)
/ canvas.height / canvas.height
* Camera.zoom * Application.currentView.camera.zoom
* 4 * 4
, true); , true);
this.startPosScreenSpace = newPosScreenSpace; this.startPosScreenSpace = newPosScreenSpace;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment