CODEWITHSUNDEEP
web-applicationsframeworkszeptoappjsphotoviewer
Abdul Qadir
Abdul Qadir

Reputation: 43

Usinf App.js Framework and trying to use photoviewer but App.load is conflicting

Hello please review below code i am using App.js framework to create a mobile web app and i want to show photo viewer when user clicks on some button. but i am unable to do so, the thing is App.load event may be is conflicting because i am using it twice, one for 'viewer' and one for 'Home', please tell e what can i do with viewer to make it load on button click, remember this is the framework using zepto (https://zeptojs.com/). and the code is this... ` 

    App.controller('home', function (page) {
    // put stuff here
  });

  App.controller('page2', function (page) {
    // put stuff here
  });
    App.controller('page3', function (page) {
    // put stuff here
  });

    App.controller('page4', function (page) {
    // put stuff here
  });

    // in your js
    App.controller('viewer', function (page, data) {
        var photoViewer = new PhotoViewer(page, data.urls);
   });        
    // to use the viewer
    App.load('viewer', {
      urls: [
        'images/exercise1pg1.jpg',
        'images/exercise1pg2.jpg',
        'images/exercise1pg1.jpg',
        'images/exercise1pg2.jpg',
        'images/exercise1pg1.jpg'
      ]
    });
         try {
            App.restore(); 
          } catch (err) {
            App.load('home');
          }        
</script>`

Upvotes: 0

Views: 22

Answers (1)

Apython
Apython

Reputation: 453

You are using the demo example which is refering to the argument 'page' as "viewer". Accroding to your code, however, you decided to call the page 'home' (alternatively page2, page3, page4). If you want PhotoViewer to run on your page simply substitute 'viewer' in App.controller() and in App.load() with the 'page' name e.g. 'home' like this:

App.controller('home', function (page, data) {
        var photoViewer = new PhotoViewer(page, data.urls); 
}); 

App.load('home', {
      urls: [
        'images/exercise1pg1.jpg',
        'images/exercise1pg2.jpg',
        'images/exercise1pg1.jpg',
        'images/exercise1pg2.jpg',
        'images/exercise1pg1.jpg'
      ]
    });

Upvotes: 0

Related Questions