Posts by category: Tips and Tricks

by in / Tips and Tricks
No peoples think this is good

Utilizzare dotless con Visual Studio 2010

Dotless è il porting di Less un linguaggio dinamico che estende le funzionalità dei css aggiungendo variabili, spazi dei nomi, funzioni, etc. Possiamo creare stili annidati, riutilizzare caratteristiche comuni, definire i colori del nostro sito in un solo punto. Sarà un “compilatore” a generare per noi il css da inviare al browser.

dotless

La generazione dei css può avvenire sia lato client (tramite una libreria javascript), sia lato server tramite un compilatore oppure da C# tramite un’API, ma vediamo come utilizzare dotless con Visual Studio.

Passo 1 – Installare dotless

Per installare dotless dovete lanciare dalla Package Manager Console di Visual Studio 2010 il comando Install-Package dotless. Al termine dell’operazione avrete nella cartella packages della solution tutto quello che serve per cominciare.

Passo 2 – Creare un file .less

Aggiungete al progetto un nuovo file di tipo testo e rinominatelo con estensione .less, per agevolarvi nella compilazione della sintassi potete installare l’add-in LessExtension che potete trovare tramite NuGet. Scrivete qualche riga di codice in “linguaggio” less, magari copiandola dal sito.

Passo 3 – Scrivere un file batch che compili i file .less

Il listato sottostante permette di chiamare il compilatore dotless passando come argomenti la cartella dove trovare i file .less e la destinazione dei file css compilati. Se i file css risultassero vuoti saranno cancellati dall’ultima istruzione (utile se definite un file .less contenente solo variabili).

Passo 4 – Lanciare il batch in PreBuild

Per fare in modo che i file css siano generati prima dell’esecuzione del sito è necessario chiamare il file batch nell’evento Pre-Build del progetto. Andate quindi nella sezione “Build Events” delle proprietà del progetto e copiate il listato seguente nel campo Pre-build event command line.

Gli argomenti passati sono il percorso dove trovare il compilatore, la cartella dei file .less e la cartella di destinazione dei file css.

Conclusioni

Ci sono altri modi di utilizzare less, se utilizzate less.js come compilatore potete addirittura definire le proprietà degli stili richiamando funzioni javascript. Al momento ho preferito sfruttare less solo lato server per mantenere il client più leggero ed avere maggior controllo sui css generati.

 

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Importare i preferiti del Nokia E72 in Internet Explorer

Devo dire onestamente che il Nokia E72 ha rappresentato per me una grande rivoluzione nell’utilizzo di internet e nel modo di tenermi aggiornato sulle novità della programmazione e non solo. Con l’aiuto di Google Reader ora leggo comodamente i miei feed durante la giornata e salvo tra i preferiti le notizie più interessanti. Rimane da risolvere la scomodità di consultare poi le notizie salvate sul piccolo schermo… Da qui l’idea di realizzare un’applicazione che converta i preferiti salvati nel cellulare Nokia nei preferiti di Internet Explorer. Un’oretta e 50 righe di codice dopo ecco risolto brillantemente il problema!

Come procedere…

Per prima cosa è necessario configurare l’applicazione tramite gli appSettings del file App.config specificando nell’ordine la cartella di backup del cellulare, il nome della cartella nei preferiti di ie, la cartella dove salvare i bookmark del browser ed infine il nome del file che conterrà i bookmark.

Successivamente è necessario creare un backup del cellulare contenente solo i preferiti con la Nokia PC Suite salvando poi il file nella cartella precedentemente impostata nel file di configurazione.

nokia-backup
 

Poi bisogna eseguire il programma (vedi figura sottostante) cliccare su browse…, selezionare il file di backup e cliccare su Load.

nokia-favorites
 

A questo punto nella cartella che abbiamo impostato come destinazione dei preferiti troveremo il file con i bookmark da importare nel nostro browser.

Il programma lo potete scaricare da qui.

Nota: l’applicazione è stata realizzata per il modello E72 ma potrebbe essere utilizzata anche con altri modelli delle serie E ed N purché condividano lo stesso formato di backup.

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Configurare il database di BlogEngine.NET su Aruba

BlogEngine.NET viene distribuito con uno script di configurazione per creare il database su SQLServer con tabelle e dati di esempio. Come tutti oramai sanno Aruba utilizza uno schema diverso da dbo con nome uguale al nome del database per questo motivo è necessario creare nel db lo schema e poi inserire con un trova-sostituisci tale nome nello script di configurazione. A questo punto è però necessario dire al core di BlogEngine.NET di utilizzare il nuovo schema. BlogEngine.NET utilizza il prefisso “be_” per le tabelle del db, tale valore è modificabile da web.config e noi lo modificheremo in modo da aggiungere lo schema (MsSql00001 ad esempio):

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Le migliori shortcuts di Visual Studio 2008

Le shortcuts sono sicuramente la via più breve e semplice per migliorare la produttività. Ecco un elenco delle migliori tra quelle a disposizione con Visual Studio 2008:

  • [CTRL] + [SHIFT] + [B] -> esegue il build della solution
  • [CTRL] + [SHIFT] + [S] -> salva tutti i file aperti
  • [CTRL] + [I] -> attiva la funzione di ricerca incrementale. Dopo aver premuto tale combinazione digitare la chiave di ricerca ed una volta completata la chiave spostarsi in avanti sempre con CTRL + I ed indietro con CTRL + SHIFT + I
  • [F5] e [SHIFT] + [F5] -> il primo fa partire il debug l’altro lo interrompe
  • [SHIFT] + [F9] -> pone la variabile selezionata dal cursore sotto “Quick Watch”
  • [CTRL] + [SHIFT] + [Space] -> posizionandosi all’interno della chiamata di un metodo permette di vedere in un tooltip la lista di parametri richiesta dal metodo
  • [CTRL] + [.] -> apre la finestra smart tag utile in caso di inserimento di uno using per un tipo sconosciuto
  • ([CTRL] + [K]) + [F]-> esegue la formattazione della selezione corrente
  • ([CTRL] + [K]) + [C] e ([CTRL] + [K]) + [U] -> il primo commenta le righe selezionate, l’altro esegue l’operazione inversa
  • [ALT] + [SHIFT] + [Enter] -> attiva la modalità FULL SCREEN, ripremere la stessa combinazione di tasti per disattivare la modalità
  • ([CTRL] + [\]) + [D] -> apre la finestra Code Definition per il tipo sotto cursore
  • [CTRL] + [SHIFT] + [F] -> permette di eseguire la funzione di ricerca nei file del progetto
  • [SHIFT] + [Canc] -> cancella la riga corrente salvandola negli appunti
  • [CTRL] + [-] e [CTRL] + [SHIFT] + [-] -> sposta il cursore nella posizione successiva o precedente
  • [F12] -> esegue il “Go to definition”

Tra le più curiose ci sono invece:

  • [CTRL] + [ì] -> se mi posiziono su una parentesi di un blocco di codice ed eseguo questa combinazione di tasti il cursore si posiziona sull’altra parentesi che delimita il blocco
  • [CTRL] + [SHIFT] + [ì] -> se mi posiziono su una parentesi di un blocco di codice con questa combinazione seleziono tutto il blocco di codice
  • [CTRL] + []] -> seleziona il pezzo di codice compreso tra il cursore e l’ultima posizione di modifica
  • [CTRL] + [T] ->inverte le lettere ai lati del cursore

E se non ci bastano dalla finestra Tools > Options > Keyboard ne possiamo creare di nuove:

Shortcuts

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

DataGridView e TableAdapter: Update in-line e Performance Tip

Se dobbiamo sviluppare applicazioni Windows Form “quick and dirty” su basi di dati non troppo complesse, niente ereditarietà o self-relationship per intenderci, con il DataSet ed i TableAdapter possiamo soddisfare le nostre esigenze con un po’ di drag and drop ed alcuni click del mouse.

Update in-line

Tutto bello se non fosse che per quello che non ci viene dato in automatico dobbiamo sudare le famose 7 camicie. Mi è capitato recentemente di dover applicare ad una DataGridView collegata ad un DataSet la modifica in-line, ovvero il salvataggio dei dati all’uscita dalla cella. Dopo innumerevoli tentativi sono giunto alla seguente conclusione:

In pratica nell’handler dell’evento CellValueChanged del DataGridView procedo alla chiamata dei metodi EndEdit rispettivamente sulla DataGridView e sul BindingSource collegato in modo da propagare la modifica alla sorgente dati bindata alla griglia. Successivamente controllo se ci sono modifiche (può essere omesso visto lo scopo dell’evento scatenato) ed a quel punto chiamo il metodo Update del TableAdapter che procede alla persistenza dei dati sullo storage.

Performance tip

Lavorando con un insieme maggiore di record il TableAdapter soffre di un po’ di lentezza se gli passiamo nel metodo Update tutta la tabella. Per migliorare le performance possiamo utilizzare direttamente il DataAdapter, accessibile tramite la proprietà Adapter, al quale passiamo un dataset con le modifiche da persistere, ecco come fare:

Quando si lavora con il DataSet devono essere gestite opportunamente concorrenza e caricamento dei dati in modo da evitare perdita di informazioni ed un utilizzo pesante delle risorse. Nel primo caso la gestione viene definita tramite opportuna configurazione del TableAdapter, nel secondo caso è compito nostro implementare dei meccanismi di paginazione dei dati, ma questa è un’altra storia…

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Aprire un pdf in una determinata pagina

Può succedere a volte di voler linkare un argomento all’interno di un documento pdf. Se il documento ha molte pagine diventa difficile per l’utente trovare da solo le informazioni necessarie. Per questo motivo può essere utile aprire il documento nella pagina che contiene l’argomento interessato.
Per aprire un documento pdf in una determinata pagina dobbiamo aggiungere dopo il nome del file la stringa #page= seguita dal numero della pagina.
Ad esempio:

> HQL: The Hibernate Query Language

Con questo link siamo in grado di aprire la documentazione di NHibernate direttamente nel capitolo che parla del linguaggio HQL.

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Formattare un numero decimale

A volte capita di voler visualizzare solo n posti decimali per un valore numerico. E’ possibile utilizzare a questo scopo il metodo ToString(“Nx”) dove con x indichiamo il numero di decimali da visualizzare in output. Vediamo un esempio:

Come indicato nell’esempio il valore viene approssimato.

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Utilizzare SyntaxHighlighter nei post di BlogEngine.NET

Se vogliamo inserire dei code snippet all’interno dei nostri post tecnici e vogliamo che questi siano facilmente leggibili non possiamo fare a meno di un formattatore di codice ed in questi casi due sono gli approcci possibili: css o css+javascript.
Inizialmente per i post di questo blog facevo affidamento sul code formatter on-line di Manoli che effettua l’highlight delle parole chiave esclusivamente tramite i css. L’utilizzo dei soli css però, soprattutto se vogliamo visualizzare anche i numeri di riga, introduce una quantità spropositata di tag ed impedisce il copia/incolla del codice “pulito”.
Cercando sulla rete una valida alternativa a tale approccio mi sono imbattuto nella libreria SyntaxHighlighter.

SyntaxHighlighter è una libreria javascript “non intrusiva” che formatta il codice attraverso l’aggiunta di attributi class alle parole chiave in fase di caricamento del dom utilizzando le espressioni regolari.

Decido quindi di utilizzarla e seguo passo-passo le seguenti istruzioni:

  • Scarico da Google Code la versione 1.5.1 di SyntaxHighlighter
  • Salvo nella root del blog le cartelle Scripts e Styles
  • Modifico il site.master del mio tema inserendo nell’head i riferimenti seguenti:

  • Inserisco poi in fondo alla pagina master il seguente snippet javascript:

A questo punto decido di provare la libreria in un vecchio post nel quale avevo utilizzato del codice c#. Pulisco il pezzo di codice formattato con lo strumento precedente togliendo tutti i tag html e lo racchiudo in un tag <pre name=”code” class=”c-sharp”> come specificato dalle linee guida di SyntaxHighlighter.
Salvo e vado a vedere… il risultato: niente di niente, ovvero nessuna formattazione.

Osservando attentamente il codice html della pagina mi accorgo che il tag pre non ha più nè class nè name. Arrivo quindi alla conclusione che l’editor di BlogEngine.NET, il TinyMCE, pulisce il tag pre di tutti i suoi attributi prima di salvarlo.

Deciso a non mollare cerco di capire come aggirare il problema e trovo questo articolo che spiega brillantemente come utilizzare Syntax Highlighter con TinyMCE, ovvero modificando la funzione init dell’editor specificando quali sono i tag e i relativi attributi da considerare validi (e quindi da non rimuovere nel salvataggio).

In pratica vado nel controllo TinyMCE.ascx del BlogEngine.NET e modifco la proprietà extended_valid_elements della funzione init aggiungendo in fondo: pre[name|class].

And That’s all folks!

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

DotNetKicks button in BlogEngine.NET

Se vogliamo “farci prendere a calci” dai lettori del nostro blog ed inserire il pulsante di DotNetKicks in fondo ai nostri post tecnici dobbiamo modificare il controllo PostView.ascx del nostro tema. Il come è abbastanza semplice, è sufficiente inserire il seguente script:

Nota: In questo esempio ho inserito in modo statico il nome di dominio, ovviamente è possibile inserire il valore corretto prendendolo direttamente dalla Request, a voi la scelta.

/ Read Article /
by in / Tips and Tricks
No peoples think this is good

Track Active Item in Solution Explorer

Lavorando con MonoRail di Castle Project capita spesso di avere viste con lo stesso nome, specialmente quando sviluppiamo applicazioni data-centric. In Visual Studio questo può portare, soprattutto quando si hanno molte viste aperte, a non riconoscere subito il controller al quale fa riferimento la vista che stiamo modificando.

In questo caso ci viene in aiuto il Solution Explorer che evidenzia di volta in volta nell’albero il file aperto nella scheda corrente. Se questa funzionalità non dovesse essere attiva è sufficiente andare sotto Tools > Options > Projects And Solutions > General e mettere una spunta su Track Active Item in Solution Explorer come evidenziato nella figura qui sotto.

SolutionExplorerTrackItem

/ Read Article /