Feat(NSI): définition du projet et ajoute intro à snake

1NSI/00_Divers/index.rst

@@ -1,13 +0,0 @@
-Accueil
-#######
-
-:date: 2022-08-21
-:modified: 2022-08-29
-:authors: Benjamin Bertrand
-:tags: Divers
-:category: 1NSI
-:summary: Documents d'accueil et de présentation de la spécialité NSI
-:slug: divers_1NSI
-
-Étape 1:
-========

1NSI/00_Projets/doc_pygame.tex

@@ -0,0 +1,142 @@
+\documentclass[a4paper,12pt]{article}
+\usepackage{myXsim}
+
+\usepackage{listings}
+
+\date{Décembre 2022}
+\title{Documentation Pygame}
+\tribe{ISN}
+
+\definecolor{mygreen}{rgb}{0,0.6,0}
+\definecolor{mygray}{rgb}{0.5,0.5,0.5}
+\definecolor{mymauve}{rgb}{0.58,0,0.82}
+
+\lstset{ %
+  backgroundcolor=\color{white},   % choose the background color
+  basicstyle=\footnotesize,        % size of fonts used for the code
+  breaklines=true,                 % automatic line breaking only at whitespace
+  captionpos=b,                    % sets the caption-position to bottom
+  commentstyle=\color{mygreen},    % comment style
+  escapeinside={\%*}{*)},          % if you want to add LaTeX within your code
+  keywordstyle=\color{blue},       % keyword style
+  stringstyle=\color{mymauve},     % string literal style
+}
+
+\pagestyle{empty}
+
+\begin{document}
+
+\maketitle
+
+\section{Code minimal}
+
+\lstinputlisting[language=Python, frame=single]{pygame_base.py}
+
+\section{Dessiner sur la fenêtre: Draw}
+
+Dans toute la suite, on supposera que vous avez appelé la fenêtre \texttt{windowSurface}.
+
+Les couleurs se définissent avec leur code RGB:
+
+\begin{lstlisting}[language=Python, frame=single]
+BLACK = (0, 0, 0)
+WHITE = (255, 255, 255)
+RED = (255, 0, 0)
+GREEN = (0, 255, 0)
+BLUE = (0, 0, 255)
+\end{lstlisting}
+
+Tracer de objets géométriques
+
+\begin{itemize}
+    \item \textbf{Un segment:} \texttt{(60, 60)} sont les coordonnées du points de départ, \texttt{(120,60)} le point d'arrivé et \texttt{4} est l'épaisseur du trait.
+        \begin{lstlisting}[language=Python, frame=single]
+    pygame.draw.line(windowSurface, color, (60, 60), (120, 60), 4)
+        \end{lstlisting}
+    \item \textbf{Un cercle:}  \texttt{(300, 50)} sont les coordonnées du centre, \texttt{50} le rayon et \texttt{0} l'épaisseur du trait (0 signifie que le cercle est entièrement colorié).
+        \begin{lstlisting}[language=Python, frame=single]
+    pygame.draw.circle(windowSurface, color, (300, 50), 20, 0)
+        \end{lstlisting}
+    \item \textbf{Une ellipse:} \texttt{300} et \texttt{250} sont les coordonnées du centre, \texttt{40} le rayon horizontal, \texttt{80} le rayon vertical et \texttt{1} l'épaisseur du trait.
+        \begin{lstlisting}[language=Python, frame=single]
+    pygame.draw.ellipse(windowSurface, color, (300, 250, 40,80), 1)
+        \end{lstlisting}
+    \item \textbf{Un rectangle:} \texttt{20} et \texttt{30} sont les coordonnées du coin en haut à gauche du rectangle, \texttt{40} est la largeur et \texttt{50} est la hauteur.
+        \begin{lstlisting}[language=Python, frame=single]
+    pygame.draw.rect(windowSurface, color, (20, 30, 40, 50))
+        \end{lstlisting}
+    \item \textbf{Un polygone:} \texttt{((146, 0), (291, 106), (236, 277), (56, 277), (0, 106))} sont les coordonnées des sommets du polygone.
+        \begin{lstlisting}[language=Python, frame=single]
+    pygame.draw.polygon(windowSurface, color,
+            ((146, 0), (291, 106), (236, 277), (56, 277), (0, 106))
+            )
+        \end{lstlisting}
+\end{itemize}
+
+Il ne faut pas oublier la ligne suivante après avoir tracé tout ce que vous vouliez, sinon rien ne s'affichera.
+\begin{lstlisting}[language=Python, frame=single]
+pygame.display.update()
+\end{lstlisting}
+
+
+D'autres fonctions de dessins existent. Voici un exemple de tout ce qui peut être fait en dessin avec pygame.
+
+\lstinputlisting[language=Python, frame=single]{./draw_example.py}
+
+\paragraph{Ajouter une image:} Pygame permet d'ajouter des images ayant les formats suivant: JPG, PNG, GIF (non-animated), BMP. On supposera dans la suite qu'elles sont rangées dans le même dossier que notre programme.
+\begin{lstlisting}[language=Python, frame=single]
+#Charger l'image
+img = pygame.image.load('image.jpg')
+# L'afficher sur la surface
+windowSurface.blit(img, (0,0))
+\end{lstlisting}
+Les coordonnées \texttt{(0,0)} sont les coordonnées de l'angle en haut à droit de l'image sur la surface.
+
+
+\section{Interaction avec les périphériques: Events}
+
+L'interaction avec l'utilisateur se fait dans la boucle des évènements.
+
+\begin{lstlisting}[language=Python, frame=single]
+    for event in pygame.event.get():
+        if event.type == pygame.QUIT:
+            running = False
+        elif event.type == pygame.KEYUP:
+            # choses a faire quand une touche du clavier est relachee
+            if event.key == pygame.K_UP:
+                # choses a faire quand c'est la touche fleche du haut
+            elif event.key == pygame.K_DOWN:
+                # choses a faire quand c'est la touche fleche du bas
+        elif event.type == pygame.KEYDOWN:
+            # choses a faire quand une touche du clavier est pressee
+            elif event.key == pygame.K_LEFT:
+                # choses a faire quand c'est la touche fleche de gauche
+            elif event.key == pygame.K_RIGHT:
+                # choses a faire quand c'est la touche fleche de droite
+        elif event.type == pygame.MOUSEBUTTONUP:
+            # choses a faire quand le bouton de la souris est relache
+        elif event.type == pygame.MOUSEBUTTONDOWN:
+            # choses a faire quand le bouton de la souris est pressee
+\end{lstlisting}
+
+De manière générale, le nom des touches de clavier sont faite sur le même modèle: \texttt{K\_\#\#\#} où on remplace les \texttt{\#} par le nom de la touche.
+\begin{itemize}
+    \item Touche flèche du haut: \texttt{K\_UP}
+    \item Touche E: \texttt{K\_E}
+    \item Touche entrée: \texttt{K\_ESCAPE}
+\end{itemize}
+
+Quelques méthodes pratiques pour manipuler la souris
+
+\begin{itemize}
+    \item \texttt{pygame.mouse.get\_pos()} : connaître la position de la souris sur la fenêtre.
+    \item \texttt{pygame.mouse.set\_pos((x,y))}: déplacer la souris à un endroit.
+\end{itemize}
+
+
+\end{document}
+
+%%% Local Variables:
+%%% mode: latex
+%%% TeX-master: "master"
+%%% End:

1NSI/00_Projets/draw.py

@@ -0,0 +1,66 @@
+import pygame, sys
+
+pygame.init()
+
+windowSurface = pygame.display.set_mode((500, 400))
+pygame.display.set_caption('Hello world!')
+
+BLACK = (0, 0, 0)
+WHITE = (255, 255, 255)
+RED = (255, 0, 0)
+GREEN = (0, 255, 0)
+BLUE = (0, 0, 255)
+
+color_text = WHITE
+color_background = WHITE
+color_polygon = GREEN
+color_border = RED
+
+running = True
+while running:
+
+    windowSurface.fill(color_background)
+
+    pygame.draw.polygon(windowSurface, color_polygon,
+            ((146, 0), (291, 106), (236, 277), (56, 277), (0, 106))
+            )
+
+    pygame.draw.line(windowSurface, BLUE, (60, 60), (120, 60), 4)
+    pygame.draw.line(windowSurface, BLUE, (120, 60), (60, 120))
+    pygame.draw.line(windowSurface, BLUE, (60, 120), (120, 120), 4)
+
+    pygame.draw.circle(windowSurface, BLUE, (300, 50), 20, 0)
+
+    pygame.draw.ellipse(windowSurface, RED, (300, 250, 40,80), 1)
+
+    basic_font = pygame.font.SysFont(None, 48)
+    text = basic_font.render('Hello world!', True, color_text ,BLUE)
+    text_rect = text.get_rect()
+    text_rect.centerx = windowSurface.get_rect().centerx
+    text_rect.centery = windowSurface.get_rect().centery
+
+    pygame.draw.rect(windowSurface, color_border,
+            (text_rect.left - 20, text_rect.top - 20,
+                text_rect.width + 40, text_rect.height + 40)
+            )
+
+
+    windowSurface.blit(text, text_rect)
+
+    pygame.display.update()
+
+    for event in pygame.event.get():
+        if event.type == pygame.QUIT:
+            running = False
+        elif event.type == pygame.MOUSEBUTTONUP:
+            color_background = WHITE
+            color_border = (255, (color_border[1] + 10) % 256, 0)
+        elif event.type == pygame.MOUSEBUTTONDOWN:
+            color_background = RED
+        elif event.type == pygame.KEYUP:
+            if event.key == pygame.K_UP:
+                color_polygon = BLACK
+            elif event.key == pygame.K_DOWN:
+                color_polygon = GREEN
+
+pygame.quit()

1NSI/00_Projets/draw_example.py

@@ -0,0 +1,83 @@
+# Import a library of functions called 'pygame'
+import pygame
+from math import pi
+
+# Initialize the game engine
+pygame.init()
+
+# Define the colors we will use in RGB format
+BLACK = (  0,   0,   0)
+WHITE = (255, 255, 255)
+BLUE =  (  0,   0, 255)
+GREEN = (  0, 255,   0)
+RED =   (255,   0,   0)
+
+# Set the height and width of the screen
+size = [400, 300]
+screen = pygame.display.set_mode(size)
+
+pygame.display.set_caption("Example code for the draw module")
+
+#Loop until the user clicks the close button.
+done = False
+clock = pygame.time.Clock()
+
+while not done:
+
+    # This limits the while loop to a max of 10 times per second.
+    # Leave this out and we will use all CPU we can.
+    clock.tick(10)
+
+    for event in pygame.event.get(): # User did something
+        if event.type == pygame.QUIT: # If user clicked close
+            done=True # Flag that we are done so we exit this loop
+
+    # All drawing code happens after the for loop and but
+    # inside the main while done==False loop.
+
+    # Clear the screen and set the screen background
+    screen.fill(WHITE)
+
+    # Draw on the screen a GREEN line from (0,0) to (50.75)
+    # 5 pixels wide.
+    pygame.draw.line(screen, GREEN, [0, 0], [50,30], 5)
+
+    # Draw on the screen a GREEN line from (0,0) to (50.75)
+    # 5 pixels wide.
+    pygame.draw.lines(screen, BLACK, False, [[0, 80], [50, 90], [200, 80], [220, 30]], 5)
+
+    # Draw on the screen a GREEN line from (0,0) to (50.75)
+    # 5 pixels wide.
+    pygame.draw.aaline(screen, GREEN, [0, 50],[50, 80], True)
+
+    # Draw a rectangle outline
+    pygame.draw.rect(screen, BLACK, [75, 10, 50, 20], 2)
+
+    # Draw a solid rectangle
+    pygame.draw.rect(screen, BLACK, [150, 10, 50, 20])
+
+    # Draw an ellipse outline, using a rectangle as the outside boundaries
+    pygame.draw.ellipse(screen, RED, [225, 10, 50, 20], 2)
+
+    # Draw an solid ellipse, using a rectangle as the outside boundaries
+    pygame.draw.ellipse(screen, RED, [300, 10, 50, 20])
+
+    # This draws a triangle using the polygon command
+    pygame.draw.polygon(screen, BLACK, [[100, 100], [0, 200], [200, 200]], 5)
+
+    # Draw an arc as part of an ellipse.
+    # Use radians to determine what angle to draw.
+    pygame.draw.arc(screen, BLACK,[210, 75, 150, 125], 0, pi/2, 2)
+    pygame.draw.arc(screen, GREEN,[210, 75, 150, 125], pi/2, pi, 2)
+    pygame.draw.arc(screen, BLUE, [210, 75, 150, 125], pi,3*pi/2, 2)
+    pygame.draw.arc(screen, RED,  [210, 75, 150, 125], 3*pi/2, 2*pi, 2)
+
+    # Draw a circle
+    pygame.draw.circle(screen, BLUE, [60, 250], 40)
+
+    # Go ahead and update the screen with what we've drawn.
+    # This MUST happen after all the other drawing commands.
+    pygame.display.update()
+
+# Be IDLE friendly
+pygame.quit()

1NSI/00_Projets/index.rst

@@ -0,0 +1,95 @@
+Projets
+#######
+
+:date: 2022-12-06
+:modified: 2022-12-06
+:authors: Benjamin Bertrand
+:tags: Divers
+:category: 1NSI
+:summary: Projets avec les 1NSI
+:slug: divers_1NSI
+
+Le programme
+============
+
+- Une part de l’horaire de l’enseignement d’au moins un quart du total en classe de première doit être réservée à la conception et à l’élaboration de projets conduits par des groupes de deux à quatre élèves.
+- La gestion d’un projet inclut des points d’étape pour faire un bilan avec le professeur, valider des éléments, contrôler l’avancement du projet ou adapter ses objectifs, voire le redéfinir partiellement, afin de maintenir la motivation des élèves.
+
+Du coup, on part sur une heure par semaine dédié au projet.
+
+Organisation
+============
+
+Je m'inspire de la gestion de projet proposée par Jean-Luc Richter (je n'arrive pas à remettre la main sur l'article où il détaillait ça...).
+
+Trimestre 1: présentation/vente du projet
+-----------------------------------------
+
+Les deux premières semaines sont consacrés à découvrir/chercher des projets déjà réalisé par d'autres élèves de première et à choisir un projet qui motive l'élève. Une banque à projets sourcées est constitué. Les groupes sont ensuite constitués en fonction des intérêts de chacun.
+
+Les élèves ensuite se lancent dans la réalisation d'un site internet vantant/vendant leur projet. Ils peuvent promettre ceux qu'ils veulent tant pis s'il ne le réalise pas. Ils doivent faire un site qui claque le plus et qui donne envie de voir le projet réalisé.
+
+Pour l'organisation, on a choisi d'utiliser un Kanban. Les séances projets commencent avec la lecture des taches déjà réalisées, en cours ou à faire. Ils peuvent ajouter d'autres. Puis ils sélectionnent les taches qu'ils vont réalisé pendant l'heure. Ces taches sont disposés sur le tableau dans les colonnes appropriés. Les élèves partent ensuite faire leur projet, en avançant les taches. A la fin, un bilan est réalisé et les taches mises à jour. Mon role ici est d'accompagner les élèves à écrire et sélectionner les taches puis de les garder le plus concentré possible sur ce qu'ils ont décidé de faire.
+
+A la fin du trimestre, le site est déposé sur le serveur pour notation.
+
+Barème:
+
+- Présentation:
+  - Clareté /3
+  - Fait envie /2
+- Technique
+  - Validité du code /2
+  - Mobilisation des outils étudiées en html et css /6
+  - Nouveau outils découverts /2
+- Organisation
+  - autonomie dans le travail /2
+  - Collaboration dans l'équipe /2
+  - Précision des taches à réaliser /1
+
+Trimestre 2: Première ébauche du projet
+---------------------------------------
+
+Le deuxième trimestre a pour but de réaliser une première version rustique du projet. Les élèves devront être capable de faire une démonstration.
+
+On commence par une introduction à Pygame sur deux semaines. On verra plus tard pour une introduction à flask et javascript.
+
+Introduction à Pygame: snake
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+Les élèves travaillent sur `le programme draw.py <./draw.py>`_.
+
+Ils doivent l'exécuter, commenter chaque ligne en expliquant ce qu'il s'y passe et se construire un mémo des fonctions de Pygame.
+
+Ils sont très fortement invités à modifier le programme pour se l'approprier.
+
+On coupera régulièrement la séance pour faire des petits bilans sur les questions intéressantes que se posent les élèves. Voici quelques sujets qui seront sans aucuns doutes traités :
+ - La couleur et le code RGB
+ - Le repère et les coordonnées dans Pygame
+ - Les coordonnées dans les fonctions pour tracer les éléments
+ - la gestion des évènements
+
+.. image:: ./doc_pygame.pdf
+    :height: 200px
+    :alt: Documentation maison sur pygame
+
+
+Le but est de refaire le `jeu snake <./snake.pdf>`_.
+
+Ce projet est décomposer en étapes. Les premières sont à faire dans l'ordre mais on peut laisser à partir de l'étape 4 la liberté aux élèves d'ajouter des étapes ou de faire les étapes dans l'ordre qui leur convient le mieux.
+
+.. image:: ./snake.pdf
+    :height: 200px
+    :alt: Propositions d'étapes pour réaliser snake
+
+
+Pour les accompagner, on peut leur donner `ce modèle <./pygame_base.py>`_ pour commencer un projet Pygame.
+
+Une "correction" et quelques éléments sur la géométrie de la fenêtre :
+
+ - `snake version avancé <./snake_corr.py>`_ (Il y a potentiellement encore des milliers de choses à ajouter !)
+ - `Explication sur la géométrie de la fenêtre <./snake_expl.pdf>`_
+
+
+Trimestre 3: Version la plus aboutie possible du projet
+-------------------------------------------------------

1NSI/00_Projets/pygame_base.py

@@ -0,0 +1,30 @@
+# Importation de pygame
+import pygame
+
+pygame.init()
+
+# Initialisation de la fenetre
+largeur = 600
+hauteur = 400
+windowSurface = pygame.display.set_mode((largeur, hauteur), 0,32)
+
+# Initialisation des parametres
+
+
+# Boucle de jeu
+clock = pygame.time.Clock()
+running = True
+while running:
+    # Limitation du nombre de tours de boucle par seconde.
+    clock.tick(10)
+    # Boucle des evenements
+    for event in pygame.event.get():
+        if event.type == pygame.QUIT:
+            running = False
+
+    # Elements a tracer
+
+    pygame.display.update()
+
+
+pygame.quit()

1NSI/00_Projets/snake.tex

@@ -0,0 +1,44 @@
+\documentclass[a4paper,12pt]{article}
+\usepackage{myXsim}
+
+\date{Décembre 2022}
+\title{Jeu Snake}
+\tribe{ISN}
+
+\pagestyle{empty}
+\begin{document}
+
+\maketitle
+
+\bigskip
+
+Le but de cette activité est de (re)créer le jeu snake en python avec Pygame.
+
+
+\begin{center}
+    \includegraphics[scale=0.6]{./fig/snake_internet.png}
+\end{center}
+
+D'après Wikipédia:
+
+\begin{quote}
+    Le joueur contrôle une longue et fine ligne semblable à un serpent, qui doit slalomer entre les bords de l'écran et les obstacles qui parsèment le niveau. Pour gagner chacun des niveaux, le joueur doit faire manger à son serpent un certain nombre de pastilles similaire à de la nourriture, allongeant à chaque fois la taille du serpent. Alors que le serpent avance inexorablement, le joueur ne peut que lui indiquer une direction à suivre (en haut, en bas, à gauche, à droite) afin d'éviter que la tête du serpent ne touche les murs ou son propre corps, auquel cas il risque de mourir.
+\end{quote}
+
+\section*{Proposition d'étapes à suivre}
+
+\begin{enumerate}
+    \item \textbf{Scène et acteurs:} Afficher le nom du jeu (sans la partie statistique et contrôles), la grille de jeu et notre serpent (jusqu'à l'étape 6, le serpent ne fera qu'une seule case).
+    \item \textbf{Contrôles}: Faire déplacer le serpent avec les flèches du clavier.
+    \item \textbf{Déplacement et contrôles:} Dans le jeu Snake, le serpent ne s'arrête jamais. Le joueur peut seulement changer la direction du serpent avec les touches du clavier. Programmer ce comportement. Penser à ajouter ajouter un texte qui explique comment jouer.
+    \item \textbf{Game Over:} Le jeu annonce Game Over et s'arrête quand le serpent sort de la grille de jeu.
+    \item \textbf{La nourriture:} La nourriture apparait aléatoirement sur la grille. Dès que le serpent arrive sur cette case, il gagne un point et la nourriture apparait ailleurs. Les points s'affichent sur le côté.
+    \item \textbf{Un beau serpent:} Le serpent faire 3 cases de long. À chaque fois qu'il mange, il grandit d'une case. S'il se déplace sur sa queue, la partie est terminée.
+\end{enumerate}
+
+\end{document}
+
+%%% Local Variables:
+%%% mode: latex
+%%% TeX-master: "master"
+%%% End:

1NSI/00_Projets/snake_corr.py

@@ -0,0 +1,180 @@
+"""
+ Snake pour l'ISN
+
+"""
+
+import pygame
+from random import randint
+
+def draw_grid():
+    """ Dessine la grille """
+    for i in range(COLUMN+1):
+        pygame.draw.line(screen, WHITE, (i*CELLSIZE, 0), (i*CELLSIZE, ROW*CELLSIZE))
+    for i in range(ROW+1):
+        pygame.draw.line(screen, WHITE, (0, i*CELLSIZE), (COLUMN*CELLSIZE, i*CELLSIZE))
+
+def draw_snake(snake):
+    """ Dessine le serpent """
+    for i, j in snake:
+        top_left = (i * CELLSIZE, j * CELLSIZE)
+        pygame.draw.rect(screen, GREEN, (*top_left, CELLSIZE, CELLSIZE))
+
+def draw_cherry(cherry):
+    """ Dessine les cherry (bonus) """
+    center = (int((cherry[0] + 0.5) * CELLSIZE), int((cherry[1] + 0.5) * CELLSIZE))
+    radius = int(0.5*CELLSIZE)
+    pygame.draw.circle(screen, RED, center, radius)
+
+def draw_right(score):
+    """ Dessine la partie droite de la fenête """
+    width_right_bar = s_width - COLUMN*CELLSIZE
+    top_left_right_bar = (COLUMN*CELLSIZE, 0)
+    title = TITLEFONT.render("SNAKE", True, WHITE)
+    title_rect = title.get_rect()
+    title_rect.centerx = int(top_left_right_bar[0] + width_right_bar/2)
+    title_rect.centery = 50
+    screen.blit(title, title_rect)
+
+    score_text = "Score " + str(score)
+    score = TEXTFONT.render(score_text, True, WHITE)
+    score_rect = score.get_rect()
+    score_rect.centerx = int(top_left_right_bar[0] + width_right_bar/2)
+    score_rect.centery = 100
+    screen.blit(score, score_rect)
+
+def random_place(row, col):
+    """ Retourne un lieu aléatoire sur la grille """
+    return [randint(0, row-1), randint(0, col-1)]
+
+def move_snake(snake, snake_direction, growing):
+    """ Retourne la nouvelle position du snake
+
+    Si growing est True, on ne supprime par le dernier élément de la queue pour que le serpent grandisse
+
+    L'idée est de trouver les coordonnées de la nouvelle tête (new_head) puis de coller le corp du serpent (en supprimant la dernière partie si l'on veut que le serpent de grandisse pas.
+
+    """
+    new_head = [snake[0][0] + snake_direction[0], snake[0][1] + snake_direction[1]]
+    if growing:
+        return [new_head] + snake
+    else:
+        # [:-1] permet de dire que l'on veut la liste sauf le dernier élément.
+        return [new_head] + snake[:-1]
+
+def is_out(snake):
+    """ Retourne True si le snake est sorti de la grille """
+    # le snake[0] est la tête du serpent.
+    return snake[0][0] > COLUMN or \
+            snake[0][0] < 0 or \
+            snake[0][1] > ROW or\
+            snake[0][1] < 0
+
+def is_eating_queue(snake):
+    """ Retourne True si le serpent se mort la queue """
+    # On se demande si la tête du serpent est dans (in) la queue dans ce cas il se mort la queue
+    return snake[0] in snake[1:]
+
+def is_eating(snake, cherry):
+    """ Retroune True si le snake mange la cherry"""
+    return snake[0] == cherry
+
+# Call this function so the Pygame library can initialize itself
+pygame.init()
+
+# --- Globals ---
+# Colors
+BLACK = (0, 0, 0)
+GREEN = (0, 255, 0)
+RED = (255, 0, 0)
+WHITE = (255, 255, 255)
+# font
+TITLEFONT = pygame.font.SysFont(None, 48)
+TEXTFONT = pygame.font.SysFont(None, 30)
+
+# THE GRID
+ROW = 20
+COLUMN = 20
+
+# CELL
+CELLSIZE = 20
+
+# Create an 800x600 sized screen
+s_width = COLUMN * CELLSIZE + 200
+s_height = ROW * CELLSIZE + 1
+screen = pygame.display.set_mode([s_width, s_height])
+
+# Set the title of the window
+pygame.display.set_caption('Snake')
+
+clock = pygame.time.Clock()
+
+# The snake
+snake = [[5, 5], [4, 5], [3, 5]]
+snake_direction = [1, 0]
+
+# The cherry
+cherry = random_place(ROW, COLUMN)
+
+# The score
+score = 0
+growing = False
+
+running = True
+while running:
+    # Event loop
+    for event in pygame.event.get():
+        if event.type == pygame.QUIT:
+            running = False
+        elif event.type == pygame.KEYUP:
+            # On empèche que le snake fasse demi tour
+            if event.key == pygame.K_UP:
+                if snake_direction != [0, 1]:
+                    snake_direction = [0, -1]
+            elif event.key == pygame.K_DOWN:
+                if snake_direction != [0, -1]:
+                    snake_direction = [0, 1]
+            elif event.key == pygame.K_LEFT:
+                if snake_direction != [1, 0]:
+                    snake_direction = [-1, 0]
+            elif event.key == pygame.K_RIGHT:
+                if snake_direction != [-1, 0]:
+                    snake_direction = [1, 0]
+
+    # Move the snake
+    if growing:
+        snake = move_snake(snake, snake_direction, True)
+        growing = False
+    else:
+        snake = move_snake(snake, snake_direction, False)
+
+    # Draw elements
+    screen.fill(BLACK)
+    draw_grid()
+    draw_right(score)
+    draw_snake(snake)
+    draw_cherry(cherry)
+
+    # Flip screen
+    pygame.display.flip()
+
+    if is_eating(snake, cherry):
+        score = score + 1
+        growing = True
+        cherry = random_place(ROW, COLUMN)
+
+    # loosing!
+    if is_out(snake) or is_eating_queue(snake):
+        screen.fill(BLACK)
+        text = TITLEFONT.render('You loose!!', True, BLACK,WHITE)
+        textRect = text.get_rect()
+        textRect.centerx = screen.get_rect().centerx
+        textRect.centery = screen.get_rect().centery
+        screen.blit(text, textRect)
+        pygame.display.flip()
+        pygame.time.wait(1000)
+        running = False
+
+    # Pause
+    clock.tick(2)
+
+pygame.quit()

1NSI/00_Projets/snake_expl.svg

@@ -0,0 +1,311 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   viewBox="0 0 801.33331 570.66669"
+   height="570.66669"
+   width="801.33331"
+   id="svg869"
+   version="1.1"
+   sodipodi:docname="snake_expl.svg"
+   inkscape:version="0.92.2 2405546, 2018-03-11">
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1052"
+     id="namedview48"
+     showgrid="false"
+     inkscape:zoom="1.1697"
+     inkscape:cx="323.7925"
+     inkscape:cy="206.6537"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg869" />
+  <metadata
+     id="metadata875">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs873">
+    <marker
+       inkscape:stockid="Arrow1Mend"
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="Arrow1Mend"
+       style="overflow:visible;"
+       inkscape:isstock="true">
+      <path
+         id="path986"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.4) rotate(180) translate(10,0)" />
+    </marker>
+    <marker
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="marker8051"
+       style="overflow:visible;">
+      <path
+         id="path8049"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.8) rotate(180) translate(12.5,0)" />
+    </marker>
+    <marker
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="marker7709"
+       style="overflow:visible">
+      <path
+         id="path7707"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.8) translate(12.5,0)" />
+    </marker>
+    <marker
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="marker7395"
+       style="overflow:visible">
+      <path
+         id="path7393"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.8) translate(12.5,0)" />
+    </marker>
+    <marker
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="marker7379"
+       style="overflow:visible;">
+      <path
+         id="path7377"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.8) rotate(180) translate(12.5,0)" />
+    </marker>
+    <marker
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="marker7119"
+       style="overflow:visible;">
+      <path
+         id="path7117"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         transform="scale(0.8) rotate(180) translate(12.5,0)" />
+    </marker>
+    <marker
+       style="overflow:visible;"
+       id="marker1407"
+       refX="0.0"
+       refY="0.0"
+       orient="auto">
+      <path
+         transform="scale(0.8) rotate(180) translate(12.5,0)"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         id="path1405" />
+    </marker>
+    <marker
+       style="overflow:visible"
+       id="marker1237"
+       refX="0.0"
+       refY="0.0"
+       orient="auto">
+      <path
+         transform="scale(0.8) translate(12.5,0)"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         id="path1235" />
+    </marker>
+    <marker
+       style="overflow:visible;"
+       id="Arrow1Lend"
+       refX="0.0"
+       refY="0.0"
+       orient="auto">
+      <path
+         transform="scale(0.8) rotate(180) translate(12.5,0)"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         id="path928" />
+    </marker>
+    <marker
+       style="overflow:visible"
+       id="Arrow1Lstart"
+       refX="0.0"
+       refY="0.0"
+       orient="auto">
+      <path
+         transform="scale(0.8) translate(12.5,0)"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         id="path925" />
+    </marker>
+    <marker
+       style="overflow:visible"
+       id="Arrow1Mstart"
+       refX="0.0"
+       refY="0.0"
+       orient="auto">
+      <path
+         transform="scale(0.4) translate(10,0)"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;stroke-opacity:1;fill:#000000;fill-opacity:1"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         id="path931" />
+    </marker>
+  </defs>
+  <image
+     sodipodi:absref="/home/lafrite/Cours/Prof/Enseignements/2017-2018/ISN/pygame/fig/snake_corr.png"
+     xlink:href="fig/snake_corr.png"
+     y="109.27795"
+     x="144.4212"
+     id="image877"
+     preserveAspectRatio="none"
+     height="352.11078"
+     width="494.43591" />
+  <path
+     id="path879"
+     d="M 145.96232,87.695672 H 637.31601"
+     style="fill:none;stroke:#000000;stroke-width:1.00157475;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:url(#Arrow1Lstart);marker-end:url(#Arrow1Lend)" />
+  <path
+     id="path881"
+     d="M 648.04522,135.73483 V 462.01432"
+     style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:url(#marker1237);marker-end:url(#marker1407)" />
+  <g
+     id="g917">
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:16px;line-height:1;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+       x="132.58679"
+       y="143.47269"
+       id="text885"><tspan
+         x="132.58679"
+         y="143.47269"
+         id="tspan887"
+         style="font-size:13.33333302px;line-height:1">0</tspan><tspan
+         x="132.58679"
+         y="159.47269"
+         style="font-size:13.33333302px;line-height:1"
+         id="tspan893">1</tspan><tspan
+         x="132.58679"
+         y="175.47269"
+         id="tspan889"
+         style="font-size:13.33333302px;line-height:1">2</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:13.33333302px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+       x="115.35721"
+       y="456.22137"
+       id="text897"><tspan
+         id="tspan895"
+         x="115.35721"
+         y="456.22137">ROW</tspan></text>
+  </g>
+  <text
+     id="text901"
+     y="479.93118"
+     x="152.74573"
+     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:16px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+     xml:space="preserve"><tspan
+       y="491.57919"
+       x="152.74573"
+       id="tspan899" /></text>
+  <g
+     id="g923">
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:16px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:-1.29999995px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+       x="148.18616"
+       y="474.45969"
+       id="text905"><tspan
+         id="tspan903"
+         x="148.18616"
+         y="474.45969">0 1 2</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:16px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+       x="439.54291"
+       y="474.12369"
+       id="text909"><tspan
+         id="tspan907"
+         x="439.54291"
+         y="474.12369">COLUMN</tspan></text>
+  </g>
+  <text
+     id="text1743"
+     y="77.378532"
+     x="357.61792"
+     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:16px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+     xml:space="preserve"><tspan
+       y="77.378532"
+       x="357.61792"
+       id="tspan1741">s_width</tspan></text>
+  <text
+     id="text1747"
+     y="288.85159"
+     x="671.25879"
+     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:16px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+     xml:space="preserve"><tspan
+       y="288.85159"
+       x="671.25879"
+       id="tspan1745">s_height</tspan></text>
+  <text
+     id="text7577"
+     y="274.75037"
+     x="64.289993"
+     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:13.33333302px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+     xml:space="preserve"><tspan
+       y="274.75037"
+       x="64.289993"
+       id="tspan7575">CELLSIZE</tspan></text>
+  <path
+     style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:url(#Arrow1Mstart);marker-end:url(#Arrow1Mend)"
+     d="m 132.51261,263.9641 v 14.31991"
+     id="path915"
+     inkscape:connector-curvature="0" />
+  <path
+     style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:url(#marker1237);marker-end:url(#marker7119)"
+     d="M 479.61017,497.14356 H 636.06055"
+     id="path1319"
+     inkscape:connector-curvature="0" />
+  <text
+     xml:space="preserve"
+     style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:13.33333302px;line-height:1.25;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace;-inkscape-font-specification:'Consolas, Liberation Mono, Menlo, Courier, monospace';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+     x="496.70856"
+     y="519.37146"
+     id="text1323"><tspan
+       sodipodi:role="line"
+       id="tspan1321"
+       x="496.70856"
+       y="519.37146">width_right_bar</tspan></text>
+</svg>

1NSI/index.rst

@@ -2,7 +2,7 @@ Spécialité première NSI
 #######################
 
 :date: 2022-07-25
-:modified: 2022-12-02
+:modified: 2022-12-06
 :authors: Bertrand Benjamin
 :category: 1NSI
 :tags: Progression
@@ -15,6 +15,11 @@ On va essayer de suivre une progression de séquences sur l'année et de traiter
 Progression des séquences
 =========================
 
+.. big_button::
+   :title: Projets
+   :link: ./00_Projets/
+
+
 Période 1
 ---------
 
@@ -26,32 +31,22 @@ Période 1
    :title: Bases de la programmation en python avec microbit
    :link: ./02_Programmation_Python_et_microbit/
 
+.. big_button::
+   :title: Représentation d'entiers en binaire
+
+.. big_button::
+   :title: Booléen et table de vérité
+
+Période 2
+---------
 
 .. big_button::
    :title: Système d'exploitation
    :link: ./03_Systeme_dexploitation/
 
-.. big_button::
-   :title: Représentation d'entiers en binaire
-   :link: ./04_Fonctions_specifications_et_tests/
-
-Période 2
----------
-
-.. big_button::
-   :title: Architecture réseau
-
 .. big_button::
    :title: Fonction et spécification
-
-.. big_button::
-   :title: Représentation d'un texte
-
-.. big_button::
-   :title: Tuple et array
-
-.. big_button::
-   :title: Recherche dans une liste
+   :link: ./04_Fonctions_specifications_et_tests/
 
 Période 3
 ---------
@@ -59,9 +54,27 @@ Période 3
 .. big_button::
    :title: Interaction client/serveur
 
+.. big_button::
+   :title: Tuple et array
+
+.. big_button::
+   :title: Représentation d'un texte
+
+.. big_button::
+   :title: Interaction home machine (javascript)
+
+Période 4
+---------
+
 .. big_button::
    :title: Représentation des flottants
 
+.. big_button::
+   :title: Architecture réseau
+
+.. big_button::
+   :title: Recherche dans une liste
+
 .. big_button::
    :title: Tris
 
@@ -71,15 +84,6 @@ Période 3
 .. big_button::
    :title: Dictionnaires
 
-Période 4
----------
-
-.. big_button::
-   :title: Booléen et table de vérité
-
-.. big_button::
-   :title: Interaction home machine (javascript)
-
 .. big_button::
    :title: I/O informatique embarquée
 
@@ -98,32 +102,6 @@ Période 5
 .. big_button::
     :title: Algorithmes gloutons
 
-Progression du/des projets
-==========================
-
-Trimestre 1
------------
-
-Recherche et partage d'idées de projets.
-Constitution des groupes
-
-Présentation HTML du projet (évalué)
-
-Trimestre 2
------------
-
-Planification du projet et début de réalisation
-
-Première version du projet et l'organisation (évalué)
-
-Trimestre 3
------------
-
-Suite et fin du projet.
-Construction d'une présentation
-
-Présentation évaluée
-
 Ressources pour l'auto-apprentissage
 ====================================