mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 08:16:09 +08:00
09b91a0a28
Summary: Move all Intercom feedback code to a package. Change the appearance of the lower right question mark icon when a new intercom message is received (red, with repeating CSS bounce animation). New messages are detected by keeping the intercom window open (after the first time it's opened by the user), and listening for DOM mutations of particular classes. Test Plan: manual Reviewers: bengotow Reviewed By: bengotow Subscribers: evan Differential Revision: https://phab.nylas.com/D2125
125 lines
4.5 KiB
HTML
125 lines
4.5 KiB
HTML
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Feedback</title>
|
|
<script src="nylas://feedback/node_modules/electron-safe-ipc/guest-bundle.js"></script>
|
|
<script>
|
|
(function() {
|
|
var query = location.search.substr(1);
|
|
var queryParams = {};
|
|
query.split("&").forEach(function(part) {
|
|
if (!part) return;
|
|
var item = part.split("=");
|
|
var key = item[0];
|
|
var val = decodeURIComponent(item[1])
|
|
queryParams[key] = val;
|
|
});
|
|
|
|
var _newMessages = false;
|
|
function setNewMessages(value) {
|
|
if(_newMessages !== value) // ensure we only send once message per state flip
|
|
sendNewMessageState(value);
|
|
_newMessages = value;
|
|
}
|
|
function sendNewMessageState(value) {
|
|
electronSafeIpc.send("fromRenderer", 'newFeedbackMessages', value);
|
|
}
|
|
|
|
//Hacky intercom-dependent constants
|
|
intercomClassWhitelist = [
|
|
'intercom-conversations-item',
|
|
'intercom-conversations-items'
|
|
];
|
|
|
|
function classInString(classString, className) {
|
|
return classString.split(" ").some(function(s){return s === className});
|
|
}
|
|
function classesInString(classString, classes) {
|
|
var split = classString.split(" ");
|
|
return classes.some(function(c){
|
|
return split.some(function(s){return s === c});
|
|
});
|
|
}
|
|
|
|
// Create a mutation observer to look for new messages
|
|
var mutationCallback = function(events, observer){
|
|
events.map(function(e){
|
|
var whitelisted = classesInString(e.target.className, intercomClassWhitelist);
|
|
var focus = document.hasFocus();
|
|
if(whitelisted && !focus) {
|
|
console.log(e.target.className, e);
|
|
setNewMessages(true);
|
|
}
|
|
});
|
|
};
|
|
var mutationOpts = {
|
|
childList: true,
|
|
subtree: true
|
|
};
|
|
var mutationObserver = new MutationObserver(mutationCallback);
|
|
|
|
// Listen for focus and set newMessages to false
|
|
window.onfocus = function(e) {
|
|
setNewMessages(false);
|
|
}
|
|
// Prevent window close
|
|
window.onbeforeunload = function(e) {
|
|
e.returnValue = false;
|
|
};
|
|
|
|
// Load the intercom widget.
|
|
var w = window;
|
|
var ic = w.Intercom;
|
|
if (typeof ic==="function") {
|
|
ic('reattach_activator');
|
|
ic('update', intercomSettings);
|
|
} else {
|
|
var d = document;
|
|
var i = function() { i.c(arguments) };
|
|
i.q = [];
|
|
i.c = function(args){ i.q.push(args) };
|
|
w.Intercom = i;
|
|
}
|
|
function l() {
|
|
var s = d.createElement('script');
|
|
s.type = 'text/javascript';
|
|
s.async = true;
|
|
s.src = 'https://widget.intercom.io/widget/t7k2sjgy';
|
|
var x = d.getElementsByTagName('script')[0];
|
|
x.parentNode.insertBefore(s,x);
|
|
}
|
|
if (w.attachEvent) {
|
|
w.attachEvent('onload',l);
|
|
} else {
|
|
w.addEventListener('load', l, false);
|
|
}
|
|
|
|
// Show the intercom messaging window.
|
|
// Send along some extra info per
|
|
// http://docs.intercom.io/configuring-Intercom/send-custom-user-attributes-to-intercom
|
|
window.Intercom('boot', {
|
|
app_id: "t7k2sjgy",
|
|
email: queryParams.email,
|
|
name: queryParams.name,
|
|
"accountId": queryParams.accountId,
|
|
"accountProvider": queryParams.accountProvider,
|
|
"platform": queryParams.platform,
|
|
"provider": queryParams.provider,
|
|
"organizational_unit": queryParams.organizational_unit,
|
|
"version": queryParams.version,
|
|
"product": "N1"
|
|
});
|
|
window.Intercom('show');
|
|
|
|
mutationObserver.observe(document, mutationOpts);
|
|
})();
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<style>
|
|
.intercom-sheet-header-close-button, .intercom-sheet-header-minimize-button {
|
|
display:none !important;
|
|
}
|
|
</style>
|
|
</body></html>
|