sander/matrepl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed performance problem on resize

Browse source
This commit is contained in:
Sander Hautvast 2021-02-18 20:38:06 +01:00
parent bbbdacede0
commit 1ef889af68
2 changed files with 19 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/js/console.js
View file

@ -1,6 +1,6 @@
import {scan, token_types} from './scanner';
import {parse} from './parser';
import {remove_vector, update_vector_arrow, add_vector_to_group} from "./index";
import {add_vector_to_group, remove_vector, update_vector_arrow, vectors} from "./index";
/**
* handles user input from the console div
@ -9,15 +9,12 @@ const state = {};
const command_input_element = document.getElementById('command_input');
const command_history_element = document.getElementById('command_history');
command_input_element.value = '';
let current_object_index = 0;
let command_history = [''];
let command_history_index = 0;
export const update_lazy_objects = function () {
let lazy_objects = Object.values(state).filter(e => Object.prototype.hasOwnProperty.apply(e, ['lazy_expression']));
for (let index = 0; index < lazy_objects.length; index++) {
let object = lazy_objects[index];
lazy_objects.forEach(object => {
let value = visit_expression(object.lazy_expression);
let existing_value = state[object.binding];
if (existing_value) {
@ -32,7 +29,7 @@ export const update_lazy_objects = function () {
description = state[object.binding];
}
return {description: object.binding + ':' + description};
}
});
}
export const adjust_input_element_height = function () {
@ -82,9 +79,10 @@ command_input_element.onkeyup = function handle_key_input(event) {
let object_wrapper = result.value;
if (object_wrapper.object.is_vector) {
if (object_wrapper.previous){
if (object_wrapper.previous) {
update_vector_arrow(object_wrapper.previous.id, object_wrapper.object);
} else {
vectors.push(result.value.object);
add_vector_to_group(result.value.object);
}
}
@ -108,7 +106,7 @@ export let visit_expression = function (expr) {
case 'declaration': {
let value = visit_expression(expr.initializer);
value.binding = expr.var_name.value;
if (value.binding in state){
if (value.binding in state) {
value.previous = state[value.binding].object;
}
state[value.binding] = value;
@ -245,7 +243,7 @@ const addition = function (left, right) {
}
export const create_vector = function (vector) { //rename to create_vector
vector.id = current_object_index++;
vector.id = vectors.length;
vector.add = (other) => create_vector({
x0: vector.x0 + other.x0,
y0: vector.x0 + other.x0,

24
src/js/index.js
View file

@ -8,7 +8,7 @@ import {update_lazy_objects} from "./console";
const SVG_NS = 'http://www.w3.org/2000/svg'; // program needs these to create svg elements
let grid_size = 100; // this is the nr of pixels for the basis vector (1,0) (0,1)
let half_grid_size = grid_size >> 1; // used to position the grid lines
let vectors = []; // collection of added vectors // maybe move to console.js
export let vectors = []; // collection of added vectors // maybe move to console.js
let moving_vector; // user can move vector arrows. when moving, this refers to the arrow
let width = window.innerWidth, height = window.innerHeight;
let origin_x = Math.floor((width / grid_size) / 2) * grid_size + half_grid_size,
@ -185,7 +185,7 @@ const move_vector = function (event) {
* }
*/
const draw_vectors = function () {
const vector_group = create_vector_group();
const vector_group = get_or_create_vector_group();
for (let i = 0; i < vectors.length; i++) {
add_vector_to_group(vectors[i]);
@ -194,13 +194,7 @@ const draw_vectors = function () {
}
export const add_vector_to_group = function (vector) {
vectors.push(vector);
vector.is_visible = true;
let vector_group = document.getElementById('vectors');
if (vector_group === null || vector_group === undefined) {
vector_group = create_vector_group();
}
let vector_group = get_or_create_vector_group();
let vector_arrow = arrow(vector.id, vector.x0, vector.y0, vector.x, vector.y, 'vector');
vector_arrow.onmousedown = function start_moving_vector(event) {
moving_vector = event.target;
@ -209,10 +203,14 @@ export const add_vector_to_group = function (vector) {
vector_group.appendChild(vector_arrow);
}
const create_vector_group = function () {
const vector_group = create("g");
vector_group.id = 'vectors';
const get_or_create_vector_group = function () {
let vector_group = document.getElementById('vectors');
if (vector_group === null || vector_group === undefined) {
vector_group = create("g");
svg.appendChild(vector_group);
vector_group.id = 'vectors';
}
return vector_group;
}
@ -296,4 +294,4 @@ const svg = create_svg();
document.body.appendChild(svg);
svg.appendChild(create_grid('grid', 'bg-grid'));
svg.appendChild(create_axes());
create_vector_group();
get_or_create_vector_group();