mirror of
https://github.com/finos/SymphonyElectron.git
synced 2025-02-25 18:55:29 -06:00
ELECTRON-801 (Dynamically update notification based on message length) (#511)
* ELECTRON-801 - Dynamically update notification based on message length * ELECTRON-801 - hide text only if the length is greater than 96 char
This commit is contained in:
parent
ba83338e6e
commit
2a1f2b16e8
@ -20,15 +20,17 @@ let onMouseOverFunc;
|
||||
*/
|
||||
function setStyle(config) {
|
||||
// Style it
|
||||
let notiDoc = window.document;
|
||||
let container = notiDoc.getElementById('container');
|
||||
let header = notiDoc.getElementById('header');
|
||||
let image = notiDoc.getElementById('image');
|
||||
let logo = notiDoc.getElementById('symphony-logo');
|
||||
let title = notiDoc.getElementById('title');
|
||||
let company = notiDoc.getElementById('company');
|
||||
let message = notiDoc.getElementById('message');
|
||||
let close = notiDoc.getElementById('close');
|
||||
const notiDoc = window.document;
|
||||
const container = notiDoc.getElementById('container');
|
||||
const header = notiDoc.getElementById('header');
|
||||
const image = notiDoc.getElementById('image');
|
||||
const logo = notiDoc.getElementById('symphony-logo');
|
||||
const title = notiDoc.getElementById('title');
|
||||
const company = notiDoc.getElementById('company');
|
||||
const message = notiDoc.getElementById('message');
|
||||
const close = notiDoc.getElementById('close');
|
||||
const picture = notiDoc.getElementById('picture');
|
||||
const logoContainer = notiDoc.getElementById('logo-container');
|
||||
|
||||
// Default style
|
||||
setStyleOnDomElement(config.defaultStyleContainer, container);
|
||||
@ -53,6 +55,10 @@ function setStyle(config) {
|
||||
setStyleOnDomElement(config.defaultStyleText, message);
|
||||
|
||||
setStyleOnDomElement(config.defaultStyleClose, close);
|
||||
|
||||
setStyleOnDomElement(config.defaultStyleImageContainer, picture);
|
||||
|
||||
setStyleOnDomElement(config.defaultStyleLogoContainer, logoContainer);
|
||||
}
|
||||
|
||||
/**
|
||||
@ -80,15 +86,15 @@ function setContents(event, notificationObj) {
|
||||
}
|
||||
}
|
||||
|
||||
let notiDoc = window.document;
|
||||
const notiDoc = window.document;
|
||||
|
||||
// All the required DOM elements to update the content
|
||||
let container = notiDoc.getElementById('container');
|
||||
let titleDoc = notiDoc.getElementById('title');
|
||||
let companyDoc = notiDoc.getElementById('company');
|
||||
let messageDoc = notiDoc.getElementById('message');
|
||||
let imageDoc = notiDoc.getElementById('image');
|
||||
let closeButton = notiDoc.getElementById('close');
|
||||
const container = notiDoc.getElementById('container');
|
||||
const titleDoc = notiDoc.getElementById('title');
|
||||
const companyDoc = notiDoc.getElementById('company');
|
||||
const messageDoc = notiDoc.getElementById('message');
|
||||
const imageDoc = notiDoc.getElementById('image');
|
||||
const closeButton = notiDoc.getElementById('close');
|
||||
closeButton.title = notificationObj.i18n.close;
|
||||
|
||||
if (notificationObj.color) {
|
||||
|
@ -2,8 +2,8 @@
|
||||
<head></head>
|
||||
<body style='margin:0; overflow: hidden; -webkit-user-select: none;'>
|
||||
<div id="container">
|
||||
<div>
|
||||
<img src="" id="symphony-logo">
|
||||
<div id="logo-container">
|
||||
<img src="./assets/symphony-logo-white.png" id="symphony-logo">
|
||||
</div>
|
||||
<div id="header">
|
||||
<span id="title"></span>
|
||||
|
@ -56,7 +56,7 @@ let config = {
|
||||
// upper-right, upper-left, lower-right, lower-left
|
||||
startCorner: 'upper-right',
|
||||
width: 380,
|
||||
height: 70,
|
||||
height: 100,
|
||||
borderRadius: 5,
|
||||
displayTime: 5000,
|
||||
animationSteps: 5,
|
||||
@ -76,18 +76,25 @@ let config = {
|
||||
defaultStyleHeader: {
|
||||
width: 245,
|
||||
minWidth: 230,
|
||||
margin: "10px 10px"
|
||||
margin: 'auto',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'flex-start',
|
||||
},
|
||||
defaultStyleImageContainer: {
|
||||
alignItems: 'center',
|
||||
display: 'flex',
|
||||
},
|
||||
defaultStyleImage: {
|
||||
height: 43,
|
||||
borderRadius: 4,
|
||||
marginTop: 12,
|
||||
width: 43
|
||||
},
|
||||
defaultStyleClose: {
|
||||
width: 16,
|
||||
height: 16,
|
||||
margin: "10px 8px 0 8px",
|
||||
height: 80,
|
||||
display: 'flex',
|
||||
margin: 'auto',
|
||||
opacity: 0.54,
|
||||
fontSize: 12,
|
||||
color: '#CCC'
|
||||
@ -119,13 +126,19 @@ let config = {
|
||||
marginTop: 5,
|
||||
overflow: 'hidden',
|
||||
display: '-webkit-box',
|
||||
webkitLineClamp: 1,
|
||||
webkitLineClamp: 3,
|
||||
webkitBoxOrient: 'vertical',
|
||||
cursor: 'default'
|
||||
cursor: 'default',
|
||||
textOverflow: 'ellipsis',
|
||||
},
|
||||
defaultStyleLogoContainer: {
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
},
|
||||
defaultStyleLogo: {
|
||||
margin: "12px 0 0 -12px",
|
||||
marginLeft: '5px',
|
||||
opacity: 0.6,
|
||||
width: '43px',
|
||||
},
|
||||
defaultWindow: {
|
||||
alwaysOnTop: true,
|
||||
|
Loading…
Reference in New Issue
Block a user