Implemented camera feature using HTML5 input tag.
Requires atleast 5 to 6 clicks before opening camera. Tried on iOS 6 Safari browser and Goggle chrome browser on Android.
Refered below js files :
1. jquery-1.8.3.js
2. kendo.mobile.min.js
Do we need to include any js file
Code :
<div data-role="view" id="tabstrip-camera" data-title="camera" data-layout="mobile-tabstrip" id="Camera">
<!--Camera Code-->
<input data-click="alert('clciked');" type="file" name="image" accept="image/*" capture>
</div>
Even when tried with simple HTML5 button tag the response is slow and same observation is used.
Please can any one help ? Do we need to include any js file.
Is your intent to deploy an actual mobile app to a phone or tablet device, or just to use Kendo Mobile widgets in a desktop web browser?
If you are going to deploy to a device, then you should be building on top of PhoneGap / Cordova, and could use PhoneGap's image capture function:
http://docs.phonegap.com/en/1.2.0/phonegap_camera_camera.md.html
Try upgrading to the Kendo UI Q3 service pack that was released this week and see if this fixes it.
The original Kendo UI Q3 release had some issues with the touch/mouse events due to the major change we did in event handling in order to support systems with both mouse and touch (Chrome/FF on Windows 8).
Related
Problem
I'm currently working on a web application that needs to be able to upload images a lot. It is an <input type="file" name="picture" accept="image/*"> tag. Just like most other tablet or phone, I assumed that users on a Windows tablet— A Dell Venue 10 pro 5055, running on Windows 10 Enterprise in this case— would also be prompted to use the on-device camera or to choose from files. This is unfortunately not the case and makes the application a lot less user-friendly.
Tries
I checked this post: Can you launch the native Camera App from an Html 5 Web App?, the answer stated that using the following tag solved the problem for Android: <input type="file" accept="image/*;capture=camera">. This did not work for Windows.
The following post did provide an answer but that answer only works on Windows 8.1 unfortunately: Capturing images in web application on Windows 8.1 tablets
So is there a way to configure the tablet or to change the <input> tag in such a way that the user will be prompted to take a picture instead of choosing from an existing file?
Thank you in advance!
I'm stuck with something. We have made a project in school but we aren't passed so now we have to improve it. The project consists of controlling situations and events of a city. It is meant for smartphones but we don't know any mobile programming language yet so we can write it in html and javascript. We also can use JSON and AJAX to "talk" with our back-end. Example : there is a hole in the road, so i want to add this situation and i'm able to give details, it automatically gets the location by google maps.
So now to the point, there is a page called add.html, on this page i can add events or situations with all the details. We have everything but we are stuck with the image part. We need to be able to add an image to our database. Our website is responsive, i want to have an icon of a camera (so you can take a picture with your smartphone and add it, or you can choose from the pictures on your smartphone) that is a hyperlink to adding an image. So if you are on a pc or laptop it should open your browser where you can choose a picture from your hard drive, and elsewise like i said above. Does anyone has an idea how we need to approach this problem? Thanks a lot in advance!
Make your camera icon an input that looks like this:
<input type="file" accept="image/*" capture="camera">
This will launch the camera app in iphone iOS 6+ and android 3.0+.
There is a javascript API for navigator.getUserMedia(). This works in Chrome, Firefox and will work in IE 11. See
HTML5 Rocks: Tutorials: Capturing Audio & Video in HTML5 for details.
I have a task to create a client application which can show notifications to a user with a high probability of notifications being noticed.
The application should work on Android (2.0+)/iOS/WP.
Here is the use case:
The user starts the Application and performs some Action. Then he switches to the home screen/another application.
The response to the Action makes the Application to issue a notification. The notification is noticed by the user disregarding of what another application (or home screen) he uses on his mobile device at the moment.
There is no requirement for the application to be a native app or to be a web browser-based mobile app. The notification could be a sound or a vibration on the device, but I know that accessing the vibrations from within a browser is still tricky.
Here are my research results of making universal sound/vibro notification mechanism so far:
it seems that making a mobile device vibrate from a browser works only in mobile Firefox (no iOS, no WP);
the support of the audio html5 tag is still experimental, it doesn't work on each and every browser/device;
the sound alert from this example works only in mobile Firefox (asks for a plugin to play an mp3 sound), the Android browser just remains silent.
So, the question is:
Is there any way to force a user of a mobile device (Android 2.0+/iOS/WP) to view a notification from a mobile application? Is the only way to do this is to write a native app for each mobile platform?
I would propose PhoneGap for that particular problem.
Among other things it features cross-platform alert, sound and vibrator notifications.
Only quirk for Windows Phone 7 is that the Cordova lib includes a generic beep file that is used. You should consult the Notification reference page to make sure if it can help you.
I used the latest and greatest jQuery Mobile (RC1) to develop an app for the client. I used the latest Webworks version from RIM and packaged the app in a Cod file.
The app works great if accessed through the web browser ETC however when I installed the actual generated JAD/Cod files onto a blackberry device, performance was horrible even with minimum number of jQuery libraries.
Since I have Googled this everywhere and it is apparent that one cannot have a meaningful app experience if Webworks is used, I want to be able to just create something that just places the app icon on the phone. Once clicked, it open the browser and takes the user to the web server where the HTML files are parked.
Is this possible?
You can do that, with a very simple Java-application.
The following code:
Browser.getDefaultSession().displayPage("http://www.yourserver.com");
It will open browser and open page: http://www.yourserver.com
Browser class javadoc is here: http://www.blackberry.com/developers/docs/5.0.0api/net/rim/blackberry/api/browser/Browser.html
I've found that while holding on any anchor links of our MobileFirst iOS app (more than 2 or 3 seconds), iOS will trigger its build-in menu which shows internal path of current html page.
I don't know if this feature is related to PhoneGap, cordova, MobileFirst or HTML5 apps but can I disable it when users hold on anchors ?
An IBM MobileFirst app at the end of the day is made up of web code, so just like in Mobile Safari where after long-pressing you'd get a menu of some sort this is the case here as well.
There are many results on a google search how to disable the long-press context menu in iOS. See one such result here: Preventing default context menu on longpress / longclick in mobile Safari (iPad / iPhone)
Attempt to add this code (with proper modifications) in your app.
If it doesn't work for you, create an isolated demo app that this can be reproduced in and provide it for debugging.