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

- improved "system effect" dialog, column hover style added

Browse Source 
- fixed an issue in "connection module" where wh type changes not affect the UI
This commit is contained in:
Mark Friedrich
2018-11-30 21:49:08 +01:00
parent 0e7008e72e
commit 1a1fabf361
10 changed files with 153 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -14,7 +14,9 @@ define([
let config = {
// system effect dialog
systemEffectDialogClass: 'pf-system-effect-dialog' // class for system effect dialog
systemEffectDialogClass: 'pf-system-effect-dialog', // class for system effect dialog
systemEffectTableClass: 'pf-system-effect-table' // Table class for effect tables
};
let cache = {
@@ -33,12 +35,15 @@ define([
let systemEffectData = Util.getSystemEffectData();
// last active (hover) table columnIndex
let lastActiveColIndex = null;
let colCount = 0;
for(let [effectName, effectData] of Object.entries(systemEffectData.wh)){
colCount++;
let table = $('<table>', {
class: 'compact stripe order-column row-border'
class: ['compact', 'stripe', 'order-column', 'row-border', config.systemEffectTableClass].join(' ')
});
let tbody = $('<tbody>');
@@ -121,7 +126,15 @@ define([
});
effectsDialog.on('show.bs.modal', function(e){
$(this).find('table').DataTable({
let headerAll = $();
let columnsAll = $();
let removeColumnHighlight = () => {
headerAll.removeClass('colHighlight');
columnsAll.removeClass('colHighlight');
};
let tableApis = $(this).find('table').DataTable({
pageLength: -1,
paging: false,
lengthChange: false,
@@ -129,8 +142,40 @@ define([
searching: false,
info: false,
columnDefs: [],
data: null // use DOM data overwrites [] default -> data.loader.js
data: null, // use DOM data overwrites [] default -> data.loader.js
initComplete: function(settings, json){
let tableApi = this.api();
tableApi.tables().nodes().to$().on('mouseover', 'td', function(){
// inside table cell -> get current hover colIndex
let colIndex = tableApi.cell(this).index().column;
if(colIndex !== lastActiveColIndex){
removeColumnHighlight();
lastActiveColIndex = colIndex;
if(colIndex > 0){
// active column changed -> highlight same colIndex on other tables
let tableApis = $.fn.dataTable.tables({ visible: false, api: true })
.tables('.' + config.systemEffectTableClass);
let columns = tableApis.columns(colIndex);
columns.header().flatten().to$().addClass('colHighlight');
columns.nodes().flatten().to$().addClass('colHighlight');
}
}
}).on('mouseleave', function(){
// no longer inside table
lastActiveColIndex = null;
removeColumnHighlight();
});
}
});
// table cells will not change so we should cache them once
headerAll = tableApis.columns().header().to$();
columnsAll = tableApis.cells().nodes().to$();
});
effectsDialog.on('hide.bs.modal', function(e){

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

@@ -533,6 +533,7 @@ define([
// copy some missing data
connectionsData[i].character = newConnectionData.character;
connectionsData[i].created = newConnectionData.created;
connectionsData[i].type = newConnectionData.type;
// check for mass logs and copy data
if(newConnectionData.logs && newConnectionData.logs.length){
connectionsData[i].logs = newConnectionData.logs;

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

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

@@ -14,7 +14,9 @@ define([
let config = {
// system effect dialog
systemEffectDialogClass: 'pf-system-effect-dialog' // class for system effect dialog
systemEffectDialogClass: 'pf-system-effect-dialog', // class for system effect dialog
systemEffectTableClass: 'pf-system-effect-table' // Table class for effect tables
};
let cache = {
@@ -33,12 +35,15 @@ define([
let systemEffectData = Util.getSystemEffectData();
// last active (hover) table columnIndex
let lastActiveColIndex = null;
let colCount = 0;
for(let [effectName, effectData] of Object.entries(systemEffectData.wh)){
colCount++;
let table = $('<table>', {
class: 'compact stripe order-column row-border'
class: ['compact', 'stripe', 'order-column', 'row-border', config.systemEffectTableClass].join(' ')
});
let tbody = $('<tbody>');
@@ -121,7 +126,15 @@ define([
});
effectsDialog.on('show.bs.modal', function(e){
$(this).find('table').DataTable({
let headerAll = $();
let columnsAll = $();
let removeColumnHighlight = () => {
headerAll.removeClass('colHighlight');
columnsAll.removeClass('colHighlight');
};
let tableApis = $(this).find('table').DataTable({
pageLength: -1,
paging: false,
lengthChange: false,
@@ -129,8 +142,40 @@ define([
searching: false,
info: false,
columnDefs: [],
data: null // use DOM data overwrites [] default -> data.loader.js
data: null, // use DOM data overwrites [] default -> data.loader.js
initComplete: function(settings, json){
let tableApi = this.api();
tableApi.tables().nodes().to$().on('mouseover', 'td', function(){
// inside table cell -> get current hover colIndex
let colIndex = tableApi.cell(this).index().column;
if(colIndex !== lastActiveColIndex){
removeColumnHighlight();
lastActiveColIndex = colIndex;
if(colIndex > 0){
// active column changed -> highlight same colIndex on other tables
let tableApis = $.fn.dataTable.tables({ visible: false, api: true })
.tables('.' + config.systemEffectTableClass);
let columns = tableApis.columns(colIndex);
columns.header().flatten().to$().addClass('colHighlight');
columns.nodes().flatten().to$().addClass('colHighlight');
}
}
}).on('mouseleave', function(){
// no longer inside table
lastActiveColIndex = null;
removeColumnHighlight();
});
}
});
// table cells will not change so we should cache them once
headerAll = tableApis.columns().header().to$();
columnsAll = tableApis.cells().nodes().to$();
});
effectsDialog.on('hide.bs.modal', function(e){

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

@@ -533,6 +533,7 @@ define([
// copy some missing data
connectionsData[i].character = newConnectionData.character;
connectionsData[i].created = newConnectionData.created;
connectionsData[i].type = newConnectionData.type;
// check for mass logs and copy data
if(newConnectionData.logs && newConnectionData.logs.length){
connectionsData[i].logs = newConnectionData.logs;

8
public/templates/ui/notice.html
View File

@@ -7,12 +7,8 @@
<div class="panel-body no-padding text-align-center">
<div class="price-features" style="min-height: inherit;">
<ul class="list-unstyled text-left">
<li><i class="fas fa-fw fa-angle-right"></i>New HTML editor for system description <a target="_blank" href="//github.com/exodus4d/pathfinder/issues/698" rel="noopener">#698</a></li>
<li><i class="fas fa-fw fa-angle-right"></i>New preview data section added to "new system" dialog <a target="_blank" href="//github.com/exodus4d/pathfinder/issues/662" rel="noopener">#662</a></li>
<li><i class="fas fa-fw fa-angle-right"></i>Fixed bugs with the signature table
<a target="_blank" href="//github.com/exodus4d/pathfinder/issues/690" rel="noopener">#690</a>,
<a target="_blank" href="//github.com/exodus4d/pathfinder/issues/691" rel="noopener">#691</a>
</li>
<li><i class="fas fa-fw fa-angle-right"></i>New custom/editable jump log information <a target="_blank" href="//github.com/exodus4d/pathfinder/issues/709" rel="noopener">#709</a></li>
<li><i class="fas fa-fw fa-angle-right"></i>New wormhole <em>color codes</em> added to signature table <a target="_blank" href="//github.com/exodus4d/pathfinder/issues/703" rel="noopener">#703</a></li>
<li><i class="fas fa-fw fa-angle-double-right"></i>Many more improvements/fixes. Complete <a href="javascript:void(0)" class="pf-navbar-version-info">changelog</a></li>
</ul>
</div>

6
sass/layout/_dialogs.scss
View File

@@ -244,6 +244,12 @@
}
}
// system effect dialog =======================================================
.pf-system-effect-dialog{
.dataTable{
border-collapse: collapse; // required vor column highlight (hover) -> prevents jumping when border gets attached
}
}
// credits dialog =============================================================
.pf-credits-dialog{
.pf-credits-logo-background{

23
sass/layout/_landing.scss
View File

@@ -433,8 +433,23 @@
background-image: url("#{$base-url}/landing/eve_sso_login_buttons_large_black_hover.png");
cursor: pointer;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
@include transition(box-shadow 0.12s ease-out);
will-change: box-shadow;
&:before{
content: ' ';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
/* Create the box shadow at expanded size. */
box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
/* Hidden by default. */
opacity: 0;
@include transition(opacity 0.12s ease-in-out);
will-change: opacity;
}
&:after {
content: ' ';
@@ -449,7 +464,9 @@
}
&:hover {
box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
&:before{
opacity: 1;
}
&:after{
opacity: 0;

23
sass/layout/_main.scss
View File

@@ -486,6 +486,29 @@ select:active, select:hover {
}
}
// column highlight cell class
thead{
th.colHighlight{
border-bottom: 1px solid $orange-dark;
}
}
tbody{
td.colHighlight{
border-left: 1px solid $orange-dark;
border-right: 1px solid $orange-dark;
background-color: rgba($orange-dark, .08);
}
tr:first-child td.colHighlight{
border-top: 1px solid $orange-dark;
}
tr:last-child td.colHighlight{
border-bottom: 1px solid $orange-dark;
}
}
}
// table styles ===================================================================================