mascully/improcket
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add logo to main menu

Browse source
This commit is contained in:
asraelite 2018-03-02 19:37:24 +00:00
parent cfe9c55c9a
commit 435b24cb6a
15 changed files with 135 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

1
js/gui/button.mjs
View file

@ -4,5 +4,6 @@ export class GuiButton extends gui.GuiElement {
constructor(x, y, text, onclick) {
let textSize = gui.measureText(text, 'Arial 14pt');
super(x, y, ...textSize);
this.type = 'button';
}
}

22
js/gui/element.mjs
View file

@ -3,7 +3,7 @@ const defaultOptions = {
}
export default class GuiElement {
constructor(x, y, w, h, options) {
constructor(x, y, w, h, options = {}) {
this.x = x;
this.y = y;
this.w = w;
@ -11,7 +11,9 @@ export default class GuiElement {
this.children = new Set();
this.parent = null;
this.options = Object.assign(options, defaultOptions);
this.type = 'element';
this.options = Object.assign({}, defaultOptions, options);
}
append(element) {
@ -22,4 +24,20 @@ export default class GuiElement {
clear() {
this.children.clear();
}
get shape() {
return [this.x, this.y, this.w, this.h];
}
posRelative({x = null, xc = 0, y = null, yc = 0, w = null, h = null}) {
if (x !== null) {
this.x = (this.parent.w * x) - (this.w * xc);
}
if (y !== null)
this.y = (this.parent.h * y) - (this.h * yc);
if (w !== null)
this.w = this.parent.w * w;
if (h !== null)
this.h = this.parent.h * h;
}
}

1
js/gui/frame.mjs
View file

@ -4,5 +4,6 @@ import GuiElement from './element.mjs';
export default class GuiFrame extends GuiElement {
constructor(x, y, w, h, options) {
super(x, y, w, h, options);
this.type = 'frame';
}
}

26
js/gui/image.mjs Normal file
View file

@ -0,0 +1,26 @@
import * as gui from './index.mjs';
import GuiElement from './element.mjs';
export class GuiImage extends GuiElement {
constructor(src, x, y, w, h) {
w = w || src.width;
h = h || src.height;
super(x, y, w, h);
this.type = 'image';
this.image = src;
this.imgRatio = src.width / src.height;
}
scaleImage({ w = null, h = null }) {
if (w !== null && h === null) {
this.w = w;
this.h = w / this.imgRatio;
} else if (h !== null && w === null) {
this.h = h;
this.w = h / this.imgRatio;
} else if ( h !== null && w !== null) {
this.w = w;
this.h = h;
}
}
}

10
js/gui/index.mjs
View file

@ -7,7 +7,15 @@ export let root;
export function init() {
elements.clear();
root = modules.root();
console.log(root);
changeView('title');
}
export function changeView(view) {
root.clear();
if (view == 'title') {
root.append(modules.title());
}
}
export function measureText(msg, font) {

11
js/gui/misc.mjs
View file

@ -1,11 +0,0 @@
import * as gui from './index.mjs';
import GuiElement from './element.mjs';
export class GuiImage extends gui.GuiElement {
constructor(src, x, y, w, h) {
w = w || src.width;
h = h || src.height;
super(x, y, w, h);
this.image = src;
}
}

13
js/gui/modules.mjs
View file

@ -1,6 +1,8 @@
import * as gui from './index.mjs';
import {images as assets} from '../assets.mjs';
import {canvas} from '../graphics/index.mjs';
import GuiFrame from './frame.mjs';
import {GuiImage} from './image.mjs';
export function root() {
return new GuiFrame(0, 0, canvas.width, canvas.height, {
@ -8,6 +10,13 @@ export function root() {
});
}
export function titleScreen() {
export function title() {
let shadow = root();
let logo = new GuiImage(assets.title.logo);
shadow.append(logo);
logo.scaleImage({ w: shadow.w * 0.7 });
logo.posRelative({ x: 0.5, xc: 0.5, y: 0.2 });
console.log(logo);
return shadow;
}