CENTER DRIVEN Command & Conquer TA PvP Quick Map: Commander Edition

Creates a detailed map of bases and pois of the alliance and enemies.

  1. // ==UserScript==
  2. // @name CENTER DRIVEN Command & Conquer TA PvP Quick Map: Commander Edition
  3. // @description Creates a detailed map of bases and pois of the alliance and enemies.
  4. // @namespace https://prodgame*.alliances.commandandconquer.com/*/index.aspx*
  5. // @include https://prodgame*.alliances.commandandconquer.com/*/index.aspx*
  6. // @version 1.5.2b
  7. // @grant none
  8. // @author UPDATED by XDAAST | Orinially by zdoom and Bluepix
  9. // ==/UserScript==
  10.  
  11. (function(){
  12.  
  13. function create_cdccta_map_class()
  14. {
  15. qx.Class.define("cdccta_map",
  16. {
  17. type: "singleton",
  18. extend: qx.core.Object,
  19. construct: function()
  20. {
  21. try
  22. {
  23. var root = this;
  24. var mapButton = new qx.ui.form.Button('PvP Quick Map').set({ enabled: false });
  25. var app = qx.core.Init.getApplication();
  26. var optionsBar = app.getOptionsBar().getLayoutParent();
  27. this.__mapButton = mapButton;
  28. optionsBar.getChildren()[0].getChildren()[2].addAt(mapButton,1);
  29. var onReady = function()
  30. {
  31. console.log('checking if data is ready');
  32. var alliance = ClientLib.Data.MainData.GetInstance().get_Alliance().get_Relationships;
  33. var world = ClientLib.Data.MainData.GetInstance().get_World();
  34. var endGame = ClientLib.Data.MainData.GetInstance().get_EndGame().get_Hubs().d;
  35. var command = ClientLib.Net.CommunicationManager.GetInstance().SendSimpleCommand;
  36. var delegate = phe.cnc.Util.createEventDelegate;
  37. if(!!alliance && !!world && !!command && !!delegate && !!endGame)
  38. {
  39. var worldWidth = world.get_WorldWidth();
  40. if(!worldWidth) return;
  41. var factor = 500 / worldWidth;
  42. var hubs = [], fortress = [];
  43. for (var index in endGame)
  44. {
  45. var currentHub = endGame[index];
  46. if (currentHub.get_Type() == 1) hubs.push([(currentHub.get_X() + 2) * factor, (currentHub.get_Y() + 2) * factor]);
  47. if (currentHub.get_Type() == 3) fortress = [(currentHub.get_X() + 2) * factor, (currentHub.get_Y() + 2) * factor];
  48. }
  49. if (hubs.length > 0)
  50. {
  51. timer.stop();
  52. root.__factor = factor;
  53. root.__endGame['hubs'] = hubs;
  54. root.__endGame['fortress'] = fortress;
  55. root.__init();
  56. }
  57. console.log(hubs);
  58. }
  59. console.log(!!alliance, !!world, !!command, !!delegate, !!endGame);
  60. };
  61. var timer = new qx.event.Timer(1000);
  62. timer.addListener('interval', onReady, this);
  63. timer.start();
  64. }
  65. catch(e)
  66. {
  67. console.log(e.toString());
  68. }
  69. console.log('cdccta_map initialization completed');
  70. },
  71. destruct: function(){},
  72. members:
  73. {
  74. __mapButton: null,
  75. __allianceExist: null,
  76. __allianceName: null,
  77. __allianceId: null,
  78. __allianceHasRelations: false,
  79. __defaultAlliances: null,
  80. __selectedAlliances: null,
  81. __data: null,
  82. __totalProcesses: null,
  83. __completedProcesses: 0,
  84. __endGame: {},
  85. __isLoading: false,
  86. __factor: null,
  87. __init: function()
  88. {
  89. try
  90. {
  91. var root = this;
  92. var data = ClientLib.Data.MainData.GetInstance();
  93. var alliance_data = data.get_Alliance();
  94. var alliance_exists = alliance_data.get_Exists();
  95. if(alliance_exists)
  96. {
  97. var alliance_name = alliance_data.get_Name();
  98. var alliance_id = alliance_data.get_Id();
  99. var alliance_relations = alliance_data.get_Relationships();
  100. this.__allianceExist = true;
  101. this.__allianceId = alliance_id;
  102. this.__allianceName = alliance_name;
  103. var selectedAlliancesList = [];
  104. selectedAlliancesList[0] = [alliance_id, 'alliance', alliance_name, 0];
  105. if (alliance_relations != null)
  106. {
  107. this.__allianceHasRelations = true;
  108. alliance_relations.map(function(x)
  109. {
  110. var type = x.Relationship, id = x.OtherAllianceId, name = x.OtherAllianceName;
  111. if ((type == 3) && (selectedAlliancesList.length < 9)) selectedAlliancesList.push([id, 'enemy', name, 0]);
  112. });
  113. }
  114. this.__defaultAlliances = selectedAlliancesList;
  115. }
  116. else
  117. {
  118. this.__allianceExist = false;
  119. }
  120. if (typeof(Storage) !== 'undefined' && typeof(localStorage.cdccta_map_settings) !== 'undefined')
  121. {
  122. this.__selectedAlliances = JSON.parse(localStorage.cdccta_map_settings);
  123. }
  124. this.__mapButton.setEnabled(true);
  125. this.__mapButton.addListener('execute', function()
  126. {
  127. root.getData();
  128. cdccta_map.container.getInstance().open(1);
  129. }, this);
  130. }
  131. catch(e)
  132. {
  133. console.log(e.toString());
  134. }
  135. },
  136. getData: function()
  137. {
  138. if (this.__isLoading === true) return;
  139. this.__isLoading = true;
  140. var arr = (this.__selectedAlliances == null) ? this.__defaultAlliances : this.__selectedAlliances;
  141. if(arr != null)
  142. {
  143. this.__data = [];
  144. this.__totalProcesses = arr.length;
  145. for(var i = 0; i < arr.length; i++)
  146. {
  147. this.__getAlliance(arr[i][0], arr[i][1], arr[i][3]);
  148. }
  149. }
  150. },
  151. __getAlliance: function(aid, type, color)
  152. {
  153. try
  154. {
  155. var alliance = {}, root = this, factor = this.__factor;
  156. alliance.id = aid;
  157. alliance.players = {};
  158. var totalProcesses = this.__totalProcesses;
  159. var getBases = function(pid, pn, p, tp)
  160. {
  161. ClientLib.Net.CommunicationManager.GetInstance().SendSimpleCommand("GetPublicPlayerInfo", { id: pid },
  162. phe.cnc.Util.createEventDelegate(ClientLib.Net.CommandResult, this, function(context, data)
  163. {
  164. if (data.c != null)
  165. {
  166. var totalBases = data.c.length;
  167. var player = {};
  168. var bases = [];
  169. for (var b = 0; b < data.c.length; b++)
  170. {
  171. var id = data.c[b].i;
  172. var name = data.c[b].n;
  173. var x = data.c[b].x * factor;
  174. var y = data.c[b].y * factor;
  175. bases.push([x, y, name, id]);
  176. if((p == tp - 1) && (b == totalBases - 1))
  177. {
  178. root.__completedProcesses++;
  179. var loader = cdccta_map.container.getInstance().loader;
  180. loader.setValue('Loading: ' + root.__completedProcesses + "/" + totalProcesses);
  181. }
  182. if(root.__completedProcesses == totalProcesses) root.__onProcessComplete();
  183. }
  184. player.id = pid;
  185. player.name = pn;
  186. player.bases = bases;
  187. alliance.players[pn] = player;
  188. }
  189. }), null);
  190. };
  191. ClientLib.Net.CommunicationManager.GetInstance().SendSimpleCommand("GetPublicAllianceInfo", { id: aid },
  192. phe.cnc.Util.createEventDelegate(ClientLib.Net.CommandResult, this, function(context, data)
  193. {
  194. if (data == null) return;
  195. if (data.opois != null)
  196. {
  197. var pois = [];
  198. data.opois.map(function(poi)
  199. {
  200. pois.push({'i': poi.i, 'l': poi.l, 't': poi.t, 'x': poi.x * factor, 'y': poi.y * factor});
  201. });
  202. alliance.pois = pois;
  203. }
  204. if (data.n != null) alliance.name = data.n;
  205. if (data.m != null)
  206. {
  207. for (var p = 0; p < data.m.length; p++)
  208. {
  209. var playerName = data.m[p].n;
  210. var playerId = data.m[p].i;
  211. getBases(playerId, playerName, p, data.m.length);
  212. }
  213. root.__data.push([alliance, type, color]);
  214. }
  215. }), null);
  216. }
  217. catch(e)
  218. {
  219. console.log(e.toString());
  220. }
  221. },
  222. __onProcessComplete: function()
  223. {
  224. console.log('process completed - alliances data has been generated', this.__data);
  225. this.__isLoading = false;
  226. var win = cdccta_map.container.getInstance();
  227. win.receivedData = this.__data;
  228. win.__updateList();
  229. win.drawCanvas();
  230. win.loader.setValue('Completed');
  231. this.__totalProcess = null;
  232. this.__completedProcesses = 0;
  233. setTimeout(function(){
  234. win.loader.setValue('');
  235. }, 3000);
  236. }
  237. }
  238. });
  239. qx.Class.define("cdccta_map.container",
  240. {
  241. type: "singleton",
  242. extend: qx.ui.container.Composite,
  243. construct: function()
  244. {
  245. try
  246. {
  247. this.base(arguments);
  248. this.setLayout(new qx.ui.layout.Canvas);
  249. var worldWidth = ClientLib.Data.MainData.GetInstance().get_World().get_WorldWidth();
  250. var factor = 500 / worldWidth;
  251. this.__factor = factor;
  252. var zoomIn = new qx.ui.form.Button('+').set({ width: 30 });
  253. var zoomOut = new qx.ui.form.Button('-').set({ width: 30, enabled: false });
  254. var zoomReset = new qx.ui.form.Button('R').set({ width: 30, enabled: false });
  255. var grid = new qx.ui.container.Composite(new qx.ui.layout.Grid(3,1));
  256. var info = new qx.ui.container.Composite(new qx.ui.layout.VBox()).set({ minHeight: 300, padding: 10 });
  257. var canvasContainer = new qx.ui.container.Composite(new qx.ui.layout.VBox(1)).set({width:500, height:500});
  258. var rightBar = new qx.ui.container.Composite(new qx.ui.layout.VBox(10));
  259. var leftBar = new qx.ui.container.Composite(new qx.ui.layout.VBox(10));
  260. var widget = new qx.ui.core.Widget().set({ width: 900, height: 800 });
  261. var div = new qx.html.Element('div', null, {id: 'canvasContainer'});
  262. var li1 = new qx.ui.form.ListItem('All', null, "all");
  263. var li2 = new qx.ui.form.ListItem('My Bases', null, "bases");
  264. var li3 = new qx.ui.form.ListItem('My Alliance', null, "alliance");
  265. var li4 = new qx.ui.form.ListItem('Selected', null, "selected");
  266. var displayMode = new qx.ui.form.SelectBox().set({ height: 28 });
  267. displayMode.add(li1);
  268. displayMode.add(li2);
  269. displayMode.add(li3);
  270. displayMode.add(li4);
  271. var zoomBar = new qx.ui.container.Composite(new qx.ui.layout.HBox(15));
  272. var bothOpt = new qx.ui.form.RadioButton('Both').set({ model: "both" });
  273. var basesOpt = new qx.ui.form.RadioButton('Base').set({ model: "bases" });;
  274. var poisOpt = new qx.ui.form.RadioButton('Poi').set({ model: "pois" });
  275. var displayOptions = new qx.ui.form.RadioButtonGroup().set({ layout: new qx.ui.layout.HBox(), font :'font_size_11' });
  276. displayOptions.add(bothOpt);
  277. displayOptions.add(basesOpt);
  278. displayOptions.add(poisOpt);
  279. var allianceList = new qx.ui.form.List().set({ font :'font_size_11', height: 215 });
  280. var editAlliance = new qx.ui.form.Button('Edit Alliances').set({toolTipText:"Change the Alliances shown on Map", width:100, alignY:"top"});
  281. var label = new qx.ui.basic.Label('Transparency');
  282. var slider = new qx.ui.form.Slider().set({ minimum: 30, maximum: 100, value: 100 });
  283. var coordsField = new qx.ui.form.TextField().set({maxWidth: 100, textAlign: 'center', readOnly: 'true', alignX: 'center'});
  284. var loader = new qx.ui.basic.Label().set({ marginTop: 100 });
  285. grid.set({ minWidth: 1500, backgroundColor: '#0b2833', minHeight: 524, margin: 3, paddingTop: 10 });
  286. rightBar.set({ maxWidth: 200, minWidth: 130, paddingTop: 30, paddingRight: 10 });
  287. leftBar.set({ maxWidth: 200, minWidth: 130, paddingTop: 30, paddingLeft: 10 });
  288. var hints = [[zoomIn,'Zoom in'], [zoomOut,'Zoom out'], [zoomReset,'Restet zoom'], [basesOpt,'Show bases only'] , [poisOpt,'Show POIs only'], [bothOpt,'Show bases and POIs']]
  289. for(var i = 0; i < hints.length; i++)
  290. {
  291. var tooltip = new qx.ui.tooltip.ToolTip(hints[i][1]);
  292. hints[i][0].setToolTip(tooltip);
  293. }
  294. zoomBar.add(zoomIn);
  295. zoomBar.add(zoomOut);
  296. zoomBar.add(zoomReset);
  297. rightBar.add(zoomBar);
  298. rightBar.add(displayMode);
  299. rightBar.add(displayOptions);
  300. rightBar.add(allianceList);
  301. rightBar.add(editAlliance);
  302. rightBar.add(label);
  303. rightBar.add(slider);
  304. leftBar.add(coordsField);
  305. leftBar.add(info);
  306. leftBar.add(loader);
  307. canvasContainer.add(widget);
  308. widget.getContentElement().add(div);
  309. grid.add(leftBar, {row: 1, column: 1});
  310. grid.add(rightBar, {row: 1, column: 3});
  311. grid.add(canvasContainer, {row: 1, column: 2});
  312. this.info = info;
  313. this.coordsField = coordsField;
  314. this.allianceList = allianceList;
  315. this.panel = [zoomOut, zoomReset, zoomIn, displayOptions, displayMode, allianceList, editAlliance];
  316. this.loader = loader;
  317. this.zoomIn = zoomIn;
  318. this.zoomOut = zoomOut;
  319. this.zoomReset = zoomReset;
  320. //canvas
  321. var cont = document.createElement('div'),
  322. mask = document.createElement('div'),
  323. canvas = document.createElement('canvas'),
  324. ctx = canvas.getContext("2d"),
  325. root = this;
  326. cont.style.width = '500px';
  327. cont.style.height = '500px';
  328. cont.style.position = 'absolute';
  329. cont.style.overflow = 'hidden';
  330. cont.style.backgroundColor = '#0b2833';
  331. cont.style.showMinimize = !1;
  332. cont.style.showMaximize = !0;
  333. cont.style.alwaysOnTop = !1;
  334. canvas.style.position = 'absolute';
  335. canvas.style.backgroundColor = '#0b2833';
  336. canvas.style.showMinimize = !1;
  337. canvas.style.showMaximize = !0;
  338. canvas.style.alwaysOnTop = !1;
  339. mask.style.position = 'absolute';
  340. mask.style.width = '500px';
  341. mask.style.height = '500px';
  342. mask.style.background = 'url("") center center no-repeat';
  343. this.canvas = canvas;
  344. this.mask = mask;
  345. this.ctx = ctx;
  346. var __zoomIn = function(){ if (root.scale < 12) root.__scaleMap('up') };
  347. var __zoomOut = function(){if (root.scale > 1) root.__scaleMap('down') };
  348. var __zoomReset = function()
  349. {
  350. canvas.width = 500;
  351. canvas.height = 500;
  352. canvas.style.left = 0;
  353. canvas.style.top = 0;
  354. root.scale = 1;
  355. root.drawCanvas();
  356. zoomIn.setEnabled(true);
  357. zoomOut.setEnabled(false);
  358. zoomReset.setEnabled(false);
  359. };
  360. cont.appendChild(canvas);
  361. cont.appendChild(mask);
  362. root.__draggable(mask);
  363. root.resetMap();
  364. slider.addListener('changeValue', function(e)
  365. {
  366. if (e.getData())
  367. {
  368. var val = e.getData() / 100;
  369. this.setOpacity(val);
  370. slider.setToolTipText(" " + val * 100 + "% ");
  371. }
  372. }, this);
  373. allianceList.addListener('changeSelection', function(e)
  374. {
  375. if ((root.__displayM == "bases") || (root.__displayM == "alliance") || !e.getData()[0]) return;
  376. var aid = e.getData()[0].getModel();
  377. root.__selectedA = aid;
  378. root.drawCanvas();
  379. }, this);
  380. displayMode.addListener('changeSelection', function(e)
  381. {
  382. var dm = e.getData()[0].getModel();
  383. root.__displayM = dm;
  384. root.__updateList();
  385. if(dm == "bases")
  386. {
  387. displayOptions.setSelection([basesOpt]);
  388. poisOpt.setEnabled(false);
  389. bothOpt.setEnabled(false);
  390. root.__displayO = "bases";
  391. }
  392. else
  393. {
  394. if(!poisOpt.isEnabled()) poisOpt.setEnabled(true);
  395. if(!bothOpt.isEnabled()) bothOpt.setEnabled(true);
  396. displayOptions.setSelection([bothOpt]);
  397. root.__displayO = "both";
  398. }
  399. root.drawCanvas();
  400. }, this);
  401. displayOptions.addListener('changeSelection', function(e)
  402. {
  403. if (!e.getData()[0]) return;
  404. var dop = e.getData()[0].getModel();
  405. root.__displayO = dop;
  406. root.drawCanvas();
  407. }, this);
  408. editAlliance.addListener('execute', function()
  409. {
  410. cdccta_map.options.getInstance().open();
  411. }, this);
  412. var desktop = qx.core.Init.getApplication().getDesktop();
  413. desktop.addListener('resize', this._onResize, this);
  414. zoomIn.addListener('execute', __zoomIn, this);
  415. zoomOut.addListener('execute', __zoomOut, this);
  416. zoomReset.addListener('execute', __zoomReset, this);
  417. this.add(grid);
  418. this.wdgAnchor = new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_tl1.png").set({ width: 3, height: 32 });
  419. this.__imgTopRightCorner = new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_tr.png").set({ width: 34, height: 35 });
  420. this._add(this.__imgTopRightCorner, { right: 0, top: 0, bottom: 28 });
  421. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_r.png").set({ width: 3, height: 1, allowGrowY: true, scale: true }), { right: 0, top: 35, bottom: 29 });
  422. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_br.png").set({ width: 5, height: 28, allowGrowY: true, scale: true }), { right: 0, bottom: 0 });
  423. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_b.png").set({ width: 1, height: 3, allowGrowX: true, scale: true }), { right: 5, bottom:0, left: 5 });
  424. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_bl.png").set({ width: 5, height: 29 }), { left: 0, bottom: 0 });
  425. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_l.png").set({ width: 3, height: 1, allowGrowY: true, scale: true }), { left: 0, bottom: 29, top: 32 });
  426. this._add(this.wdgAnchor, { left: 0, top: 0 });
  427. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_tl2.png").set({ width: 25, height: 5 }), { left: 3, top: 0 });
  428. this._add(new qx.ui.basic.Image("webfrontend/ui/common/frame_basewin/frame_basewindow_t.png").set({ width: 1, height: 3, allowGrowX: true, scale: true }), { left: 28, right: 34, top: 0 });
  429. this.__btnClose = new webfrontend.ui.SoundButton(null, "FactionUI/icons/icon_close_button.png").set({ appearance: "button-close", width: 23, height: 23, toolTipText: this.tr("tnf:close base view") });
  430. this.__btnClose.addListener("execute", this._onClose, this);
  431. this._add(this.__btnClose, { top: 6, right: 5 });
  432. var onLoaded = function()
  433. {
  434. var counter = 0;
  435. var check = function()
  436. {
  437. if(counter > 60) return;
  438. var htmlDiv = document.getElementById('canvasContainer');
  439. (htmlDiv) ? htmlDiv.appendChild(cont) : setTimeout(check, 1000);
  440. console.log('retrying check for canvasContainer is loaded');
  441. counter++;
  442. };
  443. check();
  444. };
  445. onLoaded();
  446. }
  447. catch(e)
  448. {
  449. console.log(e.toString());
  450. }
  451. console.log('container creation completed');
  452. },
  453. destruct: function(){},
  454. members:
  455. {
  456. info: null,
  457. coordsField: null,
  458. panel: null,
  459. loader: null,
  460. canvas: null,
  461. mask: null,
  462. ctx: null,
  463. receivedData: null,
  464. allianceList: null,
  465. circles: [53, 85, 113, 145, 242],
  466. scale: 1,
  467. selectedBase: false,
  468. elements: [],
  469. locations: [],
  470. inProgress: false,
  471. isRadarVisible: false,
  472. __interval: null,
  473. __pointerX: null,
  474. __pointerY: null,
  475. __selectedA: null,
  476. __selectedB: null,
  477. __displayM: "all",
  478. __displayO: "both",
  479. __factor: null,
  480. __setInfo: function(base)
  481. {
  482. try
  483. {
  484. // console.log(base);
  485. var info = this.info;
  486. info.removeAll();
  487. if(!base) return;
  488. for ( var i = 0; i < base.length; i++)
  489. {
  490. var title = new qx.ui.basic.Label(base[i][0]).set({font: 'font_size_13_bold', textColor: '#FFFFFF'});
  491. var value = new qx.ui.basic.Label(base[i][1]).set({font: 'font_size_11', textColor: '#FFFFFF', marginBottom: 5});
  492. info.add(title);
  493. info.add(value);
  494. }
  495. }
  496. catch(e)
  497. {
  498. console.log(e.toString());
  499. }
  500. },
  501. __createLayout: function()
  502. {
  503. var s = this.scale, circles = this.circles, ctx = this.ctx;
  504. for (var i = 0; i < circles.length; i++) {
  505. var r = circles[i];
  506. ctx.beginPath();
  507. ctx.arc(250, 250, r, 0, Math.PI * 2, true);
  508. ctx.lineWidth = (i == 4) ? 1/s : 0.3/s;
  509. ctx.strokeStyle = '#8ce9ef';
  510. ctx.stroke();
  511. ctx.closePath();
  512. }
  513. for(var i = 0; i < 8; i++){
  514. var r = circles[4], a = (Math.PI * i / 4) - Math.PI / 8;
  515. ctx.beginPath();
  516. ctx.moveTo(250,250);
  517. ctx.lineTo((r * Math.cos(a)) + 250, (r * Math.sin(a)) + 250);
  518. ctx.lineWidth = 0.3/s;
  519. ctx.strokeStyle = '#8ce9ef';
  520. ctx.stroke();
  521. ctx.closePath();
  522. }
  523. var endGame = cdccta_map.getInstance().__endGame, hubs = endGame.hubs, fortress = endGame.fortress;
  524. var fortressX = fortress[0];
  525. var fortressY = fortress[1];
  526. var grd = ctx.createLinearGradient(fortressX, fortressY - 0.5, fortressX, fortressY + 0.5);
  527. grd.addColorStop(0, 'rgba(200, 228, 228, 0.5)');
  528. grd.addColorStop(1, 'rgba(170, 214, 118, 0.5)');
  529. ctx.beginPath();
  530. ctx.arc(fortressX - 0.2, fortressY - 0.2, 1, 0, Math.PI * 2, true);
  531. ctx.fillStyle = grd;
  532. ctx.lineWidth = 0.1;
  533. ctx.strokeStyle = '#a5fe6a';
  534. ctx.fill();
  535. ctx.stroke();
  536. ctx.closePath();
  537. for(var i = 0; i < hubs.length; i++)
  538. {
  539. var c = 'rgba(200, 228, 228, 0.5)', d = 'rgba(170, 214, 118, 0.5)', l = 1.3, b = 0.1;
  540. var x = hubs[i][0];
  541. var y = hubs[i][1];
  542. var grd = ctx.createLinearGradient(x, y, x, y+l);
  543. grd.addColorStop(0, c);
  544. grd.addColorStop(1, d);
  545. ctx.beginPath();
  546. ctx.rect(x-b, y-b, l, l);
  547. ctx.fillStyle = grd;
  548. ctx.fill();
  549. ctx.strokeStyle = '#a5fe6a';
  550. ctx.lineWidth = b;
  551. ctx.stroke();
  552. ctx.closePath();
  553. }
  554. },
  555. __createAlliance: function(name, data, type, color)
  556. {
  557. try
  558. {
  559. this.inProgress = true;
  560. var colors = {
  561. "bases": {"alliance":[["#86d3fb","#75b7d9"]], "owner":[["#ffc48b","#d5a677"]], "enemy":[["#ff8e8b","#dc7a78"],['#e25050','#cc2d2d'],['#93b7f8','#527ef2'],['#d389aa','#b14e69']], "nap":[["#ffffff","#cccccc"]], "selected":[["#ffe50e", "#d7c109"]], "ally":[["#6ce272", "#5fc664"],['#d4e17e','#b3ca47'],['#92f8f2','#52f2e8'],['#1cba1c','#108510']]},
  562. "pois": [["#add2a8","#6db064"], ["#75b9da","#4282bd"], ["#abd2d6","#6bafb7"], ["#e2e0b7","#ccc880"], ["#e5c998","#d09e53"], ["#d4a297","#b35a54"], ["#afa3b1","#755f79"]]
  563. };
  564. var owner = ClientLib.Data.MainData.GetInstance().get_Player().name, ctx = this.ctx, factor = this.__factor;
  565. var dop = this.__displayO, dmd = this.__displayM, root = this, s = this.scale;
  566. var r = (s < 3) ? 0.65 : (s > 3) ? 0.35 : 0.5;
  567. var createBase = function (x, y, bt, clr)
  568. {
  569. var c = colors.bases[bt][clr][0], d = colors.bases[bt][clr][1];
  570. var grd=ctx.createLinearGradient(x, y-r, x, y+r);
  571. grd.addColorStop(0, c);
  572. grd.addColorStop(1, d);
  573. ctx.beginPath();
  574. ctx.arc(x, y, r, 0, Math.PI * 2, true);
  575. ctx.closePath();
  576. ctx.fillStyle = grd;
  577. ctx.fill();
  578. ctx.lineWidth = 0.1;
  579. ctx.strokeStyle = '#000000';
  580. ctx.stroke();
  581. ctx.closePath();
  582. };
  583. var createPoi = function(x, y, t)
  584. {
  585. var c = colors.pois[t][0], d = colors.pois[t][1];
  586. var grd = ctx.createLinearGradient(x, y-r, x, y+r);
  587. grd.addColorStop(0, c);
  588. grd.addColorStop(1, d);
  589. ctx.beginPath();
  590. ctx.rect(x-r, y-r, r*2, r*2);
  591. ctx.fillStyle = grd;
  592. ctx.fill();
  593. ctx.strokeStyle = "#000000";
  594. ctx.lineWidth = 0.1;
  595. ctx.stroke();
  596. ctx.closePath();
  597. };
  598. if (dop != "pois")
  599. {
  600. for (var player in data.players) {
  601. for (var i = 0; i < data.players[player].bases.length; i++){
  602. var b = data.players[player].bases[i], pid = data.players[player].id;
  603. if(dmd == "bases")
  604. {
  605. if (player == owner)
  606. {
  607. this.elements.push({"x":b[0],"y":b[1],"an":name,"pn":player,"bn":b[2],"bi":b[3],"ai":data.id,"pi":pid,"type":"base"});
  608. this.locations.push([b[0]/factor, b[1]/factor]);
  609. createBase(b[0], b[1], 'owner', 0);
  610. }
  611. }
  612. else
  613. {
  614. this.elements.push({"x":b[0],"y":b[1],"an":name,"pn":player,"bn":b[2],"bi":b[3],"ai":data.id,"pi":pid,"type":"base"});
  615. this.locations.push([b[0]/factor, b[1]/factor]);
  616. (player == owner) ? createBase(b[0], b[1], 'owner', 0) : createBase(b[0], b[1], type, color);
  617. }
  618. }
  619. }
  620. }
  621. if (dop != "bases")
  622. {
  623. for (var i = 0; i < data.pois.length; i++){
  624. var x = data.pois[i].x, y = data.pois[i].y, t = data.pois[i].t, l = data.pois[i].l;
  625. createPoi(x, y, t - 2);
  626. this.elements.push({"x": x, "y": y, "an": name, "ai": data.id, "t": t, "l": l});
  627. this.locations.push([x/factor, y/factor]);
  628. }
  629. }
  630. this.inProgress = false;
  631. }
  632. catch(e)
  633. {
  634. console.log(e.toString());
  635. }
  636. },
  637. __draggable: function(mask)
  638. {
  639. try
  640. {
  641. var start, end, initCoords = [], selectedBase = false, root = this, canvas = this.canvas, c = 0;
  642. var factor = root.__factor;
  643. var displayBaseInfo = function()
  644. {
  645. try
  646. {
  647. if (!selectedBase || root.inProgress) return;
  648. var base = [];
  649. var pois = ['Tiberium', 'Crystal', 'Reactor', 'Tungesten', 'Uranium', 'Aircraft Guidance', 'Resonater'];
  650. for ( var i in selectedBase)
  651. {
  652. var txt = "", val = "";
  653. switch(i)
  654. {
  655. case "an": txt = "Alliance: "; val = selectedBase[i]; break;
  656. case "bn": txt = "Base : "; val = selectedBase[i]; break;
  657. case "pn": txt = "Player : "; val = selectedBase[i]; break;
  658. case "l" : txt = "Level : "; val = selectedBase[i]; break;
  659. case "t" : txt = "Type : "; val = pois[selectedBase[i] - 2]; break;
  660. default : txt = false;
  661. }
  662. if(txt)
  663. {
  664. base.push([txt, val]);
  665. }
  666. root.__setInfo(base);
  667. }
  668. }
  669. catch(e)
  670. {
  671. console.log(e.toString());
  672. }
  673. };
  674. var onMapHover = function(event)
  675. {
  676. var loc = root.locations, elements = root.elements, coordsField = root.coordsField;
  677. var getCoords = function()
  678. {
  679. var canvasRect = canvas.getBoundingClientRect();
  680. var x = (event.pageX - canvasRect.left), y = (event.pageY - canvasRect.top);
  681. return [x, y];
  682. };
  683. var coords = getCoords();
  684. var x = coords[0] + canvas.offsetLeft, y = coords[1] + canvas.offsetTop;
  685. if(Math.sqrt(Math.pow(x - 250, 2) + Math.pow(y - 250, 2)) > 242)
  686. {
  687. coordsField.setValue("");
  688. return;
  689. }
  690. x = Math.round(coords[0] / (root.scale * factor)); root.__pointerX = x;
  691. y = Math.round(coords[1] / (root.scale * factor)); root.__pointerY = y;
  692. coordsField.setValue(x + ":" + y);
  693. if (root.scale < 2 || root.inProgress) return;
  694. for(var i = 0; i < loc.length; i++)
  695. {
  696. var elmX = loc[i][0], elmY = loc[i][1];
  697. if ((x == elmX) && (y == elmY))
  698. {
  699. selectedBase = elements[i];
  700. displayBaseInfo();
  701. break;
  702. }
  703. else
  704. {
  705. selectedBase = false;
  706. root.__setInfo(false);
  707. }
  708. }
  709. };
  710. var onMapDrag = function(event)
  711. {
  712. if (root.scale == 1 || root.inProgress) return;
  713. var cx = canvas.offsetLeft, cy = canvas.offsetTop, mx = event.pageX, my = event.pageY;
  714. var newX = cx + mx - initCoords[0], newY = cy + my - initCoords[1];
  715. initCoords[0] = mx;
  716. initCoords[1] = my;
  717. canvas.style.top = newY + 'px';
  718. canvas.style.left = newX + 'px';
  719. };
  720. var onMapWheel = function(event)
  721. {
  722. if (root.inProgress) return;
  723. var delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail)));
  724. if((delta < 0 && root.scale <= 1) || (delta > 0 && root.scale >= 12)) return;
  725. c += delta;
  726. var str = ( Math.abs(c) % 3 == 0 ) ? ((delta < 0) ? 'down' : 'up') : false;
  727. if(str) root.__scaleMap(str);
  728. };
  729. var onMapDown = function(event){
  730. var x = event.pageX, y = event.pageY, t = new Date();
  731. initCoords = [x,y];
  732. start = t.getTime();
  733. mask.removeEventListener('mousemove', onMapHover, false);
  734. mask.addEventListener('mousemove', onMapDrag, false);
  735. };
  736. var onMapUp = function(event){
  737. var x = event.pageX, y = event.pageY, t = new Date();
  738. end = t.getTime();
  739. initCoords = [x,y];
  740. mask.removeEventListener('mousemove', onMapDrag, false);
  741. mask.addEventListener('mousemove', onMapHover, false);
  742. if (end - start < 150) webfrontend.gui.UtilView.centerCoordinatesOnRegionViewWindow(root.__pointerX, root.__pointerY);
  743. };
  744. var onMapOut = function(event){
  745. mask.removeEventListener('mousemove', onMapDrag, false);
  746. mask.addEventListener('mousemove', onMapHover, false);
  747. };
  748. mask.addEventListener('mouseup', onMapUp, false);
  749. mask.addEventListener('mousedown', onMapDown, false);
  750. mask.addEventListener('mousemove', onMapHover, false);
  751. mask.addEventListener('mouseout', onMapOut, false);
  752. mask.addEventListener('mousewheel', onMapWheel, false);
  753. mask.addEventListener('DOMMouseScroll', onMapWheel, false);
  754. }
  755. catch(e)
  756. {
  757. console.log(e.toString());
  758. }
  759. },
  760. __startRadarScan: function()
  761. {
  762. this.isRadarVisible = true;
  763. var FRAMES_PER_CYCLE = 20, FRAMERATE = 20, RINGS = 6;
  764. var canvas = this.canvas, ctx = this.ctx, canvassize = 400, animationframe = 0, root = this;
  765. var ringsize = canvassize / (2 * RINGS + 1);
  766. var radiusmax = ringsize / 2 + ringsize + (RINGS - 1) * ringsize;
  767. function animateRadarFrame() {
  768. ctx.clearRect(0, 0, canvas.width, canvas.height);
  769. root.__createLayout();
  770. var radius, alpha;
  771. for (var ringno = 0; ringno < RINGS; ringno++)
  772. {
  773. radius = ringsize / 2 + (animationframe / FRAMES_PER_CYCLE) * ringsize + ringno * ringsize;
  774. alpha = (radiusmax - radius) / radiusmax;
  775. ctx.beginPath();
  776. ctx.fillStyle = "rgba(92,178,112," + alpha + ")";
  777. ctx.arc(250, 250, radius, 0, 2 * Math.PI, false);
  778. ctx.fill();
  779. ctx.closePath();
  780. }
  781. ctx.beginPath();
  782. ctx.fillStyle = "rgb(100,194,122)";
  783. ctx.arc(250, 250, ringsize / 2, 0, 2 * Math.PI, false);
  784. ctx.fill();
  785. ctx.closePath();
  786. animationframe = (animationframe >= (FRAMES_PER_CYCLE - 1)) ? 0 : animationframe + 1;
  787. }
  788. this.__interval = setInterval(animateRadarFrame, 1000 / FRAMERATE);
  789. },
  790. __stopRadarScan: function()
  791. {
  792. if(!this.isRadarVisible) return;
  793. clearInterval(this.__interval);
  794. this.isRadarVisible = false;
  795. this.__enablePanel();
  796. },
  797. __disablePanel: function()
  798. {
  799. this.inProgress = true;
  800. for (var i = 0; i < this.panel.length; i++) this.panel[i].setEnabled(false);
  801. },
  802. __enablePanel: function()
  803. {
  804. for (var i = 0; i < this.panel.length; i++) if(i>1) this.panel[i].setEnabled(true);
  805. },
  806. __createIcon: function(color, width, height)
  807. {
  808. var canvas = document.createElement("canvas");
  809. canvas.width = width;
  810. canvas.height = height;
  811. var ctx = canvas.getContext("2d");
  812. ctx.beginPath();
  813. ctx.rect(0, 0, width, height);
  814. ctx.fillStyle = color;
  815. ctx.fill();
  816. ctx.closePath();
  817. var data = canvas.toDataURL("image/png");
  818. return data;
  819. },
  820. __updateList: function()
  821. {
  822. var dm = this.__displayM;
  823. this.__selectedA = null;
  824. this.allianceList.removeAll();
  825. var d = this.receivedData, root = this;
  826. var colors = {"enemy":["#ff807d", "#a93939", "#739bf5", "#c26b89"], "ally": ["#3bbe5d", "#c4d663", "#73f5ed", "#169f16"], "nap": ["#ffffff"], "selected": ["#ffe50e"], "alliance": ["#75b7d9"], "owner": ["#ffc48b"]};
  827. for (var i = 0; i < d.length; i++)
  828. {
  829. var name = d[i][0].name, type = d[i][1], aid = d[i][0].id, clr = d[i][2];
  830. if((dm == "all") || (dm == "selected"))
  831. {
  832. var color = colors[type][clr];
  833. var li = new qx.ui.form.ListItem(name, root.__createIcon(color, 10, 10), aid);
  834. var tooltip = new qx.ui.tooltip.ToolTip(name + " - " + type, root.__createIcon(color, 15, 15));
  835. li.setToolTip(tooltip);
  836. this.allianceList.add(li);
  837. }
  838. else
  839. {
  840. if(type == "alliance")
  841. {
  842. var li = new qx.ui.form.ListItem(name, null, aid);
  843. var tooltip = new qx.ui.tooltip.ToolTip(name + " - " + type, root.__createIcon(color, 15, 15));
  844. li.setToolTip(tooltip);
  845. this.allianceList.add(li);
  846. break;
  847. }
  848. }
  849. }
  850. },
  851. drawCanvas: function()
  852. {
  853. var dmd = this.__displayM, b = this.receivedData, list = this.allianceList;
  854. var selected = (this.__selectedA != null && typeof this.__selectedA == 'number') ? this.__selectedA : false;
  855. var mask = this.mask, n = this.scale, canvas = this.canvas, ctx = this.ctx;
  856. this.elements = [];
  857. this.locations = [];
  858. this.__stopRadarScan();
  859. canvas.width = n * 500;
  860. canvas.height = n * 500;
  861. ctx = canvas.getContext("2d");
  862. ctx.scale(n, n);
  863. this.__createLayout();
  864. for (var i = 0; i < b.length; i++)
  865. {
  866. var name = b[i][0].name, data = b[i][0], type = b[i][1], aid = b[i][0].id, color = b[i][2];
  867. if(((dmd == "alliance") || (dmd == "bases")) && (type == "alliance"))
  868. {
  869. this.__createAlliance(name, data, type, 0);
  870. break;
  871. }
  872. if(dmd == "all")
  873. {
  874. if(selected && (aid == selected))
  875. {
  876. type = 'selected';
  877. color = 0;
  878. }
  879. this.__createAlliance(name, data, type, color);
  880. }
  881. if((dmd == "selected") && selected && (aid == selected))
  882. {
  883. this.__createAlliance(name, data, type, color);
  884. break;
  885. }
  886. }
  887. },
  888. __scaleMap: function(str)
  889. {
  890. try
  891. {
  892. var newScale = (str == 'up') ? this.scale + 2 : this.scale - 2;
  893. if (newScale > 12 || newScale < 1 || this.inProgress) return;
  894. var canvas = this.canvas, ctx = this.ctx;
  895. var x = ((canvas.offsetLeft - 250) * newScale/this.scale) + 250,
  896. y = ((canvas.offsetTop - 250) * newScale/this.scale) + 250;
  897. this.scale = newScale;
  898. switch (this.scale)
  899. {
  900. case 1: this.zoomOut.setEnabled(false); this.zoomReset.setEnabled(false); this.zoomIn.setEnabled(true); break
  901. case 11: this.zoomOut.setEnabled(true); this.zoomReset.setEnabled(true); this.zoomIn.setEnabled(false); break
  902. default: this.zoomOut.setEnabled(true); this.zoomReset.setEnabled(true); this.zoomIn.setEnabled(true); break
  903. }
  904. ctx.clearRect(0, 0, canvas.width, canvas.height);
  905. this.drawCanvas();
  906. canvas.style.left = newScale == 1 ? 0 : x + 'px';
  907. canvas.style.top = newScale == 1 ? 0 : y + 'px';
  908. }
  909. catch(e)
  910. {
  911. console.log(e.toString());
  912. }
  913. },
  914. resetMap: function()
  915. {
  916. var canvas = this.canvas, ctx = this.ctx;
  917. this.scale = 1;
  918. canvas.width = 500; canvas.height = 500; canvas.style.left = 0; canvas.style.top = 0;
  919. ctx.clearRect(0, 0, canvas.width, canvas.height);
  920. this.__disablePanel();
  921. this.__startRadarScan();
  922. },
  923. open: function(faction)
  924. {
  925. var app = qx.core.Init.getApplication();
  926. var mainOverlay = app.getMainOverlay();
  927. this.setWidth(mainOverlay.getWidth());
  928. this.setMaxWidth(mainOverlay.getMaxWidth());
  929. this.setHeight(mainOverlay.getHeight());
  930. this.setMaxHeight(mainOverlay.getMaxHeight());
  931. app.getDesktop().add(this, { left: mainOverlay.getBounds().left, top: mainOverlay.getBounds().top });
  932. },
  933. _onClose: function()
  934. {
  935. var opt = cdccta_map.options.getInstance();
  936. var app = qx.core.Init.getApplication();
  937. app.getDesktop().remove(this);
  938. if(opt.isSeeable()) opt.close();
  939. },
  940. _onResize: function()
  941. {
  942. var windowWidth = window.innerWidth - 10;
  943. var width = this.getWidth();
  944. var offsetLeft = (windowWidth - width) / 2;
  945. this.setDomLeft(offsetLeft);
  946. var opt = cdccta_map.options.getInstance();
  947. if (opt.isSeeable()) opt.setDomLeft(offsetLeft + width + 5);
  948. }
  949. }
  950. });
  951. qx.Class.define('cdccta_map.options',
  952. {
  953. type: 'singleton',
  954. extend: webfrontend.gui.CustomWindow,
  955. construct: function()
  956. {
  957. try
  958. {
  959. this.base(arguments);
  960. this.setLayout(new qx.ui.layout.VBox(10));
  961. this.set({
  962. width: 200,
  963. height: 500,
  964. showMinimize: true,
  965. showMaximize: true,
  966. alwaysOnTop: true,
  967. caption: 'Alliances Shown on Map'
  968. });
  969. this.__getAlliances();
  970. var root = this;
  971. var searchBox = new qx.ui.form.TextField().set({ placeholder: 'Search...'});
  972. var list = new qx.ui.form.List().set({ height: 80 });
  973. var editList = new qx.ui.form.List().set({ height: 160, selectionMode: 'additive' });
  974. var radioButtons = [['Enemy', 'enemy'],['Ally', 'ally'],['NAP', 'nap']];
  975. var radioGroup = new qx.ui.form.RadioButtonGroup().set({ layout: new qx.ui.layout.HBox(10), textColor: '#aaaaaa' });
  976. for (var i = 0; i < radioButtons.length; i++)
  977. {
  978. var radioButton = new qx.ui.form.RadioButton(radioButtons[i][0]);
  979. radioButton.setModel(radioButtons[i][1]);
  980. radioGroup.add(radioButton);
  981. }
  982. var colors = root.__colors;
  983. var colorSelectBox = new qx.ui.form.SelectBox().set({ height: 28 });
  984. var addColors = function(type)
  985. {
  986. colorSelectBox.removeAll();
  987. for (var i = 0; i < colors[type].length; i++)
  988. {
  989. var src = root.__createIcon(colors[type][i], 60, 15);
  990. var listItem = new qx.ui.form.ListItem(null, src, i);
  991. colorSelectBox.add(listItem);
  992. }
  993. };
  994. addColors('enemy');
  995. var addButton = new qx.ui.form.Button('Add').set({ enabled: false, width: 85, toolTipText: 'Maximum allowed number of alliances is 8.' });;
  996. var removeButton = new qx.ui.form.Button('Remove').set({ enabled: false, width: 85 });;
  997. var applyButton = new qx.ui.form.Button('Apply').set({ enabled: false });;
  998. var defaultsButton = new qx.ui.form.Button('Defaults').set({ enabled: false, width: 85 });;
  999. var saveButton = new qx.ui.form.Button('Save').set({ enabled: false, width: 85 });;
  1000. var hbox1 = new qx.ui.container.Composite(new qx.ui.layout.HBox(10))
  1001. var hbox2 = new qx.ui.container.Composite(new qx.ui.layout.HBox(10))
  1002. hbox1.add(addButton);
  1003. hbox1.add(removeButton);
  1004. hbox2.add(saveButton);
  1005. hbox2.add(defaultsButton);
  1006. this.searchBox = searchBox;
  1007. this.list = list;
  1008. this.editList = editList;
  1009. this.radioGroup = radioGroup;
  1010. this.colorSelectBox = colorSelectBox;
  1011. this.addButton = addButton;
  1012. this.removeButton = removeButton;
  1013. this.saveButton = saveButton;
  1014. this.defaultsButton = defaultsButton;
  1015. this.applyButton = applyButton;
  1016. this.add(searchBox);
  1017. this.add(list);
  1018. this.add(editList);
  1019. this.add(radioGroup);
  1020. this.add(colorSelectBox);
  1021. this.add(hbox1);
  1022. this.add(hbox2);
  1023. this.add(applyButton);
  1024. this.addListener('appear', function()
  1025. {
  1026. var cont = cdccta_map.container.getInstance()
  1027. var bounds = cont.getBounds(), left = bounds.left, top = bounds.top, width = bounds.width, height = bounds.height;
  1028. searchBox.setValue('');
  1029. list.removeAll();
  1030. addButton.setEnabled(false);
  1031. removeButton.setEnabled(false);
  1032. applyButton.setEnabled(false);
  1033. radioGroup.setSelection([ radioGroup.getSelectables()[0] ]);
  1034. colorSelectBox.setSelection([ colorSelectBox.getSelectables()[0] ]);
  1035. this.__updateList();
  1036. this.__checkDefaults();
  1037. this.__checkSavedSettings();
  1038. this.setUserBounds(left + width + 5, top, 200, height);
  1039. }, this);
  1040. searchBox.addListener('keyup', this.__searchAlliances, this);
  1041. radioGroup.addListener('changeSelection', function(e)
  1042. {
  1043. if(e.getData()[0]) addColors(e.getData()[0].getModel());
  1044. }, this);
  1045. list.addListener('changeSelection', function(e)
  1046. {
  1047. if (!e.getData()[0]) return;
  1048. var items = this.__items, aid = e.getData()[0].getModel();
  1049. (((items != null) && (items.indexOf(aid) > -1)) || (items.length > 8)) ? addButton.setEnabled(false) : addButton.setEnabled(true);
  1050. }, this);
  1051. editList.addListener('changeSelection', function(e)
  1052. {
  1053. (e.getData()[0]) ? removeButton.setEnabled(true) : removeButton.setEnabled(false);
  1054. }, this);
  1055. addButton.addListener('execute', function()
  1056. {
  1057. var aid = list.getSelection()[0].getModel(),
  1058. name = list.getSelection()[0].getLabel(),
  1059. type = radioGroup.getSelection()[0].getModel(),
  1060. color = colorSelectBox.getSelection()[0].getModel();
  1061. var li = new qx.ui.form.ListItem(name + " - " + type, root.__createIcon(colors[type][color], 15, 15), {'aid': aid, 'type': type, 'name': name, 'color': color});
  1062. editList.add(li);
  1063. list.resetSelection();
  1064. addButton.setEnabled(false);
  1065. root.__updateItems();
  1066. }, this);
  1067. removeButton.addListener('execute', function()
  1068. {
  1069. var selection = (editList.isSelectionEmpty()) ? null : editList.getSelection();
  1070. var ownAlliance = cdccta_map.getInstance().__allianceName;
  1071. if(selection != null)
  1072. {
  1073. for(var i = selection.length - 1; i > -1; i--) if(selection[i].getModel().name != ownAlliance) editList.remove(selection[i]);
  1074. root.__updateItems();
  1075. editList.resetSelection();
  1076. }
  1077. }, this);
  1078. applyButton.addListener('execute', this.__applyChanges, this);
  1079. defaultsButton.addListener('execute', this.__setDefaults, this);
  1080. saveButton.addListener('execute', this.__saveSettings, this);
  1081. }
  1082. catch(e)
  1083. {
  1084. console.log(e.toString());
  1085. }
  1086. console.log('Options Panel creation completed');
  1087. },
  1088. destruct: function()
  1089. {
  1090. },
  1091. members:
  1092. {
  1093. __data: null,
  1094. searchBox: null,
  1095. list: null,
  1096. editList: null,
  1097. radioGroup: null,
  1098. colorSelectBox: null,
  1099. addButton: null,
  1100. removeButton: null,
  1101. saveButton: null,
  1102. applyButton: null,
  1103. defaultsButton: null,
  1104. __items: null,
  1105. __colors: {"enemy":["#ff807d", "#a93939", "#739bf5", "#c26b89"], "ally": ["#3bbe5d", "#c4d663", "#73f5ed", "#169f16"], "nap": ["#ffffff"], "selected": ["#ffe50e"], "alliance": ["#75b7d9"], "owner": ["#ffc48b"]},
  1106. __getAlliances: function()
  1107. {
  1108. var root = this;
  1109. ClientLib.Net.CommunicationManager.GetInstance().SendSimpleCommand("RankingGetData",
  1110. {firstIndex: 0, lastIndex: 3000, ascending: true, view: 1, rankingType: 0, sortColumn: 2},
  1111. phe.cnc.Util.createEventDelegate(ClientLib.Net.CommandResult, this, function(context, data)
  1112. {
  1113. if(data.a != null)
  1114. {
  1115. var arr = [];
  1116. for( var i = 0; i < data.a.length; i++) arr[i] = [data.a[i].an, data.a[i].a];
  1117. root.__data = arr;
  1118. }
  1119. }), null);
  1120. },
  1121. __createIcon: function(color, width, height)
  1122. {
  1123. var canvas = document.createElement("canvas");
  1124. canvas.width = width;
  1125. canvas.height = height;
  1126. var ctx = canvas.getContext("2d");
  1127. ctx.beginPath();
  1128. ctx.rect(0,0,width,height);
  1129. ctx.fillStyle = color;
  1130. ctx.fill();
  1131. ctx.closePath();
  1132. var data = canvas.toDataURL("image/png");
  1133. return data;
  1134. },
  1135. __updateList: function()
  1136. {
  1137. var map = cdccta_map.getInstance();
  1138. var selectedItems = [], list = this.editList, root = this;
  1139. var alliancesList = (map.__selectedAlliances == null) ? map.__defaultAlliances : map.__selectedAlliances;
  1140. var colors = this.__colors;
  1141. list.removeAll();
  1142. alliancesList.map(function(a)
  1143. {
  1144. var aid = a[0], at = a[1], an = a[2], c = a[3];
  1145. var li = new qx.ui.form.ListItem(an + " - " + at, root.__createIcon(colors[at][c], 15, 15), {'aid': aid, 'type': at, 'name': an, 'color': c});
  1146. list.add(li);
  1147. selectedItems.push(aid);
  1148. });
  1149. this.__items = selectedItems;
  1150. },
  1151. __setDefaults: function()
  1152. {
  1153. var map = cdccta_map.getInstance();
  1154. var selectedItems = [], list = this.editList, root = this, colors = this.__colors;
  1155. var alliancesList = map.__defaultAlliances;
  1156. list.removeAll();
  1157. alliancesList.map(function(a)
  1158. {
  1159. var aid = a[0], at = a[1], an = a[2], c = a[3];
  1160. var li = new qx.ui.form.ListItem(an + " - " + at, root.__createIcon(colors[at][c], 15, 15), {'aid': aid, 'type': at, 'name': an, 'color': c});
  1161. list.add(li);
  1162. selectedItems.push(aid);
  1163. });
  1164. this.__items = selectedItems;
  1165. this.__currentListModified();
  1166. this.defaultsButton.setEnabled(false);
  1167. },
  1168. __searchAlliances: function()
  1169. {
  1170. var str = this.searchBox.getValue(), data = this.__data, list = this.list;
  1171. list.removeAll();
  1172. if (!data || (str == '')) return;
  1173. data.map(function(x)
  1174. {
  1175. var patt = new RegExp("^" + str + ".+$", "i");
  1176. var test = patt.test(x[0]);
  1177. if(test)
  1178. {
  1179. var listItem = new qx.ui.form.ListItem(x[0], null, x[1]);
  1180. list.add(listItem);
  1181. }
  1182. });
  1183. },
  1184. __updateItems: function()
  1185. {
  1186. var items = [], listItems = this.editList.getSelectables();
  1187. for (var i = 0; i < listItems.length; i++) items.push(listItems[i].getModel().aid);
  1188. this.__items = items;
  1189. this.__checkSavedSettings();
  1190. this.__currentListModified();
  1191. },
  1192. __applyChanges: function()
  1193. {
  1194. var selectedAlliances = [], listItems = this.editList.getSelectables();
  1195. for(var i = 0; i < listItems.length; i++)
  1196. {
  1197. var model = listItems[i].getModel(), aid = model.aid, type = model.type, name = model.name, color = model.color;
  1198. selectedAlliances.push([aid, type, name, color]);
  1199. }
  1200. cdccta_map.getInstance().__selectedAlliances = selectedAlliances;
  1201. cdccta_map.container.getInstance().resetMap();
  1202. cdccta_map.getInstance().getData();
  1203. this.close();
  1204. },
  1205. __saveSettings: function()
  1206. {
  1207. if(typeof(Storage) === 'undefined') return;
  1208. var selectedAlliances = [], listItems = this.editList.getSelectables();
  1209. for(var i = 0; i < listItems.length; i++)
  1210. {
  1211. var model = listItems[i].getModel(), aid = model.aid, type = model.type, name = model.name, color = model.color;
  1212. selectedAlliances.push([aid, type, name, color]);
  1213. }
  1214. (!localStorage.cdccta_map_settings) ? localStorage['cdccta_map_settings'] = JSON.stringify(selectedAlliances) : localStorage.cdccta_map_settings = JSON.stringify(selectedAlliances);
  1215. this.saveButton.setEnabled(false);
  1216. // console.log(localStorage.cdccta_map_settings);
  1217. },
  1218. __checkSavedSettings: function()
  1219. {
  1220. if(typeof(Storage) === 'undefined') return;
  1221. var original = (localStorage.cdccta_map_settings) ? JSON.parse(localStorage.cdccta_map_settings) : null;
  1222. var items = this.__items;
  1223. var changed = false;
  1224. if ((items != null) && (original != null) && (items.length != original.length)) changed = true;
  1225. if ((items != null) && (original != null) && (items.length == original.length))
  1226. {
  1227. original.map(function(x)
  1228. {
  1229. if (items.indexOf(x[0]) < 0) changed = true;
  1230. });
  1231. }
  1232. ((items.length > 0) && ((original === null) || changed)) ? this.saveButton.setEnabled(true) : this.saveButton.setEnabled(false);
  1233. },
  1234. __checkDefaults: function()
  1235. {
  1236. var defaults = cdccta_map.getInstance().__defaultAlliances, items = this.__items, changed = false;
  1237. if(!defaults) return;
  1238. if ((items != null) && (defaults != null) && (items.length != defaults.length)) changed = true;
  1239. if ((items != null) && (defaults != null) && (items.length == defaults.length))
  1240. {
  1241. defaults.map(function(x)
  1242. {
  1243. if (items.indexOf(x[0]) < 0) changed = true;
  1244. });
  1245. }
  1246. (changed) ? this.defaultsButton.setEnabled(true) : this.defaultsButton.setEnabled(false);
  1247. },
  1248. __currentListModified: function()
  1249. {
  1250. var map = cdccta_map.getInstance(), current = (map.__selectedAlliances == null) ? map.__defaultAlliances : map.__selectedAlliances;
  1251. var items = this.__items, changed = false;
  1252. current.map(function(x)
  1253. {
  1254. if(items.indexOf(x[0]) < 0) changed = true;
  1255. });
  1256. ((items.length > 0) && ((items.length != current.length) || (changed == true))) ? this.applyButton.setEnabled(true) : this.applyButton.setEnabled(false);
  1257. }
  1258. }
  1259. });
  1260. }
  1261. var cctaMapLoader = function()
  1262. {
  1263. var qx = window["qx"];
  1264. var ClientLib = window["ClientLib"];
  1265. var webfrontend = window["webfrontend"];
  1266. if ((typeof ClientLib == 'undefined') || (typeof qx == 'undefined') || (qx.core.Init.getApplication().initDone == false))
  1267. {
  1268. setTimeout(cctaMapLoader, 1000);
  1269. console.log('retrying....');
  1270. }
  1271. else
  1272. {
  1273. create_cdccta_map_class();
  1274. cdccta_map.getInstance();
  1275. }
  1276. };
  1277. window.setTimeout(cctaMapLoader, 10000);
  1278.  
  1279. })();