I'm a newbie in BB10 Webworks... I am doing some experiments with the dev alpha's magnetometer...
how can I put these to work? I tried
function magCallback(sensor, data) {
$("#xvalueut").html(data.x);
$("#yvalueut").html(data.y);
$("#zvalueut").html(data.z);
}
blackberry.event.addEventListener("devicemagnetometer", magCallback);
and didn't worked, I also put <feature id="blackberry.sensors" /> in the config file, and inserted a <script src="local:///chrome/webworks.js" type="text/javascript"></script> in the index.html
I hope you can help me...
We have a really good sample app in our GitHub repo that you'll probably want to check-out. It deals with all of the sensors you can access via BlackBerry WebWorks.
Here's the link: Sensors Sample App
Related
I'm a tech teacher and I'm designing a coding course for high school students. I want to teach them Ionic without also having to teach them React, Angular, or Vue. They already know basic web development, so I want them to be able to create iOS, Android, and web apps using only vanilla Javascript + Ionic.
When I run "ionic init" to get started, I'm forced to select from Angluar, React, Vue, or Custom. So, of course, I select Custom.
Then I start building a "Hello World" app. When it comes time to view the simple app in Android Studio, I run "ionic capacitor add android" and then "npx cap open android." All good.
The problem arises when I start adding more to my simple app, and then try to view those changes in Android Studio. Normally, this would be done by running "ionic capacitor copy android". But that doesn't work in my custom app. I get this error message:
[ERROR] Cannot perform build.
Since you're using the custom project type, you must provide the ionic:build npm script so the Ionic CLI can build your project.
How do I solve this problem? How I provide a build script for my custom app?
Thank you for your help!
Since you are using vanilaJS you shouldn't need any build step at all. Just put your index.html to www folder, with some content. You can start off with something like
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ionic without any framework</title>
<script type="module" src="https://cdn.jsdelivr.net/npm/#ionic/core#latest/dist/ionic/ionic.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/#ionic/core#latest/dist/ionic/ionic.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/#ionic/core#latest/css/ionic.bundle.css"/>
</head>
<body>
<!-- We create a vanilla Javascript function to call the alert -->
<script>
hello = async function () {
alert('Hello World!');
};
</script>
<!-- We declare an Ionic app using the <ion-app/> element -->
<ion-app>
<!-- Cool thing, the Ionic CSS utilities could be used too -->
<ion-content text-center>
<h1>Basic usage</h1>
<!-- We add an ion-button with an onclick event -->
<ion-button onclick="hello()">Click me</ion-button>
</ion-content>
</ion-app>
</body>
</html>
and then ionic capacitor copy android should work. (I assume following initialization steps ionic init, npm init, ionic capacitor add android)
I think what is needed after making any changes is to run npx cap sync and then npx cap open android.
Since it would appear you are trying to teach them the bar bones of development I would not even use Ionic. It is a framework for cross-platform development. And once you make a choice of using that framework, you may as well buy in to one of the Javascript/Typescript development frameworks to get the advantages those bring.
For doing POJO work targeted to iOS and Android, I would investigate using Cordova.
Consider it the difference between teaching a student the basics of audio recording on a four-track tape deck rather than a 128-track digital studio with all the bells and whistles.
Many of the basics are the same without the complications of all the advancements.
At my day job doing Enterprise-level financial applications we still use Cordova and have no plans to migrate any time soon.
In my admittedly biased opinion, Cordova would be a better starting point for a "Plain old Javascript object" based introduction to cross-platform development.
This will make the leap into Ionic and Capacitor easier.
Because, again just my opinion, if they haven't learned the advantages of a framework like Angular, going to Ionic/Capacitor is the cart before the horse.
I am working with drop down list on mobiles. For testing purposes I'm using Chrome's mobile emulator. One strange thing I noticed is that in mobile emulation if I have more than two elements in the drop down list they are hidden in a strange way.
HTML I'm using
<!DOCTYPE html>
<html>
<head>
<title>Simple Dropdown</title>
</head>
<body>
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
</body>
</html>
Screenshot of desktop
Screenshot of mobile
I'm using chrome version 48.0.2564.97 m. I tried it on my friend's PC who was running Version 47.x.xxxx.xx (don't remember the exact version) and its working fine on that.
Is this a bug in chrome ? Did any of you faced the same issue ? If yes is there any fix ?
Sorry, this is a bug in M48. Some refactoring happened and it had some adverse affects. It has been fixed in M49 coming soon™. Trying to see if it is reproducible by any team members in stable and get them to backport to M48 if possible.
I've been wrestling with the same bug for a couple hours,
It does not seem to be related to anything css driven and I confirmed that the bug does not present on chrome on my mobile.
I'm sure it's just a bug in the emulator,
firefox's emulator renders dropdowns fine,
I know this isn't all that helpful I just wanted to confirm that you're not the only one seeing this
Do you have an idea what is this "Install this web app" bubble called? I want to know whats the name of that thing so I can research more about it.
Do you also have an idea on how to implement it? I need it to function exactly like the one on the image.
Any useful links related to it will be a great help.
see this .
is very simple to use
<link rel="stylesheet" href="path/to/add2home.css">
<script type="application/javascript" src="path/to/add2home.js"></script>
I have a web app, hosted in a phonegap application (i use phonegap build for this)
The setup is simple, but shouldn't really matter in this case. I'll tell you anyways because sometimes the devil is in the details, right? :)
The details
The phonegap app is really just the minimal setup with one single html. That html actually serves as a splashscreen - the background of HTML has an image. There is a meta refresh tag, set to redirect the page to an external url. I'll call it myurl.com from now.
The website at myurl.com is build using jquery mobile and angularjs. I use that adapter floating around to handle the problem with both frameworks wanting to manipulate the dom on page load. This is the domain the app is really hosted on and where the whole application is run.
The setup
One page has a link to an external page. That page has a bootload of javascript, showing some fancy stuff. If you click the link - your app takes you to that page. That is great! It actually works on all devices. On my desktop browser and android app, i simply hit the hardware (or browser) BACK button and i'm returned to my app at myurl.com. Iphone on the other hand doesn't have a back button :(
My first attempt is creating a landing page that has a back button/link and an iframe to host the fancy page. It works on desktop and android even though i get some exceptions/errors in the console. It doesn't load on iphone - i can only suspect security issues. I am told that what i'm trying to do with the iframe won't work which i think is true.
How do i deal with this? I actually tried the InAppBrowser like this:
var ref = window.open(url, 'random_string', 'location=yes');
And i checked my config.xml has this:
<preference name="stay-in-webview" value="false" />
I also added this to my page:
<script stype="text/javascript" src="phonegap.js"></script>
Leaving out the phonegap.js file since phonegap build promise to include the correct version.
It still opens the page in the same view/app without the possibility to go back - i get the excat same result as just opening the link the normal way.
Help me {insert jedi name here}, you're my only hope!
EDIT:
I found the problem. The phonegap.js file is automaticly deployed ON the device so only the first index.html (with the meta refresh) actually links correctly. The pages on myurl.com is not linking to the file. I placed the phonegap.js on myurl.com and it's working. Only problem, the phonegap.js is different per device - meaning only the device i picked the phonegap.js from is working - the other devices break!
Anywhere i can link to the native apps files? i tried file:///{path}/phonegap.js but it doesn't work. I can see/guess the path, which is different per device, but for iphone its
Payload{name}.app\www - it won't load from there though... i also tried
http://localhost/phonegap.js
but that doesn't work either.
Any ideas?
FINAL EDIT
I decided to go back to the drawing board and place all the html files on the device instead. I'll implement JSONP on my ajax api instead so i can let the API live on myurl.com and still access it from the phone. It's probably also the intended way to make a phonegap app - i just liked the other approach more...
I actually just answered a question like this the other day. You can find it here. In short, see below:
Ensure you have <script src="phonegap.js"></script> in each of your pages that wants to use the inappbrowser
You should NOT need to include a plug-in tag in your config.xml. I am pretty sure that around 2.5 they included inappbrowser in the core build functionality.
To open a link in the inappbrowser, use this javascript:
function openURL(urlString){
myURL = encodeURI(urlString);
window.open(myURL, '_blank');
}
This will open the passed URL in the inappbrowser. If you change window.open(myURL, '_blank'); to window.open(myURL, '_system'); it will open the passed URL in the system browser.
Finally, your item clicks look like this:
<a href='#' onclick='openURL("http://www.urlyouwant")/>
Also, depending on the version of phonegap you are using, stayinwebview is depreciated.
***Based on your edit: Do not put phonegap.js in your project directory. When you upload it to build, it will include it in your project.
We are currently running Google Analytics on an iPhone app, and we got two strange devices appearing at several percents: "DoCoMo P502i" and "Google Wireless Transcoder".
What are these strange devices?
I see the same after implementing the v2 SDK on iPhone. There's not a lot of visits, but enough to do some research.
Google Wireless Transcoder is a project that strips down everything from the page from scripts to styles back to it's bare bones. Some mobile browsers might use the service to reduce the page size before downloading it and showing on mobile devices.
http://www.google.com/gwt/n
It seems that you can instruct Google Wireless Transcoder to not process your page and instead redirect the user to another webpage using:
<link rel="alternate" media="handheld" href=”mobile_page.htm” />
Source: http://www.elc-seo.com/search-engines/google/mobile-search-the-google-wireless-transcoder/
I'm afraid I couldn't find out much about "DoCoMo P502i yet. It also seems to be related to some kind of Google Proxy. Look at the full UserAgent it uses:
DoCoMo/1.0/P502i/c10 (Google CHTML Proxy/1.0)
Source: http://user-agents.my-addr.com/custom_user_agent_lookup-ua_string_analysis_checker_tool.php?i=395&u=DoCoMo_1_0_P502i_c10_Google_CHTML_Proxy_1_0
I'm pretty sure the 2.0 beta versions of the Google Analytics SDK for iOS report an iPod touch as a DoCoMo P502i.
I've just set up a new Analytics profile & tested on two devices, and that's what's I'm seeing.
Yup. A sweet phone, the DoCoMo P502i.