meteor / mobile-packages

Meteor packages that provide functionality on mobile and desktop via Cordova plugins.

Mobile Packages

This repository contains three simple Meteor packages that work on mobile and desktop. There are also three small example apps that demonstrate their usage.

These packages work with Meteor 0.9.2 and above.

Packages

Camera

The package mdg:camera allows you to take photos on desktop and mobile with a single function call.

Read the full Camera documentation here.

Geolocation

The package mdg:geolocation provides a reactive interface to the device's GPS location.

Read the full Geolocation documentation here.

reload-on-resume

The package mdg:reload-on-resume delays hot code push on mobile devices until the user has closed and re-opened the app, so that their experience is not interrupted by a reload.

Read the full reload-on-resume documentation here.

Example Apps

simple-photo

This example app has one button that takes a photo and displays it on the screen. It demonstrates usage of the Camera package.

simple-map

This example app uses the Google Maps Static Maps API to show a map with a marker at your current location. It demonstrates usage of the Geolocation package.

SoLoMo

This is the app that was first used to demonstrate Meteor Cordova functionality at the Meteor Devshop in August 2014. It uses the Camera, Geolocation, and reload-on-resume packages, in addition to local packages for Ionic Framework CSS and a simple implementation of the Google Maps Javascript API.

mobile-packages's Issues

[GeoLocation] iOS Cordova not working.

I have been able to get GeoLocation to work in every case but iOS Cordova (Only tested in iOS 8). This works on iPhone mobile safari and in Android cordova:

Meteor.startup(function() {
  if (Meteor.isCordova) {
    Tracker.autorun(function () {
      if (Meteor.user()) {
        var geo = Geolocation.latLng()
        console.log('GEO ERROR:', Geolocation.error())
        console.log('geo:', geo)
        if (geo && geo.lat && geo.lng) {
          geo.lat = geo.lat.toFixed(5)
          geo.lng = geo.lng.toFixed(5)
          var old = App.currentLocation.get()
          if (old.lat != geo.lat || old.lng != geo.lng) {
            App.currentLocation.set(geo) 
          }
        }
      }
    });
  }
});

Is there some configuration I am missing or is this a bug?

Thanks!

When using bootstrap 3, the photo display dialog is styled poorly

First of all, this is an amazing package!

When adding mizzao:bootstrap-3, the dialog showing a photo after it was taken has the image sticking out of it. The dialog for taking the photos is fine.

App crashes when photo is taken

The camera package works well every now and then and is great when it does. The problem comes once a photo is taken and on accepting the captured image the app crashes and restart.

I don't know what is happening or how to go around this issue.
Any help appreciated!

Crashes App

It works fine in browser, but when I try 'meteor run android', I get:

Error: version not found: 0.3.10 : org.apache.cordova.geolocation/0.3.10
at RegClient.

Unsatisfied constraints - can't install with 'meteor add'

Hi!

I'm having trouble adding these packages. They all return me the same error, that the constraints can't be satisfied. If I knew how to find out which constraints aren't satisfied, I might be able to report more clearly, but I've got Meteor 0.9.2-rc8, running with Cordova, and a bunch of other packages, specifically:

• meteor-platform
• accounts-ui
• accounts-password
• accounts-facebook
• accounts-twitter
• natestrauser:font-awesome
• iron:router

The command and output are as follows:

$ meteor add mdg:camera
Refreshing package metadata. This may take a moment.
Figuring out the best package versions to use. This may take a moment.
Could not satisfy all the specified constraints:
Error: conflict: mdg:camera can't be satisfied

Any idea how to fix this?

Thanks!

Error: Template is not defined when trying to set-up a test project

Dear,

I always get next error:
ReferenceError: Template is not defined
W20141111-10:02:01.043(1)? (STDERR) at app/solomo/packages/google-maps/maps.js:150:1

When starting: meteor run android

Is my procedure to set up a test-project correct?

1. meteor create
2. git clone to get the files from mobile-packages and copy them in the /packages folder
3. copy the files under /examples to the root of
4. meteor add-platform android
5. meteor add mdg:camera and same for mdg:geolocation and mdg:reload-on-resume
6. meteor run android

Thanks in advance for any help!

EXIF information from camera

Is there a way to get EXIF metadata from the camera?

It seems to only report width and height, but not other standard metadata like date or lat/lon. I think the cordova camera can do this normally (outside of meteor).

Picture Orientation

Photos don't seem to respect the camera orientation (vertical photos are being rotated to horizontal). I did some quick googling and it looks like this might explain it:

http://stackoverflow.com/questions/12700989/phonegap-return-current-orientation-during-image-capture

(add the "correctOrientation" : true option)

navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
destinationType: destinationType.FILE_URI,
correctOrientation: true });

[Camera] Second call to getPicture doesn't work

To reproduce on ios-device:

• call getPicture
• take a picture
• select "Use Photo"
• call getPicture again

You get this screen, with a black image:

Tapping the "take" button does nothing, tapping the "change camera" button appears to show a blurry version of the last picture taken.

You can successfully take a picture again if you restart the app.

Camera.destinationType to FILE_URI rather than DATA_URL

does the options params allow for navigator.camera.DestinationType.FILE_URI rather than the Data URI string?

As per Cordova's camera docs:
To avoid common memory problems, set Camera.destinationType to FILE_URI rather than DATA_URL.

App restarts after confirming photo from back camera on android

You can try using the simple-photo example.

Run it on your Android phone, take a photo using the back camera, then press "OK" : the screen will go dark and the meteor splash screen will reappear, meaning the app just restarted.

I launched it using meteor run android-device : no error in the client or server console.

"more than one device and emulator" on Linux + Android

If I happen to have my Android connected to my Ubuntu when I run meteor run android, meteor will display

error: more than one device and emulator

• waiting for device -

It's easy enough to disconnect the phone, but is there a better way to handle this situation?

The same error occurs with meteor run android-device if the emulator is still running.

When does the Geolocation become available?

I am writing an app using Geolocation, but having trouble accessing the Geolocation object. For example, I have tried to access Geolocation.latLng() in my subscriptions (to filter the data by geolocation), but it keeps returning null. When/where is the Geolocation object available?

Camera on android emulator needs sd card

Hello everybody,

After adding the camera package and testing it out in the android emulator, i get the following error :

Any idea how to tweak the emulator to support sdcards ?

Works only on browser?

I am eager to use the mdg:geolocation package on my android app, (meteor 1.0) sadly it doesn't seem to work on android. And no error! (either on emulator or device) Here is my bit of test code:

Meteor.startup(function() {
Meteor.setInterval(function() {
    var position = Geolocation.currentLocation();
    console.log(position);
    if (!position)                                                             
        console.log(Geolocation.error());
}, 10000);
});

So when launched on my chrome browser, here it goes:

Geoposition {timestamp: 1414616019863, coords: Coordinates} 
Geoposition {timestamp: 1414616019863, coords: Coordinates} 
Geoposition {timestamp: 1414616019863, coords: Coordinates} 
Geoposition {timestamp: 1414616019863, coords: Coordinates} 
Geoposition {timestamp: 1414616019863, coords: Coordinates} 
Geoposition {timestamp: 1414616019863, coords: Coordinates} 
...

And on android emulator:

I20141029-22:01:39.663(1) (android:http://meteor.local/client/main.js:4) null
I20141029-22:01:39.665(1) (android:http://meteor.local/client/main.js:6) null
I20141029-22:01:49.673(1) (android:http://meteor.local/client/main.js:4) null
I20141029-22:01:49.678(1) (android:http://meteor.local/client/main.js:6) null
I20141029-22:01:59.682(1) (android:http://meteor.local/client/main.js:4) null
I20141029-22:01:59.686(1) (android:http://meteor.local/client/main.js:6) null
...

It's the same output if I use latLng() instead of currentLocation(). Also, the android emulator shows that the GPS is being used in the top taskbar.

Is there something I do not get? This package should work on android, right?

Camera doesn't seem to work in iOS8

I know I correctly implemented the camera package because viewing my meteor app in the browser works correctly and returns a photo, the iOS app on my 6 Plus in iOS 8 will let me take a photo but nothing gets returned while doing:

if (Meteor.isClient) {
  // counter starts at 0
  Session.setDefault("counter", 0);

  Template.hello.helpers({
    counter: function () {
      return Session.get("counter");
    },
    picture: function(){
      return Session.get("picture");
    }
  });

  Template.hello.events({
    'click button': function () {
      // increment the counter when button is clicked
      MeteorCamera.getPicture(function(err,res){
        if(!err) Session.set("picture", res);
      })
    }
  });
}

Console in Xcode and meteor show nothing wrong after selecting the photo though

Cannot checkout in windows

Because of : in the folder names
Please update to meteor 1.1 and fix the paths accordingly

Cordova geolocation not working on Android M preview

May have to do with new permission schemes in android M preview.

I know this is a preview release of the OS but I thought we'd better be aware in advance.

Also this may have more to do with cordova.

If so let me know.

Many thanks!

what is the permission needs to be given to the app to open camera for a video chat

mdg:geolocation ~ position won't be watched / asked again after error

When onError is triggered we should set watchingPosition to false, so then we can call startWatchingPosition again ( and try to fetch the location again ).

At the moment if i received a TIMEOUT error, it doesn't retry and it seems that the app will only update the position if you refresh the page, when you could actually just call watchPosition again and get onPosition callback called.

[Reload] FR: alternate method of reloading

I think a better user experience would be for the refresh to happen when the user leaves the app, like this:

window.addEventListener 'blur', ->
  # reload if new version available

(Occasionally doesn't fire until app is brought back to foreground.)

Also, think it would be good to distinguish in the readme that you don't mean the user has to quit the app, just leave it (send to background) and return:

http://cordova.apache.org/docs/en/4.0.0/cordova_events_events.md.html#resume

[Android] Turning GPS on while app is running does not work?

I do no know if it is in the scope of this project, but when I start up, say, simple-map on my Android phone with the GPS turned off, and only then turn the GPS on while the app is running, meteor is unable to catch that activation. (also, the geolocation icon does not appear in the status bar, unless I am using another geolocation app in the background)

Only if I press the back button does it "reload" the app and then it works, and the geolocation icon appears. It also works if I have GPS turned on prior to launching the app.

Is there a way to detect GPS activation within the meteor app? Or should I put a "check again" button on my app that does ̀window.location.reload()` ?

Why geolocation always running ?

    # get location data
    Tracker.autorun (computation) ->
        if Geolocation.currentLocation()
            Meteor.call "getNearCities",Geolocation.latLng(),(e,data)->
                Session.set("nearLocations",data)
            computation.stop()

hi I use this code to get location but I need only one time per reload but this seems working always how can I stop this?

Styling width issues

The various UI components don't handle small screen widths very gracefully.

E.g 1:

And:

mdg:location ~ Geolocation.currentLocation() returns null even when location is available through browser navigator.geolocation.getCurrentPosition

The first time i install my app the application is getting an onError "TIMEOUT" and don't try to fetch the position anymore.

The side effect is that Geolocation.currentLocation() will be null even after the user has authorized the location service, therefore making the location available through: navigator.geolocation.getCurrentPosition( my_callback )

related to: #62

Recording video ?

Is it possible to record video using this package ?

Browser camera asks for permission on every picture

MeteorCamera.getPicture() requires that the user give browser camera access on every photo.

FR: Allow customizable name for iOS permission dialog

I'd rather it say my app's name instead of http://meteor.local:

Camera Selection

There is currently no way to specify which camera to use.

[Camera] Use a background thread

I get this warning when calling getPicture on ios-device:

THREAD WARNING: ['Camera'] took '1005.238281' ms. Plugin should use a background thread.

Geolocation.latLng() gets updated only when the browser is refreshed or tab is re focused

As mentioned in the documentation,
"Every method is reactive using Tracker"
I'm not able to see the reactive update of Geolocation.latLng() values. I can see updated values only when I reload the page or re focus on the tab where the app is running.

Addable?

I can't really read meteor package metadata, but I can't add this to my project :(
Tried Meteor 0.9.1.1 and also last tagged release (0.9.2-rc8) off git

Figuring out the best package versions to use. This may take a moment.
Could not satisfy all the specified constraints:
Error: conflict: mdg:camera can't be satisfied

http://i.ytimg.com/vi/2hlu0qd1Huc/hqdefault.jpg

Deprecated UI call in photo-browser.js

In photo-browser.js

UI.insert(view, document.body);

Warning: Blaze.insert has been deprecated. Specify where to insert the rendered content in the call to Blaze.render.

Question: Camera.getPicture: source type 1 not available.

I've been trying to get the camera to work with the simple-photo example.
I consistently get this message. Even after updating to rc8 and changing the camera dependency from 3.0 to 3.1.
When I change sourceType to Camera.PictureSourceType.PHOTOLIBRARY it does ask for permission to the photo library and if I allow it shows what's there.

Any thoughts?

Warnings on MeteorCamera package

Getting

Warning: Blaze.render without a parent element is deprecated. You must specify where to insert the rendered content.

and

Warning: Blaze.insert has been deprecated.  Specify where to insert the rendered content in the call to Blaze.render.

warning messages on the console. Can this package be updated to the latest Blaze version? Thanks.

Reload.isWaitingForResume() - ReferenceError: Reload is not defined

Reload.isWaitingForResume() - ReferenceError: Reload is not defined
Seems like Reload was not exported to global namespace...

Solomo fails to start: "conflict: logging can't be satisfied"

This was done with a newly reinstalled meteor.

➜  solomo git:(master) meteor
Figuring out the best package versions to use. This may take a moment.
Refreshing package metadata. This may take a moment.
Could not resolve the specified constraints for this project:
Error: conflict: logging can't be satisfied

Updating the app via meteor update --release 0.9.4-pre.11 solved the problem for me.

Listen to "location ready" ?

Let's say i have a client side app with some javascript code which needs to know when the location is available.

Is there a simple "event" for that?

Sorry i'm still in this phase where everything is too magic and i can't figure out basics ( as in: i bet there is some general "meteor way" )

Styling with Viewport

In camera.less, the popup window is sized to a particular pixel width. When designing for mobile with bootstrap-3 and a viewport setting, this causes the 'Use Photo' button to be off screen with no way to click that button.

  &.camera-popup-wide {
    width: 480px;
    margin-left: -240px;
    top: 5%;
  }

Cordova, remote server

Hello Sir.
I'd like if there is some way to create a Meteor Cordova App linked to a remote server (.meteor.com) and how it would be.
Thank you very much.

Video and camera-popup height on mobile browser

When rendering the camera-popup in mobile browser, the video element get a almost whole screen height, hiding the buttons for take picture and cancel.

I am trying to fix it, but wondering if giving a fixed height to the video element is a bad idea.

cheers

Mobile Location

So, I am getting the same result with my app as with the simple-map app (which I downloaded and tested). I have location working on my desktop, but my physical android device isn't displaying location (giving 0,0 in the simple-map app). Furthermore, my apps GPS icon is visible on the top, so I know it's at least trying to get the location. Also, there is no Geolocation.error printing out.

Edit: I am aware that the emulator doesn't have access to location, that is why I am running it from my android device.

Update: when I deployed to a test meteor server and accessed it through chrome on my android, it asked for my location and then after I allowed it, it still didn't work, although the GPS in the upper right is still blinking.

Camera.PictureSourceType PHOTOLIBRARY or SAVEDPHOTOALBUM

Can I somehow allow users to select an existing image from gallery?

[geolocation] latLng only works after calling currentLocation

I give the tab access to my location, and I then do the following in the console:

> Geolocation.latLng()
null
> Geolocation.currentLocation()
Geoposition {timestamp: 1422413895716, coords: Coordinates}
> Geolocation.latLng()
Object {lat: 37.0..., lng: -122.0...}

iOS platform shouldn't be configured by default in the solomo example

I'm on Ubuntu and spent a while confused thanks to meteor/meteor#2672 / meteor/meteor#2690. It'd be helpful if iOS wasn't present as a platform by default. Maybe a few lines of quickstart documentation on adding platforms could be added to the readme instead?

(I'd submit a pull request myself, but this is my first time trying Meteor -- so I'm not sure whether there are additional steps beyond running meteor remove-platform.

Camera Modal Conflict With Ionic Modal

I am using this package with Ionic. I have a camera button inside an Ionic Modal. When I activate the camera it seems to be behind the Ionic Modal (only when I dismiss the modal I could interact with the camera controls) However, looking at the CSS the camera-popup has the highest z-index.

.camera-popup {
position: fixed;
z-index: 1000;
top: 20%;
width: 320px;
left: 50%;
margin-left: -150px;
font-family: sans-serif;
background: white;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
line-height: 1.3em;
padding: 20px;
border-radius: 10px;
}

.modal-backdrop {
  -webkit-transition: background-color 300ms ease-in-out;
  -moz-transition: background-color 300ms ease-in-out;
  transition: background-color 300ms ease-in-out;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
}

Camera not working on iOS 8?

I'm sure I must be missing something here since these are mobile packages but I can't seem to make the Camera work on IOS8 (Safari nor Chrome). I'm just getting a message that reads "Sorry, this browser is currently not supported for camera functionality".

Am I missing any package that should be added?

[FR] Add ability to reload without restarting app

Can be used to display a message to the user that says "new version available, restart the app to update."

It would be nice to be able to display a message, "New version available, click here to update", and then the in-app browser refreshes to the new version, especially since many users don't know how to restart apps. Could a Reload.update() function be added?

[camera] iOS mobile browsers

Is there a way to make camera plugin work in browser on mobile?
Neither Safari nor Chrome seem to work on iPhone. (ios7, 8).
Example site: http://vancouver.meteor.com/

Android app always offline, even if the phone is online

Hi, have an Android app with appcache + reload-on-resume.

I build the app and install the apk in an Android device.

When the app first starts, everything is ok.

Then I force the offline mode on the phone (WI-FI off). I get the info that the app is offline (msg based on Meteor.status()).

When I turn WI-FI on again, the app never recovers from offline mode.

This doesn't happen if I have just appcache (without reload-on-resume) installed.

What am I doing wrong?

Thanks