Skip to content

Template changes - resize layout #148

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
left23 merged 13 commits into from
Jun 18, 2016
Merged

Template changes - resize layout #148

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
6a43416
plates with phaser elements and image assets
left23 Apr 1, 2016
e8d211e
delete large video files
left23 Apr 1, 2016
b49bfa8
corrected sidebar-2 on 1280 monitors, fixed width of sidebar-2, break…
left23 Apr 16, 2016
4598c9e
bonsanto new plate with phaser states, and backup of old
left23 Apr 16, 2016
114cfc9
recent plate update to add functioning index.html with relative links…
left23 Apr 16, 2016
31b0720
Merge branch 'master' of https://github.com/left23/JiGS
left23 Apr 16, 2016
b6a9a52
add a index.html for local work
left23 Apr 16, 2016
9015c5c
add animated sprite hobbit and generate to destroy on click, TODO inc…
left23 Apr 16, 2016
e6d8218
animate randomly generated hobbits, restrict their creation to bonds …
left23 Apr 16, 2016
070e0c5
more hobbits
left23 Apr 16, 2016
96a9920
animation objects change on key press left and right, walk bounds def…
left23 Apr 17, 2016
464ce12
layout changes to center main elements on wide screen and set min-wid…
left23 Jun 18, 2016
ed08671
compiled css and js from grunt task
left23 Jun 18, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 0 additions & 15 deletions .idea/deployment.xml
View file
Open in desktop

This file was deleted.

127 changes: 127 additions & 0 deletions components/com_battle/views/plate/tmpl/001_consumer/-script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
var text;
var counter = 0;
var game = new Phaser.Game(640, 480, Phaser.CANVAS, 'world', { preload: preload, create: create, update: update, render: render });
var obj001;

function preload () {
// You can fill the preloader with as many assets as your game requires
// Here we are loading an image. The first parameter is the unique
// string by which we'll identify the image later in our code.
// The second parameter is the URL of the image (relative)
game.load.image('bg', 'bg.jpg');
game.load.image('tile', 'tile.jpg');
game.load.spritesheet('fighter01',
'/components/com_battle/images/assets/chars/halflings/001-Fighter01.png',32,48,12);
game.load.atlas('sprite', 'sprite.png', 'sprite.json');
}
function create() {

// This creates a simple sprite that is using our loaded image and
// displays it on-screen and assign it to a variable
var image = game.add.sprite(game.world.centerX, game.world.centerY, 'bg');
// This simply creates a sprite using the mushroom image we loaded above and positions it at 200 x 200
obj001 = game.add.sprite(222, 327, 'sprite', 'object001');
obj002 = game.add.sprite(-27, 122, 'sprite', 'object002');
obj003 = game.add.sprite(391, 72, 'sprite', 'object003');
tile = game.add.sprite(421, 82, 'tile');
obj004 = game.add.sprite(27, 390, 'fighter01');
obj004.animations.add('left',[11,10,9],3,true);
obj004.animations.add('right',[1,2,3,],3);
obj004.animations.play('left');
// Moves the image anchor to the middle, so it centers inside the game properly
image.anchor.set(0.5);
////////////////////////////////////////////////////////////////////
// Input
/////////////////////////////////////////////////////////////////
cursors = game.input.keyboard.createCursorKeys();

game.input.addMoveCallback(p, this);

// Control Panel image click
obj001.inputEnabled = true;
text = game.add.text(20, 20, '', { fill: '#ffffff', font: "14px Arial", });
obj001.events.onInputDown.add(listener, this);
tile.name='tile';
obj004.name='obj004';
tile.inputEnabled = true;
obj004.inputEnabled = true;

tile.events.onInputOver.add(tooltip, this);
obj004.events.onInputOver.add(tooltip, this);
}

function p(pointer) {
console.log(pointer.event);
}

function listener () {
counter++;
text.text = "You clicked " + counter + " times!";
changeFrame();
}

function changeFrame() {
obj003.frameName = 'object004';
}

function tooltip(thing) {
//console.log(thing.name);
//console.log("run tooltip");
//var bar = game.add.graphics();
//bar.beginFill(0x000000, 0.2);
//bar.drawRect(thing.x - 20, thing.y - 20, 100, 30);

var style = {
font: 'bold 12px Arial', fill: 'white', align: "center", boundsAlignH: 'center', boundsAlignV: 'middle' };

var text = game.add.text(thing.x - 20, thing.y - 20, thing.name, style);

//text.setShadow(1, 1, 'rgba(0,0,0,0.5)', 2);
// We'll set the bounds to be relative to thing x and y and be 100px wide by 30px high
//text.setTextBounds(thing.x - 20, thing.y - 20, 100, 30);

}

function tooltipClear() {
text.destroy(tooltip, this);
//console.log("destroy tooltip");
}

function update() {

if (tile.input.pointerOver())
{
}
else
{
tooltipClear();
}

}


function render() {

game.debug.text("Over: " + tile.input.pointerOver(), 32, 32);
game.debug.text(game.input.mouse.locked, 320, 32);

}

/*
jQuery.ajax({

url: "/index.php?option=com_battle&format=raw&task=action&action=get_property",
success: function (result) {
alert("success");
var obj = JSON.parse(result);

var style = { font: '14px Arial', fill: 'white', align: 'left', wordWrap: true, wordWrapWidth: 400//, backgroundColor: 'rgba(44,123,200,0.5)'
};

for (var i = 0; i < obj.length; ++i) {
console.log(obj[i].name);
var text = game.add.text(20, 20*i, obj[i].name, style);
}
}
});
*/
Binary file added components/com_battle/views/plate/tmpl/001_consumer/001_0015plate.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added components/com_battle/views/plate/tmpl/001_consumer/bg.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
25 changes: 25 additions & 0 deletions components/com_battle/views/plate/tmpl/001_consumer/default.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@

<html>
<head>
<!-- Phaser -->
<script src="/components/com_battle/views/phaser/tmpl/_site/js/phaser.js"></script>
<script src="/components/com_battle/views/phaser/tmpl/_site/js/jquery-2.0.3.min.js"></script>

<style>
body {
margin: 0;
}
</style>
</head>

<body>

<div id="world">
</div>

<script src='/components/com_battle/views/plate/tmpl/001_consumer/script.js'></script>

</body>
</html>


Binary file added components/com_battle/views/plate/tmpl/001_consumer/face.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
33 changes: 33 additions & 0 deletions components/com_battle/views/plate/tmpl/001_consumer/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<html>
<head>

<script src="../../../phaser/tmpl/_site/js/jquery-2.0.3.min.js"></script>
<!-- Phaser -->
<script src="../../../phaser/tmpl/_site/js/phaser.js"></script>

<style>
body {
margin: 0;
}

#world {
position: relative;
}


</style>
</head>

<body>

<div id="world">
</div>


<script src='state01.js'></script>
<script src='script.js'></script>

</body>
</html>


Binary file added components/com_battle/views/plate/tmpl/001_consumer/marilyn.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
97 changes: 97 additions & 0 deletions components/com_battle/views/plate/tmpl/001_consumer/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
var game = new Phaser.Game(640, 480, Phaser.CANVAS, 'world', { preload: preload, create: create });
var text;
var bar;
var counter = 0;
var obj001;
var rectWidth;
var rectHeight;

function preload () {
// You can fill the preloader with as many assets as your game requires
// Here we are loading an image. The first parameter is the unique
// string by which we'll identify the image later in our code.
// The second parameter is the URL of the image (relative)
game.load.image('bg', 'bg.jpg');
game.load.image('tile', 'tile.jpg');
game.load.spritesheet('fighter01',
'/components/com_battle/images/assets/chars/halflings/001-Fighter01.png',32,48,12);
game.load.atlas('sprite', 'sprite.png', 'sprite.json');
}
function create() {


// This creates a simple sprite that is using our loaded image and
// displays it on-screen and assign it to a variable
var image = game.add.sprite(game.world.centerX, game.world.centerY, 'bg');
// This simply creates a sprite using the mushroom image we loaded above and positions it at 200 x 200
obj001 = game.add.sprite(222, 327, 'sprite', 'object001');
obj002 = game.add.sprite(-27, 122, 'sprite', 'object002');
obj003 = game.add.sprite(391, 72, 'sprite', 'object003');
tile = game.add.sprite(421, 82, 'tile');
obj004 = game.add.sprite(27, 390, 'fighter01');
obj004.animations.add('left',[11,10,9],3,true);
obj004.animations.add('right',[1,2,3,],3);
obj004.animations.play('left');
// Moves the image anchor to the middle, so it centers inside the game properly
image.anchor.set(0.5);
////////////////////////////////////////////////////////////////////
// Input
/////////////////////////////////////////////////////////////////
cursors = game.input.keyboard.createCursorKeys();
// Control Panel image click
obj001.inputEnabled = true;
//text = game.add.text(20, 20, '', { fill: '#ffffff', font: "14px Arial", });
obj001.events.onInputDown.add(listener, this);
tile.name ='tile long tooltip title';
obj004.name ='obj004';

tile.inputEnabled = true;
obj004.inputEnabled = true;

tile.events.onInputOver.add(tooltip, this);
tile.events.onInputOut.add(killTooltip, this);

obj004.events.onInputOver.add(tooltip, this);
obj004.events.onInputOut.add(killTooltip, this);

// var style = { font: "bold 32px Arial", fill: "#fff", boundsAlignH: "center", boundsAlignV: "middle" };

// The Text is positioned at 0, 100
//text = game.add.text(0, 0, "phaser 2.4 text bounds", style);
}
function listener () {
// counter++;
// text2.text = "You clicked " + counter + " times!";
//changeFrame();
}
function changeFrame() {
obj003.frameName = 'object004';
}

function tooltip(thing) {

var rectWidth = tile.name.length + 40;

///////////////////////////
//bar = game.add.graphics();
//bar.beginFill(0x000000, 0.2);
//bar.drawRect(thing.x-20, thing.y-20, rectWidth, rectHeight);

console.log(thing.name, rectWidth, typeof bar);

var style = { font: '14px Arial', fill: 'white', align: 'left', wordWrap: true };
//var style = { font: '14px Arial', fill: 'white', align: 'left', backgroundColor: 'black', boundsAlignH: "center", boundsAlignV: "middle" };
text = game.add.text(0, 0, thing.name, style);
text.padding.set(0, 0);
text.setShadow(3, 3, 'rgba(0,0,0,0.9)', 2);

text.setTextBounds(thing.x-20, thing.y-20, rectWidth, rectHeight);

}

function killTooltip(thing) {

text.destroy();
//bar.destroy();

}
36 changes: 36 additions & 0 deletions components/com_battle/views/plate/tmpl/001_consumer/sprite.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
{"frames": [

{
"filename": "title",
"frame": {"x":0,"y":0,"w":418,"h":151},
"rotated": false,
"trimmed": true,
"spriteSourceSize": {"x":0,"y":0,"w":418,"h":151},
"sourceSize": {"w":418,"h":2500}
}
,{
"filename": "object002",
"frame": {"x":0,"y":152,"w":192,"h":275},
"rotated": false,
"trimmed": true,
"spriteSourceSize": {"x":0,"y":0,"w":192,"h":275},
"sourceSize": {"w":418,"h":2500}
}
,{
"filename": "object003",
"frame": {"x":0,"y":428,"w":251,"h":201},
"rotated": false,
"trimmed": true,
"spriteSourceSize": {"x":0,"y":0,"w":251,"h":201},
"sourceSize": {"w":418,"h":2500}
}
,{
"filename": "object004",
"frame": {"x":0,"y":629,"w":251,"h":201},
"rotated": false,
"trimmed": true,
"spriteSourceSize": {"x":0,"y":0,"w":251,"h":201},
"sourceSize": {"w":418,"h":2500}
}

]}
Binary file added components/com_battle/views/plate/tmpl/001_consumer/sprite.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading