Given a list of images, how do I get them to appear in order in JavaScript / HTML? -

-

i building flask app webpage receives list of images (and metadata) in particular order display in grid structure, similar how clothing website shows images of clothing. problem that, currently, images appearing in order of fastest loading and, hence, different order of images each time reload page.

the get_similar_images function receive list of images , function populateimages append image , metadata html.

essentially, not want for loop in get_similar_images move onto next iteration until previous image loaded. appreciate on how implement this!

function populateimages(imageurl, retailer, name, price, retailerurl) {     var block = document.createelement("div");     block.classname = 'image-block';      var img = document.createelement("img");     img.src = imageurl;     img.classname = 'clickable-image';      // link external site     var clickablelink = document.createelement("a");     clickablelink.href = retailerurl;     clickablelink.target = "_blank";     clickablelink.appendchild(img);      // add metadata             var description = document.createelement("div");      var retailername = document.createelement("p");     retailername.classname = 'description-text';     var retailernametext = document.createtextnode(retailer);     retailername.appendchild(retailernametext);     description.appendchild(retailername);      var productname = document.createelement("p");     productname.classname = 'description-text';     var productnametext = document.createtextnode(name);     productname.appendchild(productnametext);     description.appendchild(productname);      var productprice = document.createelement("p");     productprice.classname = 'description-text';     var productpricetext = document.createtextnode('$'+price);     productprice.appendchild(productpricetext);     description.appendchild(productprice);      // resize image     var actualh;     var actualw;     var newh;     var neww;     img.onload = function() {         actualw = this.width;         actualh = this.height;         var newsize = scalesize(300, 300, actualw, actualh);         this.width = newsize[0];         this.height = newsize[1];         block.appendchild(clickablelink);         block.appendchild(description);         document.getelementbyid('imagediv').appendchild(block);     };  }  function get_similar_images(image_name) {     $.ajax({         type: "post",         contenttype: "application/json; charset=utf-8",         url: "/get_similar",         datatype: "json",         async: true,         data: json.stringify({name: image_name}),         success: function(data) {             var image_list = data.images;             var category = data.category;             var retailers = data.retailers;             var names = data.names;             var prices = data.prices;             var urls = data.urls;             (var i=0; i<image_list.length; i++) {                 var url = "static/products/"+category+"/"+image_list[i];                 populateimages(url, retailers[i], names[i], prices[i],                      urls[i])             }         },         error: function(xhr, status, error) {         }     }); }


Comments

Post a Comment

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

-
i trying work entity inside request method of spring boot application. entity in project , pom.xml has dependencies it. why error message?: org.hibernate.unknownentitytypeexception: unable locate persister: com.ric.bill.model.bs.par package com.ric.web; import java.util.concurrent.atomic.atomiclong; import javax.persistence.entitymanager; import javax.persistence.persistencecontext; import net.sf.ehcache.cachemanager; import net.sf.ehcache.management.cache; import net.sf.ehcache.management.cachestatistics; import org.hibernate.stat.statistics; import org.springframework.beans.factory.annotation.autowired; import org.springframework.boot.autoconfigure.domain.entityscan; import org.springframework.cache.annotation.enablecaching; import org.springframework.transaction.annotation.enabletransactionmanagement; import org.springframework.transaction.annotation.propagation; import org.springframework.transaction.annotation.transactional; import org.springframework.web.bind.annotati
Read more

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

-
i implementing go program uses bufio.scanner , bufio.writer have packaged code follows package main import ( "fmt" "player/command" "strings" ) func main() { //enter code here. read input stdin. print output stdout commands.scanner.scan() { //scan new line , send comand variable check command exist or not input := strings.split(strings.trim(commands.scanner.text(), " "), " ") command := input[0] if command == "" { fmt.printf("$ %s:", commands.pwd) continue } if !commands.commands[command] { commands.throwerror("cannot recognize input.") } else { commands.execute(command, input[1:], nil) } fmt.printf("$ %s:", commands.pwd) } } i using init.go file in main package follows package main import ( "flag" "player/sourc
Read more

c - double free or corruption (fasttop) -

-
this code reads null terminated string file (file containing null terminated strings & should provide index wanted string). error: *** error in `./main': double free or corruption (fasttop): 0x090a4a80 *** aborted code: char *tmp_realloc=null; char *sstring=null; int i=1; /*set file pointer point string*/ fseek(fh,index,seek_set); sstring=(char*)malloc(sizeof(char)); if(sstring == null) return null; tmp_realloc=sstring; while( (*(sstring+i-1)=(char)fgetc((file*)fh)) != 0x0 ) { /*reallocate more memory*/ tmp_realloc=(char*)realloc((char*)sstring,++i); /*if not same address copy old new & set old point new*/ if(tmp_realloc != sstring){ strcpy((char*)tmp_realloc,(char*)sstring); free(sstring); sstring=tmp_realloc; } } could tell me pointer causing issue (& reason) ? remove part /*if not same address copy old new & set old point new*/ if(tmp_realloc != sstring){ strc
Read more