MasterGordon
/
FactoryMaster
mirror of https://github.com/MasterGordon/FactoryMaster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

made boxes better

This commit is contained in:
MasterGordon 2018-03-17 14:55:37 +01:00
parent 0c40c66c00
commit 682f176fc4
5 changed files with 64 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
css/main.css
View File

@ -10,13 +10,12 @@ body {
background-image: url("../images/wool.jpg"); background-image: url("../images/wool.jpg");
} }
#build { #itemcount {
position: fixed; position: fixed;
border: 1px, solid , black; border: 1px, solid , black;
border: solid; border: solid;
border-color: white; border-color: white;
background-image: url(../images/fliesen.png); background-image: url(../images/fliesen.png);
overflow-y: auto;
} }
#info { #info {
@ -25,5 +24,4 @@ body {
border: solid; border: solid;
border-color: white; border-color: white;
background-image: url(../images/fliesen.png); background-image: url(../images/fliesen.png);
overflow-y: auto;
} }

16
index.html
View File

@ -18,18 +18,10 @@
<body> <body>
<canvas id="screen"> <canvas id="screen">
</canvas> </canvas>
<div id="build"> <canvas id="itemcount">
<img src="images/tiles/conveyorbelt00.png"></img> </canvas>
<img src="images/tiles/conveyorbelt00.png"></img> <canvas id="info">
<img src="images/tiles/conveyorbelt00.png"></img> </canvas>
<img src="images/tiles/conveyorbelt00.png"></img>
<img src="images/tiles/conveyorbelt00.png"></img>
<img src="images/tiles/conveyorbelt00.png"></img>
<img src="images/tiles/conveyorbelt00.png"></img>
</div>
<div id="info">
</div>
</body> </body>
</html> </html>

14
js/game.js
View File

@ -114,6 +114,12 @@ function render() {
drawRotatedImage(img, tile.x * 48 + 24, tile.y * 48 + 24, directions[tile.direction].degree) drawRotatedImage(img, tile.x * 48 + 24, tile.y * 48 + 24, directions[tile.direction].degree)
} }
} }
//DRAW CURSOR BOX
if(isCursorInScreen){
ctx.globalAlpha = 0.4
ctx.fillRect(cursorScreenX*48,cursorScreenY*48,48,48)
ctx.globalAlpha = 1
}
} }
function getItemFormId(id) { function getItemFormId(id) {
@ -125,8 +131,14 @@ function getItemFormId(id) {
} }
function prepairRender() { function prepairRender() {
var canvas = $('canvas')[0]; var canvas = $('#screen')[0];
ctx = canvas.getContext('2d') ctx = canvas.getContext('2d')
canvas.width = 1200 canvas.width = 1200
canvas.height = 576 canvas.height = 576
canvas = $('#itemcount')[0];
canvas.width = 720
canvas.height = 240
canvas = $('#info')[0];
canvas.width = 432
canvas.height = 240
} }

49
js/resize.js
View File

@ -4,20 +4,51 @@ $(window).resize(function() {
$(document).ready(function() { $(document).ready(function() {
style(); style();
document.addEventListener('mousemove', onDocumentMouseMove, false);
}) })
var screenleftpos = 0
var screentoppos = 0
var cursorScreenX = -1
var cursorScreenY = -1
var isCursorInScreen = true
function style() { function style() {
$('#screen').css("margin-left", (window.innerWidth - 1200) / 2); var screenMarginTop = window.innerHeight - 912
$('#screen').css("margin-top", (window.innerHeight - 576) / 3); var screenMarginLeft = (window.innerWidth - 1200) / 2
$('#build').css("width", (1200/2)-8) var itemCountMarginTop = screenMarginTop+624
var topp = $('#screen').css("margin-top").substring(0,$('#screen').css("margin-top").length-2) var infoMarginLeft = screenMarginLeft+768
$('#build').css("height", window.innerHeight-topp-576-32)
$('#build').css("margin-left", $('#screen').css("margin-left")); $('#screen').css('margin-top', screenMarginTop)
$('#build').css("margin-top", (parseInt(topp)+576+16)); $('#screen').css('margin-left', screenMarginLeft)
$('#info').copyCSS('#build', ['height','margin-top','width']) $('#info').css('margin-top', itemCountMarginTop)
$('#info').css("margin-left", pxToInt($('#screen').css("margin-left"))+16+(1200/2)-8) $('#info').css('margin-left', infoMarginLeft)
$('#itemcount').css('margin-top', itemCountMarginTop)
$('#itemcount').css('margin-left', screenMarginLeft)
screenleftpos = pxToInt($('#screen').css("margin-left"))
screentoppos = pxToInt($('#screen').css("margin-top"))
} }
function pxToInt(px) { function pxToInt(px) {
return parseInt(px.substring(0, px.length - 2)) return parseInt(px.substring(0, px.length - 2))
} }
function onDocumentMouseMove(event) {
var mX = event.clientX - screenleftpos;
var mY = event.clientY - screentoppos;
if (mX < 0 || mX > 1200 || mY < 0 || mY > 576) {
cursorScreenX = -1
cursorScreenY = -1
} else {
cursorScreenX = Math.floor(mX / 48);
cursorScreenY = Math.floor(mY / 48);
}
if (cursorScreenX != -1 && cursorScreenY != -1) {
isCursorInScreen = true
} else {
isCursorInScreen = false
}
}

4
lang/en.json Normal file
View File

@ -0,0 +1,4 @@
{
"more": "show more..."
}