November 13, 2018

Walkthrough: Serving gzipped JavaScript files from Amazon S3

Here's my walkthrough on serving gzipped JavaScript files from Amazon S3 from the PolyglotDeveloper blog:

Share |

October 10, 2018

Walkthrough: Creating a basic Chrome Extension

Here's my walkthrough on creating a Chrome Extension from the PolyglotDeveloper blog:

Share |

October 19, 2017

Copy Code button with feedback when code has been successfully copied.

Here is a Pen of a combination textarea/button that gives the user feedback when code has been copied. (Uses the d3.js library for the animation) The animation is unique each time.

Copy Code feedback button

Share |

June 30, 2017

The world's simplest AngularJS tab control

Here is a very simple tab control - created using AngularJS - with literally just one line of javascript code - a scope variable bound to the page.

I had originally scoured the web for a bootstrap or other tab control available, but after playing around with some HTML & Angular, I came up with this simple, functional control: 1 line of JS, 2 css selectors and 4 divs.

See the Pen World's simplest AngularJS tab control by Dan Shultz (@danshultz11) on CodePen.

Share |

October 31, 2015

Visual Studio TACO - Cordova WebView containing jQuery

If you're using Visual Studio Tools for Apache Cordova (TACO), you may notice a problem if you want to display an external webpage using the Cordova WebView, if the external page uses jQuery. Once you build and start debugging your app, as soon as you try to display the external page, an exception will be thrown in the jquery.js file used by the external page.

Before we look at what the problem is, here's a quick review of displaying external web pages in a Cordova app:

  • Whitelist the page/domain in config.xml in the Domain Access section under the Common tab

  • In JavaScript, call

The good news about this problem, is it's not really a problem - except when you're debugging. After failing every time I tried testing opening the new window, I swapped in the non-minified jquery file (in the external page) to take a look at where we were failing. It ends up in the jquery file itself, it does a try-catch that should throw an error for all non-gecko browsers, then swallows the error:

try { div, "[test!='']:sizzle" );
 rbuggyMatches.push( "!=", pseudos );
} catch ( e ) {}

...But it ends up that even though this error is swallowed, The Visual Studio TACO debugger stops the processing at the point where the error is thrown, and even if you continue processing, it usually won't display the page. Even though this code is executed on any page on the www containing jquery, when those pages are pulled into a Cordova WebView using Visual Studio TACO debugging, processing stops and the app appears to error out for no reason.

But if you run your app in Release Mode, you'll see that the page gets pulled into the Cordova WebView just fine, now that the debugger doesn't halt on the swallowed error. So the answer is that you can't debug past the point where you pull an external page into a Cordova WebView. You'll need to test that part in release mode, and if there are any problems, you can debug the page using Chrome Dev Tools on the site itself.

If this is unacceptable, another alternative would be to look into using the Cordova InAppBrowser plugin, which has no problem with external jQuery files, but the downside is that it does pop up a new browser window.

Share |