How should one use action in mobile app? - ember.js

Since in mobile app there is no click and there is a touchEnd event how i can use it easly with ember.js ?
I know i can create a Ember.View with
events:
touchEnd: ->
console.log('my action')
I'm just searching for some more convenient way since creating a view for simple link in list is not the fastest way ;)

There is a touch gesture addon for ember called ember-touch. You can find it in https://github.com/emberjs-addons/ember-touch.
I hope it helps

Related

Ionic2 web app routing configuration

I am working on ionic2 project, which is web project (i.e. runs as a website on browsers not a mobile app). Here I am facing difficulty to give specific URL for pages. How do I implement routing in my project ?
I also worked with angular2. Where we can give URL to components. But here that thing is not working.
Take a look at this website: https://www.joshmorony.com/a-simple-guide-to-navigation-in-ionic-2/
and read up on the nav controller here: https://ionicframework.com/docs/api/navigation/NavController/
Some Context: While Ionic2 does use the native browser for each platform, it uses a special controller to change routes
NavController is the base class for navigation controller components like Nav and Tab. You use navigation controllers to navigate to pages in your app. At a basic level, a navigation controller is an array of pages representing a particular history (of a Tab for example). This array can be manipulated to navigate throughout an app by pushing and popping pages or inserting and removing them at arbitrary locations in history.
Before diving deeper into Ionic I suggest obtaining an understanding of this controller.
This sample ionic project will also help with the understanding of navController:
https://github.com/ionic-team/ionic2-starter-sidemenu

How to create generic popup for across the app?

I am trying to create a popup which is available and controlled by across application.
so I keep the html assets in app template. and the I would like to show and hide the popup any page from the app.
I understand that, It can achivable by service. but I don't have much idea to implement this. any one suggest me the right way?
Required is : show popup from any page, close pupup on click of close button in the popup.
here is my Twiddle
In case of angular it can be achieved from factory object.
I would probably do this:
create a component for the popup
create a service for the popup that that exposes methods for setting a property called "isOpen" to true/false. Other parts of the app can use the methods for opening and closing the popup.
Inject the popup service into the application controller
Add it to the application template in an {{if popupService.isOpen}} block
Good luck, remember to write lots of tests, make sure each part is working before you go to the next step, and remember to consult the guides often ;-)

How to Disable `back` and `forward` button of the browser window

In my applicaiton, I requried couple of things to be added.
No forward/Back Browser button should work for reach a hash.
Instead of brower back forward, there should be a back and forward button has to added in the applicaiton itself.
how to achive this both?
I am looking for a component to use globally for both 2 requriements.
Thanks in advance.
Disabling the native back/forward buttons of the browser in Ember.js is quite unusual but could possibly be achieved by using the NoneLocation class. To enable that open the config/environment.js file of your app and change the locationType property to none.
If you want to display back/forward buttons in your app you can use the History API and specifically window.history.back() and window.history.forward()

ember.js - common functionality shared across controllers - popups, notifications

i've red quite a of lot tuts and articles on ember.js and made some basic stuffs - some sanbox and test things, complete login screen with many outlets, actions, ajax and so on... but I am now facing one problem.
Ember.js is for "Single Page Application" and I did not found a way (yet?) how can I make and share basic functionality across more "ember apps"/parts?
I have some backend and then some modules (users, files, news,...) and each is made by classic:
App = Ember.Application.Create()
But I need to have some shared functionality and I dont want to repeat in at each app - I want to be able to show some notification - once from user app then from files app and so on. Or to have unified modal window, or function that check some things in background on server and push updates to notifications area that is running on each of those app parts...
How should I solve it? Is there any way of extending base App? or have to separates App on one page that communicates to each other? I've also read something about Ember namespaces but I am not sure if it is the right thing and how to user it :(
note: Each module (dashboard, users, files,...) is loaded as new page (complete html, new scripts,...), but module itself work as a SPA and on AJAX.
Ember.js has awesome documentation but real word example articles on how to use it are showing slowly and I had no lucky finding some tut/article on solving this problem in real world.
You can set another module and run it as another ember app in the same page, define the root element of the apps
var AppNotification = Ember.Application.create({
rootElement: '#notifications'
});
var AppUsers = Ember.Application.create({
rootElement: '#users'
});
So you need to associate the main apps to a div (#dashboard,#users,#files) and another div for the notifications.
I don't know if it it possible to communicate from one app to another, this is very advanced, but you can investigate ember instrumentation...http://emberjs.com/api/classes/Ember.Instrumentation.html
Good Luck
I just remembered (beer enligthment) other different way I've read months ago... load async code from the router JSBin example
You can have your notification js stuff and take the templates using this SO answer

Reload googlemaps after user clicks a link in Django

I am doing a project in Django and i want to have some google maps displayed in my site. So, i installed django-easy-maps and successfully used it in a sample template. So, i am ready with my maps.
The interface i want to implement is this
http://i49.tinypic.com/sowm74.png
I want to display the maps where the Hellow World! container is and with different links on the sidebar i want to refresh the map being displayed on user click without reloading the page.
I did some researching and it seems Ajax is the solution...
Can anybody tell me how i might achieve this (with or without Ajax ) ?
Sorry for sounding like a noob but i am fairly new to this.
The basic steps are:
Create a view for the Google Maps section to the right. This view does not return a full HTML page but only the HTML for that section (which contains your Google Maps map).
When the user clicks on a link on the left, use JavaScript to perform an ajax call to request that page. In short this means: attach an event handler to the onclick event of those links and in code you can perform an ajax call .Many people use a JavaScript library for this purpose, such as jQuery (which has $.ajax()).
You can then use JavaScript to put the received HTML inside the container on the right (using $.html()).