Web-Dev

Der har desværre været lidt stille herfra i alt for lang tid og det har desværre haft sine grunde - men nu skal der til at ske lidt mere (eller, det er i hvert fald intentionen ) og hvad er bedre end at lægge ud med både lidt alvor og lidt sjov, nemlig spillet Cut the Rope.

Det alvorlige
Det alvorlige eller spændende i det er, at det er det hidtil bedste eksempel jeg har set på HTML5 og JavaScript - vi taler altså ikke om at spillet er udviklet i Silverlight eller Flash men i ren HTML5 og JavaScript. Læser og hører man på Behind the scenes kan man godt se at det har været forbundet med visse udfordringer men det er jo netop dér der gør udvikling sjovt! Spillet er i øvrigt udviklet af Microsofts Internet Explorer-folk og der er brugt ca 15000 linjers JavScript - men mere tekniske vil jeg ikke komme ind på da Behind the scenes forklarer det hele meget godt.

Det sjove
Jah, der er ikke så meget andet at sige end; Prøv det - det er både sjovt udfordrende! Let the game begind!

Udover en browserversion findes spillet også både til Android, Ipad og Iphone.

(X)HTML, JavaScript

Selvom det ikke på nogen måde har været umuligt at lave hverken HTML5, XHTML5 eller CSS3 i Visual Studio 2010 har der manglet både intellisense til og validering op imod de disse ting - men det kan løses med Web Standards Update, WSU, udvidelsen til Visual Studio 2010. Opdateringen er lavet ef Microsoft-folk med danskeren Mads Kristensen i spidsen men det er dog ikke en officiel Microsoft opdatering.

I HTML5 får vi nu blandt andet glæde af de nye tags relateret til video og audio ligesom også de nye input-typer som mail, url og date er med, kigger vi på CSS3 er det blandt andet værd at se at relativt almindelige ting som filter og behavior nu kan valideres ligesom der nu er intellisense på browser-specifikke ting som -ms-*, -moz-* og -webkit-*. Endelig får vi glæde af mulighederne inden for de nye javascript browser API's som fx geolocation og local storage.

Standarderne er endnu ikke på plads så selvom opdateringen til Visual Studio bestemt er et stort skridt skal vi nok også forvente at se nyere versioner af WSU.

Her kan du downloade Web Standards Update for Microsoft Visual Studio 2010 SP1.

(X)HTML, .NET, ASP.NET, CSS, JavaScript HTML5, XHTML5, CSS3, JavaScript

En udfordring rigtig mange webudviklere støder på, specielt efterhånden som flere og flere er gået over til AJAX-løsninger, er et ønske om at kunne resette et input felt at typen file, men som udgangspunkt er det ikke muligt at nulstille et file input element uden man benytter en reset-knap, som så til gengæld vil nulstille hele formen og det er langt fra altid ønskværdigt. Heldigvis findes der alternative måder at løse dette på, nemlig ved at replace elementet i DOM og det kan fx ske på følgende måde;

function ResetFileInput(elementId) {
  var oldInput = document.getElementById(elementId);
  var newInput = document.createElement("input");
  newInput.type = "file";
  newInput.id = oldInput.id;
  newInput.name = oldInput.name;
  newInput.className = oldInput.className;
  newInput.style.cssText = oldInput.style.cssText;
  oldInput.parentNode.replaceChild(newInput, oldInput);
}

Kalder man ovenståede javascript-funktion med id på sit file input element som parameter vil udfordringen være løst - her et lille eksempel;

<input type="file" id="uploadme" />
<a href="#" onclick="ResetFileInput('uploadme'); return false;">Nulstil</a>

Det vil med en løsning som ovenstående stadigvæk ikke være muligt at sætte value til en foruddefineret værdi - og heldigvis for det da det ville indebære en alvorlig sikkerhedsrisiko.

(X)HTML, JavaScript JavaScript, HTML, input