Just looking at the way you are doing this, I think it will immediately start returning incorrect album covers as soon as more than one person is using the website at the same time.
2 Likes
xhr ajax looks you done already.
I remember now to get toDataUrl working need to add onload ev on method i told before.
= New Ajax.request
Need to checked it out later. Works or not.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="src/js/jquery-3.4.1.min.js"></script>
</head>
<body>
<img id="img_artwork" width="220" height="277"
src="http://viena.lovestoblog.com/imgEdit/img/edwin.jpg" alt="Lesson">
<script>
function process() {
alert("start");
//var image = document.createElement("img");
//image.src = 'http://viena.lovestoblog.com/imgEdit/img/nowplaying_artwork_2.png';
//var base64file1;
//image.remove();
data=document.getElementById("export").value;
alert(data);
var base64file2 = data;
$("#img_artwork").attr("src", base64file2);
alert("ok");
}
</script>
<h1>HTML DOM Events</h1>
<h2>The onclick Event</h2>
<p>The onclick event triggers a function when an element is clicked on.</p>
<p>Click to trigger a function that will output "Hello World":</p>
<button onclick="myFunction()">Click me</button>
<button onclick="p1()">img Click me</button><br>
<button onclick="process()">Process</button>
<input onkeypress="process()" type="text" id="export" name="export">
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
function p1() {
alert("00");
const toDataURL = url => fetch(url)
.then(response => response.blob())
.then(blob => new Promise((resolve, reject) => {
const reader = new FileReader()
reader.onloadend = () => resolve(reader.result)
reader.onerror = reject
reader.readAsDataURL(blob)
}))
alert("11");
toDataURL('http://viena.lovestoblog.com/imgEdit/img/nowplaying_artwork_2.png')
.then(dataUrl => {
console.log('RESULT:', dataUrl)
document.getElementById("export").value = dataUrl;
})
alert("ok");
}
function px() {
alert("00");
const toDataURL = url => fetch(url)
.then(response => response.blob())
.then(blob => new Promise((resolve, reject) => {
const reader = new FileReader()
reader.onloadend = () => resolve(reader.result)
reader.onerror = reject
reader.readAsDataURL(blob)
}))
alert("ok");
}
</script>
</body>
</html>
no. Its the reverse. So take a look of your timer decay. As you requested its all working before.
Where is your decay function i don’t see it anymore.
OK, yes, the background update of the image isn’t affected by this.
I’m not exactly sure how browser cache and AJAX work together.
I would test it, but the fetch_updater.js because of a Uncaught SyntaxError: illegal character U+2018 on fetch_updater.js:103:31. That line renders as var startDate = new Date(‘1/1/2019’); // this, which doesn’t seem OK.
I browser cache with AJAX works the same as without, then adding any query parameter to the fetch URL should solve it. The elapsed time code you have right now should do the trick, but it seems like you’ve tried a lot of different things so I’m not sure if the code is being hit properly.
Also, having file names per track would really help with this too, then you can just use Javascript to update the image src attribute and the browser will load in the new image. Might be a bit easier than downloading it through Ajax.
3 Likes
Fabulous detective work Admin i wish it had better syntax editor in the editor. I will et you know what happens to update have just removed single quotes replacing with double. I hope it solves this .
The weird thing my cloud is still showing old code how do i clear this in debuger please to get a fresh look ?
Hugs D
I don’t think its getting the base64 still Admin
Let’s keep the discussion in this topic since that’s where most of the posts are in:
4 Likes