Pi has arrived

Received my Raspberry pi this weekend.

A Pi 2 and a Pi 1 Model B+

Booted up the Pi 2 since I ordered a starter kit with it from adafruit, everything worked right away, much easier than the beagleboard I ordered way back in 2010, but it could have been due to the fact I did not have an HDMI monitor.

But it has very cool potential, it looks like it will be pretty easy to take it anywhere, especially with the computing power of pi 2, I might even make it my dedicated box to dev my personal website at.

So far I’ve been looking at what I can do with the raspberry pi, and seems creating a pi 2 portable computer is definitely a viable option.

I’m not a creative maker like Machael is, I don’t even have space to get the power tools 🙂

But there are some ideas that I can definitely take. For example, his selection of battery and LCD screen.

With Pi 2, my plan for now is to run VNC on it and get a cheap tablet as my portable monitor, if there is a need, I can still use the HDMI port whenever I have access to a monitor.

The issue I’d like to solve is: Portable power, while Michael’s battery could potentially take care of a lot of the problems, adafruit again looks like they have some pretty awesome solutions, I remember when I first started shopping AT-mega chips there, the first version of Minty Boost just came out. Now they have so much more.

Suffice to say, I got my hands full with the pi 2. What will I do with the Model B+?

So far, I can’t decide whether I want to make it into an XBMC media centre, or a media display board, or something that will need the camera for.

It seems this pi day, I will be going through some code and figure out how to use the camera board with the model B+

Advertisements

I actually LIKE Javascript

So, I decided to make a personal website, and of course, that requires a little bit of javascripting.

This time, I didn’t jump into Angular or nodeJs or any of the tools cool kids now use, I started off with pure Javascript for a few utility and once I got a feel for it I moved on to JQuery.

And I actually came to LIKE Javascript.

I’ve always been a C++/C# guy, the flexibility C/C++ gives with loose type and pointers just make so much sense, but I also loved the library .Net provides. I guess I like C/C++ for their concepts, and C#/.Net for its practicality/productivity.

So, Javascript has never really been on my radar even though I do have to work with it from time to time.

This time, I decided to properly study javascript, learn how to use prototype, how to simulate OOP using javascript and decided that it’s a really cool language.

So here’s what I like most about Javascript

1) It’s flexible like C/C++

The one thing I missed about C/C++ the loose types, why do I now have to look up on Google/MSDN to remember

string value = ASCIIEncoding.ASCII.GetString(array);

when I could simply loop through the array and do something like this? Sorry, my memory with C/C++ is starting to be vague, I’m not even sure if it does give the right values, but the point is we could do something like this without having to memorize a bunch of other methods.

charVal[i] = byteVal[i];

Well, Javascript has that flexibility. I can use a variable without knowing what it is, I don’t need to unbox an object and get an InvalidCastException, I don’t need to convert the object to a string and then use TryParse to see if it worked.

With Javascript, it’s straight forward, I can even do this

var a = "12";
var b = "23";
var c = a * b; //c = 816
var d = a + b; //d = "1223"

Well, it’s not the best example, but at least it means I don’t need to do something like this

int selected = Convert.ToInt32(list.SelectedItem);

2) It’s simple.

Following the above point, we know exactly how to fix an issue because there is only so much details to javascript. On the other hand, with C# we’d probably have to put a try catch around Convert.To* method which always introduce scope issues and performance concerns when the code enters the catch block. Or we can look up on MSDN to find out about TryParse method.

With javascript, although I can’t find a good use case right now, the syntax will be simple. Most likely something like

if (isNaN(val))
{
}

3) It’s super extensible

People have been advocating design patterns with Java and C#, but I find it much easier to learn with Javascript, because with javascript, there is no Interface, there is no Delegate. You don’t have to worry about these constraints a framework imposes. You simply try to call the method, if it doesn’t exist, you implement it.

It makes learning the patterns much simpler because it just make sense.

In a way, I find javascript ENCOURAGES MV* like patterns because we get so tired of writing the same HTML code over and over again, it’s only nature to decide to add the method to prototype, or make it a jQuery plugin.

Yes, I’m bringing jQuery into this conversation. jQuery is proof why javascript is awesome not the other way around.

I haven’t seen any language that allows you to create a wrapper around an object to extend its functionalities as simply as jQuery does.  Sure “this” is confusing at times, but I’ve come to love it.

What I’ve seen people say about javascript and what I have to say about them

1) jQuery/NodeJS/Coffee Script etc… are 100X better.

I’ve seen people on the Internet saying there are so many frameworks that can do things 100X better, but to me. That’s EXACTLY what makes javascript AWESOME!

Its simplicity and extensibility is the reason why these libraries/frameworks can come into existence.

So, while people love using these new frameworks, I like to come back and think about what allows them to be so great.

2) You have to write a lot of ugly codes over and over again

Sure, DOM manipulation can get ugly, especially with the naming and classes, indexing. But that’s not a reason to dislike javascript, it’s these so-called weaknesses that encourages libraries like jQuery to come about.

Once prototype is understood, it only comes as a second nature to factor them away, and now there is jQuery, it’s as simple as wrapping this code around $.fn.name(){}

So maybe my view will change later as I work now more and more web oriented stuff at work, but so far, I like it.

Fix `ereg is deprecated` errors in PHP 5.3

While helping someone making a php site, I ran into some old codes using ereg

To get rid of the deprecated warnings replace ereg with preg

Fix ‘ereg is deprecated’ errors in PHP 5.3

However, it didn’t quite work for me

It had something to do with some symbols being treated as delimiters when they shouldn’t be.

For some reason, the method described on that site did not fix it the issue (wrap the patterns with //)

What I ended up doing was to wrap it with

ie. ereg(“‘[-A-Za-z0-9+&@#/%?=~_|!:,.;]*[-A-Za-z0-9+&@#/%=~_|]?(/.*)?$'”, $text)
becomes
preg_match(“[-A-Za-z0-9+&@#/%?=~_|!:,.;]*[-A-Za-z0-9+&@#/%=~_|]?(/.*)?$“, $text)

and

ereg_replace(“([ \t\r\n])+”, “”, $text);
becomes
preg_replace(“([ \t\r\n])+“, “”, $text);

Firefox Radio button issue – Selects the next option on refresh

This is something I encountered in my last job, don’t know if it still happens

But in case anyone encounters the same problem. Here is the gist of it

Suppose a page has a radio button with three options like so

(#) Option 1
( ) Option 2
( ) Option 3

Selection will change on every refresh, suppose we pressed F5 to refresh the page, it will now look like this

( ) Option 1
(#) Option 2
( )  Option 3

This behaviour is only present on firefox, supposedly it has been a problem since 2007 but noone bothered to fix it: Bugzilla link

The “fix” is simple

Turn off autocomplete feature


<form autocomplete="off">

Or through jQuery



$(document).ready(function() {
 if($.browser.mozilla) $("form").attr("autocomplete", "off"); 
 }); 

AngularJS with C# MVC

The other day I tried using AngularJS with C# MVC to create this site.

SoundClip Creator

It was my first time using angularJs, here are some of the items I spent some time on

Here are some of the challenges I’ve faced

1) Creating a controller

Within asp.net, controllers need to belong to a module

This, will work

C#

<div ng-app='moduleng-controller="controller">
AngularJS
var ngModule = angular.module("module",[]);
 ngModule.controller("controller",
 function ($scope, $http)
 {...});

 

This, will not work

C#

<div ng-controller="controller">

AngularJS

function controller($scope){...}


 

2) Beware of version of MVC

Not all of them support posting using JSON natively

Symptom: Correct JSON strings are being sent, but in MVC controller all the arguments are null

Solution: Using MVC 2 Future Library

Or do what I did: use urlen encoding instead

StackOverflow Example

Make sure arguments match the argument names in the MVC controller

 var result = $http(
 { method: "post",
 headers: {'Content-Type':'application/x-www-form-urlencoded'},
 url: '/Home/Index/',
 transformRequest: function(obj) {
 var str=[];
 for (var p in obj)
 {str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));}
 return str.join("&");
 },
 data: {arg1: $scope.arg1,
        arg2: $scope.arg2
 });

 

3) Processing a file download

Since Ajax does not provide a good binary download support, I needed to create an extra Download action within the controller

MVC Download Action Explanation

//
// GET: /Home/Download
public ActionResult DownloadFile(string id)
{
var cd = new System.Net.Mime.ContentDisposition
{
// for example foo.bak
FileName = “generatedFile“,

// always prompt the user for downloading, set to true if you want
// the browser to try to show the file inline
Inline = false,
};
Response.AppendHeader(“Content-Disposition“, cd.ToString());
return File(new FileStream(Path.Combine(baseDirectory, id.ToString()), FileMode.Open), “MIME-String”);
}

See complete Mime Types here

AngularJS, on request.success

result.success(function (data)
{
var hrefDownload = ‘/Home/DownloadFile/‘ + data;
location.href = hrefDownload;
});