beginning of pin settings
parent
65887ec926
commit
bf0e66c77c
|
@ -6,6 +6,7 @@ import { FrameHandler } from './frame_handler';
|
|||
import { IAnimationData } from './Interfaces/IAnimationData';
|
||||
import { ICanvasData } from './Interfaces/ICanvasData';
|
||||
import { IFrame } from './Interfaces/IFrame';
|
||||
import { PinHandler } from './pin_handler';
|
||||
|
||||
export class Page {
|
||||
private static handleDragOver(evt: DragEvent) {
|
||||
|
@ -16,6 +17,7 @@ export class Page {
|
|||
}
|
||||
}
|
||||
|
||||
private pinHandler: PinHandler;
|
||||
private frameHandler: FrameHandler;
|
||||
private canvasHandler: CanvasHandler;
|
||||
private animationData: IAnimationData;
|
||||
|
@ -55,6 +57,11 @@ export class Page {
|
|||
|
||||
const imageElement = new Image();
|
||||
|
||||
this.pinHandler = new PinHandler(
|
||||
document.getElementById('addpin') as HTMLElement,
|
||||
document.getElementById('pinSettings') as HTMLElement
|
||||
);
|
||||
|
||||
// setup canvas
|
||||
this.canvasHandler = new CanvasHandler(
|
||||
this.animationData,
|
||||
|
|
|
@ -0,0 +1,26 @@
|
|||
export class PinHandler {
|
||||
private addPinButton: HTMLElement;
|
||||
private pinSettingsDiv: HTMLElement;
|
||||
private pins: number = 1;
|
||||
|
||||
constructor(addPinButton: HTMLElement, pinSettingsDiv: HTMLElement) {
|
||||
this.addPinButton = addPinButton;
|
||||
this.pinSettingsDiv = pinSettingsDiv;
|
||||
this.UpdatePinSettingsDiv();
|
||||
|
||||
this.addPinButton.addEventListener('click', this.AddPinButtonPressed);
|
||||
}
|
||||
|
||||
private UpdatePinSettingsDiv() {
|
||||
let html: string = '';
|
||||
for (let i = 0; i < this.pins; i++) {
|
||||
html += '<input type="text" id="pinname' + i + '" value="pinname' + i + '">';
|
||||
}
|
||||
this.pinSettingsDiv.innerHTML = html;
|
||||
}
|
||||
|
||||
private AddPinButtonPressed() {
|
||||
this.pins += 1;
|
||||
this.UpdatePinSettingsDiv();
|
||||
}
|
||||
}
|
|
@ -21,6 +21,8 @@
|
|||
<div id="canvasStyle">
|
||||
<canvas id="canvasImage" alt=""></canvas>
|
||||
</div>
|
||||
<button id="addpin">Create New Pin</button>
|
||||
<div id="pinSettings"></div>
|
||||
<div id="settings">
|
||||
Name: <input type = "text" id="filename"><br>
|
||||
<div id = "originInfo">Click image to set Origin</div>
|
||||
|
|
Loading…
Reference in New Issue