How to add entities to XSLT templates

When you work with XSLT you sometimes need special characters like “«” and “»”. You can define “entities” which can then be used in the document. Here is how:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE xsl:stylesheet [
  <!ENTITY laquo "&#171;">
  <!ENTITY raquo "&#187;">
  <!ENTITY hellip "&#8230;">
]>
<xsl:stylesheet…

You add the lines marked above. They defined a relation between a entity name and a character code. For instance the “laquo” will make it possibel for you to use « when inserting a “«”.

HTML Entities codes

The website “entitycode.com” has a very nice structured overview of HTML Entities Codes. You can see the relation between characters, their entity name, the decimal code and a short description of the character. They are very well organised in categories, go and see it for your self…

Did you remember to exclude namespaces from output?

When you work with XSLT, transforming XML to for instance the web in some CMS system, you might use some extra namespaces. Perhaps the CMS offers you some utilitiy namespace to handle relevant datastructure or procedures. You add them to your XSLT but perhaps you forgot to tell the XSLT processor not to add the namespaces to the output? Well I do some times…

Namespaces in a XSLT template

Adding namespaces to get extra features in your XSLT templates is easy. You may or may not think about it, but you will allways add at least one namespace “xsl”. Using Microsoft Visual Studio and selecting “New XSLT…” you will probertly also get a MS namespace like this: “msxsl”. I all happens in the beging of the template like this:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:msxsl="urn:schemas-microsoft-com:xslt"
  exclude-result-prefixes="msxsl "
  xmlns:cs="urn:custom-cs"
>

In the above example there are three namespaces:

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt"
xmlns:cs="urn:custom-cs"

The first one “xsl” is telling the XSLT processor that we are using XSLT and that the we will be using the XSLT rules defined in 1999 by w3.org.

The next one “msxsl” addes MS custom features and will give you some nice new features, for instance functions to format dates (ms:format-date Function).

The last one I use for adding custom C# code in my XSLT. That is a very powerfull way of extending the XSLT processor with your own custom .NET code. But please take care when doing that!

Removing the namespace from the output

If you use custom namespaces you may end up with the namespaces added to the output elements. In the above code you may observe that there is an attribute “exclude-result-prefixes” on the xsl:stylesheet tag. It is used to tell the XSLT processor which namespaces should not be added to the output elements. I have added “msxsl” but not “cs”. I the example I use XSLT in Dynamicweb CMS to generate HTML, so I may get output looking like this:

<ul xmlns:cs="urn:custom-cs">

That is not what I wanted! To remove the “cs” namespace I simply need to modify the xsl:stylesheet attribute “exclude-result-prefix” to:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:msxsl="urn:schemas-microsoft-com:xslt"
  exclude-result-prefixes="msxsl cs"
  xmlns:cs="urn:custom-cs"
>

I have added the “cs” namespace, so I will now get a tag without the “cs” namespace in my HTML.

Extend Object with method that handles CSS values in javascript

If you are working with CSS and need to for instance add or subtract a value to a CSS value like “15px” or “3em” this method “getCSSValueAndUnit()” will come in handy.

Simply add the code somewhere in the top to extend the “Object” object.

The method is used as follows:

"10px".getCSSValueAndUnit();

which will return an object:

{ 'value':10, 'unit':'px' }

Simple but very usefull!

Object.prototype.getCSSValueAndUnit = function() {
  var oReUnit = new RegExp('[0123456789\.-]', 'ig');
  var sOriginal = this.toString();
  var sUnitRaw = sOriginal.replace(oReUnit, '')
  var sUnit = sUnitRaw.replace(new RegExp(' ', 'ig'), '');
  var vValue = parseFloat(sOriginal.replace(sUnitRaw,''));
  return {'value':vValue, 'unit':sUnit};
}

Gratis online undervisnings programmer til skolebørn og forældre

Om det er fordi du er ambitiøs eller du bare hellere vil have at dit bare leger og lærer (noget fornuftigt), så har mange af os forældre til skolebørn godt af at besøge træneren.emu.dk Det er uni-c der står for denne undervisningspotal, som i øvrigt hedder “EMU | Danmarks undervisningsportal.”

Jeg var så heldig at en forældre, i den 0. klasse som min datter går i, skaffede brochurer som blev stukket ned i sko-kassen. Vi havde på en læseaften kort tid inden talt om hvilke undervisningsportaler der var på nettet. Tak for det!

Søgemuligheder og filtrering er rigtig god.

Jeg synes at spil er rigtig nemme at finde. De mange spil kan findes gennem en direkte søgning, valg af bestemte kategorier eller ved at filtrere f.eks. på sværhedsgrad. Det er også rart at der er en gennemført struktur, nærmest som når man shopper på nettet.

Iøvrigt er der også mulighed for at “rate” hvert enkelt spil – og det viser jo også hvordan et spil er blevet vurderet af brugerne.

Lad os kigge på et eksempel på et spil “Abc – Så ka’ du lær’ det”

Jeg har prøvet "Abc – Så ka’ du lær’ det" som er et visuelt spil som træner børn i at genkende bogstaver. Der er forskellige niveauer, fine visuelle effekter, en talende figur og en god speak på spillet. Jeg prøvede med min egen datter, men tidspunktet gjorde at hun nok var fyldt for idag. Lydene fangede alligevel kortvarigt hendes opmærksomhed. Jeg er sikker på at spillet på et andet tidspunkt havde fanget hende!

Hvis det er standarden for undervisningsspil på træneren.emu.dk så er jeg en glad forælder! Jeg må dog bemærke at det er lavet i Flash og at jeg ikke kunne spille det i Google Chrome (måske bare min installation). Det at man har valgt Flash forstår jeg godt, for det har jo indtil for nyligt været den eneste måde at lave den slags på. Lad os se om ikke der efterhånden kommer spil i HTML5 (så også iPad kan anvendes til portalens spil).

Nogle af de gode features

Gratis programmer
Kører i din browser (hvis den kan afvikle flash)
Spil på dansk
Pædagogiske gode spil
Find det her: træneren.emu.dk

Screenshoots fra “Abc – Så ka’ du lær’ det”

YouTube som din video base, en rigtig god idé!

Kort om video på nettet

Hvis du har nogle videoer som du ønsker at dele med venner eller kunder så er YouTube bestemt et godt bud på et sted at gøre det. Du opnår mange gratis muligheder, og Google er jo bestemt ikke en dårlig “partner” på det felt!

Her er et par af de features som jeg mener er guld værd – og der er flere som ikke er nævnt!

Man kan se og uploade til YouTube på mange måder

Om du sidder med en iPad, en Windows baseret PC eller en Apple iOS computer så kan du uploade dine videoer til YouTube. Du kan navngive, beskrive, tagge og generelt kontrolere hvordan dine videoer skal fremstå på nettet. Dine videoer bliver søgbare, hvis du giver lov til det!, og de bliver relateret til lignende videoer.

Videoer fra YouTube kan afspilles på næsten alle devices, lige fra mobil, over “pads”, moderne TV’er (i stuen hos folk) eller på computere. Du skal ikke gøre noget for at konvertere til forskellige video formater – det sørger YouTube for. Dine venner kan synes om dem, gemme dem som deres favoritter eller dele dem f.eks. på Facebook.

Du kan få din egen video kanal, geotagge dem og se statistik over hvordan dine videoer er blevet anvendt, set eller delt. Hvilke type brugere og hvor kommer de fra? Hvor mange gange er din video blevet set, og så videre…

Du kan nemt dele dine videoer fra din hjemmeside, du kan e-maile den til venner eller kunder, alt sammen på dit eget sprog.

Jeg vil derfor anbefale at man får sig en konto på YouTube og bruger det til at gemme sine videoer – det er jo også en god måde at have backup i “skyen” af ens videoer. Se disse screenshoots fra min youtube konto (http://www.youtube.com/netsi64).

Screenshoots fra min konto

Når folk ser videoen

Her er et eksempel på en video jeg har lavet ved hjælp af min mobiltelefon og en app som kan optage “time-lapse” video. Time-lapse er hvor man tager et billede med et givet interval (f.eks. 1 sekund) og så afspiller det med 25 billeder i sekundet. Det giver en morsom effekt, her er det f.eks. en køretur til Aarhus fra Løgten – det tager så 0:21 minutter!!

Rediger oplysninger

Det er så simpelt som at klikke “Rediger oplysninger” og man er igang med at kunne redigere de oplysninger som hører til videoen. Det betyder f.eks. at du kan uploade først og tilføje relevante information senere.

Folk kan iøvrigt kommentere og rate dine videoer. Noget som ja, selvfølgelig er gratis.

Statistik/analytics

Der er ret professionelle statistiske oplysninger som kan være ret interessante at se. Google har styr på det og man føler sig rigtig godt dækket ind på det felt.

Mange andre muligheder

YouTube er udbredt og kendt af mange, selv TV-stationer viser klip derfra. Hvis du bruger YouTube professionelt er der også den fordel at mange CMS systemer integrerer godt til det, der er mange webudviklere som kan hjælpe dig og nettet bugner med gode vejledninger og råd til denne state of the art video tjenste.

Så jeg kan kun anbefale at du bruger denne fantastiske gratis service fra YouTube.

Iøvrigt…

Skulle du nu sidde og have fået lyst til at se ovennævnte video eksempel så kan du se den her – for Windows Live Writer, som jeg bruger til at blogge med, kan selvfølgelig indlejre videoer fra YouTube gennem et par klik! Smiley

Min Time-lapse video–indsat nemt og smertefrit via Windows Live Writer…

Relateret indhold

Video for everybody generator
Et rigtig godt gratis video konvertering program: Free Video Converter
Google YouTube player demo – hjælp til udviklere der ønsker at indsætte YouTube videoer i deres HTML.

www.netsi.dk

"The internet is just a layer on the real world" (don't forget that!)

Monthly Archives: January 2012