I’ve written a very simple ASCII table printer for python.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
def print_table(lines, separate_head=True):
"""Prints a formatted table given a 2 dimensional array"""
#Count the column width
widths = []
for line in lines:
for i,size in enumerate([len(x) for x in line]):
while i >= len(widths):
widths.append(0)
if size > widths[i]:
widths[i] = size
#Generate the format string to pad the columns
print_string = ""
for i,width in enumerate(widths):
print_string += "{" + str(i) + ":" + str(width) + "} | "
if (len(print_string) == 0):
return
print_string = print_string[:-3]
#Print the actual data
for i,line in enumerate(lines):
print(print_string.format(*line))
if (i == 0 and separate_head):
print("-"*(sum(widths)+3*(len(widths)-1)))
1
2
3
4
5
6
rows = []
rows.append(("Name", "Age", "Gender"))
rows.append(("Fred", "2", "Male"))
rows.append(("Amy", "90", "Female"))
rows.append(("Iguanas Are Lame", "97", "Male"))
print_table(rows)
1
2
3
4
5
Name | Age | Gender
-------------------------------
Fred | 2 | Male
Amy | 90 | Female
Iguanas Are Lame | 97 | Male
Lua: The One True Scripting Language
If you’ve read me previous post An Argument Against the Cascade then you know I don’t like scripting languages. Scripting languages are inherently slow and has caused the market to flood with inept programmers who can’t handle pointers or manage their own memeory. That being said, there are times when scripting lanauges are important.
For example: I plan to add an in-game console window to my current project (like hitting ~ in source games). If I want to allow for any sort of complex behavior then I will need a scripting language. The route that so many people seem to take is writing their own scripting language. This is a plague that has gone on for far too long. As much as I hate scripting languages, I hate having to know the syntax to 50 scripting languages more. Instead, I plan to use Lua.
Don’t get me wrong, I have my issues with Lua. In Lua arrays tend to be indexed starting at 1 instead of 0. Classes don’t really exist, but rather are tables inheriting from meta-tables. And finally, worst of all, its not Lisp! So why then should we be using Lua? Its simple really:
- Its under a BSD style license allowing it to be integrated into anything with almost no restrictions
- Intgrating it with C/C++ is a breeze through the use of oolua or luabind.
- If it can integrate with C/C++ it can integrate with almost anything else because most languages have bindings to C/C++
- Lua is tiny, allowing it to be used almost anywhere with no significant cost
To put in perspective how tiny Lua is, heres an excerpt from their website:
Adding Lua to an application does not bloat it. The tarball for Lua 5.2.1, which contains source code and documentation, takes 245K compressed and 960K uncompressed. The source contains around 20000 lines of C. Under Linux, the Lua interpreter built with all standard Lua libraries takes 182K and the Lua library takes 243K.
A perfect real-life example of how this change can help is through CMake and Premake. CMake is a build system that has its own scripting language. It is often criticized for its syntax. Here is a mailing list therad to show just how ugly the syntax is.
Premake is instead built on top of lua. This allows me to use any knowledge I already have about Lua (syntax, how to write functions, how to concatenate strings, variable types, …) and apply it to my build system. This allows you to create a make file using a clean syntax without having to learn yet-another-language. Right now premake has not caught up to cmake in terms of features (for example, it is missing CPack functionality), but I am willing to put up with that for a much cleaner syntax and more direct control. I’ve even been toying with the idea of implementing “prepack” to make up for that shortcoming next time I have some time.
One may wonder why I don’t simply advocate using Lisp as the one true language since it is the purest form of elegance and the best scripting language ever made. The simple answer is that it is not embeddedable. There are few projects trying to get it embeddable and those projects either have far too many issues or are under a virus license like the GPL.
An Argument Against the Cascade
What is happening to the world of great code? Has anyone else noticed a trend towards scripting languages? At work I had to switch from a Java platform (Java is already horrible) to Javascript. At my college (RPI) the early computer science courses are switching from C++ to Python. Looking at the web, the Javascript world exploded over the past few years (remember when all you did with javascript was form validation?). Don’t get me wrong, Scripting languages have their place. I simply feel that scripting languages are more and more getting used to write entire applications instead of allowing your application to be extensible.
One argument for the diminishing quality of code was dubbed the Cascade of Attention Deficit Teenagers. The idea behind this is that new teenagers are constantly discovering open source projects and rewriting the modules in it so no progress is made since everyone spends all their time re-implementing the same functionality. While this can be a problem, its important to remember that reinventing the wheel isn’t always a bad thing. One of my major projects are Intel last year got taken over by a new intern this summer. He took the entire code base (around 10,000 lines) and ripped it apart. Through this process he managed to find multiple bugs and clean up sections of code that hadn’t been touched in a year. He then was able to build upon the cleaner code base and significantly improve its functionality and add a user interface that completely changes how people interact with the program.
This experience has taught me two important things:
- Reinvent the wheel but don’t stop with a wheel, add something more to it.
- Get multiple hands on a project, chances are someone out there is better than you at some aspect of your code.
In regards to #2, I want to point out that simply getting multiple eyes on a project is not enough. People can find bugs and suggest areas that need improvement but you will need someone else to radically redesign your code in a paradigm you have not considered.
Finally, in regards to the script languages: stop. Scripting languages are meant for making your program extensible or for rapid prototyping. Once you move beyond that programmers need to ditch their fear of pointers and move onto C/C++.
Building a User Interface With Dart
Prerequisites
- A working knowledge of HTML
- Dart SDK
Compiling A Basic Example
First, to make sure you have Dart set up write the following into a text file and compile it
1
2
3
4
5
6
7
8
9
10
11
12
13
#library("main");
#import("dart:html");
#import("dart:json");
#import("dart:core");
void main()
{
try {
document.body.nodes.add(new Element.html("<p>Hello World!</p>"));
} catch (Exception ex) {
document.window.alert(ex.toString());
}
}
1
2
3
4
5
6
7
<html>
<head>
</head>
<body>
<script src="out.js"></script>
</body>
</html>
1
dart2js main.dart
dart2js should generate an out.js file. Opening index.html in your web browser should show “Hello World!”
Generating Nodes
There are two ways to generate HTML nodes for Dart.
1
DivElement nav_div = new Element.html("<div style=\"float:right; margin:0% 5%;\"></div>");
1
DivElement nav_div = new Element.tag("div");
Element.html() constructor allows for you to define a lot more information in a single call. Applying the changes to style that we just need would require additional calls using the Element.tag() constructor.
It is also possible to initialize child nodes using the Element.html() constructor
1
TableElement table = new Element.html("<table><tr><td>Row 0 Column 0</td><td>Row 0 Column 1</td></tr><tr><td>Row 1 Column 0</td><td>Row 1 Column 1</td></tr></table>");
table.nodes[0] would be the first row and table.nodes[1] would be the second row.
Adding Nodes
Dart uses a tree structure to represent HTML. By default you have document.body as the root node. If we added the previous table to the document body it would have a structure like this:
Finding Nodes
You can also locate HTML elements that already exist in your html. For example, if my HTML page was
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
<head>
</head>
<body>
<link rel="stylesheet" href="style.css">
<title>Title Here</title>
<div id="header" class="titlebar"></div>
<div id="container">
<div id="center" class="column"><div id="padded_center" style="padding-left:10px; padding-right:10px;"></div></div>
<div id="left" class="column side_nav_bar"></div>
</div>
<div id="footer"></div>
<script src="out.js"></script>
</body>
</html>
1
DivElement header = document.query("#header");
Portfolio Website in Google Dart
I recently re-wrote my entire portfolio website in Google Dart. Dart is a new programming language that is designed to replace javascript, although it also can run server-side allowing it to also replace technologies like PHP. Sadly, my web host doesn’t have Dart installed on their servers, so I was limited to just client-side code.
Since most browsers do not support Google Dart yet, Google Dart gets compiled into javascript through their compiler dartc frogc dart2js. This can then be run by any browser.
For this post I am not going to have any tutorials for using Dart; Those will follow later. Instead, I merely want to point out that my portfolio website is open source so feel free to browse through it and use the code to learn and build your own websites. I generate almost the entire website with Dart including managing browser history and asynchonously loading JSON data to populate fields. The code for my website is available at https://github.com/craftkiller/paphuscom.
Write Your Own Bitmaps
Bitmaps are quite possibly the simplest image format we use today. They are supported on every platform and in every browser. Bitmaps suffer from one major shortcoming: They are uncompressed. Thankfully harddrive space has never been cheaper, so if you want simple image writing in your program without having to link an image library like libwebp or libpng then writing your own bitmaps is the way to go.
In this post I will attempt to explain the bitmap format. I also have written all the code you need, which will can be downloaded here.
The Header
The bitmap header is so simple that you don’t need any structures to write it. Below is a breakdown of the bytes:
| Byte Range | Value | Explanation |
|---|---|---|
| 0 | 0x42 | ASCII for ‘B’ |
| 1 | 0x4D | ASCII for ‘M’ |
| 2-5 | File Size | This will be the full size of the file including the header, the pixel data, and all padding |
| 6-9 | 0x00000000 | This data is reserved but can just be set to 0 |
| 10-13 | Pixel Offset | This will be how many bytes are in the file before you get to the actual pixel data. In our header the value will be 54. |
| 14-17 | 40 | We’re going to be writing the BITMAPINFOHEADER header which has a size of 40 bytes |
| 18-21 | Pixel Width | The width of the image in pixels |
| 22-25 | Pixel Height | The height of the image in pixels |
| 26-27 | 1 | The number of color planes, must be set to 1 |
| 28-29 | 24 | The number of bits per pixel. For an RGB image with a single byte for each color channel the value would be 24 |
| 30-33 | 0 | Disable Compression |
| 34-37 | Size of raw pixel data | This will have the number of bytes in the pixel data section of the file (the part after the header). Since padding will be added to the rows you cannot simply multiple height * width * 24 and expect it to work |
| 38-41 | 2835 | This is the horizontal resolution. Just leave it at 2835. |
| 42-45 | 2835 | This is the vertical resolution. Just leave it at 2835. |
| 46-49 | 0 | The number of colors, leave at 0 to default to all colors |
| 50-53 | 0 | The important colors, leave at 0 to default to all colors |
As you can see from the table, our header consists of 54 bytes (byte 0 to 53). Now all we have left is the actual pixel data.
The Pixel Data
The pixel data has to be written with some minor modifications. First, the bottom row of the image appears first in the data. If you forget this step your image will be vertically flipped. Second, the pixes are written in BGR (blue - green - red) format, which is the opposite of the normal RGB. Finally, at the end of each row you must pad it with bytes till it is a multiple of 4.
Lets look at an example. Lets say I wanted to write a 2x2 image with the colors listed below:
| Red | Green |
|---|---|
| Blue | Purple |
I’d start with an empty data array. I must then start with the bottom row (blue, purple). I write the blue pixel first in BGR format which ends up with:
1
2
3
4
// Blue
// B G R
// |--------------|
unsigned char data[] = {0xFF, 0x00, 0x00};
1
2
3
4
// Blue Purple
// B G R B G R
// |--------------| |--------------|
unsigned char data[] = {0xFF, 0x00, 0x00, 0xFF, 0x00, 0xFF};
1
2
3
4
// Blue Purple
// B G R B G R Padding
// |--------------| |--------------| |--------|
unsigned char data[] = {0xFF, 0x00, 0x00, 0xFF, 0x00, 0xFF, 0x00, 0x00};
1
2
3
4
5
6
7
8
9
10
// Blue Purple
// B G R B G R Padding
// |--------------| |--------------| |--------|
unsigned char data[] = {0xFF, 0x00, 0x00, 0xFF, 0x00, 0xFF, 0x00, 0x00,
/* Red Green*/
/* B G R B G R Padding*/
/* |--------------| |--------------| |--------|*/
0x00, 0x00, 0xFF, 0x00, 0xFF, 0x00, 0x00, 0x00
};
I’ve uploaded code to handle the encoding of bitmaps for you. This code exposes a single function
1
size_t bitmap_encode_rgb(const uint8_t* rgb, int width, int height, uint8_t** output);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
#include <cinttypes>
#include <fstream>
size_t bitmap_encode_rgb(const uint8_t* rgb, int width, int height, uint8_t** output);
int main(int argc, char** argv)
{
// Red Green
// |---------------| |--------------|
uint8_t data[] = {0xFF, 0x00, 0x00, 0x00, 0xFF, 0x00,
0x00, 0x00, 0xFF, 0xFF, 0x00, 0xFF};
// |--------------| |--------------|
// Blue Purple
uint8_t* output;
size_t output_size = bitmap_encode_rgb(data, 2, 2, &output);
std::ofstream file_output;
file_output.open("output.bmp");
file_output.write((const char*)output, output_size);
file_output.close();
delete [] output;
return 0;
}
Download
The source code can be downloaded at http://static.paphus.com/blog/bitmap.tar.bz2. It uses C++11 features so you can compile it with this command:
1
$CXX -std=c++11 bitmap.cpp main.cpp
Introducing Octopress Blogging for Org-Mode
On an earlier post I described a method for exporting Emacs Org-Mode to Octopress. The main feature that simply exporting to HTML lacked was syntax highlighting. The method from my old post sadly was unreliable so I went back to the drawing boards and now I have a far better solution.
First you will need to set up Octopress Following their instructions. I find that after cloning their repository and entering it I have to run these commands:
1
2
3
4
5
6
7
8
9
#!/bin/sh
#
curl -L https://get.rvm.io | bash -s stable --ruby
source ~/.rvm/scripts/rvm
rvm install 1.9.2
rvm rubygems latest
gem install bundler
bundle install
rake install
save-then-publish function in our .emacs
1
2
3
4
5
(defun save-then-publish ()
(interactive)
(save-buffer)
(org-save-all-org-buffers)
(org-publish-current-project))
~/git/blog/ but if you store your blog elsewhere you will need to change paths.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
(setq org-publish-project-alist
'(("blog-org" . (:base-directory "~/git/blog/source/org_posts/"
:base-extension "org"
:publishing-directory "~/git/blog/source/_posts/"
:sub-superscript ""
:recursive t
:publishing-function org-publish-org-to-octopress
:headline-levels 4
:html-extension "markdown"
:octopress-extension "markdown"
:body-only t))
("blog-extra" . (:base-directory "~/git/blog/source/org_posts/"
:publishing-directory "~/git/blog/source/"
:base-extension "css\\|pdf\\|png\\|jpg\\|gif\\|svg"
:publishing-function org-publish-attachment
:recursive t
:author nil
))
("blog" . (:components ("blog-org" "blog-extra")))
))
Rakefile in the blog. Find your Misc Configs section and change new_post_ext, new_page_ext, and add org_posts_dir like I have below:
1
2
3
4
5
6
7
8
9
10
11
12
13
## -- Misc Configs -- ##
public_dir = "public" # compiled site directory
source_dir = "source" # source file directory
blog_index_dir = 'source' # directory for your blog's index page (if you put your index in source/blog/index.html, set this to 'source/blog')
deploy_dir = "_deploy" # deploy directory (for Github pages deployment)
stash_dir = "_stash" # directory to stash posts for speedy generation
posts_dir = "_posts" # directory for blog files
org_posts_dir = "org_posts"
themes_dir = ".themes" # directory for blog files
new_post_ext = "org" # default new post file extension when using the new_post task
new_page_ext = "org" # default new page file extension when using the new_page task
server_port = "4000" # port for preview server eg. localhost:4000
Rakefile so that the header of a new post gets wrapped in HTML tags. Find the section I have below and add the lines for BEGIN_HTML and END_HTML.
1
2
3
4
5
6
7
8
9
post.puts "#+BEGIN_HTML"
post.puts "---"
post.puts "layout: post"
post.puts "title: \"#{title.gsub(/&/,'&')}\""
post.puts "date: #{Time.now.strftime('%Y-%m-%d %H:%M')}"
post.puts "comments: true"
post.puts "categories: "
post.puts "---"
post.puts "#+END_HTML"
(require 'org-octopress). I cloned the repository in ~/git/ so in my emacs I added
1
2
(add-to-list 'load-path "~/git/orgmode-octopress")
(require 'org-octopress)
1
2
3
4
5
cd blog
rake "new_post[title]"
mv source/_posts/2012-08-01-title.org source/org_posts/
# I keep my posts in GIT so then I add it to the repo
git add source/org_posts/2012-08-01-title.org
M-x save-then-publish in Emacs and then go back to your shell and run rake gen_deploy. You should now have your post online.
The main feature that I added was the ability to have syntax highlighted blocks. Right now this will only work with all lower-case begin_src end_src blocks. It supports options for :title :url and :urltext. If you would like to see an example of this, the source code to this post is located at http://blog.paphus.com/org_posts/2012-08-01-introducing-octopress-blogging-for-org-mode.org. If anyone wants to help improve the exporter please join me on github!
Finally, You may want to edit your .htaccess file to redirect image requests. I redirected all SVG image requests to the root directory so perma-links dont fail to access the images. You want to locate the .htaccess file in the source directory
1
2
3
4
Options +FollowSymlinks
RewriteEngine on
RewriteBase /
RewriteRule /([^/]+)\.(svg)$ /$1.$2 [R,L]
Don’t Pollute the Global Namespace
As projects grow bigger, name collisions become a hazard. Back in the old C days they had a static keyword that would restrict access to the function or variable to the file it was created in. This made is unaccessible to extern and allowed global variables of the same name to exist in other files. This can be a slight bit confusing since static variables in C++ mean that the value of the variable persists through multiple function calls or through multiple instances of a class, but luckily the C-style static keyword is deprecated.
In C++ to restrict variables to only be accessible from within the current file you simply need to create an unnamed namespace. To demonstrate this I created a file named child.cpp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#include <iostream>
using namespace std;
namespace
{
void internal_function()
{
cout << "child: internal_function\n";
}
}
void external_function()
{
cout << "child: external_function\n";
internal_function();
}
internal_function() is only accessible from within child.cpp.
Now I can drive this function with a main.cpp which can have its own internal_function() without naming conflicts!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#include <iostream>
using namespace std;
void external_function();
void internal_function()
{
cout << "main: internal_function\n";
}
int main(int argc, char** argv)
{
internal_function();
external_function();
}
1
2
3
4
5
6
$ $CXX main.cpp child.cpp
$ ./a.out
main: internal_function
child: external_function
child: internal_function
$
child.cpp:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
#include <iostream>
using namespace std;
void internal_function()
{
cout << "child: internal_function\n";
}
void external_function()
{
cout << "child: external_function\n";
internal_function();
}
1
2
3
4
5
6
$ $CXX main.cpp child.cpp
~/AppData/Local/Temp/child-688096.o:fake:(.text+0x50): multiple definition of `internal_function()'
~/AppData/Local/Temp/main-688094.o:fake:(.text+0x50): first defined here
collect2: ld returned 1 exit status
clang++: error: linker (via gcc) command failed with exit code 1 (use -v to see invocation)
$
Double Colon and Accessing the Global Namespace
Recently I’ve been seeing a lot of code that accesses variables and functions that start with ::. I didn’t know what that meant, and information online seemed scant, so I decided to test it myself. Luckily, my first guess was right and it is a way to access the global namespace. One easy way to think about it is in Unix paths, if you start with a / it accesses the root the of the filesystem, whereas if you don’t then its a relative path starting from where you currently are in the folder structure.
To test this I created three files:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
#include <iostream>
#include "header.h"
using namespace std;
namespace a
{
void print_a()
{
cout << "a\n";
}
}
int main(int argc, char** argv)
{
a::print_a();
b::print_b_local();
b::print_b_global();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
#include <iostream>
#include "header.h"
using namespace std;
namespace b
{
void print_b_global()
{
cout << "b ";
::a::print_a();
}
void print_b_local()
{
cout << "b ";
a::print_a();
}
namespace a
{
void print_a()
{
cout << "b::a\n";
}
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
namespace a
{
void print_a();
}
namespace b
{
void print_b_global();
void print_b_local();
namespace a
{
void print_a();
}
}
1
2
3
4
5
6
$ $CXX a.cpp b.cpp
$ ./a.out
a
b b::a
b a
$
:: preceding the function name, the compiler will search the current namespace (think current directory). With the :: the compiler will jump to the global namespace (think / on a Unix system).
Tuple and Tie
I recently came across an interesting feature to C++11: std::tie. One of the features I love about python is that you are able to return multiple values from a function. These get returned in a structure called a “Tuple”. Here is a basic example of what I mean:
1
2
3
4
5
6
7
8
9
10
11
class rectangle:
def __init__(self, width, height):
self.width = width
self.height = height
def get_dimensions(self):
return self.width, self.height
r = rectangle(3,4)
w, h = r.get_dimensions()
print w,h
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
#include <iostream>
using std::cout;
class rectangle
{
public:
rectangle(int _width, int _height) : width(_width), height(_height) {}
int width, height;
void get_dimensions(int & _width, int & _height)
{
_width = width;
_height = height;
}
};
int main(int argc, char** argv)
{
rectangle r(3,4);
int w,h;
r.get_dimensions(w,h);
cout << w << ' ' << h << '\n';
return 0;
}
w and h are passed in like normal parameters with no indication to the user their real purpose.
Luckily C++11 has introduced tuple types and a way to return multiple values from a function. To use this all you need to do is return a tuple from a function, and then use std::tie to accept the return value. std::tie create its own tuple storing references to the variables it needs to throw the data into. Heres the same example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
#include <tuple>
#include <iostream>
using std::tuple;
using std::tie;
using std::make_tuple;
using std::cout;
class rectangle
{
public:
rectangle(int _width, int _height) : width(_width), height(_height) {}
int width, height;
tuple<int, int> get_dimensions() {return make_tuple(width, height);}
};
int main(int argc, char** argv)
{
rectangle r(3,4);
int w,h;
tie(w,h) = r.get_dimensions();
cout << w << ' ' << h << '\n';
return 0;
}
w and h are return values and not parameters. They even get returned with a call to return. In today’s age with our large code bases I think it is important that we make a move towards readability or we’ll never be able to maintain anything.