Archive for February, 2010

Flot – a plotting library for jQuery

After some research for a jquery library to present some charts on a website I found this one.It is very configurable and also looks good.
Just set your datapoints and fire Flot up.

1
2
3
4
5
6
$(function () {
    // a null signifies separate line segments
    var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];
   
    $.plot($("#placeholder"), [d3]);
});

Here is a shot of a sample graph:

Flot Samplegraph

You can get this great plugin at the Flot-Projectsite

UIActionSheet with dynamic entries

Sometimes you want to present some options to the user that come from a dynamic datasource.In other cases you could use an UITableView, but if you need to show a modal dialog, you can just use UIActionSheet

Here comes the sample code to build it:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
UIActionSheet *viewSetMenu = [[UIActionSheet alloc]
initWithTitle: @"Select a news-page"
delegate:self
cancelButtonTitle:nil
destructiveButtonTitle:nil
otherButtonTitles:nil];

//dynamic build of buttons
//you could loop over an array
[viewSetMenu addButtonWithTitle:@"Google News"];
[viewSetMenu addButtonWithTitle:@"NTV"];
[viewSetMenu addButtonWithTitle:@"BBC"];
[viewSetMenu addButtonWithTitle:@"Cancel"];

//set index for destructive and cancel button (in the set of dynamic buttons)

[viewSetMenu setDestructiveButtonIndex:0];
[viewSetMenu setCancelButtonIndex:3];

//to avoid blocking at bottom from the tabbar,
//we should not add the sheet to a child of the tabbar

[viewSetMenu showInView:self.tabBarController.view];

thanks to Forward Echo for their hint in case you use a TabBar

Wordpress Post-Kalender mit Fullcalendar und jQuery

Das Fullcalendar-Plugin für jQuery ist ein voll konfigurierbarer Kalender mit Schnittstellen für den Abruf von Daten von einem Server.
Ausserdem können Events von einem bstehenden Google-Kalender abgefragt werde.,
Im einem meiner letzten Projekte, habe ich nach einer Alternative zum WP Kalender-Widget gesucht.Dabei bin ich auf dieses Plugin gestossen.

Die Abfrage der Daten erfolgt im JSON-Format.
Hier der PHP-Teil um die Event-Objekte zu erstellen und an den Kalender zu schicken:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
/**
* wp-posts.php to deliver json objects
*/


$posts = get_posts('');
$eventArr = array();

foreach($posts as $post) {

//build event object
$event = new stdClass();
$event->id = $post->ID;
$event->title = $post->post_title;
$event->start = date("Y-m-d",strtotime($post->post_date));
$event->comments = $post->comment_count;
$event->url = get_permalink($post->ID);
$event->allDay = false;

$eventArr[] = $event;
}

echo json_encode($eventArr);

Der Code für die Anzeige im Browser ist sehr kurz und simpel:

1
2
3
4
5
6
7
8
$(document).ready(function() {
 $('#fullcalendar').fullCalendar({
  editable: true,
  aspectRatio: 2,
  timeFormat: '',
  events: "/wp-posts.php"
 });
});

Bei Bedarf kann man natürlich auch weitere Datenquellen einbinden und z.B. eigene Veranstaltungen eintragen.

Das Ergebnis sieht man hier: http://www.es-dev.de/wp-cal.php

Das Modul gibt es hier:

http://arshaw.com/fullcalendar/