77 lines
2.6 KiB
JavaScript
77 lines
2.6 KiB
JavaScript
|
/*
|
||
|
|
Responsive.js- Handles responsiveness of website
|
||
|
|
|
||
|
|
Game.Responsive.start()- Initiates Responsive functions
|
||
|
|
Initiates canvas, inputs, and menu functions
|
||
|
|
Draws the appropriate graph for the level
|
||
|
|
Draws points for level
|
||
|
|
|
||
|
|
Game.Responsive.canvas() - Adjusts canvas on resize
|
||
|
|
Changes width and height to window
|
||
|
|
|
||
|
|
Game.Responsive.inputs() - Adjusts input boxes on resize
|
||
|
|
Changes it to what seems as an appropriate size
|
||
|
|
|
||
|
|
Game.Responsive.menu() - Adjusts menu div on resize
|
||
|
|
Sets it to window size [Bug]
|
||
|
|
|
||
|
|
---- Draggable div functions -----
|
||
|
|
Game.Responsive.mouseUp() - removes event listener on mouseup
|
||
|
|
|
||
|
|
Game.Responsive.mouseDown(e) - prepares for div move
|
||
|
|
stores drag offset from orriginal div
|
||
|
|
calls divMouse function
|
||
|
|
|
||
|
|
Game.Responsive.divMove(e) - moves the div
|
||
|
|
targets div
|
||
|
|
moves the div according to "offset" variable
|
||
|
|
*/
|
||
|
|
Game.Responsive = {
|
||
|
|
canvas: function () {
|
||
|
|
document.getElementById('myCanvas').width = window.innerWidth;
|
||
|
|
document.getElementById('myCanvas').height = window.innerHeight;
|
||
|
|
},
|
||
|
|
inputs: function () {
|
||
|
|
$('.input').width(window.innerWidth / 2.8);
|
||
|
|
$('.input').height(window.innerHeight / 10);
|
||
|
|
},
|
||
|
|
menu: function () {
|
||
|
|
document.getElementById('Menu').width = window.innerWidth;
|
||
|
|
document.getElementById('Menu').height = window.innerHeight;
|
||
|
|
},
|
||
|
|
start: function () {
|
||
|
|
Game.Responsive.canvas();
|
||
|
|
Game.Responsive.inputs();
|
||
|
|
Game.Responsive.menu();
|
||
|
|
myGraph = {};
|
||
|
|
myGraph = new Graph({
|
||
|
|
centerY: (Game.Type != "ZeroQuad") ? window.innerHeight - 60 : window.innerHeight / 2,
|
||
|
|
centerX: 30,
|
||
|
|
minX: 0,
|
||
|
|
minY: 0,
|
||
|
|
maxX: window.innerWidth / (window.innerHeight / 10),
|
||
|
|
maxY: 10,
|
||
|
|
unitsPerTick: 1
|
||
|
|
});
|
||
|
|
myGraph.drawPoint(Game.LastX, Game.LastY);
|
||
|
|
myGraph.drawPoint(Game.LastX2, Game.LastY2);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
Game.Responsive.mouseUp = function () {
|
||
|
|
window.removeEventListener('mousemove', Game.Responsive.divMove, true);
|
||
|
|
};
|
||
|
|
|
||
|
|
Game.Responsive.mouseDown = function (e) {
|
||
|
|
target = (e.target || e.srcElement).id;
|
||
|
|
var div = document.getElementById(target);
|
||
|
|
offY = e.clientY - parseInt(div.offsetTop);
|
||
|
|
offX = e.clientX - parseInt(div.offsetLeft);
|
||
|
|
window.addEventListener('mousemove', Game.Responsive.divMove, true);
|
||
|
|
};
|
||
|
|
|
||
|
|
Game.Responsive.divMove = function (e) {
|
||
|
|
var div = document.getElementById(target);
|
||
|
|
div.style.top = (e.clientY - offY) + 'px';
|
||
|
|
div.style.left = (e.clientX - offX) + 'px';
|
||
|
|
};
|