This commit is contained in:
MasterGordon 2018-03-11 13:00:04 +01:00
parent 9b22b7f33e
commit 79c9b3c2d6
13 changed files with 340 additions and 0 deletions

14
.tern-project Normal file
View File

@ -0,0 +1,14 @@
{
"ecmaVersion": 6,
"libs": [],
"loadEagerly": [
"js/*.js",
"js/libs/*.js"
],
"dontLoad": [
"node_modules/**"
],
"plugins": {
"doc_comment": true
}
}

48
css/cssreset.css Normal file
View File

@ -0,0 +1,48 @@
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

11
css/main.css Normal file
View File

@ -0,0 +1,11 @@
#screen {
position: fixed;
border: 1px, solid , black;
border: solid;
border-color: white;
background-image: url(../images/fliesen.png);
}
body {
background-image: url("../images/wool.jpg");
}

BIN
images/fliesen.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

BIN
images/items/coal.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
images/wool.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 292 KiB

19
index.html Normal file
View File

@ -0,0 +1,19 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/cssreset.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<!-- Libs -->
<script src="js/libs/jquery.js"></script>
<!-- Own scripts-->
<script src="js/resize.js"></script>
<script src="js/classes.js"></script>
<script src="js/game.js"></script>
</head>
<body>
<canvas id="screen">
</canvas>
</body>
</html>

129
js/classes.js Normal file
View File

@ -0,0 +1,129 @@
class Tile {
constructor(x, y) {
this.x = x
this.y = y
this.direction = "right"
this.input = new Inventory()
}
work() {
//Default Conveyor-Belt Verhalten
while (this.input.items.length > 1) {
var item = this.input.items.pop()
item.setDFromDirection(this.direction)
}
}
}
class Inventory {
constructor() {
this.items = []
}
countOf(id) {
var n = 0
for (var i = 0; i < this.items.length; i++) {
if (this.items[i].id == id)
n++
}
return n
}
addItem(item) {
if (item instanceof Item)
this.items.push(item)
}
take(id, count) {
if (this.countOf(id) >= count) {
for (var j = 0; j < count; j++) {
for (var i = 0; i < this.items.length; i++) {
if (this.items[i].id == id) {
this.items.splice(i, 1)
break;
}
}
}
return true
}
return false
}
}
class Item {
constructor(id, x, y) {
this.id = id
this.x = x
this.y = y
this.dx = 0
this.dy = 0
}
setDFromDirection(direction) {
if (direction == "left") {
this.dx = -1
this.dy = 0
} else if (direction == "right") {
this.dx = 1
this.dy = 0
} else if (direction == "up") {
this.dx = 0
this.dy = -1
} else if (direction == "down") {
this.dx = 0
this.dy = 1
} else {
this.dx = 0
this.dy = 0
}
this.x += this.dx
this.y += this.dy
}
move() {
this.x += this.dx
this.y += this.dy
if (this.x % 48 == 0 && this.y % 48 == 0) {
this.dx = 0
this.dy = 0
}
}
}
class Factory {
constructor(tier) {
this.tier = tier
this.tiles = []
this.items = []
for (var x = 0; x < 32; x++) {
this.tiles[x] = []
for (var y = 0; y < 16; y++) {
this.tiles[x][y] = 0
}
}
}
moveItems() {
for (var i = 0; i < this.items.length; i++) {
this.items[i].move()
if (this.items[i].x % 48 == 0 && this.items[i].y % 48 == 0) {
var tile = this.tiles [this.items[i].x / 48] [this.items[i].y / 48]
if (tile != 0) {
tile.input.addItem(this.items[i])
}
}
}
}
workTiles() {
for (var x = 0; x < 32; x++) {
for (var y = 0; y < 16; y++) {
if (this.tiles[x][y] != 0) {
this.tiles[x][y].work()
}
}
}
}
}

99
js/game.js Normal file
View File

@ -0,0 +1,99 @@
var factorys = []
var items = []
var time = 0
var timestep = 1000 / 48
var delta = 0
var lastFrameTimeMs = 0
var ctx = {}
var currentFactory = 0
$(document).ready(function() {
loadGameData()
loadItems()
prepairRender()
requestAnimationFrame(loop)
})
function loadGameData() {
//TODO: Check for Cookies
factorys.push(new Factory())
}
function loadItems(){
var itemRequest = new XMLHttpRequest();
itemRequest.open('GET', 'js/items.json', false)
itemRequest.send(null)
var json = JSON.parse(itemRequest.responseText)
items = json.items
}
function loop(timestamp) {
//Check Gametick Rate
if (timestamp < lastFrameTimeMs + (1000 / 48)) {
requestAnimationFrame(loop)
return;
}
delta += timestamp - lastFrameTimeMs;
lastFrameTimeMs = timestamp;
var numUpdateSteps = 0
while (delta >= timestep) {
gametick(timestep)
delta -= timestep
if (++numUpdateSteps >= 240) {
delta = 0
break;
}
}
render();
requestAnimationFrame(loop);
}
function gametick(timestep) {
//time gibt an in den Wievielten von 40 Ticks man sich befindet
time ++
time = time%48
//Wird 40 mal in einer Sekunde aufgerufen
for(var i=0;i<factorys.length;i++){
factorys[i].moveItems()
}
if(time%24==0){
for(var i=0;i<factorys.length;i++){
factorys[i].workTiles()
}
}
}
function render() {
ctx.clearRect(0,0,innerWidth,innerHeight)
//Hier wird das Spiel gerendert
//RENDER TILE-LAYER0
//RENDER Items
for (var i = 0; i < factorys[currentFactory].items.length; i++) {
var item = factorys[currentFactory].items[i]
var img = new Image
img.src = "images/items/"+getItemFormId(item.id).name+".png"
ctx.drawImage(img,item.x,item.y,48,48)
}
//RENDER TILE-LAYER1
}
function getItemFormId(id){
for(var i=0;i<items.length;i++){
if(items[i].id == id){
return items[i]
}
}
}
function prepairRender(){
var canvas = $('canvas')[0];
ctx = canvas.getContext('2d')
canvas.width = 1200
canvas.height = 576
}

6
js/items.json Normal file
View File

@ -0,0 +1,6 @@
{
"items": [{
"id": 0,
"name": "coal"
}]
}

2
js/libs/jquery.js vendored Normal file

File diff suppressed because one or more lines are too long

12
js/resize.js Normal file
View File

@ -0,0 +1,12 @@
$(window).resize(function() {
style();
})
$(document).ready(function() {
style();
})
function style() {
$('#screen').css("margin-left", (window.innerWidth - 1200) / 2);
$('#screen').css("margin-top", (window.innerHeight - 576) / 3);
}