Apache Cordova: How to display a slide tutorial on android when the app launches for the fisrt time? - angularjs

I truly don't know how to fix it, I was looking for the tutorial from any sites, any video, and I can't find it especially for cordova
Note: I'm using AngularJS

Without your code, we can not help you, but here are some advice to do the job :
Cordova is based on HTML/JS/CSS, so implementing an "basic" slider ll do the job for you.
check this one, simple and working on mobile :
https://codepen.io/zuraizm/pen/vGDHl
by default hide the slider :
$('#slider').hide();
and to launch it just one time create an simple variable and save it into localStorage.
localStorage.setItem('slider_viewed', 1);
once done, modify your slider code and check if variable is not in localstorage, you ll show the slider to the user.
if(localStorage.getItem('slider_viewed')==1) $('#slider').show();

Related

$cordovaSocialSharing share() taking long time to show popup

I am building one hybrid app using ionic. Where I am sharing pictures using ngCordova's $cordovaSocialSharing plugin. I am using the general share() function to share on any shareable platform. The feature is working fine but the main bottleneck is, it's taking about 5 seconds to show the list of shareable mediums. I have checked the plugin builder's GitHub, this problem is open in the issue list. So I want to know is there any other way to optimize this.
Thanks in advance.

How to update location in ionic from background?

So in my app i need to send my location's coordinates every 5 minutes through web service, I need to send it when app is in background state also. I am using background-geolocation plugin. Anyone please help me to do that. Thanks in advance
The other way running prcocess in background is by using android core if you know that.
I was also facing the problem of running process in background. I have installed the background plugin too. But it did not work. Then i wrote a customized code in android.
Steps i followed.
1.) Stored the data in cordova prefrences.
2.) Fetch the data from prefrences in android core file( a java file).
3.) Written service in android that check the prefrences after every 2 minutes.
I know this is quiet tuff but this was the only solution i got in hybrid app.

Is there a way to live update app while writing angularjs?

I want to create an angularjs app but each time it requires to press the refresh button in the browser to get the update. thus it bring to this question:
Is there any way to get live update while writing angularjs app? So I don't need to press the refresh button each time I make changes in my angularjs app.
Yes, you can use grunt which is a task runner written in node, grunt has a plugin called grunt-contrib-livereload that reloads the page whenever there are changes in the files/directories that you want to watch. Alternatively, there's a scaffolding tool for client side web applications in AngularJS called yeoman, that has a generator called generator-angular - this generator has an opinionated structure towards AngularJS application development and it comes with a basic setup that you can use for livereloading code changes from any files that you have configured to watch.
Start using yeoman. It has grunt that will solve yr problem plus lots of more exciting stuff.
Check this quick start guide : http://yeoman.io/learning/
I use the open source editor Brackets.io by Adobe. Just click the lightning icon button to the right of the editor to run your web page and will auto refresh for every save.
You can do this in many ways. Many of the options are already mentioned in this post. All of them are workable. In my experience the most simplistic way to do this by the following way.No configuration , No setting , No need to code anything.
Just add this line in your <head> </head> tag of the html file
<script src="http://livejs.com/live.js"></script>

How to create tutorial when the first time open an app?

Some apps got tutorial when the first time open.It seems cool.
I'm trying to create an opening tutorial that consists of four panes for my AngularJs app.
I build my app with css3 and html5 ,use cordova to generate apk.
How to create tutorial for my app when the first time open it?
Is there any solution?
Thanks a lot!
Sorry maybe I didn't make myself clear.The app is almost done,and splash screen has done.
But I need few pages or images on the first time run.
Use database. For example if you use localStorage, inside the deviceready function
check=localStorage.getItem('first_time');
if(check.length<0)
{
startTutorial();
localStorage.setItem('first_time','NO it is old');
}
After the first run value will be changed and tutorial will be shown once.
You can use other databases like indexedDB or webSQL.

How to load a part of application before loading rest of the application in angularjs?

I could not think of a better title, Please suggest one.
I am planning to work on a large web application. It will take time to load the full application before application starts functioning.
Suppose its something like asana.com. If you have a link to the task and you open the link. It loads the application first and then shows the detail of the task.
Note: I have added another example in update 2
I want to do just the opposite. Suppose if I try to open the link directly. It should show me the tasks details first and then load the whole application in background.
What development strategy should I follow to implement such feature. Will angular be good for this? I have worked with angular for small projects and am capable of think in angular :)
I just wanted to be pointed in right direction.
Update 1:
I am using Apache2 PHP5 in backing as ReST API. I am thinking to change to GoLang http server. But that does not matter in this context :)
Update 2:
I have not yet started working on the application, but I know that its size is going to be big and its going to take time to load the application. This will be a javascript application, all the communication to web will be done mostly by API. APIs will be fast and it wont be slowing down the application. My main concern is the javascript library and the approach to the issue that I want to display the content of the page before the application is loaded and load the application in background.
As second example: https://chrome.google.com/webstore/detail/a-journey-through-middle/gjgkjeheegjnnmheaflhdocglkiegoni?utm_source=chrome-ntp-icon
If you open this link in chrome, it will load the application and then load the specific content in a popup. I want to load the content of the popup first and then load the application in background. How should I write my application to achieve that.
My suggestion (and I say this as I start to do similar vs. having proven it successful) would be to make some level of framework fairly static so that users get an almost instant response to the site loaded and then start the angular app with something like this
angular.bootstrap(document.getElementById("container"), ["app"])
Ref for the api - https://docs.angularjs.org/api/ng/function/angular.bootstrap
Ref for a demonstration of this - https://egghead.io/lessons/angularjs-angular-bootstrap-app-init
My expectation then is that you will be able to
Load your static elements quickly (which will just have placeholders for your content/material)
Access the data you want in the order you want to get it to present on the screen
Release any other part of the app you need to chrome it up/decorate or populate side items.

Resources