在现有的JS项目中迷路

Question

I got into an existing JS project, a sole programmer has been working on it for 6 months and left without much explaining. Anyway it is written in Ionic, and from what I have read and tested, just a tool for building cordova + angular applications. Anyway I got the app deployed on my phone fine, cordova command line and even can get a server with Ionic serve, which is very familiar to other node servers. My problem is developing. I'm used to get the app running on my pc, checking stuff with dev tools, see when and where is a resource being accessed to and more. The app working perfectly normal on my mobile but when getting to the pc I can't get past the login screen with the error "cordova is not defined". Checking the code more it is heavily depended on cordova. What can I do to solve this? Here is a sample code from the project which I run into error on login:

var dir = window.resolveLocalFileSystemURL(cordova.file.dataDirectory, function(dir) {
dir.getDirectory("build/", {create:true}, function(aDir) {
    FS.builds = aDir;
}, FS.fsError);
dir.getDirectory("assets/", {create:true}, function(aDir) {
    FS.assets = aDir;
    App.assetURL = FS.assets.toURL();
    document.dispatchEvent(new CustomEvent("FS-ready", {}));
}, FS.fsError);
}, FS.fsError);

Thanks in advance

Answer 1

The mobile application as MVC (Model-View-Controller) contains two parts:

• Native code (Android - Java/ Obj-C/Swift - iOS) - Model
• Ionic(GUI) + Angular + Cordova - View + Controller

By Cordova interfaces GUI can talk with native part.

When you try to run www as root in browser (apache or similar), it tells you that cordova is not defined since Browser hasn't cordova sources (it stored in mobile assets).

Your application starts on mobile when Cordova is ready that doesn't happen in Browser.

Anyways to run your project in Browser(Chrome ...) since you use Angular, Controllers talk 1st with Services. Create some folder data with json files that simulate responses from mobile native to Angular and instead to call cordova API, call by $http.get your json file.

$ionicPlatform.ready(function() {
  if (ionic.Platform.isAndroid() ) {
     $rootScope.imAndroid = true;
   }
   else if (ionic.Platform.isIOS() ) {
     $rootScope.imiOS = true;
   }
    else{
       $rootScope.imBrowser = true;
    }
} 

in some service:

// load JSON data by async way with promise 
app.factory('Items', ['$http',
    function($http) {

        return {
            getJson: function(url) {
                var ItemsJson = $http.get(url).then(function(response) {
                    return response.data;
                });
                return ItemsJson;
            }
        }
    }
]);

So Example looks like:

self.login = function(){

       if ($rootScope.imBrowser === true) {
             // in Browser we call JSON file
             return Items.getJson('data/loginResponse.json');
        }

       if ( (ionic.Platform.isAndroid() || ionic.Platform.isIOS() )) {  
              // on mobile we call Cordova
              return CordovaService.login();              
         }
   };