Menu icon Foundation
How to add a touch library ?

Hi,

I am testing Foundation for Apps by building an app who will be used only on mobile devices, so I need the "touch" support.

I did not see any thing about gesture or touch in the actual documentation. I could use a javascript plug-in, but there is an Angular provider who do that well enough for me. The "ngTouch", provider.

Did I miss something in the doc or how could I inject a new provider without altering the base files and keep the possibility to update the framework ?

appsangularproviderngTouch

Hi,

I am testing Foundation for Apps by building an app who will be used only on mobile devices, so I need the "touch" support.

I did not see any thing about gesture or touch in the actual documentation. I could use a javascript plug-in, but there is an Angular provider who do that well enough for me. The "ngTouch", provider.

Did I miss something in the doc or how could I inject a new provider without altering the base files and keep the possibility to update the framework ?

Ioannis Karavasilis over 4 years ago

So far, I've figured that If you want to inject services/providers to your app, you have to do so in

bower_components/foundation-apps/js/angular/app.js

which isn't very clean as an approach, but at least it's working.
I think that the docs could use some improvement, specifically with regard to developers. Personally I need to know what's happening behind the scenes, so I can organize better my project structure, task runner etc.

As for the gestures, you could either use ngTouch or angular-gestures https://github.com/wzr1337/angular-gestures, bu injecting them in the aforementioned app.js file.

If anyone has found a better/cleaner way, please let us know

Rafi Benkual over 4 years ago

We are exploring a touch library for the 1.1 release. So far we are looking at ngTouch, doubletap, hammer.

Anyone have suggestions!

Hans McMurdy over 4 years ago

Thats awesome to hear. When will 1,1 be released?
Also it would be cool to use touch to switch between views on the travel template.

Rafi Benkual over 4 years ago

Should be a couple weeks!

James Stone over 4 years ago

I have used hammer in the past and it has worked well. Not too sure how well it integrates with angular though.

Hans McMurdy over 4 years ago

As it stands currently, wouldn't you do something like the following?

Or will there be a way to use YAML for this somewhere down the road?

 var app = angular.module('application', [
    'ui.router',
    'ngAnimate',
    'markdown',
    'foundation.init',
    'foundation.init.state',
    'foundation.common.services',
    'foundation.common.directives',
    'foundation.common.animations',
    'foundation.accordion',
    'foundation.actionsheet',
    'foundation.interchange',
    'foundation.modal',
    'foundation.notification',
    'foundation.offcanvas',
    'foundation.panel',
    'foundation.popup',
    'foundation.tabs',
    'foundation.iconic',
    'ngTouch'  // Add touch
  ])

 // custom stuff here

Jerome Clerc over 4 years ago

Hey guys !

Sorry I was very busy those past days.

Thanks for your answers. I could add 'ngTouch' and it work perfectly.

I am waiting for the release 1.1

By the way : Thanks Zurb for your frameworks. You did it very well.

Rafi Benkual over 4 years ago

We are planning to release a patch this week (1.1) which includes hammer.js http://hammerjs.github.io/
and a few swipe gestures built in. This gives us a basis to expand upon in the future.

Edward Moore 20 days ago

As you are testing an application, the same way I am using the travling application or website or you could call it a travel directory whatever you liked and its https://travelsites.com/ that I have found for my normal uses and helping me alot though