我正在使用Quick.js
制作游戏可以播放正在运行的游戏here
HTML:
<!DOCTYPE html>
<!-- // programName: BenghaziGame.html here: http://pastebin.com/jPaFjcWk
.js here: http://pastebin.com/xLcM9G4n
Running online: http://liesandcowpies.com/quickjs/BenghaziGame.html -->
<html>
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" type="image/png" href="icon16.png" />
<script type='text/javascript' src="quick.js"></script>
<style>
#assets {
height: 1px;
overflow: hidden;
visibility: hidden;
width: 1px;
}
body {
background-color: Black;
margin: 0;
overflow: hidden;
padding: 0;
}
canvas {
cursor: none;
}
table { color: #E1E1E1;
background-color: #992D2D;
height: 24px; width: 800px;
border: none;
}
</style>
</head>
<body> <!-- html way: <body onresize="bodyResize()"> -->
<div>
<table align="center">
<tr>
<td width="10%"> totalScore </td> <td id="totalScore" width="5%"> </td>
<td width="8%"></td>
<td width="10%"> oops! </td> <td id="oopsScore" width="5%"> </td>
<td width="8%"></td>
<td width="10%"> goodHits </td> <td id="goodHits" width="5%"> </td>
<td width="8%"></td>
<td width="10%"> totalShots </td> <td id="totalShots" width="5%"> </td>
</tr>
</table>
</div>
<div align="center">
<canvas id="canvas" width="800" height="600"></canvas>
</div>
<div id="assets">
<img id="bgCompound" src="sprites/bgCompound.png" width="320" height="191" />
<img id="manufacturer" src="sprites/manufacturer.png" width="180" height="100" />
<img id="restartBtn" src="sprites/RestartButton.png" width="100" height="25" />
<img id="pauseBtn" src="sprites/PauseButton.png" width="100" height="25" />
<img id="playBtn" src="sprites/PlayButton.png" width="100" height="25" />
<img id="quitBtn" src="sprites/QuitButton.png" width="100" height="25" />
<img id="truth01Sprite" src="sprites/truth01.png" width="64" height="64" />
<img id="lies01Sprite" src="sprites/lies01.png" width="64" height="64" />
<img id="truth02Sprite" src="sprites/truth02.png" width="64" height="64" />
<img id="lies02Sprite" src="sprites/lies02.png" width="64" height="64" />
<img id="truth03Sprite" src="sprites/truth03.png" width="64" height="64" />
<img id="lies03Sprite" src="sprites/lies03.png" width="64" height="64" />
<img id="truth04Sprite" src="sprites/truth04.png" width="64" height="64" />
<img id="lies04Sprite" src="sprites/lies04.png" width="64" height="64" />
<img id="sparkSprite" src="sprites/transSpark.png" width="28" height="28" />
<img id="pointerSprite" src="sprites/handPointerT.png" width="31" height="36" />
<img id="throwerSprite" src="sprites/thrower.png" width="64" height="64" />
<img id="cowpieSprite" src="sprites/cowpie.png" width="32" height="32" />
<audio id="closeDoor" src="sounds/CloseDoor.ogg"></audio>
<audio id="battleFire" src="sounds/BattleFire.ogg"></audio>
<audio id="oops" src="sounds/oops.ogg"></audio>
<audio id="Hillary-WhatDiff" src="sounds/Splat-Hillary-WhatDiff.ogg"></audio>
<audio id="byebye" src="sounds/GoodByeFemale.ogg"></audio>
<audio id="cymbals" src="sounds/Cymbals.ogg"></audio>
<audio id="pling" src="sounds/Pling.ogg"></audio>
<audio id="pingSound" src="sounds/ping.ogg"></audio>
<audio id="pongSound" src="sounds/pong.ogg"></audio>
</div>
<!-- html way:
<script type='text/javascript'> function bodyResize() {
// alert('.html bodyResize from Html. ');
location.reload(); }
</script>
ELSE
.js way:
<script type="text/javascript" >
window.addEventListener("resize", function(){ location.reload(); } );
</script>
-->
<script type='text/javascript' src="BenghaziGame.js"></script>
</body>
</html>
JS:
(function () {
// programName: BenghaziGame.js here: http://pastebin.com/xLcM9G4n
// .html here: http://pastebin.com/jPaFjcWk
// Quick.js here: http://pastebin.com/Gzqef5fu
/* Quick (top dog)
Point (inherits from Quick)
Rect (inherits from Point)
Sprite (inherits from Rect)
GameObject (inherits from Sprite)
Still: Where does Pointer inherit from ? ck ~paddle-main-NOW.js for score headings
*/
"use strict";
// http://www.w3schools.com/js/tryit.asp?filename=tryjs_object_function
var red = 153;
var green = 45;
var blue = 45;
var truth01Trips = 0; var truth01SVspeed ; // max trips 6 , SaVe speeds
var truth02Trips = 0; var truth02SVspeed ; // max trips 4
var truth03Trips = 0; var truth03SVspeed ; // max trips 7
var truth04Trips = 0; var truth04SVspeed ; // max trips 5
var lies01STspeed, lies02STspeed, lies03STspeed, lies04STspeed ; // STart speeds
var lies01SVspeed, lies02SVspeed, lies03SVspeed, lies04SVspeed ; // save Speeds
var allPaused = false;
var compound, manufacturer, thrower;
var truth01, truth02, truth03, truth04;
var lies01, lies02, lies03, lies04;
var totalScore = 0; var oopsScore = 0; var goodHits = 0; var totalShots = 0;
var buttonsCenter = 0;
var Cursor, cursorPoint, cursorPos;
var getXx , getYy, countLogs =1;
// var mousePos = [20,570];
var mousePos1stTimeIn = 1;
// imports
var CommandEnum = com.dgsprb.quick.CommandEnum;
var Quick = com.dgsprb.quick.Quick;
var GameObject = com.dgsprb.quick.GameObject;
var Rect = com.dgsprb.quick.Rect;
var ImageFactory = com.dgsprb.quick.ImageFactory;
var Scene = com.dgsprb.quick.Scene;
var Text = com.dgsprb.quick.Text;
var Point = com.dgsprb.quick.Point;
// static
function main() {
Quick.setAutoScale(false);
Quick.setName("Lies&Cowpies");
Quick.init(function () { return new FirstScene() });
}
var Background = (function () {
function Background() {
GameObject.call(this);
this.setColor("rgb(" + red + "," + green + "," + blue + ")");
this.setWidth(Quick.getWidth());
this.setHeight(Quick.getHeight());
};
Background.prototype = Object.create(GameObject.prototype);
return Background;
})();
var PlayBtn = (function () { // PlayBtn class namespace
function PlayBtn() { // PlayBtn class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("playBtn"); // setImageId, a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of PlayBtn
// getPointer is a static method of Quick
this.setBoundary(new Rect(Quick.getCenterX() +10, 570, 100, 30)); // a method of Sprite, to set the boundaries of PlayBtn
this.setSolid();
this.setEssential(); // a method of GameObject, sets the PlayBtn object as essential to its Scene, that if this object expires, the scene will expire too.
this.setBottom(600); this.setLeft(Quick.getCenterX() +10); this.setTop(572); // this.setLeft(320);
buttonsCenter = (Quick.getCenterX() +10);
// alert('buttonsCenter = ' + buttonsCenter);
}
PlayBtn.prototype = Object.create(GameObject.prototype);
return PlayBtn; // finally publishes the class to the outer scope
})();
var RestartBtn = (function () { // RestartBtn class namespace
function RestartBtn() { // RestartBtn class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("restartBtn"); // setImageId, a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of RestartBtn
this.setBoundary(new Rect(buttonsCenter -250, 570, 100, 30)); // a method of Sprite, to set this boundaries
this.setSolid();
this.setEssential();
this.setBottom(600); this.setLeft(buttonsCenter -250) ; this.setTop(572);
}
RestartBtn.prototype = Object.create(GameObject.prototype);
return RestartBtn; // finally publishes the class to the outer scope
})();
var PauseBtn = (function () { // PauseBtn class namespace
function PauseBtn() { // PauseBtn class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("pauseBtn"); // setImageId, a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of PauseBtn
this.setBoundary(new Rect(buttonsCenter -125, 570, 100, 30)); // a method of Sprite, to set the boundaries of PauseBtn
this.setSolid();
this.setEssential(); // a method of GameObject, sets the PauseBtn object as essential to its Scene, that if this object expires, the scene will expire too.
this.setBottom(600); this.setLeft(buttonsCenter -125); this.setTop(572);
}
PauseBtn.prototype = Object.create(GameObject.prototype);
return PauseBtn; // finally publishes the class to the outer scope
})();
var QuitBtn = (function () { // QuitBtn class namespace
function QuitBtn() { // QuitBtn class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("quitBtn"); // setImageId, a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of QuitBtn
// getPointer is a static method of Quick
this.setBoundary(new Rect(buttonsCenter +125, 570, 100, 30)); // a method of Sprite, to set the boundaries of QuitBtn
this.setSolid();
this.setEssential(); // a method of GameObject, sets the QuitBtn object as essential to its Scene, that if this object expires, the scene will expire too.
this.setBottom(600); this.setLeft(buttonsCenter + 125); this.setTop(572);
}
QuitBtn.prototype = Object.create(GameObject.prototype);
return QuitBtn; // finally publishes the class to the outer scope
})();
var Compound = (function () { // Compound class namespace
function Compound() { // Compound class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("bgCompound"); // setImageId, a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of Compound
// getPointer is a static method of Quick
this.setBoundary(new Rect(0, 0, Quick.getWidth(), Quick.getHeight())); // a method of Sprite, to set the boundaries of Compound
this.setEssential(); // a method of GameObject, sets the Compound object as essential to its Scene, that if this object expires, the scene will expire too.
this.setBottom(Quick.getHeight() - this.getHeight());
this.setLeft(0); this.setTop(378);
}
Compound.prototype = Object.create(GameObject.prototype);
return Compound; // finally publishes the class to the outer scope
})();
var Manufacturer = (function () { // Manufacturer class namespace
function Manufacturer() { // Manufacturer class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("manufacturer"); //setImageId, a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of Manufacturer
// getPointer is a static method of Quick
this.setBoundary(new Rect(0, 0, Quick.getWidth(), Quick.getHeight())); // a method of Sprite, to set the boundaries of Manufacturer
this.setEssential(); // a method of GameObject, sets the Manufacturer object as essential to its Scene, that if this object expires, the scene will expire too.
this.setBottom(Quick.getHeight() - this.getHeight());
this.setLeft(618); this.setTop(468);
}
Manufacturer.prototype = Object.create(GameObject.prototype); // this says the Ball class
return Manufacturer; // finally publishes the class to the outer scope
})();
//
var Ball = (function () { // Ball class namespace
function Ball() { // Ball class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("cowpieSprite"); // setImageId,a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of Ball
// getPointer is a static method of Quick, whose public members are accessible without creating an instance of that class.
this.setBoundary(new Rect(0, 0, Quick.getWidth(), Quick.getHeight())); // a method of Sprite, to set the boundaries of Ball
this.setSolid(); // a method of GameObject , so Ball can collide with other solid objects - correct!
this.setBottom(Quick.getHeight() - this.getHeight());
this.setTop(500);
// this.controller = Quick.getController();
};
Ball.prototype = Object.create(GameObject.prototype); // this says the Ball class inherits from GameObject
// override - this comment means the following method overrides (rewrites) the method with the same name defined in the super class (in this case, GameObject)
Ball.prototype.onCollision = function (gameObject) { // still no instance of Ball here, just class method definition - no instance of this class is created until "new Ball()" is issued
this.expire() ; // remove ball from screne to prevent multi hits per initial colllision
var collision = this.getCollision(gameObject); // get direction at collision
if (gameObject.hasTag("truth02")) { // returns true if object contains given tag
oopsScore ++ ; totalScore = ((goodHits * 3) - (oopsScore * 2));
// alert('oopsScore = ' + oopsScore); // check for bad news multi hits
Quick.play("oops"); // calls a static method from Quick class
};
if (gameObject.hasTag("lies02")) { // returns true if object contains given tag
lies02.setLeft(0); lies02.setVisible(false); lies02.setSpeedX(0);
truth02.setVisible(true); truth02.setSpeedX(4);
goodHits ++ ; totalScore = ((goodHits * 3) - (oopsScore * 2)); // each goodHit = 3 points , each
Quick.play('Hillary-WhatDiff'); // calls a static method from Quick class
// goodHits += 1; Quick.play("cowMoo"); // calls a static method from Quick class
};
updateScores();
};
return Ball; // finally publishes the class to the outer scope
})();
function updateScores () {
document.getElementById('totalScore').innerHTML = totalScore;
document.getElementById('oopsScore').innerHTML = oopsScore;
document.getElementById('goodHits').innerHTML = goodHits;
document.getElementById('totalShots').innerHTML = totalShots;
}
window.addEventListener("resize", function(){
// Quick.setAutoScale(false);
location.reload();
} );
var Truth = (function () {
function Truth() {
GameObject.call(this);
this.setImageId("");
this.setBoundary(new Rect(0, 0, Quick.getWidth(), Quick.getHeight()));
// this.setEssential();
this.setSolid();
this.setLeft(0);
this.setTop(120);
this.setSpeedX(4);
};
Truth.prototype = Object.create(GameObject.prototype);
Truth.prototype.offBoundary = function (gameObject) {
if (this.hasTag("truth02")) {
truth02Trips += 1; // increment by 1
if(truth02Trips > 2) { truth02Trips = 0;
truth02.setLeft(0); truth02.setVisible(false); truth02.setSpeedX(0);
};
// Quick.play("oops"); // calls a static method from Quick class
if(truth02.getVisible() ) { this.bounceX(); // for the horizontal axis
this.setImage(ImageFactory.mirror(this.getImage())); // flip image horiz
};
if(!truth02.getVisible() ) {
lies02.setLeft(0); lies02.setVisible(true); lies02.setSpeedX(4); //
};
};
};
return Truth;
})();
//
var Lies = (function () {
function Lies() {
GameObject.call(this);
this.setImageId("");
this.setBoundary(new Rect(0, 0, Quick.getWidth(), Quick.getHeight()));
// this.setEssential();
this.setSolid();
this.setLeft(0);
this.setTop(120);
this.setSpeedX(5);
};
Lies.prototype = Object.create(GameObject.prototype);
Lies.prototype.offBoundary = function (gameObject) {
this.bounceX(); // for the horizontal axis
this.setImage(ImageFactory.mirror(this.getImage()));
// alert("Lies.prototype.offBoundary");
};
return Lies;
})();
//
var FirstScene = (function () {
function FirstScene() {
Scene.call(this);
this.add(new Background());
var compound = new Compound();
this.add(compound);
var playBtn = new PlayBtn();
this.add(playBtn);
playBtn.addTag("playBtn");
var restartBtn = new RestartBtn();
this.add(restartBtn);
restartBtn.addTag("restartBtn");
var pauseBtn = new PauseBtn();
this.add(pauseBtn);
pauseBtn.addTag("pauseBtn");
var quitBtn = new QuitBtn();
this.add(quitBtn);
quitBtn.addTag("quitBtn");
manufacturer = new Manufacturer();
this.add(manufacturer);
var ball = new Ball();
truth01 = new Truth();
this.add(truth01);
truth01.addTag("truth01");
truth01.setImageId("truth01Sprite");
truth01.setLeft(0);
truth01.setTop(50);
truth01.setSpeedX(4);
lies01 = new Lies();
this.add(lies01);
lies01.addTag("lies01");
lies01.setImageId("lies01Sprite");
lies01.setVisible(false);
lies01.setLeft(0) // (-64);
lies01.setTop(50);
lies01.setSpeedX(0);
truth02 = new Truth();
this.add(truth02);
truth02.addTag("truth02");
truth02.setImageId("truth02Sprite");
truth02.setLeft(0);
truth02.setTop(120);
truth02.setSpeedX(6);
lies02 = new Lies();
this.add(lies02);
lies02.addTag("lies02");
lies02.setImageId("lies02Sprite");
lies02.setVisible(false);
lies02.setLeft(0) // (-64);
lies02.setTop(120);
lies02.setSpeedX(0);
truth03 = new Truth();
this.add(truth03);
truth03.addTag("truth03");
truth03.setImageId("truth03Sprite");
truth03.setLeft(0);
truth03.setTop(190);
truth03.setSpeedX(3);
lies03 = new Lies();
this.add(lies03);
lies03.addTag("lies03");
lies03.setImageId("lies03Sprite");
lies03.setVisible(false);
lies03.setLeft(0) // (-64);
lies03.setTop(190);
lies03.setSpeedX(0);
truth04 = new Truth();
this.add(truth04);
truth04.addTag("truth04");
truth04.setImageId("truth04Sprite");
truth04.setLeft(0);
truth04.setTop(260);
truth04.setSpeedX(5);
lies04 = new Lies();
this.add(lies04);
lies04.addTag("lies04");
lies04.setImageId("lies04Sprite");
lies04.setVisible(false);
lies04.setLeft(0) // (-64);
lies04.setTop(260);
lies04.setSpeedX(0);
thrower = new Thrower();
this.add(thrower);
var cursorPoint = new Cursor();
this.add(cursorPoint);
var spark = new Spark();
this.add(spark);
alert(' Click anywhere on screen to activate buttons .');
Quick.play("battleFire"); // calls a static method from Quick class
};
FirstScene.prototype = Object.create(Scene.prototype);
// override
FirstScene.prototype.getNext = function () {
return new FirstScene();
};
return FirstScene;
})();
//
var Cursor = (function () {
function Cursor() {
GameObject.call(this);
this.addTag("pointerSprite");
this.controller = Quick.getController();
this.setBoundary(new Rect(0, 600, Quick.getWidth(), 30)); // a method of Sprite,set Boundary
this.pointer = Quick.getPointer();
this.setImageId("pointerSprite");
this.setSolid();
this.setEssential();
this.setBottom(600); this.setLeft(50); this.setTop(572);
};
Cursor.prototype = Object.create(GameObject.prototype);
Cursor.prototype.fire = function () {
var spark = new Spark(); // create a brand new spark to be thrown
var scene = this.getScene(); // ask for the scene the avatar is
scene.add(spark); // add the spark to the same scene I am
if (spark) {spark.setX(this.getX()) };
spark.setSpeedY(10);
};
Cursor.prototype.update = function () {
if (this.pointer.getPush()) { // getpush is a method of Pointer as in Mouse pointer
this.fire(); // call the Cursor.prototype.fire method we defined above
var position = this.pointer.getPosition();
};
var mousePos = this.pointer.getPosition();
this.setPosition(mousePos);
}
Cursor.prototype.offBoundary = function (gameObject) {
// alert('Cursor.prototype.offBoundary');
// this.setCenterY(587);
};
// this.setCenterY(587);
return Cursor;
})();
var Spark = (function () { // Spark class namespace
function Spark() { // Spark class constructor method
GameObject.call(this); // call the constructor from the superclass
this.setImageId("sparkSprite"); // setImageId,a method inherited from Sprite
// this.pointer = Quick.getPointer(); // pointer is a member property of Spark
this.setBoundary(new Rect(0, 600, Quick.getWidth(), 30)); // a method of Sprite,set
this.setSolid(); // a method of GameObject , so Spark can collide with other solid objects
this.setBottom(600); this.setLeft(50); this.setTop(578);
this.controller = Quick.getController();
};
Spark.prototype = Object.create(GameObject.prototype);
Spark.prototype.onCollision = function (gameObject) {
var collision = this.getCollision(gameObject); // get direction at collision
if (gameObject.hasTag("restartBtn")) { // returns true if object contains given tag
Quick.play("closeDoor"); // calls a static method from Quick class
totalScore = 0; oopsScore = 0; goodHits = 0; totalShots = 0;
updateScores();
};
if (gameObject.hasTag("pauseBtn")) { // returns true if object contains given tag
Quick.play("pling"); // calls a static method from Quick class
if(!allPaused) {
truth02SVspeed = truth02.getSpeedX(); truth02.setSpeedX(0); // this.setSpeedX(5);
lies02SVspeed = lies02.getSpeedX(); lies02.setSpeedX(0); // this.setSpeedX(5);
allPaused = true;
}
else { alert('You are already paused , try Play .');
}
};
// };
if (gameObject.hasTag("playBtn")) { // returns true if object contains given tag
Quick.play("pling"); // calls a static method from Quick class
if(allPaused) {
allPaused = false;
truth02.setSpeedX(truth02SVspeed);
lies02.setSpeedX(lies02SVspeed);
}
};
if (gameObject.hasTag("quitBtn")) { // returns true if object contains given tag
Quick.play("byebye"); // calls a static method from Quick class
window.location = 'https://github.com/dgsprb/quick/wiki';
};
};
return Spark; // finally publishes the class to the outer scope
})();
//
var Thrower = (function () {
function Thrower() {
GameObject.call(this);
this.addTag("thrower");
this.controller = Quick.getController();
this.setBoundary(new Rect(0, 0, Quick.getWidth(), Quick.getHeight()));
this.pointer = Quick.getPointer();
this.setImageId("throwerSprite");
this.setEssential();
this.setCenterX(Quick.getWidth() / 2);
this.setBottom(Quick.getHeight() - this.getHeight());
this.setTop(506);
};
Thrower.prototype = Object.create(GameObject.prototype);
Thrower.prototype.fire = function () {
var ball = new Ball(); // create a brand new ball to be thrown
var scene = this.getScene(); // ask for the scene the avatar is
scene.add(ball); // add the ball to the same scene I am
if (ball) {ball.setX(this.getX()) }; // within your Thrower update method
// totalShots ++ ;
updateScores();
// if(ball ) { this.ball.setCenterX(this.getCenterX()) } ;
ball.setSpeedY(-9);
};
Thrower.prototype.update = function () {
if (this.controller.keyDown(CommandEnum.LEFT) && this.getLeft() > 0) {
this.moveX(-8);
}
if (this.controller.keyDown(CommandEnum.RIGHT) && this.getRight() < Quick.getWidth()) {
this.moveX(8);
}
if (this.controller.keyPush(CommandEnum.UP) || this.controller.keyPush(CommandEnum.A))
{ totalShots += 1;
this.fire(); // call the method we defined above
}
}
Thrower.prototype.offBoundary = function (gameObject) {
this.setCenterX(Quick.getWidth() / 2);
};
return Thrower;
})();
main();
})();
问题:当浏览器页面从/向'最大化'更改为/从'还原'更改并且比例关闭时,所有内容都会被放大。
所以我想重新加载页面。
我可以使用htmlOnly
方法:
<body onresize="bodyResize()">
<script type='text/javascript'> function bodyResize() {
// alert('bodyResize from Html. ');
location.reload(); }
</script>
但我真的想在下面使用这个功能:
<script type='text/javascript' src="paddle-main-WIP.js"></script>
......第188行:
function bodyResize() {
alert('.js bodyResize 1.');
location.reload();
alert('.js bodyResize 2.');
}
我做错了什么?
答案 0 :(得分:0)
啊哈! 最后,经过更多的谷歌搜索后,我从这些搜索中得到了一些回答: 触发浏览器重新加载按钮javascript w3schools 捕获URL地址javascript w3schools window.bind调整大小画布元素示例w3schools -jquery -angular 墓内: .w3schools.com / jsref / met_loc_reload.asp .w3schools.com / jsref / event_onresize.asp 请原谅缩写的URL,我允许1个实际链接。
我能够通过两种方式做到这一点,1)通过.html, 和2)通过.js。 .1).html方式:第36和84行至第88行。 注意:.html方式第36行被注释掉了。 .2).js方式,第36和90行到第93行。 在这里运行游戏:http://liesandcowpie...nghaziGame.html 谢谢
1<!DOCTYPE html>
2<!-- // programName: BenghaziGame.html here: http://pastebin.com/jPaFjcWk
3 .js here: http://pastebin.com/xLcM9G4n
4 Running online: http://liesandcowpies.com/quickjs/BenghaziGame.html -->
5<html>
6 <head>
7 <meta charset="utf-8" />
8 <link rel="shortcut icon" type="image/png" href="icon16.png" />
9 <script type='text/javascript' src="quick.js"></script>
10 <style>
11 #assets {
12 height: 1px;
13 overflow: hidden;
14 visibility: hidden;
15 width: 1px;
16 }
17
18 body {
19 background-color: Black;
20 margin: 0;
21 overflow: hidden;
22 padding: 0;
23 }
24
25 canvas {
26 cursor: none;
27 }
28 table { color: #E1E1E1;
29 background-color: #992D2D;
30 height: 24px; width: 800px;
31 border: none;
32 }
33 </style>
34 </head>
35
36 <body> <!-- html way: <body onresize="bodyResize()"> -->
37<div>
38<table align="center">
39 <tr>
40 <td width="10%"> totalScore </td> <td id="totalScore" width="5%"> </td>
41 <td width="8%"></td>
42 <td width="10%"> oops! </td> <td id="oopsScore" width="5%"> </td>
43 <td width="8%"></td>
44 <td width="10%"> goodHits </td> <td id="goodHits" width="5%"> </td>
45 <td width="8%"></td>
46 <td width="10%"> totalShots </td> <td id="totalShots" width="5%"> </td>
47 </tr>
48 </table>
49</div>
50 <div align="center">
51 <canvas id="canvas" width="800" height="600"></canvas>
52 </div>
53
54 <div id="assets">
55 <img id="bgCompound" src="sprites/bgCompound.png" width="320" height="191" />
56 <img id="manufacturer" src="sprites/manufacturer.png" width="180" height="100" />
57 <img id="restartBtn" src="sprites/RestartButton.png" width="100" height="25" />
58 <img id="pauseBtn" src="sprites/PauseButton.png" width="100" height="25" />
59 <img id="playBtn" src="sprites/PlayButton.png" width="100" height="25" />
60 <img id="quitBtn" src="sprites/QuitButton.png" width="100" height="25" />
61 <img id="truth01Sprite" src="sprites/truth01.png" width="64" height="64" />
62 <img id="lies01Sprite" src="sprites/lies01.png" width="64" height="64" />
63 <img id="truth02Sprite" src="sprites/truth02.png" width="64" height="64" />
64 <img id="lies02Sprite" src="sprites/lies02.png" width="64" height="64" />
65 <img id="truth03Sprite" src="sprites/truth03.png" width="64" height="64" />
66 <img id="lies03Sprite" src="sprites/lies03.png" width="64" height="64" />
67 <img id="truth04Sprite" src="sprites/truth04.png" width="64" height="64" />
68 <img id="lies04Sprite" src="sprites/lies04.png" width="64" height="64" />
69 <img id="sparkSprite" src="sprites/transSpark.png" width="28" height="28" />
70 <img id="pointerSprite" src="sprites/handPointerT.png" width="31" height="36" />
71 <img id="throwerSprite" src="sprites/thrower.png" width="64" height="64" />
72 <img id="cowpieSprite" src="sprites/cowpie.png" width="32" height="32" />
73
74 <audio id="closeDoor" src="sounds/CloseDoor.ogg"></audio>
75 <audio id="battleFire" src="sounds/BattleFire.ogg"></audio>
76 <audio id="oops" src="sounds/oops.ogg"></audio>
77 <audio id="Hillary-WhatDiff" src="sounds/Splat-Hillary-WhatDiff.ogg"></audio>
78 <audio id="byebye" src="sounds/GoodByeFemale.ogg"></audio>
79 <audio id="cymbals" src="sounds/Cymbals.ogg"></audio>
80 <audio id="pling" src="sounds/Pling.ogg"></audio>
81 <audio id="pingSound" src="sounds/ping.ogg"></audio>
82 <audio id="pongSound" src="sounds/pong.ogg"></audio>
83 </div>
84<!-- html way:
85 <script type='text/javascript'> function bodyResize() {
86 // alert('.html bodyResize from Html. ');
87 location.reload(); }
88 </script>
89 ELSE
90 .js way:
91<script type="text/javascript" >
92window.addEventListener("resize", function(){ location.reload(); } );
93</script>
94-->
95 <script type='text/javascript' src="BenghaziGame.js"></script>
96
97
98 </body>
99</html>
100
答案 1 :(得分:0)
如果您在代码中注释/删除此行,该怎么办:
Quick.setAutoScale(false);
让Quick为您自动缩放?如果必须,您也可以致电:
Quick.setKeepAspect(true);
让它保持游戏方面而不是伸展。
参考:Quick API
答案 2 :(得分:0)
感谢迪奥戈,
我想你在这里引用我的其他帖子: stackoverflow.com/questions/36105157/how-to-trigger-quick-setautoscalefalse-multitimes-with-quick-js
但我会在这里回答(并在那里发布以下内容。):
&#34; @DiogoSchneider:让Quick为你做自动缩放? &#34; 我最初尝试过,但将图标放大到78x78。 是什么导致我进入Quick.setAutoScale(false);
普通屏幕画布应为800x600。
仍然保持&#39; window.addEventListener(&#34;调整大小&#34;,函数(){&#39;在播放: 如果我用郎跑 // Quick.setAutoScale(false); // Quick.setKeepAspect(true); 屏幕被放大(画布=?x ?,不能告诉我,因为当我切换到调试屏幕时,它会改变每一件事) 和图标是132x78,两者都可以恢复&#39;并且&#39;最大化&#39; 。
当我跑步时 function main(){ Quick.setAutoScale(假); Quick.setKeepAspect(真); Quick.setName(&#34;&谎言放大器; Cowpies&#34); Quick.init(function(){return new FirstScene()});
一切都很好地恢复了&#39;并且&#39;最大化&#39; canvas = 800x600,icons = 64x64。 除此之外,因为重新加载&#39;我放弃了所有分数等。
如果我使用&#39; window.addEventListener(&#34;调整大小&#34;,函数(){&#39;不在玩,和 function main(){ Quick.setAutoScale(假); Quick.setKeepAspect(真); Quick.setName(&#34;&谎言放大器; Cowpies&#34); Quick.init(function(){return new FirstScene()});
&#39;恢复&#39;模式,屏幕是正常画布= 800x600,图标= 64x64。 在&#39;最大化&#39;模式,屏幕放大(画布= 956x~713),图标为78x78。
结果:我仍然需要&#39; window.addEventListener(&#34;调整大小&#34;,功能()&#39;来正确重置。
作为最后的手段, 我也试过了 window.addEventListener(&#34; resize&#34;,function(){ // location.reload(); Quick.setAutoScale(假); Quick.setKeepAspect(真); });
&#39;恢复&#39; canvas = 830x~633,图标= 64x64。 &#39;最大限度地&#39; canvas = 955x724 icons = 78x78
结果:我仍然需要&#39; window.addEventListener(&#34;调整大小&#34;,功能()&#39;来正确重置。