Mattepuffo.com

Necessità: mostrare i titoli degli utlimi articoli del mio blog (questo qua insomma) sul mio sito (MatteoFerrone.com).

Il sio è scritto in Asp.NET e C#, e oggi vi spiego come farlo.

Come al solito avremo bisogno di un pò di codice C# nel code-behind della pagina, e un pò di Asp.NET con i suoi controlli.

Cominciamo dalla prima parte:

public partial class Blog : System.Web.UI.Page
 {
  protected string title;
  protected string desc;

  protected void Page_Load(object sender, EventArgs e)
  {
   DataSet ds = new DataSet("rss");
   ds.ReadXml("http://www.mattepuffo.com/site/index.php?format=feed&type=rss");
   title = ds.Tables["item"].Rows[0]["title"] as string;
   desc = ds.Tables["item"].Rows[0]["description"] as string;
   rss.DataSource = ds.Tables["item"];
   rss.DataBind();
  }
 }

Le variabili protected (e non private perchè sennò non sarebbero raggiungibili sulla pagina) rappresentano i dati che vogliamo vedere: il titolo e la descrizione.

Sotto nel caricamento della pagina creiamo un DataSet dove immagazzinare i dati.

Torniamo a parlare un pò di Java (che purtroppo ho dovuto un pò tralasciare per poco tempo).

Oggi vediamo come poter disegnare un rettangolo con il mouse su un JPanel.

Inoltre dovrà implementare MouseListener e MouseMotionListener e i metodi derivati:

• mousePressed
• mouseDragged
• mouseReleased
• mouseClicked
• mouseEntered
• mouseExited
• mouseMoved

Gli ultimi 4 metodi però rimarrano vuoti perchè non ci serviranno.

Vediamo come strutturare il tutto:

public class FrameDraw extends JFrame {

  private JScrollPane scroll;
  private int width = (int) Toolkit.getDefaultToolkit().getScreenSize().getWidth(); // DIMENSIONE JPANEL
  private int height = (int) Toolkit.getDefaultToolkit().getScreenSize().getHeight(); // DIMENSIONE JPANEL

  public FrameDraw() {
   super("Draw panel");
   setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
   setLayout(new BorderLayout());
   ImagePanel panel = new ImagePanel();
   scroll = new JScrollPane(panel);
   add(scroll, BorderLayout.CENTER);
 }
// CLASSE PRIVATA JPANEL.
}

Questo è il JFrame principale; ImagePanel sarà il JPanel che andremo ad inserire come classe privata.

In questo articolo avevo spiegato come caricare un url in una WebView.

Tanto per rinfrescarci la memoria:

WebView wv = (WebView) findViewById(R.id.wv);
wv.getSettings().setJavaScriptEnabled(true);
wv.loadUrl("http://www.google.it");

Qui abilitiamo anche Javascirpt che a mio parere è fondamentale.

Sotto carichiamo un url.

Dopo una breve pasua dedicata a Windows 7 ricominciamo a programmare.

Oggi vediamo come leggere il wall di una pagina di Facebook direttamente nel nostro sito grazie a PHP.

Prima di tutto logghiamoci su Facebook e andiamo su una pagina di nstro interesse; ad esempio: https://www.facebook.com/pages/OranGenerationit/115811261782830.

Quello che ci servirà ' l'id numerico della pagina, l'ultima parte dell'url (quella in rosso).

Dopo di che andate sulla pagine di Graph Explorer (https://developers.facebook.com/tools/explorer?method=GET&path=826019355) pre vedere un esempio e vedere cosa effettivamente possiamo mostrare e cosa no.

Nella seconda casella di testo mettete il vostro id; nel mio caso diventa così: https://graph.facebook.com/115811261782830.

Poco più in alto cliccate su Get Access Token per avere il token di accesso.

Vi comparirà una finestra in cui dovete scegliere varie opzioni.

Una volta completato segnatevelo.

Tornando sulla pagine notate che c'è una area in cui vengono mostrati i dati in formato JSON, e a destra le varie cose che potete mostrare.

Ad esempio i feed; notate che cambia l'indirizzo anche nella casella che ora è diventata così: https://graph.facebook.com/115811261782830/feed.

Questo è il link che prendiamo come riferimento.

A questo punto create un file PHP dove leggere le info e mostrarle.

Explorer su Windows 7 si apre sempre sulla directory Raccolte.

Io sta cartella non la uso e manco mi serve, e mi ritrovo sempre a fare dei click più.

Per chi vuole ho scoperto che è possibile, in maniera semplice, cambiare questo comportamento.

Andate su Start -> Tutti i programmi -> Accessori.

Su Esplora risorse cliccate col tasto destro -> Proprietà.

Su Windows XP per impostare l'autologin ero solito usare Tweak UI.

Da quanto ho capito per Windows 7 non esiste.

La soluzione migliore che ho trovato è quella di modificate il registro di sistema.

Andate su Start -> Esegui e scrivete regedit.

Si aprirà l'editor del registro di sistema.

Ora andate in HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Winlogon.

A volte è più comodo mettere Goole Maps dentro una finestra modale, soprattutto quando in una stessa pagina ci stanno diverse mappe.

Di come usare GMaps con Javascript ne ho parlato in questo articolo.

Partiamo da li con qualche modifica.

Preparate una pagina php (o in altro linguaggio lato server; ci serve per raccogliare i parametri passati in GET dalla pagina principale):

<!DOCTYPE html>
<html>
 <head>
 <title></title>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 <style type="text/css">
 #tooltip {
 color: black;
 font-family: Arial;
 }

 #tooltip a {
 color: blue;
 text-decoration: underline;
 }
 </style>
 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&language=it"></script>
 <script type="text/javascript" src="/site/gmap.js"></script>
 </head>
 <body onload="maps(, );"> // PURTROPPO NON SI LEGGE CHE C'E DENTRO ALLE PARENTESI
 <div id="map_canvas" style="width: 590px; height: 590px;"></div>
 </body>
</html>
<blockquote></blockquote>

Purtroppo non si vede che c'è dentro maps(); in pratica dovete fare echo delle due variabili passate in GET (echo $_GET['lat'], echo $_GET['lng']).

Ho messo un evento onload dentro al body in modo da caricare la pagine con latitudine e longitudine che gli passeremo dalla pagina principale.

Così facendo possiamo usare sempre lo stesso file senza crearne uno per ogni mappa.

Il file map.js sarà una cosa del genere:

function maps(lat, lng) {
 var latlng = new google.maps.LatLng(lat, lng);
 var myOptions = {
 zoom: 13,
 center: latlng,
 mapTypeId: google.maps.MapTypeId.ROADMAP
 };
 var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
 var marker = new google.maps.Marker({
 position: latlng,
 map: map
 });
 var tooltip = '<div id="tooltip">'+
 '<a href="http://maps.google.it/maps?q="'+lat+','+lng+'" target="_blank">Indicazioni stradali</a>' +
 '</div>';
 var infowindow = new google.maps.InfoWindow({
 content: tooltip
 });
 google.maps.event.addListener(marker, 'click', function() {
 infowindow.open(map,marker);
 });
}

Come vedete adesso latitudine e longitudine sono parametrizzati.

A questo punto dobbiamo creare la pagina che richiamerà la finestra modale con la roba sopra caricata al suo interno.

Per la finestra modale ho scelto di usare il plugin per jQuery Thickbox.

Potete scaricare il tutto da qua.

Quindi prima di tutto includiamo ciò che ci serve nella pagina:

<link type="text/css" rel="stylesheet" href="/site/thickbox.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="/site/thickbox.js"></script>

A questo siamo pronti per il setup della pagina:

<a href="#TB_inlinemodalContent?height=600&width=600&inlineId=cimoda" class="thickbox">CIMODA</a>
<div id="cimoda" style="display:none;">
 <iframe width="590" height="590" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" 
 src="http://www.sito.it/map.php?lat=41.9053328&lng=12.5554597"></iframe>
</div>

Il click sul link attiva il plugin e la finestra modale.

In questi giorni di vacanza ho ripreso un pò in mano l'Objective-C.

Non per iPhone o iPad, ma per un piccolo programmino per Mac (anche se poi le cose sono abbastanza intercambiabili).

Quello che vediamo è come impostare lo sfondo di una NSImage prendendo l'immagine dal web.

Quindi, alla vostra interfaccia aggiungete un oggetto NSImage e poi collegatelo:

// AppDelegate.h
#import <Cocoa/Cocoa.h>

@interface AppDelegate : NSObject <NSApplicationDelegate> {
  IBOutlet NSImageCell *myImage;
}

@property (assign) IBOutlet NSWindow *window;

@end

Come vedete l'oggetto da linkare, per essere precisi, è NSImageCell.

Invece in Interface Builder dovete trascinare un oggetto Image Well (che poi creerà anche l'oggetto Image Cell al suo interno).

Qui avevo parlato di come trasformare il risultato di una query in formato JSON.

Da qualche parte si presume ci sia un client che voglia vedere il risultato della query, e non in formato JSON.

I tipi di client possono essere i più vari, e scritti in diversi linguaggi.

Se vogliamo fare la decodifica in PHP possiamo farlo in maniera molto semplice.

Ripartiamo dalla parte server:

<?php

$host = "localhost";
$user = "user";
$pass = "pwd";
$db = "library";
$conn = mysqli_connect($host, $user, $pass, $db) or die(mysqli_connect_error());
if (mysqli_connect_errno()) {
  echo "Connessione fallita: " . die(mysqli_connect_error());
}
$result = mysqli_query($conn, "SELECT * FROM book");
$rows = array();
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
  $rows[] = array(
     'title' => $row['title'],
     'author' => $row['author'],
     'editor' => $row['editor']
 );
}
echo json_encode($rows);
mysqli_free_result($result);
mysqli_close($conn);

Mi sono imbattuto per caso in questo ottimo programma e penso che rientrerà tra i mai più senza.

Il programma si chiama Converseen ed è disponibile sia per Linux che per Windows.

E' scritto in C++ con le librerie grafiche Qt, e si basa sulla mitica suite Imagemagick.

Quindi è potenzialmente compilabile senza troppi problema anche sul Mac.

Detto ciò, quest'ottimo programma è in grado di convertire parecchie immagini contemporaneamente in molti formati.