Virtual Hosts

I’ll never be a server administrator but sometimes I have to get my hands dirty.

When developing a website, there’s always a tricky, slightly nerve wracking, moment when you point an existing domain at the new server and hope that everything resolves correctly. Here are a few simple steps to help you set up and test virtual hosts on Apache when building a website.

How to set up and test a virtual host.

Virtual Host files are small config files which live on your apache server which tell apache which directory to return to the visitor’s web browser. You can have many virtual hosts on a server, all returning different content based on the domain name the user types into their browser.

1) This is where you can find the default virtual host:
/etc/apache2/sites-available/000-default.conf

2) Make a copy of this file to add a domain name
sudo cp /etc/apache2/sites-available/000-default.conf /etc/apache2/sites-available/example.com.conf

3) Open the file with nano:
sudo nano /etc/apache2/sites-available/example.com.conf

4) Edit the files and save it.

ServerAdmin admin@example.com
ServerName example.com
ServerAlias www.example.com
DocumentRoot /var/www/example.com/public_html
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined

5) Enable the new virtual host file:
sudo a2ensite example.com.conf

6) Restart Apache so the changes kick in:
sudo service apache2 restart

7) Open your local host file:
On your LOCAL machine (NOT your server):
sudo nano /etc/hosts

8) Add an entry for your domain name to test how the server will react upon receiving a request from a particular domain name.
Effectively, copying the way a domain name servers (DNS) works.
Add your servers IP address followed your domain name:
xxx.xxx.xxxx.xxx example.com
xxx.xxx.xxxx.xxx www.example.com

9) Save it!

10) Now you can test how your domain resolves on your server. You might have to restart your browser / clear your cache. Remember to delete this record when you’re ready to point you domain name. So you know when the DNS has updated and the domain name become available to everyone.

Plexus

I’ve been playing around with Plexus recently and was bowled over at how quickly you can get up and running with some very cool effects.
I was confused the first time I looked at it; coming back after a break it seems to make perfect sense.
Here’s a quick render.

After Effects Boomerang Effect

A quick tip for those of you who’ve been struggling with unwanted motion between two identicle keyframes in After Effects. If you’re experiencing anything similiar to the attached animation then read on. You arent going mad, it’s a little quirk in After Effects which is simple to fix.

There are a number of ways in which After Effects calculates the distance between to keyframes. The example attached makes use of bezier tweens, which are lovely for easing in and out of keyframes. There is, however, a downside. Bezier tweens don’t like freeze frames. The solution is to convert the animation to linear enterpolation, and then deal with the finer points of the animation on a more granular level.

Wacom Intuos Pro Tablet Touch Not Working

Having enjoyed using Wacom products for many years, I have had a number of issues with the touch settings / functionality of the later Intuos models. Recently my touch settings stopped working entirely. I restarted my machine and the Wacom drivers, all to no avail. This morning I got to the bottom of the issue.

System Preferrences > Security & Privacy > Accessibility > Click Lock to Makes Changes

Scroll to the bottom of the a list of apps and make sure that WacomTouchDriver.app is checked. If it isn’t checked then check it. This will give Wacom the system level access it requires to use touch. If WacomTouchDriver.app is already checked, then uncheck the app and check it again. This worked in my case, the toggling of the radio button appears to re-boot the privacy settings.

DNS Switching

I had a head scratcher earlier tonight. My wife was able to see the website I’d just launched for her, but I wasn’t. There we were, sat on the same sofa using the same wi-fi with the same URL in our web browsers and yet, we were seeing different websites. How come?

I’m not a server administrator so it took a few minutes to realise that it was to do with which DNS servers we were using. When a new website is launched it can take a couple of days for the new IP address to propegate through all the DNS servers around the world. Because the update happened so recently we realised that we were using different DNS servers, one of which had updated and the other which hadn’t.

The solution was surprisingly simple.

Apple > System Preferences > Network > Advanced > DNS

On the left hand side of the screen you’ll see some IP addresses. The IP address at the top is the one that you’re currently using to surf the web. Simply drag another IP from further down the list to the top. Press OK > Apply and refresh your browser to see if things change.

They did for me.

Old SWF versions vs old Flash Players

A SWF Version isn’t the same as a Flash Player Version.
The distinction is important when targetting older Flash Players, especially those installed on very old Out of Home Screens.

Here’s a cheat sheet:


     SWF   |        Flash           |  AIR 
------------+-------------------+---------------
        9       |        9.0.115.0    |      N/A
       10      |        10.0, 10.1   |      1.5, 2.0
       11      |        10.2            |      2.6
       12      |        10.3            |      2.7
       13      |        11.0            |      3
       14      |        11.1            |      3.1
       15      |        11.2            |      3.2
       16      |        11.3            |      3.3
       17      |        11.4            |      3.4
       18      |        11.5            |      3.5
       19      |        11.6            |      3.6
       20      |        11.7            |      3.7
       21      |        11.8            |      3.8
       22      |        11.9            |      3.9
       23      |        12              |      4
       24      |        13              |      13
       25      |        14              |      14
       26      |        15              |      15
       27      |        16              |      16
       28      |        17              |      17
       29      |        18              |      18
       30      |        19              |      19
       31      |        20              |      20
       32      |        21              |      21
       33      |        22              |      22
       34      |        23              |      23
       35      |        24              |      24
       36      |        25              |      25
       37      |        26              |      26
       38      |        27              |      27
       39      |        28              |      28
       40      |        29              |      29
       41      |        30              |      30
       42      |        31              |      31

Seeing through transparent video

It’s been eleven years since Steve Jobs revolutionised our back-pockets with the iPhone and dealt Flash what many thought would be a mortal blow. So why is it Flash refuses to die? The recent update of the same in-all-but-name Adobe Animate was incredible.

In banishing the humble SWF to the wilderness Steve broke something more fundamental, progress. With all the faults of the Flash player, the Flash communitiy tried new things, and challenged conventions. The conservative development community chose standards over tearing up the rule-book and in doing so may have stifled creative expression. The days of jaw dropping websites have gone.

I recently did a project for Coca-Cola, which required a dynamic flip clock to count-down to Christmas, but it involved an intricate transition involving Christmas wrapping paper tearing across the screen to reveal the dynamic element underneath. To complicate this still further, the whole scene was full of falling snow. As is often the case with Out of Home, so much of what we do is constrained by very archaic bandwidth considerations. So the only way to easily accomplish this kind of execution was to resurrect the trusty transparent FLV and create a multi-layered application using transparent video. I had to download an old version of Adobe Media Encoder CS6 because that was the last app in which Adobe included support for FLV. In the end, the project went off without a hitch although I’m still not sure how I might have accomplished this so easily in HTML.WebM didn’t seem to layer properly and .mov was just too big. So as Flash winds down, we’re left with a hole, but sadly not in our video.

If anyone out there has any tips on how I might layer-up transparent video, over a dynamic clock element in HTML5 I’d like to hear your thoughts.


Exporting to Flash Player 10.2 from Flash Pro CC2014

As Flash has evolved over the years Adobe has continually jettisoned legacy technology. ActionScript 1 and 2, the bandwidth profiler, even projectors fell by the wayside (in CC at least). Sometimes these features re-surface in new releases, like the motion editor for example, but it seems that once the ability to target a specific Flash Player version is dropped, it remains dropped. In Flash Pro CC2014 the oldest targetable Flash Player is version 10.3.
Sadly, this has been causing me some headaches. There are still some advertising platforms out there which specifically reject anything more recent than Flash Player 10.2. This is a problem because the last time Flash supported this player was way back in Flash Professional CS5.5.

Finally, I decided enough was enough and resolved to solve this problem once and for all. Here’s how I did in.

Firstly download the playerglobal10_2.swc from Adobe’s archive
http://helpx.adobe.com/flash-player/kb/archived-flash-player-versions.html#playerglobal

Rename it playerglobal.swc

Go to “Applications/Adobe Flash CC 2014.app”

Right-click the Adobe Flash CC 2014 application and select “Show package contents.”

Go to this folder:

/Applications/Adobe Flash CC 2014/Adobe Flash CC 2014.app/Contents/Common/Configuration/Players/ActionScript 3.0

Duplicate the directory FP10.3 and rename it FP10.2

Replace playerglobal.swc with the version you just downloaded. Remember to change the name from playerglobal10_2.swc to playerglobal.swc

Next you duplicate /Applications/Adobe Flash CC 2014/Adobe Flash CC 2014.app/Contents/Common/Configuration/Players/FlashPlayer10_3.xml and rename it FlashPlayer10_2.xml

Open FlashPlayer10_2.xml in a text editor delete everything and replace with the following:

<?xml version="1.0" encoding="UTF-8"?>
<players>
  <player id="FlashPlayer10.2" version="11" asversion="3">
   <name>Flash Player 10.2</name>
        <path builtin="true" />
        <path platform="WIN">Device Central/adcdl.exe</path>
        <path platform="MAC">Device Central/adcdl</path>
        <playerDefinitionPath as2="$(UserConfig)/Classes/FP10;$(UserConfig)/Classes/FP9;$(UserConfig)/Classes/FP8;$(UserConfig)/Classes/FP7" as3="$(AppConfig)/ActionScript 3.0/FP10.2/playerglobal.swc" />
        <feature name="multiScreenPublish" supported="true" />
        <feature name="mobileAuthoringIntegration" supported="true" />
        <feature name="deviceSound" supported="false" />
        <feature name="exportStreamingSound" supported="true" />
        <feature name="exportEventSound" supported="true" />
        <feature name="FSCommand2" supported="false" />
        <feature name="gradient_linearRGB" supported="true" />
        <feature name="gradient_overflow" supported="true" />
        <feature name="shape_strokeHint" supported="true" />
        <feature name="shape_cap" supported="true" />
        <feature name="shape_join" supported="true" />
        <feature name="shape_mitre" supported="true" />
        <feature name="shape_scale" supported="true" />
        <feature name="linkage_exportForActionscript" supported="true" />
        <feature name="linkage_exportForRuntimeSharing" supported="true" />
        <feature name="linkage_exportInFirstFrame" supported="true" />
        <feature name="linkage_importForRuntimeSharing" supported="true" />
        <feature name="linkage_importAndAddToCache" supported="false" />
        <feature name="publish_localPlaybackSecurity" supported="true" />
        <feature name="publish_hardwareAcceleration" supported="true" />
        <feature name="symbol_blendMode" supported="true" />
        <feature name="actionScript_documentClass" supported="true" />
        <feature name="symbol_blendMode" supported="true" />
        <feature name="filters" supported="true" />
        <feature name="component_binding" supported="true" />
        <feature name="component_schema" supported="true" />
        <feature name="screens" supported="true" />
        <feature name="video" supported="true" />
        <feature name="deviceVideo" supported="false" />
        <feature name="accessibility" supported="true" />
        <feature name="dynamic_text_kerning" supported="true" />
        <feature name="static_text_charwidth_nondeviceFont" supported="true" />
        <feature name="static_text_charwidth_deviceFont" supported="true" />
        <feature name="advanced_anti_alias_text" supported="true" />
        <feature name="nine_slice_scaling" supported="true" />
        <feature name="runtimeNumberMinMax" supported="true" />
        <feature name="use8kSampleRate" supported="true" />
        <feature name="useDefineFont4ForDeviceText" supported="true" />
        <feature name="useDefineFont4ForEmbeddedFonts" supported="true" />
        <feature name="textLayoutFramework" supported="true" />
        <encodingPresets>
            <preset uuid="da5cac1a-417a-4d86-b7f7-ef21010a5d7d" name="FLV - Match Source Attributes (High Quality)" ext="flv" default="true" />
        </encodingPresets>
        <testmenu>
            <menu name="ID_testInFlash" default="true" />
            <menu name="ID_testInDeviceCentral" />
        </testmenu>
        <debugmenu>
            <menu name="ID_debugtInFlash" default="true" />
            <menu name="ID_debugInDeviceCentral" />
        </debugmenu>
    </player>
</players>

Now relaunch Flash Pro CC 2014 and behold Flash10.2 has been added to the targetable Flash Player list.

Target Flash Player 10.2 in Flash Professional CC 2014

Finally, if you want, you can delete Flash CS5.5 from your system (unless you want to run the Gaia Flash Framework for Flash – in which case your stuck with CS5.5 for a while longer.)