How to clear cache in ionic v3 - ionic-framework

I would like to know how to clear the ion cache for the ios platform when switching between tabs. I mean free memory, such as stored canvas, images, etc.
I mean inside the application. My application increases memory usage by rendering the canvas and it is not cleaned, it is maintained.

There is a npm package available for this:
https://www.npmjs.com/package/cordova-plugin-cache
This is an example code how to do it:
document.addEventListener('deviceready', onDeviceReady);
function onDeviceReady()
{
var success = function(status) {
alert('Message: ' + status);
}
var error = function(status) {
alert('Error: ' + status);
}
window.cache.clear( success, error );
window.cache.cleartemp(); //
}

Related

Tracking all screens using Google Analytics in Ionic 3 project

I'm in the middle of finalizing an Ionic 3 build and would like to add Google Analytics to it. I added it successfully and can see in GA (real time) that the app is being used however I would like to track all page/screen views. Does anyone know of way to do that?
I'm using the following plugin: https://github.com/danwilson/google-analytics-plugin
Here is the code I am using to initialize GA
initGoogleAnalytics() {
var trackingId = 'UA-114720506-2';
if (/(android)/i.test(navigator.userAgent)) { // for android
trackingId = 'UA-114720506-2';
} else if (/(ipod|iphone|ipad)/i.test(navigator.userAgent)) { // for ios
trackingId = 'UA-114720506-2';
}
//platform is injected in the Constructor
this.platform.ready().then(() => {
this.ga.debugMode();
this.ga.startTrackerWithId(trackingId).then(()=> {
console.log("GoogleAnalytics Initialized with ****** : " + trackingId);
this.ga.trackView('schedule');
this.ga.trackView('speakerList');
this.ga.trackView('map');
this.ga.trackView('social');
this.ga.trackView('exhibitors');
this.ga.enableUncaughtExceptionReporting(true)
.then((_success) => {
console.log("GoogleAnalytics enableUncaughtExceptionReporting Enabled.");
}).catch((_error) => {
console.log("GoogleAnalytics Error enableUncaughtExceptionReporting : " + _error)
});
});
});
}
Essentially adding in the GA Module and initializing with ionViewDidEnter on in every page that I wanted to track did the trick.

Soundcloud API sc.stream (track not loading on mobile sometime) - working on desktop

We are currently using the soundcloud API SDK for streaming and it does work on desktop but not 100% on mobile. (using responsive html. same api of course)
Sometime track is not lauch ? sometime it is.
I do not have specific error but on chrome network this line is show in red ??
http://api.soundcloud.com/tracks/146926142/stream?client_id=XXXXX
Redirect
We use a function to stream the track.
function streamTrack(id) {
var defer = $q.defer();
// Stream the track
SC.stream('/tracks/' + id, {
useHTML5Audio: false,
waitForWindowLoad: true,
onfinish: _scope.next,
whileplaying: function () {
var _this = this;
// Since we are in a callback, we need to tell angularJS to apply the change
if (timeout1) $timeout.cancel(timeout1);
timeout1 = $timeout(function () {
// Update the progress bar
_scope.progress = (_this.position / currentTrackDuration * 100) + '%';
_scope.timer = moment(_this.position).format('mm:ss');
$rootScope.$broadcast('trackRunning', { timerunning: _scope.timer });
});
}
}, function (sound) {
if (sound) {
defer.resolve(sound);
} else {
defer.reject();
}
});
return defer.promise;
}
If somebody has an idea pls.
Best Regards
Xavier

appAPI.tabs.getActive returning empty object in firefox

appAPI.tabs.getActive returning empty object in firefox
appAPI.ready(function()
{
// retrieves the information for the active tab
appAPI.tabs.getActive(function(tabInfo) {
console.log(
'tabId: ' + tabInfo.tabId +
' tabUrl: ' + tabInfo.tabUrl
);
});
});
I tried above function/code appAPI.tabs.getActive in my extension, its working properly in Chrome but its not working in firefox, its giving me empty object {}. If somebody know whats the issue is please reply on this asap, thanks in advance
From experience, this only occurs when using appAPI.tabs API in a scope other than the background scope.
Please note that it is only supported in the background scope.
To use appAPI.tabs.getActive in other scopes, from the scope send a message to the background scope to obtain the tabInfo object, and then send the data back to the original scope, something like the following example in the popup scope:
popup.html:
function crossriderMain($) {
var tabInfo = null;
appAPI.message.addListener(function(msg) {
if (msg.type==='set-tabInfo') {
tabInfo = msg.tabInfo;
}
});
appAPI.message.toBackground({type:'get-tabInfo'});
}
background.js:
appAPI.ready(function() {
appAPI.message.addListener(function(msg) {
if (msg.type==='get-tabInfo') {
appAPI.tabs.getActive(function(tabInfo) {
appAPI.message.toPopup({type:'set-tabInfo', tabInfo:tabInfo});
});
}
});
});

iPhone phonegap image disappearing after the phone sits for some time

I am using phonegap 2.0.0 on iOS and using basically the stock image capture code. After the image is captured it is saved to the phone, the URI is saved to the database along with the rest of the items info and the image is displayed on the page.
All this is working on both iOS and android. The issue is that when the iOS phone is turned off and allowed to sit for a period of time (overnight) the images no longer display. The rest of the data is retrieved from the database and displayed but the images just show a black square where the image should be (indicating the info is still inn the database)
Does iOS rename images after being turned off and allowed to sit for a some time? any suggestions? if the phone is turned off and back on this does not happen.. only after the phone sits for some time...
this seems very relevant...
Capturing and storing a picture taken with the Camera into a local database / PhoneGap / Cordova / iOS
for anybody else having this issue the following code worked for me...
function capturePhoto() {
navigator.camera.getPicture(movePic, onFail,{ quality : 70 });
}
function movePic(file){
window.resolveLocalFileSystemURI(file, resolveOnSuccess, resOnError);
}
function resolveOnSuccess(entry){
var d = new Date();
var n = d.getTime();
var newFileName = n + ".jpg";
var myFolderApp = "myPhotos";
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {
fileSys.root.getDirectory( myFolderApp,
{create:true, exclusive: false},
function(directory) {
entry.moveTo(directory, newFileName, successMove, resOnError);
},
resOnError);
},
resOnError);
}
function successMove(imageUri) {
document.getElementById('smallImage').src = imageUri.fullPath;
//hidden input used to save the file path to the database
document.getElementById('site_front_pic').value = "file://"+imageUri.fullPath;
smallImage.style.display = 'block';
}
function onFail(message) {
alert('Failed to load picture because: ' + message);
}
function resOnError(error) {
alert(error.code);
}

localStorage not working when I restart the app - phonegap iOS

I am trying to cache JSON data on the local storage so I can use the data when there is no internet connection.
It works fine but when I restart the app I think the localstorage cleared.
Here is my code:
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
document.addEventListener("offline", function() {
alert("No internet connection");
$.each(JSON.parse(localStorage.getItem('foo')), function(key, val) {
if(!(val.php)){val.php=0;}
$('ul.get-mertchant').append('<li> <div class="circle-img"><img src="'+ val.logo + '" /></div><div class="merchant-info"><h1>'+ val.node_title +'</h1><p>You Have '+ val.php +' Binggz</p></div><div class="more-icon"></div> </li>');
});
}, false);
$.getJSON('mywebsite/views/services_merchant_mobile', function(data) {
localStorage.setItem('foo', JSON.stringify(data));
var items = [];
$.each(JSON.parse(localStorage.getItem('foo')), function(key, val) {
if(!(val.php)){val.php=0;}
$('ul.get-mertchant').append('<li> <div class="circle-img"><img src="'+ val.logo + '" /></div><div class="merchant-info"><h1>'+ val.node_title +'</h1><p>You Have '+ val.php +' Binggz</p></div><div class="more-icon"></div> </li>');
});
})
}
What size has the json data you stringify? Localstorage has limitiation to the size of the values so this may be a problem.
Have you got any logs in the xcode console?
I see that you call getJSON every time the device is ready. If you want to refresh this data every time the application start maybe the better idea is to cache the result from the json call in the global javascript object instead of stringify and parse json many times.
A small tip for you. Try to not to use $.append() function in this way. It's very expensive especially on Mobiles.
You can either concatenate the list items and than call append() function only once or you can use some template engine like jquery template or handlebars.
Starting from IOS 5.1 Apple decided to make local storage a temp area. Read more here.