Getting Ionic framework up and running on Ubuntu 14.04

Ionic is a framework for hybrid or progressive mobile app development. Throw in electron and you can get a desktop app too!

Note that this will only deal with android app development, there are likely many more steps involved with iOS.

We need the following software setup –

  • NodeJS – ionic is build using node.
  • Android SDK – to build the android application.
  • Cordova – provides access to phone APIs regardless of platform.
  • Ionic – the framework
  • Bower – manage javascript libraries within the Ionic application
  • Gulp – build scripts for your angular app.

Installing NodeJS

There are multiple ways to install node, we are going to use nvm as it is the most powerful and flexible. It takes a little longer to set up though. Follow the previous link for the long version, here’s the short of it:

sudo apt-get update
sudo apt-get install build-essential libssl-dev
curl https://raw.githubusercontent.com/creationix/nvm/v0.16.1/install.sh | sh
mkdir ~/.nvm/versions
source ~/.profile
nvm ls-remote
nvm install 0.11.13
nvm use 0.11.13
node -v

Each version of node you install has its own libraries. Some extra nvm commands:

nvm ls
nvm alias default 0.11.13
nvm use default
0    0  * * Sun root     certbot -q renew

Installing the Android SDK

You can install Android studio, but here we will just install the SDK. Firstly get the SDK downloading by going to https://developer.android.com/sdk/index.html#Other and clicking the Linux link – something like android-sdk_r24.3.3-linux.tgz. It’s a pretty big download.

While that’s happening let’s get the latest version of Java provided by Oracle.

sudo apt-get install python-software-properties
sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-cache search oracle-java
sudo apt-get install oracle-java7-installer

Now back to the Android SDK – I like to install it to /opt so:

sudo tar zxfv android-sdk_r24.3.3-linux.tgz -C /opt
sudo chown sam:sam /opt/android-sdk-linux -R
/opt/android-sdk-linux/tools/android

The Android SDK Manager will open, and a bunch of libs will be selected but not installed. Install them.

Once that is done you will want to create an Android Virtual Device (AVD) which is used as an emulator. In the SDK manager go Tools -> Manage AVDS , then Create. I created a Nexus 5 named nexus-5 using Google APIs – API Level 22 as the target, Google APIs ARM as a CPU/ABI and HVGA as a skin.

Now export the tool paths in .bashrc:

echo "export PATH=\${PATH}:/opt/android-sdk-linux/platform-tools:/opt/android-sdk-linux/tools" | tee -a ~/.bashrc
source ~/.bashrc

You should be able to run adb from anywhere now.

Installing Ionic, Bower, Gulp & Cordova

To install the following we use npm, the NodeJS package manager.

Bower helps organise javascript libraries used by our application and Gulp helps build the application.

npm install -g ionic bower gulp gulp-util cordova

Getting started with Ionic

Head over to http://ionicframework.com/getting-started and follow along:

ionic start myApp tabs 
cd myApp
npm install
bower install
ionic platform add android 
ionic build android 
ionic emulate android 
ionic serve 
ionic run android

Dynamic DNS with dnsexit.com

So I got this setup and added some CNAME dns entries pointing to my dnsexit supplied domain name. But I’m having issues setting up some code to update the DDNS entry.

ez-ipupdate is a seemingly ancient piece of software that still compiles well but it only wants to use the IP found in ifconfig, and thats not going to work because I’m behind NAT. There is a way to pass it an address using something like:

dig +short myip.opendns.com @resolver1.opendns.com

but that doesn’t work in daemon mode. Meh.

DNSexit recommends a few other options here, and the windows one works fine but since I dual boot there’s no guarantee it will be up.

I finally got DNSexit’s ipupdate package to work using the .deb package. After completing the install wizard I had to run dos2unix on the init.d script and /etc/dnsexit.conf, then restart my router to make it run correctly.

XBox wireless receiver in windows 7

This is a pain to get going. For future reference:

Got to Device Manager

Right click on the Unidentified Device

Go to Properties

Go to the Drive tab

Click on Update Driver…

Browse my computer for driver software

Let me pick from a list of device drivers on my computer

Windows Common Controller for Window Class

Xbox 360 Wireless Receiver for Windows Version: 2.1.0.1349

Update Driver Warning

Click Yes

Permanently mounting an external USB hard drive on a Raspberry Pi

Find the external drive using fstab

pi@raspberrypi:/mnt$ sudo fdisk -l

Disk /dev/mmcblk0: 7964 MB, 7964983296 bytes
4 heads, 16 sectors/track, 243072 cylinders, total 15556608 sectors
Units = sectors of 1 * 512 = 512 bytes
Sector size (logical/physical): 512 bytes / 512 bytes
I/O size (minimum/optimal): 512 bytes / 512 bytes
Disk identifier: 0x000827fa

Device Boot Start End Blocks Id System
/dev/mmcblk0p1 2048 1671875 834914 e W95 FAT16 (LBA)
/dev/mmcblk0p2 1679360 15491071 6905856 85 Linux extended
/dev/mmcblk0p3 15491072 15556607 32768 83 Linux
/dev/mmcblk0p5 1687552 1810431 61440 c W95 FAT32 (LBA)
/dev/mmcblk0p6 1818624 15491071 6836224 83 Linux

Disk /dev/sda: 3000.6 GB, 3000592982016 bytes
255 heads, 63 sectors/track, 364801 cylinders, total 5860533168 sectors
Units = sectors of 1 * 512 = 512 bytes
Sector size (logical/physical): 512 bytes / 512 bytes
I/O size (minimum/optimal): 512 bytes / 512 bytes
Disk identifier: 0x000af53a

Device Boot Start End Blocks Id System
/dev/sda1 2048 2930266111 1465132032 83 Linux
/dev/sda2 2930266112 1565565871 1465133528 83 Linux

 

You want to mount it using its UUID instead of its /dev address because USB drives get mounted at different addresses on each boot while the UUID will be the same.

sudo blkid

/dev/mmcblk0p1: LABEL="RECOVERY" UUID="3394-996E" TYPE="vfat"
/dev/mmcblk0p3: LABEL="SETTINGS" UUID="7cc3c451-5b28-4fea-8eec-f7c2725966fb" TYPE="ext4"
/dev/mmcblk0p5: LABEL="boot0" UUID="019E-DE96" TYPE="vfat"
/dev/mmcblk0p6: LABEL="root" UUID="cc9b7456-235e-4718-8e53-faa76242e5f3" TYPE="ext4"
/dev/sda1: UUID="cda18eda-8de5-43a1-a629-6737f5752f15" SEC_TYPE="ext2" TYPE="ext3"

Add the drive to the file system table:

sudo vi /etc/fstab

UUID=cda18eda-8de5-43a1-a629-6737f5752f15 /mnt/hdd1 ext3 defaults,errors=remount-ro 0 1

Reboot and the drive should be mounted!

Adding a new image style to Media WYSIWYG while using Display Suite

This is getting a bit convoluted, but I guess thats the price of power.

  1.  Create the image style.
  2. Create a corresponding view mode and allow it to be used with files
  3. Enable the view mode for the image field type.
  4. Go to the image file display and select the view mode from the tabs
  5. Check colorbox in enabled displays then choose the new image style in ‘Content Image Style’.

Now the view mode will be available for selection when you insert an image.