- Upgraded "[_Morris.js_](https://github.com/pierresh/morris.js)" js lib v0.5.1v0.6.4

- Fixed some UI issues mapped systems that have active pilots in
- Fixed some memory leaks where Charts don´t get destroyed properly
This commit is contained in:
Mark Friedrich
2020-03-04 18:44:22 +01:00
parent a5f29ee2eb
commit c9b2215a19
19 changed files with 398 additions and 138 deletions

View File

@@ -40,8 +40,8 @@ requirejs.config({
customScrollbar: 'lib/jquery.mCustomScrollbar.min', // v3.1.5 Custom scroll bars - http://manos.malihu.gr
mousewheel: 'lib/jquery.mousewheel.min', // v3.1.13 Mousewheel - https://github.com/jquery/jquery-mousewheel
xEditable: 'lib/bootstrap-editable.min', // v1.5.1 X-editable - in placed editing
morris: 'lib/morris.min', // v0.5.1 Morris.js - graphs and charts
raphael: 'lib/raphael.min', // v2.2.8 Raphaël - required for morris - https://dmitrybaranovskiy.github.io/raphael
morris: 'lib/morris.min', // v0.6.4 Morris.js - graphs and charts - https://github.com/pierresh/morris.js
raphael: 'lib/raphael.min', // v2.3.0 Raphaël - required for morris - https://dmitrybaranovskiy.github.io/raphael
bootbox: 'lib/bootbox.min', // v5.2.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.3.0 Inline Chart - http://benpickles.github.io/peity/

92
js/app/lib/resize.js Normal file
View File

@@ -0,0 +1,92 @@
define([], () => {
'use strict';
class ResizeManager {
constructor(config = {}) {
this._config = Object.assign({}, ResizeManager.defaultConfig, config);
this._observables = new WeakMap();
this._observer = new ResizeObserver((entries, observer) => { // jshint ignore:line
for (let entry of entries) {
if (this._observables.has(entry.target)) {
this._observables
.get(entry.target)
.callback(entry.target, entry.contentRect);
} else {
this._observer.unobserve(entry.target);
}
}
});
}
debounce(callback, ms = this._config.msDebounce, immediate = false) {
let timer;
return (...args) => {
let later = () => {
timer = null;
if (!immediate) callback(...args);
};
let callNow = immediate && !timer;
clearTimeout(timer);
timer = setTimeout(later, ms);
if (callNow) callback(...args);
};
}
throttle(callback, ms = this._config.msThrottle) {
let lastFunc;
let lastRan;
return function (...args) {
if (!lastRan) {
callback(...args);
lastRan = Date.now();
} else {
clearTimeout(lastFunc);
lastFunc = setTimeout(() => {
if (Date.now() - lastRan >= ms) {
callback(...args);
lastRan = Date.now();
}
}, ms - (Date.now() - lastRan));
}
};
}
observe(target, callback, config = {}, options = ResizeManager.observeOptions) {
if (!this._observables.has(target)) {
if (config.hasOwnProperty('debounce')) {
let {ms, immediate} = config;
callback = this.debounce(callback, ms, immediate);
}
if (config.hasOwnProperty('throttle')) {
let {ms} = config;
callback = this.throttle(callback, ms);
}
this._observables.set(target, {callback});
this._observer.observe(target, options);
}
}
unobserve(target) {
this._observer.unobserve(target);
this._observables.delete(target);
}
disconnect() {
this._observer.disconnect();
this._observables = new WeakMap();
}
}
ResizeManager.observeOptions = {
box: 'border-box' // sets which box model the observer will observe changes to
};
ResizeManager.defaultConfig = {
msDebounce: 250, // setTimeout for debounced calls
msThrottle: 100 // setTimeout for throttled calls
};
return new ResizeManager();
});

View File

@@ -7,7 +7,8 @@ define([
'app/init',
'app/util',
'app/counter',
'bootbox'
'bootbox',
'app/lib/resize'
], ($, Init, Util, Counter, bootbox) => {
'use strict';
@@ -283,52 +284,61 @@ define([
xkey: 'x',
ykeys: ['y'],
labels: [key],
units: 'ms',
parseTime: false,
ymin: 0,
yLabelFormat: labelYFormat,
padding: 8,
hideHover: true,
pointSize: 2.5,
lineColors: ['#375959'],
lineWidth: 2,
pointSize: 3,
pointFillColors: ['#477372'],
pointStrokeColors: ['#313335'],
lineWidth: 1.5,
grid: true,
gridStrokeWidth: 0.3,
gridTextSize: 9,
gridTextFamily: 'Oxygen Bold',
gridTextColor: '#63676a',
behaveLikeLine: false,
ymin: 0,
smooth: false,
hideHover: true,
parseTime: false,
postUnits: 'ms',
yLabelFormat: labelYFormat,
goals: [],
goalStrokeWidth: 1,
goalLineColors: ['#66c84f'],
smooth: false,
fillOpacity: 0.2,
resize: true
grid: true,
gridTextColor: '#63676a',
gridTextSize: 9,
gridTextFamily: 'Arial, "Oxygen Bold"',
gridTextWeight: 'bold',
gridStrokeWidth: 0.3,
resize: true, // we use our own resize function
dataLabels: false,
hoverReversed: true,
// Area chart specific options
behaveLikeLine: true,
fillOpacity: 0.5,
belowArea: true,
areaColors: ['#3c3f41'],
// Not documented but working
padding: 8,
});
updateLogGraph(key);
graphArea.hideLoadingAnimation();
}
}
});
// modal dialog is closed
logDialog.on('hidden.bs.modal', function(e){
// clear memory -> destroy all charts
for(let key in chartData){
if(chartData.hasOwnProperty(key)){
chartData[key].graph = null;
}
}
/*
Util.getResizeManager().observe(
this.querySelector('.modal-dialog'),
(el, contentRect) => Object.values(chartData).forEach(data => {
if(data.graph) data.graph.redraw();
}),
{debounce: true, ms: 100}
);*/
});
// modal dialog before hide
logDialog.on('hide.bs.modal', function(e){
Object.entries(chartData).forEach(([key, data]) => {
if(data.graph){
data.graph.destroy();
delete chartData[key].graph;
}
});
// destroy logTable
logDataTable.destroy(true);
@@ -350,12 +360,13 @@ define([
let updateLogGraph = (key, duration) => {
// check if graph data already exist
if(!(chartData.hasOwnProperty(key))){
chartData[key] = {};
chartData[key].data = [];
chartData[key].graph = null;
chartData[key].averageElement = null;
chartData[key].updateElement = null;
if(!chartData.hasOwnProperty(key)){
chartData[key] = {
data: [],
graph: null,
averageElement: null,
updateElement: null
};
}
// add new value
@@ -396,7 +407,7 @@ define([
let tempChartData = getGraphData(chartData[key].data);
// add new data to graph (Morris chart) - if is already initialized
if(chartData[key].graph !== null){
if(chartData[key].graph){
let avgElement = chartData[key].averageElement;
let updateElement = chartData[key].updateElement;
@@ -474,16 +485,16 @@ define([
/**
* init logging -> set global log events
*/
let init = function(){
let init = () => {
let maxEntries = 150;
$(window).on('pf:syncStatus', function(){
$(window).on('pf:syncStatus', () => {
updateSyncStatus();
});
// set global logging listener
$(window).on('pf:log', function(e, logKey, options){
$(window).on('pf:log', (e, logKey, options) => {
// check required logging information
if(
@@ -522,10 +533,7 @@ define([
}
// delete old log entries from table ---------------------------------
let rowCount = logData.length;
if(rowCount >= maxEntries){
if(logData.length >= maxEntries){
if(logDataTable){
logDataTable.rows(0, {order:'index'}).remove().draw(false);
}else{

View File

@@ -617,8 +617,8 @@ define([
placement: getSystemTooltipPlacement(system),
html: true,
animation: true,
template: template,
viewport: system.closest('.' + Util.config.mapClass)
template: template,
container: system.closest('.' + Util.config.mapClass)
};
// init new tooltip -> Do not show automatic maybe system is currently dragged

View File

@@ -213,7 +213,7 @@ define([
parseTime: false,
ymin: 0,
yLabelFormat: value => Math.round(value),
padding: 10,
padding: 8,
hideHover: true,
pointSize: 2.5,
lineColors: this.getInfoForGraph(graphKey, 'lineColors'),
@@ -221,28 +221,32 @@ define([
pointStrokeColors: ['#141519'],
lineWidth: 1.5,
grid: true,
gridStrokeWidth: 0.3,
gridTextColor: '#63676a',
gridTextSize: 10,
gridTextFamily: 'Arial, "Oxygen Bold"',
gridTextColor: '#63676a',
gridTextWeight: 'bold',
behaveLikeLine: false,
gridStrokeWidth: 0.3,
behaveLikeLine: true,
goals: goals,
goalStrokeWidth: 1,
goalLineColors: ['#c2760c'],
smooth: false,
fillOpacity: 0.2,
resize: true,
redraw: true,
smooth: true,
fillOpacity: 0.5,
//belowArea: true,
areaColors: ['#c2760c', '#c2760c'],
belowArea: true,
//resize: true,
//redraw: true,
dataLabels: false,
eventStrokeWidth: 1,
eventLineColors: ['#63676a']
eventLineColors: ['#63676a'],
nbYkeys2: this.getInfoForGraph(graphKey, 'nbYkeys2')
};
if(eventLine > 0){
graphConfig.events = [eventLine];
}
this['_aChart_' + graphKey] = Morris.Area(graphConfig);
this['_aChart_' + graphKey] = Morris.Line(graphConfig);
// data for info "popover" --------------------------------------------------------------------------------
tooltipData = {};
@@ -270,6 +274,17 @@ define([
return tooltipData;
}
beforeDestroy(){
super.beforeDestroy();
for(let graphKey of Object.keys(this._config.systemGraphs)){
if(typeof this['_aChart_' + graphKey] === 'object'){
this['_aChart_' + graphKey].destroy();
delete this['_aChart_' + graphKey];
}
}
}
/**
* detect changed drop area, -> should trigger graph redraw
* @param name
@@ -342,8 +357,9 @@ define([
systemGraphs: {
jumps: {
headline: 'Jumps',
units: 'jumps',
postUnits: 'jumps',
ykeys: ['y'],
nbYkeys2: 0,
labels: ['Jumps'],
lineColors: ['#375959'],
pointFillColors: ['#477372'],
@@ -351,8 +367,9 @@ define([
},
shipKills: {
headline: 'Ship/POD Kills',
units: 'kills',
postUnits: 'kills',
ykeys: ['y', 'z'],
nbYkeys2: 1,
labels: ['Ships', 'PODs'],
lineColors: ['#375959', '#477372'],
pointFillColors: ['#477372', '#568a89'],
@@ -360,8 +377,9 @@ define([
},
factionKills: {
headline: 'NPC Kills',
units: 'kills',
postUnits: 'kills',
ykeys: ['y'],
nbYkeys2: 0,
labels: ['NPCs'],
lineColors: ['#375959'],
pointFillColors: ['#477372'],

View File

@@ -8,6 +8,7 @@ define([
'app/lib/console',
'app/lib/cache',
'app/lib/localStore',
'app/lib/resize',
'conf/system_effect',
'conf/signature_type',
'bootbox',
@@ -21,7 +22,7 @@ define([
'bootstrapConfirmation',
'bootstrapToggle',
'select2'
], ($, Init, Proto, Con, Cache, LocalStoreManager, SystemEffect, SignatureType, bootbox) => {
], ($, Init, Proto, Con, Cache, LocalStoreManager, ResizeManager, SystemEffect, SignatureType, bootbox) => {
'use strict';
@@ -3271,6 +3272,12 @@ define([
}
};
/**
* get ResizeManager instance
* @returns {ResizeManager}
*/
let getResizeManager = () => ResizeManager;
/**
* clear session Storage
* -> otherwise a tab refresh does not clear sessionStorage!
@@ -3673,6 +3680,7 @@ define([
formatPrice: formatPrice,
formatMassValue: formatMassValue,
getLocalStore: getLocalStore,
getResizeManager: getResizeManager,
clearSessionStorage: clearSessionStorage,
getBrowserTabId: getBrowserTabId,
singleDoubleClick: singleDoubleClick,

10
js/lib/morris.min.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -40,8 +40,8 @@ requirejs.config({
customScrollbar: 'lib/jquery.mCustomScrollbar.min', // v3.1.5 Custom scroll bars - http://manos.malihu.gr
mousewheel: 'lib/jquery.mousewheel.min', // v3.1.13 Mousewheel - https://github.com/jquery/jquery-mousewheel
xEditable: 'lib/bootstrap-editable.min', // v1.5.1 X-editable - in placed editing
morris: 'lib/morris.min', // v0.5.1 Morris.js - graphs and charts
raphael: 'lib/raphael.min', // v2.2.8 Raphaël - required for morris - https://dmitrybaranovskiy.github.io/raphael
morris: 'lib/morris.min', // v0.6.4 Morris.js - graphs and charts - https://github.com/pierresh/morris.js
raphael: 'lib/raphael.min', // v2.3.0 Raphaël - required for morris - https://dmitrybaranovskiy.github.io/raphael
bootbox: 'lib/bootbox.min', // v5.2.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.3.0 Inline Chart - http://benpickles.github.io/peity/

View File

@@ -0,0 +1,92 @@
define([], () => {
'use strict';
class ResizeManager {
constructor(config = {}) {
this._config = Object.assign({}, ResizeManager.defaultConfig, config);
this._observables = new WeakMap();
this._observer = new ResizeObserver((entries, observer) => { // jshint ignore:line
for (let entry of entries) {
if (this._observables.has(entry.target)) {
this._observables
.get(entry.target)
.callback(entry.target, entry.contentRect);
} else {
this._observer.unobserve(entry.target);
}
}
});
}
debounce(callback, ms = this._config.msDebounce, immediate = false) {
let timer;
return (...args) => {
let later = () => {
timer = null;
if (!immediate) callback(...args);
};
let callNow = immediate && !timer;
clearTimeout(timer);
timer = setTimeout(later, ms);
if (callNow) callback(...args);
};
}
throttle(callback, ms = this._config.msThrottle) {
let lastFunc;
let lastRan;
return function (...args) {
if (!lastRan) {
callback(...args);
lastRan = Date.now();
} else {
clearTimeout(lastFunc);
lastFunc = setTimeout(() => {
if (Date.now() - lastRan >= ms) {
callback(...args);
lastRan = Date.now();
}
}, ms - (Date.now() - lastRan));
}
};
}
observe(target, callback, config = {}, options = ResizeManager.observeOptions) {
if (!this._observables.has(target)) {
if (config.hasOwnProperty('debounce')) {
let {ms, immediate} = config;
callback = this.debounce(callback, ms, immediate);
}
if (config.hasOwnProperty('throttle')) {
let {ms} = config;
callback = this.throttle(callback, ms);
}
this._observables.set(target, {callback});
this._observer.observe(target, options);
}
}
unobserve(target) {
this._observer.unobserve(target);
this._observables.delete(target);
}
disconnect() {
this._observer.disconnect();
this._observables = new WeakMap();
}
}
ResizeManager.observeOptions = {
box: 'border-box' // sets which box model the observer will observe changes to
};
ResizeManager.defaultConfig = {
msDebounce: 250, // setTimeout for debounced calls
msThrottle: 100 // setTimeout for throttled calls
};
return new ResizeManager();
});

View File

@@ -7,7 +7,8 @@ define([
'app/init',
'app/util',
'app/counter',
'bootbox'
'bootbox',
'app/lib/resize'
], ($, Init, Util, Counter, bootbox) => {
'use strict';
@@ -283,52 +284,61 @@ define([
xkey: 'x',
ykeys: ['y'],
labels: [key],
units: 'ms',
parseTime: false,
ymin: 0,
yLabelFormat: labelYFormat,
padding: 8,
hideHover: true,
pointSize: 2.5,
lineColors: ['#375959'],
lineWidth: 2,
pointSize: 3,
pointFillColors: ['#477372'],
pointStrokeColors: ['#313335'],
lineWidth: 1.5,
grid: true,
gridStrokeWidth: 0.3,
gridTextSize: 9,
gridTextFamily: 'Oxygen Bold',
gridTextColor: '#63676a',
behaveLikeLine: false,
ymin: 0,
smooth: false,
hideHover: true,
parseTime: false,
postUnits: 'ms',
yLabelFormat: labelYFormat,
goals: [],
goalStrokeWidth: 1,
goalLineColors: ['#66c84f'],
smooth: false,
fillOpacity: 0.2,
resize: true
grid: true,
gridTextColor: '#63676a',
gridTextSize: 9,
gridTextFamily: 'Arial, "Oxygen Bold"',
gridTextWeight: 'bold',
gridStrokeWidth: 0.3,
resize: true, // we use our own resize function
dataLabels: false,
hoverReversed: true,
// Area chart specific options
behaveLikeLine: true,
fillOpacity: 0.5,
belowArea: true,
areaColors: ['#3c3f41'],
// Not documented but working
padding: 8,
});
updateLogGraph(key);
graphArea.hideLoadingAnimation();
}
}
});
// modal dialog is closed
logDialog.on('hidden.bs.modal', function(e){
// clear memory -> destroy all charts
for(let key in chartData){
if(chartData.hasOwnProperty(key)){
chartData[key].graph = null;
}
}
/*
Util.getResizeManager().observe(
this.querySelector('.modal-dialog'),
(el, contentRect) => Object.values(chartData).forEach(data => {
if(data.graph) data.graph.redraw();
}),
{debounce: true, ms: 100}
);*/
});
// modal dialog before hide
logDialog.on('hide.bs.modal', function(e){
Object.entries(chartData).forEach(([key, data]) => {
if(data.graph){
data.graph.destroy();
delete chartData[key].graph;
}
});
// destroy logTable
logDataTable.destroy(true);
@@ -350,12 +360,13 @@ define([
let updateLogGraph = (key, duration) => {
// check if graph data already exist
if(!(chartData.hasOwnProperty(key))){
chartData[key] = {};
chartData[key].data = [];
chartData[key].graph = null;
chartData[key].averageElement = null;
chartData[key].updateElement = null;
if(!chartData.hasOwnProperty(key)){
chartData[key] = {
data: [],
graph: null,
averageElement: null,
updateElement: null
};
}
// add new value
@@ -396,7 +407,7 @@ define([
let tempChartData = getGraphData(chartData[key].data);
// add new data to graph (Morris chart) - if is already initialized
if(chartData[key].graph !== null){
if(chartData[key].graph){
let avgElement = chartData[key].averageElement;
let updateElement = chartData[key].updateElement;
@@ -474,16 +485,16 @@ define([
/**
* init logging -> set global log events
*/
let init = function(){
let init = () => {
let maxEntries = 150;
$(window).on('pf:syncStatus', function(){
$(window).on('pf:syncStatus', () => {
updateSyncStatus();
});
// set global logging listener
$(window).on('pf:log', function(e, logKey, options){
$(window).on('pf:log', (e, logKey, options) => {
// check required logging information
if(
@@ -522,10 +533,7 @@ define([
}
// delete old log entries from table ---------------------------------
let rowCount = logData.length;
if(rowCount >= maxEntries){
if(logData.length >= maxEntries){
if(logDataTable){
logDataTable.rows(0, {order:'index'}).remove().draw(false);
}else{

View File

@@ -617,8 +617,8 @@ define([
placement: getSystemTooltipPlacement(system),
html: true,
animation: true,
template: template,
viewport: system.closest('.' + Util.config.mapClass)
template: template,
container: system.closest('.' + Util.config.mapClass)
};
// init new tooltip -> Do not show automatic maybe system is currently dragged

View File

@@ -213,7 +213,7 @@ define([
parseTime: false,
ymin: 0,
yLabelFormat: value => Math.round(value),
padding: 10,
padding: 8,
hideHover: true,
pointSize: 2.5,
lineColors: this.getInfoForGraph(graphKey, 'lineColors'),
@@ -221,28 +221,32 @@ define([
pointStrokeColors: ['#141519'],
lineWidth: 1.5,
grid: true,
gridStrokeWidth: 0.3,
gridTextColor: '#63676a',
gridTextSize: 10,
gridTextFamily: 'Arial, "Oxygen Bold"',
gridTextColor: '#63676a',
gridTextWeight: 'bold',
behaveLikeLine: false,
gridStrokeWidth: 0.3,
behaveLikeLine: true,
goals: goals,
goalStrokeWidth: 1,
goalLineColors: ['#c2760c'],
smooth: false,
fillOpacity: 0.2,
resize: true,
redraw: true,
smooth: true,
fillOpacity: 0.5,
//belowArea: true,
areaColors: ['#c2760c', '#c2760c'],
belowArea: true,
//resize: true,
//redraw: true,
dataLabels: false,
eventStrokeWidth: 1,
eventLineColors: ['#63676a']
eventLineColors: ['#63676a'],
nbYkeys2: this.getInfoForGraph(graphKey, 'nbYkeys2')
};
if(eventLine > 0){
graphConfig.events = [eventLine];
}
this['_aChart_' + graphKey] = Morris.Area(graphConfig);
this['_aChart_' + graphKey] = Morris.Line(graphConfig);
// data for info "popover" --------------------------------------------------------------------------------
tooltipData = {};
@@ -270,6 +274,17 @@ define([
return tooltipData;
}
beforeDestroy(){
super.beforeDestroy();
for(let graphKey of Object.keys(this._config.systemGraphs)){
if(typeof this['_aChart_' + graphKey] === 'object'){
this['_aChart_' + graphKey].destroy();
delete this['_aChart_' + graphKey];
}
}
}
/**
* detect changed drop area, -> should trigger graph redraw
* @param name
@@ -342,8 +357,9 @@ define([
systemGraphs: {
jumps: {
headline: 'Jumps',
units: 'jumps',
postUnits: 'jumps',
ykeys: ['y'],
nbYkeys2: 0,
labels: ['Jumps'],
lineColors: ['#375959'],
pointFillColors: ['#477372'],
@@ -351,8 +367,9 @@ define([
},
shipKills: {
headline: 'Ship/POD Kills',
units: 'kills',
postUnits: 'kills',
ykeys: ['y', 'z'],
nbYkeys2: 1,
labels: ['Ships', 'PODs'],
lineColors: ['#375959', '#477372'],
pointFillColors: ['#477372', '#568a89'],
@@ -360,8 +377,9 @@ define([
},
factionKills: {
headline: 'NPC Kills',
units: 'kills',
postUnits: 'kills',
ykeys: ['y'],
nbYkeys2: 0,
labels: ['NPCs'],
lineColors: ['#375959'],
pointFillColors: ['#477372'],

View File

@@ -8,6 +8,7 @@ define([
'app/lib/console',
'app/lib/cache',
'app/lib/localStore',
'app/lib/resize',
'conf/system_effect',
'conf/signature_type',
'bootbox',
@@ -21,7 +22,7 @@ define([
'bootstrapConfirmation',
'bootstrapToggle',
'select2'
], ($, Init, Proto, Con, Cache, LocalStoreManager, SystemEffect, SignatureType, bootbox) => {
], ($, Init, Proto, Con, Cache, LocalStoreManager, ResizeManager, SystemEffect, SignatureType, bootbox) => {
'use strict';
@@ -3271,6 +3272,12 @@ define([
}
};
/**
* get ResizeManager instance
* @returns {ResizeManager}
*/
let getResizeManager = () => ResizeManager;
/**
* clear session Storage
* -> otherwise a tab refresh does not clear sessionStorage!
@@ -3673,6 +3680,7 @@ define([
formatPrice: formatPrice,
formatMassValue: formatMassValue,
getLocalStore: getLocalStore,
getResizeManager: getResizeManager,
clearSessionStorage: clearSessionStorage,
getBrowserTabId: getBrowserTabId,
singleDoubleClick: singleDoubleClick,

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -407,6 +407,7 @@ $mapBubbleWidth: 30px;
cursor: grab;
padding: 0 4px;
white-space: nowrap;
backface-visibility: hidden; // fixed blurry text on system scale() -> requires display: inline-block; transform: translateY(0); for child nodes
display: none; // triggered by JS
will-change: width;
@@ -432,6 +433,7 @@ $mapBubbleWidth: 30px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
transform: translateY(0); // fixed "blurry" text in scaled parent
display: none; // hover effect
}
@@ -440,6 +442,7 @@ $mapBubbleWidth: 30px;
font-size: 6px;
width: 10px;
vertical-align: middle;
transform: translateY(0); // fixed "blurry" text in scaled parent
}
.pf-system-body-item-name{
@@ -449,6 +452,7 @@ $mapBubbleWidth: 30px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
transform: translateY(0); // fixed "blurry" text in scaled parent
}
}