Phonegap email composer not opening email client - ios

I can't seem to make the email composer plugin work. I added it to the project using console and added the line prescribed in the readme file on the config.xml
<gap:plugin name="de.killercodemonkey.cordova.plugin.email-composer" version="0.8.2" />
This is the package I'm using
Also, upon submitting this to PhoneGap Build, it does not list the plugin after it builds.
This is the code that I have bound to a button. The binding only happens after deviceready and any function runs are undeniably after deviceready.
function SubmitToEmail()
{
alert(1);
email.isAvailable(
function (isAvailable) {
if(isAvailable)
{
email.open({
to: 'john.doe#email.com',
subject: 'Need Help!',
body: 'Hello, my name is John Doe and I currently need help at my current location. Thanks',
isHtml: true
});
}
else
alert('Please configure your default email client before proceeding.');
}
);
}
The alert seems to trigger but anything beyond that does not work. I have tried both namespaces "cordova.plugins.email.open" and "email.open" and neither seem to work.
I'm testing my app inside the phonegap app on iOS.
I'm not sure what is it that I'm doing work here. Please help.
Thanks
EDIT: Is there anyway to troubleshoot this? How do I see any errors that are generated from running this code on the phonegap app? Thanks

If you want to use the phonegap build version of the plugin you have to use the source pgb
<plugin name="de.appplant.cordova.plugin.email-composer" spec="0.8.2" source="pgb" />
If you want to use the npm version use
<plugin name="cordova-plugin-email-composer" spec="~0.8.2" />

Related

In google sheets add some kind of dialog box that will display on an ipad

I am trying to add a yes/no message box to a google sheet that will display on an iPad. I have tried all the things below but none of them display the message. My goal is if the user changes a field the macro will change other fields if the user says it is ok. I can get this to work on a windows machine with no issues but when I try it on an ipad the message never appears. At this point I am just trying to get a message box to appear. This is what I have tried
1.
function onEdit(e) {
Browser.msgBox("test");
}
Result: The macros times out
2.
function onEdit(e) {
var html = HtmlService.createHtmlOutputFromFile('Page')
.setWidth(400)
.setHeight(300);
SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
.showModalDialog(html, 'My custom dialog');
}
Page.html:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
Hello, world! <input type="button" value="Close" onclick="google.script.host.close()" />
</body>
</html>
I enabled the trigger for onEdit to get it to work and it works on the windows machine without issues but when run on the iPad I get:
Exception: You do not have permission to call Ui.showModalDialog. Required permissions: https://www.googleapis.com/auth/script.container.ui
So next I tried:
3.
function myFunction(){
Logger.log("myFun")
var html = HtmlService.createTemplateFromFile( 'Page' )
.evaluate()
.setWidth( 800 )
.setHeight( 400 );
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.showModalDialog( html, 'My page title' );
}
function onEdit(){
ScriptApp.newTrigger('myFunction')
.forSpreadsheet(SpreadsheetApp.getActive())
.onEdit()
.create();
}
Using the same page.html, this time in executions it looks like it runs but no box appears on the ipad(it does work on windows). I also tried spreadsheetApp.getUi().alert and prompt, these had the same results.
And Yes I have to use the iPad, I can not use another type of tablet.
Issue:
"Exception: You do not have permission to call Ui.showModalDialog. Required permissions: googleapis.com/auth/script.container.ui"
Fix:
What you can do is installing the trigger instead of using a simple trigger. The image below shows the difference between an installed (above) and a simple (below) trigger using the same code.
Output:
Note:
Don't use reserved function names on installed triggers to avoid it being executed twice like what's shown above. Change onEdit to something like promptUI or something else.
If the above fix isn't enough to show the dialog box, then we need to confirm if the issue might just be on the safari browser (if you are using one) since it worked on your other devices which I assumed are not using safari. You can try using an alternative browser in your device such as Google Chrome and see if the same issue persists. I recommended doing this since i'm seeing a number of issues between showModalDialog and safari
EDIT:
I have seen these related posts pointing out that there are some limitations on mobile apps. See the references below.
Also, some answers suggests that you need to access the spreadsheet via browser (google chrome desktop mode) and then trigger the script there.
References:
Add a script trigger to Google Sheet that will work in Android mobile app
google speadsheet api onOpen does not work on mobile ios
Executing Google Apps Script Functions from Mobile App
How to get scripts to work with phones and tablets

Cordova - Displaying local image files in a <img> tag

I have a Cordova app (built on Ember.js, using the Corber addon) that I am currently only running on iOS, specifically the iOS simulator (iPhone 8, iOS v12), so it is using a WKWEBVIEW.
The app is using cordova's file plugins to download remote images and store them on the user's device, currently in the "Documents" (cordova.file.documentsDirectory), which works fine, and I've verified that the images do in fact exist there. However I can't figure out the correct URL/URI to use to display those images in the app via standard <img> tags.
Cordova's own documentation says to use the cdvfile:// protocol path (https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-file/#cdvfile-protocol), but even with following the instructions there (adding the content-security meta tag to the index.html, the access rule to the config.xml, etc), it seems like WKWEBVIEW just flat out does not support this protocol, giving me "unsupported URL" errors in the console when I attempt to use it.
Other SO answers on the subject suggest using a normal URL path relative to the cordova app's web server URL, e.g. things like <img src="/Library/NoCloud/path-to-my/file.jpg"> but any path I try 404's.
This seems like such a simple/common use case, but I'm stumped.
For anyone else struggling as I was - there is also a solution, which requires no significant change to the code which I found after hopeless days when no solution seemed available
There are 2 steps required:
First update your config.xml with following
<platform name="ios">
<preference name="scheme" value="app" />
<preference name="hostname" value="localhost" />
</platform>
Then convert your file:// link by using the undocumented method
window.WkWebView.convertFilePath(filePath)
This method performs the conversion into a virtual localhost link that makes the file accessible and bypasses the WkWebView restrictions. A little bit longer sample goes like this
let localFile = cordova.file.dataDirectory + 'logo.png';
let convertedPath = window.WkWebView.convertFilePath(localFile);
document.getElementById("myImg").src = convertedPath;
I did not work with Cordova but docs you linked say this:
To use cdvfile as a tag' src you can convert it to native path via toURL() method of the resolved fileEntry, which you can get via resolveLocalFileSystemURL - see examples below.
And gives this as an example:
resolveLocalFileSystemURL('cdvfile://localhost/temporary/path/to/file.mp4', function(entry) {
var nativePath = entry.toURL();
console.log('Native URI: ' + nativePath);
document.getElementById('video').src = nativePath;
Given all that, I would say that you can try to create a component, cdv-img. Something like this supposed to work, I think:
import Component from '#ember/component';
export default Component.extend({
tagName: 'img',
cdvPath: undefined,
didReceiveAttrs() {
this._super(...arguments);
if (this.cdvPath) {
resolveLocalFileSystemURL(this.cdvPath, (entry) => {
this.$().attr('src', entry.toURL());
});
}
},
});
Use it like this:
{{cdv-img cdvPath='cdvfile://localhost/temporary/path/to/file.jpg'}}
UPD
If it does not work with file protocol, you can try to convert image to data url
import Component from '#ember/component';
export default Component.extend({
tagName: 'img',
cdvPath: undefined,
didReceiveAttrs() {
this._super(...arguments);
if (this.cdvPath) {
const el = this.$();
resolveLocalFileSystemURL(this.cdvPath, (entry) => {
entry.file(function (file) {
const reader = new FileReader();
reader.onloadend = function() {
el.attr('src', this.result);
};
reader.readAsDataURL(file);
});
});
}
},
});
Make sure you don't forget to add these 2 lines and try with whatever solution you are trying, I got my images shown after adding them:
In your config.xml file. add:
<preference name="allowFileAccessFromFileURLs" value="true" />
<preference name="allowUniversalAccessFromFileURLs" value="true" />

'meteor build', cordova - error for ios platform

I am trying to build my hello app (works on a web browser) for mobile platforms. I ran the command 'meteor build ../mobile/hello --server=localhost:3000' on the terminal. The build process for Android was successful but not for iOS.
Does anyone know what the issue could be?
Error:
=> Errors executing Cordova commands:
While preparing Cordova project for platform iOS:
Error: ENOENT: no such file or directory, open
'/Users/John/apps/hello/.meteor/local/cordova-build/platforms/ios/hello.xcodeproj/project.pbxproj'
I searched on google and some suggest it could be an issue with mobile-config.js file. I already checked that file and it seems ok.
// This section sets up some basic app metadata, the entire section is optional.
App.info({
id: 'com.example.hello',
name: 'hello',
description: 'hello',
author: 'John',
email: 'contact#example.com',
website: 'http://example.com'
});
// Set up resources such as icons and launch screens.
App.icons({
'iphone': 'icons/phone.png',
'iphone_2x': 'icons/phone2.png'
// More screen sizes and platforms...
});
App.launchScreens({
'iphone': 'splash/anotherPhone.png',
'iphone_2x': 'splash/anotherPhone2.png'
// More screen sizes and platforms...
});
// Set PhoneGap/Cordova preferences.
App.setPreference('BackgroundColor', '0xff0000ff');
App.setPreference('HideKeyboardFormAccessoryBar', true);
App.setPreference('Orientation', 'default');
App.setPreference('Orientation', 'all', 'ios');
// Pass preferences for a particular PhoneGap/Cordova plugin.
App.configurePlugin('com.phonegap.plugins.facebookconnect', {
APP_ID: '1234567890',
API_KEY: 'supersecretapikey'
});
// Add custom tags for a particular PhoneGap/Cordova plugin to the end of the
// generated config.xml. 'Universal Links' is shown as an example here.
App.appendToConfig(`
<universal-links>
<host name="localhost:3000" />
</universal-links>
`);
Delete from your project the folder /.meteor/local
launch Meteor again
Warning: you will loose your DataBase (it is located inside the local folder)
Tks #ghybs for the solution. I encountered the same issue and worked perfectly fine for me.

Can gulp-freemarker be used in a gulp build to address what fmpp.tools.AntTask does in an ant build?

new here, so I hope this question is adequate.
We have a an ant build file that runs a task to preprocess html template files. Here is the snippet from the build file.
<!-- Process the templates. -->
<fmpp sourceroot="on-board" outputroot="${template.dir}" removeExtensions="TMPL" >
<include name="**/*.TMPL" />
<data expandProperties="true">
DEBUG: true
CONTENT_REVISION: r${Revision}
CONTENT_PACK: vzw-${TRACK}
</data>
</fmpp>
I am working with polymer now and want to convert our build to use gulp because fmpp (and yuicompressor) are choking on some of the js files in polymer due to reserved words. I found a gulp-freemarker plugin that I thought might be able to substitute for fmpp. However, 1) I am not sure of this, and 2) I can not seem to get anything working with gulp-freemarker including their example code from github.
Here is my gulpfile:
var gulp = require('gulp');
var freemarker = require("gulp-freemarker");
gulp.task('myfmpp', function()
{
return gulp.src("./app/en_US/hello.json")
.pipe(freemarker(
{
viewRoot: "app/en_US/",
options: {}
}))
.pipe(gulp.dest("./www"))
});
This seems to run OK - no errors - but there is no apparent output. Since I am a bit new to this stuff, I may not know what I should be looking for...
Anyway, my ultimate goal is to achieve the same preprocessing result from gulp-freemarker as with ant/fmpp. Can anyone help answer this and point me in the right direction?
Thanks!
Ken

Unable to consume Odata service in a Phonegap IOS Project?

I am trying consume a Odata service using datajs-1.0.0.js using the code below.It runs well in a browser.
OData.read("http://services.odata.org/Northwind/Northwind.svc/Customers('ALFKI')/Orders",
function(data){
alert('oData Function');
var str;
alert('before for');
for(var objRec in data.results){
var obj = data.results[objRec];
str = str + ' '+obj.OrderID;
}
alert(str);
alert('after for');
}, function (err) {
alert(err.message);
});
Now I need to run it in a Phonegap IOS Project (version Cordova 2.4) however nothings happens.It does not throw any error as well. I have added the URL in the config.xml file of phonegap to allow external host.
<access origin="*" />
The same code works fine when I run it in Android Phonegap Project.
Is there anything that I have missed out?
Does setting the OpenAllWhitelistURLsInWebView to YES or upgrading to datajs 1.1.0 solve the problem?

Resources