Activate ZenDesk widget using JavaScript trigger - javascript

Okay so I am editing a page here support.tophat.com and at the bottom left of the screen there is a little widget button that opens up a handy little support ticket window upon click. This is the ZenDesk widget that is provided by zendesk to provide a service for customers to submit support tickets to the ZenDesk back end.
What I'm trying to do is to include an "onClick" call to a function on some arbitrary link or button elsewhere on the page that will trigger the support ticket window to display, without actually having to click on the button in the bottom left.
It would seem that this is through an iframe, and I have already tried the jQuery .click() function to no avail... After inspecting the element, and seeing what function gets fired when a user clicks on the button, I get a long string of disgustingly cryptic JS that has no real outlined functions.
My end goal is to open the support window after clicking on, lets say, a link that has a trigger like if I click on a link, and set the onClick="trigger()" which fires the window to open in the bottom left.
If you would like me to include the block that chrome shows be when the event is fired let me know, but it is NOT pretty and mods might not like if i put in code that looks like that.

Using jQuery (which is included in the Zendesk Help Center), you can do this:
$('#launcher').contents().find('.Button--launcher').click();
I tested it out on your site in the Chrome console, and it activates the widget.
I found info relating to this answer here: IFrame button click event
Info on jQuery's .contents(): https://api.jquery.com/contents/

THIS:
$zopim(function() {
$zopim.livechat.window.show();
});
If you wanna call it from HTML:
<a href="javascript:$zopim.livechat.window.show();">
You can also check their API docs: https://api.zopim.com/files/meshim/widget/controllers/liveChatAPI/Window-js.html

zE.activate(); Worked for me when used jQuery

Related

Click a link and use window.open() blocks one of the links

I'm trying to create a simple JS function that will open a new window/tab when clicking a specific button, so the user will actually open 2 windows/tabs, however no matter what I do, one of the links gets blocked by Chrome as a "popup-blocked".
I'd like to do something like this:
$(document).ready(function(){
$("a").mousedown(function(){
window.open("https://stackoverflow.com/","_blank");
});
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Click Me!
;
But when I do this, the button link doesn't work, but the JS does.
If I change the JS and add a setTimeout() to it, the button URL goes through but the JS gets blocked.
No matter what I do, I can't get both of them to go through.
Any help would be appreciated.
Navigating to two places at once, with one in a new window, is really popular with people who want to show the user a massive advert in a new window.
Massive adverts are unpopular with users, so browsers take steps to prevent this behaviour.
Sometimes legitimate uses get caught in the crossfire. Blame the blackhat end of the advertising industry.
You'll need to find some other way to display… whatever it is you want to display… to the user that doesn't involve navigating to multiple webpages at the same time in separate windows.
The problem is caused by the mousedown() event you are using which is a part of down+up sequence to trigger the click() event of the <a> tag.
so opening a new window "breaks" the flow and browser is not tracking for the mouse-up event anymore to follow the original url.
so the solution is to attach the click() event instead without stopping propagation. this will fire the attached and original events and none of them will be blocked.
$(document).ready(function(){
$("a").click(function(){
window.open("https://stackoverflow.com/","_blank");
});
})
you can try sample on this page as stackoverflow snippet is sandboxed and is blocking popups

How to capture open link in new tab or window using jQuery?

Is it possible to capture the right click open in new window/tab or mouse wheel open in new window/tab event using jQuery?
UPDATE 1
Here is why I need it. I have codeigniter application which uses pagination class. I use this class to display a grid. The pagination links have been bind with a method that uses AJAX to load the next page in a container div. Now some one can right click and open the next page in new tab/window which I don't want. IMHO, the only way to handle this is to some how trap the (right click or mouse wheel button click) open in new window/tab event.
UPDATE 2
I just realised all my AJAX requests are being served by one CI controller which actually acts as a proxy to other classes/libs. In this controller I can look at the request and if it isn't an AJAX request I can redirect the user to another page.
A workaround solution is to replace all applicable <a> elements with buttons, where (obviously) the buttons would call JavaScript that does the appropriate navigation.
If you're really keen you can apply CSS to make the buttons look like <a> elements, though I don't recommend it because it confuses users who might try to treat them as standard links and right- or middle-click them.
(You could even get it to work for users that don't have JavaScript enabled by, e.g., making each button a submit button in its own little form.)
At the very least you can catch a right-click, using .mousedown() (or, presumably, mouseup()). See this StackOverflow answer about right clicks for more. And by catching it, you should be able to do a standard event.preventDefault() and then do as you like from there. That may be overkill, however, as it could prevent the user from doing other things you want to allow them to do.
I almost fixed a similar issue now for a page which I am working on. My fix was to do some changes in the page if that has been opened in a new window....
Assume that you open a page "B" from page "A" in a new window.
If you want to check the page "B" is opened in a new window from page "A", then follow the below steps..
If (document.referrer == "A" && window.history.length > 1) {
alert("I am page 'B' and opened from page 'A' in a new window");
}
If you don't want people to access link the usual way or fallback when the JS is disabled, then it shouldn't be a link. Just use any element you like (span, div, button, whatever you like) and style it like a link. Then bind the action using JS. Or you can use a link with href="#" or href="javascript: void(0)". That way if users right click it and choose to open in a new window, then they will end up in the same page they were before.

JavaScript click event

My browser (firefox) prevents any popup from loading, and loads links that open new windows in the current tab, unless I explicitly say I want the link to load on a new tab or window, with the appropriate shortcuts (for example, middle click on the link, or left click with ctrl pressed causes the link to open on a new tab, and shift + left click on a new window).
I would like to create a javascript function f() that runs some code (meant to create the link address) when the link is pressed, and then loads the link that has been created, without removing the user experience described above.
Right now what I have is something like <a href="javascript:void(0)" onclick="f()"/>, but middle click doesn't work (it instead loads the url javascript:void(0)) and neither do the other features described above.
Do you have any idea as how to solve my problem ?
Thanks.
have you tried window.open('url')?
see: http://www.javascript-coder.com/window-popup/javascript-window-open.phtml
Also, as far as I know, you can't control whether or not the browser opens in a new tab or new window. That is a browser setting that is different for every user.
You might also try removing the onclick, and using
EDIT
There seems to be issues with using middle click with opening new tabs instead of executing the javascript: middle click (new tabs) and javascript links
As that site says, you can instead create an id for the element and bind it through javascript.
**Taken from that link:
...
And then in your JS, hook the link via it's ID to do the AJAX call.
Remember that you need to stop the click event from bubbling up. Most
frameworks have an event killer built in that you can call (just look
at its Event class).
Here's the event handling and event-killer in jquery:
$("#thisLink").click(function(ev, ob) {
alert("thisLink was clicked");
ev.stopPropagation();
});
Without jQuery, it might look like this:
document.getElementById('thisLink').onclick = function(e)
{
//do someting
e.stopPropagation();
}
Other browsers may vary, but by default Firefox doesn't tell the web page that it has been middle-clicked (unless you set the hidden preference to enable the feature). You might be able to create a workaround based on the focus and/or mouseover events instead.

Simulate real mouse click

What I want to do is execute a mouse click say on youtube to press play when the page loads. How do I click that specific location (assuming it is always in the same location)?
I have tried and failed with
var e = document.getElementById('myelem'); e.click();
var e = new jQuery.Event("click");e.pageX=x;e.pageY=y;$("#elem").trigger(e);
and stuff like that. nothing really works. Any suggestions? I am using google chrome
alright it seems like there has been a little confusion so I will further explain. I have created a popup tied to a keystroke event what I want to do is trigger x-webkit-speech by clicking the microphone that is in my popup so that the user does not have to click it themselves. I have tried a bunch of ways like above and have not been successful. After this my program will be done so I really would love some help thanks :]
In general, browsers won't let simulated mouse clicks trigger "real" actions, e.g. a jQuery click() won't cause the browser to follow a link. Otherwise, spammers could trigger banner clicks on every page load (among other more malicious uses).
According to http://www.filosophy.org/2011/03/talking-to-the-web-the-basics-of-html5-speech-input/:
Eventually, it will be possible to invoke the speech-recognition directly with the startSpeechInput() method, but to my knowledge this is not implemented in any of the current browsers.
I suggest waiting for Chrome to implement the API so that you can trigger speech input from JavaScript.
<button id="myButton" onClick="alert('You clicked me!');">Click me</button>
document.getElementById("myButton").click();
http://fiddle.jshell.net/Shaz/HgyeZ/
That's with regular clickable items though. But with YouTube Videos, you could also append &autoplay=1 to the end of the url (if it's embedded into a page).
http://fiddle.jshell.net/Shaz/tcMCa/

how to implement the comment popup window at dealsea.com?

I came across [check revision history for link] and surprised by its clean design. I am particularly interested in how the site implement the "Add Comment" popup when you click any of the "Add Comments" link under a deal.
My JS knowledge for popup is still at the .. level. Yet this site is using < a class="addcomment">Add Comments only. How does it trigger the popup? I searched its homepage html source and not seeing the case it pre-load the popup then hide and enable it when someone click the "Add Comments" link.
Have a look at jQuery Its a javascript library that has feature and plugins that can achieve this very easily and supports most browsers.
Have a look at the jquery dialog specifically: http://jqueryui.com/demos/dialog/
They are attaching a click event handler via jQuery. If you use your browser's dev tools and use the console, you could execute the following code to view the handlers bound. If you use Firefox and Firebug, you can use Firequery, which adds the .data() data to the dom view.
$(".addcomment").data("events").click
If you look at the external js file and search for "addcomment", you'll see the handler being bound.

Categories