dave/pathfinder
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- added new "Jump log" for selected wormhole connections, closed #313 closed #449 closed #382

Browse Source 
- added new "select connection" feature to map - ctrl + click for multiselect, closed  #174
- added new "wormhole type" table to "Jump info" dialog, closed  #174
- added new re-order drag&drop feature for pannels, #470 closed #234
- fixed PHP-Doc comments - added @throw statements
- fixed some Javascript memory leaks with infinite counters
- updated "Peity jQuery plugin" `3.2.0` -> `3.2.1`
This commit is contained in:
Mark Friedrich
2017-12-04 15:12:52 +01:00
parent 605beeb248
commit ff15fc0bf9
238 changed files with 60230 additions and 1158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
js/app.js
View File

@@ -1,3 +1,5 @@
'use strict';
// main script path
var mainScriptPath = document.body.getAttribute('data-script');
@@ -40,7 +42,7 @@ requirejs.config({
raphael: 'lib/raphael-min', // v2.1.2 Raphaël - required for morris (dependency)
bootbox: 'lib/bootbox.min', // v4.4.0 Bootbox.js - custom dialogs - http://bootboxjs.com
easyPieChart: 'lib/jquery.easypiechart.min', // v2.1.6 Easy Pie Chart - HTML 5 pie charts - http://rendro.github.io/easy-pie-chart
peityInlineChart: 'lib/jquery.peity.min', // v3.2.0 Inline Chart - http://benpickles.github.io/peity/
peityInlineChart: 'lib/jquery.peity.min', // v3.2.1 Inline Chart - http://benpickles.github.io/peity/
dragToSelect: 'lib/jquery.dragToSelect', // v1.1 Drag to Select - http://andreaslagerkvist.com/jquery/drag-to-select
hoverIntent: 'lib/jquery.hoverIntent.minified', // v1.8.0 Hover intention - http://cherne.net/brian/resources/jquery.hoverIntent.html
fullScreen: 'lib/jquery.fullscreen.min', // v0.6.0 Full screen mode - https://github.com/private-face/jquery.fullscreen
@@ -53,6 +55,7 @@ requirejs.config({
bootstrapConfirmation: 'lib/bootstrap-confirmation', // v1.0.5 Bootstrap extension for inline confirm dialog - https://github.com/tavicu/bs-confirmation
bootstrapToggle: 'lib/bootstrap2-toggle.min', // v2.2.0 Bootstrap Toggle (Checkbox) - http://www.bootstraptoggle.com
lazyload: 'lib/jquery.lazyload.min', // v1.9.5 LazyLoader images - http://www.appelsiini.net/projects/lazyload
sortable: 'lib/sortable.min', // v1.3.0 Sortable - drag&drop reorder
// header animation
easePack: 'lib/EasePack.min',
@@ -126,7 +129,10 @@ requirejs.config({
},
morris: {
deps: ['jquery', 'raphael'],
exports: 'Morris'
exports: 'Morris',
init: function ($, Raphael) {
window.Raphael = Raphael;
}
},
pnotify: {
deps : ['jquery']

84
js/app/counter.js
View File

@@ -14,49 +14,77 @@ define([
* update element with time information
* @param element
* @param tempDate
* @param round
*/
let updateDateDiff = function(element, tempDate){
let updateDateDiff = function(element, tempDate, round){
let diff = Util.getTimeDiffParts(tempDate, new Date());
let days = diff.days;
let hrs = diff.hours;
let min = diff.min;
let leftSec = diff.sec;
let value = [];
let parts = [];
if(
days > 0 ||
value.length > 0
round === 'd' &&
days >= 1
){
value.push('<span class="' + config.counterDigitLargeClass + '">' + days + 'd' + '</span>');
}
if(
hrs > 0 ||
value.length > 0
){
value.push('<span class="' + config.counterDigitSmallClass + '">' + hrs + 'h' + '</span>');
}
if(
min > 0 ||
value.length > 0
){
value.push('<span class="' + config.counterDigitSmallClass + '">' + min + 'm' + '</span>');
parts.push('<span class="' + config.counterDigitLargeClass + '">' + '&gt;&nbsp;1d' + '</span>');
}else{
if(
days > 0 ||
parts.length > 0
){
parts.push('<span class="' + config.counterDigitLargeClass + '">' + days + 'd' + '</span>');
}
if(
hrs > 0 ||
parts.length > 0
){
parts.push('<span class="' + config.counterDigitSmallClass + '">' + hrs + 'h' + '</span>');
}
if(
min > 0 ||
parts.length > 0
){
parts.push('<span class="' + config.counterDigitSmallClass + '">' + min + 'm' + '</span>');
}
if(
leftSec >= 0 ||
parts.length > 0
){
parts.push('<span class="' + config.counterDigitSmallClass + '">' + leftSec + 's' + '</span>');
}
}
if(
leftSec >= 0 ||
value.length > 0
){
value.push('<span class="' + config.counterDigitSmallClass + '">' + leftSec + 's' + '</span>');
}
element.html(value.join(' '));
element.html(parts.join(' '));
};
/**
* destroy all active counter recursive
*/
$.fn.destroyTimestampCounter = function(){
return this.each(function(){
let element = $(this);
element.find('[data-counter="init"]').each(function(){
let interval = $(this).data('interval');
if(interval){
clearInterval(interval);
element.removeAttr('data-counter')
.removeData('interval')
.removeClass('stopCounter');
}
});
});
};
/**
* init a live counter based on a unix timestamp
* @returns {*}
* @param round string e.g. 'd' => round days
*/
$.fn.initTimestampCounter = function(){
$.fn.initTimestampCounter = function(round){
return this.each(function(){
let element = $(this);
let timestamp = parseInt( element.text() );
@@ -68,7 +96,7 @@ define([
let date = new Date( timestamp * 1000);
updateDateDiff(element, date);
updateDateDiff(element, date, round);
// show element (if invisible) after first update
element.css({'visibility': 'initial'});
@@ -77,7 +105,7 @@ define([
// update element with current time
if( !element.hasClass('stopCounter')){
updateDateDiff(element, date);
updateDateDiff(element, date, round);
}else{
clearInterval( element.data('interval') );
}

3
js/app/init.js
View File

@@ -327,6 +327,9 @@ define(['jquery'], function($) {
location: 0.6
}]
]
},
active: {
cssClass: 'pf-map-connection-active'
}
},
// signature groups

1
js/app/logging.js
View File

@@ -205,7 +205,6 @@ define([
class: config.dialogDynamicAreaClass
}).append( graphElement );
// headline
let headline = $('<h4>', {
text: key
}).prepend(

153
js/app/map/map.js
View File

@@ -23,6 +23,7 @@ define([
let config = {
zIndexCounter: 110,
maxActiveConnections: 8,
mapSnapToGrid: false, // "Snap to Grid" feature for drag&drop systems on map (optional)
mapWrapperClass: 'pf-map-wrapper', // wrapper div (scrollable)
@@ -30,9 +31,9 @@ define([
mapClass: 'pf-map', // class for all maps
mapIdPrefix: 'pf-map-', // id prefix for all maps
systemClass: 'pf-system', // class for all systems
systemActiveClass: 'pf-system-active', // class for an active system in a map
systemSelectedClass: 'pf-system-selected', // class for selected systems in a map
systemLockedClass: 'pf-system-locked', // class for locked systems in a map
systemActiveClass: 'pf-system-active', // class for an active system on a map
systemSelectedClass: 'pf-system-selected', // class for selected systems on a map
systemLockedClass: 'pf-system-locked', // class for locked systems on a map
systemHeadClass: 'pf-system-head', // class for system head
systemHeadNameClass: 'pf-system-head-name', // class for system name
systemHeadExpandClass: 'pf-system-head-expand', // class for system head expand arrow
@@ -85,7 +86,7 @@ define([
dragOptions:{
},
connectionsDetachable: true, // dragOptions are set -> allow detaching them
maxConnections: 10, // due to isTarget is true, this is the max count of !out!-going connections
maxConnections: 10, // due to isTarget is true, this is the max count of !out!-going connections
// isSource:true,
anchor: 'Continuous'
},
@@ -93,7 +94,7 @@ define([
filter: '.' + config.systemHeadNameClass,
isSource:true,
//isTarget:true,
//allowLoopback: false, // loopback connections are not allowed
//allowLoopBack: false, // loopBack connections are not allowed
cssClass: config.endpointTargetClass,
dropOptions: {
hoverClass: config.systemActiveClass,
@@ -626,6 +627,7 @@ define([
// get map container
let mapElement = $( map.getContainer() );
let connectionCanvas = $(connection.canvas);
// if the connection already exists -> do not set it twice
connection.unbind('contextmenu').bind('contextmenu', function(component, e) {
@@ -646,7 +648,7 @@ define([
* init context menu for all connections
* must be triggered manually on demand
*/
$(connection.canvas).contextMenu({
connectionCanvas.contextMenu({
menuSelector: '#' + config.connectionContextMenuId,
menuSelected: function (params){
@@ -708,6 +710,31 @@ define([
}
});
// connection click events ==========================================================================
let single = function(e){
let connection = this;
// left mouse button
if(e.which === 1){
if(e.ctrlKey === true){
// an "active" connection is required before adding more "selected" connections
let activeConnections = MapUtil.getConnectionsByType(map, 'active');
if(activeConnections.length >= config.maxActiveConnections && !connection.hasType('active')){
Util.showNotify({title: 'Connection select limit', text: 'You can´t select more connections', type: 'warning'});
}else {
if(activeConnections.length > 0) {
MapUtil.toggleConnectionActive(map, [connection]);
}else{
MapUtil.showConnectionInfo(map, connection);
}
}
}else{
MapUtil.showConnectionInfo(map, connection);
}
}
}.bind(connection);
connectionCanvas.singleDoubleClick(single, () => {});
};
/**
@@ -1650,42 +1677,6 @@ define([
});
};
/**
* get all relevant data for a connection object
* @param connection
* @returns {{id: Number, source: Number, sourceName: (*|T|JQuery|{}), target: Number, targetName: (*|T|JQuery), scope: *, type: *, updated: Number}}
*/
let getDataByConnection = function(connection){
let source = $(connection.source);
let target = $(connection.target);
let id = connection.getParameter('connectionId');
let updated = connection.getParameter('updated');
let connectionTypes = connection.getType();
// normalize connection array
connectionTypes = $.grep(connectionTypes, function(n){
// 'default' is added by jsPlumb by default -_-
return ( n.length > 0 && n !== 'default');
});
let data = {
id: id ? id : 0,
source: parseInt( source.data('id') ),
sourceName: source.data('name'),
sourceAlias: source.getSystemInfo(['alias']) || source.data('name'),
target: parseInt( target.data('id') ),
targetName: target.data('name'),
targetAlias: target.getSystemInfo(['alias']) || target.data('name'),
scope: connection.scope,
type: connectionTypes,
updated: updated ? updated : 0
};
return data;
};
/**
* stores a connection in database
* @param connection
@@ -1697,7 +1688,7 @@ define([
let mapContainer = $( map.getContainer() );
let mapId = mapContainer.data('id');
let connectionData = getDataByConnection(connection);
let connectionData = MapUtil.getDataByConnection(connection);
let requestData = {
mapData: {
@@ -2362,9 +2353,9 @@ define([
if(! system.hasClass('no-click')){
if(e.ctrlKey === true){
// select system
system.toggleSelectSystem(map);
MapUtil.toggleSelectSystem(map, [system]);
}else{
system.showSystemInfo(map);
MapUtil.showSystemInfo(map, system);
}
}
}
@@ -2412,31 +2403,6 @@ define([
return changed;
};
/**
* triggers the "showSystemInfo" event, that is responsible for initializing the "map info" panel
* @param map
*/
$.fn.showSystemInfo = function(map){
let system = $(this);
// activate system
markSystemActive(map, system);
// get parent Tab Content and fire update event
let tabContentElement = MapUtil.getTabContentElementByMapElement( system );
// collect all required data from map module to update the info element
// store them global and assessable for each module
let currentSystemData = {
systemData: system.getSystemData(),
mapId: parseInt( system.attr('data-mapid') )
};
Util.setCurrentSystemData(currentSystemData);
$(tabContentElement).trigger('pf:drawSystemModules');
};
/**
* select all (selectable) systems on a mapElement
*/
@@ -2452,35 +2418,13 @@ define([
return ( $(el).data('locked') !== true );
});
allSystems.toggleSelectSystem(map);
MapUtil.toggleSelectSystem(map, allSystems);
Util.showNotify({title: allSystems.length + ' systems selected', type: 'success'});
});
};
/**
* toggle selectable status of a system
*/
$.fn.toggleSelectSystem = function(map){
return this.each(function(){
let system = $(this);
if( system.data('locked') !== true ){
if( system.hasClass( config.systemSelectedClass ) ){
system.removeClass( config.systemSelectedClass );
map.removeFromDragSelection(system);
}else{
system.addClass( config.systemSelectedClass );
map.addToDragSelection(system);
}
}
});
};
/**
* toggle log status of a system
* @param poke
@@ -2904,7 +2848,7 @@ define([
tempMapWrapper.mCustomScrollbar('scrollTo', system);
// select system
system.showSystemInfo(map);
MapUtil.showSystemInfo(map, system);
}
});
@@ -2969,22 +2913,6 @@ define([
});
};
/**
* mark a system as active
* @param map
* @param system
*/
let markSystemActive = function(map, system){
// deactivate all systems in map
let mapContainer = $( map.getContainer() );
mapContainer.find('.' + config.systemClass).removeClass(config.systemActiveClass);
// set current system active
system.addClass(config.systemActiveClass);
};
/**
* get system data out of its object
* @param info
@@ -3051,7 +2979,7 @@ define([
// data for header update
let headerUpdateData = {
mapId: userData.config.id,
userCount: 0 // active user in a map
userCount: 0 // active user on a map
};
if(
@@ -3191,7 +3119,7 @@ define([
// format connections
for(let j = 0; j < connections.length; j++){
let tempConnection = connections[j];
let connectionData = getDataByConnection(tempConnection);
let connectionData = MapUtil.getDataByConnection(tempConnection);
// only add valid connections (id is required, this is not the case if connection is new)
if(connectionData.id > 0){
@@ -3422,7 +3350,6 @@ define([
return {
getMapInstance: getMapInstance,
clearMapInstance: clearMapInstance,
getDataByConnection: getDataByConnection,
showNewSystemDialog: showNewSystemDialog
};

86
js/app/map/overlay.js
View File

@@ -5,8 +5,9 @@
define([
'jquery',
'app/init',
'app/util'
], function($, Init, Util) {
'app/util',
'app/map/util'
], function($, Init, Util, MapUtil) {
'use strict';
let config = {
@@ -72,34 +73,15 @@ define([
* @param label
*/
let addEndpointOverlay = (endpoint, label) => {
let newLabel = '';
let colorClass = 'txt-color-grayLighter';
if(label.length > 0){
newLabel = label;
// check if multiple labels found => conflict
if( label.includes(', ') ){
colorClass = 'txt-color-orangeLight';
}else if( !label.includes('K162') ){
colorClass = 'txt-color-yellow';
}
}else{
// endpoint not connected with a signature
newLabel = '<i class="fa fa-question-circle"></i>';
colorClass = 'txt-color-red';
}
endpoint.addOverlay([
'Label',
{
label: '<span class="txt-color ' + colorClass + '">' + newLabel + '</span>',
label: MapUtil.getEndpointOverlayContent(label),
id: config.connectionOverlaySmallId,
cssClass: config.connectionOverlaySmallClass,
location: [ 0.5, 0.5 ]
location: [ 0.9, 0.9 ]
}
]);
};
// loop through all map connections (get from DOM)
@@ -119,53 +101,15 @@ define([
// ... find matching connectionData (from Ajax)
for(let connectionData of connectionsData){
if(
connectionData.id === connectionId &&
connectionData.signatures // signature data is required...
){
// ... collect overlay/label data from signatures
for(let signatureData of connectionData.signatures){
// ... typeId is required to get a valid name
if(signatureData.typeId > 0){
// whether "source" or "target" system is relevant for current connection and current signature...
let tmpSystem = null;
let tmpSystemType = null;
if(signatureData.system.id === sourceId){
// relates to "source" endpoint
tmpSystemType = 'sourceLabels';
tmpSystem = sourceSystem;
}else if(signatureData.system.id === targetId){
// relates to "target" endpoint
tmpSystemType = 'targetLabels';
tmpSystem = targetSystem;
}
// ... get endpoint label for source || target system
if(tmpSystem && tmpSystem){
// ... get all available signature type (wormholes) names
let availableSigTypeNames = SystemSignatures.getAllSignatureNamesBySystem(tmpSystem, 5);
let flattenSigTypeNames = Util.flattenXEditableSelectArray(availableSigTypeNames);
if( flattenSigTypeNames.hasOwnProperty(signatureData.typeId) ){
let label = flattenSigTypeNames[signatureData.typeId];
// shorten label, just take the in game name
label = label.substr(0, label.indexOf(' '));
signatureTypeNames[tmpSystemType].push(label);
}
}
}
}
if(connectionData.id === connectionId){
signatureTypeNames = MapUtil.getConnectionDataFromSignatures(connection, connectionData);
// ... connection matched -> continue with next one
break;
}
}
let sourceLabel = signatureTypeNames.sourceLabels.join(', ');
let targetLabel = signatureTypeNames.targetLabels.join(', ');
let sourceLabel = signatureTypeNames.sourceLabels;
let targetLabel = signatureTypeNames.targetLabels;
// add endpoint overlays ------------------------------------------------------
addEndpointOverlay(sourceEndpoint, sourceLabel);
@@ -176,19 +120,19 @@ define([
let arrowDirection = 1;
if(
(sourceLabel.includes('K162') && targetLabel.includes('K162')) ||
(sourceLabel.indexOf('K162') !== -1 && targetLabel.indexOf('K162') !== -1) ||
(sourceLabel.length === 0 && targetLabel.length === 0) ||
(
sourceLabel.length > 0 && targetLabel.length > 0 &&
!sourceLabel.includes('K162') && !targetLabel.includes('K162')
sourceLabel.indexOf('K162') === -1 && targetLabel.indexOf('K162') === -1
)
){
// unknown direction
overlayType = 'Diamond'; // not specified
arrowDirection = 1;
}else if(
(sourceLabel.includes('K162')) ||
(sourceLabel.length === 0 && !targetLabel.includes('K162'))
(sourceLabel.indexOf('K162') !== -1) ||
(sourceLabel.length === 0 && targetLabel.indexOf('K162') === -1)
){
// convert default arrow direction
overlayType = 'Arrow';
@@ -283,7 +227,9 @@ define([
showLoading(overlayConnectionIcon);
let requestData = {
mapId: mapElement.data('id')
mapId: mapElement.data('id'),
addData : ['signatures'],
filterData : ['signatures']
};
$.ajax({

2
js/app/map/system.js
View File

@@ -18,7 +18,7 @@ define([
y: 0
},
systemActiveClass: 'pf-system-active', // class for an active system in a map
systemActiveClass: 'pf-system-active', // class for an active system on a map
dialogRallyId: 'pf-rally-dialog', // id for "Rally point" dialog

420
js/app/map/util.js
View File

@@ -24,7 +24,8 @@ define([
systemIdPrefix: 'pf-system-', // id prefix for a system
systemClass: 'pf-system', // class for all systems
systemSelectedClass: 'pf-system-selected', // class for selected systems in a map
systemActiveClass: 'pf-system-active', // class for an active system on a map
systemSelectedClass: 'pf-system-selected', // class for selected systems on on map
// dataTable
tableCellEllipsisClass: 'pf-table-cell-ellipsis',
@@ -60,7 +61,7 @@ define([
* @param {bool} filterByUser
* @returns {Array}
*/
let getMapTypes = function(filterByUser){
let getMapTypes = (filterByUser) => {
let mapTypes = [];
$.each(Init.mapTypes, function(prop, data){
@@ -109,7 +110,7 @@ define([
* get all available scopes for a map
* @returns {Array}
*/
let getMapScopes = function(){
let getMapScopes = () => {
let scopes = [];
$.each(Init.mapScopes, function(prop, data){
let tempData = data;
@@ -126,7 +127,7 @@ define([
* @param {string} option
* @returns {string}
*/
let getScopeInfoForMap = function(info, option){
let getScopeInfoForMap = (info, option) => {
let scopeInfo = '';
if(Init.mapScopes.hasOwnProperty(info)){
scopeInfo = Init.mapScopes[info][option];
@@ -138,7 +139,7 @@ define([
* get all available map icons
* @returns {Object[]}
*/
let getMapIcons = function(){
let getMapIcons = () => {
return Init.mapIcons;
};
@@ -148,7 +149,7 @@ define([
* @param {string} option
* @returns {string}
*/
let getInfoForMap = function(mapType, option){
let getInfoForMap = (mapType, option) => {
let mapInfo = '';
if(Init.mapTypes.hasOwnProperty(mapType)){
mapInfo = Init.mapTypes[mapType][option];
@@ -162,7 +163,7 @@ define([
* @param {string} option
* @returns {string}
*/
let getInfoForSystem = function(info, option){
let getInfoForSystem = (info, option) => {
let systemInfo = '';
if(Init.classes.systemInfo.hasOwnProperty(info)){
systemInfo = Init.classes.systemInfo[info][option];
@@ -176,7 +177,7 @@ define([
* @param {string} option
* @returns {string}
*/
let getSystemTypeInfo = function(systemTypeId, option){
let getSystemTypeInfo = (systemTypeId, option) => {
let systemTypeInfo = '';
$.each(Init.systemType, function(prop, data){
if(systemTypeId === data.id){
@@ -193,7 +194,7 @@ define([
* @param option
* @returns {string}
*/
let getEffectInfoForSystem = function(effect, option){
let getEffectInfoForSystem = (effect, option) => {
let effectInfo = '';
if( Init.classes.systemEffects.hasOwnProperty(effect) ){
effectInfo = Init.classes.systemEffects[effect][option];
@@ -210,7 +211,7 @@ define([
};
/**
* get all selected (NOT active) systems in a map
* get all selected (NOT active) systems on a map
* @returns {*}
*/
$.fn.getSelectedSystems = function(){
@@ -218,13 +219,320 @@ define([
return mapElement.find('.' + config.systemSelectedClass);
};
/**
* filter connections by type
* @param map
* @param type
* @returns {Array}
*/
let getConnectionsByType = (map, type) => {
let connections = [];
// iterate through ALL connections and filter...
// -> there is no "filterByScope()" method in jsPlumb
for(let connection of map.getAllConnections()){
if(connection.getType().indexOf(type) !== -1){
connections.push(connection);
}
}
return connections;
};
/**
* get all relevant data for a connection object
* @param connection
* @returns {{id: Number, source: Number, sourceName: (*|T|JQuery|{}), target: Number, targetName: (*|T|JQuery), scope: *, type: *, updated: Number}}
*/
let getDataByConnection = (connection) => {
let source = $(connection.source);
let target = $(connection.target);
let id = connection.getParameter('connectionId');
let updated = connection.getParameter('updated');
let connectionTypes = connection.getType();
// normalize connection array
connectionTypes = $.grep(connectionTypes, function(n){
// 'default' is added by jsPlumb by default -_-
return ( n.length > 0 && n !== 'default');
});
let data = {
id: id ? id : 0,
source: parseInt( source.data('id') ),
sourceName: source.data('name'),
sourceAlias: source.getSystemInfo(['alias']) || source.data('name'),
target: parseInt( target.data('id') ),
targetName: target.data('name'),
targetAlias: target.getSystemInfo(['alias']) || target.data('name'),
scope: connection.scope,
type: connectionTypes,
updated: updated ? updated : 0
};
return data;
};
/**
* @see getDataByConnection
* @param connections
* @returns {Array}
*/
let getDataByConnections = (connections) => {
let data = [];
for(let connection of connections){
data.push(getDataByConnection(connection));
}
return data;
};
/**
* get connection related data from a connection
* -> data requires a signature bind to that connection
* @param connection
* @param connectionData
* @returns {{sourceLabels: Array, targetLabels: Array}}
*/
let getConnectionDataFromSignatures = (connection, connectionData) => {
let signatureTypeNames = {
sourceLabels: [],
targetLabels: []
};
if(
connection &&
connectionData.signatures // signature data is required...
){
let SystemSignatures = require('app/ui/system_signature');
let connectionId = connection.getParameter('connectionId');
let sourceEndpoint = connection.endpoints[0];
let targetEndpoint = connection.endpoints[1];
let sourceSystem = $(sourceEndpoint.element);
let targetSystem = $(targetEndpoint.element);
let sourceId = sourceSystem.data('id');
let targetId = targetSystem.data('id');
// ... collect overlay/label data from signatures
for(let signatureData of connectionData.signatures){
// ... typeId is required to get a valid name
if(signatureData.typeId > 0){
// whether "source" or "target" system is relevant for current connection and current signature...
let tmpSystem = null;
let tmpSystemType = null;
if(signatureData.system.id === sourceId){
// relates to "source" endpoint
tmpSystemType = 'sourceLabels';
tmpSystem = sourceSystem;
}else if(signatureData.system.id === targetId){
// relates to "target" endpoint
tmpSystemType = 'targetLabels';
tmpSystem = targetSystem;
}
// ... get endpoint label for source || target system
if(tmpSystem && tmpSystem){
// ... get all available signature type (wormholes) names
let availableSigTypeNames = SystemSignatures.getAllSignatureNamesBySystem(tmpSystem, 5);
let flattenSigTypeNames = Util.flattenXEditableSelectArray(availableSigTypeNames);
if( flattenSigTypeNames.hasOwnProperty(signatureData.typeId) ){
let label = flattenSigTypeNames[signatureData.typeId];
// shorten label, just take the in game name
label = label.substr(0, label.indexOf(' '));
signatureTypeNames[tmpSystemType].push(label);
}
}
}
}
}
return signatureTypeNames;
};
/**
* get overlay HTML for connection endpoints by Label array
* @param label
* @returns {string}
*/
let getEndpointOverlayContent = (label) => {
let newLabel = '';
let colorClass = 'txt-color-grayLighter';
if(label.length > 0){
newLabel = label.join(', ');
// check if multiple labels found => conflict
if( newLabel.includes(', ') ){
colorClass = 'txt-color-orangeLight';
}else if( !newLabel.includes('K162') ){
colorClass = 'txt-color-yellow';
}
}else{
// endpoint not connected with a signature
newLabel = '<i class="fa fa-question-circle"></i>';
colorClass = 'txt-color-red';
}
return '<span class="txt-color ' + colorClass + '">' + newLabel + '</span>';
};
/**
* get TabContentElement by any element on a map e.g. system
* @param element
* @returns {*}
*/
let getTabContentElementByMapElement = (element) => {
let tabContentElement = $(element).parents('.' + config.mapTabContentClass);
return tabContentElement;
};
/**
* checks if there is an "active" connection on a map
* @param map
* @returns {boolean}
*/
let hasActiveConnection = (map) => {
let activeConnections = getConnectionsByType(map, 'active');
return activeConnections.length > 0;
};
/**
* mark a system as "active"
* @param map
* @param system
*/
let setSystemActive = (map, system) => {
// deselect all selected systems on map
let mapContainer = $( map.getContainer() );
mapContainer.find('.' + config.systemClass).removeClass(config.systemActiveClass);
// set current system active
system.addClass(config.systemActiveClass);
};
/**
* mark a connection as "active"
* @param connection
*/
let setConnectionActive = (map, connection) => {
// set all inactive
for(let tempConnection of getConnectionsByType(map, 'active')){
if(tempConnection.getParameter('connectionId') !== connection.getParameter('connectionId')){
tempConnection.removeType('active');
}
}
if( !connection.hasType('active') ){
connection.addType('active');
}
};
/**
* toggle "selected" status of system
* @param map
* @param systems
*/
let toggleSelectSystem = (map, systems) => {
for(let system of systems){
system = $(system);
if( system.data('locked') !== true ){
if( system.hasClass( config.systemSelectedClass ) ){
system.removeClass( config.systemSelectedClass );
map.removeFromDragSelection(system);
}else{
system.addClass( config.systemSelectedClass );
map.addToDragSelection(system);
}
}
}
};
/**
* toggle "selected" status of connections
* @param map
* @param connections
*/
let toggleConnectionActive = (map, connections) => {
let selectedConnections = [];
let deselectedConnections = [];
for(let connection of connections){
if(connection.hasType('active')){
connection.removeType('active');
deselectedConnections.push(connection);
}else{
connection.addType('active');
selectedConnections.push(connection);
}
}
updateConnectionInfo(map, selectedConnections, deselectedConnections);
};
/**
* show system info panels
* @param map
* @param system
*/
let showSystemInfo = (map, system) => {
setSystemActive(map, system);
// get parent Tab Content and fire update event
let tabContentElement = getTabContentElementByMapElement( system );
// collect all required data from map module to update the info element
// store them global and assessable for each module
Util.setCurrentSystemData({
systemData: system.getSystemData(),
mapId: parseInt( system.attr('data-mapid') )
});
$(tabContentElement).trigger('pf:drawSystemModules');
};
/**
* show connection info panels
* @param map
* @param connection
*/
let showConnectionInfo = (map, connection) => {
setConnectionActive(map, connection);
// get parent Tab Content and fire update event
let mapContainer = $(map.getContainer());
let tabContentElement = getTabContentElementByMapElement(mapContainer);
$(tabContentElement).trigger('pf:drawConnectionModules', {
connections: [connection],
mapId: parseInt(mapContainer.data('id'))
});
};
/**
* update connection info panels
* @param map
* @param selectedConnections
* @param deselectedConnections
*/
let updateConnectionInfo = (map, selectedConnections, deselectedConnections) => {
// get parent Tab Content and fire update event
let mapContainer = $(map.getContainer());
$(document).trigger('pf:updateConnectionInfoModule', {
connectionsUpdate: selectedConnections,
connectionsRemove: deselectedConnections,
mapId: parseInt(mapContainer.data('id'))
});
};
/**
* search connections by systems
* @param {Object} map - jsPlumb
* @param {JQuery[]} systems - system DOM elements
* @returns {Array} connections - found connection, DOM elements
*/
let searchConnectionsBySystems = function(map, systems){
let searchConnectionsBySystems = (map, systems) => {
let connections = [];
let withBackConnection = true;
@@ -247,7 +555,7 @@ define([
* @param {string|string[]} type
* @returns {Array}
*/
let searchConnectionsByScopeAndType = function(map, scope, type){
let searchConnectionsByScopeAndType = (map, scope, type) => {
let connections = [];
let scopeArray = (scope === undefined) ? ['*'] : ((Array.isArray(scope)) ? scope : [scope]);
let typeArray = (type === undefined) ? [] : ((Array.isArray(type)) ? type : [type]);
@@ -276,7 +584,7 @@ define([
* @param {string} option
* @returns {string}
*/
let getConnectionInfo = function(connectionTyp, option){
let getConnectionInfo = (connectionTyp, option) => {
let connectionInfo = '';
if(Init.connectionTypes.hasOwnProperty(connectionTyp)){
connectionInfo = Init.connectionTypes[connectionTyp][option];
@@ -291,7 +599,7 @@ define([
* @param {JQuery} systemB
* @returns {Array}
*/
let checkForConnection = function(map, systemA, systemB){
let checkForConnection = (map, systemA, systemB) => {
let connections = [];
connections = connections.concat( map.getConnections({scope: '*', source: systemA, target: systemB}) );
// get connections where system is target
@@ -305,7 +613,7 @@ define([
* @param {string} scope
* @returns {string}
*/
let getDefaultConnectionTypeByScope = function(scope){
let getDefaultConnectionTypeByScope = (scope) => {
let type = '';
switch(scope){
case 'wh':
@@ -329,7 +637,7 @@ define([
* @param {Object} connection - jsPlumb object
* @param {string} status
*/
let setConnectionWHStatus = function(connection, status){
let setConnectionWHStatus = (connection, status) => {
if(
status === 'wh_fresh' &&
connection.hasType('wh_fresh') !== true
@@ -370,7 +678,7 @@ define([
* @param {string} option
* @returns {string}
*/
let getScopeInfoForConnection = function(info, option){
let getScopeInfoForConnection = (info, option) => {
let scopeInfo = '';
if(Init.connectionScopes.hasOwnProperty(info)){
switch(option){
@@ -388,21 +696,11 @@ define([
return scopeInfo;
};
/**
* get TabContentElement by any element on a map e.g. system
* @param element
* @returns {*}
*/
let getTabContentElementByMapElement = function(element){
let tabContentElement = $(element).parents('.' + config.mapTabContentClass);
return tabContentElement;
};
/**
* store mapId for current user (IndexedDB)
* @param mapId
*/
let storeDefaultMapId = function(mapId){
let storeDefaultMapId = (mapId) => {
if(mapId > 0){
let userData = Util.getCurrentUserData();
if(
@@ -419,7 +717,7 @@ define([
* @param type
* @returns {boolean}
*/
let getLocalStoragePrefixByType = function(type){
let getLocalStoragePrefixByType = (type) => {
let prefix = false;
switch(type){
case 'character': prefix = config.characterLocalStoragePrefix; break;
@@ -435,7 +733,7 @@ define([
* @param objectId
* @returns {*}
*/
let getLocaleData = function(type, objectId){
let getLocaleData = (type, objectId) => {
if(objectId > 0){
let storageKey = getLocalStoragePrefixByType(type) + objectId;
return Util.getLocalStorage().getItem(storageKey);
@@ -451,7 +749,7 @@ define([
* @param key
* @param value
*/
let storeLocalData = function(type, objectId, key, value){
let storeLocalData = (type, objectId, key, value) => {
if(objectId > 0){
// get current map config
let storageKey = getLocalStoragePrefixByType(type) + objectId;
@@ -481,7 +779,7 @@ define([
* @param objectId
* @param key
*/
let deleteLocalData = function(type, objectId, key){
let deleteLocalData = (type, objectId, key) => {
if(objectId > 0){
// get current map config
let storageKey = getLocalStoragePrefixByType(type) + objectId;
@@ -625,6 +923,54 @@ define([
});
};
/**
* add a wormhole tooltip with wh specific data to elements
* @param tooltipData
* @returns {*}
*/
$.fn.addWormholeInfoTooltip = function(tooltipData){
return this.each(function() {
let element = $(this);
requirejs(['text!templates/tooltip/wormhole_info.html', 'mustache'], function (template, Mustache) {
// format tooltip data
let data = {};
if(tooltipData.massTotal){
data.massTotal = Util.formatMassValue(tooltipData.massTotal);
}
if(tooltipData.massIndividual){
data.massIndividual = Util.formatMassValue(tooltipData.massIndividual);
}
if(tooltipData.massRegeneration){
data.massRegeneration = Util.formatMassValue(tooltipData.massRegeneration);
}
if(tooltipData.maxStableTime){
data.maxStableTime = tooltipData.maxStableTime + ' h';
}
let content = Mustache.render(template, data);
element.popover({
placement: 'top',
html: true,
trigger: 'hover',
content: '',
container: 'body',
title: tooltipData.name +
'<span class="pull-right ' + tooltipData.class +'">' + tooltipData.security + '</span>',
delay: {
show: 250,
hide: 0
}
});
// set new popover content
let popover = element.data('bs.popover');
popover.options.content = content;
});
});
};
$.fn.findMapElement = function(){
return $(this).find('.' + config.mapClass);
};
@@ -650,6 +996,12 @@ define([
getInfoForSystem: getInfoForSystem,
getSystemTypeInfo: getSystemTypeInfo,
getEffectInfoForSystem: getEffectInfoForSystem,
toggleSelectSystem: toggleSelectSystem,
toggleConnectionActive: toggleConnectionActive,
showSystemInfo: showSystemInfo,
showConnectionInfo: showConnectionInfo,
getConnectionsByType: getConnectionsByType,
getDataByConnection: getDataByConnection,
searchConnectionsBySystems: searchConnectionsBySystems,
searchConnectionsByScopeAndType: searchConnectionsByScopeAndType,
getConnectionInfo: getConnectionInfo,
@@ -657,7 +1009,11 @@ define([
getDefaultConnectionTypeByScope: getDefaultConnectionTypeByScope,
setConnectionWHStatus: setConnectionWHStatus,
getScopeInfoForConnection: getScopeInfoForConnection,
getDataByConnections: getDataByConnections,
getConnectionDataFromSignatures: getConnectionDataFromSignatures,
getEndpointOverlayContent: getEndpointOverlayContent,
getTabContentElementByMapElement: getTabContentElementByMapElement,
hasActiveConnection: hasActiveConnection,
storeDefaultMapId: storeDefaultMapId,
getLocaleData: getLocaleData,
storeLocalData: storeLocalData,

1
js/app/mappage.js
View File

@@ -64,6 +64,7 @@ define([
Init.connectionScopes = initData.connectionScopes;
Init.systemStatus = initData.systemStatus;
Init.systemType = initData.systemType;
Init.wormholes = initData.wormholes;
Init.characterStatus = initData.characterStatus;
Init.routes = initData.routes;
Init.url = initData.url;

418
js/app/module_map.js
View File

@@ -4,14 +4,28 @@ define([
'app/util',
'app/map/map',
'app/map/util',
'app/counter',
'sortable',
'app/ui/system_info',
'app/ui/system_graph',
'app/ui/system_signature',
'app/ui/system_route',
'app/ui/system_killboard'
], function($, Init, Util, Map, MapUtil) {
'app/ui/system_killboard',
'app/ui/connection_info',
'app/counter'
], function(
$,
Init,
Util,
Map,
MapUtil,
Sortable,
SystemInfoModule,
SystemGraphModule,
SystemSignatureModule,
SystemRouteModule,
SystemKillboardModule,
ConnectionInfoModule
){
'use strict';
let config = {
@@ -67,118 +81,245 @@ define([
*/
$.fn.setTabContentObserver = function(){
return this.each(function(){
let tabContentElement = $(this);
// update Tab Content with system data information
$(this).on('pf:drawSystemModules', function(e){
drawSystemModules($( e.target ));
tabContentElement.on('pf:drawSystemModules', function(e){
drawSystemModules($(e.target));
});
$(this).on('pf:removeSystemModules', function(e){
removeSystemModules($( e.target ));
tabContentElement.on('pf:removeSystemModules', function(e){
removeSystemModules($(e.target));
});
tabContentElement.on('pf:drawConnectionModules', function(e, data){
drawConnectionModules($(e.target), data);
});
tabContentElement.on('pf:removeConnectionModules', function(e){
removeConnectionModules($(e.target));
});
});
};
/**
* clear all system info modules and remove them
* remove multiple modules
* @param tabContentElement
* @param modules
*/
let removeModules = (tabContentElement, modules) => {
for(let Module of modules){
let moduleElement = tabContentElement.find('.' + Module.config.moduleTypeClass);
removeModule(moduleElement, Module);
}
};
/**
* clear all system modules and remove them
* @param tabContentElement
*/
let removeSystemModules = (tabContentElement) => {
let systemModules = [SystemInfoModule, SystemGraphModule, SystemSignatureModule, SystemRouteModule, SystemKillboardModule];
removeModules(tabContentElement, systemModules);
};
/**
* clear all connection modules and remove them
* @param tabContentElement
*/
let removeConnectionModules = (tabContentElement) => {
let connectionModules = [ConnectionInfoModule];
removeModules(tabContentElement, connectionModules);
};
/**
* remove a single module
* @param moduleElement
* @param Module
* @param callback
*/
let removeSystemModules = function(tabContentElement, callback){
tabContentElement.find('.' + config.moduleClass).velocity('transition.slideDownOut', {
duration: Init.animationSpeed.mapModule,
complete: function(tempElement){
$(tempElement).remove();
if(callback){
callback();
}
let removeModule = (moduleElement, Module, callback) => {
if(moduleElement.length > 0){
if(typeof Module.beforeReDraw === 'function'){
Module.beforeReDraw();
}
});
moduleElement.velocity('reverse',{
complete: function(moduleElement){
moduleElement = $(moduleElement);
if(typeof Module.beforeDestroy === 'function'){
Module.beforeDestroy(moduleElement);
}
moduleElement.remove();
if(typeof callback === 'function'){
callback();
}
}
});
}
};
/**
* generic function that draws a modulePanel for a given Module object
* @param parentElement
* @param Module
* @param mapId
* @param data
*/
let drawModule = (parentElement, Module, mapId, data) => {
/**
* get module position within its parentElement
* @param parentElement
* @param Module
* @param defaultPosition
* @returns {number}
*/
let getModulePosition = (parentElement, Module, defaultPosition) => {
let position = 0;
if(defaultPosition > 0){
parentElement.children().each((i, moduleElement) => {
position = i + 1;
let tempPosition = parseInt(moduleElement.getAttribute('data-position')) || 0;
if(tempPosition >= defaultPosition){
position--;
return false;
}
});
}
return position;
};
/**
* show/render a Module
* @param parentElement
* @param Module
* @param mapId
* @param data
*/
let showPanel = (parentElement, Module, mapId, data) => {
let moduleElement = Module.getModule(parentElement, mapId, data);
if (moduleElement) {
// store Module object to DOM element for further access
moduleElement.data('module', Module);
moduleElement.data('data', data);
moduleElement.addClass([config.moduleClass, Module.config.moduleTypeClass].join(' '));
moduleElement.css({opacity: 0}); // will be animated
// check module position from local storage
let promiseStore = MapUtil.getLocaleData('map', mapId);
promiseStore.then(function (dataStore) {
let Module = this.moduleElement.data('module');
let defaultPosition = Module.config.modulePosition || 0;
// check for stored module order in indexDB (client) ----------------------------------------------
let key = 'modules_cell_' + this.parentElement.attr('data-position');
if (
dataStore &&
dataStore[key]
) {
let positionIndex = dataStore[key].indexOf(Module.config.moduleName);
if (positionIndex !== -1) {
// first index (0) => is position 1
defaultPosition = positionIndex + 1;
}
}
// find correct position for new moduleElement ----------------------------------------------------
let position = getModulePosition(this.parentElement, Module, defaultPosition);
this.moduleElement.attr('data-position', defaultPosition);
this.moduleElement.attr('data-module', Module.config.moduleName);
// insert at correct position ---------------------------------------------------------------------
let prevModuleElement = this.parentElement.find('.' + config.moduleClass + ':nth-child(' + position + ')');
if (prevModuleElement.length) {
this.moduleElement.insertAfter(prevModuleElement);
} else {
this.parentElement.prepend(this.moduleElement);
}
if(typeof Module.beforeShow === 'function'){
Module.beforeShow(this.moduleElement, moduleElement.data('data'));
}
// show animation ---------------------------------------------------------------------------------
this.moduleElement.velocity({
opacity: [1, 0],
translateY: [0, +20]
}, {
duration: Init.animationSpeed.mapModule,
easing: 'easeOutSine',
complete: function (moduleElement) {
moduleElement = $(moduleElement);
let Module = $(moduleElement).data('module');
if (typeof Module.initModule === 'function') {
Module.initModule(moduleElement, mapId, moduleElement.data('data'));
}
}
});
}.bind({
parentElement: parentElement,
moduleElement: moduleElement
}));
}
};
// check if module already exists
let moduleElement = parentElement.find('.' + Module.config.moduleTypeClass);
if(moduleElement.length > 0){
removeModule(moduleElement, Module, () => {
showPanel(parentElement, Module, mapId, data);
});
}else{
showPanel(parentElement, Module, mapId, data);
}
};
/**
* clears and updates the system info element (signature table, system info,...)
* @param tabContentElement
*/
let drawSystemModules = function(tabContentElement){
require(['datatables.loader'], () => {
let drawSystemModules = (tabContentElement) => {
require(['datatables.loader'], function(){
let currentSystemData = Util.getCurrentSystemData();
// get Table cell for system Info
let firstCell = $(tabContentElement).find('.' + config.mapTabContentCellFirst);
let secondCell = $(tabContentElement).find('.' + config.mapTabContentCellSecond);
// get grid cells
let firstCell = tabContentElement.find('.' + config.mapTabContentCellFirst);
let secondCell = tabContentElement.find('.' + config.mapTabContentCellSecond);
// draw system info module
firstCell.drawSystemInfoModule(currentSystemData.mapId, currentSystemData.systemData);
drawModule(firstCell, SystemInfoModule, currentSystemData.mapId, currentSystemData.systemData);
// draw system graph module
firstCell.drawSystemGraphModule(currentSystemData.systemData);
drawModule(firstCell, SystemGraphModule, currentSystemData.mapId, currentSystemData.systemData);
// draw signature table module
firstCell.drawSignatureTableModule(currentSystemData.mapId, currentSystemData.systemData);
drawModule(firstCell, SystemSignatureModule, currentSystemData.mapId, currentSystemData.systemData);
// draw system routes module
secondCell.drawSystemRouteModule(currentSystemData.mapId, currentSystemData.systemData);
drawModule(secondCell, SystemRouteModule, currentSystemData.mapId, currentSystemData.systemData);
// draw system killboard module
secondCell.drawSystemKillboardModule(currentSystemData.systemData);
// set Module Observer
setModuleObserver();
drawModule(secondCell, SystemKillboardModule, currentSystemData.mapId, currentSystemData.systemData);
});
};
/**
* set observer for each module
* clears and updates the connection info element (mass log)
* @param tabContentElement
* @param data
*/
let setModuleObserver = function(){
let drawConnectionModules = (tabContentElement, data) => {
require(['datatables.loader'], function(){
// toggle height for a module
$(document).off('click.toggleModuleHeight').on('click.toggleModuleHeight', '.' + config.moduleClass, function(e){
let moduleElement = $(this);
// get click position
let posX = moduleElement.offset().left;
let posY = moduleElement.offset().top;
let clickX = e.pageX - posX;
let clickY = e.pageY - posY;
// get grid cells
let firstCell = $(tabContentElement).find('.' + config.mapTabContentCellFirst);
// check for top-left click
if(clickX <= 8 && clickY <= 8){
// remember height
if(! moduleElement.data('origHeight')){
moduleElement.data('origHeight', moduleElement.outerHeight());
}
if(moduleElement.hasClass( config.moduleClosedClass )){
let moduleHeight = moduleElement.data('origHeight');
moduleElement.velocity('finish').velocity({
height: [ moduleHeight + 'px', [ 400, 15 ] ]
},{
duration: 400,
easing: 'easeOutSine',
complete: function(){
moduleElement.removeClass( config.moduleClosedClass );
moduleElement.removeData();
}
});
}else{
moduleElement.velocity('finish').velocity({
height: [ '35px', [ 400, 15 ] ]
},{
duration: 400,
easing: 'easeOutSine',
complete: function(){
moduleElement.addClass( config.moduleClosedClass );
}
});
}
}
});
// draw connection info module
drawModule(firstCell, ConnectionInfoModule, this.mapId, this.connections);
}.bind(data));
};
/**
* updates only visible/active map module
* @returns {boolean}
@@ -236,26 +377,115 @@ define([
}
};
/**
* set observer for tab content (area where modules will be shown)
* @param contentStructure
* @param mapId
*/
let setContentStructureObserver = (contentStructure, mapId) => {
contentStructure.find('.' + config.mapTabContentCell).each((index, cellElement) => {
let sortable = Sortable.create(cellElement, {
group: {
name: 'cell_' + cellElement.getAttribute('data-position')
},
animation: Init.animationSpeed.mapModule,
handle: '.pf-module-handler-drag',
draggable: '.' + config.moduleClass,
ghostClass: 'pf-sortable-ghost',
scroll: true,
scrollSensitivity: 50,
scrollSpeed: 20,
dataIdAttr: 'data-module',
sort: true,
store: {
get: function (sortable) {
return [];
},
set: function (sortable) {
let key = 'modules_' + sortable.options.group.name;
MapUtil.storeLocalData('map', mapId, key, sortable.toArray());
}
},
onStart: function (e) {
// Element dragging started
// -> save initial sort state -> see store.set()
this.save();
}
});
});
// toggle height for a module
$(document).off('click.toggleModuleHeight').on('click.toggleModuleHeight', '.' + config.moduleClass, function(e){
let moduleElement = $(this);
// get click position
let posX = moduleElement.offset().left;
let posY = moduleElement.offset().top;
let clickX = e.pageX - posX;
let clickY = e.pageY - posY;
// check for top-left click
if(clickX <= 8 && clickY <= 8){
// remember height
if(! moduleElement.data('origHeight')){
moduleElement.data('origHeight', moduleElement.outerHeight());
}
if(moduleElement.hasClass( config.moduleClosedClass )){
let moduleHeight = moduleElement.data('origHeight');
moduleElement.velocity('finish').velocity({
height: [ moduleHeight + 'px', [ 400, 15 ] ]
},{
duration: 400,
easing: 'easeOutSine',
complete: function(){
moduleElement.removeClass( config.moduleClosedClass );
moduleElement.removeData();
}
});
}else{
moduleElement.velocity('finish').velocity({
height: [ '35px', [ 400, 15 ] ]
},{
duration: 400,
easing: 'easeOutSine',
complete: function(){
moduleElement.addClass( config.moduleClosedClass );
}
});
}
}
});
};
/**
* load all structure elements into a TabsContent div (tab body)
*/
$.fn.initContentStructure = function(){
return this.each(function(){
// init bootstrap Grid
let contentStructure = $('<div>', {
class: ['row', config.mapTabContentRow].join(' ')
}).append(
let initContentStructure = (tabContentElements) => {
tabContentElements.each(function(){
let tabContentElement = $(this);
let mapId = parseInt( tabContentElement.attr('data-mapid') );
// "add" tab does not need a structure and obervers...
if(mapId > 0){
let contentStructure = $('<div>', {
class: ['row', config.mapTabContentRow].join(' ')
}).append(
$('<div>', {
class: ['col-xs-12', 'col-md-8', config.mapTabContentCellFirst, config.mapTabContentCell].join(' ')
})
}).attr('data-position', 1)
).append(
$('<div>', {
class: ['col-xs-12', 'col-md-4', config.mapTabContentCellSecond, config.mapTabContentCell].join(' ')
})
}).attr('data-position', 2)
);
// append grid structure
$(this).append(contentStructure);
// append grid structure
tabContentElement.append(contentStructure);
setContentStructureObserver(contentStructure, mapId);
}
});
};
@@ -264,7 +494,7 @@ define([
* @param options
* @returns {*|jQuery|HTMLElement}
*/
let getTabElement = function(options){
let getTabElement = (options) => {
let tabElement = $('<div>', {
id: config.mapTabElementId
});
@@ -401,17 +631,17 @@ define([
// update Tab element -> set data
linkElement.updateTabData(options);
// tabs content =======================================================
// tabs content -----------------------------------------------------------------------------------------------
let contentElement = $('<div>', {
id: config.mapTabIdPrefix + parseInt( options.id ),
class: [config.mapTabContentClass].join(' ')
});
}).attr('data-mapid', parseInt( options.id ));
contentElement.addClass('tab-pane');
tabContent.append(contentElement);
// init tab ===========================================================
// init tab ---------------------------------------------------------------------------------------------------
linkElement.on('click', function(e){
e.preventDefault();
@@ -603,7 +833,7 @@ define([
newTabElements.contentElement.setTabContentObserver();
// load all the structure elements for the new tab
newTabElements.contentElement.initContentStructure();
initContentStructure(newTabElements.contentElement);
tabsChanged = true;
@@ -671,7 +901,7 @@ define([
mapKeyTabSelector = 'nth-child(' + ( mapDataIndex + 1 ) + ')';
}
// ==============================================================
// ----------------------------------------------------------------------------------------------------
// this new created module
let tabContentElements = tabMapElement.find('.' + config.mapTabContentClass);
@@ -680,7 +910,7 @@ define([
tabContentElements.setTabContentObserver();
// load all the structure elements for ALL Tab Content Body
tabContentElements.initContentStructure();
initContentStructure(tabContentElements);
// set first Tab active
tabMapElement.find('.' + config.mapTabClass + ':' + mapKeyTabSelector + ' a').tab('show');

119
js/app/page.js
View File

@@ -696,6 +696,10 @@ define([
// END menu events =============================================================================
// global "modal" callback (for all modals)
$('body').on('hide.bs.modal', '> .modal', function(a,b) {
$(this).destroyTimestampCounter();
});
// update header links with current map data
$(document).on('pf:updateHeaderMapData', function(e, data){
@@ -783,45 +787,69 @@ define([
$.fn.updateHeaderUserData = function(){
let userData = Util.getCurrentUserData();
let userInfoElement = $('.' + config.headUserCharacterClass);
let currentCharacterId = userInfoElement.data('characterId');
let currentCharactersOptionIds = userInfoElement.data('characterOptionIds') ? userInfoElement.data('characterOptionIds') : [];
let newCharacterId = 0;
let newCharacterName = '';
let userInfoElement = $('.' + config.headUserCharacterClass);
let currentCharacterId = userInfoElement.data('characterId');
let currentCharactersOptionIds = userInfoElement.data('characterOptionIds') ? userInfoElement.data('characterOptionIds') : [];
let newCharacterId = 0;
let newCharacterName = '';
let userShipElement = $('.' + config.headUserShipClass);
let currentShipId = userShipElement.data('shipId');
let newShipId = 0;
let newShipName = '';
let userShipElement = $('.' + config.headUserShipClass);
let currentShipData = userShipElement.data('shipData');
let currentShipId = Util.getObjVal(currentShipData, 'typeId') || 0;
let newShipData = {
typeId: 0,
typeName: ''
};
// function for header element toggle animation
let animateHeaderElement = function(element, callback, triggerShow){
let animateHeaderElement = (element, callback, triggerShow) => {
let currentOpacity = parseInt(element.css('opacity'));
element.show().velocity('stop').velocity({
opacity: 0
},{
visibility : 'hidden',
duration: 500,
complete: function(){
// callback
callback();
let showHeaderElement = (element) => {
element.show().velocity({
opacity: [ 1, 0 ]
},{
// display: 'block',
visibility : 'visible',
duration: 1000
});
};
// show element
if(triggerShow === true){
element.velocity({
opacity: 1
}, {
visibility : 'visible',
duration: 500
});
}else{
// hide element
element.hide();
let hideHeaderElement = (element, callback) => {
element.velocity('stop').velocity({
opacity: [ 0, 1 ]
},{
// display: 'none',
visibility : 'hidden',
duration: 1000,
complete: function(){
// callback
callback($(this));
}
});
};
}
});
// run show/hide toggle in the correct order
if(currentOpacity > 0 && triggerShow){
// hide then show animation
hideHeaderElement(element, (element) => {
callback(element);
showHeaderElement(element);
});
}else if(currentOpacity > 0 && !triggerShow){
// hide animation
hideHeaderElement(element, (element) => {
element.hide();
callback(element);
});
}else if(currentOpacity === 0 && triggerShow){
// show animation
callback(element);
showHeaderElement(element);
}else{
// no animation
callback(element);
}
};
// check for character/ship changes ---------------------------------------------
@@ -833,8 +861,7 @@ define([
newCharacterName = userData.character.name;
if(userData.character.log){
newShipId = userData.character.log.ship.typeId;
newShipName = userData.character.log.ship.typeName;
newShipData = userData.character.log.ship;
}
// en/disable "map tracking" toggle
@@ -854,7 +881,7 @@ define([
}
// toggle element
animateHeaderElement(userInfoElement, function(){
animateHeaderElement(userInfoElement, (userInfoElement) => {
if(currentCharacterChanged){
userInfoElement.find('span').text( newCharacterName );
userInfoElement.find('img').attr('src', Init.url.ccpImageServer + '/Character/' + newCharacterId + '_32.jpg' );
@@ -869,21 +896,21 @@ define([
}
// update user ship data --------------------------------------------------------
if(currentShipId !== newShipId){
if(currentShipId !== newShipData.typeId){
// set new data for next check
userShipElement.data('shipData', newShipData);
let showShipElement = true;
if(newShipId === 0){
showShipElement = false;
}
let showShipElement = newShipData.typeId > 0;
// toggle element
animateHeaderElement(userShipElement, function(){
userShipElement.find('span').text( newShipName );
userShipElement.find('img').attr('src', Init.url.ccpImageServer + '/Render/' + newShipId + '_32.png' );
animateHeaderElement(userShipElement, (userShipElement) => {
userShipElement.find('span').text( newShipData.typeName );
userShipElement.find('img').attr('src', Init.url.ccpImageServer + '/Render/' + newShipData.typeId + '_32.png' );
// trigger ship change event
$(document).trigger('pf:activeShip', {
shipData: newShipData
});
}, showShipElement);
// set new id for next check
userShipElement.data('shipId', newShipId);
}
};

7
js/app/render.js
View File

@@ -17,7 +17,7 @@ define(['jquery', 'mustache'], function($, Mustache) {
typeof config.functions === 'object' &&
typeof config.functions[functionName] === 'function'
){
config.functions[functionName]();
config.functions[functionName](config);
}
};
@@ -27,16 +27,13 @@ define(['jquery', 'mustache'], function($, Mustache) {
* @param data
*/
let showModule = function(config, data){
// require module template
requirejs(['text!templates/' + config.name + '.html'], function(template) {
// check for an id, if module already exists, do not insert again
if(
data.id === 'undefined' ||
$('#' + data.id).length === 0
){
let content = Mustache.render(template, data);
// display module
@@ -57,8 +54,6 @@ define(['jquery', 'mustache'], function($, Mustache) {
// init module function after render
initModule('after', config);
});
};

966
js/app/ui/connection_info.js Normal file
View File

@@ -0,0 +1,966 @@
/**
* connection info module
*/
define([
'jquery',
'app/init',
'app/util',
'app/map/util'
], ($, Init, Util, MapUtil) => {
'use strict';
let config = {
// module info
modulePosition: 1,
moduleName: 'connectionInfo',
moduleHeadClass: 'pf-module-head', // class for module header
moduleHandlerClass: 'pf-module-handler-drag', // class for "drag" handler
headUserShipClass: 'pf-head-user-ship', // class for "user settings" link
// connection info module
moduleTypeClass: 'pf-connection-info-module', // class for this module
// headline toolbar
moduleHeadlineIconClass: 'pf-module-icon-button', // class for toolbar icons in the head
moduleHeadlineIconRefreshClass: 'pf-module-icon-button-refresh', // class for "refresh" icon
moduleHeadlineIconCurrentMassClass: 'pf-module-icon-button-mass', // class for "current ship mass" toggle icon
connectionInfoPanelClass: 'pf-connection-info-panel', // class for connection info panels
connectionInfoPanelId: 'pf-connection-info-panel-', // id prefix for connection info panels
// info table
moduleTableClass: 'pf-module-table', // class for module tables
connectionInfoTableLabelSourceClass: 'pf-connection-info-label-source', // class for source label
connectionInfoTableLabelTargetClass: 'pf-connection-info-label-target', // class for target label
connectionInfoTableRowMassShipClass: 'pf-connection-info-row-mass-ship', // class for "current ship mass" table row
connectionInfoTableCellMassTotalClass: 'pf-connection-info-mass-total', // class for "mass total" table cell
connectionInfoTableCellMassLogClass: 'pf-connection-info-mass-log', // class for "mass log" table cell
connectionInfoTableCellMassShipClass: 'pf-connection-info-mass-ship', // class for "current ship mass" table cell
connectionInfoTableCellMassLeftClass: 'pf-connection-info-mass-left', // class for "mass left" table cell
connectionInfoTableTooltipIconClass: 'pf-connection-info-tooltip-icon', // class for "tooltip" icon
connectionInfoTableWarningIconClass: 'pf-connection-info-warning-icon', // class for "warning" icon
// dataTable
connectionInfoTableClass: 'pf-connection-info-table', // class for connection tables
tableCellImageClass: 'pf-table-image-cell', // class for table "image" cells
tableCellCounterClass: 'pf-table-counter-cell', // class for table "counter" cells
// config
showShip: true // default for "show current ship mass" toggle
};
/**
* get module toolbar element
* @returns {void|*|jQuery|HTMLElement}
*/
let getHeadlineToolbar = () => {
let headlineToolbar = $('<h5>', {
class: 'pull-right'
}).append(
$('<i>', {
class: ['fa', 'fa-fw', 'fa-male',
config.showShip ? 'active' : '' ,
config.moduleHeadlineIconClass,
config.moduleHeadlineIconCurrentMassClass].join(' '),
title: 'toggle&nbsp;current&nbsp;ship&nbsp;mass'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip'),
$('<i>', {
class: ['fa', 'fa-fw', 'fa-refresh',
config.moduleHeadlineIconClass,
config.moduleHeadlineIconRefreshClass].join(' '),
title: 'refresh&nbsp;all'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip')
);
headlineToolbar.find('[data-toggle="tooltip"]').tooltip({
container: 'body'
});
return headlineToolbar;
};
/**
* get new connection element
* @param mapId
* @param connectionId
* @returns {jQuery}
*/
let getConnectionElement = (mapId, connectionId) => {
let connectionElement = $('<div>', {
id: getConnectionElementId(connectionId),
class: ['col-xs-12', 'col-sm-4', 'col-lg-3' , config.connectionInfoPanelClass].join(' ')
}).data({
mapId: mapId,
connectionId: connectionId
});
return connectionElement;
};
/**
* get info control panel element
* @param mapId
* @returns {void|jQuery|*}
*/
let getInfoPanelControl = (mapId) => {
let connectionElement = getConnectionElement(mapId, 0).append($('<div>', {
class: 'pf-dynamic-area',
html: '<i class="fa fa-fw fa-plus"></i>&nbsp;add connection&nbsp;&nbsp;<kbd>ctrl</kbd>&nbsp;+&nbsp;<kbd>click</kbd>'
}));
return connectionElement;
};
/**
* get connection information element
* @param connectionData
* @returns {void|*|jQuery|HTMLElement}
*/
let getInformationElement = (connectionData) => {
// connection scope -----------------------------------------------------------------------
let scopeLabel = MapUtil.getScopeInfoForConnection(connectionData.scope, 'label');
// connection type (dummy) classes --------------------------------------------------------
let connectionClasses = ['pf-fake-connection'];
for(let i = 0; i < connectionData.type.length; i++){
connectionClasses.push( MapUtil.getConnectionInfo( connectionData.type[i], 'cssClass') );
}
let massLog = 0;
let element = $('<div>', {
class: 'pf-dynamic-area'
}).append(
$('<table>', {
class: ['table', 'table-condensed', 'pf-table-fixed', config.moduleTableClass].join(' ')
}).data('showShip', config.showShip).append(
$('<thead>').append(
$('<tr>').append(
$('<th>', {
class: ['pf-table-cell-20', 'text-right', 'pf-help', 'pf-pie-chart'].join(' '),
title: 'test'
}).attr('data-toggle', 'tooltip').attr('data-percent', '-100').easyPieChart({
barColor: (percent) => {
let color = '#e28a0d';
if((percent * -1) >= 100){
color = '#a52521';
}
return color;
},
overrideOptions: 'signed',
trackColor: '#5cb85c',
size: 14,
scaleColor: false,
lineWidth: 2,
lineCap: 'butt',
animate: false
}),
$('<th>', {
class: ['text-right'].join(' ')
}).attr('colspan', 2).append(
$('<span>', {
class: 'pf-link',
html: connectionData.sourceAlias + '&nbsp;&nbsp;'
}).on('click', function(){
Util.getMapModule().getActiveMap().triggerMenuEvent('SelectSystem', {systemId: connectionData.source });
}),
$('<span>', {
class: [config.connectionInfoTableLabelSourceClass].join(' ')
}),
$('<i>', {
class: 'fa fa-fw fa-angle-double-right'
}),
$('<span>', {
class: [config.connectionInfoTableLabelTargetClass].join(' ')
}),
$('<span>', {
class: 'pf-link',
html: '&nbsp;&nbsp;' + connectionData.targetAlias
}).on('click', function(){
Util.getMapModule().getActiveMap().triggerMenuEvent('SelectSystem', {systemId: connectionData.target });
})
)
)
),
$('<tbody>').append(
$('<tr>').append(
$('<td>'),
$('<td>', {
text: scopeLabel.charAt(0).toUpperCase() + scopeLabel.slice(1)
}),
$('<td>', {
class: ['text-right'].join(' ')
}).append(
$('<div>', {
class: connectionClasses.join(' ')
})
)
),
$('<tr>').append(
$('<td>', {
class: ['text-right', 'pf-help'].join(' '),
html: '<i class="fa fa-fw fa-question-circle"></i>',
title: 'initial mass. From signature table'
}).attr('data-toggle', 'tooltip'),
$('<td>', {
text: 'Total mass'
}),
$('<td>', {
class: ['text-right', 'txt-color', config.connectionInfoTableCellMassTotalClass].join(' ')
})
),
$('<tr>').append(
$('<td>', {
class: ['text-right', 'pf-help'].join(' '),
html: '<i class="fa fa-fw fa-question-circle"></i>',
title: 'recorded total jump mass'
}).attr('data-toggle', 'tooltip'),
$('<td>', {
text: 'Logged mass'
}),
$('<td>', {
class: ['text-right', config.connectionInfoTableCellMassLogClass].join(' ')
})
),
$('<tr>', {
class: config.connectionInfoTableRowMassShipClass
}).append(
$('<td>', {
class: ['text-right', 'pf-help'].join(' '),
title: 'current ship mass'
}).attr('data-toggle', 'tooltip').append(
$('<i>', {
class: [
'fa', 'fa-fw', 'fa-question-circle',
config.connectionInfoTableTooltipIconClass
].join(' ')
}),
$('<i>', {
class: [
'fa', 'fa-fw', 'fa-exclamation-triangle',
'txt-color', 'txt-color-danger',
'hidden', config.connectionInfoTableWarningIconClass
].join(' ')
})
),
$('<td>', {
class: ['pf-table-cell-ellipses-auto'].join(' '),
text: 'Ship mass'
}),
$('<td>', {
class: ['text-right', 'txt-color', config.connectionInfoTableCellMassShipClass].join(' ')
})
),
$('<tr>').append(
$('<td>', {
class: ['text-right', 'pf-help'].join(' '),
html: '<i class="fa fa-fw fa-question-circle"></i>',
title: 'max. mass left'
}).attr('data-toggle', 'tooltip'),
$('<td>', {
text: 'Mass left'
}),
$('<td>', {
class: ['text-right', 'txt-color', config.connectionInfoTableCellMassLeftClass].join(' ')
})
)
)
).on('pf:updateInfoTable', function(e, data){
// update information table -------------------------------------------------------
let tableElement = $(this);
let connectionData = tableElement.data('connectionData');
if(connectionData){
if(connectionData.scope === 'wh'){
// update signature information -------------------------------------------
let sourceLabelElement = tableElement.find('.' + config.connectionInfoTableLabelSourceClass);
let targetLabelElement = tableElement.find('.' + config.connectionInfoTableLabelTargetClass);
// get related jsPlumb connection
let connection = $().getConnectionById(data.mapId, data.connectionId);
let signatureTypeNames = MapUtil.getConnectionDataFromSignatures(connection, connectionData);
let sourceLabel = signatureTypeNames.sourceLabels;
let targetLabel = signatureTypeNames.targetLabels;
sourceLabelElement.html(MapUtil.getEndpointOverlayContent(sourceLabel));
targetLabelElement.html(MapUtil.getEndpointOverlayContent(targetLabel));
// remove K162
sourceLabel.diff(['K162']);
targetLabel.diff(['K162']);
// get static wormhole data by endpoint Labels
let wormholeName = '';
let wormholeData = null;
if(sourceLabel.length === 1 && targetLabel.length === 0){
wormholeName = sourceLabel[0];
}else if(sourceLabel.length === 0 && targetLabel.length === 1){
wormholeName = targetLabel[0];
}
if(
wormholeName &&
Init.wormholes.hasOwnProperty(wormholeName)
){
wormholeData = Init.wormholes[wormholeName];
}
// all required data is set -> re-calculate rows
tableElement.data('wormholeData', wormholeData);
tableElement.trigger('pf:calcInfoTable');
}
}
}).on('pf:calcInfoTable', function(e){
// re-calculate information table from .data() cell values ------------------------
let tableElement = $(this);
let massChartCell = tableElement.find('[data-percent]');
let wormholeData = tableElement.data('wormholeData');
let shipData = null;
let shipName = '';
let showShip = Boolean(tableElement.data('showShip'));
let massShipRow = tableElement.find('.' + config.connectionInfoTableRowMassShipClass);
// icons
let massShipTooltipIcon = massShipRow.find('.' + config.connectionInfoTableTooltipIconClass);
let massShipWarningIcon = massShipRow.find('.' + config.connectionInfoTableWarningIconClass);
// table cells
let massTotalCell = tableElement.find('.' + config.connectionInfoTableCellMassTotalClass);
let massLogCell = tableElement.find('.' + config.connectionInfoTableCellMassLogClass);
let massShipCell = tableElement.find('.' + config.connectionInfoTableCellMassShipClass);
let massLeftCell = tableElement.find('.' + config.connectionInfoTableCellMassLeftClass);
let massTotal = null; // initial connection mass
let massLog = massLogCell.data('mass'); // recorded mass
let massLogTotal = massLog; // recorded mass + current ship
let massIndividual = null; // mass mass per jump
let massShip = 0; // current ship
let massIndividualError = false;
// get wormhole data from signature binding ---------------------------------------
if(wormholeData){
massTotal = parseInt(wormholeData.massTotal);
massIndividual = parseInt(wormholeData.massIndividual);
}
// get current ship data ----------------------------------------------------------
massShipCell.parent().toggle(showShip);
if(showShip){
shipData = $('.' + config.headUserShipClass).data('shipData');
if(shipData){
if(shipData.mass){
massShip = parseInt(shipData.mass);
// check individual mass jump
if(massIndividual){
massIndividualError = massShip > massIndividual;
}
}
if(shipData.typeId && shipData.typeName){
shipName = shipData.typeName;
}
}
}
// update ship mass and "individual mass" cells ----------------------------------
massShipTooltipIcon.toggleClass('hidden', massIndividualError);
massShipWarningIcon.toggleClass('hidden', !massIndividualError);
let shipMassTooltip = 'current ship mass ' + (shipName ? '"' + shipName + '"' : '');
if(massIndividualError){
shipMassTooltip = '"' + shipName + '" exceeds max jump mass for this connection: ' + Util.formatMassValue(massIndividual);
}else{
// current ship mass check is OK -> add to massLogTotal
massLogTotal += massShip;
}
massShipTooltipIcon.parent().attr('title', shipMassTooltip).tooltip('fixTitle');
// current ship mass --------------------------------------------------------------
massShipCell.html( function(){
let cell = $(this);
let value = '&nbsp;';
let error = false;
let textLineThrough = false;
if(massShip > 0){
value += Util.formatMassValue(massShip);
if(massIndividualError){
error = textLineThrough = true;
value = '&nbsp;&nbsp;' + value;
}else{
value = '-' + value;
}
}else{
error = true;
value = 'undefined';
}
// change cell style
cell.toggleClass('txt-color-red', error)
.toggleClass('txt-color-warning', !error)
.toggleClass('pf-font-line-through', textLineThrough);
return value;
});
// calculate mass left ------------------------------------------------------------
let massLeft = massTotal - massLogTotal;
massLeft = (massLeft < 0) ? 0 : massLeft;
let massPercentLog = (massTotal > 0) ? Math.floor((100 / massTotal) * massLogTotal) : 0;
// update easyPieChart and tooltip ------------------------------------------------
let massPercentLeft = (100 - massPercentLog <= 0) ? 0 : '< ' + (100 - massPercentLog);
massChartCell.data('easyPieChart').enableAnimation().update(massPercentLog * -1);
massChartCell.attr('title', massPercentLeft + '% mass left').tooltip('fixTitle');
// update mass cells --------------------------------------------------------------
massTotalCell.html(massTotal > 0 ? Util.formatMassValue(massTotal) : 'undefined')
.toggleClass('txt-color-red', massTotal <= 0);
massLogCell.html('-&nbsp;' + Util.formatMassValue(massLog));
massLeftCell.html(
massLeft > 0 ?
'&#126;&nbsp;' + Util.formatMassValue(massLeft) :
(massLeft === 0 && massTotal) ?
'will collapse' : 'undefined')
.toggleClass('txt-color-red', massLeft <= 0)
.toggleClass('txt-color-success', massLeft > 0);
})
);
element.find('[data-toggle="tooltip"]').tooltip({
container: 'body'
});
return element;
};
/**
* get HTML id by connectionId
* @param connectionId
* @returns {string}
*/
let getConnectionElementId = (connectionId) => {
return config.connectionInfoPanelId + connectionId;
};
/**
* get all visible connection panel elements
* @param moduleElement
* @returns {*|T|{}}
*/
let getConnectionElements = (moduleElement) => {
return moduleElement.find('.' + config.connectionInfoPanelClass).not('#' + getConnectionElementId(0));
};
/**
* request connection log data
* @param requestData
* @param context
* @param callback
*/
let requestConnectionLogData = (requestData, context, callback) => {
// show loading animation
for(let connectionId of requestData.connectionIds){
context.moduleElement.find('#' + getConnectionElementId(connectionId) + ' table').showLoadingAnimation();
}
$.ajax({
type: 'POST',
url: Init.path.getMapConnectionData,
data: requestData,
dataType: 'json',
context: context
}).done(function(connectionsData){
// enrich connectionData with "logs" data (if available) and other "missing" data
for(let i = 0; i < this.connectionsData.length; i++){
for(let connectionData of connectionsData) {
if(this.connectionsData[i].id === connectionData.id){
// copy some missing data
this.connectionsData[i].created = connectionData.created;
// check for mass logs and copy data
if(connectionData.logs && connectionData.logs.length){
this.connectionsData[i].logs = connectionData.logs;
}
// check for signatures and copy data
if(connectionData.signatures && connectionData.signatures.length){
this.connectionsData[i].signatures = connectionData.signatures;
}
break;
}
}
}
callback(this.moduleElement, this.connectionsData);
}).always(function(){
// hide loading animation
for(let contextData of this.connectionsData){
context.moduleElement.find('#' + getConnectionElementId(contextData.id) + ' table').hideLoadingAnimation();
}
});
};
/**
* @see requestConnectionLogData
* @param moduleElement
* @param mapId
* @param connectionsData
*/
let getConnectionsLogData = (moduleElement, mapId, connectionsData) => {
let connectionIds = [];
for(let connectionData of connectionsData) {
connectionIds.push(connectionData.id);
}
let requestData = {
mapId: mapId,
connectionIds: connectionIds,
addData : ['signatures', 'logs'],
// filterData : ['logs'] // do not exclude connections with NO "logs" -> sig data will be used as well
};
let contextData = {
moduleElement: moduleElement,
connectionsData: connectionsData
};
requestConnectionLogData(requestData, contextData, addConnectionsData);
};
/**
* replace/insert dataTables log data
* @param moduleElement
* @param connectionsData
*/
let addConnectionsData = (moduleElement, connectionsData) => {
let getRowIndexesByData = (dataTable, colName, value) => {
return dataTable.rows().eq(0).filter((rowIdx) => {
return (dataTable.cell(rowIdx, colName + ':name' ).data() === value);
});
};
for(let connectionData of connectionsData) {
// find related dom element for current connection
let connectionElement = moduleElement.find('#' + getConnectionElementId(connectionData.id));
if(connectionElement.length){
// attach connectionData to connection information for later use ------------------
let connectionInfoElement = connectionElement.find('.' + config.moduleTableClass);
connectionInfoElement.data('connectionData', connectionData);
// update dataTable ---------------------------------------------------------------
let dataTable = connectionElement.find('.dataTable').dataTable().api();
if(connectionData.logs && connectionData.logs.length > 0){
for(let i = 0; i < connectionData.logs.length; i++){
let rowData = connectionData.logs[i];
let row = null;
let animationStatus = null;
let indexes = getRowIndexesByData(dataTable, 'index', rowData.id);
if(indexes.length === 0){
// row not found -> add new row
row = dataTable.row.add( rowData );
animationStatus = 'added';
}
/* else{
// we DON´t expect changes -> no row update)
// update row with FIRST index
//row = dataTable.row( parseInt(indexes[0]) );
// update row data
//row.data(connectionData.logs[i]);
//animationStatus = 'changed';
} */
if(
animationStatus !== null &&
row.length > 0
){
row.nodes().to$().data('animationStatus', animationStatus);
}
}
}else{
// clear table or leave empty
dataTable.clear();
}
// redraw dataTable
dataTable.draw(false);
}
}
};
/**
*
* @param moduleElement
* @param mapId
* @param connectionData
*/
let updateConnectionPanel = (moduleElement, mapId, connectionData) => {
let rowElement = moduleElement.find('.row');
let connectionElement = rowElement.find('#' + getConnectionElementId(connectionData.id));
if( !connectionElement.length ){
connectionElement = getConnectionElement(mapId, connectionData.id);
connectionElement.append(getInformationElement(connectionData));
let table = $('<table>', {
class: ['compact', 'stripe', 'order-column', 'row-border', 'nowrap', config.connectionInfoTableClass].join(' ')
}).append('<tfoot><tr><th></th><th></th><th></th><th></th><th></th></tr></tfoot>');
connectionElement.append(table);
// init empty table
let logTable = table.DataTable({
pageLength: 8,
paging: true,
pagingType: 'simple',
lengthChange: false,
ordering: true,
order: [[ 4, 'desc' ]],
info: true,
searching: false,
hover: false,
autoWidth: false,
// rowId: 'systemTo',
language: {
emptyTable: 'No jumps recorded',
info: '_START_ to _END_ of _MAX_',
infoEmpty: ''
},
columnDefs: [
{
targets: 0,
name: 'index',
title: '<i class="fa fa-hashtag"></i>',
orderable: false,
searchable: false,
width: 20,
class: 'text-center',
data: 'id'
},{
targets: 1,
title: '',
width: 26,
orderable: false,
className: ['pf-help-default', 'text-center', config.tableCellImageClass].join(' '),
data: 'ship',
render: {
_: function(data, type, row){
let value = data.typeId;
if(type === 'display'){
value = '<img src="' + Init.url.ccpImageServer + '/Render/' + value + '_32.png" title="' + data.typeName + '" data-toggle="tooltip" />';
}
return value;
}
},
createdCell: function(cell, cellData, rowData, rowIndex, colIndex){
$(cell).find('img').tooltip();
}
},{
targets: 2,
title: '',
width: 26,
orderable: false,
className: ['pf-help-default', 'text-center', config.tableCellImageClass].join(' '),
data: 'created.character',
render: {
_: function(data, type, row){
let value = data.name;
if(type === 'display'){
value = '<img src="' + Init.url.ccpImageServer + '/Character/' + data.id + '_32.jpg" title="' + value + '" data-toggle="tooltip" />';
}
return value;
}
},
createdCell: function(cell, cellData, rowData, rowIndex, colIndex){
$(cell).find('img').tooltip();
}
},{
targets: 3,
title: 'mass',
className: ['text-right'].join(' ') ,
data: 'ship.mass',
render: {
_: function(data, type, row){
let value = data;
if(type === 'display'){
value = Util.formatMassValue(value);
}
return value;
}
}
},{
targets: 4,
title: 'log',
width: 55,
className: ['text-right', config.tableCellCounterClass].join(' '),
data: 'created.created',
createdCell: function(cell, cellData, rowData, rowIndex, colIndex){
$(cell).initTimestampCounter('d');
}
}
],
drawCallback: function(settings){
let animationRows = this.api().rows().nodes().to$().filter(function(a,b ) {
return (
$(this).data('animationStatus') ||
$(this).data('animationTimer')
);
});
for(let i = 0; i < animationRows.length; i++){
$(animationRows[i]).pulseTableRow($(animationRows[i]).data('animationStatus'));
$(animationRows[i]).removeData('animationStatus');
}
},
footerCallback: function ( row, data, start, end, display ) {
let api = this.api();
let sumColumnIndexes = [3];
// column data for "sum" columns over this page
let pageTotalColumns = api
.columns( sumColumnIndexes, { page: 'all'} )
.data();
// sum columns for "total" sum
pageTotalColumns.each((colData, index) => {
pageTotalColumns[index] = colData.reduce((a, b) => {
return parseInt(a) + parseInt(b);
}, 0);
});
$(sumColumnIndexes).each((index, value) => {
$( api.column( value ).footer() ).text( Util.formatMassValue(pageTotalColumns[index]) );
// save mass for further reCalculation of "info" table
connectionElement.find('.' + config.connectionInfoTableCellMassLogClass).data('mass', pageTotalColumns[index]);
});
// calculate "info" table -----------------------------------------------------
connectionElement.find('.' + config.moduleTableClass).trigger('pf:updateInfoTable', connectionElement.data());
}
});
// find position to insert
connectionElement.insertBefore(rowElement.find('#' + getConnectionElementId(0)));
logTable.on('order.dt search.dt', function(){
let pageInfo = logTable.page.info();
logTable.column(0, {search:'applied', order:'applied'}).nodes().each((cell, i) => {
let content = (pageInfo.recordsTotal - i) + '.&nbsp;&nbsp;';
$(cell).html(content);
});
});
logTable.on('destroy.dt', function(){
$(this).destroyTimestampCounter();
});
}
};
/**
* remove connection Panel from moduleElement
* @param connectionElement
*/
let removeConnectionPanel = (connectionElement) => {
connectionElement = $(connectionElement);
if(connectionElement.length){
// destroy dataTable (and remove table from DOM)
let logTable = connectionElement.find('.' + config.connectionInfoTableClass);
logTable.dataTable().api().destroy(true);
// remove belonging connectionElement
connectionElement.remove();
}
};
/**
* get connections from ModuleElement
* -> validate with current map data
* @param moduleElement
* @param mapId
* @returns {{connectionsDataUpdate: Array, connectionsDataRemove: Array}}
*/
let getConnectionsDataFromModule = (moduleElement, mapId) => {
let activeMap = Util.getMapModule().getActiveMap();
let mapData = activeMap.getMapDataFromClient({forceData: true});
let connectionsData = {
connectionsDataUpdate: [],
connectionsDataRemove: [],
};
if(mapData !== false){
getConnectionElements(moduleElement).each((i, connectionElement) => {
let removeConnectionPanel = true;
let connectionData = {id: $(connectionElement).data('connectionId') };
let connection = $().getConnectionById(mapId, connectionData.id);
if(connection){
let connectionDataTemp = MapUtil.getDataByConnection(connection);
if(connectionDataTemp.id > 0){
// connection still on map - OK
removeConnectionPanel = false;
connectionData = connectionDataTemp;
}
}
if(removeConnectionPanel){
connectionsData.connectionsDataRemove.push(connectionData);
}else{
connectionsData.connectionsDataUpdate.push(connectionData);
}
});
}
return connectionsData;
};
/**
* update/init multiple connection panels at once
* @param moduleElement
* @param mapId
* @param connectionsDataUpdate
* @param connectionsDataRemove
*/
let updateConnectionPanels = (moduleElement, mapId, connectionsDataUpdate, connectionsDataRemove) => {
for(let connectionData of connectionsDataRemove){
let connectionElement = moduleElement.find('#' + getConnectionElementId(connectionData.id));
removeConnectionPanel(connectionElement);
}
for(let connectionData of connectionsDataUpdate){
updateConnectionPanel(moduleElement, mapId, connectionData);
}
// request connectionsLogData for each updated connection
if(connectionsDataUpdate.length){
getConnectionsLogData(moduleElement, mapId, connectionsDataUpdate);
}
// remove module if no connection panel left
// --> all connection deselected on map
let connectionElements = getConnectionElements(moduleElement);
if(connectionElements.length === 0){
MapUtil.getTabContentElementByMapElement(moduleElement).trigger('pf:removeConnectionModules');
}
// hide "control" panel when multiple connection
moduleElement.find('#' + getConnectionElementId(0)).toggle(connectionElements.length < 2);
};
/**
* set module observer
* @param moduleElement
* @param mapId
*/
let setModuleObserver = (moduleElement, mapId) => {
$(document).off('pf:updateConnectionInfoModule').on('pf:updateConnectionInfoModule', function(e, data){
updateConnectionPanels(
moduleElement,
data.mapId,
MapUtil.getDataByConnections(data.connectionsUpdate),
MapUtil.getDataByConnections(data.connectionsRemove)
);
});
$(document).off('pf:activeShip').on('pf:activeShip', function(e){
moduleElement.find('.' + config.connectionInfoPanelClass).each((i, connectionElement) => {
$(connectionElement).find('.' + config.moduleTableClass).each((i, tableElement) => {
$(tableElement).trigger('pf:calcInfoTable');
});
});
});
// init toggle active ship ----------------------------------------------------------------
moduleElement.find('.' + config.moduleHeadlineIconCurrentMassClass).on('click', function(e){
let currentMassIcon = $(this).toggleClass('active');
moduleElement.find('.' + config.connectionInfoPanelClass).each((i, connectionElement) => {
$(connectionElement).find('.' + config.moduleTableClass).each((i, tableElement) => {
$(tableElement).data('showShip', currentMassIcon.hasClass('active')).trigger('pf:calcInfoTable');
});
});
});
// init refresh connections ---------------------------------------------------------------
moduleElement.find('.' + config.moduleHeadlineIconRefreshClass).on('click', function(e){
refreshConnectionPanels(moduleElement, mapId);
});
};
/**
* refresh all connection panels in a module
* @param moduleElement
* @param mapId
*/
let refreshConnectionPanels = (moduleElement, mapId) => {
let connectionsData = getConnectionsDataFromModule(moduleElement, mapId);
updateConnectionPanels(moduleElement, mapId, connectionsData.connectionsDataUpdate, connectionsData.connectionsDataRemove);
};
/**
* before module destroy callback
* @param moduleElement
*/
let beforeDestroy = (moduleElement) => {
getConnectionElements(moduleElement).each((i, connectionElement) => {
removeConnectionPanel(connectionElement);
});
let test;
};
/**
* init callback
* @param moduleElement
* @param mapId
* @param connectionData
*/
let initModule = (moduleElement, mapId, connectionData) => {
setModuleObserver(moduleElement, mapId);
};
/**
* get module element
* @param parentElement
* @param mapId
* @param connections
* @returns {*|jQuery|HTMLElement}
*/
let getModule = (parentElement, mapId, connections) => {
// create new module container
let moduleElement = $('<div>').append(
$('<div>', {
class: config.moduleHeadClass
}).append(
$('<h5>', {
class: config.moduleHandlerClass
}),
$('<h5>', {
text: 'Connection'
}),
getHeadlineToolbar()
)
);
let rowElement = $('<div>', {
class: 'row'
});
moduleElement.append(rowElement);
rowElement.append(getInfoPanelControl(mapId));
updateConnectionPanels(moduleElement, mapId, MapUtil.getDataByConnections(connections), []);
return moduleElement;
};
return {
config: config,
getModule: getModule,
initModule: initModule,
beforeDestroy: beforeDestroy
};
});

28
js/app/ui/demo_map.js
View File

@@ -9,7 +9,7 @@ define([
'use strict';
var config = {
let config = {
headerSystemsContainerId: 'pf-header-systems', // id for systems layer
headerSystemConnectorsId: 'pf-header-connectors', // id for connectors layer
headerConnectionsContainerId: 'pf-header-connections', // id for connections layer
@@ -26,9 +26,9 @@ define([
* draw systems layer
* @param callback
*/
var drawSystems = function(callback){
let drawSystems = function(callback){
var pathObj = {
let pathObj = {
systems: {
strokepath: [
// systems =======================================================================
@@ -98,11 +98,11 @@ define([
* draw connectors layer
* @param callback
*/
var drawConnectors = function(callback){
let drawConnectors = function(callback){
var connectorDuration = 150;
let connectorDuration = 150;
var pathObj = {
let pathObj = {
connectors: {
strokepath: [
// connectors ====================================================================
@@ -184,14 +184,14 @@ define([
* draw connections layer
* @param callback
*/
var drawConnections = function(callback){
let drawConnections = function(callback){
var connectionDuration = 250;
var connectionWidth = 8;
var connectionInnerWidth = 4;
var connectionBorderColor = '#63676A'; //gray
let connectionDuration = 250;
let connectionWidth = 8;
let connectionInnerWidth = 4;
let connectionBorderColor = '#63676A'; //gray
var pathObj = {
let pathObj = {
connections: {
strokepath: [
// connections ====================================================================
@@ -288,7 +288,7 @@ define([
* draw background layer
* @param callback
*/
var drawBackground = function(callback){
let drawBackground = function(callback){
$('#' + config.headerBackgroundContainerId + ' .' + config.headerSystemClass).velocity('transition.bounceUpIn', {
stagger: 150,
complete: function(){
@@ -304,7 +304,7 @@ define([
* @param callback
*/
$.fn.drawDemoMap = function(callback){
var canvasElement = $(this);
let canvasElement = $(this);
// draw systems

28
js/app/ui/dialog/account_settings.js
View File

@@ -11,7 +11,7 @@ define([
], function($, Init, Util, Render, bootbox) {
'use strict';
var config = {
let config = {
// select character dialog
settingsDialogId: 'pf-settings-dialog', // id for "settings" dialog
settingsAccountContainerId: 'pf-settings-dialog-account', // id for the "account" container
@@ -37,14 +37,14 @@ define([
$.fn.showSettingsDialog = function(){
// check if there are other dialogs open
var openDialogs = Util.getOpenDialogs();
let openDialogs = Util.getOpenDialogs();
if(openDialogs.length > 0){
return false;
}
requirejs(['text!templates/dialog/settings.html', 'mustache'], function(template, Mustache) {
var data = {
let data = {
id: config.settingsDialogId,
settingsAccountContainerId: config.settingsAccountContainerId,
settingsShareContainerId: config.settingsShareContainerId,
@@ -56,9 +56,9 @@ define([
ccpImageServer: Init.url.ccpImageServer
};
var content = Mustache.render(template, data);
let content = Mustache.render(template, data);
var accountSettingsDialog = bootbox.dialog({
let accountSettingsDialog = bootbox.dialog({
title: 'Account settings',
message: content,
buttons: {
@@ -72,19 +72,19 @@ define([
callback: function() {
// get the current active form
var form = $('#' + config.settingsDialogId).find('form').filter(':visible');
let form = $('#' + config.settingsDialogId).find('form').filter(':visible');
// validate form
form.validator('validate');
// check whether the form is valid
var formValid = form.isValidForm();
let formValid = form.isValidForm();
if(formValid === true){
var tabFormValues = form.getFormValues();
let tabFormValues = form.getFormValues();
// send Tab data and store values
var requestData = {
let requestData = {
formData: tabFormValues
};
@@ -134,7 +134,7 @@ define([
}).fail(function( jqXHR, status, error) {
accountSettingsDialog.find('.modal-content').hideLoadingAnimation();
var reason = status + ' ' + error;
let reason = status + ' ' + error;
Util.showNotify({title: jqXHR.status + ': saveAccountSettings', text: reason, type: 'error'});
// set new captcha for any request
@@ -147,7 +147,7 @@ define([
if(jqXHR.status === 500){
if(jqXHR.responseText){
var errorObj = $.parseJSON(jqXHR.responseText);
let errorObj = $.parseJSON(jqXHR.responseText);
if(
errorObj.error &&
@@ -172,11 +172,11 @@ define([
// after modal is shown =======================================================================
accountSettingsDialog.on('shown.bs.modal', function(e) {
var dialogElement = $(this);
var form = dialogElement.find('form');
let dialogElement = $(this);
let form = dialogElement.find('form');
// request captcha image and show
var captchaImageWrapperContainer = $('#' + config.captchaImageWrapperId);
let captchaImageWrapperContainer = $('#' + config.captchaImageWrapperId);
captchaImageWrapperContainer.showCaptchaImage(config.captchaKeyUpdateAccount);
// init captcha refresh button

8
js/app/ui/dialog/credit.js
View File

@@ -12,7 +12,7 @@ define([
], function($, Init, Util, Render, bootbox) {
'use strict';
var config = {
let config = {
// jump info dialog
creditsDialogClass: 'pf-credits-dialog', // class for credits dialog
creditsDialogLogoContainerId: 'pf-logo-container' // id for logo element
@@ -25,14 +25,14 @@ define([
requirejs(['text!templates/dialog/credit.html', 'mustache'], function(template, Mustache) {
var data = {
let data = {
logoContainerId: config.creditsDialogLogoContainerId,
version: Util.getVersion()
};
var content = Mustache.render(template, data);
let content = Mustache.render(template, data);
var creditDialog = bootbox.dialog({
let creditDialog = bootbox.dialog({
className: config.creditsDialogClass,
title: 'Licence',
message: content

20
js/app/ui/dialog/delete_account.js
View File

@@ -10,7 +10,7 @@ define([
], function($, Init, Util, bootbox) {
'use strict';
var config = {
let config = {
// global dialog
deleteAccountId: 'pf-dialog-delete-account', // dialog id
@@ -27,16 +27,16 @@ define([
requirejs(['text!templates/dialog/delete_account.html', 'mustache'], function(template, Mustache) {
var data = {
let data = {
deleteAccountId: config.deleteAccountId,
userData: Util.getCurrentUserData(),
captchaImageWrapperId: config.captchaImageWrapperId,
formErrorContainerClass: Util.config.formErrorContainerClass
};
var content = Mustache.render(template, data);
let content = Mustache.render(template, data);
var deleteAccountDialog = bootbox.dialog({
let deleteAccountDialog = bootbox.dialog({
title: 'Delete account',
message: content,
buttons: {
@@ -48,20 +48,20 @@ define([
label: '<i class="fa fa-user-times fa-fw"></i>&nbsp;delete account',
className: 'btn-danger',
callback: function() {
var dialogElement = $(this);
var form = dialogElement.find('form');
let dialogElement = $(this);
let form = dialogElement.find('form');
// validate form
form.validator('validate');
var formValid = form.isValidForm();
let formValid = form.isValidForm();
if(formValid){
var formValues = form.getFormValues();
let formValues = form.getFormValues();
if(! $.isEmptyObject(formValues) ){
// send Tab data and store values
var requestData = {
let requestData = {
formData: formValues
};
@@ -91,7 +91,7 @@ define([
}).fail(function( jqXHR, status, error) {
dialogElement.find('.modal-content').hideLoadingAnimation();
var reason = status + ' ' + error;
let reason = status + ' ' + error;
Util.showNotify({title: jqXHR.status + ': deleteAccount', text: reason, type: 'error'});
});

72
js/app/ui/dialog/jump_info.js
View File

@@ -8,31 +8,85 @@ define([
'app/util',
'app/render',
'bootbox',
], function($, Init, Util, Render, bootbox) {
], ($, Init, Util, Render, bootbox) => {
'use strict';
let config = {
// jump info dialog
jumpInfoDialogClass: 'pf-jump-info-dialog' // class for jump info dialog
jumpInfoDialogClass: 'pf-jump-info-dialog', // class for jump info dialog
wormholeInfoMassTableClass: 'pf-wormhole-info-mass-table', // class for "wormhole mass" table
wormholeInfoJumpTableClass: 'pf-wormhole-info-jump-table' // class for "wormhole jump" table
};
/**
* show jump info dialog
*/
$.fn.showJumpInfoDialog = function(){
requirejs(['text!templates/dialog/jump_info.html', 'mustache'], function(template, Mustache) {
let data = {};
requirejs(['text!templates/dialog/jump_info.html', 'mustache'], (template, Mustache) => {
let data = {
config: config,
wormholes: Object.keys(Init.wormholes).map(function(k) { return Init.wormholes[k]; }), // convert Json to array
securityClass: function(){
return function(value, render){
return this.Util.getSecurityClassForSystem( render(value) );
}.bind(this);
}.bind({
Util: Util
}),
massValue: function(){
return function(value, render){
let mass = render(value);
switch(mass.length){
case 0: return '';
case 1: return 'Yes';
default: return this.Util.formatMassValue(mass);
}
}.bind(this);
}.bind({
Util: Util
})
};
let content = Mustache.render(template, data);
let signatureReaderDialog = bootbox.dialog({
let jumpDialog = bootbox.dialog({
className: config.jumpInfoDialogClass,
title: 'Wormhole jump information',
message: content
message: content,
show: false
});
});
jumpDialog.on('show.bs.modal', function(e) {
// init dataTable
$(this).find('.' + config.wormholeInfoMassTableClass).DataTable({
pageLength: 25,
lengthMenu: [[10, 20, 25, 30, 40, -1], [10, 20, 25, 30, 40, 'All']],
autoWidth: false,
language: {
emptyTable: 'No wormholes',
zeroRecords: 'No wormholes found',
lengthMenu: 'Show _MENU_ wormholes',
info: 'Showing _START_ to _END_ of _TOTAL_ wormholes'
},
});
$(this).find('.' + config.wormholeInfoJumpTableClass).DataTable({
pageLength: -1,
paging: false,
lengthChange: false,
ordering: false,
searching: false,
info: false,
autoWidth: false,
language: {
emptyTable: 'No wormholes',
zeroRecords: 'No wormholes found',
lengthMenu: 'Show _MENU_ wormholes',
info: 'Showing _START_ to _END_ of _TOTAL_ wormholes'
},
});
});
jumpDialog.modal('show');
});
};
});

26
js/app/ui/dialog/map_info.js
View File

@@ -184,7 +184,6 @@ define([
systemsElement.showLoadingAnimation(config.loadingOptions);
// table init complete
systemTable.on( 'init.dt', function () {
systemsElement.hideLoadingAnimation();
@@ -193,6 +192,10 @@ define([
tooltipElements.tooltip();
});
systemTable.on('destroy.dt', function(){
$(this).destroyTimestampCounter();
});
// prepare data for dataTables
let systemsData = [];
for(let i = 0; i < mapData.data.systems.length; i++){
@@ -438,13 +441,6 @@ define([
data: 'updated',
createdCell: function(cell, cellData, rowData, rowIndex, colIndex){
$(cell).initTimestampCounter();
// highlight cell
let diff = new Date().getTime() - cellData * 1000;
let dateDiff = new Date(diff);
if(dateDiff.getUTCDate() > 1){
$(cell).addClass('txt-color txt-color-warning');
}
}
},{
title: '',
@@ -545,7 +541,6 @@ define([
let connectionClasses = [];
for(let k = 0; k < tempConnectionData.type.length; k++){
connectionClasses.push( MapUtil.getConnectionInfo( tempConnectionData.type[k], 'cssClass') );
}
connectionClasses = connectionClasses.join(' ');
@@ -626,11 +621,13 @@ define([
createdCell: function(cell, cellData, rowData, rowIndex, colIndex){
$(cell).initTimestampCounter();
// highlight cell
let diff = new Date().getTime() - cellData * 1000;
let dateDiff = new Date(diff);
if(dateDiff.getUTCDate() > 1){
$(cell).addClass('txt-color txt-color-warning');
if(rowData.scope.scope_sort === 'wh'){
// highlight cell
let diff = new Date().getTime() - cellData * 1000;
let dateDiff = new Date(diff);
if(dateDiff.getUTCDate() > 1){
$(cell).addClass('txt-color txt-color-warning');
}
}
}
},{
@@ -1269,7 +1266,6 @@ define([
// load users table
usersElement.initUsersInfoTable(mapData);
});
// events for tab change

20
js/app/ui/dialog/releases.js
View File

@@ -11,7 +11,7 @@ define([
], function($, Init, Util, Render, bootbox) {
'use strict';
var config = {
let config = {
releasesDialogClass: 'pf-releases-dialog' // class for "Releases" dialog
};
@@ -19,10 +19,10 @@ define([
* load release information in dialog
* @param releasesDialog
*/
var loadDialogData = function(releasesDialog){
let loadDialogData = function(releasesDialog){
// lock dialog
var dialogContent = releasesDialog.find('.modal-content');
let dialogContent = releasesDialog.find('.modal-content');
dialogContent.showLoadingAnimation();
$.ajax({
@@ -32,18 +32,18 @@ define([
dataType: 'json'
}).done(function(releasesData){
requirejs(['text!templates/ui/timeline_element.html', 'mustache'], function(template, Mustache) {
for(var i = 0; i < releasesData.length; i++){
var releaseData = releasesData[i];
for(let i = 0; i < releasesData.length; i++){
let releaseData = releasesData[i];
// template vars
var data = {
let data = {
isFirst: (i === 0),
isOdd: (i % 2 !== 0),
releaseDate: releaseData.published_at.substr(0, 10),
releaseData: releaseData
};
var content = Mustache.render(template, data);
let content = Mustache.render(template, data);
releasesDialog.find('ul.timeline').append(content);
}
@@ -55,7 +55,7 @@ define([
});
});
}).fail(function( jqXHR, status, error) {
var reason = status + ' ' + jqXHR.status + ': ' + error;
let reason = status + ' ' + jqXHR.status + ': ' + error;
Util.showNotify({title: jqXHR.status + ': login', text: reason, type: 'error'});
}).always(function() {
dialogContent.hideLoadingAnimation();
@@ -66,9 +66,9 @@ define([
* show releases dialog
*/
$.fn.releasesDialog = function(){
var content = '<ul class="timeline"></ul>';
let content = '<ul class="timeline"></ul>';
var releasesDialog = bootbox.dialog({
let releasesDialog = bootbox.dialog({
className: config.releasesDialogClass,
title: 'Releases',
size: 'large',

91
js/app/ui/system_graph.js
View File

@@ -12,10 +12,14 @@ define([
let config = {
// module info
moduleClass: 'pf-module', // class for each module
modulePosition: 3,
moduleName: 'systemGraph',
moduleHeadClass: 'pf-module-head', // class for module header
moduleHandlerClass: 'pf-module-handler-drag', // class for "drag" handler
// system graph module
systemGraphModuleClass: 'pf-system-graph-module', // class for this module
moduleTypeClass: 'pf-system-graph-module', // class for this module
systemGraphClass: 'pf-system-graph', // class for each graph
// system graph labels
@@ -117,11 +121,25 @@ define([
};
/**
* draw graph module
* get module element
* @param parentElement
* @param mapId
* @param systemData
* @returns {*}
*/
let getModule = (parentElement, mapId, systemData) => {
// graph data is available for k-space systems
let moduleElement = (systemData.type.id === 2) ? $('<div>') : null;
return moduleElement;
};
/**
* init graph module
* @param parentElement
* @param systemData
*/
let drawModule = function(parentElement, systemData){
let initModule = function(moduleElement, mapId, systemData){
// graph data is available for k-space systems
if(systemData.type.id === 2){
@@ -149,21 +167,7 @@ define([
data: requestData,
dataType: 'json'
}).done(function(systemGraphsData){
if( Object.keys(systemGraphsData).length > 0 ){
// create new (hidden) module container
let moduleElement = $('<div>', {
class: [config.moduleClass, config.systemGraphModuleClass].join(' '),
css: {opacity: 0}
});
// insert at the correct position
if($(parentElement).children().length === 1){
$(parentElement).append(moduleElement);
}else{
$(parentElement).find('>:first-child').after(moduleElement);
}
// row element
let rowElement = $('<div>', {
class: 'row'
@@ -177,9 +181,18 @@ define([
class: ['col-xs-12', 'col-sm-6', 'col-md-4'].join(' ')
});
let headlineElement = $('<h5>').text( getInfoForGraph(graphKey, 'headline') );
colElement.append(headlineElement);
colElement.append(
$('<div>', {
class: config.moduleHeadClass
}).append(
$('<h5>', {
class: config.moduleHandlerClass
}),
$('<h5>', {
text: getInfoForGraph(graphKey, 'headline')
})
)
);
let graphElement = $('<div>', {
class: config.systemGraphClass
@@ -195,12 +208,6 @@ define([
moduleElement.append($('<div>', {
css: {'clear': 'both'}
}));
// show module
moduleElement.velocity('transition.slideDownIn', {
duration: Init.animationSpeed.mapModule,
delay: Init.animationSpeed.mapModule
});
}
}).fail(function( jqXHR, status, error) {
let reason = status + ' ' + error;
@@ -208,34 +215,12 @@ define([
$(document).setProgramStatus('problem');
});
}
};
/**
* main module load function
* @param systemData
*/
$.fn.drawSystemGraphModule = function(systemData){
let parentElement = $(this);
// check if module already exists
let moduleElement = parentElement.find('.' + config.systemGraphModuleClass);
if(moduleElement.length > 0){
moduleElement.velocity('transition.slideDownOut', {
duration: Init.animationSpeed.mapModule,
complete: function(tempElement){
$(tempElement).remove();
drawModule(parentElement, systemData);
}
});
}else{
drawModule(parentElement, systemData);
}
return {
config: config,
getModule: getModule,
initModule: initModule
};
});

84
js/app/ui/system_info.js
View File

@@ -13,10 +13,11 @@ define([
let config = {
// module info
moduleClass: 'pf-module', // class for each module
modulePosition: 2,
moduleName: 'systemInfo',
// system info module
systemInfoModuleClass: 'pf-system-info-module', // module wrapper
moduleTypeClass: 'pf-system-info-module', // class for this module
// breadcrumb
constellationLinkClass: 'pf-system-info-constellation', // class for "constellation" name
@@ -24,7 +25,7 @@ define([
typeLinkClass: 'pf-system-info-type', // class for "type" name
// info table
systemInfoTableClass: 'pf-system-info-table', // class for system info table
systemInfoTableClass: 'pf-module-table', // class for system info table
systemInfoNameInfoClass: 'pf-system-info-name', // class for "name" information element
systemInfoEffectInfoClass: 'pf-system-info-effect', // class for "effect" information element
systemInfoStatusLabelClass: 'pf-system-info-status-label', // class for "status" information element
@@ -54,7 +55,6 @@ define([
* set module observer and look for relevant system data to update
*/
let setModuleObserver = function(moduleElement){
$(document).off('pf:updateSystemInfoModule').on('pf:updateSystemInfoModule', function(e, data){
if(data){
moduleElement.updateSystemInfoModule(data);
@@ -197,24 +197,19 @@ define([
};
/**
*
* get module element
* @param parentElement
* @param mapId
* @param systemData
*/
let drawModule = function(parentElement, mapId, systemData){
let getModule = function(parentElement, mapId, systemData){
// create new module container
let moduleElement = $('<div>', {
class: [config.moduleClass, config.systemInfoModuleClass].join(' '),
css: {opacity: 0}
});
let moduleElement = $('<div>');
// store systemId -> module can be updated with the correct data
moduleElement.data('id', systemData.id);
parentElement.prepend(moduleElement);
// shattered wormhole info data
let shatteredWormholeInfo = false;
@@ -240,8 +235,8 @@ define([
position: moduleElement,
link: 'append',
functions: {
after: function(){
let tempModuleElement = parentElement.find('.' + config.systemInfoModuleClass);
after: function(conf){
let tempModuleElement = conf.position;
// lock "description" field until first update
tempModuleElement.find('.' + config.descriptionArea).showLoadingAnimation();
@@ -426,7 +421,6 @@ define([
return 'Loading...';
}
showModule(moduleElement);
}
}
};
@@ -464,52 +458,40 @@ define([
};
Render.showModule(moduleConfig, moduleData);
return moduleElement;
};
/**
* show system info module with animation
* init callback
* @param moduleElement
*/
let showModule = function(moduleElement){
moduleElement.velocity('transition.slideDownIn', {
duration: Init.animationSpeed.mapModule,
delay: Init.animationSpeed.mapModule,
complete: function(){
// set module observer
setModuleObserver(moduleElement);
// enable auto update
disableModuleUpdate = false;
}
});
};
/**
* update system info module
* @param mapId
* @param systemData
*/
$.fn.drawSystemInfoModule = function(mapId, systemData){
let initModule = function(moduleElement, mapId, systemData){
// set module observer
setModuleObserver(moduleElement);
let parentElement = $(this);
// check if module already exists
let moduleElement = parentElement.find('.' + config.systemInfoModuleClass);
if(moduleElement.length > 0){
moduleElement.velocity('transition.slideDownOut', {
duration: Init.animationSpeed.mapModule,
complete: function(tempElement){
$(tempElement).remove();
drawModule(parentElement, mapId, systemData);
}
});
}else{
drawModule(parentElement, mapId, systemData);
}
// enable auto update
disableModuleUpdate = false;
};
/**
* efore module destroy callback
* @param moduleElement
*/
let beforeDestroy = (moduleElement) => {
// remove xEditable description textarea
let descriptionTextareaElement = moduleElement.find('.' + config.descriptionTextareaElementClass);
descriptionTextareaElement.editable('destroy');
};
return {
config: config,
getModule: getModule,
initModule: initModule,
beforeDestroy: beforeDestroy
};
});

142
js/app/ui/system_killboard.js
View File

@@ -8,13 +8,16 @@ define([
let config = {
// module info
moduleClass: 'pf-module', // class for each module
modulePosition: 2,
moduleName: 'systemKillboard',
moduleHeadClass: 'pf-module-head', // class for module header
moduleHandlerClass: 'pf-module-handler-drag', // class for "drag" handler
// headline toolbar
systemModuleHeadlineIcon: 'pf-module-icon-button', // class for toolbar icons in the head
moduleHeadlineIconClass: 'pf-module-icon-button', // class for toolbar icons in the head
// system killboard module
systemKillboardModuleClass: 'pf-system-killboard-module', // module wrapper
moduleTypeClass: 'pf-system-killboard-module', // class for this module
systemKillboardGraphKillsClass: 'pf-system-killboard-graph-kills', // class for system kill graph
// system killboard list
@@ -178,34 +181,8 @@ define([
* @param systemData
*/
$.fn.updateSystemInfoGraphs = function(systemData){
let moduleElement = $(this);
// headline toolbar icons
let headlineToolbar = $('<h5>', {
class: 'pull-right'
}).append(
$('<i>', {
class: ['fa', 'fa-fw', 'fa-external-link ', config.systemModuleHeadlineIcon].join(' '),
title: 'zkillboard.com'
}).on('click', function(e){
window.open(
'//zkillboard.com/system/' + systemData.systemId,
'_blank'
);
}).attr('data-toggle', 'tooltip')
);
moduleElement.append(headlineToolbar);
// headline
let headline = $('<h5>', {
text: 'Killboard'
});
moduleElement.append(headline);
let killboardGraphElement = $('<div>', {
class: config.systemKillboardGraphKillsClass
});
@@ -222,14 +199,11 @@ define([
// private function draws a "system kills" graph
let drawGraph = function(data){
let tableData = data.tableData;
// change order (show right to left)
tableData.reverse();
if(data.count === 0){
labelOptions.type = 'label-success';
label = getLabel( 'No kills found within the last 24h', labelOptions );
@@ -247,6 +221,7 @@ define([
Morris.Bar({
element: killboardGraphElement,
resize: true,
redraw: true,
grid: true,
gridStrokeWidth: 0.3,
gridTextSize: 9,
@@ -418,64 +393,71 @@ define([
});
};
/**
* get module toolbar element
* @param systemData
* @returns {*|jQuery|HTMLElement|void}
*/
let getHeadlineToolbar = (systemData) => {
let headlineToolbar = $('<h5>', {
class: 'pull-right'
}).append(
$('<i>', {
class: ['fa', 'fa-fw', 'fa-external-link ', config.moduleHeadlineIconClass].join(' '),
title: 'zkillboard.com'
}).on('click', function(e){
window.open(
'//zkillboard.com/system/' + systemData.systemId,
'_blank'
);
}).attr('data-toggle', 'tooltip')
);
headlineToolbar.find('[data-toggle="tooltip"]').tooltip({
container: 'body'
});
return headlineToolbar;
};
/**
* before module "show" callback
* @param moduleElement
* @param systemData
*/
let beforeShow = (moduleElement, systemData) => {
// update graph
moduleElement.updateSystemInfoGraphs(systemData);
};
/**
* get module element
* @param parentElement
* @param systemData
* @returns {*|jQuery|HTMLElement}
*/
let getModule = function(parentElement, systemData){
let getModule = (parentElement, mapId, systemData) => {
// create new module container
let moduleElement = $('<div>', {
class: [config.moduleClass, config.systemKillboardModuleClass].join(' '),
css: {opacity: 0}
});
parentElement.append(moduleElement);
// update graph
moduleElement.updateSystemInfoGraphs(systemData);
let moduleElement = $('<div>').append(
$('<div>', {
class: config.moduleHeadClass
}).append(
$('<h5>', {
class: config.moduleHandlerClass
}),
$('<h5>', {
text: 'Killboard'
}),
getHeadlineToolbar(systemData)
)
);
return moduleElement;
};
/**
* main module load function
* @param systemData
*/
$.fn.drawSystemKillboardModule = function(systemData){
let parentElement = $(this);
// show route module
let showModule = function(moduleElement){
if(moduleElement){
moduleElement.velocity('transition.slideDownIn', {
duration: Init.animationSpeed.mapModule,
delay: Init.animationSpeed.mapModule
});
}
};
// check if module already exists
let moduleElement = parentElement.find('.' + config.systemKillboardModuleClass);
if(moduleElement.length > 0){
moduleElement.velocity('transition.slideDownOut', {
duration: Init.animationSpeed.mapModule,
complete: function(tempElement){
$(tempElement).remove();
moduleElement = getModule(parentElement, systemData);
showModule(moduleElement);
}
});
}else{
moduleElement = getModule(parentElement, systemData);
showModule(moduleElement);
}
return {
config: config,
getModule: getModule,
beforeShow: beforeShow
};
});

149
js/app/ui/system_route.js
View File

@@ -13,18 +13,21 @@ define([
let config = {
// module info
moduleClass: 'pf-module', // class for each module
modulePosition: 1,
moduleName: 'systemRoute',
moduleHeadClass: 'pf-module-head', // class for module header
moduleHandlerClass: 'pf-module-handler-drag', // class for "drag" handler
routeCacheTTL: 10, // route cache timer (client) in seconds
// system route module
systemRouteModuleClass: 'pf-system-route-module', // class for this module
moduleTypeClass: 'pf-system-route-module', // class for this module
// headline toolbar
systemModuleHeadlineIcon: 'pf-module-icon-button', // class for toolbar icons in the head
systemModuleHeadlineIconSearch: 'pf-module-icon-button-search', // class for "search" icon
systemModuleHeadlineIconSettings: 'pf-module-icon-button-settings', // class for "settings" icon
systemModuleHeadlineIconRefresh: 'pf-module-icon-button-refresh', // class for "refresh" icon
moduleHeadlineIconClass: 'pf-module-icon-button', // class for toolbar icons in the head
moduleHeadlineIconSearchClass: 'pf-module-icon-button-search', // class for "search" icon
moduleHeadlineIconSettingsClass: 'pf-module-icon-button-settings', // class for "settings" icon
moduleHeadlineIconRefreshClass: 'pf-module-icon-button-refresh', // class for "refresh" icon
systemSecurityClassPrefix: 'pf-system-security-', // prefix class for system security level (color)
@@ -35,7 +38,7 @@ define([
systemInfoRoutesTableClass: 'pf-system-route-table', // class for route tables
mapSelectId: 'pf-route-dialog-map-select', // id for "map" select
dataTableActionCellClass: 'pf-table-action-cell' // class for "action" cells
dataTableActionCellClass: 'pf-table-action-cell' // class for "action" cells
};
// cache for system routes
@@ -48,7 +51,7 @@ define([
* @param context
* @param routesData
*/
let callbackAddRouteRow = function(context, routesData){
let callbackAddRouteRow = (context, routesData) => {
if(routesData.length > 0){
for(let i = 0; i < routesData.length; i++){
@@ -86,7 +89,7 @@ define([
* @param rowData
* @returns {*}
*/
let addRow = function(context, rowData){
let addRow = (context, rowData) => {
let dataTable = context.dataTable;
let rowElement = null;
let row = null;
@@ -94,7 +97,7 @@ define([
// search for an existing row (e.g. on mass "table refresh" [all routes])
// get rowIndex where column 1 (equals to "systemToData.name") matches rowData.systemToData.name
let indexes = dataTable.rows().eq(0).filter( function (rowIdx) {
let indexes = dataTable.rows().eq(0).filter((rowIdx) => {
return (dataTable.cell(rowIdx, 1 ).data().name === rowData.systemToData.name);
});
@@ -129,8 +132,7 @@ define([
* @param context
* @param callback
*/
let getRouteData = function(requestData, context, callback){
let getRouteData = (requestData, context, callback) => {
context.moduleElement.showLoadingAnimation();
$.ajax({
@@ -145,7 +147,6 @@ define([
// execute callback
callback(this, routesData.routesData);
});
};
/**
@@ -153,7 +154,7 @@ define([
* @param moduleElement
* @param dataTable
*/
let updateRoutesTable = function(moduleElement, dataTable){
let updateRoutesTable = (moduleElement, dataTable) => {
let context = {
moduleElement: moduleElement,
dataTable: dataTable
@@ -172,7 +173,7 @@ define([
* @param {Object} rowData
* @returns {Object}
*/
let getRouteRequestDataFromRowData = function(rowData){
let getRouteRequestDataFromRowData = (rowData) => {
return {
mapIds: (rowData.hasOwnProperty('mapIds')) ? rowData.mapIds : [],
systemFromData: (rowData.hasOwnProperty('systemFromData')) ? rowData.systemFromData : {},
@@ -193,7 +194,7 @@ define([
* show route dialog. User can search for systems and jump-info for each system is added to a data table
* @param dialogData
*/
let showFindRouteDialog = function(dialogData){
let showFindRouteDialog = (dialogData) => {
let mapSelectOptions = [];
let currentMapData = Util.getCurrentMapData();
@@ -678,50 +679,45 @@ define([
};
/**
* get the route finder moduleElement
* get module element
* @returns {*}
*/
let getModule = function(){
// create new module container
let moduleElement = $('<div>', {
class: [config.moduleClass, config.systemRouteModuleClass].join(' ')
});
// headline toolbar icons
let headlineToolbar = $('<h5>', {
class: 'pull-right'
}).append(
$('<i>', {
class: ['fa', 'fa-fw', 'fa-search', config.systemModuleHeadlineIcon, config.systemModuleHeadlineIconSearch].join(' '),
title: 'find&nbsp;route'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip'),
$('<i>', {
class: ['fa', 'fa-fw', 'fa-sliders', config.systemModuleHeadlineIcon, config.systemModuleHeadlineIconSettings].join(' '),
title: 'settings'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip'),
$('<i>', {
class: ['fa', 'fa-fw', 'fa-refresh', config.systemModuleHeadlineIcon, config.systemModuleHeadlineIconRefresh].join(' '),
title: 'refresh&nbsp;all'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip')
let moduleElement = $('<div>').append(
$('<div>', {
class: config.moduleHeadClass
}).append(
$('<h5>', {
class: config.moduleHandlerClass
}),
$('<h5>', {
class: 'pull-right'
}).append(
$('<i>', {
class: ['fa', 'fa-fw', 'fa-search', config.moduleHeadlineIconClass, config.moduleHeadlineIconSearchClass].join(' '),
title: 'find&nbsp;route'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip'),
$('<i>', {
class: ['fa', 'fa-fw', 'fa-sliders', config.moduleHeadlineIconClass, config.moduleHeadlineIconSettingsClass].join(' '),
title: 'settings'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip'),
$('<i>', {
class: ['fa', 'fa-fw', 'fa-refresh', config.moduleHeadlineIconClass, config.moduleHeadlineIconRefreshClass].join(' '),
title: 'refresh&nbsp;all'
}).attr('data-html', 'true').attr('data-toggle', 'tooltip')
),
$('<h5>', {
text: 'Routes'
})
)
);
moduleElement.append(headlineToolbar);
// headline
let headline = $('<h5>', {
class: 'pull-left',
text: 'Routes'
});
moduleElement.append(headline);
// crate new route table
let table = $('<table>', {
class: ['compact', 'stripe', 'order-column', 'row-border', config.systemInfoRoutesTableClass].join(' ')
});
moduleElement.append( $(table) );
moduleElement.append(table);
// init empty table
let routesTable = table.DataTable( {
@@ -1006,12 +1002,12 @@ define([
let routesTable = routesTableElement.DataTable();
// init refresh routes --------------------------------------------------------------------
moduleElement.find('.' + config.systemModuleHeadlineIconRefresh).on('click', function(e){
moduleElement.find('.' + config.moduleHeadlineIconRefreshClass).on('click', function(e){
updateRoutesTable(moduleElement, routesTable);
});
// init search routes dialog --------------------------------------------------------------
moduleElement.find('.' + config.systemModuleHeadlineIconSearch).on('click', function(e){
moduleElement.find('.' + config.moduleHeadlineIconSearchClass).on('click', function(e){
let maxRouteSearchLimit = this.Init.routeSearch.limit;
if(routesTable.rows().count() >= maxRouteSearchLimit){
@@ -1032,7 +1028,7 @@ define([
}));
// init settings dialog -------------------------------------------------------------------
moduleElement.find('.' + config.systemModuleHeadlineIconSettings).on('click', function(e){
moduleElement.find('.' + config.moduleHeadlineIconSettingsClass).on('click', function(e){
let dialogData = {
mapId: mapId
};
@@ -1061,49 +1057,10 @@ define([
};
/**
* updates an dom element with the system route module
* @param mapId
* @param systemData
*/
$.fn.drawSystemRouteModule = function(mapId, systemData){
let parentElement = $(this);
// show route module
let showModule = function(moduleElement){
if(moduleElement){
moduleElement.css({ opacity: 0 });
parentElement.append(moduleElement);
moduleElement.velocity('transition.slideDownIn', {
duration: Init.animationSpeed.mapModule,
delay: Init.animationSpeed.mapModule,
complete: function(){
initModule(moduleElement, mapId, systemData);
}
});
}
};
// check if module already exists
let moduleElement = parentElement.find('.' + config.systemRouteModuleClass);
if(moduleElement.length > 0){
moduleElement.velocity('transition.slideDownOut', {
duration: Init.animationSpeed.mapModule,
complete: function(tempElement){
$(tempElement).remove();
moduleElement = getModule();
showModule(moduleElement);
}
});
}else{
moduleElement = getModule();
showModule(moduleElement);
}
return {
config: config,
getModule: getModule,
initModule: initModule
};
});

140
js/app/ui/system_signature.js
View File

@@ -15,10 +15,15 @@ define([
let config = {
// module info
modulePosition: 4,
moduleName: 'systemSignature',
moduleHeadClass: 'pf-module-head', // class for module header
moduleHandlerClass: 'pf-module-handler-drag', // class for "drag" handler
moduleClass: 'pf-module', // class for each module
// system signature module
systemSigModuleClass: 'pf-sig-table-module', // module wrapper
moduleTypeClass: 'pf-sig-table-module', // module wrapper
// tables
tableToolsClass: 'pf-table-tools', // class for table toolbar
@@ -1473,7 +1478,7 @@ define([
let connectionOptions = [];
for(let i = 0; i < systemConnections.length; i++){
let connectionData = Map.getDataByConnection(systemConnections[i]);
let connectionData = MapUtil.getDataByConnection(systemConnections[i]);
// connectionId is required (must be stored)
if(connectionData.id){
@@ -1739,7 +1744,7 @@ define([
let deleteSignatures = function(tableApi, rows){
let deletedSignatures = 0;
let moduleElement = $('.' + config.systemSigModuleClass);
let moduleElement = $('.' + config.moduleTypeClass);
let data = rows.data();
let rowElements = rows.nodes().to$();
let signatureCount = data.length;
@@ -2312,12 +2317,30 @@ define([
checkDeleteSignaturesButton(e.data.moduleElement);
});
// destroy dataTables event -----------------------------------------------------------------------------------
tablePrimaryElement.on('destroy.dt', function(){
$(this).destroyTimestampCounter();
});
signatureTableApi.on('destroy.dt', function(){
$(this).destroyTimestampCounter();
});
// event listener for global "paste" signatures into the page -------------------------------------------------
moduleElement.on('pf:updateSystemSignatureModuleByClipboard', function(e, clipboard){
$(this).updateSignatureTableByClipboard(systemData, clipboard, {});
});
};
/**
* init callback
* @param moduleElement
* @param mapId
* @param connectionData
*/
let initModule = (moduleElement, mapId, systemData) => {
unlockSignatureTable(true);
};
/**
* get module element
* @param parentElement
@@ -2326,25 +2349,23 @@ define([
* @returns {*|jQuery|HTMLElement}
*/
let getModule = function(parentElement, mapId, systemData){
// create new module container
let moduleElement = $('<div>', {
class: [config.moduleClass, config.systemSigModuleClass].join(' '),
css: {opacity: 0}
});
let moduleElement = $('<div>').append(
$('<div>', {
class: config.moduleHeadClass
}).append(
$('<h5>', {
class: config.moduleHandlerClass
}),
$('<h5>', {
text: 'Signatures'
})
)
);
moduleElement.data('mapId', mapId);
moduleElement.data('systemId', systemData.id);
// headline
let headline = $('<h5>', {
text: 'Signatures'
});
moduleElement.append(headline);
$(parentElement).append(moduleElement);
// init dataTables
initSignatureDataTable(systemData);
@@ -2385,76 +2406,31 @@ define([
};
/**
* main module load function
* @param mapId
* @param systemData
* before module reDraw callback
*/
$.fn.drawSignatureTableModule = function(mapId, systemData){
let parentElement = $(this);
let beforeReDraw = () => {
// disable update
lockSignatureTable();
};
// show module
let showModule = function(moduleElement){
if(moduleElement){
moduleElement.velocity('transition.slideDownIn', {
duration: Init.animationSpeed.mapModule,
delay: Init.animationSpeed.mapModule,
complete: function(){
unlockSignatureTable(true);
}
});
}
};
// some custom array functions
let initArrayFunctions = function(){
/**
* sort array of objects by property name
* @param p
* @returns {Array.<T>}
*/
Array.prototype.sortBy = function(p) {
return this.slice(0).sort(function(a,b) {
return (a[p] > b[p]) ? 1 : (a[p] < b[p]) ? -1 : 0;
});
};
};
// check if module already exists
let moduleElement = parentElement.find('.' + config.systemSigModuleClass);
if(moduleElement.length > 0){
// disable update
lockSignatureTable();
moduleElement.velocity('transition.slideDownOut', {
duration: Init.animationSpeed.mapModule,
complete: function(tempElement){
tempElement = $(tempElement);
// Destroying the data tables throws
// save remove of all dataTables
let mapId = tempElement.data('mapId');
let systemId = tempElement.data('systemId');
deleteDataTableInstance(mapId, systemId, 'primary');
deleteDataTableInstance(mapId, systemId, 'secondary');
tempElement.remove();
moduleElement = getModule(parentElement, mapId, systemData);
// make modules appear "nice"
moduleElement.delay(150);
showModule(moduleElement);
}
});
}else{
// init array prototype functions
initArrayFunctions();
moduleElement = getModule(parentElement, mapId, systemData);
showModule(moduleElement);
}
/**
* before module destroy callback
*/
let beforeDestroy = (moduleElement) => {
// Destroying the data tables throws
// -> safety remove all dataTables
let mapId = moduleElement.data('mapId');
let systemId = moduleElement.data('systemId');
deleteDataTableInstance(mapId, systemId, 'primary');
deleteDataTableInstance(mapId, systemId, 'secondary');
};
return {
config: config,
getModule: getModule,
initModule: initModule,
beforeReDraw: beforeReDraw,
beforeDestroy: beforeDestroy,
getAllSignatureNamesBySystem: getAllSignatureNamesBySystem
};

69
js/app/util.js
View File

@@ -546,6 +546,8 @@ define([
}
}
return element;
};
/**
@@ -668,39 +670,6 @@ define([
});
};
/**
* add a wormhole tooltip with wh specific data to elements
* @param tooltipData
* @returns {*}
*/
$.fn.addWormholeInfoTooltip = function(tooltipData){
return this.each(function() {
let element = $(this);
requirejs(['text!templates/tooltip/wormhole_info.html', 'mustache'], function (template, Mustache) {
let content = Mustache.render(template, tooltipData);
element.popover({
placement: 'top',
html: true,
trigger: 'hover',
content: '',
container: 'body',
title: tooltipData.name +
'<span class="pull-right ' + tooltipData.class +'">' + tooltipData.security + '</span>',
delay: {
show: 250,
hide: 0
}
});
// set new popover content
let popover = element.data('bs.popover');
popover.options.content = content;
});
});
};
/**
* display a custom message (info/warning/error) to a container element
* check: $.fn.showFormMessage() for an other way of showing messages
@@ -862,6 +831,17 @@ define([
Array.prototype.diff = function(a) {
return this.filter(function(i) {return a.indexOf(i) < 0;});
};
/**
* sort array of objects by property name
* @param p
* @returns {Array.<T>}
*/
Array.prototype.sortBy = function(p) {
return this.slice(0).sort((a,b) => {
return (a[p] > b[p]) ? 1 : (a[p] < b[p]) ? -1 : 0;
});
};
};
/**
@@ -883,7 +863,7 @@ define([
}
return flatten;
} ;
};
/**
* set default configuration for "Bootbox" dialogs
@@ -1278,7 +1258,6 @@ define([
* @returns {*|HTMLElement}
*/
let getMapModule = function(){
let mapModule = $('#' + config.mapModuleId);
if(mapModule.length === 0){
mapModule = $('<div>', {
@@ -1470,13 +1449,11 @@ define([
* @param sec
* @returns {string}
*/
let getSecurityClassForSystem = function(sec){
let getSecurityClassForSystem = (sec) => {
let secClass = '';
if( Init.classes.systemSecurity.hasOwnProperty(sec) ){
secClass = Init.classes.systemSecurity[sec]['class'];
}
return secClass;
};
@@ -1994,7 +1971,7 @@ define([
* set currentSystemData as "global" variable
* @param systemData
*/
let setCurrentSystemData = function(systemData){
let setCurrentSystemData = (systemData) => {
Init.currentSystemData = systemData;
};
@@ -2002,7 +1979,7 @@ define([
* get currentSystemData from "global" variables
* @returns {*}
*/
let getCurrentSystemData = function(){
let getCurrentSystemData = () => {
return Init.currentSystemData;
};
@@ -2060,7 +2037,7 @@ define([
* @param price
* @returns {string}
*/
let formatPrice = function(price){
let formatPrice = (price) => {
price = Number( price ).toFixed(2);
let parts = price.toString().split('.');
@@ -2069,6 +2046,15 @@ define([
return price + ' ISK';
};
/**
* format mass value
* @param value
* @returns {string}
*/
let formatMassValue = (value) => {
return (parseInt(value) / 1000).toLocaleString() + ' t';
};
/**
* get localForage instance (singleton) for offline client site storage
* @returns {localforage}
@@ -2253,6 +2239,7 @@ define([
getOpenDialogs: getOpenDialogs,
openIngameWindow: openIngameWindow,
formatPrice: formatPrice,
formatMassValue: formatMassValue,
getLocalStorage: getLocalStorage,
clearSessionStorage: clearSessionStorage,
getBrowserTabId: getBrowserTabId,

3
js/lib/dom.jsPlumb-1.7.6.js
View File

@@ -10388,12 +10388,13 @@
// in IE the top left corner is what it placed at the desired location. This will not
// be fixed. IE8 is not going to be supported for much longer.
var ts = "translate(-50%, -50%)";
var ts = "translate(-50%, calc(-50% - .5px))";
div.style.webkitTransform = ts;
div.style.mozTransform = ts;
div.style.msTransform = ts;
div.style.oTransform = ts;
div.style.transform = ts;
div.style.WebkitFontSmoothing = 'antialiased';
// write the related component into the created element
div._jsPlumb = this;

14
js/lib/jquery.peity.min.js vendored
View File

@@ -1,13 +1,13 @@
// Peity jQuery plugin version 3.2.0
// (c) 2015 Ben Pickles
// Peity jQuery plugin version 3.2.1
// (c) 2016 Ben Pickles
//
// http://benpickles.github.io/peity
//
// Released under MIT license.
(function(k,w,h,v){var d=k.fn.peity=function(a,b){y&&this.each(function(){var e=k(this),c=e.data("_peity");c?(a&&(c.type=a),k.extend(c.opts,b)):(c=new x(e,a,k.extend({},d.defaults[a],e.data("peity"),b)),e.change(function(){c.draw()}).data("_peity",c));c.draw()});return this},x=function(a,b,e){this.$el=a;this.type=b;this.opts=e},o=x.prototype,q=o.svgElement=function(a,b){return k(w.createElementNS("http://www.w3.org/2000/svg",a)).attr(b)},y="createElementNS"in w&&q("svg",{})[0].createSVGRect;o.draw=
function(){var a=this.opts;d.graphers[this.type].call(this,a);a.after&&a.after.call(this,a)};o.fill=function(){var a=this.opts.fill;return k.isFunction(a)?a:function(b,e){return a[e%a.length]}};o.prepare=function(a,b){this.$svg||this.$el.hide().after(this.$svg=q("svg",{"class":"peity"}));return this.$svg.empty().data("peity",this).attr({height:b,width:a})};o.values=function(){return k.map(this.$el.text().split(this.opts.delimiter),function(a){return parseFloat(a)})};d.defaults={};d.graphers={};d.register=
function(a,b,e){this.defaults[a]=b;this.graphers[a]=e};d.register("pie",{fill:["#ff9900","#fff4dd","#ffc66e"],radius:8},function(a){if(!a.delimiter){var b=this.$el.text().match(/[^0-9\.]/);a.delimiter=b?b[0]:","}b=k.map(this.values(),function(a){return 0<a?a:0});if("/"==a.delimiter)var e=b[0],b=[e,h.max(0,b[1]-e)];for(var c=0,e=b.length,t=0;c<e;c++)t+=b[c];t||(e=2,t=1,b=[0,1]);var l=2*a.radius,l=this.prepare(a.width||l,a.height||l),c=l.width(),f=l.height(),j=c/2,d=f/2,f=h.min(j,d),a=a.innerRadius;
"donut"==this.type&&!a&&(a=0.5*f);for(var r=h.PI,s=this.fill(),g=this.scale=function(a,b){var c=a/t*r*2-r/2;return[b*h.cos(c)+j,b*h.sin(c)+d]},m=0,c=0;c<e;c++){var u=b[c],i=u/t;if(0!=i){if(1==i)if(a)var i=j-0.01,p=d-f,n=d-a,i=q("path",{d:["M",j,p,"A",f,f,0,1,1,i,p,"L",i,n,"A",a,a,0,1,0,j,n].join(" ")});else i=q("circle",{cx:j,cy:d,r:f});else p=m+u,n=["M"].concat(g(m,f),"A",f,f,0,0.5<i?1:0,1,g(p,f),"L"),a?n=n.concat(g(p,a),"A",a,a,0,0.5<i?1:0,0,g(m,a)):n.push(j,d),m+=u,i=q("path",{d:n.join(" ")});
i.attr("fill",s.call(this,u,c,b));l.append(i)}}});d.register("donut",k.extend(!0,{},d.defaults.pie),function(a){d.graphers.pie.call(this,a)});d.register("line",{delimiter:",",fill:"#c6d9fd",height:16,min:0,stroke:"#4d89f9",strokeWidth:1,width:32},function(a){var b=this.values();1==b.length&&b.push(b[0]);for(var e=h.max.apply(h,a.max==v?b:b.concat(a.max)),c=h.min.apply(h,a.min==v?b:b.concat(a.min)),d=this.prepare(a.width,a.height),l=a.strokeWidth,f=d.width(),j=d.height()-l,k=e-c,e=this.x=function(a){return a*
(f/(b.length-1))},r=this.y=function(a){var b=j;k&&(b-=(a-c)/k*j);return b+l/2},s=r(h.max(c,0)),g=[0,s],m=0;m<b.length;m++)g.push(e(m),r(b[m]));g.push(f,s);a.fill&&d.append(q("polygon",{fill:a.fill,points:g.join(" ")}));l&&d.append(q("polyline",{fill:"none",points:g.slice(2,g.length-2).join(" "),stroke:a.stroke,"stroke-width":l,"stroke-linecap":"square"}))});d.register("bar",{delimiter:",",fill:["#4D89F9"],height:16,min:0,padding:0.1,width:32},function(a){for(var b=this.values(),e=h.max.apply(h,a.max==
function(){var a=this.opts;d.graphers[this.type].call(this,a);a.after&&a.after.call(this,a)};o.fill=function(){var a=this.opts.fill;return k.isFunction(a)?a:function(b,e){return a[e%a.length]}};o.prepare=function(a,b){this.$svg||this.$el.hide().after(this.$svg=q("svg",{"class":"peity"}));return this.$svg.empty().data("peity",this).attr({height:b,width:a})};o.values=function(){return k.map(this.$el.text().split(this.opts.delimiter),function(a){return parseFloat(a)})};d.defaults={};d.graphers={};d.register=
function(a,b,e){this.defaults[a]=b;this.graphers[a]=e};d.register("pie",{fill:["#ff9900","#fff4dd","#ffc66e"],radius:8},function(a){if(!a.delimiter){var b=this.$el.text().match(/[^0-9\.]/);a.delimiter=b?b[0]:","}b=k.map(this.values(),function(a){return 0<a?a:0});if("/"==a.delimiter)var e=b[0],b=[e,h.max(0,b[1]-e)];for(var c=0,e=b.length,t=0;c<e;c++)t+=b[c];t||(e=2,t=1,b=[0,1]);var l=2*a.radius,l=this.prepare(a.width||l,a.height||l),c=l.width(),f=l.height(),j=c/2,d=f/2,f=h.min(j,d),a=a.innerRadius;
"donut"==this.type&&!a&&(a=0.5*f);for(var r=h.PI,s=this.fill(),g=this.scale=function(a,b){var c=a/t*r*2-r/2;return[b*h.cos(c)+j,b*h.sin(c)+d]},m=0,c=0;c<e;c++){var u=b[c],i=u/t;if(0!=i){if(1==i)if(a)var i=j-0.01,p=d-f,n=d-a,i=q("path",{d:["M",j,p,"A",f,f,0,1,1,i,p,"L",i,n,"A",a,a,0,1,0,j,n].join(" ")});else i=q("circle",{cx:j,cy:d,r:f});else p=m+u,n=["M"].concat(g(m,f),"A",f,f,0,0.5<i?1:0,1,g(p,f),"L"),a?n=n.concat(g(p,a),"A",a,a,0,0.5<i?1:0,0,g(m,a)):n.push(j,d),m+=u,i=q("path",{d:n.join(" ")});
i.attr("fill",s.call(this,u,c,b));l.append(i)}}});d.register("donut",k.extend(!0,{},d.defaults.pie),function(a){d.graphers.pie.call(this,a)});d.register("line",{delimiter:",",fill:"#c6d9fd",height:16,min:0,stroke:"#4d89f9",strokeWidth:1,width:32},function(a){var b=this.values();1==b.length&&b.push(b[0]);for(var e=h.max.apply(h,a.max==v?b:b.concat(a.max)),c=h.min.apply(h,a.min==v?b:b.concat(a.min)),d=this.prepare(a.width,a.height),l=a.strokeWidth,f=d.width(),j=d.height()-l,k=e-c,e=this.x=function(a){return a*
(f/(b.length-1))},r=this.y=function(a){var b=j;k&&(b-=(a-c)/k*j);return b+l/2},s=r(h.max(c,0)),g=[0,s],m=0;m<b.length;m++)g.push(e(m),r(b[m]));g.push(f,s);a.fill&&d.append(q("polygon",{fill:a.fill,points:g.join(" ")}));l&&d.append(q("polyline",{fill:"none",points:g.slice(2,g.length-2).join(" "),stroke:a.stroke,"stroke-width":l,"stroke-linecap":"square"}))});d.register("bar",{delimiter:",",fill:["#4D89F9"],height:16,min:0,padding:0.1,width:32},function(a){for(var b=this.values(),e=h.max.apply(h,a.max==
v?b:b.concat(a.max)),c=h.min.apply(h,a.min==v?b:b.concat(a.min)),d=this.prepare(a.width,a.height),l=d.width(),f=d.height(),j=e-c,a=a.padding,k=this.fill(),r=this.x=function(a){return a*l/b.length},s=this.y=function(a){return f-(j?(a-c)/j*f:1)},g=0;g<b.length;g++){var m=r(g+a),u=r(g+1-a)-m,i=b[g],p=s(i),n=p,o;j?0>i?n=s(h.min(e,0)):p=s(h.max(c,0)):o=1;o=p-n;0==o&&(o=1,0<e&&j&&n--);d.append(q("rect",{fill:k.call(this,i,g,b),x:m,y:n,width:u,height:o}))}})})(jQuery,document,Math);

2
js/lib/morris.min.js vendored
View File

File diff suppressed because one or more lines are too long

14
js/lib/raphael-min.js vendored
View File

File diff suppressed because one or more lines are too long

2
js/lib/sortable.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long