Introduction

Installation

Limitations du protocole "file"

Questions fréquemment posées

Syntaxe, mots-clés et fonctions intégrées

Distribution standard

Implémentation de import

Packages Brython

Interface avec le navigateur

Introduction - API DOM
Créer un document
Accéder aux éléments
Attributs, propriétés et méthodes

Evénements
Evénements souris
Evénements clavier
Evénements focus
Evénements pour glisser-déposer

Chaine de requête

Interactions avec Javascript

Modules intégrés propres à Brython

browser
browser.aio
browser.ajax
browser.html
browser.local_storage
browser.markdown
browser.object_storage
browser.session_storage
browser.svg
browser.template
browser.timer
browser.webcomponent
browser.websocket
browser.worker

Widgets
browser.widgets.dialog
browser.widgets.menu

interpreter
javascript

Travailler avec Brython

Options d'exécution
Test et débogage
Deployer une application

Recettes

Salut !
Insérer du contenu dans un élément
Mise en forme HTML (gras, italique...)
Table HTML
Attacher / détacher des événements
Gérer la sélection d'options dans un SELECT
Glisser-déposer
Obtenir le contenu d'un élément
Lire le contenu d'un fichier
Stocker des objets localement
Exemple de onmouseover
 

module browser.timer

Implémente des fonctions pour permettre l'exécution différée ou répétitive de fonctions :

set_timeout(fonction, ms, *args)
exécute fonction(*args) après ms millisecondes. Renvoie un objet utilisable dans la fonction clear_timeout() ci-dessous

Elle repose sur la fonction setTimeout en Javascript : voir la documentation officielle.

Sur cet exemple, la couleur du texte dans la boite noire change après 3 secondes.

from browser import document, timer

def change_color():
    document['st-text'].style.color = "blue"

def press_button(ev):
    timer.set_timeout(change_color, 3000)

document['first-button'].bind('click', press_button)

Cette couleur change au bout de 3s

clear_timeout(timer)
annule l'exécution définie par set_timeout(). Reçoit un argument, la valeur de l'objet retournée par set_timeout().

Elle repose sur la fonction cancelTimeout en Javascript. Voir la documentation officielle.

Reprenons l'exemple précédent. Vous avez maintenant la possibilité d'interrompre l'exécution de l'action avant que les 3 secondes soient écoulées.

from browser import document, timer

idtimer = 1

def change_color_two():
    document['ct-text2'].style.color = "blue"

def press_button_two(ev):
    global idtimer
    idtimer = timer.set_timeout(change_color_two, 3000)

def stop_button(ev):
    timer.clear_timeout(idtimer)

document['ct-start'].bind('click', press_button_two)
document['ct-stop'].bind('click', stop_button)


Cette couleur changera au bout de 3s

set_interval(fonction, ms, *args)
lance l'exécution répétée de fonction(*args) toutes les ms millisecondes. Renvoie un objet utilisable dans la fonction clear_interval() décrite ci-dessous.

Elle repose sur la fonction setInterval de Javascript. Voir la documentation officielle.

Quand c'est possible il est préférable d'éviter de se servir de cette fonction et d'utiliser plutôt request_animation_frame (voir ci-dessous)

clear_interval(timer)
termine l'exécution répétée définie par set_interval()

Elle repose sur la fonction clearInterval de Javascript. Voir la documentation officielle.

Voici un exemple qui utilise set_interval et cancel_interval:

import time
from browser import document, timer

_timer = None
counter = 0

def show():
    document['_timer'].text = '%.2f' %(time.time()-counter)

def start_timer(ev):
    global _timer,counter
    if _timer is None:
        counter = time.time()
        _timer = timer.set_interval(show,10)
        document['start'].text = 'Pause'
    elif _timer == 'hold': # restart
        # restart timer
        counter = time.time()-float(document['_timer'].text)
        _timer = timer.set_interval(show,10)
        document['start'].text = 'Pause'
    else: # hold
        timer.clear_interval(_timer)
        _timer = 'hold'
        document['start'].text = 'Redémarrer'

def stop_timer(ev):
    global _timer
    timer.clear_interval(_timer)
    _timer = None
    t = 0
    document['_timer'].text = '%.2f' %0
    document['start'].text = 'Démarrer'

document['start'].bind('click', start_timer)
document['stop'].bind('click', stop_timer)


0.00

request_animation_frame(function)
provoque l'exécution répétée de la fonction en laissant le navigateur gérer la mise à jour. fonction prend un argument non significatif

Elle repose sur la fonction requestAnimationFrame de Javascript. Voir la documentation officielle.

cancel_animation_frame(id)
annule l'exécution répétée de la fonction définie par request_animation_frame() ; id est l'objet retourné par request_animation_frame()

Elle repose sur la fonction cancelAnimationFrame de Javascript. Voir la documentation officielle.

Voici un exemple dans lequel on utilise request_animation_frame et cancel_animation_frame :

from browser.timer import request_animation_frame as raf
from browser.timer import cancel_animation_frame as caf
from browser import document
import time
from browser.html import CANVAS, BUTTON
import math

ctx = document['raf-canvas'].getContext( '2d' )

toggle = True

def draw():
    t = time.time() * 3
    x = math.sin(t) * 96 + 128
    y = math.cos(t * 0.9) * 96 + 128
    global toggle
    if toggle:
        toggle = False
    else:
        toggle = True
    ctx.fillStyle = 'rgb(200,200,20)' if toggle else 'rgb(20,20,200)'
    ctx.beginPath()
    ctx.arc( x, y, 6, 0, math.pi * 2, True)
    ctx.closePath()
    ctx.fill()

def animate(i):
    global id
    id = raf(animate)
    draw()

def stop(i):
    global id
    caf(id)

document['btn-animate'].bind('click', animate)
document['btn-stop'].bind('click', stop)