mirror of
https://github.com/pixelfed/pixelfed.git
synced 2024-11-09 16:24:51 +00:00
Update Stories, add crop and duration settings to composer
This commit is contained in:
parent
9f380a5597
commit
c8edca696b
3 changed files with 243 additions and 71 deletions
|
@ -12,7 +12,7 @@ use App\Services\StoryService;
|
|||
use Cache, Storage;
|
||||
use Image as Intervention;
|
||||
use App\Services\FollowerService;
|
||||
|
||||
use App\Services\MediaPathService;
|
||||
|
||||
class StoryController extends Controller
|
||||
{
|
||||
|
@ -37,7 +37,7 @@ class StoryController extends Controller
|
|||
}
|
||||
|
||||
$photo = $request->file('file');
|
||||
$path = $this->storePhoto($photo);
|
||||
$path = $this->storePhoto($photo, $user);
|
||||
|
||||
$story = new Story();
|
||||
$story->duration = 3;
|
||||
|
@ -47,21 +47,18 @@ class StoryController extends Controller
|
|||
$story->path = $path;
|
||||
$story->local = true;
|
||||
$story->size = $photo->getSize();
|
||||
$story->expires_at = now()->addHours(24);
|
||||
$story->save();
|
||||
|
||||
return [
|
||||
'code' => 200,
|
||||
'msg' => 'Successfully added',
|
||||
'media_id' => (string) $story->id,
|
||||
'media_url' => url(Storage::url($story->path))
|
||||
];
|
||||
}
|
||||
|
||||
protected function storePhoto($photo)
|
||||
protected function storePhoto($photo, $user)
|
||||
{
|
||||
$monthHash = substr(hash('sha1', date('Y').date('m')), 0, 12);
|
||||
$sid = (string) Str::uuid();
|
||||
$rid = Str::random(9).'.'.Str::random(9);
|
||||
$mimes = explode(',', config('pixelfed.media_types'));
|
||||
if(in_array($photo->getMimeType(), [
|
||||
'image/jpeg',
|
||||
|
@ -72,9 +69,9 @@ class StoryController extends Controller
|
|||
return;
|
||||
}
|
||||
|
||||
$storagePath = "public/_esm.t2/{$monthHash}/{$sid}/{$rid}";
|
||||
$storagePath = MediaPathService::story($user->profile);
|
||||
$path = $photo->store($storagePath);
|
||||
if(in_array($photo->getMimeType(), ['image/jpeg','image/png',])) {
|
||||
if(in_array($photo->getMimeType(), ['image/jpeg','image/png'])) {
|
||||
$fpath = storage_path('app/' . $path);
|
||||
$img = Intervention::make($fpath);
|
||||
$img->orientate();
|
||||
|
@ -84,6 +81,68 @@ class StoryController extends Controller
|
|||
return $path;
|
||||
}
|
||||
|
||||
public function cropPhoto(Request $request)
|
||||
{
|
||||
abort_if(!config('instance.stories.enabled') || !$request->user(), 404);
|
||||
|
||||
$this->validate($request, [
|
||||
'media_id' => 'required|integer|min:1',
|
||||
'width' => 'required',
|
||||
'height' => 'required',
|
||||
'x' => 'required',
|
||||
'y' => 'required'
|
||||
]);
|
||||
|
||||
$user = $request->user();
|
||||
$id = $request->input('media_id');
|
||||
$width = round($request->input('width'));
|
||||
$height = round($request->input('height'));
|
||||
$x = round($request->input('x'));
|
||||
$y = round($request->input('y'));
|
||||
|
||||
$story = Story::whereProfileId($user->profile_id)->findOrFail($id);
|
||||
|
||||
$path = storage_path('app/' . $story->path);
|
||||
|
||||
if(!is_file($path)) {
|
||||
abort(400, 'Invalid or missing media.');
|
||||
}
|
||||
|
||||
$img = Intervention::make($path);
|
||||
$img->crop($width, $height, $x, $y);
|
||||
$img->save($path, config('pixelfed.image_quality'));
|
||||
|
||||
return [
|
||||
'code' => 200,
|
||||
'msg' => 'Successfully cropped',
|
||||
];
|
||||
}
|
||||
|
||||
public function publishStory(Request $request)
|
||||
{
|
||||
abort_if(!config('instance.stories.enabled') || !$request->user(), 404);
|
||||
|
||||
$this->validate($request, [
|
||||
'media_id' => 'required',
|
||||
'duration' => 'required|integer|min:3|max:10'
|
||||
]);
|
||||
|
||||
$id = $request->input('media_id');
|
||||
$user = $request->user();
|
||||
$story = Story::whereProfileId($user->profile_id)
|
||||
->findOrFail($id);
|
||||
|
||||
$story->active = true;
|
||||
$story->duration = $request->input('duration', 10);
|
||||
$story->expires_at = now()->addHours(24);
|
||||
$story->save();
|
||||
|
||||
return [
|
||||
'code' => 200,
|
||||
'msg' => 'Successfully published',
|
||||
];
|
||||
}
|
||||
|
||||
public function apiV1Delete(Request $request, $id)
|
||||
{
|
||||
abort_if(!config('instance.stories.enabled') || !$request->user(), 404);
|
||||
|
@ -114,6 +173,7 @@ class StoryController extends Controller
|
|||
|
||||
if(config('database.default') == 'pgsql') {
|
||||
$db = Story::with('profile')
|
||||
->whereActive(true)
|
||||
->whereIn('profile_id', $following)
|
||||
->where('expires_at', '>', now())
|
||||
->distinct('profile_id')
|
||||
|
@ -121,8 +181,9 @@ class StoryController extends Controller
|
|||
->get();
|
||||
} else {
|
||||
$db = Story::with('profile')
|
||||
->whereActive(true)
|
||||
->whereIn('profile_id', $following)
|
||||
->where('expires_at', '>', now())
|
||||
->where('created_at', '>', now()->subDay())
|
||||
->orderByDesc('expires_at')
|
||||
->groupBy('profile_id')
|
||||
->take(9)
|
||||
|
@ -158,6 +219,7 @@ class StoryController extends Controller
|
|||
}
|
||||
|
||||
$stories = Story::whereProfileId($profile->id)
|
||||
->whereActive(true)
|
||||
->orderBy('expires_at', 'desc')
|
||||
->where('expires_at', '>', now())
|
||||
->when(!$publicOnly, function($query, $publicOnly) {
|
||||
|
@ -187,6 +249,7 @@ class StoryController extends Controller
|
|||
|
||||
$authed = $request->user()->profile;
|
||||
$story = Story::with('profile')
|
||||
->whereActive(true)
|
||||
->where('expires_at', '>', now())
|
||||
->findOrFail($id);
|
||||
|
||||
|
@ -202,7 +265,7 @@ class StoryController extends Controller
|
|||
$res = [
|
||||
'id' => (string) $story->id,
|
||||
'type' => Str::endsWith($story->path, '.mp4') ? 'video' :'photo',
|
||||
'length' => 3,
|
||||
'length' => 10,
|
||||
'src' => url(Storage::url($story->path)),
|
||||
'preview' => null,
|
||||
'link' => null,
|
||||
|
@ -227,6 +290,7 @@ class StoryController extends Controller
|
|||
}
|
||||
|
||||
$stories = Story::whereProfileId($profile->id)
|
||||
->whereActive(true)
|
||||
->orderBy('expires_at')
|
||||
->where('expires_at', '>', now())
|
||||
->when(!$publicOnly, function($query, $publicOnly) {
|
||||
|
@ -237,7 +301,7 @@ class StoryController extends Controller
|
|||
return [
|
||||
'id' => $s->id,
|
||||
'type' => Str::endsWith($s->path, '.mp4') ? 'video' :'photo',
|
||||
'length' => 3,
|
||||
'length' => 10,
|
||||
'src' => url(Storage::url($s->path)),
|
||||
'preview' => null,
|
||||
'link' => null,
|
||||
|
@ -272,19 +336,21 @@ class StoryController extends Controller
|
|||
'id' => 'required|integer|min:1|exists:stories',
|
||||
]);
|
||||
$id = $request->input('id');
|
||||
|
||||
$authed = $request->user()->profile;
|
||||
|
||||
$story = Story::with('profile')
|
||||
->where('expires_at', '>', now())
|
||||
->orderByDesc('expires_at')
|
||||
->findOrFail($id);
|
||||
|
||||
$profile = $story->profile;
|
||||
|
||||
if($story->profile_id == $authed->id) {
|
||||
$publicOnly = true;
|
||||
} else {
|
||||
$publicOnly = (bool) $profile->followedBy($authed);
|
||||
return [];
|
||||
}
|
||||
|
||||
$publicOnly = (bool) $profile->followedBy($authed);
|
||||
abort_if(!$publicOnly, 403);
|
||||
|
||||
StoryView::firstOrCreate([
|
||||
|
@ -292,6 +358,9 @@ class StoryController extends Controller
|
|||
'profile_id' => $authed->id
|
||||
]);
|
||||
|
||||
$story->view_count = $story->view_count + 1;
|
||||
$story->save();
|
||||
|
||||
return ['code' => 200];
|
||||
}
|
||||
|
||||
|
@ -300,6 +369,7 @@ class StoryController extends Controller
|
|||
abort_if(!config('instance.stories.enabled') || !$request->user(), 404);
|
||||
|
||||
$res = (bool) Story::whereProfileId($id)
|
||||
->whereActive(true)
|
||||
->where('expires_at', '>', now())
|
||||
->count();
|
||||
|
||||
|
@ -312,6 +382,7 @@ class StoryController extends Controller
|
|||
|
||||
$profile = $request->user()->profile;
|
||||
$stories = Story::whereProfileId($profile->id)
|
||||
->whereActive(true)
|
||||
->orderBy('expires_at')
|
||||
->where('expires_at', '>', now())
|
||||
->get()
|
||||
|
|
|
@ -1,60 +1,88 @@
|
|||
<template>
|
||||
<div class="container mt-2 mt-md-5">
|
||||
<div class="container mt-2 mt-md-5 bg-black">
|
||||
<input type="file" id="pf-dz" name="media" class="d-none file-input" v-bind:accept="config.mimes">
|
||||
<span class="fixed-top text-right m-3 cursor-pointer" @click="navigateTo()">
|
||||
<i class="fas fa-times fa-lg text-white"></i>
|
||||
</span>
|
||||
<div v-if="loaded" class="row">
|
||||
<div class="col-12 col-md-6 offset-md-3">
|
||||
<div class="col-12 col-md-6 offset-md-3 bg-dark rounded-lg">
|
||||
|
||||
<!-- LANDING -->
|
||||
<div v-if="page == 'landing'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center" style="height: 90vh;">
|
||||
<div class="text-center flex-fill mt-5 pt-5">
|
||||
<img src="/img/pixelfed-icon-grey.svg" width="60px" height="60px">
|
||||
<p class="font-weight-bold lead text-lighter mt-1">Stories</p>
|
||||
<!-- <p v-if="loaded" class="font-weight-bold small text-uppercase text-muted">
|
||||
<span>{{stories.length}} Active</span>
|
||||
<span class="px-2">|</span>
|
||||
<span>30K Views</span>
|
||||
</p> -->
|
||||
<div class="text-center flex-fill pt-3">
|
||||
<p class="text-muted font-weight-light mb-1">
|
||||
<i class="fas fa-history fa-5x"></i>
|
||||
</p>
|
||||
<p class="text-muted font-weight-bold mb-0">STORIES</p>
|
||||
</div>
|
||||
<div class="flex-fill py-4">
|
||||
<div class="card w-100 shadow-none">
|
||||
<div class="list-group">
|
||||
<div class="card w-100 shadow-none bg-transparent">
|
||||
<div class="list-group bg-transparent">
|
||||
<!-- <a class="list-group-item text-center lead text-decoration-none text-dark" href="#">Camera</a> -->
|
||||
<a class="list-group-item text-center lead text-decoration-none text-dark" href="#" @click.prevent="upload()">Add Photo</a>
|
||||
<a v-if="stories.length" class="list-group-item text-center lead text-decoration-none text-dark" href="#" @click.prevent="edit()">Edit</a>
|
||||
<a class="list-group-item bg-transparent lead text-decoration-none text-light font-weight-bold border-light" href="#" @click.prevent="upload()">
|
||||
<i class="fas fa-plus-square mr-2"></i>
|
||||
Add to Story
|
||||
</a>
|
||||
<a v-if="stories.length" class="list-group-item bg-transparent lead text-decoration-none text-lighter font-weight-bold border-muted" href="#" @click.prevent="edit()">
|
||||
<i class="far fa-clone mr-2"></i>
|
||||
My Story
|
||||
</a>
|
||||
<!-- <a v-if="stories.length" class="list-group-item bg-transparent lead text-decoration-none text-lighter font-weight-bold border-muted" href="#" @click.prevent="edit()">
|
||||
<i class="fas fa-network-wired mr-1"></i>
|
||||
Audience
|
||||
</a> -->
|
||||
<!-- <a v-if="stories.length" class="list-group-item bg-transparent lead text-decoration-none text-lighter font-weight-bold border-muted" href="#" @click.prevent="edit()">
|
||||
<i class="far fa-chart-bar mr-2"></i>
|
||||
Stats
|
||||
</a> -->
|
||||
<!-- <a class="list-group-item bg-transparent lead text-decoration-none text-lighter font-weight-bold border-muted" href="#" @click.prevent="edit()">
|
||||
<i class="far fa-folder mr-2"></i>
|
||||
Archived
|
||||
</a> -->
|
||||
<!-- <a class="list-group-item bg-transparent lead text-decoration-none text-lighter font-weight-bold border-muted" href="#" @click.prevent="edit()">
|
||||
<i class="far fa-question-circle mr-2"></i>
|
||||
Help
|
||||
</a> -->
|
||||
<a class="list-group-item bg-transparent lead text-decoration-none text-lighter font-weight-bold border-muted" href="/">
|
||||
<i class="fas fa-arrow-left mr-2"></i>
|
||||
Go back
|
||||
</a>
|
||||
<!-- <a class="list-group-item text-center lead text-decoration-none text-dark" href="#">Options</a> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex-fill">
|
||||
<p class="text-lighter small text-uppercase">
|
||||
<!-- <p class="text-lighter small text-uppercase">
|
||||
<a href="/" class="text-muted font-weight-bold">Home</a>
|
||||
<span class="px-2 text-lighter">|</span>
|
||||
<a href="/i/my/story" class="text-muted font-weight-bold">View My Story</a>
|
||||
<span class="px-2 text-lighter">|</span>
|
||||
<a href="/site/help" class="text-muted font-weight-bold">Help</a>
|
||||
</p>
|
||||
</p> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- CROP -->
|
||||
<div v-if="page == 'crop'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center" style="height: 95vh;">
|
||||
<div class="text-center pt-5 mb-3 d-flex justify-content-between align-items-center">
|
||||
<div v-if="page == 'crop'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center" style="height: 90vh;">
|
||||
<div class="text-center py-3 d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<button class="btn btn-outline-lighter btn-sm py-0 px-md-3"><i class="pr-2 fas fa-chevron-left fa-sm"></i> Delete</button>
|
||||
<button class="btn btn-outline-lighter btn-sm py-1 px-md-3" @click="deleteCurrentStory()"><i class="pr-2 fas fa-chevron-left fa-sm"></i> Delete</button>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<img class="d-inline-block mr-2" src="/img/pixelfed-icon-grey.svg" width="30px" height="30px">
|
||||
<span class="font-weight-bold lead text-lighter">Stories</span>
|
||||
<div class="">
|
||||
<p class="text-muted font-weight-light mb-1">
|
||||
<i class="fas fa-history fa-5x"></i>
|
||||
</p>
|
||||
<p class="text-muted font-weight-bold mb-0">STORIES</p>
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn btn-outline-success btn-sm py-0 px-md-3">Crop <i class="pl-2 fas fa-chevron-right fa-sm"></i></button>
|
||||
<button class="btn btn-primary btn-sm py-1 px-md-3" @click="performCrop()">Crop <i class="pl-2 fas fa-chevron-right fa-sm"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-fill">
|
||||
<div class="card w-100 mt-3">
|
||||
<div class="card-body p-0">
|
||||
<vue-cropper
|
||||
ref="cropper"
|
||||
ref="croppa"
|
||||
:relativeZoom="cropper.zoom"
|
||||
:aspectRatio="cropper.aspectRatio"
|
||||
:viewMode="cropper.viewMode"
|
||||
|
@ -66,20 +94,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center flex-fill">
|
||||
<p class="text-lighter small text-uppercase pt-2">
|
||||
<!-- <a href="#" class="text-muted font-weight-bold">Home</a>
|
||||
<span class="px-2 text-lighter">|</span>
|
||||
<a href="#" class="text-muted font-weight-bold">View My Story</a>
|
||||
<span class="px-2 text-lighter">|</span> -->
|
||||
<a href="/site/help" class="text-muted font-weight-bold mb-0">Help</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ERROR -->
|
||||
<div v-if="page == 'error'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center align-items-center" style="height: 90vh;">
|
||||
<p class="h3 mb-0">Oops!</p>
|
||||
<p class="h3 mb-0 text-light">Oops!</p>
|
||||
<p class="text-muted lead">An error occurred, please try again later.</p>
|
||||
<p class="text-muted mb-0">
|
||||
<a class="btn btn-outline-secondary py-0 px-5 font-weight-bold" href="/">Go back</a>
|
||||
|
@ -88,27 +107,62 @@
|
|||
|
||||
<!-- UPLOADING -->
|
||||
<div v-if="page == 'uploading'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center align-items-center" style="height: 90vh;">
|
||||
<p v-if="uploadProgress != 100" class="display-4 mb-0">Uploading {{uploadProgress}}%</p>
|
||||
<p v-else class="display-4 mb-0">Publishing Story</p>
|
||||
<p v-if="uploadProgress != 100" class="display-4 mb-0 text-muted">Uploading {{uploadProgress}}%</p>
|
||||
<p v-else class="display-4 mb-0 text-muted">Processing ...</p>
|
||||
</div>
|
||||
|
||||
<div v-if="page == 'edit'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center" style="height: 90vh;">
|
||||
<div class="text-center flex-fill mt-5 pt-5">
|
||||
<img src="/img/pixelfed-icon-grey.svg" width="60px" height="60px">
|
||||
<p class="font-weight-bold lead text-lighter mt-1">Stories</p>
|
||||
<!-- CROPPING -->
|
||||
<div v-if="page == 'cropping'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center align-items-center" style="height: 90vh;">
|
||||
<p class="display-4 mb-0 text-muted">Cropping ...</p>
|
||||
</div>
|
||||
<div class="flex-fill py-5">
|
||||
<div class="card w-100 shadow-none" style="max-height: 500px; overflow-y: auto">
|
||||
|
||||
<!-- PREVIEW -->
|
||||
<div v-if="page == 'preview'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center align-items-center" style="height: 90vh;">
|
||||
<div>
|
||||
<div class="form-group">
|
||||
<label for="durationSlider" class="text-light lead font-weight-bold">Story Duration</label>
|
||||
<input type="range" class="custom-range" min="3" max="10" id="durationSlider" v-model="duration">
|
||||
<p class="help-text text-center">
|
||||
<span class="text-light">{{duration}} seconds</span>
|
||||
</p>
|
||||
</div>
|
||||
<hr class="my-3">
|
||||
<a class="btn btn-primary btn-block px-5 font-weight-bold my-3" href="#" @click.prevent="shareStoryToFollowers()">
|
||||
Share Story with followers
|
||||
</a>
|
||||
|
||||
<a class="btn btn-outline-muted btn-block px-5 font-weight-bold" href="/" @click.prevent="deleteCurrentStory()">
|
||||
Cancel
|
||||
</a>
|
||||
</div>
|
||||
<!-- <a class="btn btn-outline-secondary btn-block px-5 font-weight-bold" href="#">
|
||||
Share Story with everyone
|
||||
</a> -->
|
||||
</div>
|
||||
|
||||
<!-- EDIT -->
|
||||
<div v-if="page == 'edit'" class="card card-body bg-transparent border-0 shadow-none d-flex justify-content-center" style="height: 90vh;">
|
||||
<div class="text-center flex-fill mt-5">
|
||||
<p class="text-muted font-weight-light mb-1">
|
||||
<i class="fas fa-history fa-5x"></i>
|
||||
</p>
|
||||
<p class="text-muted font-weight-bold mb-0">STORIES</p>
|
||||
</div>
|
||||
<div class="flex-fill py-4">
|
||||
<div class="card w-100 shadow-none bg-transparent" style="max-height: 50vh; overflow-y: scroll">
|
||||
<div class="list-group">
|
||||
<div v-for="(story, index) in stories" class="list-group-item text-center text-dark" href="#">
|
||||
<div v-for="(story, index) in stories" class="list-group-item bg-transparent text-center border-muted text-lighter" href="#">
|
||||
<div class="media align-items-center">
|
||||
<div class="mr-3 cursor-pointer" @click="showLightbox(story)">
|
||||
<img :src="story.src" class="img-fluid" width="70px" height="70px">
|
||||
<p class="small text-muted text-center mb-0">(expand)</p>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<div class="media-body text-left">
|
||||
<p class="mb-0">Expires</p>
|
||||
<p class="mb-0 text-muted small"><span>{{expiresTimestamp(story.expires_at)}}</span></p>
|
||||
<p class="mb-1 text-muted small"><span>{{expiresTimestamp(story.expires_at)}}</span></p>
|
||||
<p class="mb-0">
|
||||
<button class="btn btn-outline-muted btn-sm py-0 px-2">Followers Only</button>
|
||||
</p>
|
||||
</div>
|
||||
<div class="float-right">
|
||||
<button @click="deleteStory(story, index)" class="btn btn-danger btn-sm font-weight-bold text-uppercase">Delete</button>
|
||||
|
@ -119,7 +173,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="flex-fill text-center">
|
||||
<a class="btn btn-outline-secondary py-0 px-5 font-weight-bold" href="/i/stories/new">Go back</a>
|
||||
<a class="btn btn-outline-secondary btn-block px-5 font-weight-bold" href="/i/stories/new" @click.prevent="goBack()">Go back</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -134,14 +188,16 @@
|
|||
body-class="p-0"
|
||||
>
|
||||
<div v-if="lightboxMedia" class="w-100 h-100">
|
||||
<img :src="lightboxMedia.url" style="max-height: 100%; max-width: 100%">
|
||||
<img :src="lightboxMedia.url" style="max-height: 90vh; width: 100%; object-fit: cover;">
|
||||
</div>
|
||||
</b-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style type="text/css" scoped>
|
||||
|
||||
<style type="text/css">
|
||||
.bg-black {
|
||||
background-color: #262626;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
@ -182,12 +238,15 @@
|
|||
zoom: null
|
||||
},
|
||||
mediaUrl: null,
|
||||
mediaId: null,
|
||||
stories: [],
|
||||
lightboxMedia: false,
|
||||
duration: 3
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
$('body').addClass('bg-black');
|
||||
this.mediaWatcher();
|
||||
axios.get('/api/stories/v0/fetch/' + this.profileId)
|
||||
.then(res => {
|
||||
|
@ -241,19 +300,21 @@
|
|||
}
|
||||
};
|
||||
|
||||
io.value = null;
|
||||
axios.post('/api/stories/v0/add', form, xhrConfig)
|
||||
.then(function(e) {
|
||||
self.uploadProgress = 100;
|
||||
self.uploading = false;
|
||||
window.location.href = '/i/my/story';
|
||||
self.mediaUrl = e.data.media_url;
|
||||
self.mediaId = e.data.media_id;
|
||||
self.page = 'crop';
|
||||
// window.location.href = '/i/my/story';
|
||||
}).catch(function(e) {
|
||||
self.uploading = false;
|
||||
io.value = null;
|
||||
let msg = e.response.data.message ? e.response.data.message : 'Something went wrong.'
|
||||
swal('Oops!', msg, 'warning');
|
||||
});
|
||||
io.value = null;
|
||||
self.uploadProgress = 0;
|
||||
});
|
||||
},
|
||||
|
@ -286,7 +347,45 @@
|
|||
window.location.href = '/i/stories/new';
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
navigateTo(path = '/') {
|
||||
window.location.href = path;
|
||||
},
|
||||
|
||||
goBack() {
|
||||
this.page = 'landing';
|
||||
},
|
||||
|
||||
performCrop() {
|
||||
this.page = 'cropping';
|
||||
let data = this.$refs.croppa.getData();
|
||||
axios.post('/api/stories/v0/crop', {
|
||||
media_id: this.mediaId,
|
||||
width: data.width,
|
||||
height: data.height,
|
||||
x: data.x,
|
||||
y: data.y
|
||||
}).then(res => {
|
||||
this.page = 'preview';
|
||||
});
|
||||
},
|
||||
|
||||
deleteCurrentStory() {
|
||||
let story = {
|
||||
id: this.mediaId
|
||||
};
|
||||
this.deleteStory(story);
|
||||
this.page = 'landing';
|
||||
},
|
||||
|
||||
shareStoryToFollowers() {
|
||||
axios.post('/api/stories/v0/publish', {
|
||||
media_id: this.mediaId,
|
||||
duration: this.duration
|
||||
}).then(res => {
|
||||
window.location.href = '/i/my/story?id=' + this.mediaId;
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -230,6 +230,8 @@ Route::domain(config('pixelfed.domain.app'))->middleware(['validemail', 'twofact
|
|||
Route::delete('v0/delete/{id}', 'StoryController@apiV1Delete')->middleware('throttle:maxStoryDeletePerDay,1440');
|
||||
Route::get('v0/me', 'StoryController@apiV1Me');
|
||||
Route::get('v0/item/{id}', 'StoryController@apiV1Item');
|
||||
Route::post('v0/crop', 'StoryController@cropPhoto');
|
||||
Route::post('v0/publish', 'StoryController@publishStory');
|
||||
});
|
||||
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue