code review

nicegui/elements/audio.py

@@ -54,4 +54,4 @@ class Audio(Element, component='audio.js'):
 
     def pause(self) -> None:
         """Pause audio."""
-        self.run_method('pause')
+        self.run_method('pause')

nicegui/elements/video.py

@@ -54,4 +54,4 @@ class Video(Element, component='video.js'):
 
     def pause(self) -> None:
         """Pause video."""
-        self.run_method('pause')
+        self.run_method('pause')

website/more_documentation/audio_documentation.py

@@ -2,6 +2,7 @@ from nicegui import ui
 
 from ..documentation_tools import text_demo
 
+
 def main_demo() -> None:
     a = ui.audio('https://cdn.pixabay.com/download/audio/2022/02/22/audio_d1718ab41b.mp3')
     a.on('ended', lambda _: ui.notify('Audio playback completed'))
@@ -9,17 +10,13 @@ def main_demo() -> None:
     ui.button(on_click=lambda: a.props('muted'), icon='volume_off').props('outline')
     ui.button(on_click=lambda: a.props(remove='muted'), icon='volume_up').props('outline')
 
-url_audio = "https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3"
-seek_audio = 0
 
 def more() -> None:
-    @text_demo('Audio with play/pause/seek controls', '''
-        This demo shows how to use play/pause/seek controls.
+    @text_demo('Control the audio element', '''
+        This demo shows how to play, pause and seek programmatically.
     ''')
     def control_demo() -> None:
-        a = ui.audio(url_audio)
-        with ui.row():
-            ui.button('Play', on_click=lambda: a.play())
-            ui.button('Pause', on_click=lambda: a.pause())
-            ui.button('Seek', on_click=lambda: a.seek(seek_audio))
-            ui.number("Position", value=seek_audio).bind_value(globals(), 'seek_audio')
+        a = ui.audio('https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3')
+        ui.button('Play', on_click=a.play)
+        ui.button('Pause', on_click=a.pause)
+        ui.button('Jump to 0:30', on_click=lambda: a.seek(30))

website/more_documentation/video_documentation.py

@@ -7,18 +7,13 @@ def main_demo() -> None:
     v = ui.video('https://test-videos.co.uk/vids/bigbuckbunny/mp4/h264/360/Big_Buck_Bunny_360_10s_1MB.mp4')
     v.on('ended', lambda _: ui.notify('Video playback completed'))
 
-url_video = "https://test-videos.co.uk/vids/bigbuckbunny/mp4/h264/360/Big_Buck_Bunny_360_10s_1MB.mp4"
-seek_video = 0
 
 def more() -> None:
-    @text_demo('Video with play/pause/seek controls', '''
-        This demo shows how to use play/pause/seek controls.
+    @text_demo('Control the video element', '''
+        This demo shows how to play, pause and seek programmatically.
     ''')
     def control_demo() -> None:
-        v = ui.video(url_video)
-        with ui.row():
-            ui.button('Play', on_click=lambda: v.play())
-            ui.button('Pause', on_click=lambda: v.pause())
-            ui.button('Seek', on_click=lambda: v.seek(seek_video))
-            ui.number("Position", value=seek_video).bind_value(globals(), 'seek_video')
-
+        v = ui.video('https://test-videos.co.uk/vids/bigbuckbunny/mp4/h264/360/Big_Buck_Bunny_360_10s_1MB.mp4')
+        ui.button('Play', on_click=v.play)
+        ui.button('Pause', on_click=v.pause)
+        ui.button('Jump to 0:05', on_click=lambda: v.seek(5))