Demo

Login

{{ maturityText(video.maturity_level) }} {{ displayDate(video.date_added) }} {{ video.year}}

{{ cate.category_name }}

` }) -->

{{ maturityText(series.maturity_level) }} {{ allSeasons(series.season_count) }}

{{ cate.category_name }}

` }) -->
{{ maturityText(video.maturity_level) }}
{{ video.copy_url }}

`; Vue.component('video-detail-block',{ template:_videoBlockDetail, data: function(){ return { artistsArr:[], relatedVideos:[], isMobile:false, baseUrl:`https://demo.vodlix.com`, videoid:``, trailer:{}, emebedTrailer:'', playerMute:false, artistsAjax:{}, relatedAjax:{}, trailerPlayer:null, moviePlayerOptions: { sprite : null, } } }, props:{ video:{ type:Object }, logintowatch:{ type:Boolean, default:false }, error:{ type:Object }, modal:{ type:Boolean, default:false } }, computed:{ maturityText(){ return ( text ) => { return getFormattedMaturityLevel(text); } }, percantageWidth(){ return ( percantage ) => { //console.log( hover ) return { 'width': `${percantage}%` } } }, resumeWatchTime(){ return this.video.watch_url + `?last_watch_time=${this.video.last_watch_time}` || `/watch/${this.video.videoid}?last_watch_time=${this.video.last_watch_time}` }, playUrl(){ return this.video.watch_url || `/watch/${this.video.videoid}` }, trailerUrl(){ return `/watch/${this.video.trailers.trailer_id}` }, portraitThumb(){ if( this.video.portrait_thumbs && ( this.video.portrait_thumbs['320x480'] || this.video.portrait_thumbs['480x720'] ) ) return this.video.portrait_thumbs['320x480'] || this.video.portrait_thumbs['480x720'] || this.video.portrait_thumbs.original else return false; }, hasMedia() { return this.trailer._media && this.trailer._media.length > 0; }, poster() { return this.video.thumbs && (this.video.thumbs.original || this.video.thumbs['1280x720']); }, emebedIframe(){ return this.emebedTrailer }, volumeIcon(){ return this.playerMute ? 'mdi-volume-high' : 'mdi-volume-variant-off' }, playPauseClasses(){ return this.modal ? 'playPauseModal' : 'playPausePage' } }, methods:{ displayDate(date) { if (date && !Number.isInteger(date)) { date = Date.parse(date); } const displayDateFormat = 'Y-m-d'; if (displayDateFormat) { return this.formatDateCustom(date, displayDateFormat); } return this.formatDateCustom(date, "Y-m-d"); }, formatDateCustom(date, format) { const d = new Date(date); const year = d.getFullYear(); const month = String(d.getMonth() + 1).padStart(2, "0"); const day = String(d.getDate()).padStart(2, "0"); return format.replace("Y", year).replace("m", month).replace("d", day); }, getArtists(){ let _this = this // if ( !_.isEmpty(this.artistsAjax) ) // this.artistsAjax.abort(); this.artistsAjax = window.vodlix.api.get(`/content_artists?content_id=${this.video.videoid}&content_type=1&info=true`); let artistsPromise = this.artistsAjax.then(res=>{ //console.log('res',res ) this.$set(this, 'artistsArr', res.data ) }).catch(err=>{ console.log('err', err) }).always(always=>{ _this.artistsAjax = {} }); }, getRelatedVideos(){ let _this = this var apiURL = `/related/content/${this.video.videoid}/${this.video.content_type}`; // if ( !_.isEmpty(this.relatedAjax) ) // this.relatedAjax.abort(); this.relatedAjax = window.vodlix.api.get(apiURL); let relatedPromise = this.relatedAjax.then(res=>{ this.$set(this, 'relatedVideos', res.data) if ( this.relatedVideos.length == 0){ let videoCategories = this.video.categories[0].category_id; window.vodlix.api.get(`/videos/list/?categories=${videoCategories}&exclude_video=${this.video.videoid}`).then(res=>{ this.relatedVideos = res.videos.category_videos[videoCategories]; this.$set(this, 'relatedVideos', res.videos.category_videos[videoCategories] ) }).catch(err=>{ console.log('err', err) }) } }).catch(err=>{ console.log('err', err) }).always(always=>{ _this.relatedAjax = {} }); }, getMobileDevice(){ let isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); if ( window.innerWidth < 767 || isMobile ) this.isMobile = true else this.isMobile = false }, loginWatch(){ $('#username').focus(); }, trailerVideo(){ window.vodlix.api.post(`/v2/videos/${this.video.trailers.trailer_id}/playable`).then(res=>{ // console.log('res',res ) this.$set(this, 'trailer', res.data[0] ) this.$set(this, 'emebedTrailer', res.data[0].content.embed_code ) }).catch(err=>{ console.log('err', err) }) }, init( refs, options ){ this.$nextTick(() => { this.trailerPlayer = BeeExPlayer(refs, options); const modalBox_trailer_muted = '1'; if( modalBox_trailer_muted == 0 || modalBox_trailer_muted == '0' ) { this.trailerPlayer.muted(false); if( this.trailerPlayer.muted() == false ) { this.playerMute = true $(".playPauseModal").addClass("active"); } else { this.playerMute = false $(".playPauseModal").removeClass("active"); } } }) } }, beforeDestroy() { if ( this.trailerPlayer && typeof this.trailerPlayer.dispose === 'function') this.trailerPlayer.dispose(); }, mounted(){ let _this = this $('.videoDetailModal').on('shown.bs.modal', function (event) { if ( _this.video.trailers != undefined) _this.trailerVideo(); _this.getArtists() _this.getRelatedVideos() $("body").tooltip({ selector: '[data-toggle=tooltip]' }); }) $('.videoDetailModal').on('hidden.bs.modal', function (event) { if ( !_.isEmpty(_this.artistsAjax) ) _this.artistsAjax.abort(); if ( !_.isEmpty(_this.relatedAjax) ) _this.relatedAjax.abort(); window.apps.modalvideo.video = {} _this.artistsArr = [] _this.relatedVideos = [] _this.trailer = {}, _this.emebedTrailer = '' _this.playerMute = false _this.trailerPlayer = {} if ( !_.isEmpty(_this.trailerPlayer) && _this.trailerPlayer) _this.trailerPlayer.muted(true) $('.detailsThumb').find('iframe').remove(); $('.detailsThumb').find('.video-js').remove(); $('.iframePlayPause').remove('active'); $('body').removeClass('modal-open'); $('.modal-backdrop').remove(); }) if ( _this.modal != true && !_.isEmpty(_this.video) ) { this.getArtists() this.getRelatedVideos() if ( this.video.trailers != undefined){ this.trailerVideo() } } $(document).ready(function(){ $("body").tooltip({ selector: '[data-toggle=tooltip]' }); var clipboard = new Clipboard('.copyButton'); $(document.body).on('click', '.playPauseModal, .playPausePage' ,function(){ $(this).toggleClass('active') if ( $(this).hasClass('active') ){ _this.trailerPlayer.muted(false) _this.playerMute = true } else{ _this.trailerPlayer.muted(true) _this.playerMute = false } }); clipboard.on('success', function(e) { console.log(e); window.vodlix.success.toast({ html: `Copied` }); }); clipboard.on('error', function(e) { console.log(e); }); }) this.getMobileDevice() window.addEventListener("resize", this.getMobileDevice ); }, watch: { trailer: function (newValue, oldValue) { // console.log('newValue', newValue ) // console.log('oldValue', oldValue ) //this.trailer = newValue this.init(this.$refs.moviePlayer, this.moviePlayerOptions); }, } }) -->
{{ maturityText(series.maturity_level) }} {{ allSeasons(series.season_count) }} {{ series.mpaa_rating }}

`; Vue.component('series-detail-block',{ template:_seriesBlockDetail, data: function(){ return { artistsArr:[], relatedSeries: [], episodes:[], seasons:[], selectedSeasonId:'', comingSoonMessage:false, firstSeason:{}, message:'testing for you', page:1, lastPage:'', baseUrl:`https://demo.vodlix.com`, isMobile:false, artistsAjax:{}, relatedAjax:{}, seasonsAjax:{}, episodesAjax:{}, trailer:{}, emebedTrailer:'', vplayer:null, playerMute:false, playerConfigurations: { sprite : null, } } }, props:{ series:{ type:Object }, logintowatch:{ type:Boolean, default:false }, modal:{ type:false, default:false } }, computed:{ startReleasedDate(){ //console.log( 'this.series.start_released_date asd', this.series.start_released_date ) if ( this.series.start_released_date != undefined ){ let fullDate = this.series.start_released_date let year = fullDate.split('-') return year[0] } }, maturityText(){ return ( text ) => { return getFormattedMaturityLevel(text); } }, allSeasons(){ return (seasons) => { if ( seasons != undefined && seasons != '' && seasons != null ){ if (seasons == 1) return seasons + ' ' + `Season` else return seasons + ' ' + `Seasons` } } }, seriesThumb() { return this.series.thumbs["632x395"] || this.series.thumbs["416x260"] || this.series.thumb; }, seriesName(){ return this.series.series_name }, seriesId(){ return this.id = `media-${this.series.series_id}` }, percantageWidth(){ return ( percantage ) => { //console.log( hover ) return { 'width': `${percantage}%` } } }, resumeWatchTime(){ return `/watch/${this.series.first_episode_id}?type=series&series_id=${this.series.series_id}&season_id=${this.series.last_watch_episode_id}&last_watch_time=${this.series.last_watch_time}` }, playUrl(){ return `/watch/${this.series.first_episode_id}?type=series&series_id=${this.series.series_id}&season_id=${this.series.first_season_id}` }, trailerUrl(){ return `/watch/${this.series.trailer.trailer_id}` }, portraitThumb(){ if( this.series.portrait_thumbs && ( this.series.portrait_thumbs['480x720'] || this.series.portrait_thumbs['320x480'] ) ) return this.series.portrait_thumbs['320x480'] || this.series.portrait_thumbs['480x720'] || this.series.portrait_thumbs.original else return false; }, hasMedia() { return this.trailer._media && this.trailer._media.length > 0; }, poster() { return this.series.thumbs && (this.series.thumbs.original || this.series.thumbs['1280x720']); }, emebedIframe(){ return this.emebedTrailer }, volumeIcon(){ return this.playerMute ? 'mdi-volume-high' : 'mdi-volume-variant-off' }, }, methods:{ getArtists(){ let _this = this this.artistsAjax = window.vodlix.api.get(`/content_artists?content_id=${this.series.series_id}&content_type=2&info=true`); let artistsPromise = this.artistsAjax.then(res=>{ //console.log('res',res ) this.$set(this, 'artistsArr', res.data ) }).catch(err=>{ //console.log('err', err) }).always(always=>{ _this.artistsAjax = {} }); }, seasonChange(val){ this.selectedSeasonId = val //console.log( val ) this.$set(this, "page", 1); this.getSeasonEpisodes(val) }, getSeasonList( load_more = false ){ let _this = this this.seasonsAjax = window.vodlix.api.get(`/season/list/${this.series.series_id}`); let seasonsPromise = this.seasonsAjax.then(res=>{ let seasonsArray = res.data.seasons let appendText = seasonsArray.map(item => { let text = 'Season' + ' ' + item.sequence item.sequence = text return item }) this.seasons = appendText; if( load_more == true ) { if( this.selectedSeasonId == '' || this.selectedSeasonId == undefined || this.selectedSeasonId == false ) { this.selectedSeasonId = this.seasons[0].season_id; } this.getSeasonEpisodes(this.selectedSeasonId) } else { this.getSeasonEpisodes(this.seasons[0].season_id) } //console.log( 'this.seasons', this.seasons ) }).catch(err=>{ //console.log('err', err) }).always(always=>{ _this.seasonsAjax = {} }); }, getSeasonEpisodes(obj){ let _this = this this.episodesAjax = window.vodlix.api.get(`/season/data?series_id=${this.series.series_id}&season_id=${obj}&page=${this.page}&paginate=1`); let episodesPromise = this.episodesAjax.then(res=>{ //console.log( 'res s',res ) if(this.page === 1) { this.episodes = res.data.data } else { this.episodes.push(...res.data.data) } this.page = res.data.current_page this.lastPage = res.data.last_page if ( this.episodes.length <= 0 ) this.comingSoonMessage = true else this.comingSoonMessage = false }).then(()=>{ this.getContinueWatch() }) .catch(err=>{ //console.log('err ', err) }).always(always=>{ _this.episodesAjax = {} }); }, getContinueWatch(){ let _this = this this.continueWatchAjax = window.vodlix.api.get(`/v2/continueWatchTime?series_id=${this.series.series_id}`); let continueWatchPromise = this.continueWatchAjax.then(res=>{ if (res.data && Array.isArray(res.data) && res.data.length > 0 && res.data[0].watched_episodes) { this.episodes = this.episodes.map(episode => { const watchData = res.data[0].watched_episodes.find(item => item.videoid === episode.videoid); if (watchData) { return { ...episode, last_watch_time: watchData.last_watch_time, last_watch_time_percentage: watchData.last_watch_time_percentage }; } return episode; }); } }).catch(err=>{ console.log('err', err); }); }, getRelatedSeries(){ let _this = this var apiURL = `/related/content/${this.series.series_id}/2`; this.relatedAjax = window.vodlix.api.get(apiURL); let relatedPromise = this.relatedAjax.then(res=>{ //console.log( 'res dsf',res.series.related_series ) this.$set(this, 'relatedSeries', res.data) if ( this.relatedSeries.length == 0 && this.series.categories[0] !== null && this.series.categories[0] !== undefined ){ let seriesCategories = this.series.categories[0].category_id; window.vodlix.api.get(`/series/list/?categories=${seriesCategories}&exclude_video=${this.series.series_id}`).then(res=>{ //console.log('dasd', res ) this.$set(this, 'relatedSeries', res.series.category_series[seriesCategories] ) }).catch(err=>{ //console.log('err', err) }) } }).catch(err=>{ //console.log('err', err) }).always(always=>{ _this.relatedAjax = {} }); }, loadMoreEpisode(){ if ( this.page < this.lastPage ){ this.page++ this.getSeasonList( true ); } }, getMobileDevice(){ let isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); if ( window.innerWidth < 767 || isMobile ) this.isMobile = true else this.isMobile = false }, getFirstSeasonEpisodes(series, resumeTime){ //console.log( 'series', series ) let data ={ 'data': { 'series_id':series.series_id } } window.vodlix.api.get(`/series/firstdata`,data).then(res => { let firstEdpisodeId = res.data.episode.videoid let firstSeasonId = res.data.episode.season_id let watch_url = res.data.episode.watch_url if ( resumeTime == true ) window.location.href = `https://demo.vodlix.com${watch_url}?type=series&series_id=${series.series_id}&season_id=${series.last_watch_episode_id}&last_watch_time=${series.last_watch_time}` else window.location.href = `https://demo.vodlix.com${watch_url}?type=series&series_id=${series.series_id}&season_id=${firstSeasonId}` }).catch(err => { console.log('err', err) }) }, playContinueWatchEpisode(series){ var last_watch_episode_id = series.last_watch_episode_id var last_watch_time = series.last_watch_time var last_watch_season_id = series.last_watch_season_id window.location.href = `https://demo.vodlix.com/watch/${last_watch_episode_id}?type=series&series_id=${series.series_id}&season_id=${last_watch_season_id}&last_watch_time=${last_watch_time}` }, trailerVideo(){ window.vodlix.api.post(`/v2/videos/${this.series.trailer.trailer_id}/playable`).then(res=>{ // console.log('res',res ) this.$set(this, 'trailer', res.data[0] ) this.$set(this, 'emebedTrailer', res.data[0].content.embed_code ) }).catch(err=>{ console.log('err', err) }) }, init( refs, options ){ this.$nextTick(() => { this.vplayer = BeeExPlayer(refs, options); const modalBox_trailer_muted = '1'; if( modalBox_trailer_muted == 0 || modalBox_trailer_muted == '0' ) { this.vplayer.muted(false); if( this.vplayer.muted() == false ) { this.playerMute = true $(".iframePlayPauseSeries").addClass("active"); } else { this.playerMute = false $(".iframePlayPauseSeries").removeClass("active"); } } }) } }, beforeDestroy() { if ( this.vplayer) this.vplayer.dispose(); }, mounted(){ let _this = this $('.seriesDetailModal').on('shown.bs.modal', function (event) { if ( _this.series.trailer != undefined) _this.trailerVideo(); _this.getArtists() _this.getSeasonList() _this.getRelatedSeries(); $("body").tooltip({ selector: '[data-toggle=tooltip]' }); }) $('.seriesDetailModal').on('hidden.bs.modal', function (event) { _this.page = 1; _this.selectedSeasonId = '' if ( !_.isEmpty(_this.artistsAjax) ) _this.artistsAjax.abort(); if ( !_.isEmpty(_this.relatedAjax) ) _this.relatedAjax.abort(); if ( !_.isEmpty(_this.seasonsAjax) ) _this.seasonsAjax.abort(); if (!_.isEmpty(_this.episodesAjax)) _this.episodesAjax.abort(); _this.artistsArr = [] _this.relatedSeries = [] _this.episodes = [] _this.seasons = [] _this.trailer = {}, _this.emebedTrailer = '' _this.vplayer = {} _this.playerMute = false if ( !_.isEmpty(_this.vplayer) && _this.vplayer) _this.vplayer.muted(true) $('.detailsThumb').find('iframe').remove(); $('.iframePlayPause').remove('active'); $('body').removeClass('modal-open'); $('.modal-backdrop').remove(); }) if ( this.modal != true ){ this.getArtists() this.getSeasonList() this.getRelatedSeries() if ( this.series.trailer != undefined) this.trailerVideo(); } $(document).ready(function(){ var clipboard = new Clipboard('.copyButton'); clipboard.on('success', function(e) { console.log(e); window.vodlix.success.toast({ html: `Copied` }); }); clipboard.on('error', function(e) { console.log(e); }); $(document.body).on('click', '.iframePlayPauseSeries' ,function(){ $(this).toggleClass('active') if ( $(this).hasClass('active') ){ _this.vplayer.muted(false) _this.playerMute = true } else{ _this.vplayer.muted(true) _this.playerMute = false } }); }); this.getMobileDevice() window.addEventListener("resize", this.getMobileDevice ); }, watch: { trailer: function (newValue, oldValue) { this.init(this.$refs.seriesPlayer, this.playerConfigurations); } }, }) -->
`; Vue.component('login-form',{ template:_loginTemplate, data:function(){ return { usernameVal:'', msg:[], passwordVal:'', isLoading: false, loading: "", showPassword:false, minUsername:`1`, socialNetworks: JSON.parse('null'), loginWithOTP: `0`, disableCaptcha:`1`, successReq:window.vodlix.loginSuccess, showLoginNote: "0", loginNoteInHtml: `` } }, props:{ lasturl:{ type:String, default:'' } }, computed: { hasSocialNetworks() { return this.socialNetworks && this.socialNetworks.length > 0; }, disabledCaptcha() { return this.disableCaptcha != "1"; }, btnDisable(){ // return this.usernameVal.length < this.minUsername || this.passwordVal.length < 1 return this.usernameVal.length < 1 || this.passwordVal.length < 1 } }, methods:{ userNameRules(){ if ( this.usernameVal == '' ) this.msg['usernameVal'] = `Username is required` else this.msg['usernameVal'] = '' }, passwordRules(){ if ( this.passwordVal == '' ) this.msg['passwordVal'] = `Password is required` else this.msg['passwordVal'] = '' }, getLogin(){ var button_text = 'Logging In...' $(".submitBtn").attr('disabled',true) $(".submitBtn").html(button_text) window.vodlix.auth.loginUser({ username: this.usernameVal, password: this.passwordVal },this.lasturl); }, requestAuthUrl(network) { this.$set(this, "isLoading", true); this.$set(this, "loading", network.network); window.vodlix.api.get(`/v2/auth/social/${ network.network }`) .then(response => { const { data } = response; if (data.auth_url !== undefined) { return window.location.href = data.auth_url; } else { window.vodlix.error.toast({ html: `No oauth url returned for ${ network.name }. Please contact our support.` }); this.$set(this, "isLoading", false); this.$set(this, "loading", ""); } }).catch(err => { const { responseJSON: response } = err; window.vodlix.error.toast({ text: response.message }); this.$set(this, "isLoading", false); this.$set(this, "loading", ""); }) } }, mounted(){ //console.log('sdf', window.awl.baseUrl) }, }) -->