WBCE CMS Forum

berny

Mitglied

Youtube erweitern

Ich würde gerne das Preset Youtube um eine Funktion erweitern, die zB Videos von anderen Anbietern einbindet.

<script>
function showytvideo(youtubeID) {
var fr = '<iframe src="https://www.youtube.com/embed/'+youtubeID+'?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>';

$('#itemzVideo').html(fr);
$('#itemzVideo').addClass('responsiveVideo');

$('.teaserbox').removeClass('nowVideoPlaying');
var dings = '#vid'+youtubeID;
$(dings).addClass('nowVideoPlaying');

}
</script>

Ich würde als Ansatz vor der function eine if-then Abfrage einfügen, wobei ich den Short2 für die Definition des Portals überlassen würde.

<a class="youtubethumb" href="#itemzVideo" onclick="showytvideo('[SHORT1]','[SHORT2]')">

zB Short2 = Youtube bzw LT1

<script>
function showytvideo(youtubeID) {

if ( var youtubeID[1] = 'LT1') {
var fr='iframeangaben für LT1'
und mehr
} 
elseif (var youtubeID[1] = 'Youtube' OR youtubeID[1] = '') {
var fr = '<iframe src="https://www.youtube.com/embed/'+youtubeID[0]+'?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>';

$('#itemzVideo').html(fr);
$('#itemzVideo').addClass('responsiveVideo');

$('.teaserbox').removeClass('nowVideoPlaying');
var dings = '#vid'+youtubeID[0];
$(dings).addClass('nowVideoPlaying');

} 

Punkt 1: ich bin kein Javascript experte (Lesen ja, schreiben so lala)
Punkt 2: ginge das überhaupt in dieser Weise?
Punkt 3: bin für jede Hilfe dankbar

florian

Administrator

Re: Youtube erweitern

ich würde das nicht mit itemz, sondern OneForAll und entsprechenden Feld-Templates machen. Für jede Plattform dann ein Feld mit dem jeweiligen Code im Temolate anlegen, und dann je nach dem, wo das Video liegt, beim OneForAll -Eintrag dann die URL ins passende Feld eintragen. Da OneForAll nur die Felder/Feldtemplates ausgibt, in denen auch was hinterlegt ist, würde man sich so das ganze if else Geraffel ersparen und evtl. sogar komplett ohne JS auskommen.

berny

Mitglied

Re: Youtube erweitern

Naja, jetzt ist das halt mit dem Youtube-Itemz schon am laufen.

Das mit dem OneForAll muss ich mir erst ansehen...

berny

Mitglied

Re: Youtube erweitern

Habs jetzt erstmal dirty erledigt, indem ich in den Optionen entsprechende Einträge gemacht habe:

Fusszeile:

<script>
function showytvideo(youtubeID,source) {
 if ( source == 'Extern' )  {
var fr = '<iframe src="'+youtubeID+'?rel=0&autoplay" frameborder="0" allowfullscreen></iframe>';
} else if ( source == '' )  {
var fr = '<iframe src="https://www.youtube.com/embed/'+youtubeID+'?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>';
}

$('#itemzVideo').html(fr);
$('#itemzVideo').addClass('responsiveVideo');

$('.teaserbox').removeClass('nowVideoPlaying');
var dings = '#vid'+youtubeID;
$(dings).addClass('nowVideoPlaying');

}
</script>

Item:

<div id="vid[SHORT1]" style="position:relative;" class="equalbox teaserbox">

<a class="youtubethumb" href="#itemzVideo" onclick="showytvideo('[SHORT1]','[SHORT2]')">
<script>
var videothumb = '[SHORT3]';
if ( videothumb == '' ) {
document.write( '<img style="width:100%"  src=" https://img.youtube.com/vi/[SHORT1]/0.jpg" title="[NAME]" alt="video">');
} else {
document.write( '<img style="width:100%"  src="[SHORT3]" title="[NAME]" alt="video">');
}
</script>
</a>

<div style="padding:3px 2%">
[EDITLINK]<h3>[NAME]</h3>
{LONG1}
</div>
</div>

Short 2 wird definiert, wenn eine andere Quelle notwendig ist.
Extern für Standard. Wenn vorhanden, wird in YoutubeID  der komplette iFrame Code eingetragen.
In Short 3 die Thumbnail Quelle.

Dabei gehe ich davon aus, dass alles über Youtube in Short2 und 3 leer bleibt, weil ein Eintrag nicht notwendig ist.
Bei anderen Quellen ist ein Vorschaubild und ein IFrame notwendig, der angegeben werden muss.

Funkt an sich sehr gut ;-)

Wenn ein anderer Code einer anderen Quelle notwendig ist, muss ich diesen in den Optionen entsprechend nachtragen...