Zendesk web widget status not correctly updating and button not hiding - zendesk

I'm loading the Zendesk web widget into a page, and this is the event handler for when it's loaded in
scriptElement.onload = function () {
zE(function () {
$zopim(function () {
$zopim.livechat.button.setHideWhenOffline(true);
$zopim.livechat.setOnStatus(function (status) {
console.log('status',status);
status === 'online' ? $zopim.livechat.button.show() : $zopim.livechat.button.hide();
});
$zopim.livechat.setStatus('offline');
});
});
};
It has the setOnStatus event handler which should trigger anytime the status changes. It seems to be triggered once when the page initially loads in. You'd expect it to be triggered as well everytime I call the setStatus method, but that's not the case. Where I log the status, it's always just 'online', and it only happens once.
What I'm trying to do is force the button to disappear when the status is offline. Yet setting the status to 'offline' doesn't hide the button, just displays the offline version (i.e. a button which lets me send an offline message, rather than a live chat).
I thought the setHideWhenOffline method might have helped, but that doesn't seem to make any difference in this case.
Any ideas?

Actually I found the solution I needed here, this prevents the offline button appearing.
window.zESettings = {
webWidget: {
contactForm: {
suppress: true
}
}
};
https://developer.zendesk.com/embeddables/docs/widget/settings#suppress

Related

Electron Web Bluetooth Device selection returning only 1 device

have found that in my electron application the following code from the main.js only returns a device list of length 1 (filled with one device) even though there are many devices around.
mainWindow.webContents.on('select-bluetooth-device', (event, deviceList, callback) => {
event.preventDefault();
console.log(deviceList);
bluetoothSelection.selectBluetoothDevice(deviceList, mainWindow, (deviceId) => {
callback(deviceId);
});
If I call
navigator.bluetooth.requestDevice({
acceptAllDevices: true,
optionalServices: [serviceUuid]
})
multiple times, the device returned changes and if I cycle through it often enough, I get the device I want eventually.. But I built a device Picker window and all that stuff and now the window opens for only one device, which makes everything quite annoying:P
Any ideas on what could cause this or even how I could fix it?
If you have a look at https://www.electronjs.org/docs/latest/api/web-contents#event-select-bluetooth-device you will find the example code provided by electron you probably already know:
win.webContents.on('select-bluetooth-device', (event, deviceList, callback) => {
event.preventDefault()
const result = deviceList.find((device) => {
return device.deviceName === "test"
})
if (!result) {
callback('')
} else {
callback(result.deviceId)
}
})
You have to prevent the callback until you have found the device you are looking for. I suggest to open a second window and pass in the deviceList. Now you can display the devices and let the user choose one. If the user has chosen a device, you can close the second window and call the callback with this deviceId.
To communicate between the windows you can use the “contextBridge” with “ipcRenderer” and “ipcMain” and to call the callback you can make a global variable
var callbackForBluetoothEvent = null;
and fill it int the
mainWindow.webContents.on(
// stuff
callbackForBluetoothEvent = callback; //to make it accessible outside
// stuff
);
With a “ipcMain.on”
ipcMain.on("BLEScannFinished", (event, args) => {
console.log(args);
console.log(BLEDevicesList.find((item) => item.deviceId === args));
let BLEDevicesChoosen = BLEDevicesList.find((item) => item.deviceId === args);
callbackForBluetoothEvent(BLEDevicesChoosen.deviceId);
});
You can than call the callback
Unfortunately this is a bit to much code for a forum post but you can find a rudimentary solution of this suggestion at the link:
https://github.com/grosdode/Electron-multible-BLE-devices
The electron issues 11865 was also helpful and there is a page which shows alternative code for the suggested solution. Unfortunately also to much code to post it here.
https://technoteshelp.com/electron-web-bluetooth-api-requestdevice-error/

Open a Modal Dialog when issue is Done

I’m just starting with Forge and JIRA apps development, I need to open a ModalDialog when an issue changes its state to “Done” (either by dragging it to the Done column or by changing its status in the issue panel). I don’t know where to start, I tried clonning the jira-issue-activity-ui-kit starter but I don’t get where the modal should open, any ideas? Thanks
This is the code I've tried:
const DONE = 'Done';
export async function run(event, context) {
console.log('Hello World!', event, event.changelog.items);
// if the issue is solved (status changed to Done)
if (event.changelog.items.some(function changedToPreferredStatus(change) {
return statusChangedTo(change, DONE);
})) {
let description = event.issue.fields.summary;
// OPEN MODAL DIALOG HERE
}
}
function statusChangedTo(change, to) {
return change.field === 'status' && change.toString === to;
}

How to toggle devtools in an Electron app while focused on devtools?

I want to make my Electron app toggle developer tools in response to F12.
In the renderer page, I added:
const currentWebContents = require("electron").remote.getCurrentWebContents();
window.addEventListener("keydown", (e: KeyboardEvent) => {
if (e.keyCode === 123) { // F12
currentWebContents.toggleDevTools();
}
});
This works when I'm focused on the main page. However, immediately after the dev tools opens up, focus goes to the dev tools, so F12 is no longer detected.
I tried fixing this by adding a listener to the devtools webcontents right after calling toggleDevTools() like so:
if (currentWebContents.devToolsWebContents) {
currentWebContents.devToolsWebContents.on("before-input-event", (event: Electron.Event, input: Electron.Input) => {
if (input.type === "keyDown" && input.key === "F12") {
currentWebContents.toggleDevTools();
}
});
}
However, currentWebContents.devToolsWebContents is null right after opening it. My first question is how to ensure that it isn't null - is there a way to wait until it's fully opened?
I worked around this by putting the if (currentWebContents.devToolsWebContents) code into a setTimeout(..., 1000);
However, upon doing that, my before-input-event handler does not get triggered when pressing keys while focused on the devtools.
Does anybody know why that is?
There is no easy way to do this.
As per this issue, you can't detect input from devtools.
An Electron developer posted a comment here:
I think this is because the toggleDevTools menu role doesn't properly check for the 'parent' window of a devtools window. it would probably be possible to have the toggleDevTools menu role check to see if the currently focused window is a devtools window, and if so, call toggleDevTools on the webcontents for which the devtools is opened, instead of on the devtools window itself.
In any case, this requires Electron development to solve.
Update: Someone here suggested this workaround - I haven't tried it myself:
mainWindow.webContents.on("before-input-event", (e, input) => {
if (input.type === "keyDown" && input.key === "F12") {
mainWindow.webContents.toggleDevTools();
mainWindow.webContents.on('devtools-opened', () => {
// Can't use mainWindow.webContents.devToolsWebContents.on("before-input-event") - it just doesn't intercept any events.
mainWindow.webContents.devToolsWebContents.executeJavaScript(`
new Promise((resolve)=> {
addEventListener("keydown", (event) => {
if (event.key === "F12") {
resolve();
}
}, { once: true });
})
`)
.then(() => {
mainWindow.webContents.toggleDevTools();
});
});
}
});

jquery mobile swipe event disable for input range

I am using jquery mobile to close and open a menu in an app like this:
$('body').on('swipeleft', function(event){
if(menuOpen == true){
home.showMenu();
}
});
$('body').on('swiperight', function(event){
if(menuOpen == false){
home.showMenu();
}
});
And I have a input range (slider) in my menu like this:
<input id="changeRadiusRange" type="range" min="5" max="100" step="5" oninput="handleInputVal(value)" onchange="handleChangeVal(this.value)">
Now if I use my slider it stops after some time (I think the 30pixel for swipeleft/right to get fired and menu is closing if it is a swipeleft)
I already tried a few things regarding to this question, that results in this but didn't changed the behavior:
$('#changeRadiusRange').on('swipeleft swiperight', function(e){
e.stopPropagation();
e.preventDefault();
});
How can I force input behavior as normal not to be influenced by swipe-events?
I had the same problem today and found a less hacky solution.
var handleSwipe = function (event) {
// my swipe stuff
}
// regular event listening
$(document).on("swipeleft swiperight", handleSwipe);
// additional workaround
$(".slider").on("mousedown touchstart", function (event) {
// when starting to interact with a .slider, stop listening the event
$(document).off("swipeleft swiperight");
}).on("mouseup touchend", function (event) {
// when interaction stops, re-listen to swipe events
$(document).on("swipeleft swiperight", handleSwipe);
});
It seems that sliders never ever work properly, as long as the swipe events are used anywhere in the document. This is even the case, when there is nothing done in the event handler. Also preventDefault() and/or stopPropagation() doesn't change anything.
With this solution, I kill the previously enabled swipe events while the user interacts with a slider. When interaction is done, I re-enable swipe events. Works great for me.
This worked for me with jqm 1.4.5:
$(document).on('mousedown touchstart', 'input[type=range]',
function(e){
e.stopPropagation();
});
Currently solved it like this:
$('body').on('swipeleft', function(event){
if(event.target.id != "changeRadiusRange"){
if(menuOpen == true){
home.showMenu();
}
}
});
But then slider is stopping after the swipeleft event is called from body. does not move more to the left so I have to release the slider and slide again to the left if I need to till the swipeleft is called etc. Just workaround hope got it fixed soon

Back button handler in jQuery Mobile (Android) PhoneGap

Is there any way to handle back button (device backbutton) as default functionality to move back page? I need to implement the same functionality on back button goes to previous page. If there is no previous page (first page) it exit the application. Is this possible in PhoneGap?
I also need to pop page before going to push another page is this posible in jQuery?
Checking window.location.length would be the easiest way to determine if you're on the first page, but this isn't available in Phonegap.
But since you're using JQM, you can either use the navigate event as Omar suggests or could manually count the number of pages shown and the number of pages gone back (same thing) and use this to determine if the first page is being shown and whether to exit the app. Something like this would work:
var pageHistoryCount = 0;
var goingBack = false;
$(document).bind("pageshow", function(e, data) {
if (goingBack) {
goingBack = false;
} else {
pageHistoryCount++;
console.log("Showing page #"+pageHistoryCount);
}
});
function exitApp() {
console.log("Exiting app");
navigator.app.exitApp();
}
function onPressBack(e) {
e.preventDefault();
if(pageHistoryCount > 0) pageHistoryCount--;
if (pageHistoryCount == 0) {
navigator.notification.confirm("Are you sure you want to quit?", function(result){
if(result == 2){
exitApp();
}else{
pageHistoryCount++;
}
}, 'Quit My App', 'Cancel,Ok');
} else {
goingBack = true;
console.log("Going back to page #"+pageHistoryCount);
window.history.back();
}
}
function deviceready() {
$(document).bind('backbutton', onPressBack);
}
$(document).bind('deviceready', deviceready);
As for the second part of your question:
Secondly i need to pop page before going to push another page is this
posible in jquery ?
It's not clear what you're asking here. Do you mean you want to show some kind of popup content like a dialog between every page change? Please clarify then I can help you :-)

Resources