Back to the SSWF project home page

# Halk's System Temperature

Note — this is not part of the SSWF project, it is offered as a live sample to show that it is possible to use SSWF for real. Please don't ask for more. This already took me 1h to create and I won't spend any more time on it. Thank you.

Welcome on the Halk's system temperature page. I created this page to show a dynamic example usage of the SSWF tool. Here I generate a list of temperatures using the SMBus sensors (search for lm_sensors for Linux for more info). This list is transformed in a symbol with an X position equal to the input database line number and the Y position equal to the temperature on the line (which represents the temperature at a given hour). At this time this is very rough and the hours are not very well presented, but it still works and it shows me how my system temperature goes up during the day and down at night.

Halk's CPU0 Temperature
(Read from http://sswf.m2osw.com)

The following is a snap shot of the input database:

>     2003061017: CPU0="48.0" CPU1="34.0"
>     2003061018: CPU0="50.0" CPU1="36.0"
>     2003061019: CPU0="49.0" CPU1="35.0"
>     2003061020: CPU0="49.0" CPU1="35.0"
>     2003061021: CPU0="50.0" CPU1="36.0"
>     2003061022: CPU0="50.0" CPU1="35.0"
>     2003061023: CPU0="51.0" CPU1="36.0"
>     2003061100: CPU0="52.0" CPU1="37.0"

Notice how the temperature changes over time. Also, the CPU0 was used much much more than CPU1 for over 2 years (Linux 2.0 wasn't very good at using both processors...) and thus it gets much warmer than it's co-pilot!

Below is what I generate from the database so it is compatible with SSWF:

>     // encoding=ascii -- auto-generated SSWF file with CPU temps
>     points "cpu" {
>     1
>     ,37.0;
>     2
>     ,37.0;
>     3
>     ,36.0;
>     4
>     ,36.0;
>     5
>     ,35.0;
>     6
>     ,35.0;
>     7
>     ,35.0;
>     8
>     ,34.0;
>     9
>     ,34.0;
>     10
>     ,34.0;
>     };

I included only 10 points, but the real total is 24 * 7 (7 days worth of data). Note that the first line is 1 and thus the object created is offset by 1 horizontally. Also, the text tools I have (1) append text at the end and (2) parse text top to bottom. This means I get the temperatures left to right, but we want to present them right to left. Later we scale horizontally with -10. Similary, vertically, the largest values go down. We also want the highest temperature to show up at the top of our graph, not the bottom. Thus we scale the symbol vertically by -3. In both cases, we have to translate the object back to (0, 0) before to translate it were we want it to be (20, 20). Finally, to give the moving effect of the graph, we move the symbol to the left (substract a growing value). So we can see the current status, we pause at the end of the movie for 10 seconds. You can see all of this and also the graduation and the mask in the following code. The command line is included at the beginning. The CPU temperatures are saved in the temp-cpu.sswf file and this script is in temp-hour.sswf. The result is saved in temp-hour.swf and has a size of 280x340.

    /* Temperature Graphs */
    /* encoding="ascii" */
    /* command line:

    	sswf -o temp-hour.swf \
    		-Dscreen_width=280 -Dscreen_height=340 \
    		colors.sswf temp-cpu.sswf temp-hour.sswf

    */

    rectangle "screen" { 0, 0, screen_width, screen_height };

    /* different common fill & line styles */
    fill style "no_fill" {};
    line style "no_line" {};

    fill style "fill_green" { sswf.col.green };
    fill style "fill_red" { sswf.col.red };

    shape "cpu_area" {
    	rectangle { -1, -1, 24 * 7 + 2, 101 };

    	// CPU fill
    	fill style { color { 1.0, 0.0, 0.0, 0.1; }; };
    	points { 1, 0; };
    	cpu;
    	points { 24 * 7, 0; 1, 0; };

    	// when drawing the line we don't want to fill anything
    	no_fill;

    	// CPU line
    	line style { width: 3.0 / 20.0; sswf.col.red };
    	move: 1, 0;		// this is hidden by the rulers
    	cpu;

    	line style { width: 0.75 / 20.0; sswf.col.red; };
    	move: 6 * 4 + 1, 0;
    	points { 6 * 4 + 1, 100; };
    	move: 6 * 8 + 1, 0;
    	points { 6 * 8 + 1, 100; };
    	move: 6 * 12 + 1, 0;
    	points { 6 * 12 + 1, 100; };
    	move: 6 * 16 + 1, 0;
    	points { 6 * 16 + 1, 100; };
    	move: 6 * 20 + 1, 0;
    	points { 6 * 20 + 1, 100; };
    	move: 6 * 24 + 1, 0;
    	points { 6 * 24 + 1, 100; };

    	line style { width: 0.75 / 20.0; sswf.col.green; };
    	move: 6 * 1 + 1, 0;
    	points { 6 * 1 + 1, 100; };
    	move: 6 * 2 + 1, 0;
    	points { 6 * 2 + 1, 100; };
    	move: 6 * 3 + 1, 0;
    	points { 6 * 3 + 1, 100; };
    	move: 6 * 5 + 1, 0;
    	points { 6 * 5 + 1, 100; };
    	move: 6 * 6 + 1, 0;
    	points { 6 * 6 + 1, 100; };
    	move: 6 * 7 + 1, 0;
    	points { 6 * 7 + 1, 100; };
    	move: 6 * 9 + 1, 0;
    	points { 6 * 9 + 1, 100; };
    	move: 6 * 10 + 1, 0;
    	points { 6 * 10 + 1, 100; };
    	move: 6 * 11 + 1, 0;
    	points { 6 * 11 + 1, 100; };
    	move: 6 * 13 + 1, 0;
    	points { 6 * 13 + 1, 100; };
    	move: 6 * 14 + 1, 0;
    	points { 6 * 14 + 1, 100; };
    	move: 6 * 15 + 1, 0;
    	points { 6 * 15 + 1, 100; };
    	move: 6 * 17 + 1, 0;
    	points { 6 * 17 + 1, 100; };
    	move: 6 * 18 + 1, 0;
    	points { 6 * 18 + 1, 100; };
    	move: 6 * 19 + 1, 0;
    	points { 6 * 19 + 1, 100; };
    	move: 6 * 21 + 1, 0;
    	points { 6 * 21 + 1, 100; };
    	move: 6 * 22 + 1, 0;
    	points { 6 * 22 + 1, 100; };
    	move: 6 * 23 + 1, 0;
    	points { 6 * 23 + 1, 100; };
    	move: 6 * 25 + 1, 0;
    	points { 6 * 25 + 1, 100; };
    	move: 6 * 26 + 1, 0;
    	points { 6 * 26 + 1, 100; };
    	move: 6 * 27 + 1, 0;
    	points { 6 * 27 + 1, 100; };

    	no_line;
    	fill style { color { 0.0, 1.0, 1.0, 0.25; }; };
    	move: 1, 0;
    	points {
    		1, 100;
    		2, 100;
    		2, 0;
    		1, 0;
    	};
    };

    shape "rulers" {
    	rectangle { -1, -1, screen_width + 1, screen_height + 1 };
    	//fill style { sswf.col.yellow; };
    	fill style { sswf.col.white; };
    	move: 0, 0;
    	points {
    		screen_width, 0;
    		screen_width, screen_height;
    		0, screen_height;
    		0, 20;
    		20, 20;
    		20, screen_height - 20;
    		screen_width - 20, screen_height - 20;
    		screen_width - 20, 20;
    		0, 20;
    		0, 0;
    	};
    	no_fill;
    	line style { width: 3.0; sswf.col.black; };
    	move: 20, 20;
    	points { 20, screen_height - 15; };
    	move: 15, screen_height - 20;
    	points { screen_width - 20, screen_height - 20; };

    	middle = 20 + (screen_height - 40) / 2;
    	d10 = (screen_height - 40) / 10;		// 10 degrees increment

    	line style { width: 1.5; color { 0.0, 0.0, 0.0, 0.9 }; };
    	move: 15, middle;
    	points { screen_width - 20, middle; };

    	line style { width: 0.75; sswf.col.blue; };
    	move: 20, middle + d10 * 1;
    	points { screen_width - 20, middle + d10 * 1; };
    	move: 20, middle + d10 * 2;
    	points { screen_width - 20, middle + d10 * 2; };
    	move: 20, middle + d10 * 3;
    	points { screen_width - 20, middle + d10 * 3; };
    	move: 20, middle + d10 * 4;
    	points { screen_width - 20, middle + d10 * 4; };
    	move: 20, middle - d10 * 1;
    	points { screen_width - 20, middle - d10 * 1; };
    	move: 20, middle - d10 * 2;
    	points { screen_width - 20, middle - d10 * 2; };
    	move: 20, middle - d10 * 3;
    	points { screen_width - 20, middle - d10 * 3; };
    	move: 20, middle - d10 * 4;
    	points { screen_width - 20, middle - d10 * 4; };

    	line style { width: 0.2; sswf.col.grey4; };
    	move: 20, 20;
    	points { screen_width - 20, 20; screen_width - 20, screen_height - 20; };
    };

    sequence "main"
    {
    	frame_rate = 30;
    	screen;

    	set background color { sswf.col.white };

    	cpu_area;
    	rulers;

    	place object {
    		depth: 3;
    		obj: rulers;
    		matrix { translate: 0, 0; scale: 1, 1; };
    	};

    	place object {
    		depth: 2;
    		obj: cpu_area;
    		// we assume a maximum of 70C
    		matrix { translate: 20 + 24 * 7 * 10, 20 + 100 * 3; scale: -10, -3; };
    	};
    	show frame;

    	for(x = 5; x < 24 * 7 * 10 - 240 - 3 - 5; x + 5) {
    		place object {
    			depth: 2;
    			matrix { translate: 20 + 24 * 7 * 10 - x, 20 + 100 * 3; scale: -10, -3; };
    		};
    		show frame;
    	};

    	show frame { 30 * 10 - 1; };
    };

    // vim: ts=4

This page was last modified on <DATE>.

Copyright (c) 2003-2007 Made to Order Software Corp.