ctl_utils.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547
  1. var s_iScaleFactor = 1;
  2. var s_bIsIphone = false;
  3. var s_oCanvasLeft;
  4. var s_oCanvasTop;
  5. var s_bFocus = true;
  6. var browserName = (function (agent) { switch (true) {
  7. case agent.indexOf("edge") > -1: return "MS Edge";
  8. case agent.indexOf("edg/") > -1: return "Edge ( chromium based)";
  9. case agent.indexOf("opr") > -1 && !!window.opr: return "Opera";
  10. case agent.indexOf("chrome") > -1 && !!window.chrome: return "Chrome";
  11. case agent.indexOf("trident") > -1: return "MS IE";
  12. case agent.indexOf("firefox") > -1: return "Mozilla Firefox";
  13. case agent.indexOf("safari") > -1: return "Safari";
  14. default: return "other";
  15. }
  16. })(window.navigator.userAgent.toLowerCase());
  17. window.addEventListener('resize', function(event) {
  18. sizeHandler();
  19. }, true);
  20. function trace(szMsg){
  21. console.log(szMsg);
  22. }
  23. function isChrome(){
  24. var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
  25. return isChrome;
  26. }
  27. function isIpad() {
  28. var isIpad = navigator.userAgent.toLowerCase().indexOf('ipad') !== -1;
  29. if (!isIpad && navigator.userAgent.match(/Mac/) && navigator.maxTouchPoints && navigator.maxTouchPoints > 2) {
  30. return true;
  31. }
  32. return isIpad;
  33. }
  34. function isMobile(){
  35. if(isIpad()){
  36. return true;
  37. }
  38. if (navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/Windows Phone/i)) {
  39. //MOBILE
  40. return true;
  41. }else{
  42. //DESKTOP
  43. return false;
  44. }
  45. };
  46. function isIOS() {
  47. var iDevices = [
  48. 'iPad Simulator',
  49. 'iPhone Simulator',
  50. 'iPod Simulator',
  51. 'iPad',
  52. 'iPhone',
  53. 'iPod'
  54. ];
  55. if (navigator.userAgent.toLowerCase().indexOf("iphone") !== -1){
  56. s_bIsIphone = true;
  57. return true;
  58. }
  59. while (iDevices.length) {
  60. if (navigator.platform === iDevices.pop()){
  61. return true;
  62. }
  63. }
  64. s_bIsIphone = false;
  65. return false;
  66. }
  67. function getSize(Name) {
  68. var size;
  69. var name = Name.toLowerCase();
  70. var document = window.document;
  71. var documentElement = document.documentElement;
  72. if (window["inner" + Name] === undefined) {
  73. // IE6 & IE7 don't have window.innerWidth or innerHeight
  74. size = documentElement["client" + Name];
  75. }
  76. else if (window["inner" + Name] != documentElement["client" + Name]) {
  77. // WebKit doesn't include scrollbars while calculating viewport size so we have to get fancy
  78. // Insert markup to test if a media query will match document.doumentElement["client" + Name]
  79. var bodyElement = document.createElement("body");
  80. bodyElement.id = "vpw-test-b";
  81. bodyElement.style.cssText = "overflow:scroll";
  82. var divElement = document.createElement("div");
  83. divElement.id = "vpw-test-d";
  84. divElement.style.cssText = "position:absolute;top:-1000px";
  85. // Getting specific on the CSS selector so it won't get overridden easily
  86. divElement.innerHTML = "<style>@media(" + name + ":" + documentElement["client" + Name] + "px){body#vpw-test-b div#vpw-test-d{" + name + ":7px!important}}</style>";
  87. bodyElement.appendChild(divElement);
  88. documentElement.insertBefore(bodyElement, document.head);
  89. if (divElement["offset" + Name] == 7) {
  90. // Media query matches document.documentElement["client" + Name]
  91. size = documentElement["client" + Name];
  92. }
  93. else {
  94. // Media query didn't match, use window["inner" + Name]
  95. size = window["inner" + Name];
  96. }
  97. // Cleanup
  98. documentElement.removeChild(bodyElement);
  99. }
  100. else {
  101. // Default to use window["inner" + Name]
  102. size = window["inner" + Name];
  103. }
  104. return size;
  105. };
  106. window.addEventListener("orientationchange", onOrientationChange);
  107. function onOrientationChange(){
  108. if (window.matchMedia("(orientation: portrait)").matches) {
  109. // you're in PORTRAIT mode
  110. sizeHandler();
  111. }
  112. if (window.matchMedia("(orientation: landscape)").matches) {
  113. // you're in LANDSCAPE mode
  114. sizeHandler();
  115. }
  116. }
  117. function getIOSWindowHeight() {
  118. // Get zoom level of mobile Safari
  119. // Note, that such zoom detection might not work correctly in other browsers
  120. // We use width, instead of height, because there are no vertical toolbars :)
  121. var zoomLevel = document.documentElement.clientWidth / window.innerWidth;
  122. // window.innerHeight returns height of the visible area.
  123. // We multiply it by zoom and get out real height.
  124. return window.innerHeight * zoomLevel;
  125. };
  126. // You can also get height of the toolbars that are currently displayed
  127. function getHeightOfIOSToolbars() {
  128. var tH = (window.orientation === 0 ? screen.height : screen.width) - getIOSWindowHeight();
  129. return tH > 1 ? tH : 0;
  130. };
  131. //THIS FUNCTION MANAGES THE CANVAS SCALING TO FIT PROPORTIONALLY THE GAME TO THE CURRENT DEVICE RESOLUTION
  132. function sizeHandler() {
  133. window.scrollTo(0, 1);
  134. if (!document.querySelector("#canvas")){
  135. return;
  136. }
  137. var h;
  138. if(platform.name !== null && platform.name.toLowerCase() === "safari"){
  139. h = getIOSWindowHeight();
  140. } else{
  141. h = getSize("Height");
  142. }
  143. var w = getSize("Width");
  144. if(s_bFocus){
  145. _checkOrientation(w,h);
  146. }
  147. var multiplier = Math.min((h / CANVAS_HEIGHT), (w / CANVAS_WIDTH));
  148. var destW = Math.round( CANVAS_WIDTH * multiplier );
  149. var destH = Math.round( CANVAS_HEIGHT * multiplier );
  150. var iAdd = 0;
  151. if (destH < h){
  152. iAdd = h - destH;
  153. destH += iAdd;
  154. destW += iAdd * (CANVAS_WIDTH / CANVAS_HEIGHT);
  155. } else if (destW < w){
  156. iAdd = w - destW;
  157. destW += iAdd;
  158. destH += iAdd * (CANVAS_HEIGHT / CANVAS_WIDTH);
  159. }
  160. var fOffsetY = ((h / 2) - (destH / 2));
  161. var fOffsetX = ((w / 2) - (destW / 2));
  162. var fGameInverseScaling = (CANVAS_WIDTH / destW);
  163. if (fOffsetX * fGameInverseScaling < - EDGEBOARD_X ||
  164. fOffsetY * fGameInverseScaling < - EDGEBOARD_Y){
  165. multiplier = Math.min(h / (CANVAS_HEIGHT - (EDGEBOARD_Y * 2)), w / (CANVAS_WIDTH - (EDGEBOARD_X * 2)));
  166. destW = Math.round( CANVAS_WIDTH * multiplier );
  167. destH = Math.round( CANVAS_HEIGHT * multiplier );
  168. fOffsetY = (h - destH) / 2;
  169. fOffsetX = (w - destW) / 2;
  170. fGameInverseScaling = (CANVAS_WIDTH / destW);
  171. }
  172. s_iOffsetX = ( - 1 * fOffsetX * fGameInverseScaling);
  173. s_iOffsetY = ( - 1 * fOffsetY * fGameInverseScaling);
  174. if (fOffsetY >= 0){
  175. s_iOffsetY = 0;
  176. }
  177. if (fOffsetX >= 0){
  178. s_iOffsetX = 0;
  179. }
  180. if (s_oInterface !== null){
  181. s_oInterface.refreshButtonPos(s_iOffsetX, s_iOffsetY);
  182. }
  183. if (s_oMenu !== null){
  184. s_oMenu.refreshButtonPos(s_iOffsetX, s_iOffsetY);
  185. }
  186. if (s_oLevelMenu !== null){
  187. s_oLevelMenu.refreshButtonPos(s_iOffsetX, s_iOffsetY);
  188. }
  189. if(s_bIsIphone && s_oStage){
  190. canvas = document.getElementById('canvas');
  191. s_oStage.canvas.width = destW*2;
  192. s_oStage.canvas.height = destH*2;
  193. canvas.style.width = destW+"px";
  194. canvas.style.height = destH+"px";
  195. s_iScaleFactor = Math.min(destW / CANVAS_WIDTH, destH / CANVAS_HEIGHT);
  196. s_iScaleFactor *= 2;
  197. s_oStage.scaleX = s_oStage.scaleY = s_iScaleFactor;
  198. }else if(s_bMobile || isChrome()){
  199. document.querySelector("#canvas").style.width = destW+"px";
  200. document.querySelector("#canvas").style.height = destH+"px";
  201. }else if(s_oStage){
  202. s_oStage.canvas.width = destW;
  203. s_oStage.canvas.height = destH;
  204. s_iScaleFactor = Math.min(destW / CANVAS_WIDTH, destH / CANVAS_HEIGHT);
  205. s_oStage.scaleX = s_oStage.scaleY = s_iScaleFactor;
  206. }
  207. if(fOffsetY >= 0){
  208. fOffsetY = (h - destH)/2;
  209. }
  210. document.querySelector("#canvas").style.top = fOffsetY+"px";
  211. document.querySelector("#canvas").style.left = fOffsetX+"px";
  212. fullscreenHandler();
  213. };
  214. function createBitmap(oSprite, iWidth, iHeight){
  215. var oBmp = new createjs.Bitmap(oSprite);
  216. var hitObject = new createjs.Shape();
  217. if (iWidth && iHeight){
  218. hitObject.graphics.beginFill("#fff").drawRect(0, 0, iWidth, iHeight);
  219. } else{
  220. hitObject.graphics.beginFill("#ff0").drawRect(0, 0, oSprite.width, oSprite.height);
  221. }
  222. oBmp.hitArea = hitObject;
  223. return oBmp;
  224. }
  225. function _checkOrientation(iWidth,iHeight){
  226. if(s_bMobile && ENABLE_CHECK_ORIENTATION){
  227. if( iWidth>iHeight ){
  228. if( document.querySelector(".orientation-msg-container").getAttribute("data-orientation") === "landscape" ){
  229. document.querySelector(".orientation-msg-container").style.display = "none";
  230. s_oMain.startUpdate();
  231. }else{
  232. document.querySelector(".orientation-msg-container").style.display = "block";
  233. s_oMain.stopUpdate();
  234. }
  235. }else{
  236. if( document.querySelector(".orientation-msg-container").getAttribute("data-orientation") === "portrait" ){
  237. document.querySelector(".orientation-msg-container").style.display = "none";
  238. s_oMain.startUpdate();
  239. }else{
  240. document.querySelector(".orientation-msg-container").style.display = "block";
  241. s_oMain.stopUpdate();
  242. }
  243. }
  244. }
  245. }
  246. function createSprite(oSpriteSheet, szState, iRegX, iRegY, iWidth, iHeight){
  247. if (szState !== null){
  248. var oRetSprite = new createjs.Sprite(oSpriteSheet, szState);
  249. } else{
  250. var oRetSprite = new createjs.Sprite(oSpriteSheet);
  251. }
  252. var hitObject = new createjs.Shape();
  253. hitObject.graphics.beginFill("#000000").drawRect( - iRegX, - iRegY, iWidth, iHeight);
  254. oRetSprite.hitArea = hitObject;
  255. return oRetSprite;
  256. }
  257. function randomFloatBetween(minValue, maxValue, precision){
  258. if (typeof (precision) === 'undefined'){
  259. precision = 2;
  260. }
  261. return parseFloat(Math.min(minValue + (Math.random() * (maxValue - minValue)), maxValue).toFixed(precision));
  262. }
  263. function formatTime(iTime){
  264. iTime /= 1000;
  265. var iMins = Math.floor(iTime / 60);
  266. var iSecs = Math.floor(iTime - (iMins * 60));
  267. //iSecs = parseFloat(iSecs).toFixed(1)
  268. var szRet = "";
  269. if (iMins < 10){
  270. szRet += "0" + iMins + ":";
  271. } else{
  272. szRet += iMins + ":";
  273. }
  274. if (iSecs < 10){
  275. szRet += "0" + iSecs;
  276. } else{
  277. szRet += iSecs;
  278. }
  279. return szRet;
  280. }
  281. function NoClickDelay(el) {
  282. this.element = el;
  283. if (window.Touch) this.element.addEventListener('touchstart', this, false);
  284. }
  285. //Fisher-Yates Shuffle
  286. function shuffle(array) {
  287. var counter = array.length, temp, index;
  288. // While there are elements in the array
  289. while (counter > 0) {
  290. // Pick a random index
  291. index = Math.floor(Math.random() * counter);
  292. // Decrease counter by 1
  293. counter--;
  294. // And swap the last element with it
  295. temp = array[counter];
  296. array[counter] = array[index];
  297. array[index] = temp;
  298. }
  299. return array;
  300. }
  301. NoClickDelay.prototype = {
  302. handleEvent: function(e) {
  303. switch (e.type) {
  304. case 'touchstart': this.onTouchStart(e); break;
  305. case 'touchmove': this.onTouchMove(e); break;
  306. case 'touchend': this.onTouchEnd(e); break;
  307. }
  308. },
  309. onTouchStart: function(e) {
  310. e.preventDefault();
  311. this.moved = false;
  312. this.element.addEventListener('touchmove', this, false);
  313. this.element.addEventListener('touchend', this, false);
  314. },
  315. onTouchMove: function(e) {
  316. this.moved = true;
  317. },
  318. onTouchEnd: function(e) {
  319. this.element.removeEventListener('touchmove', this, false);
  320. this.element.removeEventListener('touchend', this, false);
  321. if (!this.moved) {
  322. var theTarget = document.elementFromPoint(e.changedTouches[0].clientX, e.changedTouches[0].clientY);
  323. if (theTarget.nodeType == 3) theTarget = theTarget.parentNode;
  324. var theEvent = document.createEvent('MouseEvents');
  325. theEvent.initEvent('click', true, true);
  326. theTarget.dispatchEvent(theEvent);
  327. }
  328. }
  329. };
  330. function toRadian(n) {
  331. return ((n) * (Math.PI / 180));
  332. }
  333. function toDegree(n) {
  334. return ((n) * (180 / Math.PI));
  335. }
  336. function ctlArcadeResume(){
  337. if (s_oMain !== null){
  338. s_oMain.startUpdate();
  339. }
  340. }
  341. function ctlArcadePause(){
  342. if (s_oMain !== null){
  343. s_oMain.stopUpdate();
  344. }
  345. }
  346. function getParamValue(paramName){
  347. var url = window.location.search.substring(1);
  348. var qArray = url.split('&');
  349. for (var i = 0; i < qArray.length; i++)
  350. {
  351. var pArr = qArray[i].split('=');
  352. if (pArr[0] == paramName)
  353. return pArr[1];
  354. }
  355. }
  356. function playSound(szSound,iVolume,bLoop){
  357. if(DISABLE_SOUND_MOBILE === false || s_bMobile === false){
  358. s_aSounds[szSound].play();
  359. s_aSounds[szSound].volume(iVolume);
  360. s_aSounds[szSound].loop(bLoop);
  361. return s_aSounds[szSound];
  362. }
  363. return null;
  364. }
  365. function stopSound(szSound){
  366. if(DISABLE_SOUND_MOBILE === false || s_bMobile === false){
  367. s_aSounds[szSound].stop();
  368. }
  369. }
  370. function setVolume(szSound, iVolume){
  371. if(DISABLE_SOUND_MOBILE === false || s_bMobile === false){
  372. s_aSounds[szSound].volume(iVolume);
  373. }
  374. }
  375. function setMute(szSound, bMute){
  376. if(DISABLE_SOUND_MOBILE === false || s_bMobile === false){
  377. s_aSounds[szSound].mute(bMute);
  378. }
  379. }
  380. (function() {
  381. var hidden = "hidden";
  382. // Standards:
  383. if (hidden in document)
  384. document.addEventListener("visibilitychange", onchange);
  385. else if ((hidden = "mozHidden") in document)
  386. document.addEventListener("mozvisibilitychange", onchange);
  387. else if ((hidden = "webkitHidden") in document)
  388. document.addEventListener("webkitvisibilitychange", onchange);
  389. else if ((hidden = "msHidden") in document)
  390. document.addEventListener("msvisibilitychange", onchange);
  391. // IE 9 and lower:
  392. else if ('onfocusin' in document)
  393. document.onfocusin = document.onfocusout = onchange;
  394. // All others:
  395. else
  396. window.onpageshow = window.onpagehide
  397. = window.onfocus = window.onblur = onchange;
  398. function onchange (evt) {
  399. var v = 'visible', h = 'hidden',
  400. evtMap = {
  401. focus:v, focusin:v, pageshow:v, blur:h, focusout:h, pagehide:h
  402. };
  403. evt = evt || window.event;
  404. if (evt.type in evtMap){
  405. document.body.className = evtMap[evt.type];
  406. }else{
  407. document.body.className = this[hidden] ? "hidden" : "visible";
  408. if(document.body.className === "hidden"){
  409. s_oMain.stopUpdate();
  410. s_bFocus = false;
  411. }else{
  412. s_oMain.startUpdate();
  413. s_bFocus = true;
  414. }
  415. }
  416. }
  417. })();
  418. function fullscreenHandler(){
  419. if (!ENABLE_FULLSCREEN || !screenfull.isEnabled){
  420. return;
  421. }
  422. s_bFullscreen = screenfull.isFullscreen;
  423. if (s_oInterface !== null){
  424. s_oInterface.resetFullscreenBut();
  425. }
  426. if (s_oMenu !== null){
  427. s_oMenu.resetFullscreenBut();
  428. }
  429. }
  430. if (screenfull.isEnabled) {
  431. screenfull.on('change', function(){
  432. s_bFullscreen = screenfull.isFullscreen;
  433. if (s_oInterface !== null){
  434. s_oInterface.resetFullscreenBut();
  435. }
  436. if (s_oMenu !== null){
  437. s_oMenu.resetFullscreenBut();
  438. }
  439. });
  440. }
  441. function saveItem(szItem,oValue){
  442. if(s_bStorageAvailable){
  443. localStorage.setItem(szItem, oValue);
  444. }
  445. }
  446. function getItem(szItem){
  447. if(s_bStorageAvailable){
  448. return localStorage.getItem(szItem);
  449. }
  450. return null;
  451. }