Brightflock blogs

Introducing Phonegap/Cordova iOS Social Plugin

Emily Newsom — Mon, 04 Mar 2013 16:08:58 +0000

We've been using Phonegap/Cordova for a number of cross platform apps lately and have found that we are really starting to take advantage of a lot of native plugins. One of the latest features we were looking to integrate was that of social sharing--namely, sharing items to one's Facebook, Twitter, Instagram etc account from the app.

On iOS, each social site (Twitter, Facebook, etc) tends to provide its own app and its own libraries in order to allow 3rd party integrations, but starting with iOS 6 Apple has followed Android's lead and integrated social functionality right into the OS itself. The benefit of the iOS social integration is that using the social features from an app is a breeze--you deal with a single api and iOS handles everything for you.

What about Phonegap/Cordova?

Now on Phonegap there is currently a ShareKit plugin. ShareKit is a social sharing toolkit that works on iOS 4.2+ (I believe) and supports a ton of sites that Apple would never integrate into iOS. ShareKit will also use the iOS social functionality if it detects iOS6. Sounds good right? Well if you've ever taken a look at ShareKit you will quickly realize it is quite the beast! For example, adding the ShareKit dependency to my last app instantly doubled its size.

So what's the alternative to ShareKit on Phonegap? Well if you're OK not supporting sharing pre-iOS6 and you want a lightweight solution, take a look at the new lightweight Social plugin that we just wrote and commited to Phonegap's github repo.

The Phonegap/Cordova iOS Social plugin

The iOS Social plugin is part of Phonegap:

PHPList Autoresponder Plugin

Emily Newsom — Sat, 09 Feb 2013 17:04:24 +0000

We've been running phplist ever since our MailChimp fees approached $100/month. By setting up phplist on our own servers and managing our lists ourselves, we save ourselves thousands a year. But phplist, which mostly does a good job, lacks a number of useful features--one of the largest missing features being an autoresponder.

Why doesn't a solution already exist?

If you take a look at the phplist forum (how most plugins/addons are distributed for phplist) you will see a few odd-ball hacked up autoresponder solutions. The major roadblock to a good autoresponder plugin is phplist's poor plugin architecture so a lot of people have tried to hack things together. We gave the most popular hack a try:

If this sounds good, give it a try by downloading below. We'd love to hear your feedback.

Version updates

Current version is v0.2.

v0.2 - fixed bug with user selection query

v0.1 - initial release

Where do I get the phplist autoresponder plugin?

The current version is v0.2 and was developed against phplist 2.10 stable (not 2.11). We have lightly tested the plugin ourselves with phplist 2.10.18 and are now using it with our 15k+ subscriber lists and would appreciate feedback/bug reports.

Get the phplist autoresponder plugin here: I'd like to donate

We have sponsored the initial development of this plugin and donations are gladly accepted and fund further development. Thank you!

Who do I contact for support requests?

Send an email to contact@brightflock.com or the phplist forum.

Phonegap 2.2 with armv6, armv7 built against iOS5 SDK

Emily Newsom — Mon, 05 Nov 2012 19:59:19 +0000

So, this entry is going to be all about getting around Apple's dropping of armv6 support in Xcode 4.5 (iOS6 SDK) and later and how to build Phonegap 2.2 (Cordova) apps that work in iOS4, iOS5 and iOS6.

First off, why should anyone care? Well, I bought a Macbook in 2010 and it came with a brand new iPod Touch with an armv6 processor. Today, anyone building new apps using the latest development tools from Apple cannot support my 2010 iPod touch. Yes, cannot. It is not possible to support my iPod Touch and Apple has done this intentionally. Apple has become upgrade obsessed and it seems that their support cycle for devices is now down to a staggering 2 years. Yes, that device you bought yesterday will be unsupported in 2 years. Ouch.

Ok, so let's say you're building an app using Phonegap and you'd still like to support armv6 like I do. What do you do? Well up until Phonegap 2.2 you could build your app using the iOS5 SDK and support armv6. Starting with Phonegap 2.2 they have dropped armv6 support and require iOS6. But Phonegap 2.2 has a bunch of fixes to their API that are pretty critical, including some mission-critical iOS6 bug fixes. Phonegap 2.2 is a must. So what do to? Well, there is actually still a way to use the latest Phonegap and support armv6.

Here's how to do it.

Install Xcode 4.5 and all related tools (command line tools) like you normally would for Phonegap. Skip this if you already have 4.5 installed. If you have less than 4.5.x, upgrade to the latest 4.5.x.
Now install Xcode 4.4 alongside 4.5. Don't install the command line tools as they will conflict with your 4.5 install. Yes, they can both be installed together without problems. Just make sure you are not trying to run them both at the same time as that seemed to cause a few problems for me. :)
Now you can fire up Xcode 4.5 and test on the iOS6 simulators and devices. Fire up Xcode 4.4 and test on iOS4 & 5 simulators and devices.
Fire up Xcode 4.4 as we will be building our final app against the iOS5 SDK.
Modify your Phonegap project's build settings. Set Architectures to armv6, armv7 and Valid Architectures to armv6, armv7 like you normally would in earlier Xcode releases. Set iOS Deployment Target to 4.2 as this will be the minimum iOS version we support (the last version available for armv6).
Open the CordovaLib project and modify its build settings as well. By default CordovaLib will only build for armv7, armv7s now. There are a few more targets under Architectures for CordovaLib--change them to armv6, armv7 as well. Also change Valid Architectures again as well. Likewise, change iOS Deployment Target to 4.2.

Open up CDVViewController.m and remove the reference to the iPhone5 splash screen. Apple will reject your binary if you include this splash screen and build against IOS5.

- (void)showSplashScreen
{
    CGRect screenBounds = [[UIScreen mainScreen] bounds];
    NSString* launchImageFile = [[NSBundle mainBundle] objectForInfoDictionaryKey:@"UILaunchImageFile"];
 
    if (launchImageFile == nil) { // fallback if no launch image was specified
        // XXX-CL commented this out because we're building against IOS5 and itunes doesn't like to see this splash in the release
        /*if (CDV_IsIPhone5()) {
            // iPhone 5 or iPod Touch 6th-gen
            launchImageFile = @"Default-568h";
        } else {*/
            launchImageFile = @"Default";
        //}
    }
    ...

Likewise, remove Default-568h@2x~iphone.png from your Phonegap project in Xcode.
Now we're ready to build our App. You're still in Xcode 4.4 right? Ok, so build your app as you normally would in Xcode 4.4. Test against the simulators and any older devices you have including your armv6 devices.

Now copy your app that is installed on the Xcode 4.4 simulators into the Xcode 4.5 iOS6 simulator. Here's how I did that (the directory ID will be different for your app):

cam@unity [~]$ cp -R ~/Library/Application\ Support/iPhone\ Simulator/5.1/Applications/FE30BDBE-E102-4CFB-B29F-E8A7BEDEFD5E ~/Library/Application\ Support/iPhone\ Simulator/6.0/Applications
cam@unity [~]$ ls -l ~/Library/Application\ Support/iPhone\ Simulator/6.0/Applications/FE30BDBE-E102-4CFB-B29F-E8A7BEDEFD5E/
total 0
drwxr-xr-x 11 cam staff 374 Nov  5 16:11 Documents
drwxr-xr-x  4 cam staff 136 Nov  5 16:11 Library
drwxr-xr-x 24 cam staff 816 Nov  5 16:11 Some App.app
drwxr-xr-x  2 cam staff  68 Nov  5 16:11 tmp
cam@unity [~]$

Now shut down Xcode 4.4 and fire up Xcode 4.5. Go to the menubar Xcode -> Open Developer Tools -> iOS Simulator. The iOS6 simulator will start and your app will be pre-installed. Run your app. Your app is built against the iOS5 SDK and the simulator is testing that it is working fine on a device running iOS6--this is important as earlier Phonegap releases had several major bugs with this setup.
Return to Xcode 4.4 and build an archive of your app and release to Apple.

Using this technique I was able to build a Phonegap 2.2 app against iOS5 that targetted armv6 and armv7. Yes, you will not get any of the new iOS6 SDK features but chances are that if you're using Phonegap you're not really too concerned about those right now anyway--it's better to support a wider range of devices.

JMSSecurityExtraBundle 1.3 introduces @SecurityFunction

Emily Newsom — Thu, 01 Nov 2012 12:59:20 +0000

We're currently investing development resources into an upcoming open-source , both of which come with the default vendor release of Symfony2. JMSDiExtraBunde gives you the ability to put nice annotations right beside your service and controller code--information that would otherwise be stored off in yet another yaml file (not that I hate yaml! ;). JMSSecurityExtraBundle builds on JMSDiExtraBundle and gives you security related annotations as well as a cool expression language.

For example, one can do things like this:

class InstallerController extends ContainerAware {
   ...
    /**
     * @PreAuthorize("hasRole('FOO') or hasRole('BAR')")
     */
    public function checkAction() {
        ...
    }
}

Which will check that the current user has role FOO or BAR. There are many other expressions one can use and they're all listed on Johannes' site.

But what really caught my eye was the new feature that he made available in his new 1.3 version--@SecurityFunction. There's a small note on the bottom of his annotation reference page about the new annotation and a small example, but it was still a little unclear exactly how one uses @SecurityFunction. Basically @SecurityFunction gives you the ability write your own functions that can be used in any expression. So in our above example, hasRole() is a security function. If we defined our own security function fooBar() then we could use fooBar() just like we used hasRole() in the above example.

So where do you define your @SecurityFunction? Well, to me it seems to make the most sense to place these in a related service. In my case, I have a service Installer where I placed a security function isInstalled()

/**
 * @Service("acme.demo.installer")
 */
class Installer {
    ... 
    /**
     * @SecurityFunction("isInstalled")
     */
    public function isInstalled() {
        // We injected $this->installed earlier on
        return $this->installed;
    }
}

Now I can go into any of my controller actions and do this:

class InstallerController extends ContainerAware {
   ...
    /**
     * @PreAuthorize("!isInstalled()")
     */
    public function installAction() {
        ...
    }
}

Which makes for a nice way to secure your actions with your own security checks before control even reaches your controller action code.

Note that @SecurityFunction is available in 1.3 and beyond (currently a dev release).

GeSHI Filter Dark Theme

Emily Newsom — Thu, 01 Nov 2012 11:50:40 +0000

Are you one of those people like me that can only use dark themed IDEs these days? Ever since I switched to Aptana (with its default dark layout) from Eclipse for most of my dev work, I can no longer look at light-colored code windows.

So how does one get GeSHI filter to go along with the dark trend? Well, here's some css that I use to do just that:

/* Geshi */
.geshifilter {
        color: #ddd !important;
        background-color: #222 !important;
        border: none !important;
        padding: 1em !important;
        margin: 0.8em 0 !important;
        font-size: 1.2em;
}
 
/* Line highlights */
.geshifilter .li1 { background: #202021 !important; }

/* comments */
.geshifilter .co1,
.geshifilter .coMULTI { color: #7a7a75 !important; font-style: italic; }
/* methods */
.geshifilter .me1 { color: #ffffff !important; }
.geshifilter .me0 { }
.geshifilter .me2 { color: #ffcc66 !important; }

/* brackets */
.geshifilter .br0 { color:#fff !important; }

/* strings */
.geshifilter .st0 { color: #99ff00 !important; }

/* keywords */
.geshifilter .kw1 { color: #ff8400 !important; }
.geshifilter .kw2 { color: #ffcc66 !important; }

.geshifilter .kw3 { color: #07dffc !important; }

/* numbers */
.geshifilter .nu0 { color: #66cc66 !important; }

/* vars */
.geshifilter .re0 { color: #ffffff !important; }

/* CSS selectors */
 
/* classnames */
.geshifilter [lang=css] .kw2,
.geshifilter .css .kw2 { color: #f9ee7e !important; }
.geshifilter .re1 { color: #96703d !important; }

/* px values */
.geshifilter [lang=css] .re3,
.geshifilter .css .re3 { color: #ca7840 !important; }

/* Javascript */
.geshifilter [lang=javascript] .me1,
.geshifilter .javascript .me1 { color: #505e80 !important; }

.geshifilter .text .de1, .geshifilter .text .de2 { font-family: monospace, Courier; }

Looks a little boring for CSS but it works great for most other syntaxes like PHP. Just pop these into your theme's style.css and enjoy GeSHI darkness :)

These were originally inspired by this for Drupal by Brightflock.

Relocating Wordpress: Why we created Complete Update URLs

Emily Newsom — Tue, 30 Oct 2012 18:51:35 +0000

Relocating WordPress from one URL to another URL is a common task for us. When building a new site or making changes to an existing site we will often create a sandbox environment to develop and test our changes before full deployment. Moving from development to deployment requires that the URLs in the WordPress database be changed. At first glance, the WordPress documentation (Also check the FAQs for information on how to use the plugin:

One of the big changes in Drupal 7 was to create another abstraction layer above nodes, users, etc. This abstraction layer allows one to access all of the various components as "entities". In Drupal 6, I always felt the push to make everything be a node, so this abstraction layer solves that problem--just treat everything as an entity and don't force the node issue.

So how do you query for entities? Like a lot of ORMs, Drupal now has its own query language--one can use EntityFieldQuery to query for any entity. Now if anyone has worked with EntityFieldQuery, it can be a bit (!) verbose. The problem I ran into is that 90% of the time I am looking for nodes only, so why do I need to deal with entities? Well, I threw together a subclass of EntityFieldQuery that only queries for nodes. Seems like a pretty obvious class to have in the core to speed up node queries, but I couldn't find anything of the sort so I wrote my own. Lets hope we get something like this in D8 before node_load_multiple's conditions get removed.

/*
 * NodeFieldQuery - An EntityFieldQuery object just for loading nodes because that's what we want 90% of the time.
 */
class NodeFieldQuery extends EntityFieldQuery {
 
    public function __contruct($type = null) {
        parent::__construct();
 
        $this->entityCondition('entity_type', 'node');
 
        if ($type) {
            $this->entityCondition('bundle', $type);
        }
    }
 
    public function load() {
        $result = $this->execute();
 
        if (!isset($result['node'])) {
            return array();
        }
 
          $nids = array_keys($result['node']);
          $nodes = entity_load('node', $nids);
 
        return $nodes;
    }
}
 
/* Usage */
$q = new NodeFieldQuery('project');
$q->fieldCondition('field_project_company', 'nid', $company->nid, '=');
$projects = $q->load();

Optimizing a 7000 uniques/day Drupal 6 site

Emily Newsom — Wed, 04 Jan 2012 22:25:46 +0000

We recently took on the task of optimizing a high traffic Drupal 6 site that sees more than 7000 unique visitors per day.

Now, Drupal isn't often praised for it's performance, but there are such a wealth of modules available that can really make it into a very slick system. I'm not going to focus on everything needed for Drupal optimization, but I will discuss, on a high level, how we were able to achieve the largest performance gains.

The site in question had the default Drupal 6 performance settings all enabled and setup correctly. The database, MySQL, was being hammered and could not keep up with the request volumes. Almost all of the traffic was from anonymous users.

The first step was to install

Once Boost was installed, we saw a large load reduction, however, the database, MySQL, was still unable to keep up with many of the dynamic search requests that couldn't be static cached. This particular site's schema was built to hold all of its data in

These two steps essentially eliminated the load that we were seeing at the start of this process: Boost + Denormalized CCK search table. The server for this site is now more idle than not and it continues to serve the same volume than it did before, with no change to the user or admin experience--the kind of performance solution I like!

On the fly E-Junkie tax UI changes with JQuery

Emily Newsom — Tue, 08 Nov 2011 01:01:05 +0000

Don't get me wrong, E-Junkie works great when tax is not collected on a sale. However, introducing tax into the equation changes the way the cart system behaves.

The UI E-Junkie uses to get location/zip codes from buyers for tax is really clunky--the buyer has to manually select his or her country and enter his or her postal code before being able to pay no matter where the buyer is from. Well, the problem is that most sellers only really care whether a buyer is from their own country or not for tax purposes--why should a seller charging tax in the US care about the buyer's location information if the buyer is from Australia? They shouldn't. So why does E-Junkie force all buyers to select a country and zip for tax purposes? Who knows! What I do know is that I can change the tax UI around on the fly using some JQuery.

Here is the JQuery code I quickly whipped up for a client who collects tax in Canada only from buyers in Canada. It is written using polling, but something like live query may work better.

With this code the UI defaults to the US so non-Canadians can just click "buy" and not even read the section about tax. Canadians can declare they are from Canada by clicking a checkbox which exposes a Postal Code field--much cleaner and much less intrusive to buyers from outside Canada.

(function($) {
	var ZIP_LABEL = 'Postal Code';
	var DECLARE_TEXT = 'Check here if you are Canadian, as tax will apply. We’ll need your postal code to calculate what tax applies in your region.';
	var DEFAULT_COUNTRY = 'US';
	var DEFAULT_ZIP = '90210';
	var TAX_COUNTRY = 'CA';
	var POLL_TIME = 300;
	var POLL_TIMEOUT = 60000;
 
	$(document).ready(function() {
		$('a').click(function() {
			var $ej = $('body > #EJEJC_window');
			var wait = 0;
			var firstTime = true;
 
			var f = function() {
				var $form = $('#EJEJC_iframeContent form:first', $ej)
 
				if ($form.length) {
 
					var $table = $('table#ejejctable', $form);
 
					var $updateCartButton = $('input#btnUpdtCart', $table).click(function() {
						$form.hide();
						wait = 0;
						setTimeout(f, POLL_TIME)
					});
 
					var $country = $('select', $ej);
					var $zip = $('input', $ej);
					var $countrytr = $country.parents('tr:first');
					var $ziptr = $zip.parents('tr:first');
 
					$('div', $ziptr.children('td:first')).html(ZIP_LABEL);
 
					$countrytr.parent().prepend('<tr><td colspan=5><input type="checkbox" name="declare" style="width: 40px;"/> ' +	DECLARE_TEXT + '</td></tr>');
 
					var $declare = $('input', $countrytr.parent());
 
					var declareUpdate = function() {
						if ($declare.filter(':checked').length == 1) {
							$country.val(TAX_COUNTRY);
 
							if ($zip.val() == DEFAULT_ZIP) {
								$zip.val('');
							}
						}
						else {
							$country.val(DEFAULT_COUNTRY);
							$zip.val(DEFAULT_ZIP);
						}
					};
 
					$declare.change(function() {
						declareUpdate();
						$updateCartButton.click();
					});
 
					$countrytr.hide();
 
					if ($country.val() == TAX_COUNTRY) {
						$declare.attr('checked', 'checked');
						$ziptr.show();
					}
					else {
						$declare.removeAttr('checked');
						$ziptr.hide();
					}
 
					declareUpdate();
 
					if ($updateCartButton.length && firstTime) {
						firstTime = false;
 
						$declare.trigger('change');
					}
					else {
 
						$form.show();
					}
				}
				else {
					if (wait < POLL_TIMEOUT) {
						wait += POLL_TIME;
						setTimeout(f, POLL_TIME);
					}
					else {
						$form.show()
					}
				}
			};
 
			setTimeout(function() {
				f($ej);
			}, POLL_TIME);
		});
	});
})(jQuery);

WYSIWYG + CKEditor + GeSHI Filter syntax highlighting

Emily Newsom — Sat, 29 Oct 2011 17:26:44 +0000

One of our goals for our new Drupal 7 site launch was to have a better blog section where we could discuss a few of the solutions we come up with to the everyday problems we encounter. For me, that means I need a good way to display formatted code to readers. Enter the

The last step was to get <pre> working with GeSHI Filter. Simply go to your GeSHI Filter options and add "pre" to the list of "generic syntax highlighting tags". You can select a default language if you aren't using <pre> for anything other than code formatting, or when you enter your code, you can quickly disable rich-text and add "language='php'" (css, c, etc) to your pre tag.