fenetre 0.1.0 → 0.2.0

data/app/controllers/fenetre/status_controller.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module Fenetre
+  class StatusController < ActionController::Base
+    def show
+      render json: { status: 'ok', time: Time.now.utc.iso8601, version: Fenetre::VERSION }
+    end
+
+    def human
+      render html: helpers.content_tag(:h1, "Fenetre Status: ok (#{Fenetre::VERSION})")
+    end
+  end
+end

data/app/helpers/fenetre/video_chat_helper.rb

@@ -3,43 +3,49 @@
 module Fenetre
   module VideoChatHelper
     # Helper method to render the video chat container with proper data attributes
-    def fenetre_video_chat_container(room_id, user_id, theme: 'dark')
+    def fenetre_video_chat_container(room_id, user_id, theme: 'dark', ice_servers: nil)
       content = stylesheet_link_tag('fenetre/video_chat', media: 'all')
-      js = javascript_include_tag('fenetre.js', type: 'module')
-      content + js + video_chat_main_container(room_id, user_id, theme)
+      content + video_chat_main_container(room_id, user_id, theme, ice_servers)
     end
 
     private
 
-    def video_chat_main_container(room_id, user_id, theme)
+    def video_chat_main_container(room_id, user_id, theme, ice_servers)
+      servers = ice_servers || Fenetre.ice_servers
       content_tag(:div, class: "fenetre-video-chat-container fenetre-theme-#{theme}", data: {
                     controller: 'fenetre--video-chat',
-                    fenetre_video_chat_user_id_value: user_id.to_s,
+                    fenetre__video_chat_user_id_value: user_id.to_s,
+                    fenetre__video_chat_ice_servers_value: servers,
+                    fenetre__video_chat_max_video_bitrate_value: Fenetre.max_video_bitrate,
+                    fenetre__video_chat_max_audio_bitrate_value: Fenetre.max_audio_bitrate,
+                    fenetre__video_chat_video_width_value: Fenetre.video_width,
+                    fenetre__video_chat_video_height_value: Fenetre.video_height,
+                    fenetre__video_chat_frame_rate_value: Fenetre.frame_rate,
                     fenetre_theme: theme
                   }) do
         hidden_room_id_input(room_id) +
           connection_status_indicator +
-          section_heading('Participants') +
-          participants_list +
-          section_heading('My Video') +
-          local_video_section +
+          content_tag(:div, class: 'fenetre-stage') do
+            local_video_section + remote_videos_section
+          end +
           media_control_section +
-          section_heading('Remote Videos') +
-          remote_videos_section +
-          section_heading('Chat') +
-          chat_section
+          content_tag(:div, class: 'fenetre-sidebar') do
+            section_heading('Participants') +
+              participants_list +
+              section_heading('Chat') +
+              chat_section
+          end
       end
     end
 
-    # Add connection status indicator
     def connection_status_indicator
       content_tag(:div, 'Connecting...',
                   class: 'fenetre-connection-status',
-                  data: { fenetre_video_chat_target: 'connectionStatus' })
+                  data: { fenetre__video_chat_target: 'connectionStatus' })
     end
 
     def hidden_room_id_input(room_id)
-      content_tag(:input, nil, type: 'hidden', value: room_id, data: { fenetre_video_chat_target: 'roomId' })
+      content_tag(:input, nil, type: 'hidden', value: room_id, data: { fenetre__video_chat_target: 'roomId' })
     end
 
     def section_heading(text)
@@ -47,31 +53,41 @@ module Fenetre
     end
 
     def participants_list
-      content_tag(:ul, '', id: 'fenetre-participant-list')
+      content_tag(:ul, '', class: 'fenetre-participant-list', data: { fenetre__video_chat_target: 'participants' })
     end
 
     def local_video_section
-      content_tag(:div, class: 'fenetre-video-section') do
-        content_tag(:video, '', data: { fenetre_video_chat_target: 'localVideo' }, autoplay: true, playsinline: true,
-                                muted: true, style: 'width: 200px; height: 150px;')
+      content_tag(:div, class: 'fenetre-video-section fenetre-local-section') do
+        content_tag(:video, '',
+                    data: { fenetre__video_chat_target: 'localVideo' },
+                    autoplay: true,
+                    playsinline: true,
+                    muted: true,
+                    class: 'fenetre-local-video')
       end
     end
 
     def media_control_section
-      content_tag(:div, class: 'fenetre-controls') do
-        toggle_button('Toggle Video', 'toggleVideo') +
-          toggle_button('Toggle Audio', 'toggleAudio') +
-          toggle_button('Share Screen', 'toggleScreenShare')
+      content_tag(:div, class: 'fenetre-controls', role: 'toolbar', 'aria-label': 'Call controls') do
+        toggle_button('Camera', 'toggleVideo', 'Turn off camera') +
+          toggle_button('Mic', 'toggleAudio', 'Mute microphone') +
+          toggle_button('Share Screen', 'toggleScreenShare', 'Share screen')
       end
     end
 
-    def toggle_button(label, action)
-      content_tag(:button, label, data: { action: "fenetre--video-chat##{action}" }, class: 'fenetre-control-button')
+    def toggle_button(label, action, aria_label = nil)
+      content_tag(:button, label,
+                  type: 'button',
+                  data: { action: "fenetre--video-chat##{action}" },
+                  class: 'fenetre-control-button',
+                  'aria-label': aria_label || label,
+                  'aria-pressed': 'false')
     end
 
     def remote_videos_section
-      content_tag(:div, class: 'fenetre-video-section') do
-        content_tag(:div, '', data: { fenetre_video_chat_target: 'remoteVideos' })
+      content_tag(:div, class: 'fenetre-video-section fenetre-remote-section') do
+        content_tag(:div, '', data: { fenetre__video_chat_target: 'remoteVideos' },
+                              class: 'fenetre-remote-grid')
       end
     end
 
@@ -82,14 +98,20 @@ module Fenetre
     end
 
     def chat_messages
-      content_tag(:div, '', data: { fenetre_video_chat_target: 'chatMessages' }, class: 'fenetre-chat-messages')
+      content_tag(:div, '', data: { fenetre__video_chat_target: 'chatMessages' }, class: 'fenetre-chat-messages')
     end
 
     def chat_input_container
       content_tag(:div, class: 'fenetre-chat-input-container') do
-        content_tag(:input, nil, type: 'text', placeholder: 'Type your message...',
-                                 data: { fenetre_video_chat_target: 'chatInput' }) +
-          content_tag(:button, 'Send', data: { action: 'fenetre--video-chat#sendChat' },
+        content_tag(:input, nil, type: 'text', placeholder: 'Message the room…',
+                                 maxlength: 2000,
+                                 autocomplete: 'off',
+                                 data: {
+                                   fenetre__video_chat_target: 'chatInput',
+                                   action: 'keydown.enter->fenetre--video-chat#sendChat'
+                                 }) +
+          content_tag(:button, 'Send', type: 'button',
+                                       data: { action: 'fenetre--video-chat#sendChat' },
                                        class: 'fenetre-chat-send-button')
       end
     end