Personal portfolio website for Regina Carvalho. Built with Famous.js library.

video.js 3.1KB

    /** * @ngdoc function * @name domainManagerApp.controller:AboutCtrl * @description * # AboutCtrl * Controller of the domainManagerApp */ angular.module('goApp.video', ['ngFx', 'ngAnimate', 'goApp.data']) .controller('VideoController',['$scope', '$rootScope', '$famous', '$timeline', '$location', '$route', '$timeout', 'Data', '$mixpanel', function ($scope, $rootScope, $famous, $timeline, $location, $route, $timeout, Data, $mixpanel) { 'use strict'; console.log('> Loading Video Page'); $scope.showYoutube = false; $scope.showFile = false; $scope.getData = function() { var link = $location.url(); $scope.pageData = Data.getPageData(link); console.log("> Youtube video: " + $scope.pageData.videoUrl); if($scope.pageData.videoUrl != undefined){ $scope.startVideo(); } $rootScope.$on('data:loaded', function(data) { if(!$scope.$$phase) { $scope.$apply(function(){ $scope.pageData = Data.getPageData(link); $scope.startVideo(); }); } else { $scope.pageData = Data.getPageData(link); $scope.startVideo(); } }); } $scope.fadeIn = function() { $timeout(function(){ $scope.showView = true; },100); } $scope.fadeOut = function() { $scope.showView = false; $timeout(function(){ $scope.showView = false; $location.path("/"); },800); }; $scope.startVideo = function() { if($scope.pageData.videoType == "youtube"){ if(!$scope.$$phase) { $scope.$apply(function(){ $scope.showYoutube = true; }); } else { $scope.showYoutube = true; } } if($scope.pageData.videoType == "file"){ if(!$scope.$$phase) { $scope.$apply(function(){ $scope.showFile = true; $scope.startFileVideo(); }); } else { $scope.showFile = true; $scope.startFileVideo(); } } $mixpanel.track('Page View', { "Page": $scope.pageData.link }); } $scope.startFileVideo = function() { console.log("> Playing video " + $scope.pageData.videoUrl); var video = new VideoSurface({ size: [undefined, undefined], autoplay: true, src: $scope.pageData.videoUrl, properties: { zIndex: 1, } }); video.setAttributes({ loop: '' }); var videoModifier = new Modifier(); videoModifier.transformFrom(function(){ //transform: Transform.translate(0, 0, 0); Transform.translate(0, 0, 0); }); console.log(video); $scope.mainView.add(videoModifier).add(video); }; var View = $famous['famous/core/View']; var Modifier = $famous['famous/core/Modifier']; var Surface = $famous['famous/core/Surface']; var Transform = $famous['famous/core/Transform']; var VideoSurface = $famous['famous/surfaces/VideoSurface']; $scope.mainView = new View(); $scope.fadeIn(); $scope.getData(); }]);