Childbrowser Plugin
I thought that was a really good guide for getting started on Phonegap’s Childbrowser plugin.
I’m using it to open PDFs from phonegap.
My First Stack Overflow Answer
I use Stack Overflow a ton, and I’m going to try to make more of an effort to contribute.
I was having trouble scrolling horizontally with the iscroll plugin, and I solved it by enabling the hScroll option (which I thought should have been enabled by default). I use iscroll’s zoom function to enable zooming on a single div, while the rest of the page does not zoom.
SigPad API
I had difficulties getting Thomas J Bradley’s HTML5 Signature Pad to let me to use its API without resetting the field. This Github issue explains a workaround:
He is saving the signature, declaring the api variable, then regenerating the signature.
I needed to use the .getSignatureImage() api function which allows me to turn the signature into a base64 string so I could store the signature in a database.
PHP Inline HTML
https://www.php.net/manual/en/language.basic-syntax.phpmode.php
The page linked above describes the process of adding inline HTML to PHP code instead of echo '<html>';. It seems like it’s much faster to not process each echo statement with PHP.
This is definitely a big “oh!” moment for someone still learning PHP.
Jquery Mobile - Only Load Once
If you only want something to load once, you can use the “pageinit” event.
Here’s an example of some code with “pageinit”:
$(document).delegate("#yourPage", "pageinit", function(event) { alert( "ALERT!"); });
The code above would not run if you visited the page again.
Make Phonegap Responsive
The following was absolutely mandatory for me to get my phonegap app to be responsive: https://github.com/cargomedia/jquery.touchToClick
Without modification, Phonegap will wait for a “double-click” after the user taps. This results in a noticeable delay. With the plugin above included, it removes the delay.
Other plugins I tested wanted me to use selectors for each element I didn’t want delayed.
Prevent Scrolling
hankchizljaw.co.uk: prevent window bounce in PhoneGap
The above link is the most simple solution I’ve found to prevent phone gap from scrolling outside of the bounds.
Magnifying Glass For Images Plugin
Here’s a cool magnifying glass plugin for images that uses jQuery. The original site is gone now, but the archived demo still works.
Sisyphus.js
I’m really impressed with sisyphus.js and its usage of HTML5 localStorage. It makes it so users won’t need to re-enter data into a form when they close the window.
It’s super easy to implement, you only need to include the following in your header:
<script type="text/javascript" src="sisyphus.min.js"></script>
And, you will need to activate it on the form you want to save with something like this:
$('form').sisyphus();
Write To Closest Div (with certain class)
The following code makes it so I don’t have to mention specifically what page needs to load before a script runs. This is good for having the same function on several different pages in Jquery Mobile.
var pageId = $(this).closest('div.diagramPage').attr('id');
$(document).delegate(pageId, 'pageshow', function() { }
I included the class because I don’t want to end up moving code around and having it write to a different div.