- new "compact layout" added, shows *inline* playerCount + tooltip, closed #607
- minor UI fixes on /login page
This commit is contained in:
@@ -35,6 +35,7 @@ define([
|
||||
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
|
||||
systemHeadCounterClass: 'pf-system-head-counter', // class for system user counter
|
||||
systemHeadExpandClass: 'pf-system-head-expand', // class for system head expand arrow
|
||||
systemHeadInfoClass: 'pf-system-head-info', // class for system info
|
||||
systemBodyClass: 'pf-system-body', // class for system body
|
||||
@@ -125,16 +126,21 @@ define([
|
||||
* @param map
|
||||
* @param data
|
||||
* @param currentUserIsHere boolean - if the current user is in this system
|
||||
* @param options
|
||||
*/
|
||||
$.fn.updateSystemUserData = function(map, data, currentUserIsHere){
|
||||
$.fn.updateSystemUserData = function(map, data, currentUserIsHere, options){
|
||||
let system = $(this);
|
||||
let systemId = system.attr('id');
|
||||
let compactView = Util.getObjVal(options, 'compactView');
|
||||
|
||||
// find countElement -> minimizedUI
|
||||
let systemCount = system.find('.' + config.systemHeadCounterClass);
|
||||
|
||||
// find system body
|
||||
let systemBody = $( system.find('.' + config.systemBodyClass) );
|
||||
let systemBody = system.find('.' + config.systemBodyClass);
|
||||
|
||||
// find expand arrow
|
||||
let systemHeadExpand = $( system.find('.' + config.systemHeadExpandClass) );
|
||||
let systemHeadExpand = system.find('.' + config.systemHeadExpandClass);
|
||||
|
||||
let oldCacheKey = system.data('userCache');
|
||||
let oldUserCount = system.data('userCount');
|
||||
@@ -154,6 +160,11 @@ define([
|
||||
data.user
|
||||
){
|
||||
let cacheArray = [];
|
||||
|
||||
// we need to add "view mode" option to key
|
||||
// -> if view mode change detected -> key no longer valid
|
||||
cacheArray.push(compactView ? 'compact' : 'default');
|
||||
|
||||
// loop all active pilots and build cache-key
|
||||
for(let i = 0; i < data.user.length; i++){
|
||||
userCounter++;
|
||||
@@ -171,71 +182,73 @@ define([
|
||||
// remove all content
|
||||
systemBody.empty();
|
||||
|
||||
// loop "again" and build DOM object with user information
|
||||
for(let j = 0; j < data.user.length; j++){
|
||||
let userData = data.user[j];
|
||||
if(compactView){
|
||||
// compact system layout-> pilot count shown in systemHead
|
||||
systemCount.text(userCounter);
|
||||
|
||||
let statusClass = Util.getStatusInfoForCharacter(userData, 'class');
|
||||
let userName = userData.name;
|
||||
system.toggleSystemTooltip('destroy', {});
|
||||
systemHeadExpand.hide();
|
||||
system.toggleBody(false, map, {});
|
||||
|
||||
let item = $('<div>', {
|
||||
class: config.systemBodyItemClass
|
||||
}).append(
|
||||
$('<span>', {
|
||||
text: userData.log.ship.typeName,
|
||||
class: config.systemBodyRightClass
|
||||
})
|
||||
).append(
|
||||
$('<i>', {
|
||||
class: ['fas', 'fa-circle', config.systemBodyItemStatusClass, statusClass].join(' ')
|
||||
})
|
||||
).append(
|
||||
$('<span>', {
|
||||
class: config.systemBodyItemNameClass,
|
||||
text: userName
|
||||
})
|
||||
);
|
||||
map.revalidate(systemId);
|
||||
}else{
|
||||
systemCount.empty();
|
||||
|
||||
systemBody.append(item);
|
||||
}
|
||||
// show active pilots in body + pilots count tooltip
|
||||
// loop "again" and build DOM object with user information
|
||||
for(let j = 0; j < data.user.length; j++){
|
||||
let userData = data.user[j];
|
||||
|
||||
let statusClass = Util.getStatusInfoForCharacter(userData, 'class');
|
||||
let userName = userData.name;
|
||||
|
||||
// ====================================================================================================
|
||||
let item = $('<div>', {
|
||||
class: config.systemBodyItemClass
|
||||
}).append(
|
||||
$('<span>', {
|
||||
text: userData.log.ship.typeName,
|
||||
class: config.systemBodyRightClass
|
||||
})
|
||||
).append(
|
||||
$('<i>', {
|
||||
class: ['fas', 'fa-circle', config.systemBodyItemStatusClass, statusClass].join(' ')
|
||||
})
|
||||
).append(
|
||||
$('<span>', {
|
||||
class: config.systemBodyItemNameClass,
|
||||
text: userName
|
||||
})
|
||||
);
|
||||
|
||||
// user count changed -> change tooltip content
|
||||
systemBody.append(item);
|
||||
}
|
||||
|
||||
// set tooltip color
|
||||
let highlight = '';
|
||||
if(userCounter > oldUserCount){
|
||||
highlight = 'good';
|
||||
}else if(userCounter < oldUserCount){
|
||||
highlight = 'bad';
|
||||
}
|
||||
// user count changed -> change tooltip content
|
||||
let highlight = '';
|
||||
if(userCounter >= oldUserCount){
|
||||
highlight = 'good';
|
||||
}else if(userCounter < oldUserCount){
|
||||
highlight = 'bad';
|
||||
}
|
||||
|
||||
let tooltipOptions = {
|
||||
systemId: systemId,
|
||||
highlight: highlight,
|
||||
userCount: userCounter
|
||||
};
|
||||
let tooltipOptions = {
|
||||
systemId: systemId,
|
||||
highlight: highlight,
|
||||
userCount: userCounter
|
||||
};
|
||||
|
||||
// show system head
|
||||
systemHeadExpand.velocity('stop', true).velocity({
|
||||
width: '10px'
|
||||
},{
|
||||
duration: 50,
|
||||
display: 'inline-block',
|
||||
progress: function(){
|
||||
//re-validate element size and repaint
|
||||
map.revalidate( systemId );
|
||||
},
|
||||
complete: function(){
|
||||
// show system body
|
||||
system.toggleBody(true, map, {complete: function(system){
|
||||
// show system head
|
||||
systemHeadExpand.css('display', 'inline-block');
|
||||
|
||||
// show system body
|
||||
system.toggleBody(true, map, {
|
||||
complete: function(system){
|
||||
// show active user tooltip
|
||||
system.toggleSystemTooltip('show', tooltipOptions);
|
||||
}});
|
||||
}
|
||||
});
|
||||
map.revalidate( systemId );
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}else{
|
||||
// no user data found for this system
|
||||
@@ -247,16 +260,13 @@ define([
|
||||
oldCacheKey &&
|
||||
oldCacheKey.length > 0
|
||||
){
|
||||
// remove tooltip
|
||||
// reset all elements
|
||||
systemCount.empty();
|
||||
system.toggleSystemTooltip('destroy', {});
|
||||
systemHeadExpand.hide();
|
||||
system.toggleBody(false, map, {});
|
||||
|
||||
// no user -> clear SystemBody
|
||||
systemHeadExpand.velocity('stop').velocity('reverse',{
|
||||
display: 'none',
|
||||
complete: function(){
|
||||
system.toggleBody(false, map, {});
|
||||
}
|
||||
});
|
||||
map.revalidate(systemId);
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -305,7 +315,7 @@ define([
|
||||
begin: function(){
|
||||
},
|
||||
progress: function(){
|
||||
// revalidate element size and repaint
|
||||
// re-validate element size and repaint
|
||||
map.revalidate( systemDomId );
|
||||
},
|
||||
complete: function(){
|
||||
@@ -389,6 +399,10 @@ define([
|
||||
$('<span>', {
|
||||
class: systemHeadClasses.join(' '),
|
||||
}).attr('data-value', systemName),
|
||||
// System users count
|
||||
$('<span>', {
|
||||
class: [config.systemHeadCounterClass, Util.config.popoverTriggerClass].join(' ')
|
||||
}),
|
||||
// System locked status
|
||||
$('<i>', {
|
||||
class: ['fas', 'fa-lock', 'fa-fw'].join(' ')
|
||||
@@ -2717,8 +2731,8 @@ define([
|
||||
width: newWidth,
|
||||
'min-width': minWidth + 'px'
|
||||
},{
|
||||
easing: 'easeInOutQuart',
|
||||
duration: 120,
|
||||
easing: 'easeOut',
|
||||
duration: 60,
|
||||
progress: function(){
|
||||
// repaint connections of current system
|
||||
map.revalidate(systemId);
|
||||
@@ -2761,6 +2775,27 @@ define([
|
||||
selector: '.' + config.systemClass + ' .' + config.systemHeadExpandClass
|
||||
});
|
||||
|
||||
// system "active users" popover ------------------------------------------------------------------------------
|
||||
mapContainer.hoverIntent({
|
||||
over: function(e){
|
||||
let counterElement = $(this);
|
||||
let systemElement = counterElement.closest('.' + config.systemClass);
|
||||
let mapId = systemElement.data('mapid');
|
||||
let systemId = systemElement.data('systemId');
|
||||
let userData = Util.getCurrentMapUserData(mapId);
|
||||
let systemUserData = Util.getCharacterDataBySystemId(userData.data.systems, systemId);
|
||||
|
||||
counterElement.addSystemPilotTooltip(systemUserData, {
|
||||
trigger: 'manual',
|
||||
placement: 'right'
|
||||
}).setPopoverSmall().popover('show');
|
||||
},
|
||||
out: function(e){
|
||||
$(this).destroyPopover();
|
||||
},
|
||||
selector: '.' + config.systemHeadCounterClass
|
||||
});
|
||||
|
||||
// system "effect" popover ------------------------------------------------------------------------------------
|
||||
// -> event delegation to system elements, popup only if needed (hover)
|
||||
mapContainer.hoverIntent({
|
||||
@@ -3010,18 +3045,20 @@ define([
|
||||
|
||||
// container must exist! otherwise systems can not be updated
|
||||
if(mapElement !== undefined){
|
||||
|
||||
mapElement = $(mapElement);
|
||||
|
||||
// get current character log data
|
||||
let characterLogExists = false;
|
||||
let currentCharacterLog = Util.getCurrentCharacterLog();
|
||||
|
||||
// check if map is frozen
|
||||
if(mapElement.data('frozen') === true){
|
||||
return returnStatus;
|
||||
}
|
||||
|
||||
// compact/small system layout or not
|
||||
let compactView = mapElement.hasClass(MapUtil.config.mapCompactClass);
|
||||
|
||||
// get current character log data
|
||||
let characterLogExists = false;
|
||||
let currentCharacterLog = Util.getCurrentCharacterLog();
|
||||
|
||||
// data for header update
|
||||
let headerUpdateData = {
|
||||
mapId: userData.config.id,
|
||||
@@ -3089,7 +3126,7 @@ define([
|
||||
}
|
||||
}
|
||||
|
||||
system.updateSystemUserData(map, tempUserData, currentUserIsHere);
|
||||
system.updateSystemUserData(map, tempUserData, currentUserIsHere, {compactView: compactView});
|
||||
}
|
||||
|
||||
// users who are not in any map system --------------------------------------------------------------------
|
||||
@@ -3329,6 +3366,12 @@ define([
|
||||
option: 'mapEndpoint',
|
||||
toggle: false
|
||||
});
|
||||
|
||||
// init compact system UI --------------------------------------------------------------------------
|
||||
mapContainer.triggerMenuEvent('MapOption', {
|
||||
option: 'mapCompact',
|
||||
toggle: false
|
||||
});
|
||||
};
|
||||
|
||||
// show nice visualization effect ---------------------------------------------------------------------
|
||||
|
||||
@@ -360,6 +360,12 @@ define([
|
||||
}
|
||||
}
|
||||
},
|
||||
mapCompact: {
|
||||
title: 'compact layout',
|
||||
trigger: 'active',
|
||||
class: 'pf-map-overlay-compact',
|
||||
iconClass: ['fas', 'fa-fw', 'fa-compress']
|
||||
},
|
||||
connection: {
|
||||
title: 'WH data',
|
||||
trigger: 'hover',
|
||||
|
||||
@@ -21,6 +21,7 @@ define([
|
||||
|
||||
mapClass: 'pf-map', // class for all maps
|
||||
mapGridClass: 'pf-grid-small', // class for map grid snapping
|
||||
mapCompactClass: 'pf-compact', // class for map compact system UI
|
||||
|
||||
systemIdPrefix: 'pf-system-', // id prefix for a system
|
||||
systemClass: 'pf-system', // class for all systems
|
||||
@@ -53,6 +54,11 @@ define([
|
||||
description: 'Endpoint overlay',
|
||||
onEnable: 'showEndpointOverlays', // jQuery extension function
|
||||
onDisable: 'hideEndpointOverlays' // jQuery extension function
|
||||
},
|
||||
mapCompact : {
|
||||
buttonId: Util.config.menuButtonCompactId,
|
||||
description: 'Compact system layout',
|
||||
class: 'mapCompactClass'
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1105,10 +1111,40 @@ define([
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* add system pilot tooltip
|
||||
* @param systemUserData
|
||||
* @param options
|
||||
* @returns {*}
|
||||
*/
|
||||
$.fn.addSystemPilotTooltip = function(systemUserData, options){
|
||||
let content = Util.getSystemPilotsTable(systemUserData);
|
||||
|
||||
let defaultOptions = {
|
||||
placement: 'top',
|
||||
html: true,
|
||||
trigger: 'hover',
|
||||
container: 'body',
|
||||
title: 'Pilots',
|
||||
content: content,
|
||||
delay: {
|
||||
show: 150,
|
||||
hide: 0
|
||||
},
|
||||
};
|
||||
|
||||
options = $.extend({}, defaultOptions, options);
|
||||
|
||||
return this.each(function(){
|
||||
$(this).popover(options);
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* add system effect tooltip
|
||||
* @param security
|
||||
* @param effect
|
||||
* @param options
|
||||
* @returns {*}
|
||||
*/
|
||||
$.fn.addSystemEffectTooltip = function(security, effect, options){
|
||||
|
||||
@@ -345,7 +345,7 @@ define([
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonGridId
|
||||
}).html(' Grid snapping').prepend(
|
||||
}).html(' Grid snapping').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-th fa-fw'
|
||||
})
|
||||
@@ -359,7 +359,7 @@ define([
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonMagnetizerId
|
||||
}).html(' Magnetizing').prepend(
|
||||
}).html(' Magnetizing').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-magnet fa-fw'
|
||||
})
|
||||
@@ -373,7 +373,7 @@ define([
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonEndpointId
|
||||
}).html(' Signatures').prepend(
|
||||
}).html(' Signatures').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-link fa-fw'
|
||||
})
|
||||
@@ -383,6 +383,25 @@ define([
|
||||
toggle: true
|
||||
});
|
||||
})
|
||||
).append(
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonCompactId
|
||||
}).html(' Compact').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-compress fa-fw'
|
||||
})
|
||||
).append(
|
||||
$('<span>',{
|
||||
class: 'badge bg-color bg-color-gray txt-color txt-color-warning',
|
||||
text: 'beta'
|
||||
})
|
||||
).on('click', function(){
|
||||
Util.getMapModule().getActiveMap().triggerMenuEvent('MapOption', {
|
||||
option: 'mapCompact',
|
||||
toggle: true
|
||||
});
|
||||
})
|
||||
).append(
|
||||
getMenuHeadline('Help')
|
||||
).append(
|
||||
|
||||
@@ -41,6 +41,7 @@ define([
|
||||
menuButtonMagnetizerId: 'pf-menu-button-magnetizer', // id for menu button "magnetizer"
|
||||
menuButtonGridId: 'pf-menu-button-grid', // id for menu button "grid snap"
|
||||
menuButtonEndpointId: 'pf-menu-button-endpoint', // id for menu button "endpoint" overlays
|
||||
menuButtonCompactId: 'pf-menu-button-compact', // id for menu button "compact" UI map view
|
||||
menuButtonMapDeleteId: 'pf-menu-button-map-delete', // id for menu button "delete map"
|
||||
|
||||
settingsMessageVelocityOptions: {
|
||||
@@ -56,6 +57,9 @@ define([
|
||||
mapWrapperClass: 'pf-map-wrapper', // wrapper div (scrollable)
|
||||
mapClass: 'pf-map' , // class for all maps
|
||||
|
||||
// util
|
||||
userStatusClass: 'pf-user-status', // class for player status
|
||||
|
||||
// select2
|
||||
select2Class: 'pf-select2', // class for all "Select2" <select> elements
|
||||
|
||||
@@ -960,6 +964,21 @@ define([
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* get hash from string
|
||||
* @returns {number}
|
||||
*/
|
||||
String.prototype.hashCode = function() {
|
||||
let hash = 0, i, chr;
|
||||
if (this.length === 0) return hash;
|
||||
for (i = 0; i < this.length; i++) {
|
||||
chr = this.charCodeAt(i);
|
||||
hash = ((hash << 5) - hash) + chr;
|
||||
hash |= 0; // Convert to 32bit integer
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
initPassiveEvents();
|
||||
};
|
||||
|
||||
@@ -1707,6 +1726,51 @@ define([
|
||||
return table;
|
||||
};
|
||||
|
||||
/**
|
||||
* get a HTML table with pilots/ship names
|
||||
* @param users
|
||||
* @returns {string}
|
||||
*/
|
||||
let getSystemPilotsTable = users => {
|
||||
let table = '';
|
||||
if(users.length > 0){
|
||||
|
||||
let getRow = (statusClass, userName, shipName, shipTypeName, mass) => {
|
||||
let row = '<tr>';
|
||||
row += '<td>';
|
||||
row += statusClass !== null ? '<i class="fas fa-circle ' + config.userStatusClass + ' ' + statusClass + '">' : '';
|
||||
row += '</td>';
|
||||
row += '<td>';
|
||||
row += userName;
|
||||
row += '</td>';
|
||||
row += '<td>';
|
||||
row += shipName;
|
||||
row += '</td>';
|
||||
row += '<td class="text-right txt-color txt-color-orangeLight">';
|
||||
row += shipTypeName;
|
||||
row += '</td>';
|
||||
row += '<td class="text-right txt-color">';
|
||||
row += mass;
|
||||
row += '</td>';
|
||||
row += '</tr>';
|
||||
return row;
|
||||
};
|
||||
|
||||
let massAll = 0;
|
||||
table += '<table>';
|
||||
for(let user of users){
|
||||
massAll += parseInt(user.log.ship.mass);
|
||||
let statusClass = getStatusInfoForCharacter(user, 'class');
|
||||
let mass = formatMassValue(user.log.ship.mass);
|
||||
table += getRow(statusClass, user.name, user.log.ship.name, user.log.ship.typeName, mass);
|
||||
}
|
||||
table += getRow(null, '', '', '', formatMassValue(massAll));
|
||||
table += '</table>';
|
||||
}
|
||||
|
||||
return table;
|
||||
};
|
||||
|
||||
/**
|
||||
* get a HTML table with information for multiple systems
|
||||
* e.g. for popover
|
||||
@@ -2174,6 +2238,23 @@ define([
|
||||
return nearBySystems;
|
||||
};
|
||||
|
||||
/**
|
||||
* get userData (pilots) from systemId
|
||||
* @param userData
|
||||
* @param systemId
|
||||
* @returns {*}
|
||||
*/
|
||||
let getCharacterDataBySystemId = (userData, systemId) => {
|
||||
if(userData && userData.length){
|
||||
for(let i = 0; i < userData.length; i++){
|
||||
if(userData[i].id === systemId){
|
||||
return userData[i].user;
|
||||
}
|
||||
}
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
/**
|
||||
* get current character data from all characters who are "nearby" the current user
|
||||
* -> see getNearBySystemData()
|
||||
@@ -2185,20 +2266,11 @@ define([
|
||||
*/
|
||||
let getNearByCharacterData = (nearBySystems, userData, jumps = 0, data = {}) => {
|
||||
|
||||
let getCharacterDataBySystemId = (systemId) => {
|
||||
for(let i = 0; i < userData.length; i++){
|
||||
if(userData[i].id === systemId){
|
||||
return userData[i].user;
|
||||
}
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
let filterFinalCharData = function(tmpFinalCharData){
|
||||
return this.id !== tmpFinalCharData.id;
|
||||
};
|
||||
|
||||
let characterData = getCharacterDataBySystemId(nearBySystems.systemData.systemId);
|
||||
let characterData = getCharacterDataBySystemId(userData, nearBySystems.systemData.systemId);
|
||||
|
||||
if(characterData.length){
|
||||
// filter (remove) characterData for "already" added chars
|
||||
@@ -2659,6 +2731,7 @@ define([
|
||||
getSystemEffectData: getSystemEffectData,
|
||||
getSystemEffectTable: getSystemEffectTable,
|
||||
getSystemPlanetsTable: getSystemPlanetsTable,
|
||||
getSystemPilotsTable: getSystemPilotsTable,
|
||||
getSystemsInfoTable: getSystemsInfoTable,
|
||||
getStatusInfoForCharacter: getStatusInfoForCharacter,
|
||||
getSecurityClassForSystem: getSecurityClassForSystem,
|
||||
@@ -2685,6 +2758,7 @@ define([
|
||||
getCurrentUserInfo: getCurrentUserInfo,
|
||||
getCurrentCharacterLog: getCurrentCharacterLog,
|
||||
flattenXEditableSelectArray: flattenXEditableSelectArray,
|
||||
getCharacterDataBySystemId: getCharacterDataBySystemId,
|
||||
getNearBySystemData: getNearBySystemData,
|
||||
getNearByCharacterData: getNearByCharacterData,
|
||||
setDestination: setDestination,
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
BIN
public/img/landing/intel_1.jpg
Normal file
BIN
public/img/landing/intel_1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 57 KiB |
BIN
public/img/landing/thumbs/intel_1.jpg
Normal file
BIN
public/img/landing/thumbs/intel_1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
@@ -35,6 +35,7 @@ define([
|
||||
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
|
||||
systemHeadCounterClass: 'pf-system-head-counter', // class for system user counter
|
||||
systemHeadExpandClass: 'pf-system-head-expand', // class for system head expand arrow
|
||||
systemHeadInfoClass: 'pf-system-head-info', // class for system info
|
||||
systemBodyClass: 'pf-system-body', // class for system body
|
||||
@@ -125,16 +126,21 @@ define([
|
||||
* @param map
|
||||
* @param data
|
||||
* @param currentUserIsHere boolean - if the current user is in this system
|
||||
* @param options
|
||||
*/
|
||||
$.fn.updateSystemUserData = function(map, data, currentUserIsHere){
|
||||
$.fn.updateSystemUserData = function(map, data, currentUserIsHere, options){
|
||||
let system = $(this);
|
||||
let systemId = system.attr('id');
|
||||
let compactView = Util.getObjVal(options, 'compactView');
|
||||
|
||||
// find countElement -> minimizedUI
|
||||
let systemCount = system.find('.' + config.systemHeadCounterClass);
|
||||
|
||||
// find system body
|
||||
let systemBody = $( system.find('.' + config.systemBodyClass) );
|
||||
let systemBody = system.find('.' + config.systemBodyClass);
|
||||
|
||||
// find expand arrow
|
||||
let systemHeadExpand = $( system.find('.' + config.systemHeadExpandClass) );
|
||||
let systemHeadExpand = system.find('.' + config.systemHeadExpandClass);
|
||||
|
||||
let oldCacheKey = system.data('userCache');
|
||||
let oldUserCount = system.data('userCount');
|
||||
@@ -154,6 +160,11 @@ define([
|
||||
data.user
|
||||
){
|
||||
let cacheArray = [];
|
||||
|
||||
// we need to add "view mode" option to key
|
||||
// -> if view mode change detected -> key no longer valid
|
||||
cacheArray.push(compactView ? 'compact' : 'default');
|
||||
|
||||
// loop all active pilots and build cache-key
|
||||
for(let i = 0; i < data.user.length; i++){
|
||||
userCounter++;
|
||||
@@ -171,71 +182,73 @@ define([
|
||||
// remove all content
|
||||
systemBody.empty();
|
||||
|
||||
// loop "again" and build DOM object with user information
|
||||
for(let j = 0; j < data.user.length; j++){
|
||||
let userData = data.user[j];
|
||||
if(compactView){
|
||||
// compact system layout-> pilot count shown in systemHead
|
||||
systemCount.text(userCounter);
|
||||
|
||||
let statusClass = Util.getStatusInfoForCharacter(userData, 'class');
|
||||
let userName = userData.name;
|
||||
system.toggleSystemTooltip('destroy', {});
|
||||
systemHeadExpand.hide();
|
||||
system.toggleBody(false, map, {});
|
||||
|
||||
let item = $('<div>', {
|
||||
class: config.systemBodyItemClass
|
||||
}).append(
|
||||
$('<span>', {
|
||||
text: userData.log.ship.typeName,
|
||||
class: config.systemBodyRightClass
|
||||
})
|
||||
).append(
|
||||
$('<i>', {
|
||||
class: ['fas', 'fa-circle', config.systemBodyItemStatusClass, statusClass].join(' ')
|
||||
})
|
||||
).append(
|
||||
$('<span>', {
|
||||
class: config.systemBodyItemNameClass,
|
||||
text: userName
|
||||
})
|
||||
);
|
||||
map.revalidate(systemId);
|
||||
}else{
|
||||
systemCount.empty();
|
||||
|
||||
systemBody.append(item);
|
||||
}
|
||||
// show active pilots in body + pilots count tooltip
|
||||
// loop "again" and build DOM object with user information
|
||||
for(let j = 0; j < data.user.length; j++){
|
||||
let userData = data.user[j];
|
||||
|
||||
let statusClass = Util.getStatusInfoForCharacter(userData, 'class');
|
||||
let userName = userData.name;
|
||||
|
||||
// ====================================================================================================
|
||||
let item = $('<div>', {
|
||||
class: config.systemBodyItemClass
|
||||
}).append(
|
||||
$('<span>', {
|
||||
text: userData.log.ship.typeName,
|
||||
class: config.systemBodyRightClass
|
||||
})
|
||||
).append(
|
||||
$('<i>', {
|
||||
class: ['fas', 'fa-circle', config.systemBodyItemStatusClass, statusClass].join(' ')
|
||||
})
|
||||
).append(
|
||||
$('<span>', {
|
||||
class: config.systemBodyItemNameClass,
|
||||
text: userName
|
||||
})
|
||||
);
|
||||
|
||||
// user count changed -> change tooltip content
|
||||
systemBody.append(item);
|
||||
}
|
||||
|
||||
// set tooltip color
|
||||
let highlight = '';
|
||||
if(userCounter > oldUserCount){
|
||||
highlight = 'good';
|
||||
}else if(userCounter < oldUserCount){
|
||||
highlight = 'bad';
|
||||
}
|
||||
// user count changed -> change tooltip content
|
||||
let highlight = '';
|
||||
if(userCounter >= oldUserCount){
|
||||
highlight = 'good';
|
||||
}else if(userCounter < oldUserCount){
|
||||
highlight = 'bad';
|
||||
}
|
||||
|
||||
let tooltipOptions = {
|
||||
systemId: systemId,
|
||||
highlight: highlight,
|
||||
userCount: userCounter
|
||||
};
|
||||
let tooltipOptions = {
|
||||
systemId: systemId,
|
||||
highlight: highlight,
|
||||
userCount: userCounter
|
||||
};
|
||||
|
||||
// show system head
|
||||
systemHeadExpand.velocity('stop', true).velocity({
|
||||
width: '10px'
|
||||
},{
|
||||
duration: 50,
|
||||
display: 'inline-block',
|
||||
progress: function(){
|
||||
//re-validate element size and repaint
|
||||
map.revalidate( systemId );
|
||||
},
|
||||
complete: function(){
|
||||
// show system body
|
||||
system.toggleBody(true, map, {complete: function(system){
|
||||
// show system head
|
||||
systemHeadExpand.css('display', 'inline-block');
|
||||
|
||||
// show system body
|
||||
system.toggleBody(true, map, {
|
||||
complete: function(system){
|
||||
// show active user tooltip
|
||||
system.toggleSystemTooltip('show', tooltipOptions);
|
||||
}});
|
||||
}
|
||||
});
|
||||
map.revalidate( systemId );
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}else{
|
||||
// no user data found for this system
|
||||
@@ -247,16 +260,13 @@ define([
|
||||
oldCacheKey &&
|
||||
oldCacheKey.length > 0
|
||||
){
|
||||
// remove tooltip
|
||||
// reset all elements
|
||||
systemCount.empty();
|
||||
system.toggleSystemTooltip('destroy', {});
|
||||
systemHeadExpand.hide();
|
||||
system.toggleBody(false, map, {});
|
||||
|
||||
// no user -> clear SystemBody
|
||||
systemHeadExpand.velocity('stop').velocity('reverse',{
|
||||
display: 'none',
|
||||
complete: function(){
|
||||
system.toggleBody(false, map, {});
|
||||
}
|
||||
});
|
||||
map.revalidate(systemId);
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -305,7 +315,7 @@ define([
|
||||
begin: function(){
|
||||
},
|
||||
progress: function(){
|
||||
// revalidate element size and repaint
|
||||
// re-validate element size and repaint
|
||||
map.revalidate( systemDomId );
|
||||
},
|
||||
complete: function(){
|
||||
@@ -389,6 +399,10 @@ define([
|
||||
$('<span>', {
|
||||
class: systemHeadClasses.join(' '),
|
||||
}).attr('data-value', systemName),
|
||||
// System users count
|
||||
$('<span>', {
|
||||
class: [config.systemHeadCounterClass, Util.config.popoverTriggerClass].join(' ')
|
||||
}),
|
||||
// System locked status
|
||||
$('<i>', {
|
||||
class: ['fas', 'fa-lock', 'fa-fw'].join(' ')
|
||||
@@ -2717,8 +2731,8 @@ define([
|
||||
width: newWidth,
|
||||
'min-width': minWidth + 'px'
|
||||
},{
|
||||
easing: 'easeInOutQuart',
|
||||
duration: 120,
|
||||
easing: 'easeOut',
|
||||
duration: 60,
|
||||
progress: function(){
|
||||
// repaint connections of current system
|
||||
map.revalidate(systemId);
|
||||
@@ -2761,6 +2775,27 @@ define([
|
||||
selector: '.' + config.systemClass + ' .' + config.systemHeadExpandClass
|
||||
});
|
||||
|
||||
// system "active users" popover ------------------------------------------------------------------------------
|
||||
mapContainer.hoverIntent({
|
||||
over: function(e){
|
||||
let counterElement = $(this);
|
||||
let systemElement = counterElement.closest('.' + config.systemClass);
|
||||
let mapId = systemElement.data('mapid');
|
||||
let systemId = systemElement.data('systemId');
|
||||
let userData = Util.getCurrentMapUserData(mapId);
|
||||
let systemUserData = Util.getCharacterDataBySystemId(userData.data.systems, systemId);
|
||||
|
||||
counterElement.addSystemPilotTooltip(systemUserData, {
|
||||
trigger: 'manual',
|
||||
placement: 'right'
|
||||
}).setPopoverSmall().popover('show');
|
||||
},
|
||||
out: function(e){
|
||||
$(this).destroyPopover();
|
||||
},
|
||||
selector: '.' + config.systemHeadCounterClass
|
||||
});
|
||||
|
||||
// system "effect" popover ------------------------------------------------------------------------------------
|
||||
// -> event delegation to system elements, popup only if needed (hover)
|
||||
mapContainer.hoverIntent({
|
||||
@@ -3010,18 +3045,20 @@ define([
|
||||
|
||||
// container must exist! otherwise systems can not be updated
|
||||
if(mapElement !== undefined){
|
||||
|
||||
mapElement = $(mapElement);
|
||||
|
||||
// get current character log data
|
||||
let characterLogExists = false;
|
||||
let currentCharacterLog = Util.getCurrentCharacterLog();
|
||||
|
||||
// check if map is frozen
|
||||
if(mapElement.data('frozen') === true){
|
||||
return returnStatus;
|
||||
}
|
||||
|
||||
// compact/small system layout or not
|
||||
let compactView = mapElement.hasClass(MapUtil.config.mapCompactClass);
|
||||
|
||||
// get current character log data
|
||||
let characterLogExists = false;
|
||||
let currentCharacterLog = Util.getCurrentCharacterLog();
|
||||
|
||||
// data for header update
|
||||
let headerUpdateData = {
|
||||
mapId: userData.config.id,
|
||||
@@ -3089,7 +3126,7 @@ define([
|
||||
}
|
||||
}
|
||||
|
||||
system.updateSystemUserData(map, tempUserData, currentUserIsHere);
|
||||
system.updateSystemUserData(map, tempUserData, currentUserIsHere, {compactView: compactView});
|
||||
}
|
||||
|
||||
// users who are not in any map system --------------------------------------------------------------------
|
||||
@@ -3329,6 +3366,12 @@ define([
|
||||
option: 'mapEndpoint',
|
||||
toggle: false
|
||||
});
|
||||
|
||||
// init compact system UI --------------------------------------------------------------------------
|
||||
mapContainer.triggerMenuEvent('MapOption', {
|
||||
option: 'mapCompact',
|
||||
toggle: false
|
||||
});
|
||||
};
|
||||
|
||||
// show nice visualization effect ---------------------------------------------------------------------
|
||||
|
||||
@@ -360,6 +360,12 @@ define([
|
||||
}
|
||||
}
|
||||
},
|
||||
mapCompact: {
|
||||
title: 'compact layout',
|
||||
trigger: 'active',
|
||||
class: 'pf-map-overlay-compact',
|
||||
iconClass: ['fas', 'fa-fw', 'fa-compress']
|
||||
},
|
||||
connection: {
|
||||
title: 'WH data',
|
||||
trigger: 'hover',
|
||||
|
||||
@@ -21,6 +21,7 @@ define([
|
||||
|
||||
mapClass: 'pf-map', // class for all maps
|
||||
mapGridClass: 'pf-grid-small', // class for map grid snapping
|
||||
mapCompactClass: 'pf-compact', // class for map compact system UI
|
||||
|
||||
systemIdPrefix: 'pf-system-', // id prefix for a system
|
||||
systemClass: 'pf-system', // class for all systems
|
||||
@@ -53,6 +54,11 @@ define([
|
||||
description: 'Endpoint overlay',
|
||||
onEnable: 'showEndpointOverlays', // jQuery extension function
|
||||
onDisable: 'hideEndpointOverlays' // jQuery extension function
|
||||
},
|
||||
mapCompact : {
|
||||
buttonId: Util.config.menuButtonCompactId,
|
||||
description: 'Compact system layout',
|
||||
class: 'mapCompactClass'
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1105,10 +1111,40 @@ define([
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* add system pilot tooltip
|
||||
* @param systemUserData
|
||||
* @param options
|
||||
* @returns {*}
|
||||
*/
|
||||
$.fn.addSystemPilotTooltip = function(systemUserData, options){
|
||||
let content = Util.getSystemPilotsTable(systemUserData);
|
||||
|
||||
let defaultOptions = {
|
||||
placement: 'top',
|
||||
html: true,
|
||||
trigger: 'hover',
|
||||
container: 'body',
|
||||
title: 'Pilots',
|
||||
content: content,
|
||||
delay: {
|
||||
show: 150,
|
||||
hide: 0
|
||||
},
|
||||
};
|
||||
|
||||
options = $.extend({}, defaultOptions, options);
|
||||
|
||||
return this.each(function(){
|
||||
$(this).popover(options);
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* add system effect tooltip
|
||||
* @param security
|
||||
* @param effect
|
||||
* @param options
|
||||
* @returns {*}
|
||||
*/
|
||||
$.fn.addSystemEffectTooltip = function(security, effect, options){
|
||||
|
||||
@@ -345,7 +345,7 @@ define([
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonGridId
|
||||
}).html(' Grid snapping').prepend(
|
||||
}).html(' Grid snapping').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-th fa-fw'
|
||||
})
|
||||
@@ -359,7 +359,7 @@ define([
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonMagnetizerId
|
||||
}).html(' Magnetizing').prepend(
|
||||
}).html(' Magnetizing').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-magnet fa-fw'
|
||||
})
|
||||
@@ -373,7 +373,7 @@ define([
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonEndpointId
|
||||
}).html(' Signatures').prepend(
|
||||
}).html(' Signatures').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-link fa-fw'
|
||||
})
|
||||
@@ -383,6 +383,25 @@ define([
|
||||
toggle: true
|
||||
});
|
||||
})
|
||||
).append(
|
||||
$('<a>', {
|
||||
class: 'list-group-item',
|
||||
id: Util.config.menuButtonCompactId
|
||||
}).html(' Compact').prepend(
|
||||
$('<i>',{
|
||||
class: 'fas fa-compress fa-fw'
|
||||
})
|
||||
).append(
|
||||
$('<span>',{
|
||||
class: 'badge bg-color bg-color-gray txt-color txt-color-warning',
|
||||
text: 'beta'
|
||||
})
|
||||
).on('click', function(){
|
||||
Util.getMapModule().getActiveMap().triggerMenuEvent('MapOption', {
|
||||
option: 'mapCompact',
|
||||
toggle: true
|
||||
});
|
||||
})
|
||||
).append(
|
||||
getMenuHeadline('Help')
|
||||
).append(
|
||||
|
||||
@@ -41,6 +41,7 @@ define([
|
||||
menuButtonMagnetizerId: 'pf-menu-button-magnetizer', // id for menu button "magnetizer"
|
||||
menuButtonGridId: 'pf-menu-button-grid', // id for menu button "grid snap"
|
||||
menuButtonEndpointId: 'pf-menu-button-endpoint', // id for menu button "endpoint" overlays
|
||||
menuButtonCompactId: 'pf-menu-button-compact', // id for menu button "compact" UI map view
|
||||
menuButtonMapDeleteId: 'pf-menu-button-map-delete', // id for menu button "delete map"
|
||||
|
||||
settingsMessageVelocityOptions: {
|
||||
@@ -56,6 +57,9 @@ define([
|
||||
mapWrapperClass: 'pf-map-wrapper', // wrapper div (scrollable)
|
||||
mapClass: 'pf-map' , // class for all maps
|
||||
|
||||
// util
|
||||
userStatusClass: 'pf-user-status', // class for player status
|
||||
|
||||
// select2
|
||||
select2Class: 'pf-select2', // class for all "Select2" <select> elements
|
||||
|
||||
@@ -960,6 +964,21 @@ define([
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* get hash from string
|
||||
* @returns {number}
|
||||
*/
|
||||
String.prototype.hashCode = function() {
|
||||
let hash = 0, i, chr;
|
||||
if (this.length === 0) return hash;
|
||||
for (i = 0; i < this.length; i++) {
|
||||
chr = this.charCodeAt(i);
|
||||
hash = ((hash << 5) - hash) + chr;
|
||||
hash |= 0; // Convert to 32bit integer
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
initPassiveEvents();
|
||||
};
|
||||
|
||||
@@ -1707,6 +1726,51 @@ define([
|
||||
return table;
|
||||
};
|
||||
|
||||
/**
|
||||
* get a HTML table with pilots/ship names
|
||||
* @param users
|
||||
* @returns {string}
|
||||
*/
|
||||
let getSystemPilotsTable = users => {
|
||||
let table = '';
|
||||
if(users.length > 0){
|
||||
|
||||
let getRow = (statusClass, userName, shipName, shipTypeName, mass) => {
|
||||
let row = '<tr>';
|
||||
row += '<td>';
|
||||
row += statusClass !== null ? '<i class="fas fa-circle ' + config.userStatusClass + ' ' + statusClass + '">' : '';
|
||||
row += '</td>';
|
||||
row += '<td>';
|
||||
row += userName;
|
||||
row += '</td>';
|
||||
row += '<td>';
|
||||
row += shipName;
|
||||
row += '</td>';
|
||||
row += '<td class="text-right txt-color txt-color-orangeLight">';
|
||||
row += shipTypeName;
|
||||
row += '</td>';
|
||||
row += '<td class="text-right txt-color">';
|
||||
row += mass;
|
||||
row += '</td>';
|
||||
row += '</tr>';
|
||||
return row;
|
||||
};
|
||||
|
||||
let massAll = 0;
|
||||
table += '<table>';
|
||||
for(let user of users){
|
||||
massAll += parseInt(user.log.ship.mass);
|
||||
let statusClass = getStatusInfoForCharacter(user, 'class');
|
||||
let mass = formatMassValue(user.log.ship.mass);
|
||||
table += getRow(statusClass, user.name, user.log.ship.name, user.log.ship.typeName, mass);
|
||||
}
|
||||
table += getRow(null, '', '', '', formatMassValue(massAll));
|
||||
table += '</table>';
|
||||
}
|
||||
|
||||
return table;
|
||||
};
|
||||
|
||||
/**
|
||||
* get a HTML table with information for multiple systems
|
||||
* e.g. for popover
|
||||
@@ -2174,6 +2238,23 @@ define([
|
||||
return nearBySystems;
|
||||
};
|
||||
|
||||
/**
|
||||
* get userData (pilots) from systemId
|
||||
* @param userData
|
||||
* @param systemId
|
||||
* @returns {*}
|
||||
*/
|
||||
let getCharacterDataBySystemId = (userData, systemId) => {
|
||||
if(userData && userData.length){
|
||||
for(let i = 0; i < userData.length; i++){
|
||||
if(userData[i].id === systemId){
|
||||
return userData[i].user;
|
||||
}
|
||||
}
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
/**
|
||||
* get current character data from all characters who are "nearby" the current user
|
||||
* -> see getNearBySystemData()
|
||||
@@ -2185,20 +2266,11 @@ define([
|
||||
*/
|
||||
let getNearByCharacterData = (nearBySystems, userData, jumps = 0, data = {}) => {
|
||||
|
||||
let getCharacterDataBySystemId = (systemId) => {
|
||||
for(let i = 0; i < userData.length; i++){
|
||||
if(userData[i].id === systemId){
|
||||
return userData[i].user;
|
||||
}
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
let filterFinalCharData = function(tmpFinalCharData){
|
||||
return this.id !== tmpFinalCharData.id;
|
||||
};
|
||||
|
||||
let characterData = getCharacterDataBySystemId(nearBySystems.systemData.systemId);
|
||||
let characterData = getCharacterDataBySystemId(userData, nearBySystems.systemData.systemId);
|
||||
|
||||
if(characterData.length){
|
||||
// filter (remove) characterData for "already" added chars
|
||||
@@ -2659,6 +2731,7 @@ define([
|
||||
getSystemEffectData: getSystemEffectData,
|
||||
getSystemEffectTable: getSystemEffectTable,
|
||||
getSystemPlanetsTable: getSystemPlanetsTable,
|
||||
getSystemPilotsTable: getSystemPilotsTable,
|
||||
getSystemsInfoTable: getSystemsInfoTable,
|
||||
getStatusInfoForCharacter: getStatusInfoForCharacter,
|
||||
getSecurityClassForSystem: getSecurityClassForSystem,
|
||||
@@ -2685,6 +2758,7 @@ define([
|
||||
getCurrentUserInfo: getCurrentUserInfo,
|
||||
getCurrentCharacterLog: getCurrentCharacterLog,
|
||||
flattenXEditableSelectArray: flattenXEditableSelectArray,
|
||||
getCharacterDataBySystemId: getCharacterDataBySystemId,
|
||||
getNearBySystemData: getNearBySystemData,
|
||||
getNearByCharacterData: getNearByCharacterData,
|
||||
setDestination: setDestination,
|
||||
|
||||
@@ -161,7 +161,7 @@
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/login_1.jpg" data-description="Character login" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/login_1.jpg" width="160" height="160" alt="Account settings">
|
||||
</a>
|
||||
@@ -172,7 +172,7 @@
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/taskmanager_1.jpg" width="160" height="160" alt="Task-Manager">
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Pathfinder</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i><span class="txt-color txt-color-greenDark"><e class="fas fa-fw fa-lock"></e>SSL</span> encrypted connection</li>
|
||||
@@ -217,9 +217,9 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/map_2.jpg" data-description="Map selection" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/map_2.jpg" width="160" height="160" alt="Map selection">
|
||||
</a>
|
||||
@@ -231,7 +231,7 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Map module</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Live synchronisation between clients</li>
|
||||
@@ -296,12 +296,11 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/system_1.jpg" data-description="System description" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/system_1.jpg" width="160" height="160" alt="System description">
|
||||
</a>
|
||||
@@ -310,7 +309,7 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>System module</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Quick access to all relevant information</li>
|
||||
@@ -338,9 +337,9 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/signatures_1.jpg" data-description="Signature table" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/signatures_1.jpg" width="160" height="160" alt="Signature table">
|
||||
</a>
|
||||
@@ -349,7 +348,7 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Signature module</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Share system signature information</li>
|
||||
@@ -375,11 +374,10 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/kb_1.jpg" data-description="Killboard diagram" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/kb_1.jpg" width="160" height="160" alt="Killboard diagram">
|
||||
</a>
|
||||
@@ -388,7 +386,7 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Killboard module</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i><em><a target="_blank" href="//github.com/zKillboard/zKillboard/wiki" rel="noopener">zkillboard.com</a></em> API integration</li>
|
||||
@@ -410,9 +408,9 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/route_1.jpg" data-description="Routes table" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/route_1.jpg" width="160" height="160" alt="Routes">
|
||||
</a>
|
||||
@@ -421,7 +419,7 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Route module</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Search for routes between systems</li>
|
||||
@@ -455,18 +453,56 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/connection_1.jpg" data-description="Jump mass log" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/connection_1.jpg" width="160" height="160" alt="Jump mass log">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Mass Log</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Track ship jump mass for wormholes</li>
|
||||
<li><i></i>Compare multiple connections by mass left</li>
|
||||
<li><i></i>Pre-calculate your current ship mass before jumping</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/intel_1.jpg" data-description="Intel structures" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/intel_1.jpg" width="160" height="160" alt="Intel structures">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Intel module <span class="label label-success">new</span></h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Share player owned structure data</li>
|
||||
<li><i></i>Add/Update multiple structures from D-scan: <kbd>ctrl</kbd> + <kbd>c</kbd></li>
|
||||
<li>
|
||||
<ul class="fa-ul">
|
||||
<li><i></i>Map owner information to structures</li>
|
||||
<li><i></i>Add custom notes to structures</li>
|
||||
<li><i></i>Mark structures 'online', 'offline'</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/statistics_1.jpg" data-description="System statistics" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/statistics_1.jpg" width="160" height="160" alt="System statistics">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>System statistics module</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Live in-game system data</li>
|
||||
@@ -480,15 +516,15 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2" id="pf-landing-feature-user-statistics">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2" id="pf-landing-feature-user-statistics">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/statistics_2.jpg" data-description="User statistics" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/statistics_2.jpg" width="160" height="160" alt="User statistics">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>User statistics</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>User activity logging</li>
|
||||
@@ -507,35 +543,16 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/connection_1.jpg" data-description="Jump mass log" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/connection_1.jpg" width="160" height="160" alt="Jump mass log">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<h4>Mass Log  <span class="label label-success">new</span></h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Track ship jump mass for wormholes</li>
|
||||
<li><i></i>Compare multiple connections by mass left</li>
|
||||
<li><i></i>Pre-calculate your current ship mass before jumping</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/log_1.jpg" data-description="Log file viewer" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/log_1.jpg" width="160" height="160" alt="Log file viewer">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Logging</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Separate *.log files per map</li>
|
||||
@@ -549,18 +566,16 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/discord_1.jpg" data-description="Discord/Slack Notification" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/discord_1.jpg" width="160" height="160" alt="DiscordSlack Notification">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<h4>Discord/Slack integration <span class="label label-success">new</span></h4>
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4>Discord/Slack integration</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Send "rally point" push notifications</li>
|
||||
<li>
|
||||
@@ -576,11 +591,6 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row text-center hidden-xs">
|
||||
@@ -708,13 +718,13 @@
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/admin_1.jpg" data-description="Member administration" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/admin_1.jpg" width="160" height="160" alt="Member administration">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4><i class="fas fa-fw fa-users"></i> Member administration</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Manage your corporation members</li>
|
||||
@@ -724,15 +734,15 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate disabled" href="javascript:void(0);" data-description="Database settings" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/wip.jpg" width="160" height="160" alt="WIP">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4><i class="fas fa-fw fa-sitemap"></i> Map settings</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Manage global corporation map settings</li>
|
||||
@@ -773,13 +783,13 @@
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/install_settings.jpg" data-description="Server settings" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/install_settings.jpg" width="160" height="160" alt="Statistics">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4><i class="fas fa-fw fa-server"></i> Requirements check</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Checks your server type/status</li>
|
||||
@@ -793,15 +803,15 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix visible-xs visible-sm visible-md"></div>
|
||||
<div class="clearfix visible-sm"></div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-lg-2">
|
||||
<div class="col-xs-12 col-sm-3 col-md-2 col-lg-2">
|
||||
<a class="pf-animate-on-visible pf-animate" href="public/img/landing/install_db.jpg" data-description="Database settings" data-gallery="#pf-gallery">
|
||||
<img class="pf-landing-image-preview pf-landing-image-preview-small" data-original="public/img/landing/thumbs/install_db.jpg" width="160" height="160" alt="Signature table">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9 col-lg-4">
|
||||
<div class="col-xs-12 col-sm-9 col-md-4 col-lg-4">
|
||||
<h4><i class="fas fa-fw fa-database"></i> Database setup</h4>
|
||||
<ul class="fa-ul pf-landing-list">
|
||||
<li><i></i>Check DB connections</li>
|
||||
|
||||
@@ -314,7 +314,7 @@ $container-tablet: ((720px + $grid-gutter-width));
|
||||
$container-sm: $container-tablet;
|
||||
|
||||
// Medium screen / desktop
|
||||
$container-desktop: ((1040px + $grid-gutter-width));
|
||||
$container-desktop: ((1060px + $grid-gutter-width));
|
||||
//** For `$screen-md-min` and up.
|
||||
$container-md: $container-desktop;
|
||||
|
||||
|
||||
@@ -115,25 +115,28 @@
|
||||
|
||||
a[data-gallery] {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
overflow: hidden; // hide initial overlapping "before" element"
|
||||
margin: 5px 0 15px 0;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.4);
|
||||
|
||||
&:before{
|
||||
content: '\f002';
|
||||
content: '\f06e';
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
line-height: 20px;
|
||||
color: $orange;
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding-top: calc(50% - 10px);
|
||||
z-index: 10;
|
||||
text-align: center;
|
||||
@include transition(transform 0.1s ease-out, opacity 0.1s ease-out);
|
||||
will-change: transform, opacity;
|
||||
transform: scale(1.3,1.3);
|
||||
opacity: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&:hover{
|
||||
@@ -143,7 +146,7 @@
|
||||
}
|
||||
|
||||
&:before{
|
||||
@include transition-delay( 0.1s );
|
||||
@include transition-delay( 0.05s );
|
||||
transform: scale(1,1);
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -155,12 +158,10 @@
|
||||
style: solid;
|
||||
color: $gray-darkest
|
||||
}
|
||||
margin: 5px 0 15px 0;
|
||||
display: inline-block;
|
||||
will-change: all;
|
||||
@include filter(brightness( 100% ));
|
||||
@include transition(all 0.2s ease-out);
|
||||
@include box-shadow(0 4px 10px rgba(0,0,0, 0.4));
|
||||
|
||||
|
||||
&.pf-landing-image-preview-small{
|
||||
|
||||
@@ -327,6 +327,19 @@ $mapWrapperMaxWidth: $mapWidth + 35px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.pf-system-head-counter{
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
min-width: 8px;
|
||||
margin-right: 1px;
|
||||
color: $green;
|
||||
cursor: help;
|
||||
|
||||
&:empty{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.pf-system-effect{
|
||||
font-size: 11px;
|
||||
}
|
||||
@@ -339,6 +352,7 @@ $mapWrapperMaxWidth: $mapWidth + 35px;
|
||||
.pf-system-head-expand{
|
||||
margin-left: 2px;
|
||||
color: $gray-light;
|
||||
width: 10px;
|
||||
display: none; // triggered by JS
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user