IntroductionInstallationLimitations du protocole "file"Questions fréquemment poséesSyntaxe, mots-clés et fonctions intégréesDistribution standardImplémentation de importPackages BrythonInterface 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 Objets et librairies 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 BrythonRecettes
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.timerImplémente des fonctions pour permettre l'exécution différée ou répétitive de fonctions :set_timeout(fonction, ms, *args)
exécute
Elle repose sur la fonction
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)
clear_timeout(timer)
annule l'exécution définie par
Elle repose sur la fonction
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)
set_interval(fonction, ms, *args)
lance l'exécution répétée de
Elle repose sur la fonction
Quand c'est possible il est préférable d'éviter de se servir de cette
fonction et d'utiliser plutôt
clear_interval(timer)
termine l'exécution répétée définie par
Elle repose sur la fonction
Voici un exemple qui utilise 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)
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
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
Voici un exemple dans lequel on utilise 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)
|