
Recherche avancée
Médias (91)
-
#3 The Safest Place
16 octobre 2011, par
Mis à jour : Février 2013
Langue : English
Type : Audio
-
#4 Emo Creates
15 octobre 2011, par
Mis à jour : Février 2013
Langue : English
Type : Audio
-
#2 Typewriter Dance
15 octobre 2011, par
Mis à jour : Février 2013
Langue : English
Type : Audio
-
#1 The Wires
11 octobre 2011, par
Mis à jour : Février 2013
Langue : English
Type : Audio
-
ED-ME-5 1-DVD
11 octobre 2011, par
Mis à jour : Octobre 2011
Langue : English
Type : Audio
-
Revolution of Open-source and film making towards open film making
6 octobre 2011, par
Mis à jour : Juillet 2013
Langue : English
Type : Texte
Autres articles (66)
-
Support audio et vidéo HTML5
10 avril 2011MediaSPIP utilise les balises HTML5 video et audio pour la lecture de documents multimedia en profitant des dernières innovations du W3C supportées par les navigateurs modernes.
Pour les navigateurs plus anciens, le lecteur flash Flowplayer est utilisé.
Le lecteur HTML5 utilisé a été spécifiquement créé pour MediaSPIP : il est complètement modifiable graphiquement pour correspondre à un thème choisi.
Ces technologies permettent de distribuer vidéo et son à la fois sur des ordinateurs conventionnels (...) -
HTML5 audio and video support
13 avril 2011, parMediaSPIP uses HTML5 video and audio tags to play multimedia files, taking advantage of the latest W3C innovations supported by modern browsers.
The MediaSPIP player used has been created specifically for MediaSPIP and can be easily adapted to fit in with a specific theme.
For older browsers the Flowplayer flash fallback is used.
MediaSPIP allows for media playback on major mobile platforms with the above (...) -
De l’upload à la vidéo finale [version standalone]
31 janvier 2010, parLe chemin d’un document audio ou vidéo dans SPIPMotion est divisé en trois étapes distinctes.
Upload et récupération d’informations de la vidéo source
Dans un premier temps, il est nécessaire de créer un article SPIP et de lui joindre le document vidéo "source".
Au moment où ce document est joint à l’article, deux actions supplémentaires au comportement normal sont exécutées : La récupération des informations techniques des flux audio et video du fichier ; La génération d’une vignette : extraction d’une (...)
Sur d’autres sites (6425)
-
FFmpeg streaming stuck few minutes after start [closed]
19 février, par josue ramirezSorry for my english ! :D


I'm trying to make a live video stream from my webcam with ffmpeg using Node.


I get the images or frames from ffmpeg via pipe1 on the stdout event and send them via a socket-io client to my angular app to play the stream.


So far the stream starts fine and my angular app can play it fine, but after a certain time (8 minutes or so) ffmpeg stops sending data and the stream in my angular app stops and if I want to start the webcam again it's not possible anymore because it's apparently occupied by another process. I've been trying to figure out what's going on and what I've noticed is that the ffmpeg process just stops and the process is no longer visible with the
top
command (ubuntu), but the child process in node still shows a ffmpeg process as if it were a zombie process.

I've tried running ffmpeg from the terminal to save an mp4 file with the stream and in that case there is no problem, the recording doesn't stop even using pipe1. Only when I run ffmpeg from my Node app, the error occurs.


Does anyone have any idea what could be going on ?


This command is the one that is executed to send the data through pipe1 both from node and from the terminal but it only stops in Node


ffmpeg -f v4l2 -input_format mjpeg -video_size 800x600 -i /dev/video0 -q:v 4 -f image2pipe pipe1



The same thing happens when saving an mp4 video only in Node it fails


ffmpeg -f v4l2 -input_format mjpeg -video_size 800x600 -i /dev/video0 -q:v 4 video.mp4



This is my function that starts the streaming


export const startCamera = () => {
 logger.info('Starting camera ', cameraName);

 const inputFormat = process.platform === 'win32' ? 'dshow' : 'v4l2';

 const ffmpegArgs = [
 '-f', inputFormat, // Formato de entrada según la plataforma
 ];

 if (process.platform === 'linux') {
 ffmpegArgs.push(
 '-input_format', 'mjpeg', // Especificar el formato antes de video_size
 '-video_size', '800x600', // Tamaño de la imagen
 );
 }
 
 ffmpegArgs.push(
 '-i', cameraName, // Dispositivo de entrada
 '-vf', 'fps=15', // Fotogramas por segundo
 '-q:v', '10', // Calidad de video
 '-f', 'image2pipe', // Formato de salida
 'pipe:1' // Salida por stdout
 );

 try {
 logger.info('FFmpeg command: ffmpeg', ffmpegArgs.join(' '));
 ffmpeg = spawn('ffmpeg', ffmpegArgs);
 let cameraOpen = false;
 // Enviar los datos del fotograma a través del WebSocket
 ffmpeg.stdout.on('data', (chunk) => {
 logger.debug(`Sending chunk of ${chunk.length} bytes`);
 if (!cameraOpen) {
 cameraOpen = true;
 serialConnection.connect();
 logger.info('Camera started!!');
 }

 if (streamWS.isActive()) {
 streamWS.send(chunk);
 }
 });
 // Manejo de errores
 ffmpeg.stderr.on('error', (data) => {
 logger.error('FFmpeg Error:', data.toString());
 });

 ffmpeg.on('close', async () => {
 logger.info('Camera closed....', cameraName);
 if (!cameraOpen) {
 await commandWS.send(
 {
 command: COMMANDS.START_STREAM,
 isError: true,
 response: `Error al intentar iniciar la camara ${cameraName}, verificar que la camara se encuentre bien conectada.`,
 },
 COMMANDS_EVENTS.ROBOT_RESPONSE
 );
 }
 cameraOpen = false;
 await serialConnection.close();
 stopCamera();
 await streamWS.disconnectWS();
 });
 } catch (e) {
 logger.error('Error tryng to start the camera...', e);
 }
};



-
Evolution #3119 (Nouveau) : Développer le classement des objets de SPIP par Glissé/lâché
13 décembre 2013, par realet RealETPossibilité de classer des articles par drag’n drop dans l’interface privée, par exemple avec sortable ( http://jqueryui.com/sortable/ ) ou mêmes les images et documents, selon ce même principe (une démo http://blog.arnaud-k.fr/demos/jquery-drag-n-drop/ )
Analyse¶
Il y a déjà une balise #RANG qui calcule le numéro de titre s’il y en a un (ça affiche la partie numéro de numéro point espace titre).
Idéalement, et pour assurer une bonne transition, il faudrait sans doute :- Créer un champ rang
- modifier la balise rang en conséquence
- Enregistrer le numéro du titre dans le champ rang
- Et que l’opération de drag’n’drop :
- modifie les champs rang impactés
- et enregistre aussi le numéro point espace dans les titres pour rétro compatibilité (pouvoir débrayer ça par un define dans mes_options)
- Et rajouter un bouton pour supprimer le classement
Et prévoir que dans les boucles, par rang !par date puisse fonctionner correctement si rang à NULL.
Discussion originale : http://thread.gmane.org/gmane.comp.web.spip.devel/64769
-
Evolution #4749 (Nouveau) : [UX] Comportement des labels : quoi par défaut, quoi ponctuel ?
27 avril 2021, par RastaPopoulos ♥Ce ticket sert à réfléchir et possiblement reconcevoir les choix par défaut pour les labels des formulaires.
État des lieux¶
On le sait, l’ergo c’est normalement beaucoup d’objectif : certains placements, certaines tailles, épaisseurs, etc fonctionnent mieux que d’autres, et ceci est prouvable par tests utilisateurs.
Or cela fait des années que les tests par eye-tracking montrent que les formulaires sont
1) lu plus rapidement
2) avec une meilleure compréhension
lorsque les labels sont au-dessus des champs.Ça ne veut pas dire qu’il faut totalement interdire autrement mais : ça veut clairement dire que ça devrait être le comportement par défaut. Et seulement ponctuellement, par choix explicite, pouvoir mettre les labels sur le côté.
Par ailleurs les pros de l’ergo (sur base des mêmes tests) préconisent tou⋅tes : dans les rares cas où on met les labels sur le côté, ça devrait être calé à droite sur le champ, pour les mêmes raisons de compréhension.
Les avantages des labels au-dessus :
- prouvé que c’est bien mieux compris par tout le monde
- lecture plus rapide
- fonctionne de base sur tous les écrans, pas d’adaptation à faire
- polyvalent et générique sur le contenu des labels : marche mieux quelque soit la longueur, et donc à prioriser dans un contexte multilingue
=> cela correspond bien au maximum de notre utilisation : un CMS multi-lingue, allant enfin vers le responsive, se souciant d’accessibilité.Le seul désavantage : allonge la hauteur des formulaires, mais ça n’a un impact surtout que pour les formulaires ayant vraiment vraiment beaucoup de champs, ce qui est rare !
Quand un formulaire est extrêmement long, il y a même plusieurs méthodes qui peuvent être utilisées sans pour autant passer les labels sur le côté :
1) placer certains champs sur le même ligne (prénom + nom, etc)
2) découper le formulaire en plusieurs étapes.Proposition pour le futur¶
- tous les labels doivent être au-dessus comme comportement par défaut
- pour certains cas, une classe permet de mettre sur le côté : valable uniquement en grand écran, ça reste au-dessus en mobile first
- si sur le côté : c’est mieux si aligné sur le champ (donc à droite en LTR)
- ex de rare formulaire candidat : changement des datesQuelques sources¶
Tests utilisateurs
https://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.phpPlacing a label above an input field works better in most cases
Placing labels above input fields is preferable
In most cases, when placing labels to the left of input fields, using left-aligned labels imposes a heavy cognitive workload on users
if you choose to place them to the left of input fields, at least make them right alignedChez le très connu cabinet d’ergo Nielsen Group
https://www.nngroup.com/articles/form-design-white-space/We recommend placing field labels above the corresponding text fields [en gras chez eux !]
it makes the form easier to scan, because users can see the text field in the same fixation as the label. Top placement also allows for longer field labels
If the labels are too far to the left, it can be difficult to associate the correct label with its corresponding fieldChez Adobe, ils préconisent de suivre les recommandations de la première source
https://xd.adobe.com/ideas/principles/web-design/best-practices-form-design/Matteo Penzo’s 2006 article on label placement suggests that forms are completed faster if labels are on top of the fields. Top-aligned labels are good if you want users to scan the form as quickly as possible.
The biggest advantage of top-aligned labels is that different-sized labels and localized versions can more easily fit the UI.
Takeaway : If you want users to scan a form quickly, put labels above the fields. The layout will be easier to scan because the eye will move straight down the page. However, if you want users to read carefully, put labels to the left of the fields. This layout will slow down the reader and make them scan in a Z-shaped motion.Chez une appli de conception d’interface
https://phase.com/magazine/usability-of-forms/from a cognitive point of view, the association is powerful
Also, the eyes move only in one direction since the scanning is top down as compared to Z shape (left-right and top-bottom) for inline labels
Design is space efficient and hence adaptable to all resolutions ; in short, responsive in nature
We also get flexibility regarding the length of labels. This proves useful while working with variable label lengths like multilingual support for applications
One drawback of this approach is the increased height of the form. However, it can be solved with alternate designs like a grouping of fields or stepper forms