CODEWITHSUNDEEP
javascriptandroidionic-framework
Dimitrios Desyllas
Dimitrios Desyllas

Reputation: 10030

Ionic does not show Images

I have the following project https://github.com/pc-magas/faster/tree/master

And for some reason On the browser on the game screen on Browser (via ionic serve) seems like that: Image Ionic serve

But on my device seem like this:

Image Smartphone

The html for images is loaded on this file https://github.com/pc-magas/faster/blob/master/www/js/services.js by passing them as parameters (sorry for tabs the copy paste from github is shown like that).

function GameItem(icon,icon_destroyed,icon_marked,name)
      {
        var item=this;

        item.icon=icon;//Icon for the normal situations
        item.icon_destroyed=icon_destroyed;//Icon if the item is Destroyed
        item.icon_marked=icon_marked;//Icon when the item is selected

        /*
        *A Characteristic name of the itemYourFactory
        *It can Be used for comparisons ;)
        */
        item.name=name;

        /**
        *For now takes 2 values:
        *start if the Item is not destroyed
        *destroyed if the item in destroyed
        *whatever dtatus you want
        */
        item.status="start";

        /**
        *The position of the Item
        *Check if you need it
        */
        item.posistion={x:0,y:0};

        /**
        *Clone the Object (used for Initialization)
        */
        item.clone=function()
        {
          return new GameItem(item.icon,item.icon_destroyed,item.icon_marked,item.name)
        }

        /**
        *Check if this item is equal with another one
        */
        item.equals=function(other)
        {
          return other.name===item.name;
        };

        /**
        *Gets The icon regarding the status of the Item is
        */
        item.getIcon=function()
        {
          var icon="";
          //Add here the status of the
          switch(item.status)
          {
            case 'destroyed':
              icon=item.icon_destroyed;
            break;

            case 'start':
              icon=item.icon;
            break;

            default:
              icon=item.icon;
          }
          return icon;
        }
      };//End of Item Class

And I Initialize the Game Items in this file https://github.com/pc-magas/faster/blob/master/www/js/controllers.js at Game controller:

/**
*Items for the Game
*/
var items=[new GameItem('../img/icon1.jpg','../img/icon1.jpg','../img/icon1.jpg','trolley'),new GameItem('../img/icon2.jpg','../img/icon2.jpg','../img/icon2.jpg','metro'),new GameItem('../img/icon3.jpg','../img/icon3.jpg','../img/icon3.jpg','bus'),new GameItem('../img/icon4.jpg','../img/icon4.jpg','../img/icon4.jpg','tram'),];

But I do not know why this happens and how can be fixed.

PS. I build it by running:

ionic build android

And I install it by:

adb install /home/pcmagas/Kwdikas/Javascript/Ionic/Faster/platforms/android/build/outputs/apk/android-debug.apk

Upvotes: 1

Views: 1458

Answers (1)

Dimitrios Desyllas
Dimitrios Desyllas

Reputation: 10030

I just replaced the:

../img/icon1.jpg with img/icon1.jpg

And worked like a charm

Upvotes: 1

Related Questions