blog.sketchit.de Glaubt mir ich hab den Weihnachtsmann mit eigenen Augen gesehen…

13Feb/100

LiveLoops in Pure Data

Here is a little loop-generator in pure data. Supports 4 tracks.

Click "rec" to record a sound from your build-in microphone. If a certain level of loudness is reached, recording starts. Usefull for live dj performances.

Click to download: LiveLoops

29Dez/091

ToneMatrix – Webcam Object Tracking

During our subject Interface Culture we (Matthias Schmidt, Bettina Steger and my humble self) were working on a project that uses hand-drawn objects on a white paper for making music.

Note: You have to allow the webcam!

Hold a white paper with black (or dark) objects that you painted on it in front of the camera. The red rectangle indicates the tracked area, the green rectangles indicates the tracked objects. Then hit the space-bar (Note: be sure that the flash movie gets the focus)

Check it out!

The flash-app uses the webcam for accessing three different videos. The normal video that we convert into two other videos: A threshold video and a palette video.

The palette video is used for tracking the brightest area in the video and reducing the tracking-area to this area (e.g. the white paper is usual the brightest color in the video, so objects that are in the background aren't tracked any longer). The threshold video is used for tracking the darkest objects within the brightest area.

How does this work? In the treshold video it is supposed that the red pixels are the objects, and coherent pixels belongs to one object. I've implemented a flood fill algorithm that counts the pixel of each object and returns the x,y position and width and height of an object. With this information we can nearly perfectly track the object and use for example the pixelamount for the volume of the sound and the x,y/width,height information for the timeline.

When all objects are tracked and you press the Space-Bar the tracked area is converted into a matrix of 16x16 fields. Each field represents a sound, fields that are lower plays a lower sound, fields that are higher a higher one. The timeline goes from left to right.

The source code is available here: ToneMatrixSource

29Dez/090

QuadTrees Actionscript 3

Note: Hence, I write my articles in english (and I'm glad if you notice any mistake and send it to me).

In our course Computergraphics I've developed an implementation of QuadTrees for Actionscript 3. A QuadTree is a datastructure for increasing the efficiency of collisiondetection or nearest neighbour appointment.

Wiki

You can enable the collisiondetection by hitting a "C" and switch between QuadTree and Bruteforce by hitting Space. The amount of objects can be changed by typing it in the field labeled with 50.
SourceCode: QuadTreeSource

This movie requires Flash Player 9

10Dez/097

Flex mit Ruby on Rails + authlogic authenitifizieren

Bei meinem aktuellen Rails Projekt loggen sich die Benutzer per authlogic auf der Seite ein, alles über Rails. Da jedoch ein Teil der Seite mit einer Flex App realisiert wird, musste ich das Zusammenspiel zwischen Rails und Flex ein wenig erforschen.

Mein erster Blick fiel auf WebORB mit dem passenden Flex Plugin indem man sehr einfach die einzelnen Modells und somit die Datenbank ansprechen kann. (http://sujitreddyg.wordpress.com/2009/10/13/ruby-on-rails-extension-for-flash-builder-4/)

Hier habe ich zwar Zugriff auf das UserSession-Modell von authlogic, jedoch nicht auf die aktuelle Session und somit die eingeloggten User. Die Cookies und Sessions werden erst im UserSessionsController festgelegt.

Um nun in der Flex Anwendung zu wissen "Ist der User eingeloggt" und wenn ja "Welcher User bist du denn?" erweitert man den UserSessions Controller um folgende Methode:

def checkLogin
if logged_in?
xml = "
<usersessions>
<login>true</login>
<currentid>#{current_user_session.user.id}</currentid>
</usersessions>"
else
xml = "
<usersessions>
<login>false</login>
<currentid>false</currentid>
</usersessions>"
end
respond_to do |format|
format.xml { render : xml => xml }
end
end

Hiermit stellen wir eine Methode bereit die uns ein XML File rendert das sagt, bin ich eingeloggt, oder nicht (über das Format der XML ließe sich streiten).

In der Flex App kreiert man nun einen HTTP-Service, der auf die URL der Methode verweist, und bei erfolgreichem Result das ganze als XML ausgibt.

<fx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
public function switchStates(event:ResultEvent):void {
var xml:XML = event.result as XML;
var loggedInP:Boolean = xml.login as Boolean;
var currentID:int = xml.currentid;
trace(currentID);
}
]]>
</fx:Script>

<fx:Declarations>
<s:HTTPService resultFormat="e4x" id="login" url="http://localhost:3000/user_sessions/checkLogin" result="switchStates(event)" fault="trace('fault');"/>
</fx:Declarations>

Natürlich muss im Application tag noch

creationComplete="login.send()

gesetzt werden. Und schon hat man zwei Variablen, die den User authentifizieren.

9Nov/090

Vision-based Page Segmentation (VIPS)

Die visuelle Programmiersprache VIPS dient dazu Programmabläufe in Form von Struktugrammen zu erstellen (es werden alle Kontrollstrukturen von Java unterstützt) und diese dann laufen zu lassen. Das Programm ist Plattformunabhängig, da in Java geschrieben, entspricht der DIN 66261 und komplett erscheint komplett auf deutsch. 2005 hat VIPS den ersten Platz bei der JavaStars (Sun Microsystems Award) belegt. Das Programm wurde für die Darstellung von Programmabläufen in der Informatik konzipiert oder auch für den Unterricht um beispielsweise Intervallschachtelung oder Wurzelberechnung graphisch darzustellen. Da jedoch neben den bekannten Kontrollstrukturen wie Schleifen oder Verzweigungen auch "professionelle" Features zur Verfügung stehen ist es auch möglich ganze Programme zu schreiben. Die wichtigsten hierbei wären wohl:

  • lokale und globale Variablen und Konstanten
  • Möglichkeit eigene Objekte zu erstellen
  • Rekursion
  • 5 Datentypen (Wahrheitswert, Zeichen, Zeichenkette, Ganzzahl, Gleitkommazahl)
  • Listen (Arrays)
  • Debugging
  • Export des Struktugramms als Grafik
  • eine große Bibliothek für mathematische Funktionen, Stringverarbeitung, Listen-Handling, einfach Grafikobjekte (Turtle-Grafik) und Ein- und Ausgabe

Um ein Programm mit VIPS zu erstellen, wählt man in der Navigationsleiste "Neues Projekt". Man kann innerhalb eines Projekts mehrere Struktugramme verwalten, die als Art Objekte dienen und von anderen Struktugrammen aufgerufen werden können. Auch kann jedes Struktugramm Paramter und Rückgabe Werte enthalten. Das Hauptprogramm ist immer als "main" betitelt. Um sein Programm nun zu strukturieren hat man neun verschiedene Möglichkeiten, die auch alle in Java als Schleifen, Verzweigungen oder ähnlichem enthalten sind:
Screen shot 2009-11-09 at 4.52.51 PM

6Nov/091

Gravata für Ruby on Rails

Hier gefunden: http://overhrd.com/?p=28

Um Gravatar für Ruby on Rails zu verwenden, ist lediglich eine kleine Methode im Application Helper nötig und deren Aufruf in der View.

application_helper.rb

require 'digest/md5'

  def gravatar_url_for(email, options = {})
    url_for({ :gravatar_id => Digest::MD5.hexdigest(email),
      :host => 'www.gravatar.com',
      :protocol => 'http://',
      :o nly_path => false,
      :controller => 'avatar.php'}.merge(options))
  end

View (z. B. index.html.erb)

# plain old gravatar url

<%= gravatar_url_for 'info@sketchit.de' %>

# gravatar url with a rating threshold

<%= gravatar_url_for 'info@sketchit.de', { :rating => 'R' } %>

# show the avatar

<%= image_tag(gravatar_url_for 'info@sketchit.de') %>

# show the avatar with size specified, in case it's served slowly

<%= image_tag(gravatar_url_for('info@sketchit.de'), { :width => 80, :height => 80 }) %>

# link the avatar to some/url

<%= link_to(image_tag(gravatar_url_for 'info@sketchit.de'), 'some/url')%>

Die oben definierte Methode nimmt die übergebene E-Mail Adresse, wandelt es in einen MD5 Hash um, baut daraus die URL von Gravatar zusammen (http://www.gravatar.com/avatar.php?gravatar_id=HASH_WERT) und liefert den Avatar zurück.

3Nov/090

Rock-Paper-Scissor: erstes iPhone Game


Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Warning: timezone_open() [function.timezone-open]: Unknown or bad timezone (Etc/GMT-1) in /home/www/web43/html/blog/wp-includes/functions.php on line 3875

Für unser Fach Mobile Applications hab ich gestern unser erstes kleines Projekt fertig gestellt, dass klassische "Schere-Stein-Papier", oder wie die Amys sagen würden "Rock-Paper-Scissor" (warum sind die Begriffe eigentlich verdreht? :-)
Die Syntax von Objectiv-C ist bisschen gewöhnungsbedürftig, aber im großen und ganzen schon zu handeln.
Hier mal ein paar Screenshots:

Und hier noch das gezippte XCode Project:

SchereSteinPapier iPhone XCode Project

31Okt/092

QuadTrees Implementierung für AS3, v0.1

Die erste Version der QuadTrees für AS3 läuft soweit. Objekte werden schon mal eingefügt, und der Tree selbst graphisch dargestellt. Beim Klick auf ein Quad werden alle zugehörigen Objekte markiert.
Grundlage für die nächste Version, Nearest Neighbour und Collision Detection.

QuadTrees v0.1

19Okt/091

Kleiner Chat in C (Socketprogrammierung mit UDP)

Hier mal ein kleines Beispiel, wie man per select() und dem UDP Protokoll sehr einfach einen Chat unter C erstellen kann.
Das Programm schaut zuerst, ob auf dem Port 5000 schon jemand lauscht, wenn nicht, wird der 5000er zum senden und der 5001 zum empfangen verwendet. Ist schon ein Chat aktiv, werden die Ports einfach umgedreht.

Der Rest ist normalerweise selbstklärend. Den Chat einfach im Terminal (unter OS X) starten, dann noch ein Terminal Fenster auf machen, auch hier den Chat starten, und schon funktionierts!
Hint:
- kompilieren per "g++ -o test main.c"
- aufruf per "./chat"
- (natürlich ohne die " " )

#include
#include
#include
#include
#include
#include
#include
#include
#include
#include 

#include
#include 

#include 

using namespace std;

void reportError(string str) {
	cout << endl << str << errno << endl;
}

int main(int argc, char* argv[])
{
	// set the variables
	int sock, bytes_recieved, bytes_send;
	int port1 = atoi("5000");
	int port2 = atoi("5001");
	char send_data [1024] , recv_data[1024];       

	struct sockaddr_in myAddr;
	struct sockaddr_in clientAddr;
	socklen_t sin_size;

	fd_set rfds;

	// create the udp socket
	if ((sock = socket(AF_INET, SOCK_DGRAM, 0)) == -1) {
		reportError("Cannot create send socket ....");
		exit(1);
	}

	myAddr.sin_family = AF_INET;
	myAddr.sin_port = htons(port1);
	myAddr.sin_addr.s_addr = inet_addr("127.0.0.1");

	if (bind(sock, (struct sockaddr *)&myAddr, sizeof(struct sockaddr))== -1) {
		myAddr.sin_family = AF_INET;
		myAddr.sin_port = htons(port2);
		myAddr.sin_addr.s_addr = inet_addr("127.0.0.1");

		clientAddr.sin_family = AF_INET;
		clientAddr.sin_port = htons(port1);
		clientAddr.sin_addr.s_addr = inet_addr("127.0.0.1");

		if(bind(sock, (struct sockaddr *)&myAddr, sizeof(struct sockaddr))== -1) {
			reportError("Unable to bind socket.");
			exit(1);
		}
	}
	else
	{
		clientAddr.sin_family = AF_INET;
		clientAddr.sin_port = htons(port2);
		clientAddr.sin_addr.s_addr = inet_addr("127.0.0.1");
	}

	cout << "Wait for data, or type something!" << endl;

	// process incoming connections (forever) ....
	while(1){
		sin_size = sizeof(struct sockaddr_in);

		FD_ZERO(&rfds);
		FD_SET(sock, &rfds);
		FD_SET(0, &rfds);

		select(sock + 1, &rfds, NULL, NULL, NULL);

		if(FD_ISSET(sock, &rfds))
		{
			// receive the reply from the client
			bytes_recieved = recvfrom(sock, recv_data, 1024,0, (struct sockaddr*)&myAddr, &sin_size);

			// client wants the leave, so do we
			if (strcmp(recv_data , "q") == 0 || strcmp(recv_data , "Q") == 0) {
				close(sock);
				break;
			}
			else if(bytes_recieved == -1)
			{
				reportError("recvfrom failed.");
				exit(1);
			} else {
				recv_data[bytes_recieved] = '\0';
				cout << " " << recv_data << endl;
			}
		}
		else if(FD_ISSET(0, &rfds))
		{
			gets(send_data);

			if (strcmp(send_data , "q") != 0 && strcmp(send_data , "Q") != 0) {
				bytes_send = sendto(sock, send_data, 1024, 0, (struct sockaddr*)&clientAddr, sizeof(struct sockaddr));

				if(bytes_send == -1)
				{
					reportError("Error sending data.");
					exit(1);
				}
			}
			else
			{
				close(sock);
				break;
			}
		}
	}

	close(sock);

	return 0;
}

Hoffe jemanden bringts was!

6Okt/092

AppleScript: MP3′s automatisch einsortieren

Ich habe nun endlich den Anfang gemacht meine doch schon recht große Sammlung an MP3's zu sortieren (schwierig und langwieriges Unterfangen, fehlende ID3 Tags, keine Alben oder ähnliches...).

Bei der Suche nach einem passenden Programm bin ich schnell darauf gekommen, dass zumindest die von mir gewünschte Grundstruktur kein einziges Programm zufriedenstellend bewerkstelligen kann (Interpret - Interpret/Album - Titel). Darum hab ich mich entschlossen, das Ganze im Finder per Hand zu sortieren. Und da sind wir auch schon bei der Problematik:

Um zumindest einmal grob zu sortieren, wollte ich automatisch alle MP3's eines Interpreters in dessen Ordner schieben. Die Ordner von Hand anzulegen, sehr langwierig. Darum hab ich mich hingesetzt und ein kleines aber feines AppleScript geschrieben.

Das Skript nimmt die gerade im Finder selektierten Dateien, prüft ob ein "-" (Bindestrich) als Trennung zwischen Interpret und Titel vorhanden ist (wenn nicht, kann man einen eigenen definieren) und filtert darauf hin den Interpreten Namen heraus, der wiederrum als Ordnername dient.

tell application "Finder"

set fileList to selection
set currentDir to the folder of item 1 of fileList as text
set targetDirTMP to the name of item 1 of fileList

set endCount to offset of "-" in targetDirTMP

if endCount = 0 then
display dialog "No delemiter found, specify a custom one, or click Cancel." default answer "" with icon 2
set delimiter to text returned of result
if delimiter is "" then error
set endCount to offset of delimiter in targetDirTMP
end if

set checkSpace to characters (endCount - 1) thru (endCount - 1) of targetDirTMP

if " " is in checkSpace then
set removeRight to 2
else
set removeRight to 1
end if

set targetDir to (text items 1 thru (endCount - removeRight) of targetDirTMP) as text

if not (exists folder (currentDir & targetDir)) then
make new folder at currentDir with properties {name:targetDir}
move fileList to (currentDir & targetDir)
else
display dialog "The folder already exists. Would you like to merge the data?" buttons {"Cancel", "Yes"}
if button returned of result = "Yes" then
move fileList to (currentDir & targetDir)
end if
end if

end tell

Zur Installation einfach Code in den AppleScript Editor ziehen, eine APP daraus speichern, und per Drag&Drop in die obere Leiste des Finders ziehen.

Oder ihr ladet euch meine hier runter