2012InfB23

From rtgkomArkiv
Jump to: navigation, search

Contents

Dokumentering af UI-projektet og Vaffelis, 2013-05-14, Gkb[edit]

Vi arbejdede med to forskellige aktiviteter i dag, nemlig dokumentering af arbejdet med UI-projektet og produktion af virtuel vaffelis.

Dokumentering af UI-projektet[edit]

Gruppernes rapporter om arbejdet i UI-projektet skal lægges op på hver enkelt elevs StudieWeb, hvor den enkelte elev kort præsenterer projektet. Produktet skal også op på hver enkelt elevs StudieWeb og linkes til fra præsentationen. Hvis produktet f.eks. var lavet med GameMaker, Lazarus IDE eller NetLogo, så er det ikke kun den "køreklare version" som skal uploades, men også hele udviklingsprojektet. Det kan handle om en mappe med flere filer og mapper som i sin tur kan indeholde andre mapper osv. Det kan være en god ide at pakke projektmapperne til et arkiv, f.eks. et zip-arkiv med f.eks. 7zip fra sourceforge.org.

Sommerprodukt: Virtuel vaffelis[edit]

I anledning af at sommeren endelig virker være kommet og som lidt forskud på næste års arbejde med programmeringssproget Python, så ville vi prøve at producere virtuel vaffelis med Python og modulet Visual.

Instruktionen som jeg gav var meget kortfattet. Den lød omtrent sådan:

Del 1: Kugle og kegle på et skakbræt[edit]

-Download og installer Python og modulet Visual via de links som du finder på vpython.org. (Søg evt. på "visual python").
-Brug linkene "Documentation" og "Full documentation" på vpython.org til at få lidt hjælp og inspiration. Det skal føre til http://www.vpython.org/contents/docs/index.html.
-Afprøv følgede program i IDLE editioren:
    import visual
    visual.sphere()
  og prøv at navigere i billedet af kuglen med musen.
-Afprøv følgende program også:
    import visual
    visual.sphere(radius=0.7)
    visual.box()
-Lav nu en model med en kugle og en kegle som står på en overflade som ligner et skakbræt. 
 Roter med musen og opstil billed og kildekode side om side på skærmen og gem skærmbilledet som en PNG fil.
-Publiser på dit StudieWeb med en kort kommentar.

Del 2: Virtuel Vaffelis[edit]

-Lav nu en vaffelis med tre kugler, rød, grøn og blå. Publiser billedet og koden ved hjælp af et skærmbilled på dit StudieWeb med en kort kommentar.

Flere af eleverne blev færdige med den første del, altså kuglen og keglen på skakbrættet. Ideen om vaffelisen kom først i slutningen af modulet, så det kigger vi nærmere på næste gang.

Det er interessant at notere sig at der var nærmest ingen instruktion i anvendelsen af programmeringssproget, det var selve værktøjet og den tilhørende dokumentation som eleverne brugte til at løse opgaven. Dette er et eksempel på det som jeg kalder værktøjsbaseret læring (Tool Based Learning, for nu at være lidt internationel). Det at anvende gode, ofte også avancerede værktøjer som er veldokumenteret, kan helt enkelt erstatte tavleundervisning og projektor-demonstrationer.

UI-projektet: Spike solutions, 2013-04-29, Gkb[edit]

Projektet afsluttes den 8. maj. Arbejdet med dokumentation i form af en rapport, skal nu prioriteres. Produktet, og arbejdet med de forskellige prototyper og spike solutions skal selvfølgelig dokumenteres i rapporten.

Spike Solutions[edit]

Brug gerne spike solutions til at afprøve om I kan løse et kærneproblem med det værktøj som I har valgt at bruge. Formålet med det er at reducere den tekniske usikkerhed i jeres projekt! Se gerne diskussion her XXX. Dokumenter arbejdet med alle jeres spikes i rapporten. Her er et eksempel på en lille spike til at teste om vi kan lave en slags vindue på en strøm af dataværdier fra en Arduino og analysere hvordan deres indbyrdes størrelsesforhold er.

//spike_solution_for_window_on_a_stream_of_data
//gkb, april 2013
//v02: random() used to provide some random input.
//v03: Spike solution finished! A window of three values, a, b and c, 
//     "moves" along the data stream, and we can do tests on the three 
//     values.

int a=0,b=0,c=0,temp=0;
void setup(){
  for (int i=1;i<10;i++){
    //print(i % 3); 
    //if (i % 3 == 0) {b=c; c=a; a=i;}
    {temp=b; b=a; c=temp; a=int(random(1023));}
    println(str(a)+" "+str(b)+" "+str(c));
    //Check if center value, b, is more than 100% larger than the side values a and c.
    if (2*a<b && b>2*c) {println("Center value more than 100% larger than side values!");};   
  }
}

UI-projektet, kærneproblemer, spike solutions, prototyper, dokumentation, 2013-04-15, Gkb[edit]

Arbejdet med UI-projektet fortsatte i dag. Grupperne arbejdede med forskellige aspekter ved deres projekter.

Tavlebilled-detektorgruppen[edit]

Vi forsøgte at fokusere på at definere kærneproblemerne i projektet. Vi kom frem til at der i hvert fald er fire kærneproblemer som skal løses:

  1. Hente billed fra webkameraen.
  2. Beskære billedet med Python og Image modulet fra PIL.
  3. Kopiere billedet til webserveren.
  4. Præsentere billedet i en webbrowser.

Gruppen delte arbejdsopgaverne nu således at

  • Jesper fortsatte, nu i Ubuntu, med arbejdet med at få beskring af billedet til at virke. Og det gik godt indtil im.show(), så skete der intet, ikke en gang en fejl. Så var tiden gået, men når vi kan få dette til at virke i Python 2.6.4, så skulle det gerne også virke i 2.7. Du må fortsætte at eksperimentere, Jesper.
  • Niclas og Lars fokuserede på kopiering af billedet til webserveren. De brugte to af laboratoriets maskiner, 10.0.0.109 og 10.0.0.251. De ville bruge kommandoen scp. De brugte terminal-vinduer til at eksperimentere med kommandoen. Undervejs fik de brug for blandt andet følgende kommandoer: pwd, ls, ping, ifconfig og sudo. De brugte manual siden i Ubuntu, man scp, til at læse om kommandoen, samt websider. (Prøv at søge på unix commands, det giver links til gode guides til kommandoer.) De kom frem til at bruge følgende kommando: scp index.html learner@10.0.0.109:, som tilsyneladende var lige ved at virke, men så kom der en meddelelse om at forbindelsen blev afbrudt. Modulet var slut og vi måtte opgive indtil videre. Lidt senere når jeg så huskede jeg at der nok ikke var nogen ssh server installeret på disse maskiner. Jeg prøvedes så at installere openssh-server med følgende kommando. sudo apt-get install ssh, og så virkede scp kommandoen ok. Prøv selv!

I forbindelse med arbejdet med scp begyndet jeg at skrive en guide til brugen af kommandoen, se et udkast her Kopiering_af_filer_med_scp

Akvarie-gruppen[edit]

Klap-detektorgruppen[edit]

  • d. 03-13-2013 var den første dag hvor vi begyndte med det nye projekt. Gruppen som dengang kun bestod af Oliver og Kasper C sad og kiggede i bogen "Making Things talk" for at få inspiration til et projekt, som gruppen kunne komme igang med.
  • d. 03-14-2013 her kiggede vi videre i bogen og faldt over trådløst kommunikation og fandt dette emne interessant.

vi kiggede videre i bogen og så faldt vi over billedet på side 180 i bogen og fik ideen om at vi gerne ville lave en fjernbetjening som kunne styre et lys.

  • d. 03-18-2013 Vi læste videre i bogen og fandt informationer på arduino.cc
  • d. 03-22-2013 Der begyndte vi at finde vores arduino og nogle af de komponenter vi skulle bruge.
  • d. 04-05-2013 Vi kom tilbage fra ferien og fik Kasper D med i gruppen. Vi fandt de sidste komponenter vi skulle bruge og begyndte at studere arduino og hvordan vi skulle bruge det. Oliver fik også downloadet arduino 1.0.4 til hans computer så vi kunne arbejde med vores komponenter.
  • d. 04-10-2013 Vi downloadede et program som hedder processing og fik kodet i arduino så vi kunne få vores komponenter til at måle lys.
  • d. 04-11-2013 Vi programmerede videre
  • d. 04-15-2013 Dagen idag gik ikke særlig godt da vi havde problemer med at få processing til at virke så vi kunne få graph til at virke. Vi tror ikke dette skyldes koden da vi fik den fra arduinos CC
  • d. 04-19-2013 Kasper og Kasper fik arbejdet på logbogen imens Oliver fik arbejdet videre med arduino 1.0.4 og Processing. Oliver fik Graph koden på processing til at virke idag. Udover det fik Oliver udviklet videre på graph koden således at programmet lukkede når lyset havde en bestemt styrke.

Generelt om Arduino[edit]

Arduino er et stykke open source hardware, baseret på ”nemt at finde ud af” hardware og software. Arduino kan blive brugt til at få små dioder, motorer, blæsere til at lyse periodemæssigt. Man programmere Arduinoen ved at koble den til en Computer og bruge et program som f.eks. Flash eller processing. Arduinoen kan også blive brugt alene til at styre de forskellige objekter. Microcontrolleren på Arduinoen er programmeret til at bruge det specielle Arduino programmerings sprog. Arduino kan blive bygget i hånden eller man kan købe dem samlet. Til vores projekt har vi fået udleveret en færdiglavet Arduino. Arduino er et stykke open source harware hvilket vil sige at man kan ændre på den efter sit behov. Arduinoen var lavet til artister og designere men er blevet til meget mere, ud fra arduinoen koncept er der blevet lavet en 3D printer, der bygger de modeller til dig som du skal bruge, f.eks. En knage til at hænge jakker på, en madkasse osv.

HubNet-gruppen[edit]

Skråt-kast-gruppen[edit]

Gruppen var ikke med i dag.

UI-projektet, arbejdet med implementering fortsat, 2013-04-11, Gkb[edit]

  • Klap-detektor med Arduino: Gruppen fortsatte arbejdet med at lære at bruge Arduino til at lave målinger.
    • AnalogReadSerial: Gruppen stillede en spændingsdeler op med en almindelig modstand og en LDR. Spændingen i punktet mellem disse to komponenter blev så målt med AnalogReadSerial (AnlogInSerial?) programmet, og vi observerede hvordan værdierne i serial-monitoren varierede når vi flyttede hånden frem og tilbage over LDR'en. Vi observerede også hvordan værdierne faldt til 0 når vi koblede den "gule" (ja, altid gul farve til prober!) ledning til GND og hvordan de blev 1023 når proben fik kontakt med forsyningsspændingen til spændingsdeleren, som i opstillingen var 5 Volt.
    • Graph: Dernæst kastede gruppen sig over at afprøve eksemplet Graph i Communication mappen (følger med når man henter Arduino IDE). Processing blev downloadet og koden til Processing blev kopieret fra Graph-sketchen i Arduino's eksample-bibliotek og eksekveret. De målte fortsat på samme spændingsdeler og nu så vi en graf, søjlediagram, som viste hvordan lysstyrken varierede når vi flyttede hånden frem og tilbage over LDR'en. Vi diskuterede hvordan vi kan bruge signalet (altså strømmen af målte værdier) fra Arduinoen til at simulere et lydsignal.
    • Algoritme til detektion af et klapp: Vi diskuterede nu kort, med støtte i en skitse på tavlen, hvordan gruppen kan gribe den opgave an at udvikle en algoritme til at detektere et klap. Hvilke kriterier skal datastrømmen (signalet) opfylde? Skal vi søge efter et enkelt klap, eller skal der være to på hinanden følgende klap? Hvor kort eller lang tid skal der være i mellem dem, og hvor lang tid skal der gå for og efter dem for at vi kan være sikre på at vi har et klap? Her har vi et eksempel: Hvis vi får følgende måleværdier fra Arduino'en, har vi så et dobbelt klap. 100, 110, 109, 97, 105, 132, 145, 137, 87, 97, 105, 140, 147, 103, 91, 80, 77, 99. Vi kan antage indtil videre at der kommer 100 måleværdier i sekundet. Hvor ofte kan du klappe hænderne i løbet af et enkelt sekund? Hvor mange gange skal I måle lydstyrken pr sekund til at få brugbare data?
  • Participative Computing med NetLogo: Gruppen har lavet en model som gør det muligt at tegne stregtegninger vha. knapper i brugerfladen. De gik så i gang med at undersøge hvordan de vha. NetHub kan gøre det muligt for flere brugere i fælleskab at styre denne tegneprocess.
  • Fiskesimulator (akvariesimulator) med GameMaker: Gruppen har en velfungerende prototype til et produkt/spil/simulator. De gik i gang med rapportskrivningen. De kiggede balandt andet på MediaLab's vejledning om struktur for projektbeskrivelse og rapport, -se her http://rtgkom.dk/wiki/Guide:Projektbeskrivelse_og_rapport.
  • Publisering af tavlebilleder på webserver: Vi afklarede i fælleskab hvordan Image modulet kan bruges til at croppe et billed. Vi brugte http://www.pythonware.com/library/pil/handbook/imagefilter.htm. Der var problemer med at få selve fremvisningen (.show()) at virke i Windows 7 med Python 2.7, -hvorfor?. I Ubuntu 9.10 med Python 2.6.4 funkede det fint. I forbindelse med afprøvningen af Image modulet blev vi også nødt til at lære os at bruge chdir() og getcwd() fra os-modulet (Operativ System). Vi begyndte også at undersøge mulighederne for over netværket at hente et billed fra vores webkamera som er monteret i lokale C3101. Der kører en webserver i/på kameraet og vi kunne se to muligheder for at hente billeder fra kameraet, via e-mail og via upload til en ftp server, og den kan vi lave på vores netværk.
  • Skråt kast(?) med GameMaker: Valg af værktøj blev diskuteret. Evt. kan NetLogo bruges? Der var problemer med at få GameMaker til at køre på en bærbar maskine. Hvad skal jeres projekt hedde?

UI-projektet, status på gruppernes arbejde, 2013-04-10, Gkb[edit]

  • Klap-detektor med Arduino: Gruppen arbejdede med at genopfriske sit kendskab til Arduino. De installerede driveren og fik kontakt til Arduino fra en Windows 7 maskine. Dernæst afprøvede de eksemplerne "Blink" uden brug af nogen komponenter og "AnalogReadSerial" sammen med en spændingsdeler lavet af en almindelig modstand og en LDR. De nåede altså at se de se værdierne fra ADC'en (Analog Digital Converter) i Arduino'en rulle op i serial monitor'en.
  • Participative Computing med NetLogo: Gruppen har lavet en model som gør det muligt at tegne stregtegninger vha. knapper i brugerfladen. De gik så i gang med at undersøge hvordan de vha. NetHun kan gøre det muligt for flere brugere i fælleskab at styre denne tegneprocess.
  • Fiskesimulator (akvariesimulator) med GameMaker: Gruppen har en velfungerende prototype til et produkt/spil/simulator. De gik i gang med rapportskrivningen, og så baland andet på MediaLab's vejledning om struktur for projektbeskrivelse og rapport, -se her http://rtgkom.dk/wiki/Guide:Projektbeskrivelse_og_rapport.
  • Publisering af tavlebilleder på webserver: Gruppen begyndte at undersøge hvordan Image modulet i PIL kan bruges til at klippe (crop) fotografier (jpg). Relevant information blev fundet på http://www.pythonware.com/library/pil/handbook/imagefilter.htm.
  • Skråt kast(?) med GameMaker: Status på projektet er lidt usikker. Gruppen har ikke registreret projektet i vores wiki.

Spikes og prototyper, 2013-03-18, Gkb[edit]

I forbindelse med brugen af PIL så se her http://www.pythonware.com/library/pil/handbook/introduction.htm

UI-projektet, arbejdsgrupper og problemformulering, 2013-03-18, Gkb[edit]

  • Gruppe nr 1:
    • Titel for projektet: Fiskesimulator.
    • Undertitel for projekt: Simulerer fisks liv.
    • Valgt problemstilling: Lærerigt værktøj til dem, der vil have fisk, eller bare vil lære, hvordan man passer dem.
    • Potentielle værktøjer (tools): Gamer Maker, MS Paint
    • Stefan Westermann, stefanew11
    • Mathias Raaberg, mathiasr11
    • Sofus Hansen, sofush11
    • Stefan Parbst, stefanap11
  • Gruppe nr 2:
    • Titel for projektet: Kort, informerende, evt. provokerende, interessant, moralsk og etisk acceptabel
    • Undertitel for projekt: Lidt længere end den korte titel, forklarer evt. nogle af de spm som læseren fik ved kun at se på titlen.
    • Valgt problemstilling: Beskriv med op til ret mange ord!
    • Potentielle værktøjer (tools):
    • Julius Pedersen, juliusp11
    • Sebastian Holtze, sebastianjhp11
    • Nicolai Obel, nicolaioc11


  • Gruppe nr 3:
    • Titel for projektet: Kort, informerende, evt. provokerende, interessant, moralsk og etisk acceptabel
    • Undertitel for projekt: Lidt længere end den korte titel, forklarer evt. nogle af de spm som læseren fik ved kun at se på titlen.
    • Valgt problemstilling: Beskriv med op til ret mange ord!
    • Potentielle værktøjer (tools):
    • Kasper Christoffersen, kasperc11
    • Oliver Mangelsen, oliverm11
    • Kasper D, Kaspermd11
    • Navn, userID
  • Gruppe nr 4:
    • Titel for projektet: Billed fotografering til webserver program.
    • Undertitel for projekt:
    • Valgt problemstilling: Beskriv med op til ret mange ord!
    • Potentielle værktøjer (tools):
    • Niclas,niclasha10
    • Lars, larsll11
    • Jesper, jesperml11
    • Navn, userID
  • Gruppe nr 5:
    • Titel for projektet: Kort, informerende, evt. provokerende, interessant, moralsk og etisk acceptabel
    • Undertitel for projekt: Lidt længere end den korte titel, forklarer evt. nogle af de spm som læseren fik ved kun at se på titlen.
    • Valgt problemstilling: Beskriv med op til ret mange ord!
    • Potentielle værktøjer (tools):
    • Navn, userID
    • Navn, userID
    • Navn, userID
    • Navn, userID
  • Gruppe nr 6:
    • Titel for projektet: Kort, informerende, evt. provokerende, interessant, moralsk og etisk acceptabel
    • Undertitel for projekt: Lidt længere end den korte titel, forklarer evt. nogle af de spm som læseren fik ved kun at se på titlen.
    • Valgt problemstilling: Beskriv med op til ret mange ord!
    • Potentielle værktøjer (tools):
    • Navn, userID
    • Navn, userID
    • Navn, userID
    • Navn, userID

UI-projekt, 2013-03-14, Gkb[edit]

Som inspiration til gruppernes valg af tema, problem og værktøjer, så testede vi en Raspberrypi Pi i klassen. Se her http://www.rtgkom.dk/wiki/Raspberry_Pi.

UI-projekt, nyt projekt, 2013-03-13, Gkb[edit]

Vi begyndte brainstorming om det nye projekt, hvor grupperne selv kan vælge værktøj og problem.

Intraktivt GUI med Lazarus IDE, 2013-03-04, Gkb[edit]

Richard Stallmann og Bill Gates, free software, open source, proprietary software og licenser[edit]

http://www.youtube.com/watch?v=P8BhOH9g_QE

http://www.techterms.com/category/internet

http://www.youtube.com/watch?v=AP5VIhbJwFs

Spike solution, en hurtig løsning på kærneproblemet at lægge sammen to tal, -nu med Lazarus IDE[edit]

Se evt. også lidt dokumentation om brugen af Delphi: http://docwiki.embarcadero.com/RADStudio/XE3/en/Main_Page

Intraktivt form i HTML og GUI med Lazarus IDE, 2013-02-28, Gkb[edit]

Spike solution, en hurtig løsning på kærneproblemet at lægge sammen to tal[edit]

Vi afslutter nu vores eksperimenter i HTML. Afprøv gerne følgende kode som illustrerer tre måder at løse problemet.

Dokumenter dit/jeres arbejde med en eller flære skærmbilleder og kort forklarende tekst på dit StudieWeb.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
	<HEAD>
		<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
		<TITLE>Interaktionsøvelse - interaktion med en webside</TITLE>

		<SCRIPT type="text/javascript">
			function FindSummen(value1, value2) {
				sum = value1 + value2;
				return sum;
				//window.alert(sum);
				//document.writeln("Summen er: ", sum);
			}
			function FindSummen2(value1, value2) {
				sum = value1 + value2;
				document.forms["myform"].elements["sum3"].value = sum;
			}
		</SCRIPT>

	</HEAD>
	<BODY>
		<H1>Interaktionsøvelse - interaktion med en webside</H1>
		<P>
		Interaktion med en webside ved hjælp af FORM elementet og nogle af kontrol elementerne i HTML 4.01.<BR>
        Dette eksempel viser hvordan vi kan lave en webside som tillader en enkel interaktion mellem menneske og
		maskine (program).
		</P>
		<P>
        Kravene til denne "spike solution" (læs om begrebet her: http://www.extremeprogramming.org/rules/spike.html) 
        var at det skulle være muligt for brugeren at
        indtaste talværdier i to inputfelter og så skulle summen af dem vises et sted (på en eller anden måde) 
        i websiden. 
        </P>

		
		<FORM id="myform" action="et_server_side_script.php">
		<P>
		    <LABEL for="a">a:</LABEL>
		    <INPUT type="text" id="a"><BR>
		    <LABEL for="b">b:</LABEL>
		    <INPUT type="text" id="b"><BR>
		    <LABEL for="sum">sum: </LABEL>
		    <INPUT type="text" id="sum"><BR>
		    <LABEL for="sum2">sum2: </LABEL>
		    <INPUT type="text" id="sum2"><BR>
		    <LABEL for="sum3">sum3: </LABEL>
		    <INPUT type="text" id="sum3"><BR>
		    <INPUT type="button" value="Udregn og vis summen" onclick="sum.value = FindSummen(+a.value, +b.value)"><BR>
		    <INPUT type="button" value="Udregn og vis summen2" onclick="sum2.value = +a.value + (+b.value)"><BR>
		    <INPUT type="button" value="Udregn og vis summen3" onclick="FindSummen2(+a.value, +b.value)"><BR>
		    <INPUT type="reset"><BR>
		</P>
		</FORM>
        <P>
        I det sprog som systemudviklingsmetoden Extreme Programming definerer, så ville vi lave en såkaldt 
        "Spike Solution" til at afklare om vi kunne lave en webside som opfylder kravene som før er nævnt. 
        En "Spike Solution" er en hurtig afprøvning af om vi kan bruge vores værktøjer og teknologier til overhovedet at
        løse et problem som vi bedømmer at er helt centralt for at vi kan gennemføre vores projekt. Såddanne
        problemer kalder vi her i RTG-MediaLab for kærneproblmer, og det kan være at vi kan identificere flere af dem
        i et projekt. <BR>
        For eksempel så kan det være at vi i et projekt som går ud på at lave en webbaseret regnemaskine netop
        har behov for a kunne lægge tal i to inputfelter sammen og vise summen i et inputfelt eller en label.
        </P> 
		<P>
        Denne spike solution på problemet at kunne udregne og vise summen af to tal som brugeren indtaster i websiden 
        har udviklet sig således at vi har identificeret tre måder at gøre det på:
		</P>
        <UL>
            <LI>1. Ved tildeling (assignment) af returnværdien fra en JavaScript funktion direkte til feltet for summen.  Dette sker når brugeren klikker på knappen. Vi bruger attributen "onclick" til at eksekvere et lille JavaScript, som vist her: onclick="sum.value = FindSummen(+a.value, +b.value)</LI>
            <LI>2. Ved hjælp af et lille JavaScript, som i den første løsning, men uden at bruge en funktion til at udregne summen. Summen kan nemlig lige så godt udregnes direkte i event-handleren for klik på knappen. Se her: onclick="sum2.value = +a.value + (+b.value)"</LI>
            <LI>3. Ved at eksekvere en funktion som udregner summen og tildeler den til et felt i formen ved hjælp af den objektorientered struktur som websiden har. Se her: document.forms["myform"].elements["sum3"].value = sum;</LI>
        </UL>
	</BODY>
</HTML>

Spik med Lazarus IDE[edit]

Vi skal nu også lave en hurtig demonstration af hvordan samme kærneproblem kan løses ved hjælp af det integrerede udviklingsmiljø Lazarus IDE. Hent systemet her http://www.lazarus.freepascal.org/,

Lazarus er en clone af det gamle og meget populære system Delphi, som nu lever videre hos Embarcadero. I modsætning til Delphi, som vistnok fortsat kun kan bruges til at udvikle programmer til Windows, så kan Lazarus IDE bruges til at udvikle programmer til andre operativsystemer, som f.eks. MacOS, Windows og Linux/Unix. Man siger at systemer som kan dette er cross platform. De kan altså bruges på en platform til at udvikle programmer til andre platforme. Med platform mener man altså kombinationen af hardware og operativsystem.

GUI ved hjælp af FORM elementet i HTML 4.01, 2013-02-27, Gkb[edit]

Fortsætt arbejdet, brug info i notatet fra d. 8. feb.

Interaktion, et GUI ved hjælp af FORM elementet i HTML 4.01, 2013-02-08, Gkb[edit]

Nu kan vi igen bruge vores Wiki, men som I nok har lagt mærke til så har vi ikke kunnet logge på i et par uger fordi filsystemet på vores såkaldte LDAP server blev dårligt og den kunne ikke boote. Denne server har den funktion at kontrollere brugernes identitet, dvs. password. Og når den ikke virkede, så kunne heller ingen logge på nogen af vores systemer, f.eks de trådløse net, wiki'en og selve webserveren. Hvis du har misset det, så læs lige notatet som jeg skrev i Lectio til lektionen i mandags.

Men nu er problemet altså løst og vi fortsætter arbejdet med øvelsen om interaktion. Vi er for et par uger siden gået i gang med den håndgribelige del af øvelsen hvor vi laver nogle spike solutions vha. tre forskellige værktøjer (eller tekonlogier), nemlig:

  • NetLogo
  • HTML 4.01 strict og JavaScript
  • Lazarus IDE

I dag startede vi fokuseret arbejde med HTML og JavaScript. Vi gennemgik på væggen med projektoren hvordan vi kan bruge primære kilder til at finde information om hvordan vi løser opgaven. Vi repeterer lige her hvad den handler om:

  1. Lave et GUI med to inputfelter.
  2. Lave en knap med en tilknyttet event handler som gør at summen af de tal som indtastes i de to inputfelter vises et sted i GUI'en.

De kilder som vi bruget var:

  1. http://www.w3.org/TR/REC-html40/ (Faktisk kan jeg bedst lide at bruge PDF versionen som er på ca. 390 sider. Når man har den på desktoppen, så kan man hurtigt søge i hele specifikationen efter information om f.eks. FORM elementet eller SCRIPT elementet.)
  2. https://developer.mozilla.org/en-US/docs/JavaScript Her var vi specielt på udkig efter information om hvordan man definerer funktioner, se nærmere her https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Functions.

Og vi brugte http://validator.w3.org til at validere (teste) vores HTML.

Vores fælles anstrængelser resulterede i følgende spike solution, hvor de fleste af kærneproblemerne er løst. Vi mangler dog f.eks. at finde en måde at tilgå og bruge værdierne som indtastes i inputfelterne som parametre for vores funktion FindSummenAfValue1OgValue2(). Bemærk at FORM elementet er kopieret direkte fra HTML 4.01 specifikationen og vores eksperimenter med funktioner er kraftigt inspireret af det første eksempel i JavaScript reference vejledningen hos Mozilla (som oprindelig fandt på JavaScript), se her https://developer.mozilla.org/en-US/docs/JavaScript/Reference.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
	<HEAD>
		<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
		<TITLE>Interaktionsøvelse - interaktion med FORM elementet i HTML 4.01 strict</TITLE>
		<SCRIPT type="text/javascript">
			function println(string) {
			  window.alert(string);
			  document.writeln("asdfasdf55555555555555555");
			}
			function FindSummenAfValue1OgValue2(value1, value2) {
				sum = value1 + value2;
			  window.alert(sum);
			  document.writeln("Summen er: ", sum);
			}
		</SCRIPT>
	</HEAD>
	<BODY>
		<P>Hello world!
		<FORM action="http://somesite.com/prog/adduser" method="post">

		<SCRIPT type="text/javascript">
			println("asdfasdfasdfasdfas asdfasdfa");
			FindSummenAfValue1OgValue2(4, 3)
		</SCRIPT>

		<P>
		<LABEL for="firstname">First name: </LABEL>
		<INPUT type="text" id="firstname"><BR>
		<LABEL for="lastname">Last name: </LABEL>
		<INPUT type="text" id="lastname"><BR>
		<LABEL for="email">email: </LABEL>
		<INPUT type="text" id="email"><BR>
		<INPUT type="radio" name="sex" value="Male"> Male<BR>
		<INPUT type="radio" name="sex" value="Female"> Female<BR>
		<INPUT type="submit" value="Send"> <INPUT type="reset">
		</P>
		</FORM>
	</BODY>
</HTML>

Interaktion, fortsat arbejde med øvelsen, 2013-01-17, Gkb[edit]

Vi fortsætter arbejdet med øvelsen om interaktion mellem mennesker og maskiner. Se oplægget i notatet til vores modul i går, det udbygges løbende i dag. Husk at opdatere, reload, Ctrl+R, for at tvinge din browser til at hente websiden, ellers bruger den evt. en gammel version som ligger i dens lokale lager på din maskine (cache).

Interaktion, en øvelse, 2013-01-16, Gkb[edit]

I dag starter vi en øvelse om interaktion mellem mennesker og maskiner, som på dansk ofte nævnes menneske-maskine-samspil (MMS). På engelsk kaldes det for Human–Machine Interaction (HMI) eller Man–Machine Interaction (MMI). For at vi kan interagere med maskiner så skal maskinen have nogle knapper, håndsving og display som vi kan anvende, -altså trykke på og aflæse. Disse knapper og display udgør grænsesnittet (brugerfladen) mellem maskinen og mennesket, som på engelsk kaldes interface (user interface). Når der fokuseres på selve interfacet og ikke på vores måde at bruge det, så tales der om Human–Machine Interface eller Man–Machine Interface.

Når vi bruger computerprogrammer med et display som kan vise grafik (altså ikke kun text) så taler vi om grafisk brugergrænseflade, på engelsk Graphical User Interface, GUI. Og når vi bruger et computerprogram som styres via textbaserede kommandoer, så taler vi om et kommandolinjeinterface, Command Line Interface, CLI. Se også Command Line Interface, CLI - Google-søgning

I denne øvelse skal du først søge og bearbejde information om interaktion mellem mennesker og maskiner i historisk perspektiv. Altså prøve at se på hvordan man før i tiden har lavet, og fortsat laver interfacedesign for maskiner af forskellige typer. I den sidste del af øvelsen skal du arbejde med interfacedesign for computerprogrammer.

Interaktion mellem mennesker og maskiner i historisk perspektiv[edit]

Udfør følgende aktiviteter og dokumenter kort på dit StudieWeb:

  • Søg frit på information om begreberne som er introduceret i indledningen ovenfor. Her er nogle af dem:
    • Interaction
    • maskine (machine)
    • Human–Machine Interaction
    • interface, grænsesnit, grænseflade
    • user interface, brugergrænseflade
    • Display
    • Graphical Display
    • Text Display, Text Mode Display
    • Graphical User Interface (GUI),grafisk brugergrænseflade
    • Command Line Interface (CLI), kommandolinjeinterface
  • Søg på og beskriv følgende typer af knapper: Push button, Vernier Dial Knob (eller bare Vernier Dial), potentiometer, slide potentiometer.
  • Søg på og beskriv følgende typer af afbrydere (switches): SPST og SPDT.
  • Søg på og beskriv følgende typer af displays: Analog display, Digital display.

Begreberne switch og transducer/sensor...

http://en.wikipedia.org/wiki/Transducer

transducers - Google-søgning

Interaction mellem mennesker og computerprogrammer[edit]

NetLogo....HTML FORM, JavaScript, PHP, evt. designe og impl et et interface (GUI) i NetLogo og HTML som efterligner interfacet på et fysiskt apparat som vi alle kender, f.eks. en radio, evt. en krystalmodtager, http://solomonsmusic.net/FM_CrystalRadio.html.

Command Line Interface, CLI - Google-søgning

http://en.wikipedia.org/wiki/Command-line_interface