https://www.ruedigerkraft.de/fileadmin/user_upload/www.kraf.de/js/jquery.movielightbox.js?1438784631

1$(document).ready(function(){
2    addPlayerIcon();
3    clickMovie();
4});
5
6function clickMovie(){
7    rolloverClickMovie();
8    clickMovieNameTheBoxes();
9
10    jQuery.uaMatch = function( ua ) {
11        ua = ua.toLowerCase();
12        var match = /(chrome)[ \/]([\w.]+)/.exec( ua ) ||
13            /(webkit)[ \/]([\w.]+)/.exec( ua ) ||
14            /(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) ||
15            /(msie) ([\w.]+)/.exec( ua ) ||
16            ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) || [];
17        return {
18            browser: match[ 1 ] || "",
19            version: match[ 2 ] || "0"
20        };
21    };
22    if ( !jQuery.browser ) {
23        var
24            matched = jQuery.uaMatch( navigator.userAgent ),
25            browser = {};
26        if ( matched.browser ) {
27            browser[ matched.browser ] = true;
28            browser.version = matched.version;
29        }
30        // Chrome is Webkit, but Webkit is also Safari.
31        if ( browser.chrome ) {
32            browser.webkit = true;
33        } else if ( browser.webkit ) {
34            browser.safari = true;
35        }
36        jQuery.browser = browser;
37    }
38
39    $('.movie-lightbox .vid-icon').on('click', function(e){
40        e.preventDefault();
41        var appendHtml, vidData, vidWidth, vidHeight, halfWidth, halfHeight,type, prevImg,vidOgg,vidMp4,vidFlv,vidYoutube,vidWebm,vidArr,currBrowser,ieBrowser,operaBrowser,vidWidth,vidHeight,elem;
42
43        elem = $(this);
44        currBrowser = $.browser;
45        ieBrowser = false;
46        if(currBrowser.mozilla){
47            var splitVers = currBrowser.version.split('.');
48            if(splitVers[0] <= 11){
49                ieBrowser = true;
50            }
51        }
52        operaBrowser = false;
53        if(currBrowser.chrome){
54            var splitOpera = navigator.vendor.split('Opera');
55            if(splitOpera[1] != undefined){
56                if(splitOpera[1].length > 2){
57                    operaBrowser = true;
58                }
59            }
60        }
61        vidOgg      = elem.attr('data-ogg');
62        vidMp4      = elem.attr('data-mp4');
63        vidFlv      = elem.attr('data-flv');
64        vidWebm     = elem.attr('data-webm');
65        vidYoutube  = elem.attr('data-youtube');
66        vidWidth    = elem.attr('data-width');
67        vidHeight    = elem.attr('data-height');
68        if(vidWidth == ''){
69            vidWidth = 530;
70        }
71        if(vidHeight == ''){
72            vidHeight = 400;
73        }
74
75        vidArr = [];
76        if(vidOgg != ''){
77            vidArr['ogg']       = vidOgg;
78        }
79        if(vidMp4 != ''){
80            vidArr['mp4']       = vidMp4;
81        }
82        if(vidFlv != ''){
83            vidArr['flv']       = vidFlv;
84        }
85        if(vidWebm != ''){
86            vidArr['webm']      = vidWebm;
87        }
88        if(vidYoutube != ''){
89            vidArr['youtube']   = vidYoutube;
90        }
91
92        prevImg = elem.find('img').attr('src');
93
94        //vidWidth = 320;
95        //vidHeight = 233;
96        //vidHeight = $(this).find('img').height();
97
98        if(((currBrowser.chrome && operaBrowser == false) || ieBrowser || currBrowser.safari) && vidArr['mp4'] != ''){
99            type = 'mp4';
100            vidData = vidArr['mp4'];
101        }else if((currBrowser.mozilla || currBrowser.chrome || currBrowser.opera) && vidArr['webm']){
102            type = 'webm';
103            vidData = vidArr['webm'];
104        }else if(1==2){
105            type = 'x-m4v';
106            vidData = vidArr['m4v'];
107        }else if((currBrowser.ie) && vidArr['flv']){
108            type = 'flv';
109            vidData = vidArr['flv'];
110        }else if(vidArr['youtube']){
111            vidWidth = 580;
112            vidHeight = 335;
113            type = 'youtube';
114            vidData = vidArr['youtube'];
115        }else if((currBrowser.mozilla || operaBrowser) && vidArr['ogg']){
116            type = 'ogg';
117            vidData = vidArr['ogg'];
118        }else{
119            type = 'none'
120        }
121
122        if(type != 'none'){
123
124            halfWidth = vidWidth/2;
125            halfHeight = vidHeight/2;
126
127            if($('#lightbox-bg').length == 0){
128                $('body').append('<div id="lightbox-bg"></div>');
129            }else{
130                $('#lightbox-bg').empty();
131            }
132
133
134            appendHtml =  '<div id="lightbox-mov" style="width:'+(vidWidth*1+20)+'px;height:'+(vidHeight*1+20)+'px;margin:-'+halfHeight+'px 0 0 -'+halfWidth+'px;" >';
135            if(type == 'youtube'){
136                appendHtml += '<iframe width="'+vidWidth+'" height="'+vidHeight+'" src="'+vidData+'" frameborder="0" allowfullscreen></iframe>';
137            }else if(type == 'flv'){
138                appendHtml += '<embed width="'+vidWidth+'" height="'+vidHeight+'" name="plugin" src="'+vidData+'" type="video/'+type+'">';
139            }else if(type=='mp4'){
140                appendHtml += '<video height="'+vidHeight+'" width="'+vidWidth+'" data-setup="" controls="" poster="'+prevImg+'" preload="none" class="video-js vjs-default-skin" id="video_1">';
141                appendHtml += '<source type="video/'+type+'" codecs="avc1.42E01E, mp4a.40.2" src="'+vidData.replace(' ','')+'"></source>';
142                appendHtml += '</video>';
143                appendHtml += '<p class="vjs-no-video" ></p>';
144            }else{
145                appendHtml += '<video height="'+(vidHeight)+'" width="'+(vidWidth)+'" data-setup="" controls="" poster="'+prevImg+'" preload="auto" class="video-js vjs-default-skin" id="video_1">';
146                appendHtml += '<source type="video/'+type+'" codecs="theora, vorbis"  src="'+vidData.replace(' ','')+'"></source>';
147                appendHtml += '</video>';
148                appendHtml += '<p class="vjs-no-video" ></p>';
149            }
150            appendHtml += '<div id="lightbox-close" ></div>';
151            appendHtml += '</div>';
152
153            $('body').append(appendHtml);
154
155            $('#lightbox-bg').fadeIn('fast');
156            $('#lightbox-mov').fadeIn('fast');
157
158            lightboxClose();
159
160        }else{
161            return false;

162        }
163    });
164};
165
166function addPlayerIcon(){
167    $('.movie-lightbox .teasing').append('<div class="icon"></div>');
168}
169
170function clickMovieNameTheBoxes(){
171    var i=0;
172    $('.movie-lightbox').each(function(){
173        i++;
174        var elemIndex = $(this).index();
175
176        $(this).addClass('movieCount'+i).addClass('elemIndex'+elemIndex);
177    });
178}
179
180function lightboxClose(){
181    $('#lightbox-bg,#lightbox-close').on('click', function(e){
182        e.preventDefault();
183        $('#lightbox-bg').fadeOut('fast', function(){
184            $(this).empty();
185        });
186        $('#lightbox-mov').fadeOut('fast', function(){
187            $(this).remove();
188        });
189    });
190};
191
192function rolloverClickMovie(){
193    $('.movie-lightbox').on('mouseover', function(){
194        var box = $(this);
195
196        box.find('.rollover').animate({
197            bottom: '100%'
198        },200);
199
200        box.find('.icon').animate({
201            bottom: '0'
202        },200);
203
204    });
205
206    $('.movie-lightbox').on('mouseleave', function(){
207        var box;
208
209        box = $(this);
210
211        box.find('.rollover').animate({
212            bottom: '0px'
213        },200);
214
215        box.find('.icon').animate({
216            top: '100%'
217        },200);
218    });
219}