mirror of https://github.com/pixelfed/pixelfed
Remove deprecated Loops feature entirely
- Remove 'loops' from config/exp.php and instance.discover.loops from config/instance.php - Remove loops API routes (loopsApi, loopWatch) from web-api.php - Delete LoopComponent.vue, loops.js entry point, and loops blade view - Remove EXP_LOOPS diagnostic row from admin diagnostics page The Loops feature was deprecated and hardcoded to disabled.pull/6579/head
Your Name
3 months ago
parent
0a41c9e387
commit
715c671712
@ -1,130 +0,0 @@
|
||||
<template>
|
||||
<div class="w-100 h-100">
|
||||
<div v-if="loading" style="min-height: 400px;" class="d-flex justify-content-center align-items-center">
|
||||
<img src="/img/pixelfed-icon-grey.svg" class="">
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="mb-4">
|
||||
<p class="text-center">
|
||||
<!-- <a :class="[tab == 'popular'? 'btn font-weight-bold py-0 btn-success' : 'btn font-weight-bold py-0 btn-outline-success']" href="#" @click.prevent="setTab('popular')">Popular</a> -->
|
||||
<a :class="[tab == 'new'? 'btn font-weight-bold py-0 btn-success' : 'btn font-weight-bold py-0 btn-outline-success']" href="#" @click.prevent="setTab('new')">New</a>
|
||||
<!-- <a :class="[tab == 'random'? 'btn font-weight-bold py-0 btn-success' : 'btn font-weight-bold py-0 btn-outline-success']" href="#" @click.prevent="setTab('random')">Random</a> -->
|
||||
<a :class="[tab == 'about'? 'btn font-weight-bold py-0 btn-success' : 'btn font-weight-bold py-0 btn-outline-success']" href="#" @click.prevent="setTab('about')">About</a>
|
||||
</p>
|
||||
</div>
|
||||
<div v-if="tab != 'about'" class="row loops-container">
|
||||
<div class="col-12 col-md-4 mb-3" v-for="(loop, index) in loops">
|
||||
<div class="card border border-success">
|
||||
<div class="embed-responsive embed-responsive-1by1">
|
||||
<video class="embed-responsive-item" :src="videoSrc(loop)" preload="none" width="100%" height="100%" loop @click="toggleVideo(loop, $event)" :poster="posterSrc(loop)"></video>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p class="username font-weight-bolder lead d-flex justify-content-between">
|
||||
<a :href="loop.account.url" :title="loop.account.acct">{{truncate(loop.account.acct)}}</a>
|
||||
<a :href="loop.url">{{timestamp(loop)}}</a></p>
|
||||
<p class="small text-muted text-truncate" v-html="getTitle(loop)"></p>
|
||||
<div class="small text-muted d-flex justify-content-between mb-0">
|
||||
<span>{{loop.favourites_count}} Likes</span>
|
||||
<span>{{loop.reblogs_count}} Shares</span>
|
||||
<span>{{loop.reply_count}} Comments</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="col-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p class="lead text-center mb-0">Loops are an exciting new way to explore short videos on Pixelfed.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style type="text/css">
|
||||
.loops-container .card {
|
||||
box-shadow: none;
|
||||
}
|
||||
.loops-container .card .card-img-top{
|
||||
border-radius: 0;
|
||||
}
|
||||
.loops-container a {
|
||||
color: #343a40;
|
||||
}
|
||||
a.hashtag,
|
||||
.loops-container .card-body a:hover {
|
||||
color: #28a745 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
Object.defineProperty(HTMLMediaElement.prototype, 'playing', {
|
||||
get: function(){
|
||||
return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2);
|
||||
}
|
||||
})
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
version: 1,
|
||||
loops: [],
|
||||
tab: 'new'
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
axios.get('/api/v2/loops')
|
||||
.then(res => {
|
||||
this.loops = res.data;
|
||||
this.loading = false;
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
videoSrc(loop) {
|
||||
return loop.media_attachments[0].url;
|
||||
},
|
||||
posterSrc(loop) {
|
||||
return loop.media_attachments[0].preview_url;
|
||||
},
|
||||
setTab(tab) {
|
||||
this.tab = tab;
|
||||
},
|
||||
toggleVideo(loop, $event) {
|
||||
let el = $event.target;
|
||||
$('video').each(function() {
|
||||
if(el.src != $(this)[0].src) {
|
||||
$(this)[0].pause();
|
||||
}
|
||||
});
|
||||
if(!el.playing) {
|
||||
el.play();
|
||||
//this.incrementLoop(loop);
|
||||
} else {
|
||||
el.pause();
|
||||
}
|
||||
},
|
||||
incrementLoop(loop) {
|
||||
// axios.post('/api/v2/loops/watch', {
|
||||
// id: loop.id
|
||||
// }).then(res => {
|
||||
// console.log(res.data);
|
||||
// });
|
||||
},
|
||||
timestamp(loop) {
|
||||
let ts = new Date(loop.created_at);
|
||||
return ts.toLocaleDateString();
|
||||
},
|
||||
getTitle(loop) {
|
||||
let content = loop.content ? loop.content : 'Untitled';
|
||||
return content.trim();
|
||||
},
|
||||
truncate(str, len = 15) {
|
||||
return _.truncate(str, {length: len});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,4 +0,0 @@
|
||||
Vue.component(
|
||||
'loops-component',
|
||||
require('./components/LoopComponent.vue').default
|
||||
);
|
||||
@ -1,43 +0,0 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('content')
|
||||
<div class="bg-primary">
|
||||
<p class="text-center text-white mb-0 py-3 font-weight-bold">
|
||||
<i class="fas fa-exclamation-triangle fa-lg mr-2"></i> This feature has been deprecated and will be removed in a future version.
|
||||
</p>
|
||||
</div>
|
||||
<div class="profile-header">
|
||||
<div class="container pt-5">
|
||||
<div class="profile-details text-center">
|
||||
<div class="username-bar text-dark">
|
||||
<p class="display-4 font-weight-bold mb-0"><span class="text-success">Loops</span> <sup class="lead">BETA</sup></p>
|
||||
<p class="lead font-weight-lighter">Short looping videos</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="loop-page container mt-5">
|
||||
<section>
|
||||
<loops-component></loops-component>
|
||||
</section>
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@push('styles')
|
||||
<style type="text/css">
|
||||
@media (min-width: 1200px) {
|
||||
.loop-page.container {
|
||||
max-width: 1035px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
@push('scripts')
|
||||
<script type="text/javascript" src="{{ mix('js/loops.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ mix('js/compose.js') }}"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function(){
|
||||
new Vue({el: '#content'});
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
Loading…
Reference in New Issue