As we know that the zendesk Messaging Widget doesn't have proactive chat natively, after deep research I made this script to help anyone who wants the widget to pop a while after the website loads.
Hope it helps you!
<script type="text/javascript">
window.setTimeout(function() {
zE(function(){
zE('messenger', 'open');
});
//You can add more APIs on this line
}, 10000); //time’s in milliseconds - 10 seconds = 100000
</script>
<script type="text/javascript">
window.setTimeout(function() {
zE(function(){
zE('messenger', 'open');
});
//You can add more APIs on this line
}, 10000); //time’s in milliseconds - 10 seconds = 100000
</script>
Related
I have updating results data in four Sheets within a Google Sheets spreadsheet. I want to display the live contents of each sheet in turn on an external display (screen/projector), with an update rate of 10 to 15 seconds between each change of sheet. I've been unable to find any complete solution to this.
Things I've looked at:
Copy the data from each page into Google Slides, maintaining live data update. Then publish the four slides, specifying a refresh rate. This works, but it doesn't update the Slides publication when data in the source Sheets changes. You have to go into Slides and do a manual refresh. Then you also have to refresh the webpage displaying the published slides. It does work, but I really want the displays to update as soon as data in the Sheets are updated.
Display the Google Sheets themselves, with a mechanism to select each sheet in turn every 10 seconds. This felt do-able, with a bit of AppsScript Java I can select individual sheets. Issues with this are I've been unable to resolve are the the minimum timer for a trigger is 1 minute, and I've been unable to get a Triggered function to select the sheets. I think the context for a Trigger may prevent this working.
Use 'something else' to extract the data from the Google Sheet, and create the live updating displays. I've been unable to find anything that would do this. I suspect someone with much better web coding than mine could achieve it, but I'm trying not to get too complicated.
Any suggestions greatfully received.
You can create a local HTML file, show the spreadsheet inside an iframe and change the iframe-URL to the next
sheet every 15 seconds. This way, instead of using GAS triggers, the page gets updated using local JavaScript, so
you dont have to wait 1 minute.
Save the next code as an HTML file.
Update the spreadsheetUrl and sheetIds variables
Open the file in a browser (I recommend Firefox)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<iframe id="iframe1" src="" style="position:fixed; top:0; left:0; bottom:0; right:0; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;"> Your browser doesn't support iframes
</iframe>
</body>
<script>
var spreadsheetUrl = "https://docs.google.com/spreadsheets/d/123/edit#gid=";
var sheetIds = ["12345", "23456", "34567", "45678"];
var currentSheet = 0; //0-3
var myIframe = document.getElementById("iframe1");
// Initializes iframe
myIframe.src = spreadsheetUrl + sheetIds[currentSheet];
// Updates iframe very 10,000 milliseconds
setInterval(function() {
// Increases sheet
currentSheet++;
// If 4th sheet has been shown, then go back to 1st sheet
if (currentSheet > 3)
currentSheet = 0;
// Updates iframe
myIframe.src = spreadsheetUrl + sheetIds[currentSheet];
}, 10000);
</script>
</html>
Currently I have to press a on the top right-hand corner of the map to show my current location (it is the little person in the picture), is there a way for when the map load it automatically shows your location? I attached the code as well and a picture to explain. Thanks, I apologize in advance for my lack of knowledge.
<html>
<head>
<script src="http://open.mapquestapi.com/sdk/js/v7.0.s/mqa.toolkit.js?key=Kmjtd%7Cluua2qu7n9%2C7a%3Do5-lzbgq"></script>
<script type="text/javascript">
/*An example of using the MQA.EventUtil to hook into the window load event and execute defined function
passed in as the last parameter. You could alternatively create a plain function here and have it
executed whenever you like (e.g. <body onload="yourfunction">).*/
MQA.EventUtil.observe(window, 'load', function() {
/*Create an object for options*/
var options={
elt:document.getElementById('map'), /*ID of element on the page where you want the map added*/
zoom:13, /*initial zoom level of map*/
latLng:{lat:40.735383, lng:-73.984655}, /*center of map in latitude/longitude*/
mtype:'osm' /*map type (osm)*/
};
/*Construct an instance of MQA.TileMap with the options object*/
window.map = new MQA.TileMap(options);
MQA.withModule('geolocationcontrol', function() {
map.addControl(
new MQA.GeolocationControl()
);
});
});
</script>
</head>
<body>
<div id='map' style='width:750px; height:280px;'></div>
</body>
</html>
Based on the documentation, you could try calling activate on the geolocation control after you create it.
If that does not cause a re-center/zoom then you may need to register a handler for the onLocate callback (also in the control). When your callback is called you can manually re-center/zoom the map.
Bear in mind that geolocation can be very inaccurate, doing it automatically will probably annoy users for whom that is the case.
Note: JS/Jquery noob alert (yes, me)
There seems to be a conflict between the following two plugins:
TableSorter (2.9.1)
bootstrap-popover.js v2.2.1
The plugins work as they should separately, but when together, the popovers don't work. I've tried moving the calls to the popover script (and its initialization) before any other plugins, but no dice. I have a feeling the tablesorter script is somehow removing the titles from the DOM (another subject I know little about) before the popover script can load, but no dice.
In my HTML
<script src="../../js/jquery-1.8.2.min.js"></script>
<script src="../../js/jquery.tablesorter.js"></script>
<script src="../../js/jquery.tablesorter.pager.js"></script>
<script src="../../js/tooltips-popovers.js"></script>
<script>
$(function(){
$("#stats").tablesorter();
});
</script>
<script>
$("a[rel=popover]").popover({html:true,trigger:'hover'});
</script>
<script> /* Initiate pager */
$(function(){
var pagerOptions = {
container: $(".pager"),
};
$("table")
.tablesorterPager(pagerOptions);
});
</script>
Make sure you are initializing the popover script within a document ready event.
$(function(){
$("a[rel=popover]").popover({html:true,trigger:'hover'});
$("#stats")
.tablesorter()
.tablesorterPager({
container: $(".pager")
})
});
If that doesn't work, I can only guess that the popover links are inside the table? If so, they are added and removed dynamically, when sorting the table, so they might need to be added through a delegated event, the code above may not work in that case.
Update: As stated, the popup links are within the th, which I assume are in the thead? If so, try this code:
$(function(){
$("#stats")
.tablesorter({
initialized: function(table){
$("a[rel=popover]").popover({html:true,trigger:'hover'});
}
})
.tablesorterPager({
container: $(".pager")
})
});
I have created a simple .toggle script on one page to toggle a DIV. But when I put this exact same script on another page to toggle another DIV the second page script fails... I have tried multiple fixes but nothing works
Here is the script I am using on both pages The IDs are different but the script is the same
<script>
$(document).bind('pageinit', function() {
$('#slick-toggle').live('tap', function(event) {
$("#menu_box").toggle(400);
});
});
</script>
Any help would be greatly appreciated
Capt. Crunch
You may try the following:
<script>
$( document ).on( 'pageinit',function(event){
$('#slick-toggle').on('tap', function(event) {
$("#menu_box").toggle(400);
});
});
</script>
Hope this helps, let me know about your result.
I used zWeatherFeed to show weather, but I cant find any example to change options.
<style>
.weatherItem{padding-left:200px;}
.odd{height:130px;}
.weatherCity{font-weight:bold;}
.weatherFeed{height: 130px; width: 100%;}
</style>
<script type="text/javascript">
$(document).ready(function () {
$('#test').weatherfeed(['TUXX0015']);
});
</script>
<div id="test">
</div>
For example I want to show next day too. Is there any example about this weather plugin or any alternative weather plugin? I prefer to use zWeatherFeed because This plugin has great visualization.
Thanks.
The zWeatherFeed plugin is not able to show the next day's forecast at present (although provides a link for a full forecast). The available options are:
unit - Specifies the units to return: 'c' - celsius, 'f' - fahrenheit
image - If true, displays an image of the weather condition in the
background.
highlow - If true, includes the high and low values in each item.
wind - If true, includes the wind direction and strength in each
item.
link - If true, includes the link to full forecast on the Yahoo!
website.
showerror - If true, displays a message if the feed is unavailable or
the location is invalid.
linktarget - Specifies the target for forecast links ('_blank',
'_self', '_top', framename).
woeid - If true, uses Yahoo! WOEID indentifiers for locations
http://www.zazar.net/developers/jquery/zweatherfeed/
<script type="text/javascript">
$(document).ready(function () {
$('#weatherDiv').weatherfeed(['EIXX0048'], {
forecast: true
});
});
</script>
If you add the option
forecast:true
to the options for the function and it will show the forecast for the next 5 days. An full example can be seen at:
http://www.zazar.net/developers/jquery/zweatherfeed/example_forecast.html