mirror of
https://github.com/internetarchive/brozzler.git
synced 2025-09-20 12:44:40 -04:00
Making scrolling and image loading more tolerant of slow loading.
This commit is contained in:
parent
cdcef934e7
commit
ce47461656
1 changed files with 44 additions and 28 deletions
|
@ -4,12 +4,13 @@
|
||||||
//
|
//
|
||||||
|
|
||||||
var umbraInstagramBehavior = {
|
var umbraInstagramBehavior = {
|
||||||
IDLE_TIMEOUT_SEC: 10,
|
IDLE_TIMEOUT_SEC: 20,
|
||||||
idleSince: null,
|
idleSince: null,
|
||||||
state: "loading-thumbs",
|
state: "loading-thumbs",
|
||||||
imageCount: null,
|
imageCount: null,
|
||||||
bigImagesLoaded: 0,
|
bigImagesLoaded: 0,
|
||||||
latestBigImage: null,
|
currentBigImage: null,
|
||||||
|
previousBigImage: null,
|
||||||
|
|
||||||
intervalFunc: function() {
|
intervalFunc: function() {
|
||||||
if (this.state === "loading-thumbs") {
|
if (this.state === "loading-thumbs") {
|
||||||
|
@ -31,15 +32,18 @@ var umbraInstagramBehavior = {
|
||||||
console.log("nothing to do at the moment, might be waiting for something to load, setting this.idleSince=Date.now()");
|
console.log("nothing to do at the moment, might be waiting for something to load, setting this.idleSince=Date.now()");
|
||||||
this.idleSince = Date.now();
|
this.idleSince = Date.now();
|
||||||
return;
|
return;
|
||||||
} else if (Date.now() - this.idleSince > 3000) {
|
} else {
|
||||||
console.log("finished loading-thumbs, it appears we have reached the bottom");
|
var doneButtons = document.querySelectorAll(".PhotoGridMoreButton.pgmbDisabled");
|
||||||
this.state = "clicking-first-thumb";
|
if (Date.now() - this.idleSince > 9000 || (doneButtons.length > 0 && doneButtons[0].innerText === "All items loaded") ) {
|
||||||
this.idleSince = null;
|
console.log("finished loading-thumbs, it appears we have reached the bottom");
|
||||||
return;
|
this.state = "clicking-first-thumb";
|
||||||
} else {
|
this.idleSince = null;
|
||||||
// console.log("still might be waiting for something to load...");
|
return;
|
||||||
return;
|
} else {
|
||||||
}
|
// console.log("still might be waiting for something to load...");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.state === "clicking-first-thumb") {
|
if (this.state === "clicking-first-thumb") {
|
||||||
|
@ -61,26 +65,38 @@ var umbraInstagramBehavior = {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.state === "waiting-big-image") {
|
if (this.state === "waiting-big-image") {
|
||||||
var imageFrame = document.querySelectorAll("div.Modal div.Item div.iMedia div.Image");
|
if(this.currentBigImage == null) {
|
||||||
if (imageFrame.length > 0) {
|
var imageFrame = document.querySelectorAll("div.Modal div.Item div.iMedia div.Image");
|
||||||
var bigImage = new Image();
|
if (imageFrame.length > 0 && imageFrame[0].getAttribute("src") !== this.previousBigImage ) {
|
||||||
bigImage.src = imageFrame[0].getAttribute("src");
|
this.currentBigImage = new Image();
|
||||||
// console.log("bigImage.naturalWidth=" + bigImage.naturalWidth + " bigImage.src=" + bigImage.src);
|
this.currentBigImage.src = imageFrame[0].getAttribute("src");
|
||||||
if (bigImage.src !== this.latestBigImage && bigImage.naturalWidth !== 0) {
|
//console.log("this.currentBigImage.naturalWidth=" + this.currentBigImage.naturalWidth + " this.currentBigImage.src=" + this.currentBigImage.src);
|
||||||
console.log("next big image appears loaded, will click right arrow next time");
|
|
||||||
this.state = "click-next-big-image";
|
|
||||||
this.latestBigImage = bigImage.src;
|
|
||||||
this.bigImagesLoaded++;
|
|
||||||
this.idleSince = null;
|
|
||||||
return;
|
return;
|
||||||
}
|
} else if(this.idleSince == null ) {
|
||||||
}
|
console.log("waiting for image frame to load");
|
||||||
if (this.bigImagesLoaded >= this.imageCount) {
|
this.idleSince = Date.now();
|
||||||
console.log("looks like we're done, we've loaded all " + this.bigImagesLoaded + " of " + this.imageCount + " big images");
|
return;
|
||||||
this.state = "finished";
|
}
|
||||||
|
} else if (this.currentBigImage.src !== this.previousBigImage && this.currentBigImage.naturalWidth !== 0) {
|
||||||
|
console.log("next big image appears loaded, will click right arrow next time");
|
||||||
|
this.state = "click-next-big-image";
|
||||||
|
this.previousBigImage = this.currentBigImage.src;
|
||||||
|
this.currentBigImage = null;
|
||||||
|
this.bigImagesLoaded++;
|
||||||
|
this.idleSince = null;
|
||||||
|
|
||||||
|
if (this.bigImagesLoaded >= this.imageCount) {
|
||||||
|
console.log("looks like we're done, we've loaded all " + this.bigImagesLoaded + " of " + this.imageCount + " big images");
|
||||||
|
this.state = "finished";
|
||||||
|
this.idleSince = Date.now();
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
} else if(this.idleSince == null) {
|
||||||
|
console.log("Waiting for big image to load");
|
||||||
this.idleSince = Date.now();
|
this.idleSince = Date.now();
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.state === "click-next-big-image") {
|
if (this.state === "click-next-big-image") {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue