Dit is een extra onderdeel van het laatste project van het eerste jaar(JavaScript). De opdracht was dat je als je tijd over had een eenvoudig spelletje kon programmeren voor extra punten. Hierbij koos ik voor vier op een rij omdat het mij leuk leek om dit te spelen in de klas.
Ik heb mijn vier op een rij gemaakt op basis van een html table waarbij de rows een class van 1 t/m 8 hebben en de cells ook een class van 1 t/m 8. Zodra een cell van een player is (er ligt een fiche in) krijgt de cell een extra player class.
De code krijgt mee op welke cell je klikt, dan neemt hij alle cells met die class (heel de kolom), dan zoekt hij naar de laatste ‘parent’ (row) met een cell er in waar wél de kolom class aan zit maar níet de player class:
var last = $(‘td.’ + class + ‘:not(.’ + playerclass + ‘)’).parent().last().find(‘td.’ + class + ‘:not(.’ +playerclass + ‘)’);
Zo kan de code de laagste cell die nog niet bezet is aan de huidige player toekennen:
last.addClass(playerclass);
last.html(player_name);
last.css(‘background-color’, player_color);
last.css(‘color’, player_color);
Dit is een klein projectje wat ik zelf ben gaan maken nadat we in de eerste paar lessen van JavaScript naar mijn mening niet snel genoeg gingen. Ik heb met de beperkte kennis die ik toen had van JavaScript een kleine rekenmachine gemaakt die niet alleen +, -, * en / kon maar ook x tot de macht en de wortel van het ingevoerde getal uit kan rekenen.
De functie (+ – * / ^ of √ ) wordt geselecteerd dmv een dropdown en de invoer getallen via input-velden. Als de wortel van wordt geselecteerd zorgt de javascript er voor dat je niets meer in het eerste veld in kunt vullen. Ook zit er een warning op dat zodra je de input velden veranderd het antwoord niet meer klopt, zoals u kunt zien op de tweede afbeelding.
Voor vormgeving heb ik in de tweede periode van het eerste jaar een sitemap, wireframe en mockup voor de website van mijn project gemaakt. De mockup is hierboven te zien als eerste slide.
De website die ik stap voor stap uit gepland had bij vormgeving heb ik in de week er na gerealiseerd. Het eindproduct is responsive, dit betekend dat de website zich aanpast aan de grote van het scherm. Een preview hier van is te zien als slide twee.
Voor HTML hebben we de opdracht gekregen een website te maken die op mobiel en desktop op een andere manier weergegeven wordt. Dit was een van mijn eerste ervaringen met responsive websites.