URL changes but will not refresh the page - html

I use a software called Bookee and they run our scheduling features. Right now the website has submenus and when you click the one it will change the url but not refresh the page. I do not know anything about coding and was told the issue was in this code. How do I fix it and can anyone explain why the url changes but doesn't refresh the page.
Here is a link to the code in the elementor system within Wordpress. https://d.pr/i/3dzf4e
<div id="studioyou-embed"></div>
<script>
const date = Date.now();
const xscript = document.createElement("script");
xscript.setAttribute("src",https://graysanatomyacademy.onbookee.com/embed/index.js?t=${date});
const embedContainer = document.querySelector("body");
xscript.onload = function () {new StudioYouEmbed('graysanatomyacademy.onbookee.com');};
embedContainer.appendChild(xscript);

ayo pretty sure it's cause you never ended the script with a Im not sure if this is all your code tho. This is a fixed version.
<div id="studioyou-embed"></div>
<script>
const date = Date.now();
const xscript = document.createElement("script");
</script>
how did you do this without coding knowledge lol

Related

Prefetch script from server (not from cache) for next time

If browser has a cached version of a JS file, I want it to be loaded and executed.
I also want this cache to be refreshed with a fresh copy from the server after each execution.
<script src="script.js"></script> <!-- cache-control: private, max-age=86400 -->
script.js
var prefechscript = document.createElement('link');
prefechscript.href = 'script.js';
prefechscript.rel = 'prefetch';
prefechscript.as = 'script';
document.head.appendChild(prefechscript);
But this method does not work because the browser prefetch from cache.
Would you have a way to achieve this?
I wish <link> has an attribute fetch-from-server, so it will always pull a copy from server and store it in cache if server respond with a cache-control.
I am looking to have a solution at least for Chrome.
Edit:
In my case, the URL of the script tag <script src="script.js"></script> cannot be changed.
If you change the URL of a resource that was cached you will receive a new version. A simple way is to use the current time to do this:
const prefetchscript = document.createElement('link');
prefetchscript.href = 'script.js';
prefetchscript.rel = 'prefetch';
prefetchscript.as = 'script';
document.head.appendChild(prefetchscript);
window.setTimeout( ()=>{ let now = new Date(); prefetchscript.href = 'script.js?t='+ now.getTime(); } );

Is there a way to get new Data on HTML without restarting the server?

I have a problem with my node.js express Server. I got an audio file. Every 5 seconds my raspberry pi records another audio file with the same name. This audio file should run on my website. My website refreshes every 10sec, but the audio file which is played stays the same. How can I have the latest Audiofile played?
Here's my HTML:
e meta http-equiv="refresh" content="10"/> !-- Refreshes every 10 seconds -->
/head> body background="bg.png" >
<audio autoplay><source src="Aufnahme.wav" type="audio/wav"/></audio>
</body>
</html>
(I know I don't have some "<" but it appears to not work here and I don't know the Escape signs)
And this is my Node.js Code, I'm also using express.
var res = require('http');
var express = require('express');
var app = express();
var fs = require('fs');
app.use(express.static('www'));
var server = app.listen(8000, function () {
var host = server.address().address;
var port = server.address().port;
console.log('Express app listening at http:\/\/%s:%s', host, port);
});
I think it is something about my Nodejs, can someone help me pls? Or didn't I grasp some concept of Server/Client?
Sorry I'm new to this
Maybe your audio file is in browser cache...
So one idea is to simulate a versionning of your audio file...
For exemple in your code, genere a new Id call 'myNewId'.
In you html
<audio autoplay><source src="Aufnahme.wav?${YOU PUT YOU NEW ID HERE DEPENDING YOUR TEMPLATE ENGINE}" type="audio/wav"/></audio>

Print Screen to Website [duplicate]

This question already has answers here:
Using HTML5/Canvas/JavaScript to take in-browser screenshots
(7 answers)
Closed 9 years ago.
My user need to screen shot their error message throw my website. They should directly paste from clipboard in my website instead convert the jpeg. Preferable browser is Firefox. I try to use ZeroClipBoard but it works for words not images. Appreciated if anyone could advice and share any links for references.
Simple answer: you can't. There is no web-standards way to read binary data from the clipboard, I also do not believe that Flash or Silverlight does this either (Flash can expose bitmap data from the clipboard, but only under AIR, i.e. not in a browser context).
You could write a small desktop utility program that your users download and run, which will take a screenshot and upload it for them, but without that your users will have to paste the image into Paint, save to disk, and upload with an <input type="file">.
I'm not sure of the compatibility with mozilla but you should look at the onpaste event
https://developer.mozilla.org/en-US/docs/Web/API/element.onpaste
and event.clipboarddata
http://www.w3.org/TR/clipboard-apis/
Cross compatibility is probably is probably going to be an issue.
You can look at the source for wordpress plugin Image Elevator http://wordpress.org/plugins/image-elevator/
Look at admin/assests/js/image-elevator-global.js for ideas.
After looking at the plugin I got the following code to work. It reloads the page image with whatever you paste. Works on chrome but not firefox.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
document.onpaste = function (e) {
var items = e.clipboardData.items;
for (var i = 0; i < items.length; ++i) {
// uploads image on a server
var img = items[i].getAsFile();
var oData = new FormData();
oData.append('file', img);
var req = new XMLHttpRequest();
req.open("POST", "test-pastup.php");
req.onreadystatechange = function() {
setTimeout(function() {
var img = $('img').clone();
$('img').remove();
$('body').prepend(img);
}, 100);
}
req.send(oData);
return;
}
}
</script>
</head>
<body>
<img src="aaa.png" />
<input/>
</body>
</html>
for the server side - test-pastup.php
<?php
$source = $_FILES['file']['tmp_name'];
move_uploaded_file( $source, 'aaa.png' );
?>

Popup keeps showing up on iPad because it won't accept cookies

I have made a popup that is meant to load when my website loads.
I have added a cookie to remember if the user has seen the popup after closing it, so that they are not presented with the popup again. It's working well, apart from on the iPad the popup loads on every single page of the site.
Does anyone know the best way around this?
My cookie code is:
function SetCookie(cookieName,cookieValue,nDays) {
var today = new Date();
var expire = new Date();
if (nDays==null || nDays==0) nDays=1;
expire.setTime(today.getTime() + 3600000*24*nDays);
document.cookie = cookieName+"="+escape(cookieValue)
+ ";expires="+expire.toGMTString();
}
$("#member").click(function(){
SetCookie("subscribed","1");
$( "#Subscribe" ).dialog("close");
return false;
});
Give HTML5 Storage a try! See: http://www.w3schools.com/html/html5_webstorage.asp
// store an item in the localstorage
localStorage.setItem('popup_shown', true);
// get an item from localstorage
var popupShown = localStorage.getItem('popup_shown');

Google App Scripts : Javascript code inside the HTML file not functioning

I have been trying to write a small Google App Script which has the Google+ badge as shown here. For this I have a plain HTML file where I have included the HTML as shown on that page. The HTML page is as follows :
<html>
<body>
<div class="g-plus" data-href="{Page-Link}" data-rel="publisher"></div>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
alert("Added Badge!");
})();
</script>
</body>
</html>
The result is a blank page. There is no badge added to the page . I assume this is because the javascript function is not being run( I added an alert and there wasnt any pop-up ).I am not able to figure out why the function is not being run.
Any help is appreciated.
Unfortunately I'm not too experienced with Javascript so I'm guessing here. I've programmed in coffeescript a while ago and its compiler automatically wraps the generated code in an anonimous function just as in your code. This function is called so:
(function() {//...}).call(this);
Maybe this works.
Alternatively you might want to move the alert test above the badge generation. This would show if the javascript is run at all. Maybe the error lies in your badge creation code.
My final idea would be to name your function and register it as a callback on body.onload . It's always a good idea to let the browser load the page before accessing the dom