Adventures in Japan 2015: Tokyo

Tokyo is far cleaner and safer than you would expect even if you have been told about it, women walk seemingly unafraid down dark alleys and litter seems to be an endangered species, but you do have to be more aware of your surroundings, several times I turned round to discover my lack of attention had lead to a queue of 10+ people waiting for me to get a grip and start moving again.

As a city Tokyo was the first one I had been too that felt much larger than London, unsurprising at its population is 13.4 million vs London’s 8.5, we went to at least 5 districts that could have easily passed for the city centre and all of them were packed.

We barely touched on what Tokyo had to offer (avoiding all traditional culture in Tokyo on this trip), however the artificial island of Odaiba was my favourite day



Tokyo had about 4 or 5 areas (it may had had more but we did not get to them all) that are like Times square or Piccadilly filled with neon and all dedicated to a different purpose




Akihabara anime central for the WOOORLLDDDD



The national Kabuki theatre, looks nice but a bit too rich for my blood (loads of other stuff to see)



Living space in Tokyo was a strange mix, rooms and such were very small but they seemed to confine this to only certain areas: corridors, pavements and gardens were all spacious and appear in the strangest places, it made walking through even the poorest areas a pleasant and sunny experience.



Look at this road, clean, no rubbish but Ivy is still allowed to spread, a mixture of nature and modern life we rarely see in the west (its the little things)

A real Sacred Tree, its Anime made real!

The gateway to the massive Meiji Shrine, we never got past the outskirts on this trip but next time we will dedicate the time it deserves.



A view from the automated rail, how can this be a capitol of a major world power, it’s so clean it looks like a model.



“Up from the depths, Thirty stories high, Breathing fire, His head in the sky” …… MY HERO!!! <3



I like a nice subtle sign post, nothing flashy or showy :p



For those who think that the Japanese regard Anime as just a fringe interest you may be wrong. To them its bigger than Disney is to Americans

This is a SEGA foot massage machine in an arcade, you get little plastic bags to put your feet in to keep everything clean and it works really well (but I have to say I could not follow the instructions)

Now this is how you do a show trailer!!! the whole set lit up

I have seen these before but this was the best use of space and the first flip one that I have ever Seen

  1. transform src="/assets/img/blog/XXXX" width="740" action="resize" []

C3 charts on Saleforce Winter16

As @devinthecloud points out in his Blog post Salesforce Winter 16 wrecked C3 charts on the pages he and I had developed. he found the removal of <apex:form> fixed the issue on his pages, but on my page the charts were still broken, so instead of this:

 

 

You get this

 

 

I stripped the page down to a bare minimum that you can use to recreate the issue, see below,

<apex:page docType="html-5.0" 
           applyBodyTag="false"
           showHeader="true"
           readOnly="true"
           sidebar="false">
<html lang="en">
  <head>
      <!-- Static Resources for CSS -->
        <link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet"/>
    </head>
    <body>
      <div id="chart"></div>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js" />
      <script>
        var chart = c3.generate({
          data: {
            columns: [
  //            ["setosa", 0.2, 0.2, 0.2, 0.2, 0.2, 0.4, 0.3, 0.2, 0.2, 0.1, 0.2, 0.2, 0.1, 0.1, 0.2, 0.4, 0.4, 0.3, 0.3, 0.3, 0.2, 0.4, 0.2, 0.5, 0.2, 0.2, 0.4, 0.2, 0.2, 0.2, 0.2, 0.4, 0.1, 0.2, 0.2, 0.2, 0.2, 0.1, 0.2, 0.2, 0.3, 0.3, 0.2, 0.6, 0.4, 0.3, 0.2, 0.2, 0.2, 0.2],
              ["versicolor", 1.4, 1.5, 1.5, 1.3, 1.5, 1.3, 1.6, 1.0, 1.3, 1.4, 1.0, 1.5, 1.0, 1.4, 1.3, 1.4, 1.5, 1.0, 1.5, 1.1, 1.8, 1.3, 1.5, 1.2, 1.3, 1.4, 1.4, 1.7, 1.5, 1.0, 1.1, 1.0, 1.2, 1.6, 1.5, 1.6, 1.5, 1.3, 1.3, 1.3, 1.2, 1.4, 1.2, 1.0, 1.3, 1.2, 1.3, 1.3, 1.1, 1.3],
              ["virginica", 2.5, 1.9, 2.1, 1.8, 2.2, 2.1, 1.7, 1.8, 1.8, 2.5, 2.0, 1.9, 2.1, 2.0, 2.4, 2.3, 1.8, 2.2, 2.3, 1.5, 2.3, 2.0, 2.0, 1.8, 2.1, 1.8, 1.8, 1.8, 2.1, 1.6, 1.9, 2.0, 2.2, 1.5, 1.4, 2.3, 2.4, 1.8, 1.8, 2.1, 2.4, 2.3, 1.9, 2.3, 2.5, 2.3, 1.9, 2.0, 2.3, 1.8],
              ["setosa", 30],
  //            ["versicolor", 40],
  //            ["virginica", 50],
            ],
            type : 'pie',
            onmouseover: function (d, i) { console.log("onmouseover", d, i, this); },
            onmouseout: function (d, i) { console.log("onmouseout", d, i, this); },
            onclick: function (d, i) { console.log("onclick", d, i, this); },
          },
          axis: {
            x: {
              label: 'Sepal.Width'
            },
            y: {
              label: 'Petal.Width'
            }
          }
        });
        setTimeout(function () {
          chart.load({
            columns: [
              ["setosa", 130],
            ]
          });
        }, 1000);
        setTimeout(function () {
          chart.unload({
            ids: 'virginica'
          });
        }, 2000);
      </script>
    </body>
</html>
</apex:page>

 

This let me narrow it down to the Salesforce header.
when you set **showHeader=”true”** it breaks
if you set **showHeader=”false”** it starts working
As this is obviously and provably down to a change in winter 16 I can raise it with Salesforce and get a fix.
…….. Wrong!
I quote

“At times, Client Side JS conflict with SFDC header JS will collide with already defined functions with the same name.”

“the behaviour of JavaScript is inconsistent with Salesforce components.”

and

“as we don’t support JavaScript”

Ah it’s nice to see that young Internet companies have the same grasp of customer service as the traditional IT companies and thus it falls back on consultants to fix, in this case with an Iframe, I’m not a fan of Iframes normally but as Salesforce use them themselves there is precedent
And so we now split our single page into 2 pages, an inner content and an outer Iframe wrapper
First we take out the existing page (it was called **”chart_test”**), rename it to **”chart_test_inner”** and set **showHeader=”false”**
Then we put in a Iframe wrapper with the old name and a bit of CSS to make it size properly then point it to the inner content

<apex:page docType="html-5.0" 
           applyBodyTag="false"
           showHeader="true"
           readOnly="true"
           sidebar="false">
<html lang="en">
  <head>
  <style>
  .fluidMedia {
    position: relative;
    padding-bottom: 56.25%; /* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
    padding-top: 30px;
    height: 0;
    overflow: hidden;
  }
    .fluidMedia iframe {
        position: absolute;
        top: 0; 
        left: 0;
        width: 100%;
        height: 100%;
    }
      </style>
  </head>
    <body>
    <div class="fluidMedia">
        <iframe src="../apex/chart_test_inner" frameborder="0" > </iframe>
    </div>
    </body>
</html>
</apex:page>

 

And now instead of a broken

We have a working

Hooray!!!

Updating Statamic on AWS

For this blog I use Statamic, a very nice website CMS bassed on Markdown and using flat files which makes it perfect for the way I work in that I can link a Drop box account to the cheap AWS server I use for hosting and then edit blogs via mobile on a wide variety of machines with just a test editor.

Anyway the site has been rock solid for ages (5500+ hours) when I suddenly realised I wanted to upgraded the Statamic version to take advantage of some new features, that’s an easy job, you just replace a couple of directories in the httpd WWW directory, but I got a couple of errors and realised that I had an old version of PHP53 on the server and I had not patched it for a while (wince). also it had been so long since I had even logged on to the box that I could not remember what to do, so this is just an aide-memoire for those in the same situation

as I’m on Linux you need to make sure your AWS pem is secure sooo

sudo chmod 644 serverkey.pem

Then connect to the box with SSH

ssh -i serverkey.pem ec2-user@XXX.XXX.XXX.XXX

Now first things first, lets do a full update

sudo yum update

Once that is done, we have to remove http and php to update them all (yes you will get an outage)

sudo yum remove php httpd php-cli php-xml php-common httpd-tools

This will uninstall the server its self (but not your website), lets install the new version

sudo yum install php55 php55-pdo php55-gd 

If you notice I added “php55-gd” to the install as you will need this for some of the new Statamic features such as the file and gallery features. Quick start the server before anyone notices

sudo service httpd start
 

You will find that the site seems to work fine, but as soon as you attempt to go to a individual blog you will find it gives you a 404, this is because the htaccess files in Statamic are being ignored so you will have to go back and tell httpd to not ignore them. so you need to edit the httpd.conf file
So first lets go to the httpd config directory

[ec2-user@ip-XX-XXX-XX-XXX /]$ cd etc/httpd/conf
 

And edit the httpd.conf file ( a good cheat sheet to vi is [Here](http://www.lagmonster.org/docs/vi.html) )

sudo vi httpd.conf

change the instances of “AllowOverride None” to “AllowOverride All”
once that is saved you just restart httpd

sudo service httpd restart

And you should be all done.