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

- condensed layout for wh-effect modal, closed #702

Browse Source
This commit is contained in:
Mark Friedrich
2018-10-11 19:39:54 +02:00
parent 2de060c902
commit 95222c309c
19 changed files with 157 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
js/app/logging.js
View File

@@ -20,7 +20,6 @@ define([
let config = {
taskDialogId: 'pf-task-dialog', // id for map "task manager" dialog
dialogDynamicAreaClass: 'pf-dynamic-area', // class for dynamic areas
timestampCounterClass: 'pf-timestamp-counter', // class for "timestamp" counter
taskDialogStatusAreaClass: 'pf-task-dialog-status', // class for "status" dynamic area
taskDialogLogTableAreaClass: 'pf-task-dialog-table', // class for "log table" dynamic area
@@ -83,7 +82,7 @@ define([
requirejs(['text!templates/dialog/task_manager.html', 'mustache', 'datatables.loader'], function(templateTaskManagerDialog, Mustache){
let data = {
id: config.taskDialogId,
dialogDynamicAreaClass: config.dialogDynamicAreaClass,
dialogDynamicAreaClass: Util.config.dynamicAreaClass,
taskDialogStatusAreaClass: config.taskDialogStatusAreaClass,
taskDialogLogTableAreaClass: config.taskDialogLogTableAreaClass
};
@@ -218,7 +217,7 @@ define([
});
let graphArea = $('<div>', {
class: config.dialogDynamicAreaClass
class: Util.config.dynamicAreaClass
}).append( graphElement );
let headline = $('<h4>', {

4
js/app/login.js
View File

@@ -582,7 +582,7 @@ define([
* update all character panels -> set CSS class (e.g. after some panels were added/removed,..)
*/
let updateCharacterPanels = function(){
let characterRows = $('.' + config.characterSelectionClass + ' .pf-dynamic-area').parent();
let characterRows = $('.' + config.characterSelectionClass + ' .' + Util.config.dynamicAreaClass).parent();
let rowClassIdentifier = ((12 / characterRows.length ) <= 3) ? 3 : (12 / characterRows.length);
$(characterRows).removeClass().addClass('col-sm-' + rowClassIdentifier);
};
@@ -635,7 +635,7 @@ define([
// request character data for each character panel
requirejs(['text!templates/ui/character_panel.html', 'mustache'], function(template, Mustache){
$('.' + config.characterSelectionClass + ' .pf-dynamic-area').each(function(){
$('.' + config.characterSelectionClass + ' .' + Util.config.dynamicAreaClass).each(function(){
let characterElement = $(this);
characterElement.showLoadingAnimation();

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

@@ -22,7 +22,7 @@ define([
* show jump info dialog
*/
$.fn.showJumpInfoDialog = function(){
requirejs(['text!templates/dialog/jump_info.html', 'mustache'], (template, Mustache) => {
requirejs(['text!templates/dialog/jump_info.html', 'mustache', 'datatables.loader'], (template, Mustache) => {
let data = {
config: config,
wormholes: Object.keys(Init.wormholes).map(function(k){ return Init.wormholes[k]; }), // convert Json to array

10
js/app/ui/dialog/stats.js
View File

@@ -404,7 +404,7 @@ define([
*/
let getStatsData = function(requestData, context){
context.dynamicArea = $('#' + config.statsContainerId + ' .pf-dynamic-area');
context.dynamicArea = $('#' + config.statsContainerId + ' .' + Util.config.dynamicAreaClass);
context.dynamicArea.showLoadingAnimation();
$.ajax({
@@ -806,13 +806,7 @@ define([
title: 'Statistics',
message: content,
size: 'large',
show: false,
buttons: {
close: {
label: 'close',
className: 'btn-default'
}
}
show: false
});
// model events

89
js/app/ui/dialog/system_effects.js
View File

@@ -2,7 +2,6 @@
* system effects dialog
*/
define([
'jquery',
'app/init',
@@ -10,12 +9,12 @@ define([
'app/render',
'bootbox',
'app/map/util'
], function($, Init, Util, Render, bootbox, MapUtil){
], ($, Init, Util, Render, bootbox, MapUtil) => {
'use strict';
let config = {
// system effect dialog
systemEffectDialogWrapperClass: 'pf-system-effect-dialog-wrapper' // class for system effect dialog
systemEffectDialogClass: 'pf-system-effect-dialog' // class for system effect dialog
};
let cache = {
@@ -26,20 +25,20 @@ define([
* show system effect dialog
*/
$.fn.showSystemEffectInfoDialog = function(){
requirejs(['datatables.loader'], () => {
// cache table structure
if(!cache.systemEffectDialog){
let dialogWrapperElement = $('<div>', {
class: config.systemEffectDialogWrapperClass
let rowElement = $('<div>', {
class: 'row'
});
let systemEffectData = Util.getSystemEffectData();
$.each( systemEffectData.wh, function(effectName, effectData ){
let colCount = 0;
for(let [effectName, effectData] of Object.entries(systemEffectData.wh)){
colCount++;
let table = $('<table>', {
class: ['table', 'table-condensed'].join(' ')
class: 'compact stripe order-column row-border'
});
let tbody = $('<tbody>');
@@ -51,8 +50,7 @@ define([
let systemEffectName = MapUtil.getEffectInfoForSystem(effectName, 'name');
let systemEffectClass = MapUtil.getEffectInfoForSystem(effectName, 'class');
$.each( effectData, function(areaId, areaData ){
for(let [areaId, areaData] of Object.entries(effectData)){
let systemType = 'C' + areaId;
let securityClass = Util.getSecurityClassForSystem( systemType );
@@ -61,20 +59,20 @@ define([
thead.append( rows[0] );
rows[0].append(
$('<td>').html('&nbsp;&nbsp;' + systemEffectName).prepend(
$('<th>').html('&nbsp;&nbsp;' + systemEffectName).prepend(
$('<i>', {
class: ['fas', 'fa-square', 'fa-fw', systemEffectClass].join(' ')
class: ['fas', 'fa-square', systemEffectClass].join(' ')
})
)
);
}
rows[0].append( $('<td>', {
rows[0].append( $('<th>', {
class: ['text-right', 'col-xs-1', securityClass].join(' ')
}).text( systemType ));
$.each( areaData, function(i, data ){
for(let [i, data] of Object.entries(areaData)){
i = parseInt(i);
if(areaId === '1'){
rows.push( $('<tr>') );
tbody.append(rows[i + 1]);
@@ -87,21 +85,60 @@ define([
rows[i + 1].append( $('<td>', {
class: 'text-right'
}).text( data.value ));
});
}
}
let colElement = $('<div>', {
class: ['col-md-6'].join(' ')
}).append(
$('<div>', {
class: [Util.config.dynamicAreaClass].join(' ')
}).append(
table.append(thead).append(tbody)
)
);
});
rowElement.append(colElement);
dialogWrapperElement.append(table.append(thead).append(tbody));
// add clearfix after even col count
if(colCount % 2 === 0){
rowElement.append(
$('<div>', {
class: ['clearfix', 'visible-md', 'visible-lg'].join(' ')
})
);
}
cache.systemEffectDialog = dialogWrapperElement;
cache.systemEffectDialog = rowElement;
}
let effectsDialog = bootbox.dialog({
className: config.systemEffectDialogClass,
title: 'System effect information',
message: cache.systemEffectDialog,
size: 'large',
show: false
});
}
bootbox.dialog({
title: 'System effect information',
message: cache.systemEffectDialog
effectsDialog.on('show.bs.modal', function(e){
$(this).find('table').DataTable({
pageLength: -1,
paging: false,
lengthChange: false,
ordering: false,
searching: false,
info: false,
columnDefs: [],
data: null // use DOM data overwrites [] default -> data.loader.js
});
});
effectsDialog.on('hide.bs.modal', function(e){
// destroy logTable
$(this).find('table').DataTable().destroy(true);
});
effectsDialog.modal('show');
});
};
});

5
js/app/ui/module/connection_info.js
View File

@@ -30,7 +30,6 @@ define([
connectionInfoPanelClass: 'pf-connection-info-panel', // class for connection info panels
connectionInfoPanelId: 'pf-connection-info-panel-', // id prefix for connection info panels
dynamicAreaClass: 'pf-dynamic-area', // class for "dynamic" areas
controlAreaClass: 'pf-module-control-area', // class for "control" areas
// info table
@@ -110,7 +109,7 @@ define([
*/
let getInfoPanelControl = (mapId) => {
let connectionElement = getConnectionElement(mapId, 0).append($('<div>', {
class: [config.dynamicAreaClass, config.controlAreaClass].join(' '),
class: [Util.config.dynamicAreaClass, config.controlAreaClass].join(' '),
html: '<i class="fas fa-fw fa-plus"></i>&nbsp;add connection&nbsp;&nbsp;<kbd>ctrl</kbd>&nbsp;+&nbsp;<kbd>click</kbd>'
}));
@@ -128,7 +127,7 @@ define([
let scopeLabel = MapUtil.getScopeInfoForConnection(connectionData.scope, 'label');
let element = $('<div>', {
class: [config.dynamicAreaClass, config.controlAreaClass].join(' ')
class: [Util.config.dynamicAreaClass, config.controlAreaClass].join(' ')
}).append(
$('<table>', {
class: ['table', 'table-condensed', 'pf-table-fixed', config.moduleTableClass].join(' ')

3
js/app/ui/module/system_killboard.js
View File

@@ -32,7 +32,6 @@ define([
systemKillboardListImgCorp: 'pf-system-killboard-img-corp', // class for all corp logos
labelRecentKillsClass: 'pf-system-killboard-label-recent', // class for "recent kills" label
dynamicAreaClass: 'pf-dynamic-area', // class for "dynamic" areas
controlAreaClass: 'pf-module-control-area', // class for "control" areas
minCountKills: 5,
@@ -292,7 +291,7 @@ define([
*/
let getControlElement = () => {
let controlElement = $('<div>', {
class: [config.dynamicAreaClass, config.controlAreaClass, config.moduleHeadlineIconClass].join(' '),
class: [Util.config.dynamicAreaClass, config.controlAreaClass, config.moduleHeadlineIconClass].join(' '),
html: '<i class="fas fa-sync"></i>&nbsp;&nbsp;load more'
});
return controlElement;

3
js/app/util.js
View File

@@ -65,7 +65,8 @@ define([
mapClass: 'pf-map' , // class for all maps
// util
userStatusClass: 'pf-user-status', // class for player status
userStatusClass: 'pf-user-status', // class for player status
dynamicAreaClass: 'pf-dynamic-area', // class for "dynamic" areas
// select2
select2Class: 'pf-select2', // class for all "Select2" <select> elements

2
public/css/v1.4.3/pathfinder.css
View File

File diff suppressed because one or more lines are too long

2
public/css/v1.4.3/pathfinder.css.map
View File

File diff suppressed because one or more lines are too long

5
public/js/v1.4.3/app/logging.js
View File

@@ -20,7 +20,6 @@ define([
let config = {
taskDialogId: 'pf-task-dialog', // id for map "task manager" dialog
dialogDynamicAreaClass: 'pf-dynamic-area', // class for dynamic areas
timestampCounterClass: 'pf-timestamp-counter', // class for "timestamp" counter
taskDialogStatusAreaClass: 'pf-task-dialog-status', // class for "status" dynamic area
taskDialogLogTableAreaClass: 'pf-task-dialog-table', // class for "log table" dynamic area
@@ -83,7 +82,7 @@ define([
requirejs(['text!templates/dialog/task_manager.html', 'mustache', 'datatables.loader'], function(templateTaskManagerDialog, Mustache){
let data = {
id: config.taskDialogId,
dialogDynamicAreaClass: config.dialogDynamicAreaClass,
dialogDynamicAreaClass: Util.config.dynamicAreaClass,
taskDialogStatusAreaClass: config.taskDialogStatusAreaClass,
taskDialogLogTableAreaClass: config.taskDialogLogTableAreaClass
};
@@ -218,7 +217,7 @@ define([
});
let graphArea = $('<div>', {
class: config.dialogDynamicAreaClass
class: Util.config.dynamicAreaClass
}).append( graphElement );
let headline = $('<h4>', {

4
public/js/v1.4.3/app/login.js
View File

@@ -582,7 +582,7 @@ define([
* update all character panels -> set CSS class (e.g. after some panels were added/removed,..)
*/
let updateCharacterPanels = function(){
let characterRows = $('.' + config.characterSelectionClass + ' .pf-dynamic-area').parent();
let characterRows = $('.' + config.characterSelectionClass + ' .' + Util.config.dynamicAreaClass).parent();
let rowClassIdentifier = ((12 / characterRows.length ) <= 3) ? 3 : (12 / characterRows.length);
$(characterRows).removeClass().addClass('col-sm-' + rowClassIdentifier);
};
@@ -635,7 +635,7 @@ define([
// request character data for each character panel
requirejs(['text!templates/ui/character_panel.html', 'mustache'], function(template, Mustache){
$('.' + config.characterSelectionClass + ' .pf-dynamic-area').each(function(){
$('.' + config.characterSelectionClass + ' .' + Util.config.dynamicAreaClass).each(function(){
let characterElement = $(this);
characterElement.showLoadingAnimation();

2
public/js/v1.4.3/app/ui/dialog/jump_info.js
View File

@@ -22,7 +22,7 @@ define([
* show jump info dialog
*/
$.fn.showJumpInfoDialog = function(){
requirejs(['text!templates/dialog/jump_info.html', 'mustache'], (template, Mustache) => {
requirejs(['text!templates/dialog/jump_info.html', 'mustache', 'datatables.loader'], (template, Mustache) => {
let data = {
config: config,
wormholes: Object.keys(Init.wormholes).map(function(k){ return Init.wormholes[k]; }), // convert Json to array

10
public/js/v1.4.3/app/ui/dialog/stats.js
View File

@@ -404,7 +404,7 @@ define([
*/
let getStatsData = function(requestData, context){
context.dynamicArea = $('#' + config.statsContainerId + ' .pf-dynamic-area');
context.dynamicArea = $('#' + config.statsContainerId + ' .' + Util.config.dynamicAreaClass);
context.dynamicArea.showLoadingAnimation();
$.ajax({
@@ -806,13 +806,7 @@ define([
title: 'Statistics',
message: content,
size: 'large',
show: false,
buttons: {
close: {
label: 'close',
className: 'btn-default'
}
}
show: false
});
// model events

89
public/js/v1.4.3/app/ui/dialog/system_effects.js
View File

@@ -2,7 +2,6 @@
* system effects dialog
*/
define([
'jquery',
'app/init',
@@ -10,12 +9,12 @@ define([
'app/render',
'bootbox',
'app/map/util'
], function($, Init, Util, Render, bootbox, MapUtil){
], ($, Init, Util, Render, bootbox, MapUtil) => {
'use strict';
let config = {
// system effect dialog
systemEffectDialogWrapperClass: 'pf-system-effect-dialog-wrapper' // class for system effect dialog
systemEffectDialogClass: 'pf-system-effect-dialog' // class for system effect dialog
};
let cache = {
@@ -26,20 +25,20 @@ define([
* show system effect dialog
*/
$.fn.showSystemEffectInfoDialog = function(){
requirejs(['datatables.loader'], () => {
// cache table structure
if(!cache.systemEffectDialog){
let dialogWrapperElement = $('<div>', {
class: config.systemEffectDialogWrapperClass
let rowElement = $('<div>', {
class: 'row'
});
let systemEffectData = Util.getSystemEffectData();
$.each( systemEffectData.wh, function(effectName, effectData ){
let colCount = 0;
for(let [effectName, effectData] of Object.entries(systemEffectData.wh)){
colCount++;
let table = $('<table>', {
class: ['table', 'table-condensed'].join(' ')
class: 'compact stripe order-column row-border'
});
let tbody = $('<tbody>');
@@ -51,8 +50,7 @@ define([
let systemEffectName = MapUtil.getEffectInfoForSystem(effectName, 'name');
let systemEffectClass = MapUtil.getEffectInfoForSystem(effectName, 'class');
$.each( effectData, function(areaId, areaData ){
for(let [areaId, areaData] of Object.entries(effectData)){
let systemType = 'C' + areaId;
let securityClass = Util.getSecurityClassForSystem( systemType );
@@ -61,20 +59,20 @@ define([
thead.append( rows[0] );
rows[0].append(
$('<td>').html('&nbsp;&nbsp;' + systemEffectName).prepend(
$('<th>').html('&nbsp;&nbsp;' + systemEffectName).prepend(
$('<i>', {
class: ['fas', 'fa-square', 'fa-fw', systemEffectClass].join(' ')
class: ['fas', 'fa-square', systemEffectClass].join(' ')
})
)
);
}
rows[0].append( $('<td>', {
rows[0].append( $('<th>', {
class: ['text-right', 'col-xs-1', securityClass].join(' ')
}).text( systemType ));
$.each( areaData, function(i, data ){
for(let [i, data] of Object.entries(areaData)){
i = parseInt(i);
if(areaId === '1'){
rows.push( $('<tr>') );
tbody.append(rows[i + 1]);
@@ -87,21 +85,60 @@ define([
rows[i + 1].append( $('<td>', {
class: 'text-right'
}).text( data.value ));
});
}
}
let colElement = $('<div>', {
class: ['col-md-6'].join(' ')
}).append(
$('<div>', {
class: [Util.config.dynamicAreaClass].join(' ')
}).append(
table.append(thead).append(tbody)
)
);
});
rowElement.append(colElement);
dialogWrapperElement.append(table.append(thead).append(tbody));
// add clearfix after even col count
if(colCount % 2 === 0){
rowElement.append(
$('<div>', {
class: ['clearfix', 'visible-md', 'visible-lg'].join(' ')
})
);
}
cache.systemEffectDialog = dialogWrapperElement;
cache.systemEffectDialog = rowElement;
}
let effectsDialog = bootbox.dialog({
className: config.systemEffectDialogClass,
title: 'System effect information',
message: cache.systemEffectDialog,
size: 'large',
show: false
});
}
bootbox.dialog({
title: 'System effect information',
message: cache.systemEffectDialog
effectsDialog.on('show.bs.modal', function(e){
$(this).find('table').DataTable({
pageLength: -1,
paging: false,
lengthChange: false,
ordering: false,
searching: false,
info: false,
columnDefs: [],
data: null // use DOM data overwrites [] default -> data.loader.js
});
});
effectsDialog.on('hide.bs.modal', function(e){
// destroy logTable
$(this).find('table').DataTable().destroy(true);
});
effectsDialog.modal('show');
});
};
});

5
public/js/v1.4.3/app/ui/module/connection_info.js
View File

@@ -30,7 +30,6 @@ define([
connectionInfoPanelClass: 'pf-connection-info-panel', // class for connection info panels
connectionInfoPanelId: 'pf-connection-info-panel-', // id prefix for connection info panels
dynamicAreaClass: 'pf-dynamic-area', // class for "dynamic" areas
controlAreaClass: 'pf-module-control-area', // class for "control" areas
// info table
@@ -110,7 +109,7 @@ define([
*/
let getInfoPanelControl = (mapId) => {
let connectionElement = getConnectionElement(mapId, 0).append($('<div>', {
class: [config.dynamicAreaClass, config.controlAreaClass].join(' '),
class: [Util.config.dynamicAreaClass, config.controlAreaClass].join(' '),
html: '<i class="fas fa-fw fa-plus"></i>&nbsp;add connection&nbsp;&nbsp;<kbd>ctrl</kbd>&nbsp;+&nbsp;<kbd>click</kbd>'
}));
@@ -128,7 +127,7 @@ define([
let scopeLabel = MapUtil.getScopeInfoForConnection(connectionData.scope, 'label');
let element = $('<div>', {
class: [config.dynamicAreaClass, config.controlAreaClass].join(' ')
class: [Util.config.dynamicAreaClass, config.controlAreaClass].join(' ')
}).append(
$('<table>', {
class: ['table', 'table-condensed', 'pf-table-fixed', config.moduleTableClass].join(' ')

3
public/js/v1.4.3/app/ui/module/system_killboard.js
View File

@@ -32,7 +32,6 @@ define([
systemKillboardListImgCorp: 'pf-system-killboard-img-corp', // class for all corp logos
labelRecentKillsClass: 'pf-system-killboard-label-recent', // class for "recent kills" label
dynamicAreaClass: 'pf-dynamic-area', // class for "dynamic" areas
controlAreaClass: 'pf-module-control-area', // class for "control" areas
minCountKills: 5,
@@ -292,7 +291,7 @@ define([
*/
let getControlElement = () => {
let controlElement = $('<div>', {
class: [config.dynamicAreaClass, config.controlAreaClass, config.moduleHeadlineIconClass].join(' '),
class: [Util.config.dynamicAreaClass, config.controlAreaClass, config.moduleHeadlineIconClass].join(' '),
html: '<i class="fas fa-sync"></i>&nbsp;&nbsp;load more'
});
return controlElement;

3
public/js/v1.4.3/app/util.js
View File

@@ -65,7 +65,8 @@ define([
mapClass: 'pf-map' , // class for all maps
// util
userStatusClass: 'pf-user-status', // class for player status
userStatusClass: 'pf-user-status', // class for player status
dynamicAreaClass: 'pf-dynamic-area', // class for "dynamic" areas
// select2
select2Class: 'pf-select2', // class for all "Select2" <select> elements

11
sass/layout/_main.scss
View File

@@ -1018,12 +1018,11 @@ table{
}
// system effect info dialog ======================================================================
.pf-system-effect-dialog-wrapper, .pf-jump-info-dialog{
.table{
margin: 15px 0;
td{
text-transform: capitalize;
.pf-system-effect-dialog{
.clearfix + .col-md-6{
margin-top: 10px;
+ .col-md-6{
margin-top: 10px;
}
}
}