Har precis lagt till en kundarea för de av våra kunder som köper hosting-tjänster. Där kan de själva lägga till och tabort e-postadresser och forwards. För att gränssnittet skulle bli väldigt lättarbetat så valde jag att arbeta mycket med ajax och jQuery. Så pass mycket att jag byggde en plugin.

 

Enkelmedia -kundarea

 

Saken är den att jag upptäckte att jag ofta ville göra saker som hade det här flödet:

Visa en dialogruta med formulär ----> Skicka en formuläret med ajax ----> Visa svar från server

Exempel på saker som skulle göras:

  • Visa dialogruta för att lägga till ny adress
  • Visa diaglogruta för att ändra lösenord
  • Visa dialogruta för att bekräfta borttagning

 

Alla dessa följer samma mönster, så jag insåg att jag borde jag göra en jQuery plugin istället för att skriva samma infrastrukturkod flera gånger (DRY - Don't repeat yourself).

Resultatet har jag lagt upp på github: https://github.com/enkelmedia/jQueryAjaxDialog

 

En enkel och anpassningsbar plugin som visar dialogrutan och hanterar allt med postning av själva formuläret. Allt man behöver göra är att returnera ett JSON-objekt som innehåller egenskaperna "message" (string) och "success" (bool) så sköter min plugin resten.

Jag har precis börjat arbeta med en kund som har väldigt mycket bilder i sin media section, det är ganska få mappar med väldigt många filer i varje mapp. Bilderna används på olika artiklar i content trädet och väljs med umbracos inbyggda media picker.

 

Media -picker -simple

 

Problemet med denna picker är att man endast kan välja bild, vilket gjorde att min kund tidigare var tvungen att först gå in i media-sektionen och ladda upp bilder för att sedan gå till artikeln och välja den nya bilden (och leta som en galning ibland alla filer).

 

Jag tittade på olika lösningar på problemet en av dem skulle vara att installera DAMP-paketet som är en riktigt bra media picker, men efter ett tips från @Brannmark insåg jag att lösningen kan vara betydligt enklare än så. Det går nämligen att sätta umbracos inbyggda media picker i "advanced mode".

 

Media -picker -changedatatype

 

Gör så här:

1. Gå till developer-sektionen och välj "Media Picker" i listan över Data Types.
2. Klicka i "Show preview" och "Show advanced dialog".

2.2 Om du vill att vissa ställen har den "enkla" media pickern kan du bara skapa en ny Data Type av typen Media Picker och då ha två media pickers i listan. Högerklicka bara på "Data Types"-mappen och klicka på add.

 

Det här blir resultatet

 

Media -picker -advance

Idag var jag på jakt efter ett bra verktyg för att snabt kolla http-headers, självklart hade Fiddler varit ett perfekt alternativ men datorn jag satt på hade det inte installerat och jag orkade inte krångla med it-folket.

Därför hittade jag det här simpla verktyget: http://tools.seobook.com/server-header-checker/

 

Hur smidigt som helst!

 

Seobook

Det var i mitten av april som jag fick kontakt med Patrik och Peter på PNP Rederi i Linköping. De behövde hjälp att skapa ett bokningssystem och en fräch hemsida för deras nystartade rederi. Bokningssystemet behövde lanseras redan i början/mitten av maj då deras resor på Göta Kanal skulle dra igång.

Nu har vi också lanserat deras nya publika webbsida, resultatet blev följande sida som är byggd i Umbraco CMS.

Layout: Daniel Berglund
Projektledning/utveckling: Markus Johansson

 

Pnp1

Startsidan med puffar och aktuella kryssningar

 

Pnp2
Bokningssidan med responsivt gränssnitt som direkt summerar priser osv. Byggt med KnockoutJS

 

Pnp3

Karta till Berg med båtens färdväg utmarkerad

Jag har länge varit på jakt efter ett verktyg för att modellera system, skapa flödesdiagram, konceptuella modeller, användardiagram osv. Det har varit ett tufft jobb, jag är uppriktigt förvånad över hur dåliga och krångliga många av de program som jag har testar var - och ännu mer förvånad över vad som blev min slutsats. Ett av mina störta krav är att det ska producera snygga och stilrena diagram som man kan visa för kunden - tydligen inget enkelt krav att tillgodose.

 

Smartdraw

 

Uml -smartdraw

 

Många på Stackoverflow rekommenderade verktyget Smartdraw (http://www.smartdraw.com/). Jag har testat det en aning, det är ett väldigt brett program som kan användas till i stort sätt allt. Jag tycker dock att de missat några fundamentala saker som att själv kunna skapa och spara formateringar, om jag till exempel vill ha en tonad bakgrund till ljusblå så måste jag klicka ca 6 gånger per objekt för att åstadkomma detta, för att inte tala om när man associerar objekt och programmet helt plötsligt tappar kontrollen på dessa och vissa objekt bara försvinner från arbetsytan.
Min slutsats: För ostabilt och för krångligt att skapa egna stilmallar.

 

Microsoft Visio

 

Uml -visio

 

Enligt vad jag har förstått så är detta projektledarens bästa vän, men jag tycker ändå att Visio är krångligt. Diagrammen blir fulare än med Smartdraw, det är nästan lika krångligt att styla dem men på plussidan kan man ändå sätta att associationerna funkar bättre och objekten försvinner inte helt plötsligt.
Min slutsats: Stabilare än Smartdraw, men fulare diagram

 

Gliffy (online)

 

Uml -gliffy

 

När jag googlade efter bra desktopprogram så fick jag upp denna sida där man kan skapa sina diagram online.  Jag tänkte först "inte en chans att det kan funka" men faktum är att Gliffy (http://www.gliffy.com) är den editor som jag gillar bäst. Ett enkelt klick för att ändra stilen på objekten, associationerna är enkla att koppla och allt ser supersnyggt ut. Om man ska via på nackdelar så har inte Gliffy lika många typer av diagram editorn är mest fokuserad på mjukvara och på webmockups - vilket passar mig perfekt. Jag kan också bjuda in mina kunder att arbeta med diagrammen direkt i webbläsaren vilket är lite sexigt. Ett konto kostar 5 dollar i månaden och just nu känns det helt klart värt det.

Min slutsats: Jag jobbar med web och mjukvara - denna editor är optimerad för detta. Tackar.