forum.mozilo.de das Supportforummozilo Forum
Willkommen Gast. Bitte einloggen oder registrieren. Haben Sie Ihre Aktivierungs E-Mail übersehen?

Einloggen mit Benutzername, Passwort und Sitzungslänge

Autor Thema: Mobilgerät-kompatibler Player für Audio- und Videodateien  (Gelesen 3144 mal)

0 Mitglieder und 1 Gast betrachten dieses Thema.

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Hallo zusammen,

für die Einbindung von Audio- oder Videodateien in moziloCMS stehen mit dem MP3-Player und dem FlayrPlayer bisher nur Flash-basierte Plugins zur Verfügung. Da Flash aber von immer weniger Browsern (und Anwendern!) unterstützt wird und auf Mobilgeräten nicht immer sauber funktioniert, habe ich ein Player-Plugin geschrieben, das ohne Flash funktioniert: Den Audio- und Videoplayer.

Das Plugin unterstützt folgende Dateiformate:
  • mp3 (audio/mpeg)
  • ogg (audio/ogg)
  • wav (audio/wav)
  • mp4 (video/mp4)
  • webm (video/webm)
  • ogg (video/ogg)
Das Rendern des Players liegt beim Browser. Für die Audioformate wird ein Player mit Kontrollelementen (Play/Pause, Lautstärke) erzeugt. Der Player für die Videoformate bekommt keine Breite und Höhe vorgegeben - der Browser rendert ihn einfach so groß wie das Video.
Die Player lassen sich über die CSS-Klasse audiovideo optisch verändern; eine Rumpf-CSS-Datei mit den passenden Selektoren liegt dem Pluginverzeichnis bei.

Download:
Hier im Pluginarchiv

Dokumentation:
Auf arvidzimmermann.de

CMS-Version:
Ich habe das Plugin unter moziloCMS 1.12 und 2.0 getestet.


Lasst mich bitte wissen, ob alles sauber funktioniert.

Beste Grüße
Arvid
« Letzte Änderung: 11. Juni 2016, 22:57:09 von azett »
 

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #1 am: 14. Juni 2016, 21:45:52 »
MarcAurel kommentierte im Pluginarchiv:
Zitat
Ich habe heute bei einem Test auf einem Server ohne die Funktion „mime_content_type“  einen Fehler vom Plugin bekommen.  Die Funktion ist auch als „deprecated“ markiert, eine  Ersatz-Funktion wie 'finfo_open' war auch nicht vorhanden. Ich würde vorschlagen statt „mime_content_type“ die folgende Funktion aufrufen um unschöne Abstürze zu vermeiden:

function _mime_content_type($filename) {
      if(function_exists('mime_content_type')) {
         return mime_content_type($filename);
      }
      elseif (function_exists('finfo_open')) {
            $finfo = finfo_open(FILEINFO_MIME);
            $mimetype = finfo_file($finfo, $filename);
            finfo_close($finfo);
            return $mimetype;
      }
      else{
          $mime_types = array(
            // audio
            'mp3' => 'audio/mpeg',
         'ogg' => 'audio/ogg',
         'wav' => 'audio/wav',
         //video
         'mp4' => 'video/mp4',
         'webm' => 'video/webm',
         );         
         $ext = strtolower(array_pop(explode('.',$filename)));
         if (array_key_exists($ext, $mime_types)) {
            return $mime_types[$ext];
         }         
         else {
            return 'unknown/unknown';
         }
      }
   }
Danke für den Hinweis, ich habe das in angepasster Form eingebaut.

Frage in die Runde: Wärt ihr so gut und könntet den angehängten Stand nochmal auf unterschiedlichen Umgebungen testen? Wenn alles sauber läuft, tät ichs dann als neue Version veröffentlichen.

Danke!
Arvid
 

 

Offline bemerkenswelt

  • Mitglied
  • *
  • Beiträge: 175
    • Profil anzeigen
    • http://www.bemerkenswelt.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #2 am: 14. Juni 2016, 23:24:46 »
Wärt ihr so gut und könntet den angehängten Stand nochmal auf unterschiedlichen Umgebungen testen?

Läuft im Prinzip prima.
Video: mp4, Provider: UD-Media, PHP: 5.6

Nur leider ist vom Bild nur die linke Hälfte zu sehen, da das Video breiter ist, als der content Bereich.
Könnte man das noch in die plugin.css einbauen, damit ich, als CSS Anfänger, nicht darin rumschrauben muss (und MarcAurels Hinweis einbauen)?

Link zu meiner Testseite hier >
« Letzte Änderung: 14. Juni 2016, 23:32:16 von bemerkenswelt »
Schöne Grüße
Manfred

Besucht mich auf: www.bemerkenswelt.de
 

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #3 am: 15. Juni 2016, 07:33:46 »
Danke für den Hinweis, die plugin.css sieht nun so aus:
.audiovideo {
/* Sowohl für Audio- als auch Videoplayer: Nicht breiter als der Inhalt! */
max-width: 100%;
height: auto;
}
audio.audiovideo {
/* Audioplayer hier nach Belieben stylen */
}
video.audiovideo {
/* Videoplayer hier nach Belieben stylen */
}
Dann passts?


Abgesehen davon: Ich würde auf meiner Website gern eine kleine Demo des Players zeigen - kennt wer eine zuverlässige Quelle für freie (!) kurze Audio- und Videoclips?

Danke und Gruß
Arvid
« Letzte Änderung: 15. Juni 2016, 07:36:49 von azett »
 

 

Offline bemerkenswelt

  • Mitglied
  • *
  • Beiträge: 175
    • Profil anzeigen
    • http://www.bemerkenswelt.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #4 am: 15. Juni 2016, 09:32:48 »
Guten Morgen,
und Vielen Dank.

Ich möchte nicht nerven, aber mir kommt da noch eine Frage:
Wäre es möglich einen für Laien begehbaren Weg einzubauen, um dem Player zu sagen, dass er per Autostart sofort beginnen soll?

Evtl. so wie im Galerie Plugin ColorBox. Da kann ich auf der Seite mit Parametern ja jeweils individuell einstellen, ob zum Beispiel Slideshow auf auto steht oder nicht. Könnte dann in diesem Fall vielleicht so aussehen: {audiovideo|Kategorie:dateiname.mp3,autostart}
Schöne Grüße
Manfred

Besucht mich auf: www.bemerkenswelt.de
 

 

Offline bemerkenswelt

  • Mitglied
  • *
  • Beiträge: 175
    • Profil anzeigen
    • http://www.bemerkenswelt.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #5 am: 15. Juni 2016, 17:56:00 »
Danke für den Hinweis, die plugin.css sieht nun so aus:
.audiovideo {
   /* Sowohl für Audio- als auch Videoplayer: Nicht breiter als der Inhalt! */
   max-width: 100%;
   height: auto;
}
audio.audiovideo {
   /* Audioplayer hier nach Belieben stylen */
}
video.audiovideo {
   /* Videoplayer hier nach Belieben stylen */
}
Dann passts?

Hallo,
hab's gerade nochmal runtergeladen, aber Breite/Höhe ist in der plugin.css noch nicht drin.
Schöne Grüße
Manfred

Besucht mich auf: www.bemerkenswelt.de
 

 

Offline MarcAurel

  • Mitglied
  • *
  • Beiträge: 124
    • Profil anzeigen
    • Mozilo Testversion
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #6 am: 19. Juni 2016, 09:13:00 »

hab's gerade nochmal runtergeladen, aber Breite/Höhe ist in der plugin.css noch nicht drin.

Man sollte dem Plugin die gewünschte Breite als Parameter übergeben können, die Höhe passt sich dann automatisch an, wenn die weitere Eigenschaften wie unten vorhanden sind.
Die Breite sollte man direkt per Script als CSS Eigenschaft schreiben:

video { 
        width:100%;
        max-width:500px;
        height:auto;
    }

Man kann natürlich auch ein Parameter "autoplay" übergeben können, es würde so aussehen:

<video controls autoplay>

aber ein autoplay würde ich nicht empfehlen, es kann nur nerven wenn unerwünscht etwas einfach so startet.
 

 

Offline bemerkenswelt

  • Mitglied
  • *
  • Beiträge: 175
    • Profil anzeigen
    • http://www.bemerkenswelt.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #7 am: 19. Juni 2016, 11:16:57 »
... aber ein autoplay würde ich nicht empfehlen, es kann nur nerven wenn unerwünscht etwas einfach so startet.

Mag prinzipiell richtig sein, im Einzelfall kann aber auch ein Autostart sinnvoll sein.
Der nutzt mir aber als generelle Einstellung, in der plugin.css nichts, weil er auf der Seite individuell machbar sein muss. Als Parameter bei der Einbindung des jeweiligen Videos halt.

Aber ich kann dafür ja, wie bisher, den Umweg über das Hochladen zu YouTube oder Vimeo gehen. Macht sowieso Sinn für speicherintensive Videos nicht den eigenen Webspace zu verbrauchen. So wie ich es bisher mache – siehe hier >

Schönen Sonntag noch allerseits.
Schöne Grüße
Manfred

Besucht mich auf: www.bemerkenswelt.de
 

 

Offline MarcAurel

  • Mitglied
  • *
  • Beiträge: 124
    • Profil anzeigen
    • Mozilo Testversion
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #8 am: 19. Juni 2016, 14:17:08 »
Mit wenig Mühe sollte man auch das Einbinden von externen Resourcen möglich machen, Video-Dateien kann man auch auf einem Extra-Server halten:

http://mozilo.info/Extras/VideoTest.html

und ich würde an die Überprüfumng von mime-type verzichten und nur über "extension" entscheiden was und wie angezeigt werden soll.

 

 

Offline MarcAurel

  • Mitglied
  • *
  • Beiträge: 124
    • Profil anzeigen
    • Mozilo Testversion
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #9 am: 19. Juni 2016, 14:56:42 »
und noch etwas, man kann auch ein Bild als Startanzige zeigen:

<video controls preload="none" poster="myvideo.jpg">

 wenn myvideo.mp4 - > file_exists( myvideo.jpg) or file_exists( myvideo.png)
 

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #10 am: 01. Juli 2016, 15:59:42 »
Hi,

danke für euer Feedback. Komme aktuell mal wieder zu nix, steht aber aufm Zettel.
Bezüglich der Optionen: Ich wollte es so einfach wie möglich halten. Ich werd mir was überlegen, wie ichs dem Einsteiger so übersichtlich wie möglich, aber dem Profi voll konfigurierbar anbiete. Sollte zu machen sein ;)

Gruß
Arvid
 

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #11 am: 11. August 2016, 17:49:03 »
Hallo,

danke für die Anregungen und Hinweise. Ich habe zwischenzeitlich das Einbinden externer Mediendateien sowie eine globale und Player-individuelle Konfiguration nachgerüstet (einzig das "poster"-Attribut fürs Previewbildchen ist noch nicht drin). Bevor ichs im Pluginarchiv aktualisiere, schaut bitte mal drauf und lasst mich wissen, ob alles sauber unter 1.12 und 2.0 funktioniert. Als Dokumentation soll euch dabei erst einmal nur die Plugin-Info im moziloAdmin herhalten - detaillierte Doku mit Beispielen reiche ich dann später auf meiner Website nach.

Danke und Gruß
Arvid
 

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #12 am: 12. August 2016, 20:26:18 »
Bevor ich später wieder nicht dazu komme, hab ichs nun doch schon auf meiner Website dokumentiert und im Pluginarchiv aktualisiert ;)
 

 

Offline mozzi

  • Mitglied
  • *
  • Beiträge: 112
    • Profil anzeigen
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #13 am: 23. August 2016, 18:28:11 »
Hallo Arvid,

ich habe jetzt mal das Plugin in einer Testinstallation geladen.
Versionsinfo:
2.0 ("Amalia")
Revision 36

Mit deaktiviertem Plugin sehe ich die ganz normale Webseite, mit aktiviertem Plugin funktioniert die MP4-Wiedergabe, aber oberhalb des Doctype-Headers steht im Quelltext:

<br />
<b>Strict Standards</b>:  Only variables should be passed by reference in <b>/var/www/######################################/plugins/audiovideo/index.php</b> on line <b>331</b><br />

Der Webspace, auf dem das CMS läuft, ist etwas älter, aber bislang hatte ich dort noch nie Probleme mit ungewöhlichen PHP-Einstellungen.

Soweit mal. Bin gespannt, ob das zu einem Update führt ;-)

Grüße
Mozzi
Signatur? Ich nehm die Vorlage: "Die Bilder in ihrer Signatur dürfen nicht größ als 640x320 Pixel sein" ... ;-)
 

 

Offline azett

  • Coder
  • Mitglied
  • ****
  • Beiträge: 2396
  • mozilo-Coder a.D.
    • Profil anzeigen
    • arvidzimmermann.de
Re: Mobilgerät-kompatibler Player für Audio- und Videodateien
« Antwort #14 am: 30. August 2016, 08:10:55 »
Weißt du, welche PHP-Version da läuft?