1var facebookToken = "115669525196699|qg4coevuUEqtoXUBLvFaupD5CHs"; 2 3var facebookText = []; 4var saveFacebookText = true; 5 6var monthNames = ["Januar", "Februar", "März", 7 "April", "Mai", "Juni", "Juli", 8 "August", "September", "Oktober", 9 "November", "Dezember"]; 10 11var facebookItemLayout = ["w2", "w2 h2", "", "w2 h2", "w2", "h2", "", "", "", "", "", ""]; 12 13var currentFacebookVideoOverlay = null; 14var currentFacebookVideo = null; 15var currentFacebookVideoControls = null; 16 17$(document).ready(function(){ 18 19 //////////////////////////////////////////////////////////////////////////////////// 20 // Load Data /////////////////////////////////////////////////////////////////////// 21 loadFacebookData("universalpicturesuk", facebookToken); 22 23 $(window).resize(function(){ 24 25 //scaleFacebookImages(); 26 }); 27}); 28 29function loadFacebookData(id, token) { 30 31 32 33 var facebookDataURL = "https://graph.facebook.com/" + id + "/posts?fields=link,type,source,picture,created_time,message&date_format=U&access_token=" + token; 34 35 //console.log(facebookDataURL); 36 37 //console.log(facebookDataURL); 38 39 $.getJSON(facebookDataURL, function(posts) { 40 41 // console.log(feed.data[0].link); 42 43 posts.data.length = 6; 44 45 for(var i = 0; i < posts.data.length; i++) { 46 47 /* 48 var item = new Object(); 49 item.source = "facebook"; 50 item.id = feed.data[i].id; 51 item.date = feed.data[i].created_time; 52 item.image = feed.data[i].picture; 53 item.text = feed.data[i].message; 54 item.link = feed.data[i].link; 55 item.type = feed.data[i].type; 56 item.video = feed.data[i].source; 57 58 socialItems.push(item); 59 */ 60 61 var date = new Date(posts.data[i].created_time * 1000); 62 var dateString = date.getDate() + ". " + monthNames[date.getMonth()] + " " + 63 date.getFullYear(); 64 65 if(dateLocaleStringFacebook){ 66 var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; 67 dateString = date.toLocaleDateString(dateLocaleStringFacebook, options); 68 } 69 70 if(posts.data[i].type == "video") { 71 72 $("#facebook-content").append(facebookVideoItem(posts.data[i].picture, dateString, posts.data[i].message, 73 facebookItemLayout[i], posts.data[i].source, posts.data[i].link)); 74 75 /* 76 if(posts.data[i].object_id != null) 77 getFacebookVideo(posts.data[i].object_id, i); 78 else { 79 80 var id = posts.data[i].link.split("/"); 81 //console.log(id[id.length - 2]); 82 83 getFacebookVideo(id[id.length - 2], i); 84 } 85 */ 86 } 87 else /*if(posts.data[i].type == "photo")*/ { 88 89 $("#facebook-content").append(facebookItem(posts.data[i].picture, dateString, posts.data[i].message, 90 facebookItemLayout[i], posts.data[i].link)); 91 } 92 93 // Load high quality image 94 getFacebookImage(posts.data[i].id, i); 95 96 } 97 98 setupFacebookLayout(); 99 }); 100} 101 102var fbItemAni = new TimelineMax({repeat:-1}); 103function setupFacebookLayout() { 104 105 $("#facebook-content").isotope({ 106 layoutMode: "packery", 107 itemSelector: ".facebook-item", 108 percentPosition: true, 109 transitionDuration: "0s", 110 packery: { 111 gutter: ".gutter-sizer" 112 } 113 }); 114 115 setupFacebookText(); 116 $(window).resize(function(){ 117 118 setupFacebookText(); 119 scaleFacebookImages(); 120 }); 121 122 // Mouseover & Mouseout 123 $(".facebook-item").mouseover(function(e) { 124 125 var img = $(this).find("img"); 126 127 var gap = $(img).height() - $(img).parent().height(); 128 129 if($(img).hasClass("animate") && !$(img).hasClass("animating") && gap > 30) 130 TweenMax.to($(img), 1 * gap/30, {marginTop:-gap, yoyo:true, repeat:1, repeatDelay:1, ease:Power2.easeInOut, onComplete:fbItemAniDone, onCompleteParams:[img]}); 131 132 $(img).addClass("animating"); 133 }); 134 135 /* 136 $(".facebook-item").mouseout(function(e) { 137 138 fbItemAni.pause(); 139 fbItemAni = new TimelineMax(); 140 }); 141 */ 142 143 // Sound Slider 144 $(".facebook-item-video").parent().find(".video-sound").mouseover(function() { 145 146 TweenMax.to(this, 0.5, {x:-75, ease:Back.easeOut}); 147 TweenMax.to($(this).parent().find(".video-sound-slider"), 0.5, {delay:0.2, autoAlpha:1}); 148 }); 149 150 //$(".facebook-item-video").parent().find(".video-sound-slider-handle") 151 152 $(".facebook-item-video").parent().find(".video-sound-slider-handle").each(function() { 153 154 Draggable.create(this, {type:"x", bounds:{maxX:0, minX:-$(this).parent().outerWidth() + $(this).width()}})[0].addEventListener("drag", function() { 155 156 var offset = $(this).offset().left - $(this).parent().offset().left; 157 158 $(this).parent().find(".video-sound-slider-fill").css("width", offset); 159 160 var volume = Math.round(100/$(this).parent().width() * offset)/100; 161 if(volume < 0) 162 volume = 0; 163 currentFacebookVideo.volume = volume; 164 }); 165 }); 166 167 $(".facebook-item-video").parent().find(".video-sound-slider").mousedown(function(e) { 168 169 var clickOffset = e.pageX - $(this).offset().left; 170 var percent = 100/$(this).width() * clickOffset; 171 172 $(this).find(".video-sound-slider-fill").css("width", percent + "%"); 173 TweenMax.set($(this).find(".video-sound-slider-handle"), {x:clickOffset-$(this).width()}); 174 Draggable.get($(this).find(".video-sound-slider-handle")).update(); 175 176 currentFacebookVideo.volume = percent/100; 177 178 Draggable.get($(this).find(".video-sound-slider-handle")).startDrag(e); 179 }); 180 181 $(".facebook-item-video").parent().find(".video-sound-slider").click(function(e) { 182 183 var clickOffset = e.pageX - $(this).offset().left; 184 var percent = 100/$(this).width() * clickOffset; 185 186 $(this).find(".video-sound-slider-fill").css("width", percent + "%"); 187 TweenMax.set($(this).find(".video-sound-slider-handle"), {x:clickOffset-$(this).width()}); 188 Draggable.get($(this).find(".video-sound-slider-handle")).update(); 189 190 currentFacebookVideo.volume = percent/100; 191 }); 192 193 $(".facebook-item-video").click(function() { 194 195 facebookVideoPause($(this).parent().find(".video-pause")); 196 }); 197} 198 199function fbItemAniDone(img) { 200 201 $(img).removeClass("animating"); 202} 203 204function setupFacebookText() { 205 206 $(".facebook-item-text").each(function(i) { 207 208 // Save text for later use 209 if(saveFacebookText) 210 facebookText.push($(this).text()); 211 else 212 $(this).text(facebookText[i]); 213 214 var height; 215 if($(this).parent().hasClass("h2")) { 216 217 height = $(this).parent().height() / 2; 218 } 219 else { 220 221 height = $(this).parent().height(); 222 } 223 $(this).height(height - 70); 224 }); 225 226 // Text is saved no need to save again 227 saveFacebookText = false;
228 229 // This cuts the text 230 $('.facebook-item-text').truncate({ 231 width: 'auto', 232 token: '...', 233 side: 'right', 234 multiline: true 235 }); 236} 237 238function facebookItem(img, date, text, style, postLink) { 239 240 var imageStyle = "" 241 if(aContainsB(style, "h2")) imageStyle = "h2"; 242 else if(aContainsB(style, "w2")) imageStyle = "w2"; 243 244 var textStyle = ""; 245 if(aContainsB(style, "h2")) textStyle = "h2"; 246 247 return "<div class='facebook-item " + style +"'>" + 248 "<div class='facebook-item-image " + imageStyle + "'>" + 249 //"<img src='" + img + "'/>" + 250 "<img src='" + img + "'/>" + 251 "<a href='" + postLink + "' target='_blank' style='position: absolute; width: 100%; height: 100%;'></a>" + 252 "</div>" + 253 "<div class='facebook-item-content " + textStyle + "'></img>" + 254 "<div class='facebook-item-date'>" + date + "</div>" + 255 "<div class='facebook-item-line'></div>" + 256 "<div class='facebook-item-text'>" + text + "</div>" + 257 "</div>" + 258 "</div>"; 259} 260 261function facebookVideoItem(img, date, text, style, source, postLink) { 262 263 var imageStyle = "" 264 if(aContainsB(style, "h2")) imageStyle = "h2"; 265 else if(aContainsB(style, "w2")) imageStyle = "w2"; 266 267 var textStyle = ""; 268 if(aContainsB(style, "h2")) textStyle = "h2"; 269 270 return "<div class='facebook-item " + style +"'>" + 271 "<div style='background:black;' class='facebook-item-image " + imageStyle + "' onmouseover='showFacebookControls(this)' onmouseout='hideFacebookControls(this)'>" + 272 "<img style='opacity:1;' src='" + img + "'/>" + 273 "<video class='facebook-item-video' src='" + source + "'></video> " + 274 "<div class='video-controls'>" + 275 "<button class='video-pause video-images' onclick='facebookVideoPause(this)'></button>" + 276 "<div class='video-sound-slider'>" + 277 "<div class='video-sound-slider-bg'></div><div class='video-sound-slider-fill'></div><div class='video-sound-slider-handle'></div>" + 278 "</div>" + 279 "<button class='video-sound video-images' onclick='toggleFacebookSound(this)'></button>" + 280 "<button class='video-link video-images' onclick='openFacebookLink(this)' postLink='" + postLink + "'></button>" + 281 "<button class='video-fullscreen video-images' onclick='facebookVideoFullscreen(this)'></button>" + 282 "<div class='video-progress-container'>" + 283 "<div class='video-progress'></div>" + 284 "<div class='video-progress-click'></div>" + 285 "</div>" + 286 "</div>" + 287 "<div class='facebook-item-video-btn' style='cursor:pointer;' onclick='facebookVideoClicked(this)'>" + 288 "<div class='videos-item-play'></div>" + 289 "</div>" + 290 "</div>" + 291 "<div class='facebook-item-content " + textStyle + "'></img>" + 292 "<div class='facebook-item-date'>" + date + "</div>" + 293 "<div class='facebook-item-line'></div>" + 294 "<div class='facebook-item-text'>" + findLinks(text) + "</div>" + 295 "</div>" + 296 "</div>"; 297} 298 299function toggleFacebookSound(button) { 300 301 if(currentFacebookVideo.muted) { 302 303 currentFacebookVideo.muted = false; 304 $(button).removeClass("muted"); 305 } 306 else { 307 308 currentFacebookVideo.muted = true; 309 $(button).addClass("muted"); 310 } 311} 312 313function deactivateFacebookVideo() { 314 315 currentFacebookVideo.pause(); 316 $(currentFacebookVideo).css("display", "none"); 317 $(currentFacebookVideoControls).css("display", "none"); 318 $(currentFacebookVideoOverlay).css("display", "block"); 319} 320 321function openFacebookLink(button) { 322 323 facebookVideoPause(button); 324 325 var win = window.open($(button).attr("postLink"), "_blank"); 326 win.focus(); 327} 328 329function showFacebookControls(item) { 330 331 var controls = $(item).find(".video-controls"); 332
333 TweenMax.to($(controls), 0.5, {bottom:0, ease:Back.easeOut}); 334} 335 336function hideFacebookControls(item) { 337 338 var controls = $(item).find(".video-controls"); 339 340 TweenMax.to($(controls), 0.5, {bottom:0, ease:Back.easeOut, onComplete:hideFacebookSoundSlider}); 341} 342 343function hideFacebookSoundSlider() { 344 345 TweenMax.to($(".facebook-item-video").parent().find(".video-controls .video-sound"), 0.3, {delay:0.2, x:0}); 346 TweenMax.to($(".facebook-item-video").parent().find(".video-controls .video-sound-slider"), 0.5, {autoAlpha:0}); 347} 348 349function facebookVideoClicked(overlay) { 350 351 headerVideo.muted = true; 352 soundIcon(false); 353 354 destroyYoutubeVideo(); 355 356 if(currentFacebookVideo != null) 357 deactivateFacebookVideo(); 358 359 currentFacebookVideoOverlay = overlay; 360 361 var video = $(overlay).parent().find("video")[0]; 362 currentFacebookVideo = video; 363 364 var controls = $(overlay).parent().find(".video-controls"); 365 currentFacebookVideoControls = controls; 366 367 if (video.paused) { 368 369 //if(!isMobile()) { 370 371 $(overlay).css("display", "none"); 372 $(controls).css("display", "block"); 373 //} 374 375 //$(video).css("opacity", "1"); 376 $(overlay).parent().find("video").show(); 377 video.play(); 378 } 379 380 video.onended = function(e) { 381 382 deactivateFacebookVideo(); 383 }; 384 385 video.onplay = function(e) { 386 387 // Progress click 388 $(currentFacebookVideo).parent().find(".video-controls .video-progress-container .video-progress-click").click(function(e) { 389 390 var clickPos = 100/$(currentFacebookVideo).width() * (e.pageX - $(currentFacebookVideo).offset().left); 391 392 var newPos = currentFacebookVideo.duration/100 * clickPos; 393 currentFacebookVideo.currentTime = newPos; 394 }); 395 396 $(currentFacebookVideo).parent().find(".video-controls .video-sound").removeClass("muted"); 397 updateFacebookProgress(); 398 } 399 400 video.addEventListener("webkitendfullscreen", deactivateFacebookVideo, false); 401} 402 403function updateFacebookProgress() { 404 405 if(!currentFacebookVideo.paused) { 406 407 try { 408 409 TweenMax.delayedCall(0.1, updateFacebookProgress); 410 411 if(currentFacebookVideo != null && currentFacebookVideo != undefined && currentFacebookVideo) { 412 413 var currentPos = 100/currentFacebookVideo.duration * currentFacebookVideo.currentTime; 414 $(currentFacebookVideo).parent().find(".video-controls .video-progress-container .video-progress").css("width", currentPos + "%"); 415 } 416 } 417 catch(e) {} 418 } 419} 420 421function facebookVideoPause(button) { 422 423 var video = $(button).parent().parent().find("video")[0]; 424 var overlay = $(button).parent().parent().find(".facebook-item-video-btn"); 425 426 if (!video.paused) { 427 $(overlay).css("display", "block"); 428 $(button).parent().css("display", "none"); 429 430 $(button).parent().parent().find("video").hide(); 431 //$(video).css("opacity", "0"); 432 433 video.pause(); 434 } 435} 436 437function facebookVideoFullscreen(button) { 438 439 var facebookVideo = $(button).parent().parent().find("video")[0]; 440 441 if (facebookVideo.requestFullscreen) { 442 443 facebookVideo.requestFullscreen(); 444 } 445 else if (facebookVideo.mozRequestFullScreen) { 446 447 facebookVideo.mozRequestFullScreen(); // Firefox 448 } 449 else if (facebookVideo.webkitRequestFullscreen) { 450 451 facebookVideo.webkitRequestFullscreen(); // Chrome and Safari 452 } 453 else if(video.msRequestFullscreen) { 454 455 video.msRequestFullscreen(); 456 } 457 458 // Upload layout id video was stopped before leaving fullscreen 459 $(facebookVideo).bind('webkitfullscreenchange mozfullscreenchange fullscreenchange', function(e) { 460 var state = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen; 461 var event = state ? 'FullscreenOn' : 'FullscreenOff'; 462 463 if(event == "FullscreenOff" && $(this)[0].paused) { 464 465 deactivateFacebookVideo(); 466 } 467 }); 468} 469 470function aContainsB (a, b) { 471 472 if(a != undefined && b != undefined) 473 return a.indexOf(b) >= 0; 474} 475 476function getFacebookImage(id, i){ 477 478 var fullImageURL = "https://graph.facebook.com/" + id + "?fields=full_picture&access_token=" + facebookToken; 479 $.getJSON(fullImageURL, function( data ) { 480 481 //console.log(data.full_picture); 482 $(".facebook-item-image img").eq(i).attr("src", data.full_picture); 483 484 // Scale Image after big image is loaded 485 $(".facebook-item-image img").eq(i).imagesLoaded(function() { 486 487 scaleFacebookImage($(".facebook-item-image img").eq(i)); 488 }); 489 }); 490} 491 492function getFacebookVideo(id, i) { 493 494 var fullVideoURL = "https://graph.facebook.com/v2.3/" + id +"?access_token=" + facebookToken; 495 496 $.getJSON(fullVideoURL, function(data) { 497 498 var source = document.createElement("source"); 499 $(source).attr("type", "video/mp4"); 500 $(source).attr("src", data.source); 501 502 $(".facebook-item-image").eq(i).find("video").append(source); 503 504 //console.log(data.source); 505 }); 506} 507 508function scaleFacebookImages() { 509 510 $(".facebook-item-image img").each(function(){ 511 512 // Scale 513 if($(this).height() < $(this).parent().height()) { 514 515 var height = $(this).height(); 516 var newHeight = $(this).parent().height(); 517 518 $(this).height(newHeight); 519 $(this).css("width", $(this).width() * (newHeight / height)); 520 521 $(this).css("margin-left", ($(this).parent().width() - $(this).width()) / 2); 522 } 523 else { 524 525 //if(!$(this).hasClass("animate")) 526 $(this).addClass("animate"); 527 528 //var gap = $(this).height() - $(this).parent().height(); 529 //TweenMax.set($(this), {marginTop:0}); 530 531 //if(gap > 30) 532 //TweenMax.to($(this), 1 * gap/30, {marginTop:-gap, yoyo:true, repeat:-1, repeatDelay:2, ease:Power2.easeInOut}); 533 } 534 }); 535} 536 537function scaleFacebookImage(img) { 538 539 // Scale 540 if(img.height() < img.parent().height()) { 541
542 var height = img.height(); 543 var newHeight = img.parent().height(); 544 545 img.height(newHeight); 546 img.css("width", img.width() * (newHeight / height)); 547 548 img.css("margin-left", (img.parent().width() - img.width()) / 2); 549 } 550 else { 551 552 //if(!$(this).hasClass("animate")) 553 $(img).addClass("animate"); 554 555 //var gap = img.height() - img.parent().height(); 556 557 //if(gap > 30) 558 //TweenMax.to(img, 1 * gap/30, {marginTop:-gap, yoyo:true, repeat:-1, repeatDelay:2, ease:Power2.easeInOut}); 559 } 560} 561 562function findLinks(text) { 563 var urlRegex =/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig; 564 return text.replace(urlRegex, function(url) { 565 return '<a href="' + url + '" target="_blank">' + url + '</a>'; 566 }); 567}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.