Init
This commit is contained in:
parent
9b22b7f33e
commit
79c9b3c2d6
|
|
@ -0,0 +1,14 @@
|
||||||
|
{
|
||||||
|
"ecmaVersion": 6,
|
||||||
|
"libs": [],
|
||||||
|
"loadEagerly": [
|
||||||
|
"js/*.js",
|
||||||
|
"js/libs/*.js"
|
||||||
|
],
|
||||||
|
"dontLoad": [
|
||||||
|
"node_modules/**"
|
||||||
|
],
|
||||||
|
"plugins": {
|
||||||
|
"doc_comment": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -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;
|
||||||
|
}
|
||||||
|
|
@ -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");
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 292 KiB |
|
|
@ -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>
|
||||||
|
|
@ -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()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -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
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"items": [{
|
||||||
|
"id": 0,
|
||||||
|
"name": "coal"
|
||||||
|
}]
|
||||||
|
}
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -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);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue