C'est ma minute groupie.
Le collectif QUBO GAS produit des petites merveilles de poésie sous flash.
Leur dernière newsletter présente une production pour le musée d'Art Moderne Lille métropole
PaperMoon

PaperMoon

Il ya aussi HULLABALOO

HULLABALOO

À quelques jours d'intervalle sont parues dans deux blogs de mon every day liste des images à qui—a posteriori—j'ai trouvé un air de famille :

• 

  quasimondo

• 

  szymonroginski

• 

  Anatoly Zenkov

• 

  Adaptive Subdivision

  Quasimondo manipule ses photos en Flash: automatic subdivision based on details in the underlying image. Areas with more detail get divided in smaller pieces. Voir Adaptive Subdivision

• 

  Photographie sculptée

  C'est une série mode pour la collection O Mia O Printemps été 2009 de Ania Kuczynska. Les photos du shoot ont été transformées en objet 3d, et le résultat photographié.
  Via today and tomorrow

• 

  Persistent Pyramids

  Via today and tomorrow

Un filon à exploiter dans mes études de transformation d'image ? Ici on est toujours à l'intérieur du cadre, mais on sent qu'on pourrait en sortir …

En lisant l'article au sujet de l'avenir des moteurs de recherche d'Aymeric Jacquet—qui trouve que la meilleure recherche est celle du type twitter(alors que je n'ai pas encore réussi à saisir l'utilité de ce truc…)—la petite phrase sur le filtrage des résultats tirés de wikipedia et commentcamarche m'a fait tilter.
Moi aussi ça me gêne.

J'ai donc utilisé un bookmarklet appelé avec un mot-clé d'une lettre genre g par exemple. Donc : javascript:void(str=prompt("Recherche%20filtr%C3%A9e:",""));if(str){location.href="http://www.google.com/search?q="+str+"+-site%3Acommentcamarche.net+-site%3Awikipedia.org";}

Et voila, yapluka !

Je me demande pourquoi il est si compliqué d'obtenir une information utilisable quand aux agendas de l'art contemporain en régions.
Quand on trouve une info c'est par hasard, elles est souvnet parcellaire et jamais où on la cherche.

Après plus d'un an passé à Nantes, exemple flagrant de sérendipité, un hasard de surf m'offre via cit*vo* un lien vers un agenda de l'art contemporain à Nantes

Las, je ne suis pas au bout de mes peines, même si tous les lieux et expos sont recencés, il faut sde lancer à une véritable course au click pour espérer accéder à la totalité des infos.

D'un ctrl+U rageur, l'écœurement me gagne: me voila face à une belle soupe de balises.

Voila une belle occasion d'apprendre à me servir des regex, merci le memo regex du site du zéro !

Sans plus attendre vous pouvez trouver la liste de tous les évenements de l'art contemporain dans le 44 sur une page .
Les infos viennent toutes du site MANIFESTEMENT PEINT VITE.

Autre précision : ce code n'a pas été testé dans internet explorer et ne le sera pas !
Pour une utilisation optimale de la page, je vous conseille fortement d'utiliser firefox ou safari ou chrome.

Quand on est webdesigner, arrive toujours le moment fatidique où pour la bonne cause on se retrouve embarquée dans l'aventure associative.
Premier satellite est à fond dans la régate, tout le monde cherche des sponsors, il faut rassembler les troupes, les documents et les photos. En avant pour un mini-site communautaire.
Ayant déjà un peu patouillé avec CakePhp, c'est l'occasion d'y plonger encore plus.

Les fonctionnalités du site :

1. Un calendrier éditable
2. Upload de photos
3. Édition d'articles
4. Création/ gestion des équipages
5. Création / édition des profils utilisateurs
6. édition des résultats par équipage
7. Récupération de la météo et de la marée en fonction du lieu de navigation
8. Gestion des droits d'utilisateur : admin, entraineur, équipier, visiteur

Détails techniques

Le site étant destiné à une communauté assez réduite, je choisi d'utiliser html5 et css3 pour réduire le temps de codage du layout et avoir un look and feel agréable.

Les améliorations de fonctionalité reposent assez souvent sur jquery et ajax.

Récupération des données météo et marées

Windguru

Le site prévoit l'utilisation de ses données à condition de s'inscrire et d'utiliser leur propre script.
Ça fonctionne parfaitement mais le code retourné n'est pas valide html5.
html purifier pèse 4Mo et je n'arrive pas à le faire marcher.
Bonne occasion de me plonger sérieusement dans les regex et de mitonner une petite moulinette qui me servira aussi pour le contenu du shom.

Le Shom

Tous les sites qui publient des infos sur la marée récupère leur données via le site du Shom. Il faut demander une autorisation de publication pour reprendre leur données.

Je choisi d'utiliser cUrl pour récupérer les hauteurs d'eau et coeff.

la moulinette pour obtenir un code html valide :

/**
@function process_output

@param string           s     the string to be processed
*/
function process_output($s){
	$stripAttr = array('border="0"', 'hspace="0"', 'vspace="0"');
	
	$s = filtre_html($s);
	$data = explode("\n", $s);
	foreach ($data as $line){
		$line = str_replace('>', ">\t", $line);
		$lines = explode ("\t", $line);
		foreach ($lines as $tag){
			if(preg_match('#<(table|tr|th|td)[ ]+(.+)>#Ui', $tag) > 0) {
				tidy_table ($tag);
			}
			elseif(preg_match('##Ui', $tag) > 0){
				$tag = str_replace ($stripAttr, '', $tag);
					$tag = str_replace ('src="wg_images/', 'src="'.$imgDir.'/wg_images/',$tag)
				echo $tag;
			}			
			else{
				echo $tag;
			}
		}
	}	
}

function filtre_html($s) {
	$s = str_replace("\r\n","",$s);
	$s = str_replace("\n","",$s);
	$s = str_replace("","\n",$s);
	$s = str_replace("","\n",$s);
	return($s);
}

function tidy_table ($data){
	$s = preg_replace_callback('#<([a-z]+)[ ]+(.+)>#i', 'process', $data);
	// we fetch tag name (1°parenthese) and tag content (2° parenthèse)
	echo $s."\n";	
}

function process($matches){
	$deprecTags = array('bgcolor','cellspacing', 'cellpadding');
	$replacTags = array('background-color', 'border-spacing', 'padding');
	$attrOk = array('colspan', 'rowspan');
	$noTags = array('cellpadding=0', 'cellspacing=0','cellpadding="0"', 'cellspacing="0"', 'align=center');
	$new = str_replace($noTags, '', $matches[2]).' ';
	$s = '';
	$attrs = '';
	$style = '';
	if(preg_match_all('#([a-z]+)\s?={1}["]?(\#?[0-9A-F%px]+)["]?\s+#Ui', $new, $attr)){

	// we fetch each couple (attribute) = (value)
		$c = count($attr[0]);
		for ($i=0; $i < $c; $i++){
			if (!in_array($attr[1][$i],$attrOk)){
				if (stripos($attr[1][$i], 'bgcolor') !== false && strlen($attr[2][$i]<7)){
					// fill in with 0 to have complete 6digit color string
					$attr[2][$i] .= '0000';
					$attr[2][$i] = substr($attr[2][$i], 0, 7);
				}
				$s .= $attr[1][$i].': '.$attr[2][$i].'; ';
			}
			else{
				$attrs .= ' '.$attr[1][$i].'="'.$attr[2][$i].'"';
			}
		}
		$style = ($s != '') ? ' style="'.$s.'"' : $style;
		$new = '<'.$matches[1].strtolower($attrs.$style).'>';
		$new = str_replace($deprecTags, $replacTags, $new);
	}
	else{
		$new = '<'.$matches[1].' '.$new.'>';
	}

	return $new;

}
	

Gestion du calendrier

Il existe un plugin cakePhp basé sur fullcalendar : Event.
La doc est accessible ici : arshaw.com/fullcalendar/docs/, voir aussi la liste de discussion.

Le calendrier n'étant éditable que par l'entraineur, j'intègre le script dans admin_index au lieu de index.ctp.
Je veux aussi avoir les samedi et dimanches sur la même ligne et afficher la description :

$(document).ready(function() {
	$('#calendar').fullCalendar({
	// ....
		firstDay: 1,
	// ....
		eventDrop: function(event) {	
		var dt = new Date(event.start);   
		// change for formatDate function
		var newdate = $.fullCalendar.formatDate( dt, "yyyy-MM-dd");	   
		var edt = new Date(event.end);
		var enddate =  $.fullCalendar.formatDate( edt, "yyyy-MM-dd");
		//.........
		}
		eventRender: function(event, element){
		element.append(''+event.description+"")
		},		
	

Je veux aussi pouvoir éditer in-place les events en cliquant sur la case du jour :

	dayClick: function(date, allDay, jsEvent, view) {
		var ndt = $.fullCalendar.formatDate( date, "yyyy-MM-dd");
		$('#overlayer').load("url(array('controller'=>'events','action'=>'add','admin'=>true)); ?>/startdate:"+ndt) ;	
		}	
	

Voila, ça suffit pour cette fois !
La suite une autre fois.