Ontwerp en bouw een werkstuk bestaande uit tien onderdelen in voorkomen, gebaseerd op tien verschillende web-gebaseerde technieken (zoals hier verder benoemd). Doe dit in een zo eenvoudig gestructureerde web-site. Bij de productie van jullie werkstuk moeten minstens drie verschillende methoden van programmeren zijn gebruikt (zoals hier verder benoemd).

Toelichting: Kies hiervoor een van de specifieke arrangementen bestaande uit drie verschillende opdrachten (één formule, één model en één complexe applet)

Toelichting: Maak daarbij gebruik van HTML en de hogere programmeertaal javascript, maar ook van onze speciale bibliotheek met Java-applets ('WebLib') en andere losse elementen van derden ('WebStuff' en/of 'SimLib'). Alle losse elementen, class-files en de libraries dienen op de juiste plaats, in jullie folder, op de TO-server te staan. Het moet - voor jezelf en voor ons - te downloaden zijn. Het werkstuk wordt pas later gepubliceerd op het world wide web.

Toelichting: Het werkstuk moet lokaal kunnen draaien en in de browser Netscape of in de browser Internet Explorer, vlekkenloos af te spelen zijn.

Toelichting: Het werkstuk moet niet teveel niet relevante toeters en bellen 'aan de buitenkant' te hebben. Dit practicum gaat immers over javascript. We beoordelen voornamelijk namelijk 'de binnenkant', de javascript-code (de source) en ook of het script - voor zo ver mogelijk - eigen werk is. Wij verwachten van ieder van jullie een iets andere oplossing dan uw collega-groepen. Als je dingen overneemt, neem dan vooral andere waarden, andere teksten, andere formules en andere modellen. Het moet er natuurlijk wel verzorgd uitzien.

Toelichting (aangaande technieken): We willen bij dit practicum een tiental technieken de revu laten passeren, t.w. varierend van het maken van een object, het aanroepen van een applet en het besturen van een beweging. (Zie elders op deze site: technieken om toe te passen.)

Toelichting (aangaande methoden): Aangezien jullie allemaal al voldoende kennis hebben gemaakt met auteurs-systemen en auteurs-talen (zoals HTML) zullen we ons voornamelijk beperken tot opdrachten te maken in hogere programmeertalen (javascript). HTML valt hier - naar onze mening - namelijk als auteurs-taal aan te merken. Wij willen dat je aangaande het programmeren in hogere programmeertalen (dus in javascript) daadwerkelijk een groot aantal verschillende soorten methoden van programmeren met programmeer-talen beheerst, zoals:

• methode a. van 'scratch' af (zonder dat er iets aan code is);
• methode b. met libraries (in de vorm van black-boxes);
• methode c. met libraries (in de vorm van glass-boxes);
• methode d. met gebruik making van een (bestaand) sjabloon;
• methode e. met gebruik making van een (bestaande) programma-source.
(Zie elders op deze site: methoden van programmeren.)

Het onderwerp

De doelgroep

De procedure

De opdracht wordt beoordeeld in twee rondes. In de eerste ronde dienen jullie op de dag van het 4e practicum jullie werkstuk - zoals het er dan uitziet - via teletop in te leveren (ook de deeltijders). Wij willen dat dat gedeelte één bestand (file) is. Daarna krijgen jullie dan z.s.m. commentaar op. In de tweede ronde - op de laatste dag van het practicum - dienen jullie het gehele werkstuk ter finale beoordeling voor te leggen. Daar dienen alle onderdelen - als een geheel - in het bijzijn van de docenten, te worden gedemonstreerd.

Toelichting eerste vijf opdrachten: In de eerste ronde (tussentijdse inlevering) moet je werkstuk bestaan uit een web-pagina met de volgende vijf van de tien specifieke technieken, t.w.:

• 1. een of meer formulieren (met buttons, functies en een bewerking);
• 2. een of meer standaard browser objecten en standaard javascript objecten;
• 3. een of meer eigengemaakte objecten;
• 4. een veld dat de output krijgt van een input-element (hier 'slider.class');
• 5. een button met een loop en een eenvoudig, bestaand (dynamisch) output-element (hier 'teller.class').

Toelichting tweede vijf opdrachten : In de tweede ronde voeg je aan dat zelfde werkstuk (met de eerste vijf onderdelen) nog vijf specifieke onderdelen toe, t.w.:

• 6. een model-driven grafische output element (zonder interactie);
• 7. een geluids-elementen;
• 8. een video-element;
• 9. een complexe applet (in een apart window);
• 10. een formula-driven animatie (met interactie).

De tien opdrachten / technieken

• Opdracht 1. Formulieren: een koppeltechniek tussen buttons en velden.
  • De pagina moet (minimaal) een formulier met (minimaal) een invoer-veld; (minimaal) een uitvoerveld en (minimaal) een knop (button) bevatten;
  • Maak iets dat - na het klikken op een knop en afhankelijk van de inhoud van de invoervelden - iets presenteert (genereert) in een uitvoer-veld;
  Toelichting: We willen dat je bij dit onderdeel iets dynamisch en interactiefs maakt, minstens bestaand uit bijvoorbeeld drie samenwerkende onderdelen van een formulier (forms): bijvoorbeeld twee 'invoervelden'; een 'uitvoerveld' en een knop ('button'). We hebben het hier over een vrij primitieve output- en input-techniek die echter veel wordt gebruikt. Zie o.a. (ook) pagina 34 en 35 in het boek van Lemay.

• Opdracht 2. Objecten (I): een object oriented (OO) techniek met standaard browser- en javascript-objecten
  • Je moet aantoonbaar gegevens uit standaard browser-objecten, zoals Windows, Document, etc., halen; en in enigerlei vorm ergens in/op je werkstuk presenteren.
  • Je moet aantoonbaar gegevens uit standaard javascript-objecten, zoals Date, Math, etc., halen; en in enigerlei vorm ergens in/op je werkstuk presenteren.
  • Je moet van elk minstens twee (verschillende) objecten hebben gebruikt.
  Toelichting: We willen dat je in je werkstuk een onderdeel opneemt waarin je blijk geeft om te kunnen gaan met objecten die standaard bij de browser en javascript horen. De object georienteerde methode van denken geeft je de gelegenheid op een goede en gestructureerde manier met informatie en alle mogelijke eigenschappen en onderdelen van digitale dingen (objecten) om te kunnen gaan. Zie bijvoorbeeld (ook) pagina 81 t/m 84 (Math en Date), 90 (Window), etc. in het boek van Lemay.

• Opdracht 3. Objecten (II): een object oriented (OO) techniek met eigengemaakte objecten (in javascript)
  • Het werkstuk moet minstens twee eigengemaakte objecten bevatten;
  • Het moet op een of andere manier duidelijk worden dat je de in javascript geprogrammeerde eigenschappen op een functionele en nette manier kunt uitlezen en/of gebruiken;
  • de objecten moeten properties bevatten en een van de objecten moet naast een aantal properties minstens één method bevatten;
  • Al dit soort dingen moet geheel of gedeeltelijk ook op een of andere manier zichtbaar zijn of worden op je web-pagina.
  Toelichting: We willen dat je in je werkstuk zelfgemaakte objecten opneemt: personen, dieren, planten, verkoopartikelen, fenomenen, etc. Zie bijvoorbeeld de voorbeelden op pagina 48, 49, 56 en 58 in het boek van Lemay.

• Opdracht 4. Inputtechniek: een acceptatietechniek met een standaard input animatie object (scroll bar)
  • Het werkstuk moet een input-element bevatten (een applet object);
  • Dat input-element moet output genereren die op een of andere manier zichtbaar is (bijvoorbeeld in een veld).
  Toelichting: We willen dat je in je werkstuk een 'dynamisch' input-onderdeel opneemt. Dit moet met behulp van 'slider.class'.

• Opdracht 5. Outputtechniek: een presentatietechniek met een bestaand object (een applet-object), gekoppeld aan een loop.
  • In je werkstuk moet een output-object worden opgenomen;
  • Dit output-object moet gekoppeld worden aan een loop zodanig dat wij iets dynamisch op het scherm te zien krijgen;
  • De tegenwoordige operating systems zijn zodanig dat het refreshen van het scherm op het laatst gebeurd. Derhalve ziet u soms niks gebeuren. Derhalve verzoeken wij u op een of andere manier een tijdsvertraging in te bouwen.
  Toelichting: We willen dat je in je werkstuk een 'bewegend', 'dynamisch' onderdeel opneemt. Dit moet met behulp van een applet. Neem hiervoor onze eenvoudigste applet: het tellertje (de applet 'Teller.class' uit 'WebLib'). De tijdsvertraging kun je het eenvoudigste doen met een extra overbodige (dummy) berekening en dat bijvoorbeeld 100 of 1000 maal. Dat kost de computer tijd; en dat vertraagd dus. Er zijn ook elegantere oplossingen bijvoorbeeld met de functie 'SetTimeOut'.

• Opdracht 6. Beweging: een presentatietechniek met een niet-interactieve, model-driven grafische output element.
  • Het werkstuk moet een niet-interactieve, model-driven grafische output element bevatten met een of twee groeiende grafieken erin;
  • Dit onderdeel moet een wiskundig model bevatten.
  Toelichting: Gebruik 'grafiekYT.class'. Bij dit dynamische 'externe' object waar een of twee groeiende grafieken in worden gepresenteerd, willen we dat je via de parameters, PARAM, de (groffe) instellingen (de condities waaronder de applet werkt) vastlegd die nodig zijn om de grafiek(en) in goede banen te leiden. Als je deze condities niet insteld werkt de applet niet. Het tekenen van de grafiek zelf, dient vanuit javascript te gebeuren. Zorg dat Tmin, Tmax, Y1min, Y1max, Y2min, e.d. via de parameters van de applet goed zijn ingesteld.

• Opdracht 7. Geluid: een presentatietechniek om geluids-elementen toe te voegen.
  • Het werkstuk moet enkele geluids-elementen (van derden) bevatten
  • Je moet sommige geluiden zelf aan kunnen zetten en sommige geluiden moeten automatisch gepresenteerd worden.
  Toelichting: We willen dat je een aantal keren bewegend beeld en (lopend) geluid opneemt in je werkstuk. Deze verplichte audio-elementen zijn over het algemeen gemakkelijk te implementeren. De realisatie is over het algemeen moeilijker. Immers je zult geluid moeten opnemen. We gaan er van uit dat je dat kunt en geleerd hebt bij de voorgaande vakken of nog krijgt bij de vervolg-vakken 'lineaire en hypermedia'. Je mag overigens putten uit onze bibliotheken en je mag alles van het world wide web halen wat je nodig denkt te hebben. De plaats van dit soort elementen op of in de pagina is natuurlijk vrij. Dergelijke onderdelen komen vanzelfsprekend overal verspreid over de gehele web-pagina te zitten. Immers ze zijn overal wel ergens functioneel en je kunt ze dus overal plaatsen. Geluid is zelfs veel functioneler dan teksten. Geluidjes kun je op diè plaatsen in je werkstuk aanbrengen, waar je ze nodig en functioneel vindt. Natuurlijk zijn er ook nadelen aan geluid: het is voor iedereen hoorbaar en soms te lineair, dat wil soms zeggen: te lang of te langdradig.

• Opdracht 8. Video: een presentatietechniek om losse video elementen toe te voegen.
  • Het werkstuk moet ergens een video-element (van derden) bevatten
  • Je moet kiezen: of zelf aan kunnen zetten of automatisch iets laten zien (en laten horen).
  Toelichting: We willen dat je ergens een video-filmpje (een kort en krachtig video-fragment) opneemt in je werkstuk. De realisatie van video is - net als geluid - over het algemeen bewerkelijk en kost tijd. Die tijd hebben jullie niet. Immers je zult video en bijpassend geluid moeten opnemen. Dit stellen we dan ook niet voor. We gaan er - zoals eerder gezegd - van uit dat je dat kunt en geleerd hebt bij de voorgaande vakken of nog krijgt bij de vervolg-vakken, zoals bij 'lineaire en hypermedia'. Je mag dus gewoon putten uit onze bibliotheek 'WebStuff' met elementen en je mag alles van het world wide web halen wat je nodig denkt te hebben.

• Opdracht 9. Complexe applet: een presentatietechniek met een bestaande complexe applet.
  • Het werkstuk moet een complexe applet (van derden) bevatten
  • De applet moet duidelijk en goed worden aangestuurd (dwz. statisch aansturen via de parameters bij PARAM)
  • Het moet blijk hebben gegeven dat je deze parameters (PARAM) hebt weten te gebruiken
  • De applet moet in een apart window zitten
  • Je moet ook een eigen achtergrond-plaatje hebben opgenomen
  Toelichting: We willen dat je ergens in je werkstuk een van onze drie eigengemaakte complexe applets in een apart window heb staan. Zorg dat de parameters, PARAM, in je HTML-source goed zijn ingesteld. Zorg dat de library 'SimLib' bij je werkstuk aanwezig is en (dus) in de folder van je werkstuk staat. Zelf downloaden svp.

  We willen dat je bij dit onderdeel een complexe applet (van een ander) (uit een ander TO-vak) aan de praat krijgt. Wij stellen de simulatie-applet CARDIO (van Hoving & Hoiting; 1999), TRANSISTOR (van Avis; 1999) en BOILER (van de Rijke & Vermaas; 1999) ter beschikking. Deze applets zijn bij het keuzevak 'Computersimulatie als Leermiddel', dit jaar, gemaakt. Zij zijn speciaal ter beschikking gesteld voor onderwijsdoeleinden behorende bij dit vak.