if/SymphonyElectron
1
0
Fork 0
mirror of https://github.com/finos/SymphonyElectron.git synced 2025-02-25 18:55:29 -06:00
Code Issues Packages Projects Releases Wiki Activity

ELECTRON-801 (Dynamically update notification based on message length) (#511)

Browse Source 
* 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:
Kiran Niranjan 2018-10-02 20:31:37 +05:30 committed by Vishwas Shashidhar
parent ba83338e6e
commit 2a1f2b16e8
3 changed files with 45 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
js/notify/electron-notify-preload.js
View File

@ -20,15 +20,17 @@ let onMouseOverFunc;
*/ */
function setStyle(config) { function setStyle(config) {
// Style it // Style it
let notiDoc = window.document; const notiDoc = window.document;
let container = notiDoc.getElementById('container'); const container = notiDoc.getElementById('container');
let header = notiDoc.getElementById('header'); const header = notiDoc.getElementById('header');
let image = notiDoc.getElementById('image'); const image = notiDoc.getElementById('image');
let logo = notiDoc.getElementById('symphony-logo'); const logo = notiDoc.getElementById('symphony-logo');
let title = notiDoc.getElementById('title'); const title = notiDoc.getElementById('title');
let company = notiDoc.getElementById('company'); const company = notiDoc.getElementById('company');
let message = notiDoc.getElementById('message'); const message = notiDoc.getElementById('message');
let close = notiDoc.getElementById('close'); const close = notiDoc.getElementById('close');
const picture = notiDoc.getElementById('picture');
const logoContainer = notiDoc.getElementById('logo-container');
// Default style // Default style
setStyleOnDomElement(config.defaultStyleContainer, container); setStyleOnDomElement(config.defaultStyleContainer, container);
@ -53,6 +55,10 @@ function setStyle(config) {
setStyleOnDomElement(config.defaultStyleText, message); setStyleOnDomElement(config.defaultStyleText, message);
setStyleOnDomElement(config.defaultStyleClose, close); 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 // All the required DOM elements to update the content
let container = notiDoc.getElementById('container'); const container = notiDoc.getElementById('container');
let titleDoc = notiDoc.getElementById('title'); const titleDoc = notiDoc.getElementById('title');
let companyDoc = notiDoc.getElementById('company'); const companyDoc = notiDoc.getElementById('company');
let messageDoc = notiDoc.getElementById('message'); const messageDoc = notiDoc.getElementById('message');
let imageDoc = notiDoc.getElementById('image'); const imageDoc = notiDoc.getElementById('image');
let closeButton = notiDoc.getElementById('close'); const closeButton = notiDoc.getElementById('close');
closeButton.title = notificationObj.i18n.close; closeButton.title = notificationObj.i18n.close;
if (notificationObj.color) { if (notificationObj.color) {

4
js/notify/electron-notify.html
View File

@ -2,8 +2,8 @@
<head></head> <head></head>
<body style='margin:0; overflow: hidden; -webkit-user-select: none;'> <body style='margin:0; overflow: hidden; -webkit-user-select: none;'>
<div id="container"> <div id="container">
<div> <div id="logo-container">
<img src="" id="symphony-logo"> <img src="./assets/symphony-logo-white.png" id="symphony-logo">
</div> </div>
<div id="header"> <div id="header">
<span id="title"></span> <span id="title"></span>

29
js/notify/electron-notify.js
View File

@ -56,7 +56,7 @@ let config = {
// upper-right, upper-left, lower-right, lower-left // upper-right, upper-left, lower-right, lower-left
startCorner: 'upper-right', startCorner: 'upper-right',
width: 380, width: 380,
height: 70, height: 100,
borderRadius: 5, borderRadius: 5,
displayTime: 5000, displayTime: 5000,
animationSteps: 5, animationSteps: 5,
@ -76,18 +76,25 @@ let config = {
defaultStyleHeader: { defaultStyleHeader: {
width: 245, width: 245,
minWidth: 230, minWidth: 230,
margin: "10px 10px" margin: 'auto',
display: 'flex',
flexDirection: 'column',
alignItems: 'flex-start',
},
defaultStyleImageContainer: {
alignItems: 'center',
display: 'flex',
}, },
defaultStyleImage: { defaultStyleImage: {
height: 43, height: 43,
borderRadius: 4, borderRadius: 4,
marginTop: 12,
width: 43 width: 43
}, },
defaultStyleClose: { defaultStyleClose: {
width: 16, width: 16,
height: 16, height: 80,
margin: "10px 8px 0 8px", display: 'flex',
margin: 'auto',
opacity: 0.54, opacity: 0.54,
fontSize: 12, fontSize: 12,
color: '#CCC' color: '#CCC'
@ -119,13 +126,19 @@ let config = {
marginTop: 5, marginTop: 5,
overflow: 'hidden', overflow: 'hidden',
display: '-webkit-box', display: '-webkit-box',
webkitLineClamp: 1, webkitLineClamp: 3,
webkitBoxOrient: 'vertical', webkitBoxOrient: 'vertical',
cursor: 'default' cursor: 'default',
textOverflow: 'ellipsis',
},
defaultStyleLogoContainer: {
display: 'flex',
alignItems: 'center',
}, },
defaultStyleLogo: { defaultStyleLogo: {
margin: "12px 0 0 -12px", marginLeft: '5px',
opacity: 0.6, opacity: 0.6,
width: '43px',
}, },
defaultWindow: { defaultWindow: {
alwaysOnTop: true, alwaysOnTop: true,