I am trying to develop a mobile application with Ionic framework. It works in the web application, but when it is installed in smartphone, it does not work any more.
code index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width" >
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="lib/ngstorage/ngStorage.min.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="http://maps.google.com/maps/api/js?key=AIzaSyAXp19GmxccWT5A5vVgtQK5NHCaZDb_W0I">
</script>
</head>
<body ng-app="phonegp">
<div class="tabs tabs-icon-top">
<a class="tab-item" ui-sref="actualite">
<i class="icon ion-document-text"></i>
Actualité
</a>
<a class="tab-item" ui-sref="contact">
<i class="icon ion-star"></i>
Contact
</a>
<a class="tab-item" ui-sref="geo">
<i class="icon ion-location"></i>
Géo Localisation
</a>
<a class="tab-item" ui-sref="config">
<i class="icon ion-gear-b"></i>
Settings
</a>
</div>
<ion-side-menus>
<ion-side-menu-content>
<ion-nav-bar class="bar-energized">
<ion-nav-back-button></ion-nav-back-button>
<ion-nav-buttons>
<button menu-toggle="left" class="button button-icon ion-navicon"></button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view>
</ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<ion-item menu-close ui-sref="actualite">Actualite</ion-item>
<ion-item menu-close ui-sref="contact">Contact</ion-item>
<ion-item menu-close ui-sref="geo">Géo Localisation</ion-item>
<ion-item menu-close ui-sref="config">Settings</ion-item>
</ion-side-menu>
</ion-side-menus>
</body>
</html>
code app.js
// Ionic Starter App
// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
app = angular.module('phonegp', ['ionic','ngCordova','ngStorage'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
// Don't remove this line unless you know what you are doing. It stops the viewport
// from snapping when text inputs are focused. Ionic handles this internally for
// a much nicer keyboard experience.
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
app.config(function($stateProvider,$urlRouterProvider){
$stateProvider.state("actualite",{
url : "/actualite",
templateUrl : "templates/actualite.html",
controller:"getactualites"
});
$stateProvider.state("infoActualite",{
url : "/infoAlite",
templateUrl : "templates/infoActualite.html",
controller:"infoActualiteCtrl"
});
$stateProvider.state("contact",{
url : "/contact",
templateUrl : "templates/contact.html"
});
$stateProvider.state("geo",{
url : "/geo",
templateUrl : "templates/geo.html",
controller:"GeoCtrl"
});
$stateProvider.state("config",{
url : "/config",
templateUrl : "templates/config.html"
});
//pour afficher page index
$urlRouterProvider.otherwise("actualite");
})
app.factory("StorageService",function($localStorage){
$localStorage = $localStorage.$default({
trajet: []
});
return {
savePosition:function(pos) {
$localStorage.trajet.push(pos);
},
getAllPositions:function(){
return $localStorage.trajet;
}
}
});
app.controller("getactualites",function($scope,$http,$stateParams){
$http.get('http://192.168.1.4/pfe/web/app_dev.php/api/users')
.then(function successCallback( response ) {
$scope.data = response;
}, function errorCallback(response) {
console.log(response);
alert('error');
})
});
app.controller("infoActualiteCtrl",function($scope,$http){
});
app.controller("GeoCtrl",function($scope,$cordovaGeolocation,StorageService){
var counter;
var currentLatitude;
var currentLongitude;
var markers = [];
var options = {
timeout:10000,
enableHighAccuracy:true
};
$cordovaGeolocation.getCurrentPosition(options)
.then(function(position){
currentLatitude = position.coords.latitude;
currentLongitude = position.longitude;
$scope.position = position;
var latLng= new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
var mapOptions = {
center: latLng,
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
theMap = new google.maps.Map(document.getElementById('map'),mapOptions);
$scope.map=theMap;
$scope.newMarker(position,theMap);
$scope.watchPosition(theMap);
},
function(err) { console.log(err); }
);
$scope.watchPosition=function(theMap){
var watchOptions = {
timeout: 2000,
enableHighAccuracy: true
};
watch = $cordovaGeolocation.watchPosition(watchOptions);
watch.then(
null,
function(err) {
//console.log(err);
},
function(position){
//console.log(position);
if ((position.coords.longitude!=currentLongitude) &&
(position.coords.latitude!=currentLatitude)){
$scope.position = position;
$scope.newMarker(position,theMap);
}
}
);
}
$scope.newMarker=function(position,theMap){
latLng= new google.maps.LatLng(
position.coords.latitude,
position.coords.longitude
);
marker = new google.maps.Marker({
position:latLng,
title: "Position"+(++counter),
label: "H"
});
marker.setMap(theMap);
markers.push(marker);
StorageService.savePosition({
lat:position.coords.latitude,
lng: position.coords.longitude
});
}
$scope.showMarker=function(p){
latLng = new google.maps.LatLng(p.lat, p.lng);
marker = new google.maps.Marker({
position:latLng,
label: "H"
});
marker.setMap($scope.map);
markers.push(marker);
}
$scope.hideMarkers=function(){
markers.forEach(function(m){
m.setMap(null);
})
}
$scope.showTrajet= function () {
traj =StorageService.getAllPositions();
traj.forEach(function(p){
$scope.showMarker(p);
});
}
});
code style.css
.contact h5 {
font-weight: bold;
color:#444;
margin-left: 30px;
padding: 8px;
}
.image img {
margin:30px 0 0 40px;
border-radius: 50%;
width:150px;
height:150px;
padding: 10px;
}
.scroll {
height: 100%;
}
#map {
width:100%; height: 100%;
}
.icon {
text-align: center;
padding: 10px;
}
.icon img {
margin-right: 10px;
}
this is screenshot of problemes
enter image description here
Is yout plugins folder in your app's root/main (Same directory as WWW) if not
keep plugins folder in your app's Root directory then create platform with
ionic platform add android
and later app with
ionic build android
try this out
note: replace android with ios in above commands according to your requirement
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
This post was edited and submitted for review 10 months ago and failed to reopen the post:
Original close reason(s) were not resolved
Improve this question
After a year of my server working perfectly fine, since last week, I am no longer able to successfully hit the Coinbase API, even though no code has been changed on my side whatsoever. The response I'm currently getting from all calls, is a HTML page, asking me to complete a captcha. This is of course not possible, so I was hoping if anyone could tell me how to let the API know my calls are genuine.
Anytime I call the list transactions endpoint for example GET https://api.coinbase.com/v2/accounts/:account_id/transactions, this is the response I get:
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en-US"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en-US"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en-US">
<!--<![endif]-->
<head>
<title>Please Wait... | Cloudflare</title>
<meta name="captcha-bypass" id="captcha-bypass" />
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="stylesheet" id="cf_styles-css" href="/cdn-cgi/styles/cf.errors.css" type="text/css"
media="screen,projection" />
<!--[if lt IE 9]><link rel="stylesheet" id='cf_styles-ie-css' href="/cdn-cgi/styles/cf.errors.ie.css" type="text/css" media="screen,projection" /><![endif]-->
<style type="text/css">
body {
margin: 0;
padding: 0
}
</style>
<!--[if gte IE 10]><!-->
<script>
if (!navigator.cookieEnabled) {
window.addEventListener('DOMContentLoaded', function () {
var cookieEl = document.getElementById('cookie-alert');
cookieEl.style.display = 'block';
})
}
</script>
<!--<![endif]-->
<script type="text/javascript">
//<![CDATA[
(function(){
window._cf_chl_opt={
cvId: "2",
cType: "managed",
cNounce: "17494",
cRay: "6ef7c0529ad19570",
cHash: "993127dea6d4a42",
cUPMDTk: "\/v2\/user?&limit=100&__cf_chl_tk=ENzk.33NJDLNBYWzHfXIXyRNVTr2GSNptuhagA9Wgw0-1647876861-0-gaNycGzNB_0",
cFPWv: "b",
cTTimeMs: "1000",
cLt: "n",
cRq: {
ru: "aHR0cHM6Ly9hcGkuY29pbmJhc2UuY29tLy92Mi91c2VyPyZsaW1pdD0xMDA=",
ra: "YXhpb3MvMC4xNy4x",
rm: "R0VU",
d: "q2gpw3wUesAqkklJbRwZ5iKnexNkqnb56VNvMVoWQB9SNIuL0qjzz2OZUn9bzUrLesXpVbug0gfZVPp7KSueqrKuW3ygg/hNIEvzqfgwGZfvvYq7QvXXifI790ciT/AjYOX7NalXhcL1pBIs/YHNigEG08zzhkhhaxXMV1PVLCClOAmLLMMwWoVGPrf89Sj+Zn26hNdP5M2VaufiKQnbmAd5sk0AclAVFgKE7dALXhPLOmu4pFdEYAnLyah9LzNb6sybNgeVKzGqjnygC7ZWv9ZWneRweLPBAO6WWox6pBfla8KIlKvZb8f5UdZe0Ofo9LG7lpAFNmYpn6SGRMmQeDIqUEDGbR2q/pVKcYBpRlpDCdrL7/Q3nJ9/M34UL1kh6hnXpcrKLQB0rMgsEhrShy+o3ZN+c1Zu22LNcwYcBOASzprlwXIMPxFS35VXtUzpImjgAmHkrI1yLgyMg3AxvqSOtgF29iU0iRah31iLjg9wRBVMiXr45gazyyO2q5CmjFX759gOIcLEdOL8DbwOhAJq+d41Q6BNMTaFbIY0ivly3/R70zHZFFGyzFPknWKNKmKMrdTtQSIyxNDAG6eRkDLWSMyXSg8samDwVMxO9iP0Pocquo/yJO6gCjXsNrE5",
t: "MTY0Nzg3Njg2MS44NjQwMDA=",
m: "0Wag3gWELLAplAyr+U68VHPGLi8wHxglclsYp9gHXqw=",
i1: "+BTRsYVCcAHV9rfnaZexSw==",
i2: "pPp+nsgRXaj2mTRYW9DqIQ==",
zh: "gcAsYHC/e1LCLckuTRLI18a2jyXqZLmumNyE/3B9BHQ=",
uh: "ucU4+zhDdQUaYB73OLep7a3a/S/wsDXG6hga3RWCpb8=",
hh: "DEnwA/GqE2zOarLhzSj8/arJrL5U8H7OKffhxYHzEKo=",
}
};
}());
//]]>
</script>
<style type="text/css">
#cf-wrapper #spinner {
width: 69px;
margin: auto;
}
#cf-wrapper #cf-please-wait {
text-align: center
}
.attribution {
margin-top: 32px;
}
.bubbles {
background-color: #f58220;
width: 20px;
height: 20px;
margin: 2px;
border-radius: 100%;
display: inline-block;
}
#cf-wrapper #challenge-form {
padding-top: 25px;
padding-bottom: 25px;
}
#cf-hcaptcha-container {
text-align: center;
}
#cf-hcaptcha-container iframe {
display: inline-block;
}
#keyframes fader {
0% {
opacity: 0.2;
}
50% {
opacity: 1.0;
}
100% {
opacity: 0.2;
}
}
#cf-wrapper #cf-bubbles {
width: 69px;
}
#-webkit-keyframes fader {
0% {
opacity: 0.2;
}
50% {
opacity: 1.0;
}
100% {
opacity: 0.2;
}
}
#cf-bubbles>.bubbles {
animation: fader 1.6s infinite;
}
#cf-bubbles>.bubbles:nth-child(2) {
animation-delay: .2s;
}
#cf-bubbles>.bubbles:nth-child(3) {
animation-delay: .4s;
}
</style>
</head>
<body>
<div id="cf-wrapper">
<div class="cf-alert cf-alert-error cf-cookie-error" id="cookie-alert" data-translate="enable_cookies">Please
enable cookies.</div>
<div id="cf-error-details" class="cf-error-details-wrapper">
<div class="cf-wrapper cf-header cf-error-overview">
<h1 data-translate="managed_challenge_headline">Please wait...</h1>
<h2 class="cf-subheadline">
<span data-translate="managed_checking_msg">We are checking your browser...</span> api.coinbase.com
</h2>
</div>
<div class="cf-section cf-highlight cf-captcha-container">
<div class="cf-wrapper">
<div class="cf-columns two">
<div class="cf-column">
<div class="cf-highlight-inverse cf-form-stacked">
<form class="challenge-form managed-form" id="challenge-form"
action="/v2/user?&limit=100&__cf_chl_f_tk=ENzk.33NJDLNBYWzHfXIXyRNVTr2GSNptuhagA9Wgw0-1647876861-0-gaNycGzNB_0"
method="POST" enctype="application/x-www-form-urlencoded">
<div id='cf-please-wait'>
<div id='spinner'>
<div id="cf-bubbles">
<div class="bubbles"></div>
<div class="bubbles"></div>
<div class="bubbles"></div>
</div>
</div>
<p data-translate="please_wait" id="cf-spinner-please-wait">Please stand by,
while we are checking your browser...</p>
<p data-translate="redirecting" id="cf-spinner-redirecting"
style="display:none">Redirecting...</p>
</div>
<input type="hidden" name="md" value="Uk9MnLuGCd5oNpE_ju4ST61NOngvF95h8KPqURw1kuM-1647876861-0-Ab-Yosq9cgug51IzehxFR14UtS_3EWFinahhfDD8bTdjhG1wdNwQ8z64cb5I9U75gBM2ijEK96Qs94_QhM6CzTDiVQi4pYEc_Y3Nx6IpdWFy1gEYab8Y9-mKBo4U3Kk-vc3CG0G6VjLujd9AyoXkgjQS0qQxsVSpOdetbkPNQiOs0RP09aCqXTrbIFZeQuLFlTpUxHPKX_qS4o1GhNbXzs5hjP6ElGjnLmjve-5vm-b_ZfRECVtuai7AQEcLqevZWi01InZaBZga0owxo-B9iSrowbjozT9I9l9saaRmVePbPjxGAqkP-pYP0w_pnLMvQnMJWJZUd5MLNLfaVplAErzLIUnOfPMFXxl7coGb7ZV2-01LAuA6LTqXQy8gHV0Rl3xEZO3SyC-QQbiVo3J3Wuy1d_CouffXehq2WDQjqoBPDWCV0LZhW32Xpw3j4q1ymcC6m_rulBNdKs_1qC1sd-W9_QNrULSzlu3jI9S0gKy-u_XYdyQqAwQ7hbOLo_jWQ7SAjEECwLygOBOlXeNEswOGu20nugvwu2hGuoykvY2GC4qynNK_OTmpaooZdWDuK-z01CkLJmQVE-9eCeUXFPdzRA8JJLa67UpqPY_HP6xS4_zAVEXiS1OUowhyZgdh3D4nL81L2PjFU6KHNG8B2bmyyn46L_C9dsGe9EBYXOObisgVL4ipiwSyug2ofMj3tAdV49bA6HbwQ4sEnW4C6igTpltgfi2IvCfCuwzIZ4nZmbBUviuXTA4ZVCpbW_p6uX5GJI1FfylkPtH-daMvub_MyF5TUR3VuUE6F8InRJP4OMKdZVchEr67HWYCrEZihbBKhdFCATtUABe7c41ViQmiLgCqtmoaJuEkZcsC4U1wyI80O0nZVhfHcYlRg6XOrQ" />
<input type="hidden" name="r" value="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">
<input type="hidden" name="vc" value="c235cbc158b8a0beb9f5e0bc41ad4605">
<noscript id="cf-captcha-bookmark" class="cf-captcha-info">
<h1 data-translate="turn_on_js" style="color:#bd2426;">Please turn JavaScript on
and reload the page.</h1>
</noscript>
<div id="no-cookie-warning" class="cookie-warning" data-translate="turn_on_cookies"
style="display:none">
<p data-translate="turn_on_cookies" style="color:#bd2426;">Please enable Cookies
and reload the page.</p>
</div>
<script type="text/javascript">
//<![CDATA[
var a = function() {try{return !!window.addEventListener} catch(e) {return !1} },
b = function(b, c) {a() ? document.addEventListener("DOMContentLoaded", b, c) : document.attachEvent("onreadystatechange", b)};
b(function(){
var cookiesEnabled=(navigator.cookieEnabled)? true : false;
if(!cookiesEnabled){
var q = document.getElementById('no-cookie-warning');q.style.display = 'block';
}
});
//]]>
</script>
<div id="trk_captcha_js"
style="background-image:url('/cdn-cgi/images/trace/captcha/nojs/h/transparent.gif?ray=6ef7c0529ad19570')">
</div>
</form>
<script type="text/javascript">
//<![CDATA[
(function(){
var isIE = /(MSIE|Trident\/|Edge\/)/i.test(window.navigator.userAgent);
var trkjs = isIE ? new Image() : document.createElement('img');
trkjs.setAttribute("src", "/cdn-cgi/images/trace/managed/js/transparent.gif?ray=6ef7c0529ad19570");
trkjs.id = "trk_managed_js";
trkjs.setAttribute("alt", "");
document.body.appendChild(trkjs);
var cpo=document.createElement('script');
cpo.type='text/javascript';
cpo.src="/cdn-cgi/challenge-platform/h/b/orchestrate/managed/v1?ray=6ef7c0529ad19570";
window._cf_chl_opt.cOgUQuery = location.search === '' && location.href.indexOf('?') !== -1 ? '?' : location.search;
window._cf_chl_opt.cOgUHash = location.hash === '' && location.href.indexOf('#') !== -1 ? '#' : location.hash;
if (window._cf_chl_opt.cUPMDTk && window.history && window.history.replaceState) {
var ogU = location.pathname + window._cf_chl_opt.cOgUQuery + window._cf_chl_opt.cOgUHash;
history.replaceState(null, null, "\/v2\/user?&limit=100&__cf_chl_rt_tk=ENzk.33NJDLNBYWzHfXIXyRNVTr2GSNptuhagA9Wgw0-1647876861-0-gaNycGzNB_0" + window._cf_chl_opt.cOgUHash);
cpo.onload = function() {
history.replaceState(null, null, ogU);
};
}
document.getElementsByTagName('head')[0].appendChild(cpo);
}());
//]]>
</script>
</div>
</div>
<div class="cf-column">
<div class="cf-screenshot-container">
<span class="cf-no-screenshot"></span>
</div>
</div>
</div>
</div>
</div>
<div class="cf-section cf-wrapper">
<div class="cf-columns two">
<div class="cf-column">
<h2 data-translate="why_captcha_headline">Why do I have to complete a CAPTCHA?</h2>
<p data-translate="why_captcha_detail">Completing the CAPTCHA proves you are a human and gives
you temporary access to the web property.</p>
</div>
<div class="cf-column">
<h2 data-translate="resolve_captcha_headline">What can I do to prevent this in the future?</h2>
<p data-translate="resolve_captcha_antivirus">If you are on a personal connection, like at home,
you can run an anti-virus scan on your device to make sure it is not infected with malware.
</p>
<p data-translate="resolve_captcha_network">If you are at an office or shared network, you can
ask the network administrator to run a scan across the network looking for misconfigured or
infected devices.</p>
</div>
</div>
</div>
<div
class="cf-error-footer cf-wrapper w-240 lg:w-full py-10 sm:py-4 sm:px-8 mx-auto text-center sm:text-left border-solid border-0 border-t border-gray-300">
<p class="text-13">
<span class="cf-footer-item sm:block sm:mb-1">Cloudflare Ray ID: <strong class="font-semibold">6ef7c0529ad19570</strong></span>
<span class="cf-footer-separator sm:hidden">•</span>
<span class="cf-footer-item sm:block sm:mb-1"><span>Your IP</span>: 78.19.141.77</span>
<span class="cf-footer-separator sm:hidden">•</span>
<span class="cf-footer-item sm:block sm:mb-1"><span>Performance & security by</span> <a
rel="noopener noreferrer" href="https://www.cloudflare.com/5xx-error-landing" id="brand_link"
target="_blank">Cloudflare</a></span>
</p>
</div><!-- /.error-footer -->
</div>
</div>
<script type="text/javascript">
window._cf_translation = {};
</script>
</body>
</html>
Which is a HTML captcha verification check from Cloudflare. Contacted their support and they gave the following response:
Thanks for contacting us. Currently, Coinbase is only providing support through our public API documentation. For help utilizing Coinbase’s API, please use the API key resource/guides found here: https://www.coinbase.com/cloud
If this API is actually usable, then why is there a Cloudflare verification check? Am I doing something wrong from my end? Can anyone from Coinbase kindly look into this and offer a professional response/solution?
I installed firebase and angularfire with bower bower.
I included the files and angularfire but I get these errors:
When I click error on the file angularfire
code app.js
var app = angular.module('myApp', ['ui.router','ionic','firebase'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
// Don't remove this line unless you know what you are doing. It stops the viewport
// from snapping when text inputs are focused. Ionic handles this internally for
// a much nicer keyboard experience.
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
app.config(['$stateProvider','$urlRouterProvider', function($stateProvider,$urlRouterProvider) {
$stateProvider.state("home",{ url : "/home", templateUrl : "templates/home.html" , controller: "HomeCtrl"});
$stateProvider.state("Inscription",{ url : "/inscription", templateUrl : "templates/inscription.html" , controller: "InscriCtrl"});
$stateProvider.state("listmsg",{ url : "/listmsg", templateUrl : "templates/list.html" , controller: "ListCtrl"});
$stateProvider.state("msg",{ url : "/msg", templateUrl : "templates/msg.html" , controller: "MsgCtrl"});
$urlRouterProvider.otherwise("home");
}]);
app.controller('HomeCtrl', [,'$firebaseSimpleLogin',function($scope,$firebaseSimpleLogin) {
var firebaseObj = new Firebase("https://appsfactor-68466.firebaseio.com");
var loginObj = $firebaseSimpleLogin(firebaseObj);
$scope.SignIn = function(event) {
event.preventDefault(); // To prevent form refresh
var username = $scope.user.email;
var password = $scope.user.password;
loginObj.$login('password', {
email: username,
password: password
})
.then(function(user) {
// Success callback
console.log('Authentication successful');
}, function(error) {
// Failure callback
console.log('Authentication failure');
});
}
}]);
app.controller('InscriCtrl', [function() {
}]);
app.controller('ListCtrl', [function() {
}]);
app.controller('MsgCtrl', [function() {
}]);
code index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link rel="manifest" href="manifest.json">
<!-- un-comment this code to enable service worker
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js')
.then(() => console.log('service worker installed'))
.catch(err => console.log('Error', err));
}
</script>-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<link rel="icon" href="http://getbootstrap.com/favicon.ico">
<link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="http://getbootstrap.com/examples/signin/signin.css" rel="stylesheet">
<!-- AngularFiionic servere -->
<script src="lib/firebase/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "myapi",
authDomain: "appsfactor-68466.firebaseapp.com",
databaseURL: "https://appsfactor-68466.firebaseio.com/",
storageBucket: "gs://appsfactor-68466.appspot.com",
};
firebase.initializeApp(config);
</script>
<script src="lib/angularfire/dist/angularfire.js"></script>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ionic/js/angular-ui/angular-ui-router.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js" ></script>
</head>
<body ng-app="myApp">
<ion-side-menus>
<ion-side-menu-content>
<ion-nav-bar class="bar-calm">
<ion-nav-buttons>
<button menu-toggle="left" class="button button-icon ion-navicon">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view>
</ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<ion-item menu-close ui-sref="home">Acceuil</ion-item>
<ion-item menu-close ui-sref="Inscription">Inscription</ion-item>
<ion-item menu-close ui-sref="listmsg">Listes Messages</ion-item>
<ion-item menu-close ui-sref="msg">Message</ion-item>
</ion-side-menu>
</ion-side-menus>
</body>
</html>
It seems impossible to navigate to a child state of a sibling or to a child state of an ancestor.
The workaround I used was to put all the states on the same level, which allows me to navigate to any state I need (navigate from a push notification to a nested state, navigate from one nested state to a state inside another parent, etc ...).
The problem with that method is that states and controllers do not inherit any code, leading to code duplication. Moreover, there are cases where the navigation is simply broken and the ion-nav-back-button do not behave as it should.
TLTR: What structure must be used to have a fully navigable application (check out the pen), when you use tabs and nested states ?
Here is the pen describing the problem : http://codepen.io/ruslan-fidesio/pen/LkyAkm
HTML :
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="http://code.ionicframework.com/1.3.1/css/ionic.min.css" rel="stylesheet">
<script src="http://code.ionicframework.com/1.3.1/js/ionic.bundle.min.js"></script>
</head>
<body ng-app="app">
<ion-nav-view></ion-nav-view>
<script id="home.html" type="text/ng-template">
<ion-view view-title="Home">
<ion-content>
<br/>
<a ui-sref="app.tabs.themes.details">Go to Child : broken</a>
<br/>
<br/>
<a ui-sref="app.other">Go to Other : broken</a>
</ion-content>
</ion-view>
</script>
<script id="tabs.html" type="text/ng-template">
<ion-nav-bar class="bar-positive">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-tabs class="tabs-positive">
<ion-tab title="home" ui-sref="app.tabs.home">
<ion-nav-view name="tabs-home"></ion-nav-view>
</ion-tab>
<ion-tab title="themes" ui-sref="app.tabs.themes.list">
<ion-nav-view name="tabs-themes"></ion-nav-view>
</ion-tab>
</ion-tabs>
</script>
<script id="themes/abstract.html" type="text/ng-template">
<div class="bar bar-subheader bar-dark" sticky>
Themes subheader
</div>
<ion-nav-view></ion-nav-view>
</script>
<script id="themes/list.html" type="text/ng-template">
<ion-view view-title="Themes">
<ion-content class="has-subheader">
<p>Parent View</p>
<a ui-sref="app.tabs.themes.details">Go to Child : OK !</a>
</ion-content>
</ion-view>
</script>
<script id="themes/details.html" type="text/ng-template">
<ion-view view-title="Theme X">
<ion-content class="has-subheader">
Child View
</ion-content>
</ion-view>
</script>
<script id="other.html" type="text/ng-template">
<ion-view view-title="Other">
<ion-nav-bar class="bar-positive">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-content>
<br/>
Other View
<br/>
<a ui-sref="app.tabs.themes.details">Go to Child : broken</a>
</ion-content>
</ion-view>
</script>
</body>
</html>
JS :
var app = angular.module(
'app', [
'ionic'
]
);
app.run(
function($ionicPlatform, $rootScope) {
$ionicPlatform.ready(
function() {
if (window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if (window.StatusBar) {
StatusBar.styleDefault();
}
}
);
}
);
app.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('app', {
url: '/app',
abstract: true,
template: '<ion-nav-view></ion-nav-view>'
})
.state('app.tabs', {
url: '/tabs',
abstract: true,
templateUrl: 'tabs.html'
})
.state('app.tabs.home', {
url: '/home',
views: {
'tabs-home': {
templateUrl: 'home.html'
}
}
})
.state('app.other', {
url: '/other',
templateUrl: 'other.html'
})
.state('app.tabs.themes', {
url: '/themes',
abstract: true,
views: {
'tabs-themes': {
templateUrl: 'themes/abstract.html'
}
}
})
.state('app.tabs.themes.list', {
url: '/list',
templateUrl: 'themes/list.html'
})
.state('app.tabs.themes.details', {
url: '/details',
templateUrl: 'themes/details.html'
});
$urlRouterProvider.otherwise('/app/tabs/home');
});
app.config(
['$ionicConfigProvider', function($ionicConfigProvider) {
$ionicConfigProvider.tabs.position('bottom');
$ionicConfigProvider.navBar.alignTitle('center');
}]);
After some research it is related to IonTabs and separated ion-nav-views.
(check out this picture : http://ionicframework.com/img/diagrams/tabs-nav-stack.png )
In this case, it is better to replace tabs with custom "tabs" implementation using only one ion-nav-view as shown here : http://codepen.io/ruslan-fidesio/pen/RRgpjL
HTML :
<ion-nav-bar class="bar-positive">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view></ion-nav-view>
<better-tabs style="positive">
<better-tab state="app.tabs.home" title="Home"></better-tab>
<better-tab state="app.tabs.themes.list" root-state="app.tabs.themes" title="Themes"></better-tab>
</better-tabs>
JS :
app.directive(
'betterTabs',
function() {
return {
restrict: 'E',
compile: function(elem, attrs) {
var footer = angular.element('<ion-footer-bar></ion-footer-bar>');
var tabs = elem.find('better-tab');
elem.append(footer);
footer.append(tabs);
if (attrs.style) {
footer.addClass('bar-' + attrs.style);
}
}
};
}
);
app.directive(
'betterTab',
['$state', function($state) {
return {
scope: {
state: '#',
rootState: '#',
title: '#'
},
restrict: 'E',
required: ['^betterTabs'],
link: function(scope) {
scope.$state = $state;
},
template: function() {
return '<a ui-sref="{{ state }}" ng-class="{active: $state.includes(\'{{ rootState ? rootState : state }}\')}">{{ title }}</a>';
}
};
}]
);
I have an app, with a login view that the user needs to put your credentials to login.
This is my index.html:
<!DOCTYPE html>
<html ng-app="starter">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>Services for Partners</title>
<link href="lib/ionic/css/ionicons.min.css" rel="stylesheet">
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's css and js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/routes.js"></script>
<script src="js/services.js"></script>
<link href="css/app.css" rel="stylesheet">
</head>
<body>
<div>
<ion-nav-view animation="slide-right-left" cache-view="false"></ion-nav-view>
</div>
<div class="bar bar-footer bar-dark">
<div>copyright</div>
</div>
</body>
</html>
In my index.html I am using the attribute cache-view="false".
After the user has logged in, he is redirect to home view.
Here is part of my home view:
<ion-view title="home" ng-controller="homeCtrl">
<div class="bar bar-header bar-dark">
<button class="button button-icon icon ion-gear-b"></button>
<button class="button button-icon icon ion-android-close" ng-click="closeApp()"></button>
</div>
<ion-content overflow-scroll="true" padding="true" scroll="true" class="has-header has-footer">
<!--<div class="spacer" style="width: 300px; height: 15px;"></div>-->
<div style="text-align:center;">
<img src="img/logo.png" class="logo-pequena">
</div>
<div>
In the home view, I have a button to log out, calling a method closeApp().
Here is my home controller, with my closeApp() method:
starter.controller('homeCtrl', ['$scope', '$state', '$ionicHistory', function($scope, $state, $ionicHistory) {
$scope.closeApp = function() {
//Remove todos as infos do usuário do localStorage
localStorage.clear();
$ionicHistory.clearHistory();
$ionicHistory.clearCache();
$ionicHistory.nextViewOptions({
historyRoot: true,
disableAnimate: true,
disableBack: true
});
$state.go('login');
}
}]);
Here we can see that I am using several commands to disable ionic history.
Below, is my services.js file:
var starter = angular.module('starter.services', []);
starter.run(function($ionicPlatform,$state,$ionicHistory){
$ionicPlatform.registerBackButtonAction(function (event) {
if($state.current.name=="home"){
navigator.app.exitApp();
}
else {
$ionicHistory.backHistory();
}
}, 100);
});
Here is my route.js file:
var starter = angular.module('starter.routes', []);
//Rotas do app
starter.config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
function($stateProvider, $urlRouterProvider, $locationProvider) {
$stateProvider //.state(...).state(...).state(...)
//Login
.state('login', {
url: '/login',
cache: false,
templateUrl: 'templates/login.html',
controller: 'loginCtrl'
})
//Novo Usuário
.state('newuser', {
url: '/newuser',
cache: false,
templateUrl: 'templates/newuser.html',
controller: 'newUserCtrl'
})
//Esqueceu a senha
.state('forgotpwd', {
url: '/forgotpwd',
cache: false,
templateUrl: 'templates/forgotpwd.html',
controller: 'forgotPwdCtrl'
})
//Sobre
.state('about', {
url: '/about',
cache: false,
templateUrl: 'templates/about.html',
controller: 'aboutCtrl'
})
//Home
.state('home', {
url: '/home',
cache: false,
templateUrl: 'templates/home.html',
controller: 'homeCtrl'
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/login');
}]);
Here I have configured all routes to not caching any view.
After all those stuffs nothing happens. My app still permits me click on back button (not a hardware button, but the software button). I am previewing my app on "Ionic View App" running in my Sony Z3 smartphone.
So, the user can go back to home page, without logging in.
I want to exit app if the user clicks the back button at login view. But after all those configurations, I am still running with this trouble.
What I need to do ?
I have already updated cordova and ionic. Is it a bug or is it possible to resolve this issue ?
Thanks.
Why don't you try this
///code to skip login page if logged in
.run(function ($rootScope, $state) {
// Check login session
$rootScope.$on('$stateChangeStart', function (event, next, current) {
if(condition to check that you are logged in..maybe store token in localstorage and heck){
if (next.name === "login") {
event.preventDefault();
$state.go('home');
}
}
});
})
for back button action
.run(['$rootScope', '$ionicPlatform','$state', '$ionicHistory',
function($rootScope, $ionicPlatform,$state, $ionicHistory){
$ionicPlatform.registerBackButtonAction(function(e){
if ($state.current.name == 'home') {
ionic.Platform.exitApp();
}
else if ($ionicHistory.backView() ) {
$ionicHistory.goBack();
}
e.preventDefault();
return false;
},101);
}])
I'll try and provide as much information as i possibly can.
Currently I've started developing an application which will be able to receive recent updates via the pull to refresh feature. I have set up a HTTP-GET and it successfully receives the data from the JSON file and loads it into my pull to refresh. At the moment it's only loading one specif message. How do i add more so it can receive other notifications/messages via the pull to refresh? I'll post a picture of my application in action and the post the HTML, Javascript code and the JSON file. If anyone could help me add more messages to my application from the JSON file or point me in the correct direction i would really appreciate it!
This is what my application looks like when i pull down the pull to refresh loads the information from the JSON file.
This is what my JSON file. I don't understand how i can load ExampleMessage2 into my application.
{
"response1": [
{"announcement_name": "ExampleMessage1"},
{"date": "26/05/2015"},
{"message": "ExampleMessage1"}
],
"response2": [
{"announcement_name": "ExampleMessage2"},
{"date": "27/05/2015"},
{"message": "ExampleMessage2"}
]
}
This is my JavaScript file. This receives the data from the webhost.
.controller('Controller', function($scope, $http) {
$scope.items = [1,2,3];
$scope.doRefresh = function() {
$http.get("")
.success(function(data) {
$scope.announcement_name = data.announcement_name;
$scope.date = data.date;
$scope.message = data.message;
})
.finally(function() {
// Stop the ion-refresher from spinning
$scope.$broadcast('scroll.refreshComplete');
});
};
});
And finally this is my HTML document which loads the data into the div form.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>Announcement</title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="Announcement">
<ion-view view-title="Announcements">
<ion-pane>
<ion-header-bar class="bar-positive">
<h1 class="title">Pull To Refresh</h1>
</ion-header-bar>
<ion-view view-title="Announcements">
<ion-content ng-controller="Controller">
<ion-refresher on-refresh="doRefresh()">
</ion-refresher>
<ion-list>
<ion-item ng-repeat="item in items" ng-click="getData()">
<div class="list card">
<div class="item item-divider">{{announcement_name}} - {{date}}</div>
<div class="item item-body">
<div>
{{message}}
</div>
</ion-item>
</ion-list>
</ion-content>
</ion-view>
</body>
</html>
What you're doing right now is using ng-repeat on $scope.items which contains three number elements. Then you are rendering $scope.announcement_name and $scope.message which contain the same value each time you iterate.
You need to store the data in $scope.items :
.controller('Controller', function($scope, $http) {
$http.get("http://www.wikicode.co.uk/announcement.json")
.success(function(data) {
$scope.items = data;
});
$scope.doRefresh = function() {
$http.get("http://www.wikicode.co.uk/announcement.json")
.success(function(data) {
$scope.items = data;
})
.finally(function() {
// Stop the ion-refresher from spinning
$scope.$broadcast('scroll.refreshComplete');
});
};
});
and then in the html you need to get the properties for each item (eg. {{item.announcement_name}} ):
<body ng-app="Announcement">
<ion-view view-title="Announcements">
<ion-pane>
<ion-header-bar class="bar-positive">
<h1 class="title">Pull To Refresh</h1>
</ion-header-bar>
<ion-view view-title="Announcements">
<ion-content ng-controller="Controller">
<ion-refresher on-refresh="doRefresh()">
</ion-refresher>
<ion-list>
<ion-item ng-repeat="item in items" ng-click="getData()">
<div class="list card">
<div class="item item-divider">{{item.announcement_name}} - {{item.date}}</div>
<div class="item item-body">
<div>
{{item.message}}
</div>
</ion-item>
</ion-list>
</ion-content>
</ion-view>