src/App.js
/**
   * Retrieves incoming messages
   * from websocket connection
   * @param {Object} event 
   */
Retrieves incoming messages
from websocket connection
@param {Object} event
Retrieves incoming messages from websocket connection @param { Object } event
messageRecieved(event) {
    if (event && event.data) {
      let data = JSON.parse(event.data);
      if (this.battleBots && this.battleBots.length > 0 && data.length !== this.battleBots.length) { this.images.loaded = false; }
      if (data.length > 0 && !this.images.loaded) {
        MarvelAPI('characters', {
          publicKey: secrets.publicKey,
          privateKey: secrets.privateKey,
          timeout: 4000,
          query: {
            limit: 100,
            offset: Math.floor(Math.random() * 200) + 1
          }
        }, (err, body) => {
          if (err) {
            this.battleBots = data;
            this.battleBots.map(bot => { bot.pic = "http://via.placeholder.com/350x200"; return bot })
            this.setState({ battleBots: this.battleBots, info: "Unable to load images. Will retry in 5 minutes" })
          }
          else {
            let index_selected = []
            this.battleBots = data;
            this.battleBots.forEach((bot, idx, arr) => {
              let image
              for (let i = 0; i < body.data.results.length; i++) {
                image = body.data.results[i].thumbnail.path.split('/')[10]
                if (image !== "image_not_available" && image !== "4c002e0305708" && !index_selected.includes(i)) {
                  index_selected.push(i);
                  bot.pic = body.data.results[i].thumbnail.path + "/landscape_incredible." + body.data.results[i].thumbnail.extension;
                  this.images.storage.push(bot.pic)
                  break;
                }
              }
            });
            this.images.loaded = true;
            this.battleBots = _.orderBy(this.battleBots, ["longed"], ["desc"])
            this.setState({ battleBots: this.battleBots })
          }
        })
      } else {
        this.images.storage.forEach((pic, idx) => { this.battleBots[idx].pic = pic })
        this.battleBots = _.orderBy(this.battleBots, ["longed"], ["desc"])
        this.setState({ battleBots: this.battleBots })
      }
    }
  }
messageRecieved ( event ) { if ( event && event . data ) { let data = JSON . parse ( event . data ) ; if ( this . battleBots && this . battleBots . length > 0 && data . length !== this . battleBots . length ) { this . images . loaded = false ; } if ( data . length > 0 && ! this . images . loaded ) { MarvelAPI ( 'characters' , { publicKey : secrets . publicKey , privateKey : secrets . privateKey , timeout : 4000 , query : { limit : 100 , offset : Math . floor ( Math . random ( ) * 200 ) + 1 } } , ( err , body ) => { if ( err ) { this . battleBots = data ; this . battleBots . map ( bot => { bot . pic = "http://via.placeholder.com/350x200" ; return bot } ) this . setState ( { battleBots : this . battleBots , info : "Unable to load images. Will retry in 5 minutes" } ) } else { let index_selected = [ ] this . battleBots = data ; this . battleBots . forEach ( ( bot , idx , arr ) => { let image for ( let i = 0 ; i < body . data . results . length ; i ++ ) { image = body . data . results [ i ] . thumbnail . path . split ( '/' ) [ 10 ] if ( image !== "image_not_available" && image !== "4c002e0305708" && ! index_selected . includes ( i ) ) { index_selected . push ( i ) ; bot . pic = body . data . results [ i ] . thumbnail . path + "/landscape_incredible." + body . data . results [ i ] . thumbnail . extension ; this . images . storage . push ( bot . pic ) break ; } } } ) ; this . images . loaded = true ; this . battleBots = _ . orderBy ( this . battleBots , [ "longed" ] , [ "desc" ] ) this . setState ( { battleBots : this . battleBots } ) } } ) } else { this . images . storage . forEach ( ( pic , idx ) => { this . battleBots [ idx ] . pic = pic } ) this . battleBots = _ . orderBy ( this . battleBots , [ "longed" ] , [ "desc" ] ) this . setState ( { battleBots : this . battleBots } ) } } }
Retrieves incoming messages
 from websocket connection
 @param {Object} event
Retrieves incoming messages from websocket connection @param { Object } event