128 lines
4.3 KiB
JavaScript
128 lines
4.3 KiB
JavaScript
/////////////////////////////
|
|
// Main game
|
|
|
|
var game = new Phaser.Game(1000, 800, Phaser.CANVAS, "RoundRectButton",
|
|
{preload:preload, create:create, update:update, render:render}
|
|
);
|
|
|
|
var textAlign, textAlign2;
|
|
|
|
function preload() {
|
|
// game.load.image('phaser', '../../resources/image/phaser.png');
|
|
// game.load.spritesheet('button', './image/button_basic.png', 200, 100);
|
|
}
|
|
|
|
function create() {
|
|
// var i = game.add.image(game.world.centerX, game.world.centerY + 70, 'phaser');
|
|
// i.anchor.set(0.5);
|
|
game.stage.backgroundColor = '#4d4d4d';
|
|
graphics = game.add.graphics(0, 0);
|
|
|
|
printHowToPlay(
|
|
"가나다라마바사 아자차카타파하 \n \
|
|
가나다라마바사 아자차카타파하"
|
|
);
|
|
|
|
SetBounds();
|
|
|
|
game.input.onDown.add(changeAlign, this);
|
|
}
|
|
|
|
function SetBounds() {
|
|
this.BOTTOM_BAR_HEIGHT = 50;
|
|
this.BOTTOM_BAR_NAME_WIDTH = 200;
|
|
this.BOTTOM_BAR_TEXT_OFFSET = 10;
|
|
|
|
this.bottomAreaPositionY = game.world.height - this.BOTTOM_BAR_HEIGHT;
|
|
|
|
let style = { font: "32px Arial", fill: "#fff", align: "left", boundsAlignH: "left", boundsAlignV: "bottom" };
|
|
|
|
let posX = this.BOTTOM_BAR_TEXT_OFFSET;
|
|
this.leftText = game.add.text(posX, this.bottomAreaPositionY, "왼쪽", style)
|
|
.setTextBounds(0, 0, this.BOTTOM_BAR_NAME_WIDTH, this.BOTTOM_BAR_HEIGHT)
|
|
.addColor('#ffffff', 0);
|
|
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
|
|
this.leftText.stroke = "#333";
|
|
this.leftText.strokeThickness = 5;
|
|
|
|
// let style = { font: "32px Arial", fill: "#fff", align: "center", boundsAlignH: "center", boundsAlignV: "bottom" };
|
|
style.align = "center";
|
|
style.boundsAlignH = "center";
|
|
posX = game.world.width / 2 - this.BOTTOM_BAR_NAME_OFFSET_RIGHT;
|
|
this.centerText = game.add.text(0, this.bottomAreaPositionY, "중간", style)
|
|
.setTextBounds(0, 0, game.world.width, this.BOTTOM_BAR_HEIGHT)
|
|
.addColor('#ffffff', 0);
|
|
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
|
|
|
|
// let style = { font: "32px Arial", fill: "#fff", align: "right", boundsAlignH: "right", boundsAlignV: "bottom" };
|
|
|
|
style.align = "right";
|
|
style.boundsAlignH = "right";
|
|
posX = game.world.width - this.BOTTOM_BAR_NAME_WIDTH - this.BOTTOM_BAR_TEXT_OFFSET;
|
|
this.rightText = game.add.text(posX, this.bottomAreaPositionY, "오른쪽", style)
|
|
.setTextBounds(0, 0, this.BOTTOM_BAR_NAME_WIDTH, this.BOTTOM_BAR_HEIGHT)
|
|
.addColor('#ffffff', 0);
|
|
// .setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
|
|
}
|
|
|
|
function changeAlign() {
|
|
console.log("print dummy");
|
|
|
|
|
|
textAlign.text = "가나다라마바사 아자차카타파하 \n \
|
|
가나다라마바사 아자차카타파하";
|
|
|
|
// textAlign2.text = "가나다라마바사 아자차카타파하 \n \
|
|
// 가나다라마바사 아자차카타파하";
|
|
}
|
|
|
|
function printHowToPlay(text) {
|
|
const style_origin = { font: "32px Arial", fill: "#fff", align: "left", boundsAlignH: "center", boundsAlignV: "middle" };
|
|
let howToPlayText = game.add.text(0, 0, text, style_origin);
|
|
howToPlayText.setTextBounds(100, 100, game.world.width - 200, 200);
|
|
howToPlayText.stroke = "#333";
|
|
howToPlayText.strokeThickness = 5;
|
|
|
|
|
|
var ipsum = "Click to change alignment\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Quid ergo aliud intellegetur nisi uti ne quae pars naturae neglegatur?\n\nSi longus, levis; Ita relinquet duas, de quibus etiam atque etiam consideret. Optime, inquam. Sed quanta sit alias, nunc tantum possitne esse tanta.\n\nQuid, si etiam iucunda memoria est praeteritorum malorum?";
|
|
|
|
var style = { font: "16px Arial", fill: "#fff",
|
|
align: "right", // the alignment of the text is independent of the bounds, try changing to 'center' or 'right'
|
|
boundsAlignH: "right",
|
|
boundsAlignV: "top",
|
|
wordWrap: true, wordWrapWidth: 300 };
|
|
|
|
textAlign = game.add.text(600, 100,ipsum, style);
|
|
|
|
// textAlign.setTextBounds(16, 16, 768, 568);
|
|
textAlign.stroke = "#333333";
|
|
textAlign.strokeThickness = 5;
|
|
|
|
|
|
/*
|
|
textAlign2 = game.add.text(200, 300, ipsum, style);
|
|
|
|
// Center align
|
|
// textAlign2.anchor.set(0.5);
|
|
// textAlign2.align = 'right';
|
|
// textAlign2.setTextBounds(16, 216, 368, 768);
|
|
|
|
// Font style
|
|
// textAlign2.font = 'Arial Black';
|
|
// textAlign2.fontSize = 50;
|
|
// textAlign2.fontWeight = 'bold';
|
|
|
|
// Stroke color and thickness
|
|
textAlign2.stroke = '#000000';
|
|
textAlign2.strokeThickness = 5;
|
|
// textAlign2.fill = '#43d637';
|
|
*/
|
|
}
|
|
|
|
|
|
function update() {
|
|
}
|
|
|
|
function render() {
|
|
}
|