Tag Archives: Programming

Generating color palettes – based on the Fibonacci sequence

We are continuously facing with complicated mathematical concepts every day, even without knowing about their existence.

Just take a look at the range of IP addresses. In ideal case an IP address tends to be closer to another IP address even when adding some new addresses between, the concept of the Hilbert curve:

The previous theory is highly applicable from machine point of view, but there are also plenty of theories applicable from human point of view. Maybe the most famous is the Golden Ratio or Divine Proportion:

In mathematics and the arts, two quantities are in the golden ratio if the ratio of the sum of the quantities to the larger quantity is equal to the ratio of the larger quantity to the smaller one.

=====|===
  a    b

meaning, a+b is to a as a is to b. From the machine’s point of view, nothing particularly happens, it’s just a “constant” which values is 1.6180339887… (yes, with quotes, the value of this proportion is an irrational number therefore I’m not sure about using the term “constant” when talking about irrational numbers, if you think otherwise, leave a comment below). However this “constant” is really important when talking about beauty and perfection generally. It appears in everything which is aesthetic to us, humans:


1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, … as you may have already realized, the next number in this sequence should be 55+89=144. The numbers of the Fibonacci sequence, or the Fibonacci numbers. What could be so interesting in this sequence other than describing the growth of an idealized rabbit population?
If you don’t know yet, let me show you. Divide the current and the previous number of the Fibonacci sequence above, starting from the second element, repeating infinite times:

\frac{1}{1} =1\newline\newline \frac{2}{1}=2\newline\newline \frac{3}{2}=1.5\newline\newline \frac{5}{3}=1.66..\newline\newline \frac{8}{5}=1.6\newline\newline \frac{13}{8}=1.625\newline\newline \frac{21}{13}=1.615\newline\newline \frac{34}{21}=1.61904...

As you may have already discovered the results of these iterations are approaching to the value of the Golden Ratio (see above, it was: 1.6180339887…).

The question is appropriate: Is there any way to apply this abstract representation of the golden ration?

Let’s take a look at the hexadecimal representation of a color “from the web”, a0ff11. Each color consist of three components, the red: a0, the green: ff and the blue component: 11. The idea is very simple: increment every component by the elements of the Fibonacci sequence.

The implementation happened in JSP, because everyone needs to know JSP!!1 currently I’m advancing in JSP. 🙂
Nothing fancy just a simple opening page to gather the required parameters, like the base color, number of color in the palette and the component which have to be modified:

<html>
<head>
<title>Color Palette Generator</title>
</head>
<body>
	<form action="generator.jsp" method="get">
		<table>
			<tr>
				<td>Base color:</td><td><input name="baseColor" type="text" /></td>
			</tr>
			<tr>
				<td>Palette size:</td><td><input name="sequence" type="number" /></td>
			</tr>
			<tr valign=top>
				<td>Component to modify:</td><td>
				<input type="checkbox" name="red" value="r" />Red
				<br/>
				<input type="checkbox" name="green" value="g" />Green
				<br/>
				<input type="checkbox" name="blue" value="b" />Blue
				<br/>
				<input type="submit" value="Generate" />
				</td>
			</tr>
		</table>
	</form>
</body>
</html>

modifying only by blue component


click to enlarge

Now some green magic:

click to enlarge

…and some red:

click to enlarge

And finally some of the colors I picked up randomly, all three modified components are rendered at once:

#2d9b27


#412c84


#24577b


d5f800

The code itself is quite simple.

<%@ page language="java" import="java.awt.Color,java.util.*"%>
<%!/* Some members of the mighty Fibonacci sequence
	 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987
	 */
	// and some of them what I found useful:

	int fib[] = { 13, 21, 34, 55, 89, 144 };

	//int fib[] = new int[] { 2, 3, 5, 8, 13, 21, 34 };
	//int fib[] = new int[] { 5, 8, 13, 21, 34, 55, 89 };

	public ArrayList generatePalette(Color baseColor, int n, String modifier) {
		ArrayList<Color> colorVector = new ArrayList<Color>();
		colorVector.add(baseColor);
		Color tmp = baseColor;
		for (int i = 0; i < n; i++) {
			tmp = generateColor(tmp, fib[i % 6], modifier);
			colorVector.add(tmp);
		}
		return colorVector;
	}

	public Color generateColor(Color color, int delta, String modifier) {
		int r = -1;
		int g = -1;
		int b = -1;

		if (modifier.equals("r")) {
			r = add(color.getRed(), delta);
			g = color.getGreen();
			b = color.getBlue();
		} else if (modifier.equals("g")) {
			r = color.getRed();
			g = add(color.getGreen(), delta);
			b = color.getBlue();
		} else if (modifier.equals("b")) {
			r = color.getRed();
			g = color.getGreen();
			b = add(color.getBlue(), delta);
		}

		return new Color(r, g, b);
	}

	public String colorToStr(Color color) {
		String r = Integer.toHexString(color.getRed());
		String g = Integer.toHexString(color.getGreen());
		String b = Integer.toHexString(color.getBlue());
		r = r.length() < 2 ? "0" + r : r;
		g = g.length() < 2 ? "0" + g : g;
		b = b.length() < 2 ? "0" + b : b;
		return r + g + b;
	}

	// if > 255 restart from 0
	public int add(int old, int d) {
		if (old + d > 255)
			return old + d - 255;
		else
			return old + d;
	}%>
<%
	String baseColor = (String) request.getParameter("baseColor");
	int colorToInt = Integer.parseInt(baseColor, 16);
	Color newColor = new Color(colorToInt);
	String sequence = (String) request.getParameter("sequence");
	int times = Integer.parseInt(sequence);
	String[] modifiers = new String[3];
	modifiers[0] = (String) request.getParameter("red");
	modifiers[1] = (String) request.getParameter("green");
	modifiers[2] = (String) request.getParameter("blue");
%>
<html>
<head>
<title>Color Sequence Generator</title>
<link rel=stylesheet type="text/css" href="generator.css">
</head>
<body>
	<%
		for (int j = 0; j < modifiers.length; j++) {
			if (modifiers[j] == null)
				continue;
	%>
	<table class="main">
		<tr>
			<%
				ArrayList palette = generatePalette(newColor, times,
							modifiers[j]);
					for (int i = 0; i < palette.size(); i++) {
						String current = colorToStr((Color) palette.get(i));
			%>
			<td class="colorDiv" bgcolor="#<%=current%>"><font
				class="colorName">#<%=current%></font></td>
			<%
				}
			%>
		</tr>
	</table>
	<%
		}
	%>
</body>
</html>

Getting started with Unit Testing

In this post I’ll talk about the concepts and theory of Unit Testing, shortly after the way to implement them. If you were thinking that the “algebra and such as” isn’t part of the practical programming then you were wrong! In this field the set of keyword contains only 1 important element – assert – which either generates an exception or not. Or, more precisely: you have a Groupoid defined on YourClass with (YourClass, assert).
…search engines and tutorials are not the key elements of this game, you will rather use your natural logic. 😉

So, what is Unit Testing about? I could paste here some Wikipedia definition, and after reading it you could ask yourself: why to test some parts of my program once it’s debugged and works correctly.

Imagine the following situation: you have an open-source project – because you are cool -. It’s source code is quite big, consists from 100 unique classes and 1000 definitions and holds 10000 lines of code. As I said, its open source, what means today you’ll hack something on the getFeedProperties() item, tomorrow I’ll and after a week a third person.

After a month when you are starting to package your software you discover that something is wrong with the program. It’s working, but in a little different way. Actually it’s showing the Feed’s URL instead of their desired name (yeah, it’s probably a feed reader).

What will you do? Of course debug it! You assume that the bug appears in the nth class. After checking the formatting parameters, the string output, etc. you discover that everything is fine in this class. No problem, backtrack it, look at the n-1th class and increment you personal wastedTime variable with 1 :P. Unfortunately in the n-1th everything is okay, so wastedTime++, take a look to n-2th class. After k steps you will reach the last class in your debugging, and you will found out that the getFeedProperties() returns the desired object, but the object’s name field is set to the feed’s URL.
Conclusion: problem solved with time requirement of O(n-k), it’s linear, not bad!
Could be it better?

What happens if your project has built with Unit Testing? When a third person submits his own patch for something what breaks something else, your automated Unit Test will report if some method is working different then it’s expected. So, if I should define: Unit Testing is about defining the behavior of different parts in your program between the given circumstances.

Take a look to this pseudo code:

// from the feed reader messed up by a 3rd person
FeedProperty getFeedProperties() {
...
}
...
// from FeedReaderTest test class
...
Feed f = new Feed("http://planet.ubuntu.com/rss20.xml", ....);

void testGetFeedProperties() {
...
FeedProperty fp = f.getFeedProperties();
...
assert fp.getFeedName == "Ubuntu"
//an exception will be generated here, because the getFeedProperties placed wrong string into the "name" field of your "f" object. Your class is inconsistent. The bug is obviously here.
}

Time requirement: O(1), the bug were found by running the top of your Unit Testing class.

Any thoughts, comments, spams are welcome!

Building Qt Jambi 4.7 on Ubuntu 10.04

NOTE: This is an Ubuntu-only tutorial. Some parts of it may not work on other Linux distributions. For the general building documentation visit: http://qtjambi.sourceforge.net/development/building/.

Finally I’ve managed to compile the latest version of Qt-Jambi framework, here I’ll share with you my build-experiences and highlight the points where you can break something.
There is also a Building document on the official website of Qt-Jambi, what gives an overview about building on several platforms, here I’ll focus to Ubuntu 10.04.
Grab the latest version from git, because the development happens here. Type in Terminal:

git clone git://gitorious.org/qt-jambi/qtjambi-4_7.git

Important: always check it twice before cloning, there are more qt-jambi repositories hosted at http://qt.gitorious.org/, but with the given build dependencies just this one compiles – eventually the trolltech one if you compile it against system Qt.
The URL after gitorious.org/qt-jambi/ will be change from time-to-time, you can make sure that you have typed the right URL by navigating to the community git repository of Qt-Jambi, and copying the URL from Clone & push urls.

Assuming that you are using Ubuntu 10.04 so you don’t need the kde-phonon backend. The list of dependencies is:

  • For Qt-Jambi:
  • openjdk-6-jdk (or alternatively the sun-java-jdk)
    ant-optional
    ant
    libxext-dev
    libgstreamer-plugins-base0.10-dev
    libgstreamer0.10-dev
    build-essential
    chrpath
    libgtk2.0-dev
    libexpat1-dev
    libfontconfig1-dev
    libfreetype6-dev
    libpng12-dev
    libcups2-dev
    libgtk2.0-dev
    libssl-dev
    libasound2-dev
    libdbus-qt-1-dev

  • For Qt itself:
  • phonon-backend-gstreamer
    libqt4-dev
    libphonon-dev

    You can install these from synaptic or copy/paste to the Terminal:

    sudo apt-get install openjdk-6-jdk ant-optional ant libxext-dev libgstreamer-plugins-base0.10-dev libgstreamer0.10-dev build-essential chrpath libgtk2.0-dev libexpat1-dev libfontconfig1-dev libfreetype6-dev libpng12-dev libcups2-dev libgtk2.0-dev libssl-dev libasound2-dev libdbus-qt-1-dev phonon-backend-gstreamer libqt4-dev libphonon-dev

    After cloning the repository and downloading the build dependencies go to the root directory of the cloned repository.
    In the Terminal session where you have checked out the git clone type:

    cd qtjambi-4_7

    If you have installed the libqt4-dev through the package management system then you don’t need to change anything.
    If you have your own compiled version of Qt then modify the variables qt.libdir, qt.includedir, qt.pluginsdir in buildpath.properties according to your Qt installation.

    Modify the version.properties file according to your Qt version (take a look to aptitude show libqt4-dev).

    Add the following environment variables to your ~/.bashrc file:

    #QTDIR bin
    PATH=/usr/share/qt4/bin:$PATH
    export PATH

    #set for Qt home
    QTDIR=/usr/share/qt4
    export QTDIR

    #set for Qt Libraries, usually QTDIR/bin
    LD_LIBRARY_PATH=/usr/share/qt4/lib
    export LD_LIBRARY_PATH

    #set for Java home (the exact path depends on your Java version)
    JAVA_HOME=/usr/lib/jvm/java-6-sun-1.6.0.20
    export JAVA_HOME

    Restart the Terminal to apply the new environment variables, and in the directory qtjambi-4_7 type:
    ant all
    .

    When the build finished you can try running the Qt-Jambi demo program, by typing:

    java -cp "qtjambi-4.6.2.jar:qtjambi-linux32-gcc-4.6.2.jar:qtjambi-util-4.6.2.jar:qtjambi-examples-4.6.2.jar:qtjambi-designer-4.6.2.jar" com.trolltech.launcher.Launcher
    .
    If you have any questions or errors during the building, please drop a comment or take a look to #qtjambi IRC channel on irc.freenode.org.

    Happy hacking.

    YAMI stalled

    Hi!

    Just came back from Croatia/Njivice, it was fun and I’ll post some pictures here as soon as I can!

    http://yami.googlecode.com

    This is my first project in Java, started just for fun and to learn some advanced gui/jdbc programming.
    By default it’s a browser for MySQL databases, but I implemented a mysql-console-like interface for cmd lovers (You can see some screenshots on the site, or download it, checkout on svn, etc…).
    I planned to improve it by allowing the users to create/modify the existing databases/tables.
    Because I’m the only developer of this project (of course you can join at any time! ) it takes a lot of time to implement such things.
    Does it worth to continue with my plans and to improve this project?
    What do you think?

    YAMI Neutral Builds!

    I’ve just a found a great hosting service at http://www.heliohost.com and uploaded the first neutral build of YAMI. You can find the packages @ http://yami.heliohost.org/.
    After downloading just start with:

    java -jar yamiSVN181.jar

    Remember:In software development, a neutral build is a build that reflects the current state of the source code checked into the source code version control system by the developers, but without any developer-specific changes.