__pragma__ ('skip')
document = window = Math = Date = 0 # Prevent complaints by optional static checker
__pragma__ ('noskip')
__pragma__ ('noalias', 'clear')
from com.fabricjs import fabric
orthoWidth = 1000
orthoHeight = 750
fieldHeight = 650
enter, esc, space = 13, 27, 32
window.onkeydown = lambda event: event.keyCode != space # Prevent scrolldown on spacebar press
class Attribute: # Attribute in the gaming sense of the word, rather than of an object
 def __init__ (self, game):
 self.game = game # Attribute knows game it's part of
 self.game.attributes.append (self) # Game knows all its attributes
 self.install () # Put in place graphical representation of attribute
 self.reset () # Reset attribute to start position
 
 def reset (self): # Restore starting positions or score, then commit to fabric
 self.commit () # Nothing to restore for the Attribute base class
 
 def predict (self):
 pass
 
 def interact (self):
 pass
 
 def commit (self):
 pass
class Sprite (Attribute): # Here, a sprite is an attribute that can move
 def __init__ (self, game, width, height):
 self.width = width
 self.height = height
 Attribute.__init__ (self, game)
 
 def install (self): # The sprite holds an image that fabric can display
 self.image = __new__ (fabric.Rect ({
 'width': self.game.scaleX (self.width), 'height': self.game.scaleY (self.height),
 'originX': 'center', 'originY': 'center', 'fill': 'white'
 }))
 
 __pragma__ ('kwargs')
 def reset (self, vX = 0, vY = 0, x = 0, y = 0):
 self.vX = vX # Speed
 self.vY = vY
 
 self.x = x # Predicted position, can be commit, no bouncing initially
 self.y = y
 
 Attribute.reset (self)
 __pragma__ ('nokwargs')
 
 def predict (self): # Predict position, do not yet commit, bouncing may alter it
 self.x += self.vX * self.game.deltaT
 self.y += self.vY * self.game.deltaT
 def commit (self): # Update fabric image for asynch draw
 self.image.left = self.game.orthoX (self.x)
 self.image.top = self.game.orthoY (self.y)
 
 def draw (self):
 self.game.canvas.add (self.image)
 
class Paddle (Sprite):
 margin = 30 # Distance of paddles from walls
 width = 10
 height = 100
 speed = 400 # / s
 
 def __init__ (self, game, index):
 self.index = index # Paddle knows its player index, 0 == left, 1 == right
 Sprite.__init__ (self, game, self.width, self.height)
 
 def reset (self): # Put paddle in rest position, dependent on player index
 Sprite.reset (
 self,
 x = orthoWidth // 2 - self.margin if self.index else -orthoWidth // 2 + self.margin,
 y = 0
 )
 
 def predict (self): # Let paddle react on keys
 self.vY = 0
 
 if self.index: # Right player
 if self.game.keyCode == ord ('K'): # Letter K pressed
 self.vY = self.speed
 elif self.game.keyCode == ord ('M'):
 self.vY = -self.speed
 else: # Left player
 if self.game.keyCode == ord ('A'):
 self.vY = self.speed
 elif self.game.keyCode == ord ('Z'):
 self.vY = -self.speed
 
 Sprite.predict (self) # Do not yet commit, paddle may bounce with walls
 def interact (self): # Paddles and ball assumed infinitely thin
 # Paddle touches wall
 self.y = Math.max (self.height // 2 - fieldHeight // 2, Math.min (self.y, fieldHeight // 2 - self.height // 2))
 
 # Paddle hits ball
 if (
 (self.y - self.height // 2) < self.game.ball.y < (self.y + self.height // 2)
 and (
 (self.index == 0 and self.game.ball.x < self.x) # On or behind left paddle
 or
 (self.index == 1 and self.game.ball.x > self.x) # On or behind right paddle
 )
 ):
 self.game.ball.x = self.x # Ball may have gone too far already
 self.game.ball.vX = -self.game.ball.vX # Bounce on paddle
 self.game.ball.speedUp (self)
 
class Ball (Sprite):
 side = 8
 speed = 300 # / s
 
 def __init__ (self, game):
 Sprite.__init__ (self, game, self.side, self.side)
 
 def reset (self): # Launch according to service direction with random angle offset from horizontal
 angle = (
 self.game.serviceIndex * Math.PI # Service direction
 +
 (1 if Math.random () > 0.5 else -1) * Math.random () * Math.atan (fieldHeight / orthoWidth)
 )
 
 Sprite.reset (
 self,
 vX = self.speed * Math.cos (angle),
 vY = self.speed * Math.sin (angle)
 )
 
 def predict (self):
 Sprite.predict (self) # Integrate velocity to position
 
 if self.x < -orthoWidth // 2: # If out on left side
 self.game.scored (1) # Right player scored
 elif self.x > orthoWidth // 2:
 self.game.scored (0)
 
 if self.y > fieldHeight // 2: # If it hits top wall
 self.y = fieldHeight // 2 # It may have gone too far already
 self.vY = -self.vY # Bounce
 elif self.y < -fieldHeight // 2:
 self.y = -fieldHeight // 2
 self.vY = -self.vY
 def speedUp (self, bat):
 factor = 1 + 0.15 * (1 - Math.abs (self.y - bat.y) / (bat.height // 2)) ** 2 # Speed will increase more if paddle hit near centre
 
 if Math.abs (self.vX) < 3 * self.speed:
 self.vX *= factor
 self.vY *= factor 
class Scoreboard (Attribute):
 nameShift = 75
 hintShift = 25
 
 def install (self): # Graphical representation of scoreboard are four labels and a separator line
 self.playerLabels = [__new__ (fabric.Text ('Player {}'.format (name), {
 'fill': 'white', 'fontFamily': 'arial', 'fontSize': '{}' .format (self.game.canvas.width / 30),
 'left': self.game.orthoX (position * orthoWidth), 'top': self.game.orthoY (fieldHeight // 2 + self.nameShift)
 })) for name, position in (('AZ keys:', -7/16), ('KM keys:', 1/16))]
 
 self.hintLabel = __new__ (fabric.Text ('[spacebar] starts game, [enter] resets score', {
 'fill': 'white', 'fontFamily': 'arial', 'fontSize': '{}'.format (self.game.canvas.width / 70),
 'left': self.game.orthoX (-7/16 * orthoWidth), 'top': self.game.orthoY (fieldHeight // 2 + self.hintShift)
 }))
 
 self.image = __new__ (fabric.Line ([
 self.game.orthoX (-orthoWidth // 2), self.game.orthoY (fieldHeight // 2),
 self.game.orthoX (orthoWidth // 2), self.game.orthoY (fieldHeight // 2)
 ],
 {'stroke': 'white'}
 ))
 
 def increment (self, playerIndex):
 self.scores [playerIndex] += 1
 
 def reset (self):
 self.scores = [0, 0]
 Attribute.reset (self) # Only does a commit here
 
 def commit (self): # Committing labels is adapting their texts
 self.scoreLabels = [__new__ (fabric.Text ('{}'.format (score), {
 'fill': 'white', 'fontFamily': 'arial', 'fontSize': '{}'.format (self.game.canvas.width / 30),
 'left': self.game.orthoX (position * orthoWidth), 'top': self.game.orthoY (fieldHeight // 2 + self.nameShift)
 })) for score, position in zip (self.scores, (-2/16, 6/16))]
 def draw (self):
 for playerLabel, scoreLabel in zip (self.playerLabels, self.scoreLabels):
 self.game.canvas.add (playerLabel)
 self.game.canvas.add (scoreLabel)
 self.game.canvas.add (self.hintLabel)
 self.game.canvas.add (self.image)
 
class Game:
 def __init__ (self):
 self.serviceIndex = 1 if Math.random () > 0.5 else 0 # Index of player that has initial service
 self.pause = True # Start game in paused state
 self.keyCode = None
 
 self.textFrame = document.getElementById ('text_frame')
 self.canvasFrame = document.getElementById ('canvas_frame')
 self.buttonsFrame = document.getElementById ('buttons_frame')
 
 self.canvas = __new__ (fabric.Canvas ('canvas', {'backgroundColor': 'black', 'originX': 'center', 'originY': 'center'}))
 self.canvas.onWindowDraw = self.draw # Install draw callback, will be called asynch
 self.canvas.lineWidth = 2
 self.canvas.clear () 
 self.attributes = [] # All attributes will insert themselves here
 self.paddles = [Paddle (self, index) for index in range (2)] # Pass game as parameter self
 self.ball = Ball (self)
 self.scoreboard = Scoreboard (self) 
 window.setInterval (self.update, 10) # Install update callback, time in ms
 window.setInterval (self.draw, 20) # Install draw callback, time in ms
 window.addEventListener ('keydown', self.keydown)
 window.addEventListener ('keyup', self.keyup)
 
 self.buttons = []
 
 for key in ('A', 'Z', 'K', 'M', 'space', 'enter'):
 button = document.getElementById (key)
 button.addEventListener ('mousedown', (lambda aKey: lambda: self.mouseOrTouch (aKey, True)) (key)) # Returns inner lambda
 button.addEventListener ('touchstart', (lambda aKey: lambda: self.mouseOrTouch (aKey, True)) (key))
 button.addEventListener ('mouseup', (lambda aKey: lambda: self.mouseOrTouch (aKey, False)) (key))
 button.addEventListener ('touchend', (lambda aKey: lambda: self.mouseOrTouch (aKey, False)) (key))
 button.style.cursor = 'pointer'
 button.style.userSelect = 'none'
 self.buttons.append (button)
 
 self.time = + __new__ (Date)
 
 window.onresize = self.resize
 self.resize ()
 
 def install (self):
 for attribute in self.attributes:
 attribute.install ()
 
 def mouseOrTouch (self, key, down):
 if down:
 if key == 'space':
 self.keyCode = space
 elif key == 'enter':
 self.keyCode = enter
 else:
 self.keyCode = ord (key)
 else:
 self.keyCode = None
 
 def update (self): # Note that update and draw are not synchronized
 oldTime = self.time
 self.time = + __new__ (Date)
 self.deltaT = (self.time - oldTime) / 1000.
 
 if self.pause: # If in paused state
 if self.keyCode == space: # If spacebar hit
 self.pause = False # Start playing
 elif self.keyCode == enter: # Else if enter hit
 self.scoreboard.reset () # Reset score
 else: # Else, so if in active state
 for attribute in self.attributes: # Compute predicted values
 attribute.predict ()
 
 for attribute in self.attributes: # Correct values for bouncing and scoring
 attribute.interact ()
 
 for attribute in self.attributes: # Commit them to pyglet for display
 attribute.commit ()
 
 def scored (self, playerIndex): # Player has scored
 self.scoreboard.increment (playerIndex) # Increment player's points
 self.serviceIndex = 1 - playerIndex # Grant service to the unlucky player
 
 for paddle in self.paddles: # Put paddles in rest position
 paddle.reset ()
 
 self.ball.reset () # Put ball in rest position
 self.pause = True # Wait for next round
 
 def commit (self):
 for attribute in self.attributes:
 attribute.commit ()
 
 def draw (self):
 self.canvas.clear ()
 for attribute in self.attributes:
 attribute.draw ()
 
 def resize (self):
 self.pageWidth = window.innerWidth
 self.pageHeight = window.innerHeight
 
 self.textTop = 0
 if self.pageHeight > 1.2 * self.pageWidth:
 self.canvasWidth = self.pageWidth
 self.canvasTop = self.textTop + 300
 else:
 self.canvasWidth = 0.6 * self.pageWidth
 self.canvasTop = self.textTop + 200
 self.canvasLeft = 0.5 * (self.pageWidth - self.canvasWidth)
 self.canvasHeight = 0.6 * self.canvasWidth
 self.buttonsTop = self.canvasTop + self.canvasHeight + 50
 self.buttonsWidth = 500
 
 self.textFrame.style.top = self.textTop;
 self.textFrame.style.left = self.canvasLeft + 0.05 * self.canvasWidth
 self.textFrame.style.width = 0.9 * self.canvasWidth
 
 self.canvasFrame.style.top = self.canvasTop
 self.canvasFrame.style.left = self.canvasLeft
 self.canvas.setDimensions ({'width': self.canvasWidth, 'height': self.canvasHeight})
 
 self.buttonsFrame.style.top = self.buttonsTop
 self.buttonsFrame.style.left = 0.5 * (self.pageWidth - self.buttonsWidth)
 self.buttonsFrame.style.width = self.canvasWidth
 
 self.install ()
 self.commit ()
 self.draw ()
 
 def scaleX (self, x):
 return x * (self.canvas.width / orthoWidth)
 
 def scaleY (self, y):
 return y * (self.canvas.height / orthoHeight) 
 
 def orthoX (self, x):
 return self.scaleX (x + orthoWidth // 2)
 
 def orthoY (self, y):
 return self.scaleY (orthoHeight - fieldHeight // 2 - y)
 
 def keydown (self, event):
 self.keyCode = event.keyCode
 
 def keyup (self, event):
 self.keyCode = None 
 
game = Game () # Create and run game

// Transcrypt'ed from Python, 2023年04月22日 17:11:43
import {AssertionError, AttributeError, BaseException, DeprecationWarning, Exception, IndexError, IterableError, KeyError, NotImplementedError, RuntimeWarning, StopIteration, UserWarning, ValueError, Warning, __JsIterator__, __PyIterator__, __Terminal__, __add__, __and__, __call__, __class__, __envir__, __eq__, __floordiv__, __ge__, __get__, __getcm__, __getitem__, __getslice__, __getsm__, __gt__, __i__, __iadd__, __iand__, __idiv__, __ijsmod__, __ilshift__, __imatmul__, __imod__, __imul__, __in__, __init__, __ior__, __ipow__, __irshift__, __isub__, __ixor__, __jsUsePyNext__, __jsmod__, __k__, __kwargtrans__, __le__, __lshift__, __lt__, __matmul__, __mergefields__, __mergekwargtrans__, __mod__, __mul__, __ne__, __neg__, __nest__, __or__, __pow__, __pragma__, __pyUseJsNext__, __rshift__, __setitem__, __setproperty__, __setslice__, __sort__, __specialattrib__, __sub__, __super__, __t__, __terminal__, __truediv__, __withblock__, __xor__, abs, all, any, assert, bool, bytearray, bytes, callable, chr, copy, deepcopy, delattr, dict, dir, divmod, enumerate, filter, float, format, getattr, hasattr, input, int, isinstance, issubclass, len, list, map, max, min, object, ord, pow, print, property, py_TypeError, py_iter, py_metatype, py_next, py_reversed, py_typeof, range, repr, round, set, setattr, sorted, str, sum, tuple, zip} from './org.transcrypt.__runtime__.js';
import {fabric} from './com.fabricjs.js';
var __name__ = '__main__';
export var orthoWidth = 1000;
export var orthoHeight = 750;
export var fieldHeight = 650;
var __left0__ = tuple ([13, 27, 32]);
export var enter = __left0__ [0];
export var esc = __left0__ [1];
export var space = __left0__ [2];
window.onkeydown = (function __lambda__ (event) {
 return event.keyCode != space;
});
export var Attribute = __class__ ('Attribute', [object], {
 __module__: __name__,
 get __init__ () {return __get__ (this, function (self, game) {
 self.game = game;
 self.game.attributes.append (self);
 self.install ();
 self.reset ();
 });},
 get reset () {return __get__ (this, function (self) {
 self.commit ();
 });},
 get predict () {return __get__ (this, function (self) {
 // pass;
 });},
 get interact () {return __get__ (this, function (self) {
 // pass;
 });},
 get commit () {return __get__ (this, function (self) {
 // pass;
 });}
});
export var Sprite = __class__ ('Sprite', [Attribute], {
 __module__: __name__,
 get __init__ () {return __get__ (this, function (self, game, width, height) {
 self.width = width;
 self.height = height;
 Attribute.__init__ (self, game);
 });},
 get install () {return __get__ (this, function (self) {
 self.image = new fabric.Rect (dict ({'width': self.game.scaleX (self.width), 'height': self.game.scaleY (self.height), 'originX': 'center', 'originY': 'center', 'fill': 'white'}));
 });},
 get reset () {return __get__ (this, function (self, vX, vY, x, y) {
 if (typeof vX == 'undefined' || (vX != null && vX.hasOwnProperty ("__kwargtrans__"))) {;
 var vX = 0;
 };
 if (typeof vY == 'undefined' || (vY != null && vY.hasOwnProperty ("__kwargtrans__"))) {;
 var vY = 0;
 };
 if (typeof x == 'undefined' || (x != null && x.hasOwnProperty ("__kwargtrans__"))) {;
 var x = 0;
 };
 if (typeof y == 'undefined' || (y != null && y.hasOwnProperty ("__kwargtrans__"))) {;
 var y = 0;
 };
 if (arguments.length) {
 var __ilastarg0__ = arguments.length - 1;
 if (arguments [__ilastarg0__] && arguments [__ilastarg0__].hasOwnProperty ("__kwargtrans__")) {
 var __allkwargs0__ = arguments [__ilastarg0__--];
 for (var __attrib0__ in __allkwargs0__) {
 switch (__attrib0__) {
 case 'self': var self = __allkwargs0__ [__attrib0__]; break;
 case 'vX': var vX = __allkwargs0__ [__attrib0__]; break;
 case 'vY': var vY = __allkwargs0__ [__attrib0__]; break;
 case 'x': var x = __allkwargs0__ [__attrib0__]; break;
 case 'y': var y = __allkwargs0__ [__attrib0__]; break;
 }
 }
 }
 }
 else {
 }
 self.vX = vX;
 self.vY = vY;
 self.x = x;
 self.y = y;
 Attribute.reset (self);
 });},
 get predict () {return __get__ (this, function (self) {
 self.x += self.vX * self.game.deltaT;
 self.y += self.vY * self.game.deltaT;
 });},
 get commit () {return __get__ (this, function (self) {
 self.image.left = self.game.orthoX (self.x);
 self.image.top = self.game.orthoY (self.y);
 });},
 get draw () {return __get__ (this, function (self) {
 self.game.canvas.add (self.image);
 });}
});
export var Paddle = __class__ ('Paddle', [Sprite], {
 __module__: __name__,
 margin: 30,
 width: 10,
 height: 100,
 speed: 400,
 get __init__ () {return __get__ (this, function (self, game, index) {
 self.index = index;
 Sprite.__init__ (self, game, self.width, self.height);
 });},
 get reset () {return __get__ (this, function (self) {
 Sprite.reset (self, __kwargtrans__ ({x: (self.index ? Math.floor (orthoWidth / 2) - self.margin : Math.floor (-(orthoWidth) / 2) + self.margin), y: 0}));
 });},
 get predict () {return __get__ (this, function (self) {
 self.vY = 0;
 if (self.index) {
 if (self.game.keyCode == ord ('K')) {
 self.vY = self.speed;
 }
 else if (self.game.keyCode == ord ('M')) {
 self.vY = -(self.speed);
 }
 }
 else if (self.game.keyCode == ord ('A')) {
 self.vY = self.speed;
 }
 else if (self.game.keyCode == ord ('Z')) {
 self.vY = -(self.speed);
 }
 Sprite.predict (self);
 });},
 get interact () {return __get__ (this, function (self) {
 self.y = Math.max (Math.floor (self.height / 2) - Math.floor (fieldHeight / 2), Math.min (self.y, Math.floor (fieldHeight / 2) - Math.floor (self.height / 2)));
 if ((self.y - Math.floor (self.height / 2) < self.game.ball.y && self.game.ball.y < self.y + Math.floor (self.height / 2)) && (self.index == 0 && self.game.ball.x < self.x || self.index == 1 && self.game.ball.x > self.x)) {
 self.game.ball.x = self.x;
 self.game.ball.vX = -(self.game.ball.vX);
 self.game.ball.speedUp (self);
 }
 });}
});
export var Ball = __class__ ('Ball', [Sprite], {
 __module__: __name__,
 side: 8,
 speed: 300,
 get __init__ () {return __get__ (this, function (self, game) {
 Sprite.__init__ (self, game, self.side, self.side);
 });},
 get reset () {return __get__ (this, function (self) {
 var angle = self.game.serviceIndex * Math.PI + ((Math.random () > 0.5 ? 1 : -(1)) * Math.random ()) * Math.atan (fieldHeight / orthoWidth);
 Sprite.reset (self, __kwargtrans__ ({vX: self.speed * Math.cos (angle), vY: self.speed * Math.sin (angle)}));
 });},
 get predict () {return __get__ (this, function (self) {
 Sprite.predict (self);
 if (self.x < Math.floor (-(orthoWidth) / 2)) {
 self.game.scored (1);
 }
 else if (self.x > Math.floor (orthoWidth / 2)) {
 self.game.scored (0);
 }
 if (self.y > Math.floor (fieldHeight / 2)) {
 self.y = Math.floor (fieldHeight / 2);
 self.vY = -(self.vY);
 }
 else if (self.y < Math.floor (-(fieldHeight) / 2)) {
 self.y = Math.floor (-(fieldHeight) / 2);
 self.vY = -(self.vY);
 }
 });},
 get speedUp () {return __get__ (this, function (self, bat) {
 var factor = 1 + 0.15 * Math.pow (1 - Math.abs (self.y - bat.y) / (Math.floor (bat.height / 2)), 2);
 if (Math.abs (self.vX) < 3 * self.speed) {
 self.vX *= factor;
 self.vY *= factor;
 }
 });}
});
export var Scoreboard = __class__ ('Scoreboard', [Attribute], {
 __module__: __name__,
 nameShift: 75,
 hintShift: 25,
 get install () {return __get__ (this, function (self) {
 self.playerLabels = (function () {
 var __accu0__ = [];
 for (var [py_name, position] of tuple ([tuple (['AZ keys:', -(7) / 16]), tuple (['KM keys:', 1 / 16])])) {
 __accu0__.append (new fabric.Text ('Player {}'.format (py_name), dict ({'fill': 'white', 'fontFamily': 'arial', 'fontSize': '{}'.format (self.game.canvas.width / 30), 'left': self.game.orthoX (position * orthoWidth), 'top': self.game.orthoY (Math.floor (fieldHeight / 2) + self.nameShift)})));
 }
 return __accu0__;
 }) ();
 self.hintLabel = new fabric.Text ('[spacebar] starts game, [enter] resets score', dict ({'fill': 'white', 'fontFamily': 'arial', 'fontSize': '{}'.format (self.game.canvas.width / 70), 'left': self.game.orthoX ((-(7) / 16) * orthoWidth), 'top': self.game.orthoY (Math.floor (fieldHeight / 2) + self.hintShift)}));
 self.image = new fabric.Line ([self.game.orthoX (Math.floor (-(orthoWidth) / 2)), self.game.orthoY (Math.floor (fieldHeight / 2)), self.game.orthoX (Math.floor (orthoWidth / 2)), self.game.orthoY (Math.floor (fieldHeight / 2))], dict ({'stroke': 'white'}));
 });},
 get increment () {return __get__ (this, function (self, playerIndex) {
 self.scores [playerIndex]++;
 });},
 get reset () {return __get__ (this, function (self) {
 self.scores = [0, 0];
 Attribute.reset (self);
 });},
 get commit () {return __get__ (this, function (self) {
 self.scoreLabels = (function () {
 var __accu0__ = [];
 for (var [score, position] of zip (self.scores, tuple ([-(2) / 16, 6 / 16]))) {
 __accu0__.append (new fabric.Text ('{}'.format (score), dict ({'fill': 'white', 'fontFamily': 'arial', 'fontSize': '{}'.format (self.game.canvas.width / 30), 'left': self.game.orthoX (position * orthoWidth), 'top': self.game.orthoY (Math.floor (fieldHeight / 2) + self.nameShift)})));
 }
 return __accu0__;
 }) ();
 });},
 get draw () {return __get__ (this, function (self) {
 for (var [playerLabel, scoreLabel] of zip (self.playerLabels, self.scoreLabels)) {
 self.game.canvas.add (playerLabel);
 self.game.canvas.add (scoreLabel);
 self.game.canvas.add (self.hintLabel);
 }
 self.game.canvas.add (self.image);
 });}
});
export var Game = __class__ ('Game', [object], {
 __module__: __name__,
 get __init__ () {return __get__ (this, function (self) {
 self.serviceIndex = (Math.random () > 0.5 ? 1 : 0);
 self.pause = true;
 self.keyCode = null;
 self.textFrame = document.getElementById ('text_frame');
 self.canvasFrame = document.getElementById ('canvas_frame');
 self.buttonsFrame = document.getElementById ('buttons_frame');
 self.canvas = new fabric.Canvas ('canvas', dict ({'backgroundColor': 'black', 'originX': 'center', 'originY': 'center'}));
 self.canvas.onWindowDraw = self.draw;
 self.canvas.lineWidth = 2;
 self.canvas.clear ();
 self.attributes = [];
 self.paddles = (function () {
 var __accu0__ = [];
 for (var index = 0; index < 2; index++) {
 __accu0__.append (Paddle (self, index));
 }
 return __accu0__;
 }) ();
 self.ball = Ball (self);
 self.scoreboard = Scoreboard (self);
 window.setInterval (self.py_update, 10);
 window.setInterval (self.draw, 20);
 window.addEventListener ('keydown', self.keydown);
 window.addEventListener ('keyup', self.keyup);
 self.buttons = [];
 for (var key of tuple (['A', 'Z', 'K', 'M', 'space', 'enter'])) {
 var button = document.getElementById (key);
 button.addEventListener ('mousedown', (function __lambda__ (aKey) {
 return (function __lambda__ () {
 return self.mouseOrTouch (aKey, true);
 });
 }) (key));
 button.addEventListener ('touchstart', (function __lambda__ (aKey) {
 return (function __lambda__ () {
 return self.mouseOrTouch (aKey, true);
 });
 }) (key));
 button.addEventListener ('mouseup', (function __lambda__ (aKey) {
 return (function __lambda__ () {
 return self.mouseOrTouch (aKey, false);
 });
 }) (key));
 button.addEventListener ('touchend', (function __lambda__ (aKey) {
 return (function __lambda__ () {
 return self.mouseOrTouch (aKey, false);
 });
 }) (key));
 button.style.cursor = 'pointer';
 button.style.userSelect = 'none';
 self.buttons.append (button);
 }
 self.time = +(new Date);
 window.onresize = self.resize;
 self.resize ();
 });},
 get install () {return __get__ (this, function (self) {
 for (var attribute of self.attributes) {
 attribute.install ();
 }
 });},
 get mouseOrTouch () {return __get__ (this, function (self, key, down) {
 if (down) {
 if (key == 'space') {
 self.keyCode = space;
 }
 else if (key == 'enter') {
 self.keyCode = enter;
 }
 else {
 self.keyCode = ord (key);
 }
 }
 else {
 self.keyCode = null;
 }
 });},
 get py_update () {return __get__ (this, function (self) {
 var oldTime = self.time;
 self.time = +(new Date);
 self.deltaT = (self.time - oldTime) / 1000.0;
 if (self.pause) {
 if (self.keyCode == space) {
 self.pause = false;
 }
 else if (self.keyCode == enter) {
 self.scoreboard.reset ();
 }
 }
 else {
 for (var attribute of self.attributes) {
 attribute.predict ();
 }
 for (var attribute of self.attributes) {
 attribute.interact ();
 }
 for (var attribute of self.attributes) {
 attribute.commit ();
 }
 }
 });},
 get scored () {return __get__ (this, function (self, playerIndex) {
 self.scoreboard.increment (playerIndex);
 self.serviceIndex = 1 - playerIndex;
 for (var paddle of self.paddles) {
 paddle.reset ();
 }
 self.ball.reset ();
 self.pause = true;
 });},
 get commit () {return __get__ (this, function (self) {
 for (var attribute of self.attributes) {
 attribute.commit ();
 }
 });},
 get draw () {return __get__ (this, function (self) {
 self.canvas.clear ();
 for (var attribute of self.attributes) {
 attribute.draw ();
 }
 });},
 get resize () {return __get__ (this, function (self) {
 self.pageWidth = window.innerWidth;
 self.pageHeight = window.innerHeight;
 self.textTop = 0;
 if (self.pageHeight > 1.2 * self.pageWidth) {
 self.canvasWidth = self.pageWidth;
 self.canvasTop = self.textTop + 300;
 }
 else {
 self.canvasWidth = 0.6 * self.pageWidth;
 self.canvasTop = self.textTop + 200;
 }
 self.canvasLeft = 0.5 * (self.pageWidth - self.canvasWidth);
 self.canvasHeight = 0.6 * self.canvasWidth;
 self.buttonsTop = (self.canvasTop + self.canvasHeight) + 50;
 self.buttonsWidth = 500;
 self.textFrame.style.top = self.textTop;
 self.textFrame.style.left = self.canvasLeft + 0.05 * self.canvasWidth;
 self.textFrame.style.width = 0.9 * self.canvasWidth;
 self.canvasFrame.style.top = self.canvasTop;
 self.canvasFrame.style.left = self.canvasLeft;
 self.canvas.setDimensions (dict ({'width': self.canvasWidth, 'height': self.canvasHeight}));
 self.buttonsFrame.style.top = self.buttonsTop;
 self.buttonsFrame.style.left = 0.5 * (self.pageWidth - self.buttonsWidth);
 self.buttonsFrame.style.width = self.canvasWidth;
 self.install ();
 self.commit ();
 self.draw ();
 });},
 get scaleX () {return __get__ (this, function (self, x) {
 return x * (self.canvas.width / orthoWidth);
 });},
 get scaleY () {return __get__ (this, function (self, y) {
 return y * (self.canvas.height / orthoHeight);
 });},
 get orthoX () {return __get__ (this, function (self, x) {
 return self.scaleX (x + Math.floor (orthoWidth / 2));
 });},
 get orthoY () {return __get__ (this, function (self, y) {
 return self.scaleY ((orthoHeight - Math.floor (fieldHeight / 2)) - y);
 });},
 get keydown () {return __get__ (this, function (self, event) {
 self.keyCode = event.keyCode;
 });},
 get keyup () {return __get__ (this, function (self, event) {
 self.keyCode = null;
 });}
});
export var game = Game ();
//# sourceMappingURL=pong.map

__pragma__ ('alias', 'S', '$')
def start ():
 def changeColors ():
 for div in S__divs:
 S (div) .css ({
 'color': 'rgb({},{},{})'.format (* [int (256 * Math.random ()) for i in range (3)]),
 })
 S__divs = S ('div')
 changeColors ()
 window.setInterval (changeColors, 500)

// Transcrypt'ed from Python, 2023年04月22日 17:10:57
import {AssertionError, AttributeError, BaseException, DeprecationWarning, Exception, IndexError, IterableError, KeyError, NotImplementedError, RuntimeWarning, StopIteration, UserWarning, ValueError, Warning, __JsIterator__, __PyIterator__, __Terminal__, __add__, __and__, __call__, __class__, __envir__, __eq__, __floordiv__, __ge__, __get__, __getcm__, __getitem__, __getslice__, __getsm__, __gt__, __i__, __iadd__, __iand__, __idiv__, __ijsmod__, __ilshift__, __imatmul__, __imod__, __imul__, __in__, __init__, __ior__, __ipow__, __irshift__, __isub__, __ixor__, __jsUsePyNext__, __jsmod__, __k__, __kwargtrans__, __le__, __lshift__, __lt__, __matmul__, __mergefields__, __mergekwargtrans__, __mod__, __mul__, __ne__, __neg__, __nest__, __or__, __pow__, __pragma__, __pyUseJsNext__, __rshift__, __setitem__, __setproperty__, __setslice__, __sort__, __specialattrib__, __sub__, __super__, __t__, __terminal__, __truediv__, __withblock__, __xor__, abs, all, any, assert, bool, bytearray, bytes, callable, chr, copy, deepcopy, delattr, dict, dir, divmod, enumerate, filter, float, format, getattr, hasattr, input, int, isinstance, issubclass, len, list, map, max, min, object, ord, pow, print, property, py_TypeError, py_iter, py_metatype, py_next, py_reversed, py_typeof, range, repr, round, set, setattr, sorted, str, sum, tuple, zip} from './org.transcrypt.__runtime__.js';
var __name__ = '__main__';
export var start = function () {
 var changeColors = function () {
 for (var div of $divs) {
 $ (div).css (dict ({'color': 'rgb({},{},{})'.format (...(function () {
 var __accu0__ = [];
 for (var i = 0; i < 3; i++) {
 __accu0__.append (int (256 * Math.random ()));
 }
 return __accu0__;
 }) ())}));
 }
 };
 var $divs = $ ('div');
 changeColors ();
 window.setInterval (changeColors, 500);
};
//# sourceMappingURL=jquery_demo.map

import random
class Dice:
 def __init__ (self):
 document.body.addEventListener ('touchstart', lambda event: event.preventDefault ())
 document.body.addEventListener ('mousedown', lambda event: event.preventDefault ())
 document.body.style.margin = 0
 document.body.style.overflow = 'hidden';
 
 self.all = document.createElement ('div')
 self.all.style.color = 'white'
 self.all.style.backgroundColor = 'black'
 self.all.style.height = '100%'
 self.all.style.width = '100%'
 self.all.style.padding = 0
 self.all.style.margin = 0
 document.body.appendChild (self.all)
 
 self.dices = []
 
 for index in range (6):
 dice = document.createElement ('div')
 dice.normalColor = '#770000' if index < 3 else '#0000ff'
 dice.style.position = 'absolute'
 dice.style.backgroundColor = dice.normalColor
 dice.addEventListener ('touchstart', (lambda aDice: lambda: self.roll (aDice)) (dice)) # Returns inner lambda
 dice.addEventListener ('mousedown', (lambda aDice: lambda: self.roll (aDice)) (dice))
 self.dices.append (dice)
 self.all.appendChild (dice)
 
 dice.inner = document.createElement ('div')
 dice.inner.setAttribute ('unselectable', 'on')
 dice.inner.style.fontWeight = 'bold'
 dice.inner.style.textAlign = 'center'
 dice.inner.style.position = 'absolute'
 dice.inner.innerHTML = '?'
 dice.appendChild (dice.inner)
 
 self.banner = document.createElement ('div')
 self.banner.style.position = 'absolute'
 self.banner.style.cursor = 'pointer'
 self.banner.addEventListener ('touchstart', self.gotoTranscryptSite)
 self.banner.addEventListener ('mousedown', self.gotoTranscryptSite)
 self.banner.style.fontFamily = 'arial'
 self.banner.innerHTML = (
 '<span id="bannerLarge"><font color="777777">www.<b><i>' +
 '<font color="ff4422">T<font color="ffb000">r<font color="228822">a<font color="3366ff">n' +
 '<font color="ff4422">s<font color="ffb000">c<font color="228822">r<font color="3366ff">y<font color="ffb000">p<font color="228822">t' +
 '</i></b><font color="777777">.org<font size={}><font color="cccccc"></span>' +
 '<span id="bannerSmall"><i> Write your apps in Python for free!</i></span>'
 )
 self.all.appendChild (self.banner)
 self.bannerLarge = document.getElementById ('bannerLarge')
 self.bannerSmall = document.getElementById ('bannerSmall')
 
 self.audio = __new__ (Audio ('ios_app.mp3'))
 
 window.onresize = self.rightSize
 self.rightSize ()
 
 def gotoTranscryptSite (self):
 document.location.href = 'http://www.transcrypt.org'
 
 def roll (self, dice):
 frameIndex = 10
 self.audio.play ()
 
 def frame ():
 nonlocal frameIndex
 frameIndex -= 1
 
 dice.inner.innerHTML = random.randint (1, 6)
 if frameIndex:
 dice.style.color = random.choice (('red', 'green', 'blue', 'yellow'))
 setTimeout (frame, 100)
 else:
 dice.style.backgroundColor = dice.normalColor
 dice.style.color = 'white'
 
 frame ()
 
 def rightSize (self):
 self.pageWidth = window.innerWidth
 self.pageHeight = window.innerHeight
 portrait = self.pageHeight > self.pageWidth
 
 for index, dice in enumerate (self.dices):
 if self.pageHeight > self.pageWidth: # Portrait
 dice.style.height = 0.3 * self.pageHeight
 dice.style.width = 0.4 * self.pageWidth
 dice.style.top = (0.03 + (index if index < 3 else index - 3) * 0.32) * self.pageHeight
 dice.style.left = (0.06 if index < 3 else 0.54) * self.pageWidth
 
 charBoxSide = 0.3 * self.pageHeight
 dice.inner.style.top = 0.15 * self.pageHeight - 0.6 * charBoxSide
 dice.inner.style.left = 0.2 * self.pageWidth - 0.5 * charBoxSide
 self.banner.style.top = 0.975 * self.pageHeight
 self.banner.style.left = 0.06 * self.pageWidth 
 self.bannerLarge.style.fontSize = 0.017 * self.pageHeight
 self.bannerSmall.style.fontSize = 0.014 * self.pageHeight
 else: # Landscape
 dice.style.height = 0.4 * self.pageHeight
 dice.style.width = 0.3 * self.pageWidth
 dice.style.top = (0.06 if index < 3 else 0.54) * self.pageHeight
 dice.style.left = (0.03 + (index if index < 3 else index - 3) * 0.32) * self.pageWidth
 
 charBoxSide = 0.4 * self.pageHeight
 dice.inner.style.top = 0.2 * self.pageHeight - 0.6 * charBoxSide
 dice.inner.style.left = 0.15 * self.pageWidth - 0.5 * charBoxSide
 
 self.banner.style.top = 0.95 * self.pageHeight
 self.banner.style.left = 0.03 * self.pageWidth
 self.bannerLarge.style.fontSize = 0.015 * self.pageWidth
 self.bannerSmall.style.fontSize = 0.012 * self.pageWidth
 
 dice.inner.style.height = charBoxSide
 dice.inner.style.width = charBoxSide
 dice.inner.style.fontSize = charBoxSide
 
dice = Dice ()

<html manifest="cache.manifest">
 <!-- v45 -->
 <head>
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="black">
 <meta name="apple-mobile-web-app-title" content="Dice">
 <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 <link rel="apple-touch-icon" href="ios_app.png">
 </head>
 <body>
 <script type="module">
 import * as ios_app from "./__target__/ios_app.js"; window.ios_app = ios_app;
 </script>
 </body> 
</html>

CACHE MANIFEST
# v45
CACHE:
ios_app.html
ios_app.mp3
__javascript__/ios_app.js

class Spawn:
 def __init__ (self, width, height):
 self.width, self.height, self.spacing = self.fill = width, height, 100, d3.scale.category20 ()
 self.svg = d3.select ('body'
 ) .append ('svg'
 ) .attr ('width', self.width
 ) .attr ('height', self.height
 ) .on ('mousemove', self.mousemove
 ) .on ('mousedown', self.mousedown)
 
 self.svg.append ('rect'
 ) .attr ('width', self.width
 ) .attr ('height', self.height)
 self.cursor = self.svg.append ('circle'
 ) .attr ('r', self.spacing
 ) .attr ('transform', 'translate ({}, {})' .format (self.width / 2, self.height / 2)
 ) .attr ('class', 'cursor')
 self.force = d3.layout.force (
 ) .size ([self.width, self.height]
 ) .nodes ([{}]
 ) .linkDistance (self.spacing
 ) .charge (-1000
 ) .on ('tick', self.tick) 
 self.nodes, self.links, self.node, self.link = self.force.nodes (), self.force.links (), self.svg.selectAll ('.node'), self.svg.selectAll ('.link')
 
 self.restart ()
 
 def mousemove (self):
 self.cursor.attr ('transform', 'translate (' + d3.mouse (self.svg.node ()) + ')')
 def mousedown (self):
 def pushLink (target):
 x, y = target.x - node.x, target.y - node.y
 if Math.sqrt (x * x + y * y) < self.spacing:
 spawn.links.push ({'source': node, 'target': target})
 
 point = d3.mouse (self.svg.node ())
 node = {'x': point [0], 'y': point [1]}
 self.nodes.push (node)
 self.nodes.forEach (pushLink)
 self.restart () 
 
 def tick (self):
 self.link.attr ('x1', lambda d: d.source.x
 ) .attr ('y1', lambda d: d.source.y
 ) .attr ('x2', lambda d: d.target.x
 ) .attr ('y2', lambda d: d.target.y)
 
 self.node.attr ('cx', lambda d: d.x
 ) .attr ('cy', lambda d: d.y)
 def restart (self):
 self.link = self.link.data (self.links)
 
 self.link.enter (
 ) .insert ('line', '.node'
 ) .attr('class', 'link')
 self.node = self.node.data (self.nodes)
 
 self.node.enter (
 ) .insert ('circle', '.cursor'
 ) .attr ('class', 'node'
 ) .attr ('r', 7
 ) .call (self.force.drag)
 self.force.start ()
spawn = Spawn (window.innerWidth, window.innerHeight)

// Transcrypt'ed from Python, 2023年04月22日 17:11:03
import {AssertionError, AttributeError, BaseException, DeprecationWarning, Exception, IndexError, IterableError, KeyError, NotImplementedError, RuntimeWarning, StopIteration, UserWarning, ValueError, Warning, __JsIterator__, __PyIterator__, __Terminal__, __add__, __and__, __call__, __class__, __envir__, __eq__, __floordiv__, __ge__, __get__, __getcm__, __getitem__, __getslice__, __getsm__, __gt__, __i__, __iadd__, __iand__, __idiv__, __ijsmod__, __ilshift__, __imatmul__, __imod__, __imul__, __in__, __init__, __ior__, __ipow__, __irshift__, __isub__, __ixor__, __jsUsePyNext__, __jsmod__, __k__, __kwargtrans__, __le__, __lshift__, __lt__, __matmul__, __mergefields__, __mergekwargtrans__, __mod__, __mul__, __ne__, __neg__, __nest__, __or__, __pow__, __pragma__, __pyUseJsNext__, __rshift__, __setitem__, __setproperty__, __setslice__, __sort__, __specialattrib__, __sub__, __super__, __t__, __terminal__, __truediv__, __withblock__, __xor__, abs, all, any, assert, bool, bytearray, bytes, callable, chr, copy, deepcopy, delattr, dict, dir, divmod, enumerate, filter, float, format, getattr, hasattr, input, int, isinstance, issubclass, len, list, map, max, min, object, ord, pow, print, property, py_TypeError, py_iter, py_metatype, py_next, py_reversed, py_typeof, range, repr, round, set, setattr, sorted, str, sum, tuple, zip} from './org.transcrypt.__runtime__.js';
var __name__ = '__main__';
export var Spawn = __class__ ('Spawn', [object], {
 __module__: __name__,
 get __init__ () {return __get__ (this, function (self, width, height) {
 var __left0__ = tuple ([width, height, 100, d3.scale.category20 ()]);
 self.width = __left0__ [0];
 self.height = __left0__ [1];
 self.spacing = __left0__ [2];
 self.fill = __left0__;
 self.svg = d3.select ('body').append ('svg').attr ('width', self.width).attr ('height', self.height).on ('mousemove', self.mousemove).on ('mousedown', self.mousedown);
 self.svg.append ('rect').attr ('width', self.width).attr ('height', self.height);
 self.cursor = self.svg.append ('circle').attr ('r', self.spacing).attr ('transform', 'translate ({}, {})'.format (self.width / 2, self.height / 2)).attr ('class', 'cursor');
 self.force = d3.layout.force ().size ([self.width, self.height]).nodes ([dict ({})]).linkDistance (self.spacing).charge (-(1000)).on ('tick', self.tick);
 var __left0__ = tuple ([self.force.nodes (), self.force.links (), self.svg.selectAll ('.node'), self.svg.selectAll ('.link')]);
 self.nodes = __left0__ [0];
 self.links = __left0__ [1];
 self.node = __left0__ [2];
 self.link = __left0__ [3];
 self.restart ();
 });},
 get mousemove () {return __get__ (this, function (self) {
 self.cursor.attr ('transform', ('translate (' + d3.mouse (self.svg.node ())) + ')');
 });},
 get mousedown () {return __get__ (this, function (self) {
 var pushLink = function (target) {
 var __left0__ = tuple ([target.x - node.x, target.y - node.y]);
 var x = __left0__ [0];
 var y = __left0__ [1];
 if (Math.sqrt (x * x + y * y) < self.spacing) {
 spawn.links.push (dict ({'source': node, 'target': target}));
 }
 };
 var point = d3.mouse (self.svg.node ());
 var node = dict ({'x': point [0], 'y': point [1]});
 self.nodes.push (node);
 self.nodes.forEach (pushLink);
 self.restart ();
 });},
 get tick () {return __get__ (this, function (self) {
 self.link.attr ('x1', (function __lambda__ (d) {
 return d.source.x;
 })).attr ('y1', (function __lambda__ (d) {
 return d.source.y;
 })).attr ('x2', (function __lambda__ (d) {
 return d.target.x;
 })).attr ('y2', (function __lambda__ (d) {
 return d.target.y;
 }));
 self.node.attr ('cx', (function __lambda__ (d) {
 return d.x;
 })).attr ('cy', (function __lambda__ (d) {
 return d.y;
 }));
 });},
 get restart () {return __get__ (this, function (self) {
 self.link = self.link.data (self.links);
 self.link.enter ().insert ('line', '.node').attr ('class', 'link');
 self.node = self.node.data (self.nodes);
 self.node.enter ().insert ('circle', '.cursor').attr ('class', 'node').attr ('r', 7).call (self.force.drag);
 self.force.start ();
 });}
});
export var spawn = Spawn (window.innerWidth, window.innerHeight);
//# sourceMappingURL=d3js_demo.map

from org.reactjs import createElement, useState, useEffect, useRef
from org.reactjs.dom import render as react_render
# Helper functions
def h(elm_type, props='', *args):
 return createElement(elm_type, props, *args)
def render(react_element, destination_id, callback=lambda: None):
 container = document.getElementById(destination_id)
 react_render(react_element, container, callback)
def useInterval(func, delay=None):
 # can be used as `useInterval(func, delay)`
 # or as `@useInterval(delay)`
 if delay is None:
 delay = func
 return lambda fn: useInterval(fn, delay)
 ref = useRef(func)
 ref.current = func
 @useEffect.withDeps(delay)
 def setup():
 id = setInterval(lambda: ref.current(), delay)
 return lambda: clearInterval(id)
 return func
# Create a component
def Hello(props):
 count, setCount = useState(0)
 @useInterval(1000)
 def updateCounter():
 setCount(count+1)
 return h(
 'div',
 {'className': 'maindiv'},
 h('h1', None, 'Hello ', props['name']),
 h('p', None, 'Lorem ipsum dolor sit ame.'),
 h('p', None, 'Counter: ', count),
 h(
 'button',
 {'onClick': updateCounter},
 'Increment',
 )
 )
# Render the component in a 'container' div
element = React.createElement(Hello, {'name': 'React!'})
render(element, 'container')

// Transcrypt'ed from Python, 2023年04月22日 17:11:15
import {AssertionError, AttributeError, BaseException, DeprecationWarning, Exception, IndexError, IterableError, KeyError, NotImplementedError, RuntimeWarning, StopIteration, UserWarning, ValueError, Warning, __JsIterator__, __PyIterator__, __Terminal__, __add__, __and__, __call__, __class__, __envir__, __eq__, __floordiv__, __ge__, __get__, __getcm__, __getitem__, __getslice__, __getsm__, __gt__, __i__, __iadd__, __iand__, __idiv__, __ijsmod__, __ilshift__, __imatmul__, __imod__, __imul__, __in__, __init__, __ior__, __ipow__, __irshift__, __isub__, __ixor__, __jsUsePyNext__, __jsmod__, __k__, __kwargtrans__, __le__, __lshift__, __lt__, __matmul__, __mergefields__, __mergekwargtrans__, __mod__, __mul__, __ne__, __neg__, __nest__, __or__, __pow__, __pragma__, __pyUseJsNext__, __rshift__, __setitem__, __setproperty__, __setslice__, __sort__, __specialattrib__, __sub__, __super__, __t__, __terminal__, __truediv__, __withblock__, __xor__, abs, all, any, assert, bool, bytearray, bytes, callable, chr, copy, deepcopy, delattr, dict, dir, divmod, enumerate, filter, float, format, getattr, hasattr, input, int, isinstance, issubclass, len, list, map, max, min, object, ord, pow, print, property, py_TypeError, py_iter, py_metatype, py_next, py_reversed, py_typeof, range, repr, round, set, setattr, sorted, str, sum, tuple, zip} from './org.transcrypt.__runtime__.js';
import {render as react_render} from './org.reactjs.dom.js';
import {createElement, useEffect, useRef, useState} from './org.reactjs.js';
var __name__ = '__main__';
export var h = function (elm_type, props) {
 if (typeof props == 'undefined' || (props != null && props.hasOwnProperty ("__kwargtrans__"))) {;
 var props = '';
 };
 var args = tuple ([].slice.apply (arguments).slice (2));
 return createElement (elm_type, props, ...args);
};
export var render = function (react_element, destination_id, callback) {
 if (typeof callback == 'undefined' || (callback != null && callback.hasOwnProperty ("__kwargtrans__"))) {;
 var callback = (function __lambda__ () {
 return null;
 });
 };
 var container = document.getElementById (destination_id);
 react_render (react_element, container, callback);
};
export var useInterval = function (func, delay) {
 if (typeof delay == 'undefined' || (delay != null && delay.hasOwnProperty ("__kwargtrans__"))) {;
 var delay = null;
 };
 if (delay === null) {
 var delay = func;
 return (function __lambda__ (fn) {
 return useInterval (fn, delay);
 });
 }
 var ref = useRef (func);
 ref.current = func;
 var setup = useEffect.withDeps (delay) (function () {
 var id = setInterval ((function __lambda__ () {
 return ref.current ();
 }), delay);
 return (function __lambda__ () {
 return clearInterval (id);
 });
 });
 return func;
};
export var Hello = function (props) {
 var __left0__ = useState (0);
 var count = __left0__ [0];
 var setCount = __left0__ [1];
 var updateCounter = useInterval (1000) (function () {
 setCount (count + 1);
 });
 return h ('div', dict ({'className': 'maindiv'}), h ('h1', null, 'Hello ', props ['name']), h ('p', null, 'Lorem ipsum dolor sit ame.'), h ('p', null, 'Counter: ', count), h ('button', dict ({'onClick': updateCounter}), 'Increment'));
};
export var element = React.createElement (Hello, dict ({'name': 'React!'}));
render (element, 'container');
//# sourceMappingURL=react_demo.map

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8" />
 <title>Hello PyRiot ;-)</title>
 <!-- for transcrypted version we do not need the compiler.
 for the classic version you can use riot+compiler -->
 <script src="https://cdn.jsdelivr.net/riot/2.5/riot.js"></script>
 <style>
 body {font-family:arial;font-size:30px;padding:50px;}
 h1 {font-size:50px;color:#0000ff;}
 </style>
 </head>
 <body>
 <!-- classic riot (compiled on server, could be done in browser) -->
 <sample id="s1"></sample>
 <script src="tags/sample.js"></script>
 <script>riot.mount('sample')</script>
 <!-- transcrypted version (transpiled on server, using python) -->
 <sample2 id='s2' label="nr1"></sample2>
 <mp2 id='s3' label="nr2"></mp2>
 <!-- the transpiled tag's js -->
 <script type="module">
 import * as riot_demo from "./__target__/riot_demo.js"
 // register
 var cls = riot_demo.Sample2
 riot.tag2('sample2', cls.template, cls.style, '', function(opts) {
 new cls(this, opts)})
 document.t1 = riot.mount('sample2')[0].update()
 document.t2 = riot.mount('#s3', 'sample2')[0]
 document.t2.update()
 </script>
 </body>
</html>

// vim: ft=html
<sample>
 <h1>Riot Native Tag</h1>
 <h5 each="{lv}">name: {name} - counter: {this.count()}</h5>
 <script>
 this.counter = 0
 // riot's synctactic sugar:
 count() { this.counter += 1; return this.counter }
 // to test stuff on console:
 window.native_tag = this
 this.on('update', function() {
 this.lv = [{name: 'n1'}, {'name': 'n2'}]
 this.update()
 })
 </script>
 <style scoped>
 h1 {color: red}
 </style>
</sample>