cordova - How do I prevent InAppBrowser from auto running with AngularJS $route? -
my app running cordova angularjs routing. need inappbrowser plugin view pdfs. however, since ngroute calls html on route change inappbrowser called.
i need run on button click not everytime.
-- edit --
when have cordova inappbrowser plugin installed white screen , message regarding white list issue regarding inital route "index.html":
$routeprovider .when('/', { //load home @ start controller: 'homecontroller homeslides', templateurl: 'content/home.html', resolve: { // cause 1 second delay delay: function ($q, $timeout) { var delay = $q.defer(); $timeout(delay.resolve, 1000); var dl = document.getelementbyid('door-left'); var dr = document.getelementbyid('door-right'); dl.classlist.remove('open'); dr.classlist.remove('open'); return delay.promise; } } }) if uninstall plugin issue resolved.
-- edit -- error i'm getting:
html1300: navigation occurred. [object object] apphost9623: app couldn’t resolve ms-appx://25052ninjadrew.nanosales/www/[object object] because of error: resource_not_found. apphost9613: app couldn’t navigate ms-appx://25052ninjadrew.nanosales/www/[object object] because of error: 80004005. new transaction waiting open operation html1527: doctype expected. consider adding valid html5 doctype: "<!doctype html>". [object object] (1,1) dom7011: code on page disabled , forward caching. more information, see: http://go.microsoft.com/fwlink/?linkid=291337 index.html -- edit --
for client reasons can't show of html but...
<!doctype html> <html ng-app="nanoapp" class="test"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0"> <link rel="stylesheet" href="css/main.css"> <script src="js/winstore-jscompat.js"></script> <script src="js/min/iscroll-min.js"></script> <script src="js/angular.min.js"></script> <script src="js/ngroute.min.js"></script> <script src="js/angular-sanitize.js"></script> <script src="js/ng-cordova.min.js"></script> <script src="cordova.js"></script> <script src="js/database.js"></script> <script src="js/angular-script.js"></script> </head> <body class="{{bodyclass}}"> <div id="door-left" style="background-image:url('img/trans-left.png');" class="loading door-left" ></div> <div id="door-right"style="background-image:url('img/trans-right.png');" class="loading door-right" ></div> <div id="nav"> <ul> <li><span id="menu-cls" class="ion-close-round"></span></li> <li><a href="#/"><div class="ion-grid"></div>home</a></li> <li><a href="#/products"><div class="ion-grid"></div>products</a></li> <li><a href="#/installations"><div class="ion-grid"></div>installations</a></li> <li><a href="#/installations/videos"><div class="ion-grid"></div>videos</a></li> <li><a href="#/installations/favorites"><div class="ion-grid"></div>favorites</a></li> <li><a href="#/marketing"><div class="ion-grid"></div>marketing materials</a></li> </ul> </div> <div id="head"> <div id="left-head"> <div id="menu-btn"></div> <img src="img/header-left-x2.png" /> <div class="filler"></div> </div> <div id="middle-head"> <a style="display:block;" href="#/"><div id="logo"></div></a> </div> <div id="right-head"> <img src="img/header-right-x2.png" /> </div> <div class="swipe-indicator"><span class="ion-chevron-left three"></span><span class="ion-chevron-left two"></span><span class="ion-chevron-left one"></span> swipe <span class="ion-chevron-right one"></span><span class="ion-chevron-right two"></span><span class="ion-chevron-right three"></span></div> </div> <div id="content" class="scroller" ng-view> </div> <div id="footer"> <ul id="footer-btns"> <li><a href="#/products/" class="products"></a></li> <li><a href="#/installations/" class="installations"></a></li> <li><a href="#/installations/videos" class="videos"></a></li> <li><a href="#/installations/favorites" class="favorites"></a></li> </ul> <div class="filler"></div> <img src="img/bottom-bar-x2.png" class="bottom-bar" /> </div> <!-- gallery popup --> <div id="gallery-container" ng-show="opengallery"> <div class="ion-close-round close-gallery" ng-click="closegallery()"></div> <div id="left-arrow" class="arrow" ng-click="prevslide()" ng-show="gallerycount > 1"></div> <div id="slide-container"> <div id="slides"> <div class="slide" ng-repeat="slide in gallery" ng-switch on="gallerytype" video-setup> <!-- image template--> <img ng-src="{{slide.file}}" ng-switch-when="image" /> <!-- video template--> <video class="video" style="width:845px;height:635px;" controls autoplay ng-switch-when="video"> <source ng-src="{{slide.file}}" type='video/mp4' /> </video> </div> </div> </div> <div id="slide-marker-container" ng-show="gallerycount > 1"> <ul id="slide-markers"> <li ng-repeat="marker in gallerymarkers(gallerycount) track $index" marker-setup> <div ng-click="scrolltoslide({{$index}})"></div> </li> </ul> </div> <div id="right-arrow" class="arrow" ng-click="nextslide()" ng-show="gallerycount > 1"></div> </div> <script src="js/jquery.min.js"></script> <script src="js/stellar.min.js"></script> <script src="js/main.js"></script> </body> </html> home.html:
<div id="home" set-iscroll home-setup class="container paralax"> <a href="#/productslist/0" class="section"> <div style="background-image:url('img/home/slim-home-bkg.jpg');" class="bkg"></div> <div style="background-image:url('img/home/slim-title.png');" class="element layer1" data-stellar-ratio="1.3"></div> <div id="slim-holt-top" class="indicator"><div style="background-image:url('img/home/slim-holt-top.png');" class="element title" data-stellar-ratio="1.3"></div></div> <div id="slim-lv-top" class="indicator"><div style="background-image:url('img/home/slim-lv-top.png');" class="element layer2" data-stellar-ratio="1.7" data-stellar-ratio="2"></div></div> <div id="slim-mel-top" class="indicator"><div style="background-image:url('img/home/slim-mel-top.png');" class="element layer3" data-stellar-ratio="1.3"></div></div> <div id="slim-avyve-top" class="indicator"><div style="background-image:url('img/home/slim-avyve-top.png');" class="element layer4" data-stellar-ratio="1.2"></div></div> </a> <a href="#/productslist/1" class="section"> <div style="background-image:url('img/home/curve-home-bkg.jpg');" class="bkg"></div> <div style="background-image:url('img/home/curve-title.png');" class="element title" data-stellar-ratio="1.3"></div> <div id="curve-aig-top" class="indicator"><div style="background-image:url('img/home/curve-aig-top.png');" class="element layer1" data-stellar-ratio="1.7"></div></div> <div id="curve-illy-top" class="indicator"><div style="background-image:url('img/home/curve-illy-top.png');" class="element layer2" data-stellar-ratio="1.5" data-stellar-ratio="2"></div></div> <div id="curve-minn-top" class="indicator"><div style="background-image:url('img/home/curve-minn-top.png');" class="element layer3" data-stellar-ratio="1.2"></div></div> </a> <a href="#/productslist/2" class="section"> <div style="background-image:url('img/home/clear-home-bkg.jpg');" class="bkg"></div> <div style="background-image:url('img/home/clear-title.png');" class="element title" data-stellar-ratio="1.3"></div> <div id="clear-top" class="indicator"><div style="background-image:url('img/home/clear-top.png');" class="element layer1" data-stellar-ratio="1.5"></div></div> </a> <a href="#/productslist/3" class="section"> <div style="background-image:url('img/home/wrap-home-bkg.jpg');" class="bkg"></div> <div style="background-image:url('img/home/wrap-title.png');" class="element title" data-stellar-ratio="1.3"></div> <div id="wrap-eaton-top" class="indicator"><div style="background-image:url('img/home/wrap-eaton-top.png');" class="element layer2" data-stellar-ratio="1.2"></div></div> <div id="wrap-gte-top" class="indicator"><div style="background-image:url('img/home/wrap-gte-top.png');" class="element layer3" data-stellar-ratio="1.5"></div></div> </a> <a href="#/productslist/4" class="section"> <div style="background-image:url('img/home/slimengage-home-bkg.jpg');" class="bkg"></div> <div style="background-image:url('img/home/slimengage-title.png');" class="element title" data-stellar-ratio="1.3"></div> <div id="slimengage-screen" class="indicator"><div style="background-image:url('img/home/slimengage-screen.png');" class="element layer1" data-stellar-ratio="1.1"></div></div> <div id="slimengage-blueppl" class="indicator"><div style="background-image:url('img/home/slimengage-blueppl.png');" class="element layer2" data-stellar-ratio="1"></div></div> <div id="slimengage-colorppl" class="indicator"><div style="background-image:url('img/home/slimengage-colorppl.png');" class="element layer3" data-stellar-ratio="1.5"></div></div> </a> </div>
Comments
Post a Comment