naxoc.net

New remote job

Fri, 12 Jun 2020 20:20:00 +0200

For the last 10 years I’ve been flirting with remote work on and off. In that time I’ve been fortunate enough to have great employers that have allowed me to work remote for a couple of months in winter so that we could go to somewhere pleasant in Latin America. We’ve spent winters working in Montevideo, Uruguay and in Oaxaca, Mexico. We both love it! My wife Addi has worked remote for over 13 years, and she has been on the first wave of fully distributed tech companies.

Thunderbolt dock and Linux

Mon, 12 Nov 2018 20:20:00 +0200

At work I have a Dell TB16 dock for my Dell XPS 13. It’s pretty sweet. I plug in just one USB-C and everything works. The first time I plugged it in, Ubuntu popped up a window that wanted me to approve the access to the computer from the dock. A nice security feature when you think about it.

When I did a reinstall and installed Kubuntu instead of Ubuntu, I did not get the prompt to approve access. Apparently Kubuntu does not have packages for managing Thunderbolt by default, and no graphical interface for it. Luckily I knew that the authorization was necessary, because I could have easily just freaked out and believed that the dock would not work with Kubuntu

Switching from Mac to Linux

Sun, 11 Nov 2018 14:20:00 +0200

I’ve made the switch from a mac to Linux this fall. It’s something I’ve been wanting to do for many years, but I haven’t really had the courage before now. I used Linux when I was in the IT-University and a little bit at my first couple of jobs, but that is so long ago that it would be fair to call me a many years Mac user.

The reason I wanted to switch was that I really don’t like where Apple is going. The touch bar on the newer macs are gimmicky and the new keyboards are almost offensively horrible to me. Also - as a Vim user I get quite angry when a computer does not have an escape key. So bye, bye, Apple. I haven’t had an iPhone since 2010 and I’ve never had an iPad. This should go pretty smooth. It should be said that I am a shit photographer that never edits photos. I never play games and sadly I don’t ever do graphical design. I mostly just write code and look at tapirs and kittens on YouTube.

Navigate in Twig namespaces in PhpStorm

Wed, 17 Oct 2018 22:20:00 +0200

I’ve gotten so used to have everything be clickable or navigable in PhpStorm. “I wonder what that function deep in the vendor folder looks like?” - I command click on Mac or ctrl click on Linux (or command+b/ctrl+b), and boom I go to the function definition. I don’t know how I lived without it in the past.

But when I was writing a lot of Twig this spring I was sad that the file in Twig was not navigable like this:

Going back to a new job

Sun, 30 Sep 2018 19:20:00 +0200

It seems I’m one to like going back and forth between jobs, so now I’m going back to work for Reload. I’ve loved working for Information and I’m going to miss the people there a lot, but I decided it was time to try something new (and old I guess) again.

Like last time I changed jobs I know some people already where I’m going, but a lot has also happened in the almost 4 years I’ve been away, so I’m looking forward to getting to know new people, do more drupal, and learn some shiny new technologies too.

Mexican street art as pixel art

Sun, 19 Nov 2017 18:20:00 +0200

I’m slowly working my way through ES6 for Everyone by Wes Bos. It’s been almost 6 months since I did the #javascript30 thing and I have been trying to do little projects every now and then to keep what I learned a little current.

The ES6 course has a lot of things that I already know now - and that feels great actually. I understand it much better when I get it explained again and when I get to play with it a little.

JavaScript30 - Day 30

Sat, 22 Jul 2017 21:20:00 +0200

The final day of #javascript30 is a whack a mole game. I’m not going to write about that, but just do a little bit of evaluation on the #javascript30 month.

For whatever reason, it took me forever to get to doing the last day of #javascript30. I have really enjoyed the course and I was going on 25 days streaks of publishing a blog post with it, and then suddenly it took me over 2 weeks to write the last blog post.

JavaScript30 - Day 29

Tue, 04 Jul 2017 07:20:00 +0200

Day 29 of #javascript30 creates a countdown timer in the browser.

setInterval()

This exercise has some clever use of setInterval(). Understanding timers is a little more tricky than it seems, so take a good look at the examples in the docs too.

Select with Element.name

This one is so cool! I did not know you could do that. If you have an element that has a name like an input element, a link anchor, or even an image, you can “select” it by it’s name. The name is a property on the document and will give you the same as if you used a querySelector:

JavaScript30 - Day 28

Mon, 03 Jul 2017 17:20:00 +0200

Day 28 of #javascript30 is a UI for controlling the playback speed on a video.

There is a bit of math to calculate where the mouse is moved over a bar that will control the video speed. It is a good idea to practice lots of things that use this recording of where the mouse is or where something is clicked. The math is not rocket science, but understanding the tools that are needed to get positions are important. I have read the docs for MouseEvent.pageY, Element.offsetTop, and Element.offsetHeight quite a number of times now and while they are also not complicated, I feel like I can do with even more practice with this. I’ll cook up some codepen at some point where I illustrate what they do so I can use that as reference.

JavaScript30 - Day 27

Thu, 29 Jun 2017 17:20:00 +0200

Day 27 of #javascript30 makes a neat horizontal scroll click and drag accordion or carousel.

There are a number of event listeners in use to achieve this. mousedown, mouseleave, mouseup, and mousemove. They keep a boolean that keeps track of whether the mouse is down or up, and they set the Element.scrollLeft property to the number of pixels the user dragged the element.

`let` vs `var`

I understand const completely now, but I was fuzzy on let vs var. They are quite similar, but they differ in scope. Once again, MDN’s docs has a great explanation and example:

JavaScript30 - Day 26

Wed, 28 Jun 2017 23:20:00 +0200

Day 26 of #javascript30 is making a dropdown menu that follows you along.

This lesson takes what I learned on day 22 about getBoundingClientRect() and uses it to move around a box behind the contents in a dropdown menu. We use mouseenter and mouseleave to react to the items hovered over.

Using opacity for “animation”

I learned a really cool trick from this lesson. To get a cool “animated” feel, first add a class that displays block on the hovered item, and then a setTimeout() with about 150 ms delay that adds another class that sets opacity to 1. The item should have a transition set in CSS too to make it really look good.

JavaScript30 - Day 25

Tue, 27 Jun 2017 19:40:00 +0200

Day 25 of #javascript30 explains what happens when (DOM) events are triggered.

I made a pen based on the lesson to try to illustrate and understand better. It’s at the bottom of this post.

Bubbling

Is when an event “bubbles” up the DOM. In the example with 3 nested divs with an event listener on all of them, a click on the inner one will trigger the click listener on all of them. Note that this is the item the listener is on, but event.target is always the item that was clicked.

JavaScript30 - Day 24

Mon, 26 Jun 2017 14:40:00 +0200

Day 24 of #javascript30 is making a navigation bar that sticks to the top of the window.

This is something I have done more than once before. With some frustration, though. The same effect can be achieved with CSS’s position: fixed, but you still need JS to slap on the class or property at the right time.

`scrollX` and `scrollY`

Keep in mind that that IE does not supprt these two at all. Edge does, but to be safe, use pageYOffset or pageXOffset - these are aliases for scrollX and scrollY. See the docs for scrollY for an explanation.

JavaScript30 - Day 23

Sun, 25 Jun 2017 19:40:00 +0200

Day 23 of #javascript30 is having fun with speech synthesis and new tricks for passing arguments to a callback function.

Speech synthesis in the browser

I could not make the lesson example work with the voices dropdown in Firefox. I like Firefox and I have recently switched back to using it as my default browser. I switch back and forth at least a couple of times every year. I even blog about it sometimes. Anyway. To make it work in Firefox (and Chrome), I did this:

JavaScript30 - Day 22

Sat, 24 Jun 2017 09:40:00 +0200

Day 22 of #javascript30 makes a link hover highlight that follows you around on the page. I try to understand the difference between mouseover and mouseenter.

`mouseenter` vs `mouseover`

Using transition and translate in CSS we can make the hover look like it is following you. We listen for the mouseenter event and then the highlight is moved with CSS’ translate. I didn’t know the mouseenter event, so I tried to read up on the difference between that and mouseover. The docs are really not crystal clear, so I must say that I didn’t get all that much wiser from that. I found this demo on JSFiddle:

JavaScript30 - Day 21

Fri, 23 Jun 2017 19:40:00 +0200

Day 21 of #javascript30 is making a compass and speedometer for the phone.

Using the iOS simulator on the mac for development I made a compass and speedometer.

Launching iOS Simulator

The simulator is built into Xcode which I never use. I do like the simulator for testing though, so I thought I’d post a tip on how to launch it without seeing Xcode:

One last time — launch Xcode and use the menu item Xcode -> Open Developer Tool -> Simulator
Drag the icon from the “open apps” area to the dock somewhere.

Next time you need the simulator, you can just launch it from the Dock instead of opening Xcode to open it.

JavaScript30 - Day 20

Thu, 22 Jun 2017 17:00:00 +0200

Day 20 of #javascript30 is about speech recognition in the browser. It is safe to say I had a ton of fun and that I got completely carried away.

`SpeechRecognition`

The browser’s interface for speech recognition is pretty easy to work with. I’m amazed at how good it is at guessing what you say. Granted - it will completely mishear from time to time, but so do I sometimes!

Speech recognition language

As always when working with web stuff, my initial reaction to the speech recognition was: oh, that’s cool, I bet it only works in English and in the US just like recipes, address forms and all that. But more and more - I am proven wrong on the web. It made me happy that I can set the language to Danish even though only about 5 million people speak it. Here is how you set the language:

JavaScript30 - Day 19

Wed, 21 Jun 2017 19:40:00 +0200

Day 19 of #javascript30 is messing around with the webcam for a photo booth and doing cool effects by manipulating the RGB channels.

Webcam with JavaScript

Is so easy! You call getUserMedia() on the mediaDevices singleton to get a promise. Like this for instance:

const video = document.querySelector('.player');
navigator.mediaDevices.getUserMedia({ video: true, audio: false })
 .then(localMediaStream => {
 console.log(localMediaStream);
 video.src = window.URL.createObjectURL(localMediaStream);
 video.play();
 })
 .catch(err => {
 console.error('Ut oh', err);
 });

I had no idea that image manipulation was as simple as it is. There are 3 color channels in an RGB[A] image plus an alpha channel. I’m probably using the wrong words for these things, because I know very little about it. But go look at Pixel manipulation with canvas if you want to know more about how to change colors and make cool effects on images with JavaScript.

JavaScript30 - Day 18

Tue, 20 Jun 2017 19:10:00 +0200

Day 18 of #javascript30 is about adding up playing times for videos using reduce(), some math, and a data attribute.

More compact code

I tend to prefer readable code over terse code, but I think I am starting to really like the one- or two-liners you can make with JavaScript. This assignment could be solved with just reduce() and some math after the reduce(). Here is code that goes trough all items with a time data attribute and adds up the seconds:

JavaScript30 - Day 17

Mon, 19 Jun 2017 19:40:00 +0200

Day 17 of #javascript30 is simply sorting an array of band names, but without considering articles like ’the’, ‘a’ or ‘an’.

I felt good about this one. I am starting to feel quite at home with JavaScript’s array functions. I solved it without watching the video first and with very little code:

const bands = [
	'Another Band Name', 
	'An Amalgam', 
	'The Frosty Shred', 
	'Buffalo Of Arrow', 
	'The Thrash Paranoia', 
	'During Temperature', 
	'A During Temperature', 
	'The Drug Meeting'
	];
const regex = new RegExp(/^(The|An|A)\ /, 'i');
bands.sort((a, b) => a.replace(regex, '') > b.replace(regex, '') ? 1 : -1);
document.querySelector('#bands').innerHTML = bands.map(band => `<li>${band}</li>`).join('');

Because sort() mutates the array, I needed very few lines of codes. I have linked to it before, but here is a list of array functions that mutate the array. It is important to understand, and nifty to know!

JavaScript30 - Day 16

Sun, 18 Jun 2017 19:40:00 +0200

Day 16 of #javascript30 is having fun with a little bit of math and some CSS.

This lesson creates some text and when you hover over it, the text shadow follows the mouse. I learned some good practices when dealing with math for stuff like this. When calculating x and y position of the mouse on the mousemove event, then use the event.target.offsetLeft and event.target.offsetTop instead of event.offsetX and event.offsetY if the item you are listening on (this) is not the same as event.target.

JavaScript30 - Day 15

Sat, 17 Jun 2017 08:40:00 +0200

Day 15 of #javascript30 is about localStorage and event delegation.

LocalStorage

The Window.localStorage a simple key-value store that lives in the browser. It is pr. site and has a nice and simple interface. Keep in mind that both the key and the value should be a string, so often times the value is made into json if it is an object.

The methods on the Storage object can be found here, but I’ll just list the most important ones:

JavaScript30 - Day 14

Fri, 16 Jun 2017 17:20:00 +0200

Day 14 of #javascript30 is understanding reference vs copy on variables.

This is where so many programmers make mistakes. Not just in JavaScript, but in most programming languages. Understanding — as in really understanding this is super important.

JavaScript and PHP are almost the same when it comes to refrence vs copy, with the exception of arrays. JavaScript assigns them by reference, and PHP doesn’t. Strings, numbers and booleans are copies. Everything else (I think?) is reference.

JavaScript30 - Day 13

Thu, 15 Jun 2017 21:20:00 +0200

Day 13 of #javascript30 is a how to get those swishy images come fly in from the sides of the page.

Like Wes, I am not a big fan of animations that do this, but I still get requests for stuff like this from time to time. So I guess it is good to know.

In the excercise, a function is called through a debounce function on scroll. I have used a function like that in the past with underscore.js and it is a really good idea if you don’t want to slam the browser with stuff on scroll.

JavaScript30 - Day 12

Wed, 14 Jun 2017 17:20:00 +0200

Day 12 of #javascript30 is having fun with konami codes or whatever you want to be your secret code.

This lesson didn’t introduce things that surprised me, but it had a very nice and precise use of .splice() that illustrates how it mutates the array instead of returning a new one. It is basically practicing what we learned in lesson 7 only it is slicing the array backwards. And you never become too good of a programmer to see examples using arrays.

JavaScript30 - Day 11

Tue, 13 Jun 2017 17:40:00 +0200

Day 11 of #javascript30 is dealing with controlling a video player.

Like with the <audio> element, I was amazed at how simple the interaction with the player is in the <video> element. I learned how to control volume, skipping and the progress bar. Neat! Once again it blew my mind how many events you can listen for. Here is a list of media events and listening on them instead of trying to keep your own state for example the play button makes a ton of sense.

JavaScript30 - Day 10

Mon, 12 Jun 2017 20:50:00 +0200

Day 10 of #javascript30 seems simple enough. Check multiple checkboxes when holding shift down. It was pretty hard, though.

This one is a prime example of why only practice makes you a good JavaScript programmer. It’s a pretty common UI thing - most email clients use it, so really good call by Wes to include this one in the lessons. I find that in JavaScript there is a lot of UI interaction that I am so bad at because I don’t use it in PHP and therefore I just haven’t done it enough. And that makes a pretty simple task like this one into something that takes a good while for me to figure out. Should I keep a boolean with state? Should I use slice on the array instead of looping over the whole thing? I simply don’t know best practices or pros/cons for these things. This solution loops over the array of checkboxes and holds a boolean if we are in between lasted checked box and the box currently being checked.

JavaScript30 - Day 9

Sun, 11 Jun 2017 17:20:00 +0200

Day 9 of #javascript30 is about what you can do with the browser’s dev tools to help you in your code.

Inside console.log you can interpolate strings like in PHP’s sprintf(). You can also just use the backticks from ES6.

There are a number of methods you can call on the Console object - it’s worth checking that list out. One in particular I think is cool: console.assert(). It only prints if what is inside the parentheses evaluates to true. While developing it could be a good idea to use that for some assumptions you have. If the console stays quiet, you’re assuming right!

JavaScript30 - Day 8

Sat, 10 Jun 2017 13:20:00 +0200

Day 8 of #javascript30 is playing around with canvas and drawing colorful things in the browser.

You don’t actually draw on the the <canvas> - you draw on the ‘context’ that you get from the canvas - which can be 2D or 3D. Todays lesson is focusing on 2D and you can do a ton of cool stuff with that, so go check out the list of functions that CanvasRenderingContext2D offers. Lines, shapes, text and so on.

JavaScript30 - Day 7

Fri, 09 Jun 2017 16:20:00 +0200

Day 7 of #javascript30 is another array workout. I learn about some() and every() and feel good about it.

Arrays, chapter II

This time we are doing more filtering and searching in arrays. Some of the filtering uses Date — an old nemesis of mine. It’s actually OK simple to use and I learned that with parentheses you can call functions on an object like this:

const year = ((new Date()).getFullYear();

rather than:

const date = new Date();
const year = date.getFullYear();

`some()`

some() will check if any item in the array passes some condition. It returns true if any item passes the condition.

JavaScript30 - Day 6

Thu, 08 Jun 2017 17:00:00 +0200

Day 6 of #javascript30 is an ajax type ahead form. I learned about the fetch API, promises, asynchronicity, and I might finally understand ‘const’.

Fetch API

In the past I have used jQuery’s ajax(), get(), or getJSON() for requesting stuff or I have gone to Stack Overflow and copied an XMLHttpRequest like the one below because there was no way I’d remember how to do that from time to time.

var xmlHttp = new XMLHttpRequest();
 xmlHttp.onreadystatechange = function() {
 if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
 console.log(xmlHttp.responseText);
 }
 xmlHttp.open("GET", endpoint, true); // true for asynchronous
 xmlHttp.send(null);

It so much easier to use fetch():

JavaScript30 - Day 5

Wed, 07 Jun 2017 16:20:03 +0200

This lesson from #javascript30 is showcasing some neat stuff you can do in CSS with Flexbox. While I have used that a couple of times, I feel a little bit about flexbox as I do about JS. I’m not going to get better at it unless I practice. I noticed that the Wes Bos has a 20 video course called What The Flexbox?. I’ll definitely check that out. I really like this format.

JavaScript30 - Day 4

Tue, 06 Jun 2017 16:00:03 +0200

Arrays

Mr. #javascript30, Wes says that he became a much better programmer when he forced himself to get really good at the array methods. I totally agree that this is central to be good at in most programming languages. Today he talked about these methods in particular:

These are all methods that exist in PHP too, so not many surprises for me there. Wes called them “a gateway drug for functional programming” and if you have dabbled a little with that it makes sense.

JavaScript30 - Day 3

Mon, 05 Jun 2017 13:20:03 +0200

Day 3 of #javascript30 is using CSS variables and manipulating them with JS. I got my mind blown and I learned about the :root pseudo-element.

CSS variables

The browser support for CSS variables is not great yet. They also have a little bit of a funky syntax with the --:

element {
 --spacing: 10px;
}

That said, I got pretty excited about the cool stuff you can do with them together with JavaScript. I can’t wait for better adoption for them but there are hopefully also some polyfills for them out there.

JavaScript30 - Day 2

Sun, 04 Jun 2017 13:40:03 +0200

Day 2 of #javascript30 is using CSS transform to rotate the hands on a clock.

Manipulating CSS

A HTMLElement has a style property that can be accessed and manipulated like this for instance:

document.querySelector('.second-hand').style.transform = `rotate(${secondsDegrees}deg)`;

Vanilla JS has a toggle() that works just like jQuery’s toggleClass(). In fact the classList has a couple of very handy functions that are a lot like stuff jQuery will give you.

Template Literals

The string in back-ticks in the code above is using a Template Literal and I love them. They make it so much easier to write some HTML in JS and to get variable in strings without concatenating them. To use a variable in the string, use the ${yourVar} notation. You can even do stuff like this:

JavaScript30 - Day 1

Sat, 03 Jun 2017 13:20:03 +0200

Day 1. I can do this. First of all I would like to thank Wes Bos for the awesome learning material. I haven’t really played around with all the cooler visual stuff JS can do and the daily assignments look really visually pleasing. It is going to feel good making them work. Go check out JavaScript30 if you wanna learn JavaScript.

I’m not going to describe what the assignments for the JavaScript30 lessons are, but just pull out the interesting stuff I learned or got refreshed. I am writing this for my own reference too.

I am bad at JavaScript

Thu, 01 Jun 2017 15:20:03 +0200

My name is Camilla and I am bad at JavaScript. I feel ashamed to write this blog post.

I am a backend developer

I consider myself an experienced Drupal and PHP developer. I have a masters in computer science and before I started working with web I was doing enterprise Java for a couple of years. I have a good grasp on object-oriented programming and design patterns as well as a love for writing clean and simple code — something that can only be done by understanding the programming language and the task at hand well.

New Job

Tue, 24 Feb 2015 21:20:03 +0200

I am switching to go work for Dagbladet Information (again) from April.

It’s been a really hard decision. I had to choose between two different kinds of Drupal awesome. I know—really a first world problem.

Reload has amazing people and great clients that are willing to work agile. I have been super happy with the projects I have been working on and I have worked with a lot of the best Drupal developers in Denmark there. Also, if you would like to work with Reload, check out this job posting!

naxoc.net is now on Sculpin

Thu, 19 Feb 2015 16:51:03 +0200

I have changed the blogging engine for this blog once again. This blog was on Drupal for a while, then on Octopress (Jekyll), and now on Sculpin. I was never unhappy with either of them—I just enjoy playing around with new stuff every once in a while.

This blog is now a custom Sculpin thing. There is a blog skeleton available to get you started, but I thought I would roll my very own with some heavy inspiration from the skeleton. I also wanted my “theming” to be custom so I could play with new shiny things like Gulp.

Switching back to Firefox

Tue, 03 Jun 2014 16:38:30 +0200

I have been using Firefox since it came out. I used it back when it was called Firebird and Phoenix. I went to the release party when 1.0 came out and I have advocated using Firefox to anybody that wanted to listen – and a few that didn’t.

2-3 years ago I switched to Chrome along with a lot of other people. Firefox was getting bloated and Chrome had all kinds of shiny tools. But I am back to using Firefox now, and I thought I would explain what lured me back in this post.

Atom editor update problem

Sun, 18 May 2014 20:51:03 +0200

I have been playing around with Github’s new editor Atom for a while now. I actually quite like it, but it still hasn’t taken Vim’s place as my default editor yet. Maybe it will at some point, but we’ll see.

Atom updates itself and that has been working great, only it stopped working a while ago. It threw some long error to the GUI editor that I can’t remember and when I tried to run apm upgrade it said:

Switch between PHP versions with Homebrew

Wed, 07 May 2014 20:25:40 +0200

I am working on a few older Drupal sites that are quite insistent on using PHP 5.3 and not PHP 5.4. No problem - I’ll just use Homebrew to switch between versions! But I have been running into all kinds of problems every time I have done this, so I figured I would post what I do to repair things here.

So, in theory all you should have to do is install the versions you need if you don’t already have them. brew install php53 And when you want to switch just run this: brew unlink php54 && brew link php53

Keyboard shortcuts in PHPStorm

Sat, 08 Feb 2014 13:27:35 +0100

Coming from Vim to PHPStorm I use the mouse a whole lot more than I did before. Vim is amazing once you learn it and the mouse can take long naps when you do everything with keyboard commands. PHPStorm is a great IDE, so I switched because I felt like I got so much more good stuff like the debugger, easy refactoring, structural overview, and so on. In the beginning I used the IdeaVim plugin in PHPStorm so editing seemed more like Vim, but I ended up abandoning that because I found it buggy.

Syntax highlighting commands with Zsh

Sun, 02 Feb 2014 13:48:19 +0100

I started using zsh about a year ago after having resisted it with a passion. My main worry was that I would “forget how to bash” and be lost on various servers I log in to. While there are some nifty things I have gotten a little too used to in zsh, I don’t think it has been a big problem.

One thing that visually tells me that I am in zsh and not bash is that my zsh terminal syntax highlights as I type. Yes, you read that correctly. If you are not familiar with the zsh-syntax-highlighting prepare to have your mind blown.

Placeholder selectors in SASS

Tue, 28 Jan 2014 19:45:00 +0100

When I found that you can ‘@extend’ classes in SASS to reuse code and compile to neater CSS I was pretty excited. Here is an example of ‘inheriting’ code with @extend:

.speak {
 font-family: Courier New, monospace;
 max-width: 400px;
 clear: both;
 span {
 font-weight: bold;
 display: block;
 }
}
.voice-1 {
 @extend .speak;
 span {
 color: magenta;
 }
}
.voice-2 {
 @extend .speak;
 float: right;
 span {
 color: green;
 }
}

That will compile to:

Organizing code when using Modernizr and SASS

Wed, 15 Jan 2014 12:45:00 +0100

The JS library Modernizr makes it really easy to write CSS with support for older browsers. What it does is put classes in the <body> tag that will tell you what the browser doesn’t support. For instance IE9 in the screenshot does not support CSS gradients:

I was going trough with IE9 on a rather large site that uses some spiffy CSS3 tricks to achieve awesome. It has been a pleasure to work with Compass and SASS to build the site, but when it came to making it look decent in IE9 there was some work to be done.

Format json output from cUrl neatly

Fri, 22 Nov 2013 14:27:00 +0100

Here is a short simple tip to read json output from curl in a neat formatted way:

Pipe the output to Python like this:

curl "http://url.to.call?args=hi" | python -mjson.tool

This will prettify the output and make json much more readable when testing webservices. It also validates the json, so if it contains errors you will get a warning.

It works with Python 2.6 and higher and you can find more info at the Python docs page.

Color schemes and productivity

Sun, 10 Nov 2013 13:45:00 +0100

Almost all programmers have a color scheme or theme in their terminal and their code editor. Some people actually turns syntax highlighting off, but I will never understand that. To me - code is something that lives on a black or dark background and has syntax colors. I have only ever used a white background color scheme back when I was using Eclipse 8 years ago. And probably because I couldn’t figure out how to set another color scheme than the one that comes with Eclipse.

Finding unused images in your website code

Mon, 28 Oct 2013 21:45:00 +0100

I was doing a lot of changes to CSS files today - mainly deleting a whole lot of stuff. I wanted to see if there were image files that were referenced by CSS that were no longer in use, so I wrote this naïve little script that loops through all image files it finds in the dir you give it to see if there are references to the image files.

Windows in VirtualBox on the Mac

Tue, 22 Oct 2013 21:06:00 +0100

I have been doing more CSS and front-end stuff lately. I am having a lot of fun learning more about these things that I have somehow avoided doing for the last many years.

Today I realized that I don’t have to own a MS Windows license to run a setup in a VM for browser-testing. While I don’t hate Microsoft (anymore) I would really rather not buy a license for a product that I think is horrible. Anyway - I had no idea that it is super simple to set up a VM running whatever version of IE you want on Windows.

Setting up a file watcher for Compass in PHPStorm

Sun, 06 Oct 2013 20:55:00 +0100

EDIT: It seems that the version 7 early access now has a file watcher preset for Compass - nice work JetBrains! The part about scope from this blog post is still useful to you if you are on PHPStorm 7 though.

I started using PHPStorm about 6 months ago and while it is an extremely awesome and powerful IDE there are just so many things you can set up and configure. I have to admit that for the first couple of months I pretty much used PHPStorm just like I did Vim and not using any of the many configurable things except for the debugger. I am slowly venturing into playing around with setting more stuff up, and I thought I would share this one because it took me a while to get right.

A git commit hook helps you keep your code clean

Mon, 26 Nov 2012 22:18:00 +0100

I like to keep my code free of trailing whitespace. I feel what xjm describes as “spinach in your teeth” about whitespace and non-conforming coding standards.

I got (heavily) inspired by Josh The Geek’s git pre-commit hook, and made myself a commit hook that will check the code I am about to commit for common errors. In addition to whitespace, I like to make sure that I don’t accidentally commit debug code like krumo(). The commit hook also checks for common calls to debug functions.

Using specific versions of formula with Homebrew

Tue, 05 Jun 2012 13:54:00 +0100

I have my LAMP stack and other things set up on my mac with the wonderful Homebrew.

I recently did a brew upgrade on my system and it seemed that everything went smooth. But when I later ran PHP from the command line I got this error:

PHP Warning: PHP Startup: Unable to load dynamic library '/usr/local/Cellar/memcached-php/2.0.1/memcached.so' - dlopen(/usr/local/Cellar/memcached-php/2.0.1/memcached.so, 9): Library not loaded: /usr/local/lib/libmemcached.9.dylib
 Referenced from: /usr/local/Cellar/memcached-php/2.0.1/memcached.so
 Reason: image not found in Unknown on line 0

I poked around in my php.ini to see if the wrong file was being included or something like that, but it turned out that I had upgraded to a newer version of libmemcached than the one memcached was using. So I needed to downgrade libmemcached. Here is how to switch to any version available with Homebrew:

What's with the weird name?

Sun, 05 Feb 2012 19:09:00 +0100

So, Camilla.. Why is your nick everywhere naxoc?.

Xoc means shark in Yucatec Maya. It might actually be one of the very few words that made it into English. I used to study American Indian Language and Culture at the University of Copenhagen. Those were the days with much nerding over Mayan hieroglyphics. Maya hieroglyphic texts are often about how fantastic the rulers where and one of the more fantastic female rulers was called Lady Xoc. I thought she was pretty cool, so I stole the name. The Na- prefix is simply a marker for female. So there is the story of my weird nick.

Navigating with Krumo

Wed, 14 Sep 2011 09:13:00 +0100

The Devel module includes the super helpful Krumo library. I use dsm() and krumo() all the time. If you are not familiar with Devel, you should try it. Morten Wulff wrote a demo page for the module.

Today a client suggested that the Devel module Krumo could display the “path” to an item in an array by right clicking or otherwise interacting with the nested elements in the output from Krumo. I was really excited about that idea - I can’t count the number of times I have tried and failed to target an item deep in a form array or an item in the node object simply because my human brain can’t remember a structure like $form['#node']->content['links']['comment']['#attributes']['class'] for more than 3 seconds.

Moving an iTunes Library

Wed, 11 May 2011 15:22:00 +0100

If you are moving an iTunes library to a new mac it will go smooth if the user login is the same. So if I move my iTunes library from an old machine where it was located in /Users/ckj/iTunes to a new machine where it is gonna go in /Users/ckj/iTunes - I have no problems. But if I changed to another username on the new machine - all the paths in the iTunes Library.xml file will not be correct anymore. I have moved libraries so many times now and I thought I would share a really quick way to fix the iTunes Library.xml file to reflect the correct user directory.

Hot Laptop? Vacuum it!

Wed, 27 Apr 2011 21:48:00 +0100

My beloved 3years old Macbook Pro was starting to get really hot when I used it. It had gotten to the point where I would burn my legs if it was on my lap, and since having your laptop on the lap is kinda the point, I felt had to do something about it.

I bought a Logitech Notebook Cooling Pad that actually is very comfortable and does exactly as it says it will, but I was still curious to see if I could get my old healthy Macbook back.

Pet peeve #1 - the comparison operator

Fri, 10 Dec 2010 14:27:00 +0100

I have a lot of pet peeves when it comes to programming, databases, web content, food, beer, and, well just about everything. I am thinking of making a series of pet peeves here on this site. Some will seem like plain rants, and others will be more like tips.

When making comparisons, switch the order of the things you compare like this:

if ('book' == $node->type) {
// Stuff happens.
}

You might think why? And that looks weird! Yes, it does look a little weird. But I do this to not accidentally assign the $node->type the value I am comparing it with. It is hell to find an error like this when debugging:

Social media meta

Wed, 20 Oct 2010 11:33:00 +0100

I am doing some integration with facebook these days. I don’t use facebook much and I certainly no not want all kinds of test data on my profile so I made a test profile using names that just came to mind :-P

On the facebook developer pages there is a demonstration of the like button. That you can like… Gotta love the meta!

Upgraded to Drupal 7

Mon, 18 Oct 2010 20:58:00 +0100

I updated this website to D7 this weekend. Mikkel upgraded his site and urges others to do so now, so I thought I’d give it a shot too. And it was good fun! OK, granted, this site is 4 posts and pretty much nothing else, but that makes it a perfect time to upgrade.

I actually never did an actual core upgrade via the upgrade path before. The sites I have upgraded from D5 to D6 have pretty much all had such a complex data structure that I had to do an upgrade with a data migration. While that is a lot of work (and requires a programmer), I still like the opportunity it gives to clear out a data model that might have grown a little too organically. For this site though, that would be gross overkill. So my approach was simply to read UPGRADE.txt and follow the steps.

Backup and migrate module + Dropbox = peace of mind

Mon, 16 Nov 2009 21:06:00 +0100

The backup and migrate module is truly sweet. We all know that it is a really good idea to back up data. But if you are like me - you forgot to do it or just don’t do it for some lame reason. So backups should be automated. The backup and migrate module does exactly that - it can be configured to run every X hours if you have cron (and you should have) running on your site. The module makes a dump of the database and puts it in a folder in the files folder of the site. Even if you use the public download method, the security is OK - a .htacces file put in the folder by the backup and migrate module and disallows access to the folder’s content.

Hide Drupal files with .htaccess

Fri, 13 Nov 2009 23:50:00 +0100

If one goes to somedrupalsite.com/CHANGELOG.txt - it is normally possible to read the file and see what version of Drupal the site is running. If you don’t want everybody to see what version you are running, it is a good idea to cloak the *.txt files in the Drupal install.

Using rewrite rules in .htaccess, the *.txt files in Drupal can be hidden. I use a 403 - forbidden on these files. That is what the [F] means See the Apache documentation on RewriteRule for more options.

About

Mon, 01 Jan 0001 00:00:00 +0000