mirror of
https://github.com/pixelfed/pixelfed.git
synced 2024-12-22 21:13:16 +00:00
Merge branch 'pixelfed:dev' into dev
This commit is contained in:
Norbert Tretkowski
GitHub
commit
8f3ba930ce
28 changed files with 2175 additions and 1658 deletions
|
|
@ -67,7 +67,7 @@ ADMIN_DOMAIN="${APP_DOMAIN}"
|
|||
# @default "false"
|
||||
# @see https://docs.pixelfed.org/technical-documentation/config/#config_cache
|
||||
# @dottie/validate required,boolean
|
||||
ENABLE_CONFIG_CACHE="false"
|
||||
ENABLE_CONFIG_CACHE="true"
|
||||
|
||||
# Enable/disable new local account registrations.
|
||||
#
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ OPEN_REGISTRATION="false"
|
|||
ENFORCE_EMAIL_VERIFICATION="false"
|
||||
PF_MAX_USERS="1000"
|
||||
OAUTH_ENABLED="true"
|
||||
ENABLE_CONFIG_CACHE=true
|
||||
|
||||
# Media Configuration
|
||||
PF_OPTIMIZE_IMAGES="true"
|
||||
|
|
|
|||
21
CHANGELOG.md
21
CHANGELOG.md
|
|
@ -1,6 +1,19 @@
|
|||
# Release Notes
|
||||
|
||||
## [Unreleased](https://github.com/pixelfed/pixelfed/compare/v0.11.13...dev)
|
||||
## [Unreleased](https://github.com/pixelfed/pixelfed/compare/v0.12.1...dev)
|
||||
|
||||
### Updates
|
||||
- Update DirectMessageController, add 72 hour delay for new accounts before they can send a DM ([61d105fd](https://github.com/pixelfed/pixelfed/commit/61d105fd))
|
||||
- Update AdminCuratedRegisterController, increase message length from 1000 to 3000 ([9a5e3471](https://github.com/pixelfed/pixelfed/commit/))
|
||||
- ([](https://github.com/pixelfed/pixelfed/commit/9a5e3471))
|
||||
|
||||
## [v0.12.1 (2024-05-07)](https://github.com/pixelfed/pixelfed/compare/v0.12.0...v0.12.1)
|
||||
|
||||
### Updates
|
||||
- Update ApiV1Dot1Controller, fix in app registration bug that prevents proper auth flow due to missing oauth scopes ([cbf996c9](https://github.com/pixelfed/pixelfed/commit/cbf996c9))
|
||||
- Update ConfigCacheService, fix database race condition and fallback to file config and enable by default ([60a62b59](https://github.com/pixelfed/pixelfed/commit/60a62b59))
|
||||
|
||||
## [v0.12.0 (2024-04-29)](https://github.com/pixelfed/pixelfed/compare/v0.11.13...v0.12.0)
|
||||
|
||||
### Updates
|
||||
|
||||
|
|
@ -66,7 +79,11 @@
|
|||
- Update UnfollowPipeline, fix follower count cache bug ([6bdf73de](https://github.com/pixelfed/pixelfed/commit/6bdf73de))
|
||||
- Update VideoPresenter component, add webkit-playsinline attribute to video element to prevent the full screen video player ([ad032916](https://github.com/pixelfed/pixelfed/commit/ad032916))
|
||||
- Update VideoPlayer component, add playsinline attribute to video element ([8af23607](https://github.com/pixelfed/pixelfed/commit/8af23607))
|
||||
- ([](https://github.com/pixelfed/pixelfed/commit/))
|
||||
- Update StatusController, refactor status embeds ([9a7acc12](https://github.com/pixelfed/pixelfed/commit/9a7acc12))
|
||||
- Update ProfileController, refactor profile embeds ([8b8b1ffc](https://github.com/pixelfed/pixelfed/commit/8b8b1ffc))
|
||||
- Update profile embed view, fix height bug ([65166570](https://github.com/pixelfed/pixelfed/commit/65166570))
|
||||
- Update CustomEmojiService, only return local emoji ([7f8bba44](https://github.com/pixelfed/pixelfed/commit/7f8bba44))
|
||||
- Update Like model, increase max likes per day from 500 to 1500 ([4223119f](https://github.com/pixelfed/pixelfed/commit/4223119f))
|
||||
|
||||
## [v0.11.13 (2024-03-05)](https://github.com/pixelfed/pixelfed/compare/v0.11.12...v0.11.13)
|
||||
|
||||
|
|
|
|||
|
|
@ -174,7 +174,7 @@ class AdminCuratedRegisterController extends Controller
|
|||
public function apiMessageSendStore(Request $request, $id)
|
||||
{
|
||||
$this->validate($request, [
|
||||
'message' => 'required|string|min:5|max:1000',
|
||||
'message' => 'required|string|min:5|max:3000',
|
||||
]);
|
||||
$record = CuratedRegister::findOrFail($id);
|
||||
abort_if($record->email_verified_at === null, 400, 'Cannot message an unverified email');
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -309,6 +309,7 @@ class DirectMessageController extends Controller
|
|||
|
||||
$user = $request->user();
|
||||
abort_if($user->has_roles && !UserRoleService::can('can-direct-message', $user->id), 403, 'Invalid permissions for this action');
|
||||
abort_if($user->created_at->gt(now()->subHours(72)), 400, 'You need to wait a bit before you can DM another account');
|
||||
$profile = $user->profile;
|
||||
$recipient = Profile::where('id', '!=', $profile->id)->findOrFail($request->input('to_id'));
|
||||
|
||||
|
|
|
|||
|
|
@ -172,7 +172,7 @@ class ProfileController extends Controller
|
|||
|
||||
$user = $this->getCachedUser($username);
|
||||
|
||||
abort_if(!$user, 404);
|
||||
abort_if(! $user, 404);
|
||||
|
||||
return redirect($user->url());
|
||||
}
|
||||
|
|
@ -254,7 +254,7 @@ class ProfileController extends Controller
|
|||
|
||||
abort_if(! $profile || $profile['locked'] || ! $profile['local'], 404);
|
||||
|
||||
$aiCheck = Cache::remember('profile:ai-check:spam-login:'.$profile['id'], 86400, function () use ($profile) {
|
||||
$aiCheck = Cache::remember('profile:ai-check:spam-login:'.$profile['id'], 3600, function () use ($profile) {
|
||||
$uid = User::whereProfileId($profile['id'])->first();
|
||||
if (! $uid) {
|
||||
return true;
|
||||
|
|
@ -348,7 +348,7 @@ class ProfileController extends Controller
|
|||
return response($res)->withHeaders(['X-Frame-Options' => 'ALLOWALL']);
|
||||
}
|
||||
|
||||
$aiCheck = Cache::remember('profile:ai-check:spam-login:'.$profile->id, 86400, function () use ($profile) {
|
||||
$aiCheck = Cache::remember('profile:ai-check:spam-login:'.$profile->id, 3600, function () use ($profile) {
|
||||
$exists = AccountInterstitial::whereUserId($profile->user_id)->where('is_spam', 1)->count();
|
||||
if ($exists) {
|
||||
return true;
|
||||
|
|
@ -373,7 +373,7 @@ class ProfileController extends Controller
|
|||
|
||||
public function stories(Request $request, $username)
|
||||
{
|
||||
abort_if(!(bool) config_cache('instance.stories.enabled') || ! $request->user(), 404);
|
||||
abort_if(! (bool) config_cache('instance.stories.enabled') || ! $request->user(), 404);
|
||||
$profile = Profile::whereNull('domain')->whereUsername($username)->firstOrFail();
|
||||
$pid = $profile->id;
|
||||
$authed = Auth::user()->profile_id;
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ use App\Jobs\SharePipeline\UndoSharePipeline;
|
|||
use App\Jobs\StatusPipeline\RemoteStatusDelete;
|
||||
use App\Jobs\StatusPipeline\StatusDelete;
|
||||
use App\Profile;
|
||||
use App\Services\AccountService;
|
||||
use App\Services\HashidService;
|
||||
use App\Services\ReblogService;
|
||||
use App\Services\StatusService;
|
||||
|
|
@ -113,19 +114,33 @@ class StatusController extends Controller
|
|||
return response($res)->withHeaders(['X-Frame-Options' => 'ALLOWALL']);
|
||||
}
|
||||
|
||||
$profile = Profile::whereNull(['domain', 'status'])
|
||||
->whereIsPrivate(false)
|
||||
->whereUsername($username)
|
||||
->first();
|
||||
$status = StatusService::get($id);
|
||||
|
||||
if (! $profile) {
|
||||
if (
|
||||
! $status ||
|
||||
! isset($status['account'], $status['account']['id'], $status['local']) ||
|
||||
! $status['local'] ||
|
||||
strtolower($status['account']['username']) !== strtolower($username)
|
||||
) {
|
||||
$content = view('status.embed-removed');
|
||||
|
||||
return response($content, 404)->header('X-Frame-Options', 'ALLOWALL');
|
||||
}
|
||||
|
||||
$profile = AccountService::get($status['account']['id'], true);
|
||||
|
||||
if (! $profile || $profile['locked'] || ! $profile['local']) {
|
||||
$content = view('status.embed-removed');
|
||||
|
||||
return response($content)->header('X-Frame-Options', 'ALLOWALL');
|
||||
}
|
||||
|
||||
$aiCheck = Cache::remember('profile:ai-check:spam-login:'.$profile->id, 86400, function () use ($profile) {
|
||||
$exists = AccountInterstitial::whereUserId($profile->user_id)->where('is_spam', 1)->count();
|
||||
$aiCheck = Cache::remember('profile:ai-check:spam-login:'.$profile['id'], 3600, function () use ($profile) {
|
||||
$user = Profile::find($profile['id']);
|
||||
if (! $user) {
|
||||
return true;
|
||||
}
|
||||
$exists = AccountInterstitial::whereUserId($user->user_id)->where('is_spam', 1)->count();
|
||||
if ($exists) {
|
||||
return true;
|
||||
}
|
||||
|
|
@ -138,17 +153,22 @@ class StatusController extends Controller
|
|||
|
||||
return response($res)->withHeaders(['X-Frame-Options' => 'ALLOWALL']);
|
||||
}
|
||||
$status = Status::whereProfileId($profile->id)
|
||||
->whereNull('uri')
|
||||
->whereScope('public')
|
||||
->whereIsNsfw(false)
|
||||
->whereIn('type', ['photo', 'video', 'photo:album'])
|
||||
->find($id);
|
||||
if (! $status) {
|
||||
|
||||
$status = StatusService::get($id);
|
||||
|
||||
if (
|
||||
! $status ||
|
||||
! isset($status['account'], $status['account']['id']) ||
|
||||
intval($status['account']['id']) !== intval($profile['id']) ||
|
||||
$status['sensitive'] ||
|
||||
$status['visibility'] !== 'public' ||
|
||||
$status['pf_type'] !== 'photo'
|
||||
) {
|
||||
$content = view('status.embed-removed');
|
||||
|
||||
return response($content)->header('X-Frame-Options', 'ALLOWALL');
|
||||
}
|
||||
|
||||
$showLikes = $request->filled('likes') && $request->likes == true;
|
||||
$showCaption = $request->filled('caption') && $request->caption !== false;
|
||||
$layout = $request->filled('layout') && $request->layout == 'compact' ? 'compact' : 'full';
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ class Like extends Model
|
|||
{
|
||||
use SoftDeletes;
|
||||
|
||||
const MAX_PER_DAY = 500;
|
||||
const MAX_PER_DAY = 1500;
|
||||
|
||||
/**
|
||||
* The attributes that should be mutated to dates.
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ namespace App\Services;
|
|||
|
||||
use App\Models\ConfigCache as ConfigCacheModel;
|
||||
use Cache;
|
||||
use Illuminate\Database\QueryException;
|
||||
|
||||
class ConfigCacheService
|
||||
{
|
||||
|
|
@ -25,156 +26,159 @@ class ConfigCacheService
|
|||
return config($key);
|
||||
}
|
||||
|
||||
return Cache::remember($cacheKey, $ttl, function () use ($key) {
|
||||
try {
|
||||
return Cache::remember($cacheKey, $ttl, function () use ($key) {
|
||||
$allowed = [
|
||||
'app.name',
|
||||
'app.short_description',
|
||||
'app.description',
|
||||
'app.rules',
|
||||
|
||||
$allowed = [
|
||||
'app.name',
|
||||
'app.short_description',
|
||||
'app.description',
|
||||
'app.rules',
|
||||
'pixelfed.max_photo_size',
|
||||
'pixelfed.max_album_length',
|
||||
'pixelfed.image_quality',
|
||||
'pixelfed.media_types',
|
||||
|
||||
'pixelfed.max_photo_size',
|
||||
'pixelfed.max_album_length',
|
||||
'pixelfed.image_quality',
|
||||
'pixelfed.media_types',
|
||||
'pixelfed.open_registration',
|
||||
'federation.activitypub.enabled',
|
||||
'instance.stories.enabled',
|
||||
'pixelfed.oauth_enabled',
|
||||
'pixelfed.import.instagram.enabled',
|
||||
'pixelfed.bouncer.enabled',
|
||||
|
||||
'pixelfed.open_registration',
|
||||
'federation.activitypub.enabled',
|
||||
'instance.stories.enabled',
|
||||
'pixelfed.oauth_enabled',
|
||||
'pixelfed.import.instagram.enabled',
|
||||
'pixelfed.bouncer.enabled',
|
||||
'pixelfed.enforce_email_verification',
|
||||
'pixelfed.max_account_size',
|
||||
'pixelfed.enforce_account_limit',
|
||||
|
||||
'pixelfed.enforce_email_verification',
|
||||
'pixelfed.max_account_size',
|
||||
'pixelfed.enforce_account_limit',
|
||||
'uikit.custom.css',
|
||||
'uikit.custom.js',
|
||||
'uikit.show_custom.css',
|
||||
'uikit.show_custom.js',
|
||||
'about.title',
|
||||
|
||||
'uikit.custom.css',
|
||||
'uikit.custom.js',
|
||||
'uikit.show_custom.css',
|
||||
'uikit.show_custom.js',
|
||||
'about.title',
|
||||
'pixelfed.cloud_storage',
|
||||
|
||||
'pixelfed.cloud_storage',
|
||||
'account.autofollow',
|
||||
'account.autofollow_usernames',
|
||||
'config.discover.features',
|
||||
|
||||
'account.autofollow',
|
||||
'account.autofollow_usernames',
|
||||
'config.discover.features',
|
||||
'instance.has_legal_notice',
|
||||
'instance.avatar.local_to_cloud',
|
||||
|
||||
'instance.has_legal_notice',
|
||||
'instance.avatar.local_to_cloud',
|
||||
'pixelfed.directory',
|
||||
'app.banner_image',
|
||||
'pixelfed.directory.submission-key',
|
||||
'pixelfed.directory.submission-ts',
|
||||
'pixelfed.directory.has_submitted',
|
||||
'pixelfed.directory.latest_response',
|
||||
'pixelfed.directory.is_synced',
|
||||
'pixelfed.directory.testimonials',
|
||||
|
||||
'pixelfed.directory',
|
||||
'app.banner_image',
|
||||
'pixelfed.directory.submission-key',
|
||||
'pixelfed.directory.submission-ts',
|
||||
'pixelfed.directory.has_submitted',
|
||||
'pixelfed.directory.latest_response',
|
||||
'pixelfed.directory.is_synced',
|
||||
'pixelfed.directory.testimonials',
|
||||
'instance.landing.show_directory',
|
||||
'instance.landing.show_explore',
|
||||
'instance.admin.pid',
|
||||
'instance.banner.blurhash',
|
||||
|
||||
'instance.landing.show_directory',
|
||||
'instance.landing.show_explore',
|
||||
'instance.admin.pid',
|
||||
'instance.banner.blurhash',
|
||||
'autospam.nlp.enabled',
|
||||
|
||||
'autospam.nlp.enabled',
|
||||
'instance.curated_registration.enabled',
|
||||
|
||||
'instance.curated_registration.enabled',
|
||||
'federation.migration',
|
||||
|
||||
'federation.migration',
|
||||
'pixelfed.max_caption_length',
|
||||
'pixelfed.max_bio_length',
|
||||
'pixelfed.max_name_length',
|
||||
'pixelfed.min_password_length',
|
||||
'pixelfed.max_avatar_size',
|
||||
'pixelfed.max_altext_length',
|
||||
'pixelfed.allow_app_registration',
|
||||
'pixelfed.app_registration_rate_limit_attempts',
|
||||
'pixelfed.app_registration_rate_limit_decay',
|
||||
'pixelfed.app_registration_confirm_rate_limit_attempts',
|
||||
'pixelfed.app_registration_confirm_rate_limit_decay',
|
||||
'instance.embed.profile',
|
||||
'instance.embed.post',
|
||||
|
||||
'pixelfed.max_caption_length',
|
||||
'pixelfed.max_bio_length',
|
||||
'pixelfed.max_name_length',
|
||||
'pixelfed.min_password_length',
|
||||
'pixelfed.max_avatar_size',
|
||||
'pixelfed.max_altext_length',
|
||||
'pixelfed.allow_app_registration',
|
||||
'pixelfed.app_registration_rate_limit_attempts',
|
||||
'pixelfed.app_registration_rate_limit_decay',
|
||||
'pixelfed.app_registration_confirm_rate_limit_attempts',
|
||||
'pixelfed.app_registration_confirm_rate_limit_decay',
|
||||
'instance.embed.profile',
|
||||
'instance.embed.post',
|
||||
'captcha.enabled',
|
||||
'captcha.secret',
|
||||
'captcha.sitekey',
|
||||
'captcha.active.login',
|
||||
'captcha.active.register',
|
||||
'captcha.triggers.login.enabled',
|
||||
'captcha.triggers.login.attempts',
|
||||
'federation.custom_emoji.enabled',
|
||||
|
||||
'captcha.enabled',
|
||||
'captcha.secret',
|
||||
'captcha.sitekey',
|
||||
'captcha.active.login',
|
||||
'captcha.active.register',
|
||||
'captcha.triggers.login.enabled',
|
||||
'captcha.triggers.login.attempts',
|
||||
'federation.custom_emoji.enabled',
|
||||
'pixelfed.optimize_image',
|
||||
'pixelfed.optimize_video',
|
||||
'pixelfed.max_collection_length',
|
||||
'media.delete_local_after_cloud',
|
||||
'instance.user_filters.max_user_blocks',
|
||||
'instance.user_filters.max_user_mutes',
|
||||
'instance.user_filters.max_domain_blocks',
|
||||
|
||||
'pixelfed.optimize_image',
|
||||
'pixelfed.optimize_video',
|
||||
'pixelfed.max_collection_length',
|
||||
'media.delete_local_after_cloud',
|
||||
'instance.user_filters.max_user_blocks',
|
||||
'instance.user_filters.max_user_mutes',
|
||||
'instance.user_filters.max_domain_blocks',
|
||||
'filesystems.disks.s3.key',
|
||||
'filesystems.disks.s3.secret',
|
||||
'filesystems.disks.s3.region',
|
||||
'filesystems.disks.s3.bucket',
|
||||
'filesystems.disks.s3.visibility',
|
||||
'filesystems.disks.s3.url',
|
||||
'filesystems.disks.s3.endpoint',
|
||||
'filesystems.disks.s3.use_path_style_endpoint',
|
||||
|
||||
'filesystems.disks.s3.key',
|
||||
'filesystems.disks.s3.secret',
|
||||
'filesystems.disks.s3.region',
|
||||
'filesystems.disks.s3.bucket',
|
||||
'filesystems.disks.s3.visibility',
|
||||
'filesystems.disks.s3.url',
|
||||
'filesystems.disks.s3.endpoint',
|
||||
'filesystems.disks.s3.use_path_style_endpoint',
|
||||
'filesystems.disks.spaces.key',
|
||||
'filesystems.disks.spaces.secret',
|
||||
'filesystems.disks.spaces.region',
|
||||
'filesystems.disks.spaces.bucket',
|
||||
'filesystems.disks.spaces.visibility',
|
||||
'filesystems.disks.spaces.url',
|
||||
'filesystems.disks.spaces.endpoint',
|
||||
'filesystems.disks.spaces.use_path_style_endpoint',
|
||||
// 'system.user_mode'
|
||||
];
|
||||
|
||||
'filesystems.disks.spaces.key',
|
||||
'filesystems.disks.spaces.secret',
|
||||
'filesystems.disks.spaces.region',
|
||||
'filesystems.disks.spaces.bucket',
|
||||
'filesystems.disks.spaces.visibility',
|
||||
'filesystems.disks.spaces.url',
|
||||
'filesystems.disks.spaces.endpoint',
|
||||
'filesystems.disks.spaces.use_path_style_endpoint',
|
||||
// 'system.user_mode'
|
||||
];
|
||||
|
||||
if (! config('instance.enable_cc')) {
|
||||
return config($key);
|
||||
}
|
||||
|
||||
if (! in_array($key, $allowed)) {
|
||||
return config($key);
|
||||
}
|
||||
|
||||
$protect = false;
|
||||
$protected = null;
|
||||
if(in_array($key, self::PROTECTED_KEYS)) {
|
||||
$protect = true;
|
||||
}
|
||||
|
||||
$v = config($key);
|
||||
$c = ConfigCacheModel::where('k', $key)->first();
|
||||
|
||||
if ($c) {
|
||||
if($protect) {
|
||||
return decrypt($c->v) ?? config($key);
|
||||
} else {
|
||||
return $c->v ?? config($key);
|
||||
if (! config('instance.enable_cc')) {
|
||||
return config($key);
|
||||
}
|
||||
}
|
||||
|
||||
if (! $v) {
|
||||
return;
|
||||
}
|
||||
if (! in_array($key, $allowed)) {
|
||||
return config($key);
|
||||
}
|
||||
|
||||
if($protect && $v) {
|
||||
$protected = encrypt($v);
|
||||
}
|
||||
$protect = false;
|
||||
$protected = null;
|
||||
if(in_array($key, self::PROTECTED_KEYS)) {
|
||||
$protect = true;
|
||||
}
|
||||
|
||||
$cc = new ConfigCacheModel;
|
||||
$cc->k = $key;
|
||||
$cc->v = $protect ? $protected : $v;
|
||||
$cc->save();
|
||||
$v = config($key);
|
||||
$c = ConfigCacheModel::where('k', $key)->first();
|
||||
|
||||
return $v;
|
||||
});
|
||||
if ($c) {
|
||||
if($protect) {
|
||||
return decrypt($c->v) ?? config($key);
|
||||
} else {
|
||||
return $c->v ?? config($key);
|
||||
}
|
||||
}
|
||||
|
||||
if (! $v) {
|
||||
return;
|
||||
}
|
||||
|
||||
if($protect && $v) {
|
||||
$protected = encrypt($v);
|
||||
}
|
||||
|
||||
$cc = new ConfigCacheModel;
|
||||
$cc->k = $key;
|
||||
$cc->v = $protect ? $protected : $v;
|
||||
$cc->save();
|
||||
|
||||
return $v;
|
||||
});
|
||||
} catch (Exception | QueryException $e) {
|
||||
return config($key);
|
||||
}
|
||||
}
|
||||
|
||||
public static function put($key, $val)
|
||||
|
|
|
|||
|
|
@ -133,6 +133,7 @@ class CustomEmojiService
|
|||
return CustomEmoji::when(!$pgsql, function($q, $pgsql) {
|
||||
return $q->groupBy('shortcode');
|
||||
})
|
||||
->whereNull('uri')
|
||||
->get()
|
||||
->map(function($emojo) {
|
||||
$url = url('storage/' . $emojo->media_path);
|
||||
|
|
|
|||
618
composer.lock
generated
618
composer.lock
generated
File diff suppressed because it is too large
Load diff
|
|
@ -23,7 +23,7 @@ return [
|
|||
| This value is the version of your Pixelfed instance.
|
||||
|
|
||||
*/
|
||||
'version' => '0.11.13',
|
||||
'version' => '0.12.1',
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
|
|||
BIN
public/embed.js
vendored
BIN
public/embed.js
vendored
Binary file not shown.
|
|
@ -169,7 +169,7 @@
|
|||
<script type="text/javascript">
|
||||
import BigPicture from 'bigpicture';
|
||||
import ReadMore from './ReadMore.vue';
|
||||
import VideoPlayer from './../../presenter/VideoPlayer.vue';
|
||||
import VideoPlayer from '@/presenter/VideoPlayer.vue';
|
||||
|
||||
export default {
|
||||
props: ['status'],
|
||||
|
|
|
|||
|
|
@ -0,0 +1,75 @@
|
|||
<template>
|
||||
<div v-if="status.sensitive == true">
|
||||
<details class="details-animated">
|
||||
<summary>
|
||||
<p class="mb-0 lead font-weight-bold">{{ status.spoiler_text ? status.spoiler_text : 'CW / NSFW / Hidden Media'}}</p>
|
||||
<p class="font-weight-light">(click to show)</p>
|
||||
</summary>
|
||||
<b-carousel :id="status.id + '-carousel'"
|
||||
style="text-shadow: 1px 1px 2px #333; background-color: #000;"
|
||||
controls
|
||||
img-blank
|
||||
background="#ffffff"
|
||||
:interval="0"
|
||||
>
|
||||
<b-carousel-slide v-for="(media, index) in status.media_attachments" :key="media.id + '-media'">
|
||||
|
||||
<video v-if="media.type == 'video'" slot="img" class="embed-responsive-item" preload="none" controls playsinline loop :alt="media.description" width="100%" height="100%">
|
||||
<source :src="media.url" :type="media.mime">
|
||||
</video>
|
||||
|
||||
<div v-else-if="media.type == 'image'" slot="img" :title="media.description">
|
||||
<img :class="media.filter_class + ' d-block img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy" onerror="this.onerror=null;this.src='/storage/no-preview.png'">
|
||||
</div>
|
||||
|
||||
<p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p>
|
||||
|
||||
</b-carousel-slide>
|
||||
</b-carousel>
|
||||
</details>
|
||||
</div>
|
||||
<div v-else class="w-100 h-100 p-0">
|
||||
<!-- <b-carousel :id="status.id + '-carousel'"
|
||||
style="text-shadow: 1px 1px 2px #333; background-color: #000;"
|
||||
controls
|
||||
img-blank
|
||||
background="#ffffff"
|
||||
:interval="0"
|
||||
>
|
||||
<b-carousel-slide v-for="(media, index) in status.media_attachments" :key="media.id + '-media'">
|
||||
|
||||
<video v-if="media.type == 'Video'" slot="img" class="embed-responsive-item" preload="none" controls loop :title="media.description" width="100%" height="100%" :poster="media.preview_url">
|
||||
<source :src="media.url" :type="media.mime">
|
||||
</video>
|
||||
|
||||
<div v-else-if="media.type == 'Image'" slot="img" :title="media.description">
|
||||
<img :class="media.filter_class + ' d-block img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy">
|
||||
</div>
|
||||
|
||||
<p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p>
|
||||
|
||||
</b-carousel-slide>
|
||||
</b-carousel> -->
|
||||
<carousel ref="carousel" :centerMode="true" :loop="false" :per-page="1" :paginationPosition="'bottom-overlay'" paginationActiveColor="#3897f0" paginationColor="#dbdbdb" class="p-0 m-0">
|
||||
<slide v-for="(media, index) in status.media_attachments" :key="'px-carousel-'+media.id + '-' + index" class="w-100 h-100 d-block mx-auto text-center" style="background: #000; display: flex;align-items: center;">
|
||||
|
||||
<video v-if="media.type == 'video'" class="embed-responsive-item" preload="none" controls loop :title="media.description" width="100%" height="100%">
|
||||
<source :src="media.url" :type="media.mime">
|
||||
</video>
|
||||
|
||||
<div v-else-if="media.type == 'image'" :title="media.description">
|
||||
<img :class="media.filter_class + ' img-fluid w-100'" :src="media.url" :alt="media.description" loading="lazy" onerror="this.onerror=null;this.src='/storage/no-preview.png'">
|
||||
</div>
|
||||
|
||||
<p v-else class="text-center p-0 font-weight-bold text-white">Error: Problem rendering preview.</p>
|
||||
|
||||
</slide>
|
||||
</carousel>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/javascript">
|
||||
export default {
|
||||
props: ['status']
|
||||
}
|
||||
</script>
|
||||
188
resources/assets/components/presenter/PhotoAlbumPresenter.vue
Normal file
188
resources/assets/components/presenter/PhotoAlbumPresenter.vue
Normal file
|
|
@ -0,0 +1,188 @@
|
|||
<template>
|
||||
<div v-if="status.sensitive == true" class="content-label-wrapper">
|
||||
<div class="text-light content-label">
|
||||
<p class="text-center">
|
||||
<i class="far fa-eye-slash fa-2x"></i>
|
||||
</p>
|
||||
<p class="h4 font-weight-bold text-center">
|
||||
Sensitive Content
|
||||
</p>
|
||||
<p class="text-center py-2 content-label-text">
|
||||
{{ status.spoiler_text ? status.spoiler_text : 'This album may contain sensitive content.'}}
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<button @click="toggleContentWarning()" class="btn btn-outline-light btn-block btn-sm font-weight-bold">See Post</button>
|
||||
</p>
|
||||
</div>
|
||||
<blur-hash-image
|
||||
width="32"
|
||||
height="32"
|
||||
:punch="1"
|
||||
:hash="status.media_attachments[0].blurhash"
|
||||
:alt="altText(status)"/>
|
||||
</div>
|
||||
<div v-else class="w-100 h-100 p-0 album-wrapper">
|
||||
<carousel ref="carousel" :centerMode="true" :loop="false" :per-page="1" :paginationPosition="'bottom-overlay'" paginationActiveColor="#3897f0" paginationColor="#dbdbdb" class="p-0 m-0" :id="'carousel-' + status.id">
|
||||
<slide v-for="(img, index) in status.media_attachments" :key="'px-carousel-'+img.id + '-' + index" class="" style="background: #000; display: flex;align-items: center;" :title="img.description">
|
||||
|
||||
<img
|
||||
class="img-fluid w-100 p-0"
|
||||
:src="img.url"
|
||||
:alt="altText(img)"
|
||||
loading="lazy"
|
||||
:data-bp="img.url"
|
||||
onerror="this.onerror=null;this.src='/storage/no-preview.png'">
|
||||
|
||||
</slide>
|
||||
</carousel>
|
||||
<div class="album-overlay">
|
||||
<p v-if="!status.sensitive && sensitive"
|
||||
@click="status.sensitive = true"
|
||||
style="
|
||||
margin-top: 0;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
border-top-left-radius: 5px;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(0deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
|
||||
">
|
||||
<i class="fas fa-eye-slash fa-lg"></i>
|
||||
</p>
|
||||
|
||||
<p @click.prevent="toggleLightbox"
|
||||
style="
|
||||
margin-top: 0;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-bottom-right-radius: 5px;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(0deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
|
||||
">
|
||||
<i class="fas fa-expand fa-lg"></i>
|
||||
</p>
|
||||
|
||||
<p
|
||||
v-if="status.media_attachments[0].license"
|
||||
style="
|
||||
margin-bottom: 0;
|
||||
padding: 0 5px;
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
border-top-left-radius: 5px;
|
||||
background: linear-gradient(0deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
|
||||
">
|
||||
<a :href="status.url" class="font-weight-bold text-light">Photo</a> by <a :href="status.account.url" class="font-weight-bold text-light">@{{status.account.username}}</a> licensed under <a :href="status.media_attachments[0].license.url" class="font-weight-bold text-light">{{status.media_attachments[0].license.title}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
import BigPicture from 'bigpicture';
|
||||
|
||||
export default {
|
||||
props: ['status'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
sensitive: this.status.sensitive,
|
||||
cursor: 0
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
// window.addEventListener("keydown", this.keypressNavigation);
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
// window.removeEventListener("keydown", this.keypressNavigation);
|
||||
},
|
||||
|
||||
methods: {
|
||||
toggleContentWarning(status) {
|
||||
this.$emit('togglecw');
|
||||
},
|
||||
|
||||
toggleLightbox(e) {
|
||||
BigPicture({
|
||||
el: e.target,
|
||||
gallery: '#carousel-' + this.status.id,
|
||||
position: this.$refs.carousel.currentPage
|
||||
})
|
||||
},
|
||||
|
||||
altText(img) {
|
||||
let desc = img.description;
|
||||
if(desc) {
|
||||
return desc;
|
||||
}
|
||||
|
||||
return 'Photo was not tagged with any alt text.';
|
||||
},
|
||||
|
||||
keypressNavigation(e) {
|
||||
let ref = this.$refs.carousel;
|
||||
if (e.keyCode == "37") {
|
||||
e.preventDefault();
|
||||
|
||||
let direction = "backward";
|
||||
|
||||
ref.advancePage(direction);
|
||||
ref.$emit("navigation-click", direction);
|
||||
}
|
||||
|
||||
if (e.keyCode == "39") {
|
||||
e.preventDefault();
|
||||
|
||||
let direction = "forward";
|
||||
|
||||
ref.advancePage(direction);
|
||||
ref.$emit("navigation-click", direction);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style type="text/css" scoped>
|
||||
.card-img-top {
|
||||
border-top-left-radius: 0 !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
}
|
||||
.content-label-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
.content-label {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top:50%;
|
||||
left:50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
background: rgba(0, 0, 0, 0.2)
|
||||
}
|
||||
.album-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
160
resources/assets/components/presenter/PhotoPresenter.vue
Normal file
160
resources/assets/components/presenter/PhotoPresenter.vue
Normal file
|
|
@ -0,0 +1,160 @@
|
|||
<template>
|
||||
<div v-if="status.sensitive == true" class="content-label-wrapper">
|
||||
<div class="text-light content-label">
|
||||
<p class="text-center">
|
||||
<i class="far fa-eye-slash fa-2x"></i>
|
||||
</p>
|
||||
<p class="h4 font-weight-bold text-center">
|
||||
Sensitive Content
|
||||
</p>
|
||||
<p class="text-center py-2 content-label-text">
|
||||
{{ status.spoiler_text ? status.spoiler_text : 'This post may contain sensitive content.'}}
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<button @click="toggleContentWarning()" class="btn btn-outline-light btn-block btn-sm font-weight-bold">See Post</button>
|
||||
</p>
|
||||
</div>
|
||||
<blur-hash-image
|
||||
width="32"
|
||||
height="32"
|
||||
:punch="1"
|
||||
:hash="status.media_attachments[0].blurhash"
|
||||
:alt="altText(status)"/>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div :title="status.media_attachments[0].description" style="position: relative;">
|
||||
<img class="card-img-top"
|
||||
:src="status.media_attachments[0].url"
|
||||
loading="lazy"
|
||||
:alt="altText(status)"
|
||||
:width="width()"
|
||||
:height="height()"
|
||||
onerror="this.onerror=null;this.src='/storage/no-preview.png'"
|
||||
@click.prevent="toggleLightbox">
|
||||
|
||||
<!-- <blur-hash-image
|
||||
class="card-img-top"
|
||||
width="32"
|
||||
height="32"
|
||||
:punch="1"
|
||||
:hash="status.media_attachments[0].blurhash"
|
||||
:src="status.media_attachments[0].url"
|
||||
:alt="altText(status)"
|
||||
@click.prevent="toggleLightbox"/> -->
|
||||
|
||||
<p v-if="!status.sensitive && sensitive"
|
||||
@click="status.sensitive = true"
|
||||
style="
|
||||
margin-top: 0;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
border-top-left-radius: 5px;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(0deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
|
||||
">
|
||||
<i class="fas fa-eye-slash fa-lg"></i>
|
||||
</p>
|
||||
|
||||
<p
|
||||
v-if="status.media_attachments[0].license"
|
||||
style="
|
||||
margin-bottom: 0;
|
||||
padding: 0 5px;
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
border-top-left-radius: 5px;
|
||||
background: linear-gradient(0deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
|
||||
"><a :href="status.url" class="font-weight-bold text-light">Photo</a> by <a :href="status.account.url" class="font-weight-bold text-light">@{{status.account.username}}</a> licensed under <a :href="status.media_attachments[0].license.url" class="font-weight-bold text-light">{{status.media_attachments[0].license.title}}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style type="text/css" scoped>
|
||||
.card-img-top {
|
||||
border-top-left-radius: 0 !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
}
|
||||
.content-label-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
.content-label {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top:50%;
|
||||
left:50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
background: rgba(0, 0, 0, 0.2)
|
||||
}
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
import BigPicture from 'bigpicture';
|
||||
|
||||
export default {
|
||||
props: ['status'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
sensitive: this.status.sensitive
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
},
|
||||
|
||||
methods: {
|
||||
altText(status) {
|
||||
let desc = status.media_attachments[0].description;
|
||||
if(desc) {
|
||||
return desc;
|
||||
}
|
||||
|
||||
return 'Photo was not tagged with any alt text.';
|
||||
},
|
||||
|
||||
toggleContentWarning(status) {
|
||||
this.$emit('togglecw');
|
||||
},
|
||||
|
||||
toggleLightbox(e) {
|
||||
BigPicture({
|
||||
el: e.target
|
||||
})
|
||||
},
|
||||
|
||||
width() {
|
||||
if( !this.status.media_attachments[0].meta ||
|
||||
!this.status.media_attachments[0].meta.original ||
|
||||
!this.status.media_attachments[0].meta.original.width ) {
|
||||
return;
|
||||
}
|
||||
return this.status.media_attachments[0].meta.original.width;
|
||||
},
|
||||
|
||||
height() {
|
||||
if( !this.status.media_attachments[0].meta ||
|
||||
!this.status.media_attachments[0].meta.original ||
|
||||
!this.status.media_attachments[0].meta.original.height ) {
|
||||
return;
|
||||
}
|
||||
return this.status.media_attachments[0].meta.original.height;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<template>
|
||||
<div v-if="status.sensitive == true">
|
||||
<details class="details-animated">
|
||||
<summary>
|
||||
<p class="mb-0 lead font-weight-bold">{{ status.spoiler_text ? status.spoiler_text : 'CW / NSFW / Hidden Media'}}</p>
|
||||
<p class="font-weight-light">(click to show)</p>
|
||||
</summary>
|
||||
<b-carousel :id="status.id + '-carousel'"
|
||||
style="text-shadow: 1px 1px 2px #333; background-color: #000;"
|
||||
controls
|
||||
img-blank
|
||||
background="#ffffff"
|
||||
:interval="0"
|
||||
>
|
||||
<b-carousel-slide v-for="(vid, index) in status.media_attachments" :key="vid.id + '-media'">
|
||||
<video slot="img" class="embed-responsive-item" preload="none" controls playsinline loop :alt="vid.description" width="100%" height="100%">
|
||||
<source :src="vid.url" :type="vid.mime">
|
||||
</video>
|
||||
</b-carousel-slide>
|
||||
</b-carousel>
|
||||
</details>
|
||||
</div>
|
||||
<div v-else>
|
||||
<b-carousel :id="status.id + '-carousel'"
|
||||
style="text-shadow: 1px 1px 2px #333; background-color: #000;"
|
||||
controls
|
||||
img-blank
|
||||
background="#ffffff"
|
||||
:interval="0"
|
||||
>
|
||||
<b-carousel-slide v-for="(vid, index) in status.media_attachments" :key="vid.id + '-media'">
|
||||
<video slot="img" class="embed-responsive-item" preload="none" controls playsinline loop :alt="vid.description" width="100%" height="100%">
|
||||
<source :src="vid.url" :type="vid.mime">
|
||||
</video>
|
||||
</b-carousel-slide>
|
||||
</b-carousel>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/javascript">
|
||||
export default {
|
||||
props: ['status']
|
||||
}
|
||||
</script>
|
||||
90
resources/assets/components/presenter/VideoPresenter.vue
Normal file
90
resources/assets/components/presenter/VideoPresenter.vue
Normal file
|
|
@ -0,0 +1,90 @@
|
|||
<template>
|
||||
<div v-if="status.sensitive == true" class="content-label-wrapper">
|
||||
<div class="text-light content-label">
|
||||
<p class="text-center">
|
||||
<i class="far fa-eye-slash fa-2x"></i>
|
||||
</p>
|
||||
<p class="h4 font-weight-bold text-center">
|
||||
Sensitive Content
|
||||
</p>
|
||||
<p class="text-center py-2 content-label-text">
|
||||
{{ status.spoiler_text ? status.spoiler_text : 'This post may contain sensitive content.'}}
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<button @click="toggleContentWarning()" class="btn btn-outline-light btn-block btn-sm font-weight-bold">See Post</button>
|
||||
</p>
|
||||
</div>
|
||||
<blur-hash-image
|
||||
width="32"
|
||||
height="32"
|
||||
:punch="1"
|
||||
:hash="status.media_attachments[0].blurhash"
|
||||
:alt="altText(status)"/>
|
||||
</div>
|
||||
<div v-else class="embed-responsive embed-responsive-16by9">
|
||||
<video class="video" controls playsinline webkit-playsinline preload="metadata" loop :data-id="status.id" :poster="poster()">
|
||||
<source :src="status.media_attachments[0].url" :type="status.media_attachments[0].mime">
|
||||
</video>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style type="text/css" scoped>
|
||||
.content-label-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
.content-label {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top:50%;
|
||||
left:50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
background: rgba(0, 0, 0, 0.2)
|
||||
}
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
export default {
|
||||
props: ['status'],
|
||||
|
||||
methods: {
|
||||
altText(status) {
|
||||
let desc = status.media_attachments[0].description;
|
||||
if(desc) {
|
||||
return desc;
|
||||
}
|
||||
|
||||
return 'Video was not tagged with any alt text.';
|
||||
},
|
||||
|
||||
playOrPause(e) {
|
||||
let el = e.target;
|
||||
if(el.getAttribute('playing') == 1) {
|
||||
el.removeAttribute('playing');
|
||||
el.pause();
|
||||
} else {
|
||||
el.setAttribute('playing', 1);
|
||||
el.play();
|
||||
}
|
||||
},
|
||||
|
||||
toggleContentWarning(status) {
|
||||
this.$emit('togglecw');
|
||||
},
|
||||
|
||||
poster() {
|
||||
let url = this.status.media_attachments[0].preview_url;
|
||||
if(url.endsWith('no-preview.jpg') || url.endsWith('no-preview.png')) {
|
||||
return;
|
||||
}
|
||||
return url;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
10
resources/assets/js/landing.js
vendored
10
resources/assets/js/landing.js
vendored
|
|
@ -48,27 +48,27 @@ Vue.use(VueTimeago, {
|
|||
|
||||
Vue.component(
|
||||
'photo-presenter',
|
||||
require('./components/presenter/PhotoPresenter.vue').default
|
||||
require('./../components/presenter/PhotoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-presenter',
|
||||
require('./components/presenter/VideoPresenter.vue').default
|
||||
require('./../components/presenter/VideoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'photo-album-presenter',
|
||||
require('./components/presenter/PhotoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/PhotoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-album-presenter',
|
||||
require('./components/presenter/VideoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/VideoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'mixed-album-presenter',
|
||||
require('./components/presenter/MixedAlbumPresenter.vue').default
|
||||
require('./../components/presenter/MixedAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
|
|
|
|||
10
resources/assets/js/profile.js
vendored
10
resources/assets/js/profile.js
vendored
|
|
@ -1,26 +1,26 @@
|
|||
Vue.component(
|
||||
'photo-presenter',
|
||||
require('./components/presenter/PhotoPresenter.vue').default
|
||||
require('./../components/presenter/PhotoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-presenter',
|
||||
require('./components/presenter/VideoPresenter.vue').default
|
||||
require('./../components/presenter/VideoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'photo-album-presenter',
|
||||
require('./components/presenter/PhotoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/PhotoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-album-presenter',
|
||||
require('./components/presenter/VideoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/VideoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'mixed-album-presenter',
|
||||
require('./components/presenter/MixedAlbumPresenter.vue').default
|
||||
require('./../components/presenter/MixedAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
|
|
|
|||
10
resources/assets/js/spa.js
vendored
10
resources/assets/js/spa.js
vendored
|
|
@ -60,27 +60,27 @@ Vue.component(
|
|||
|
||||
Vue.component(
|
||||
'photo-presenter',
|
||||
require('./components/presenter/PhotoPresenter.vue').default
|
||||
require('./../components/presenter/PhotoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-presenter',
|
||||
require('./components/presenter/VideoPresenter.vue').default
|
||||
require('./../components/presenter/VideoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'photo-album-presenter',
|
||||
require('./components/presenter/PhotoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/PhotoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-album-presenter',
|
||||
require('./components/presenter/VideoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/VideoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'mixed-album-presenter',
|
||||
require('./components/presenter/MixedAlbumPresenter.vue').default
|
||||
require('./../components/presenter/MixedAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
|
|
|
|||
20
resources/assets/js/status.js
vendored
20
resources/assets/js/status.js
vendored
|
|
@ -1,26 +1,26 @@
|
|||
Vue.component(
|
||||
'photo-presenter',
|
||||
require('./components/presenter/PhotoPresenter.vue').default
|
||||
require('./../components/presenter/PhotoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-presenter',
|
||||
require('./components/presenter/VideoPresenter.vue').default
|
||||
require('./../components/presenter/VideoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'photo-album-presenter',
|
||||
require('./components/presenter/PhotoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/PhotoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-album-presenter',
|
||||
require('./components/presenter/VideoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/VideoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'mixed-album-presenter',
|
||||
require('./components/presenter/MixedAlbumPresenter.vue').default
|
||||
require('./../components/presenter/MixedAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
|
|
@ -32,3 +32,13 @@ Vue.component(
|
|||
'post-component',
|
||||
require('./components/PostComponent.vue').default
|
||||
);
|
||||
|
||||
// Vue.component(
|
||||
// 'post-next',
|
||||
// require('./components/PostNext.vue').default
|
||||
// );
|
||||
|
||||
// Vue.component(
|
||||
// 'video-component',
|
||||
// require('./components/VideoComponent.vue').default
|
||||
// );
|
||||
|
|
|
|||
12
resources/assets/js/timeline.js
vendored
12
resources/assets/js/timeline.js
vendored
|
|
@ -5,27 +5,27 @@ Vue.component(
|
|||
|
||||
Vue.component(
|
||||
'photo-presenter',
|
||||
require('./components/presenter/PhotoPresenter.vue').default
|
||||
require('./../components/presenter/PhotoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-presenter',
|
||||
require('./components/presenter/VideoPresenter.vue').default
|
||||
require('./../components/presenter/VideoPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'photo-album-presenter',
|
||||
require('./components/presenter/PhotoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/PhotoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'video-album-presenter',
|
||||
require('./components/presenter/VideoAlbumPresenter.vue').default
|
||||
require('./../components/presenter/VideoAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
'mixed-album-presenter',
|
||||
require('./components/presenter/MixedAlbumPresenter.vue').default
|
||||
require('./../components/presenter/MixedAlbumPresenter.vue').default
|
||||
);
|
||||
|
||||
Vue.component(
|
||||
|
|
@ -46,4 +46,4 @@ Vue.component(
|
|||
Vue.component(
|
||||
'story-component',
|
||||
require('./components/StoryTimelineComponent.vue').default
|
||||
);
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,118 +1,108 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{{ app()->getLocale() }}">
|
||||
<head>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
|
||||
<title>{{ $title ?? config('app.name', 'Pixelfed') }}</title>
|
||||
|
||||
<title>{{ $title ?? config_cache('app.name', 'Pixelfed') }}</title>
|
||||
<meta property="og:site_name" content="{{ config_cache('app.name', 'pixelfed') }}">
|
||||
<meta property="og:title" content="{{ $title ?? config_cache('app.name', 'pixelfed') }}">
|
||||
<meta property="og:type" content="article">
|
||||
<meta property="og:type" content="profile">
|
||||
<meta property="og:url" content="{{$profile['url']}}">
|
||||
<meta name="medium" content="image">
|
||||
<meta name="theme-color" content="#10c5f8">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<link rel="shortcut icon" type="image/png" href="{{url('/img/favicon.png?v=2')}}">
|
||||
<link rel="apple-touch-icon" type="image/png" href="{{url('/img/favicon.png?v=2')}}">
|
||||
<link href="{{ mix('css/app.css') }}" rel="stylesheet">
|
||||
<style type="text/css">
|
||||
body.embed-card {
|
||||
background: #fff !important;
|
||||
margin: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.status-card-embed {
|
||||
box-shadow: none;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<style>.btn,img{vertical-align:middle}.btn,a{background-color:transparent}.btn:hover,a{text-decoration:none}.card,.col-4,.info-overlay,.square{position:relative}*,::after,::before{box-sizing:border-box}p{margin-top:0;margin-bottom:1rem}a{color:#2c78bf}a:hover{color:#1e5181;text-decoration:underline}img{border-style:none}.small{font-size:.875em;font-weight:400}.btn,body{font-size:.9rem;font-weight:400;line-height:1.6;color:#212529}.row{display:flex;flex-wrap:wrap;margin-right:-15px;margin-left:-15px}.col-4{width:100%;padding-right:15px;padding-left:15px;flex:0 0 33.33333333%;max-width:33.33333333%}.btn{display:inline-block;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:1px solid transparent;padding:.375rem .75rem;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.card,body{display:flex}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn:hover{color:#212529}.btn:focus{outline:0;box-shadow:0 0 0 .2rem rgba(44,120,191,.25)}.btn-primary:focus,.btn-primary:not(:disabled):not(.disabled):active:focus{box-shadow:0 0 0 .2rem rgba(76,140,201,.5)}.btn:disabled{opacity:.65}.btn:not(:disabled):not(.disabled){cursor:pointer}.btn-primary,.btn-primary:disabled{color:#fff;background-color:#2c78bf;border-color:#2c78bf}.btn-primary:focus,.btn-primary:hover{background-color:#2564a0;border-color:#225e96;color:#fff}.btn-primary:not(:disabled):not(.disabled):active{color:#fff;background-color:#225e96;border-color:#20578b}.btn-sm{padding:.25rem .5rem;font-size:.7875rem;line-height:1.5;border-radius:.2rem}.card{flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid rgba(0,0,0,.125);border-radius:.25rem}.card-body{flex:1 1 auto;min-height:1px;padding:1.25rem}.card-footer,.card-header{padding:.75rem 1.25rem;background-color:#fff}.card-header{margin-bottom:0;border-bottom:1px solid rgba(0,0,0,.125)}.card-header:first-child{border-radius:calc(.25rem - 1px) calc(.25rem - 1px) 0 0}.card-footer{border-top:1px solid rgba(0,0,0,.125)}.card-footer:last-child{border-radius:0 0 calc(.25rem - 1px) calc(.25rem - 1px)}.bg-white{background-color:#fff!important}.border{border:1px solid #dee2e6!important}.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}.justify-content-between{justify-content:space-between!important}.align-items-center{align-items:center!important}.shadow-none{box-shadow:none!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-4{margin-top:1.5rem!important}.px-0{padding-right:0!important;padding-left:0!important}.py-1{padding-top:.25rem!important}.pr-1,.px-1{padding-right:.25rem!important}.pb-1,.py-1{padding-bottom:.25rem!important}.px-1{padding-left:.25rem!important}.pl-2{padding-left:.5rem!important}.px-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.text-center{text-align:center!important}.text-uppercase{text-transform:uppercase!important}.font-weight-bold{font-weight:700!important}a.text-dark:focus,a.text-dark:hover{color:#000!important}a.text-muted:focus,a.text-muted:hover{color:#454b50!important}.text-muted{color:#6c757d!important}@media print{*,::after,::before{text-shadow:none!important;box-shadow:none!important}a:not(.btn){text-decoration:underline}img{page-break-inside:avoid}p{orphans:3;widows:3}body{min-width:992px!important}}body{margin:0;text-align:left;background-color:rgba(247,251,253,.4705882353);min-height:100vh;flex-flow:column;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}.text-dark{color:#212529!important}.square{width:100%}.square::after{content:"";display:block;padding-bottom:100%}.square-content{position:absolute;width:100%;height:100%;background-repeat:no-repeat;background-size:cover;background-position:50%}@media (max-width:576px){.card-md-border-0{border-width:0!important;border-radius:0!important}.card-md-rounded-0{border-width:1px 0;border-radius:0!important}}.card{box-shadow:0 2px 6px 0 hsla(0,0%,0%,.2);border:none}body.embed-card{background:#fff!important;margin:0;padding-bottom:0}.status-card-embed{box-shadow:none;border-radius:4px;overflow:hidden}.avatar{border-radius:100%}</style>
|
||||
</head>
|
||||
<body class="bg-white">
|
||||
<div class="embed-card">
|
||||
<div class="card status-card-embed card-md-rounded-0 border">
|
||||
<div class="card-header d-inline-flex align-items-center justify-content-between bg-white">
|
||||
<div>
|
||||
<img src="{{$profile['avatar']}}" width="32px" height="32px" style="border-radius: 32px;">
|
||||
<a class="username font-weight-bold pl-2 text-dark" target="_blank" href="{{$profile['url']}}">
|
||||
{{$profile['username']}}
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<a class="small font-weight-bold text-muted pr-1" href="{{config('app.url')}}" target="_blank">{{config('pixelfed.domain.app')}}</a>
|
||||
<img src="/img/pixelfed-icon-color.svg" width="26px">
|
||||
<div class="embed-card">
|
||||
<div class="card status-card-embed card-md-rounded-0 border">
|
||||
<div class="card-header d-inline-flex align-items-center justify-content-between bg-white">
|
||||
<div>
|
||||
<img src="{{$profile['avatar']}}" width="32" height="32" class="avatar" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';">
|
||||
<a class="username font-weight-bold pl-2 text-dark" target="_blank" href="{{$profile['url']}}">
|
||||
{{$profile['username']}}
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<a class="small font-weight-bold text-muted pr-1" href="{{config('app.url')}}" target="_blank">{{config('pixelfed.domain.app')}}</a>
|
||||
<img src="/img/pixelfed-icon-color.svg" width="26" height="26">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-1">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="text-center">
|
||||
<p class="mb-0 font-weight-bold prettyCount" data-count="{{$profile['statuses_count']}}"></p>
|
||||
<p class="mb-0 text-muted text-uppercase small font-weight-bold">Posts</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="mb-0 font-weight-bold prettyCount" data-count="{{$profile['followers_count']}}"></p>
|
||||
<p class="mb-0 text-muted text-uppercase small font-weight-bold">Followers</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="mb-0"><a href="{{config('app.url')}}/i/intent/follow?user={{$profile['username']}}" class="btn btn-primary btn-sm py-1 px-4 text-uppercase font-weight-bold" target="_blank">Follow</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4 mb-1 embed-row"></div>
|
||||
</div>
|
||||
<div class="card-footer bg-white">
|
||||
<p class="text-center mb-0">
|
||||
<a href="{{$profile['url']}}" class="font-weight-bold" target="_blank">View More Posts</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body pb-1">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="text-center">
|
||||
<p class="mb-0 font-weight-bold prettyCount" data-count="{{$profile['statuses_count']}}"></p>
|
||||
<p class="mb-0 text-muted text-uppercase small font-weight-bold">Posts</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="mb-0 font-weight-bold prettyCount" data-count="{{$profile['followers_count']}}"></p>
|
||||
<p class="mb-0 text-muted text-uppercase small font-weight-bold">Followers</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="mb-0"><a href="/i/intent/follow?user={{$profile['username']}}" class="btn btn-primary btn-sm py-1 px-4 text-uppercase font-weight-bold" target="_blank">Follow</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4 mb-1 embed-row"></div>
|
||||
</div>
|
||||
<div class="card-footer bg-white">
|
||||
<p class="text-center mb-0">
|
||||
<a href="{{$profile['url']}}" class="font-weight-bold" target="_blank">View More Posts</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="{{mix('js/manifest.js')}}"></script>
|
||||
<script type="text/javascript" src="{{mix('js/vendor.js')}}"></script>
|
||||
<script type="text/javascript" src="{{mix('js/app.js')}}"></script>
|
||||
<script type="text/javascript">
|
||||
window.addEventListener("message", e=>{const t=e.data||{};});
|
||||
</script>
|
||||
<script type="text/javascript">document.querySelectorAll('.caption-container a').forEach(function(i) {i.setAttribute('target', '_blank');});</script>
|
||||
<script type="text/javascript">
|
||||
document.querySelectorAll('.prettyCount').forEach(function(i) {
|
||||
i.innerText = App.util.format.count(i.getAttribute('data-count'));
|
||||
});
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
axios.get('/api/pixelfed/v1/accounts/{{$profile['id']}}/statuses', {
|
||||
params: {
|
||||
only_media: true,
|
||||
limit: 24
|
||||
}
|
||||
})
|
||||
.then(res => {
|
||||
let parent = $('.embed-row');
|
||||
res.data
|
||||
.filter(res => res.pf_type == 'photo')
|
||||
.filter(res => !res.sensitive)
|
||||
.slice(0, 9)
|
||||
.forEach(post => {
|
||||
let el = `<div class="col-4 mt-2 px-0">
|
||||
<a class="card info-overlay card-md-border-0 px-1 shadow-none" href="${post.url}" target="_blank">
|
||||
<div class="square">
|
||||
<div class="square-content" style="background-image: url('${post.media_attachments[0].url}')">
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>`;
|
||||
parent.append(el);
|
||||
})
|
||||
})
|
||||
.finally(() => {
|
||||
window.parent.postMessage({type:"setHeight",id:0,height:document.getElementsByTagName("html")[0].scrollHeight},"*");
|
||||
setTimeout(() => {
|
||||
window.parent.postMessage({type:"setHeight",id:0,height:document.getElementsByTagName("html")[0].scrollHeight},"*");
|
||||
}, 5000);
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
window.addEventListener("message", e=>{const t=e.data||{};});
|
||||
document.querySelectorAll('.caption-container a').forEach(function(i) {i.setAttribute('target', '_blank');});
|
||||
function formatCount(count = 0, locale = 'en-GB', notation = 'compact') {
|
||||
if(count < 1) {
|
||||
return 0;
|
||||
}
|
||||
return new Intl.NumberFormat(locale, { notation: notation , compactDisplay: "short" }).format(count);
|
||||
}
|
||||
function generateElements(html) {
|
||||
const template = document.createElement('template');
|
||||
template.innerHTML = html.trim();
|
||||
return template.content.children;
|
||||
}
|
||||
document.querySelectorAll('.prettyCount').forEach(function(i) {
|
||||
i.innerText = formatCount(i.getAttribute('data-count'));
|
||||
});
|
||||
fetch("{{config('app.url')}}/api/pixelfed/v1/accounts/{{$profile['id']}}/statuses?only_media=true&limit=24")
|
||||
.then(res => res.json())
|
||||
.then(res => {
|
||||
let parent = document.querySelector('.embed-row');
|
||||
res.filter(post => post.pf_type == 'photo' && !post.sensitive && post.visibility === 'public')
|
||||
.slice(0, 9)
|
||||
.forEach((post, idx) => {
|
||||
let mediaUrl = post.media_attachments[0].preview_url ? post.media_attachments[0].preview_url : post.media_attachments[0].url;
|
||||
let html = `<div class="col-4 mt-2 px-0"><a class="card info-overlay card-md-border-0 px-1 shadow-none" href="${post.url}" target="_blank"><div class="square"><div class="square-content" style="background-image: url('${mediaUrl}')"></div></div></a></div>`;
|
||||
let el = document.createElement('div');
|
||||
el.innerHTML = html;
|
||||
parent.appendChild(el.firstChild);
|
||||
});
|
||||
})
|
||||
window.addEventListener("message", e => {
|
||||
const t = e.data || {};
|
||||
if (window.parent && t.type === 'setHeight') {
|
||||
updateHeight(t.id)
|
||||
}
|
||||
});
|
||||
|
||||
function updateHeight(id) {
|
||||
setTimeout(() => {
|
||||
window.parent.postMessage({
|
||||
type: 'setHeight',
|
||||
id: id,
|
||||
height: document.documentElement.scrollHeight
|
||||
}, "*");
|
||||
}, 2500)
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,172 +1,72 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{{ app()->getLocale() }}">
|
||||
<html lang="en">
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
|
||||
<title>{{ $title ?? config('app.name', 'Pixelfed') }}</title>
|
||||
|
||||
<meta property="og:site_name" content="{{ config('app.name', 'pixelfed') }}">
|
||||
<meta property="og:title" content="{{ $title ?? config('app.name', 'pixelfed') }}">
|
||||
<meta property="og:type" content="article">
|
||||
<meta property="og:url" content="{{$status->url()}}">
|
||||
<meta name="medium" content="image">
|
||||
<meta name="theme-color" content="#10c5f8">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<link rel="shortcut icon" type="image/png" href="/img/favicon.png?v=2">
|
||||
<link rel="apple-touch-icon" type="image/png" href="/img/favicon.png?v=2">
|
||||
<link href="{{ mix('css/app.css') }}" rel="stylesheet">
|
||||
<style type="text/css">
|
||||
body.embed-card {
|
||||
background: #fff !important;
|
||||
margin: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.status-card-embed {
|
||||
box-shadow: none;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<title>{{ $title ?? config_cache('app.name', 'Pixelfed') }}</title>
|
||||
<meta property="og:site_name" content="{{ config_cache('app.name', 'pixelfed') }}">
|
||||
<meta property="og:title" content="{{ $title ?? config_cache('app.name', 'pixelfed') }}">
|
||||
<meta property="og:type" content="article">
|
||||
<meta property="og:url" content="{{$status['url']}}">
|
||||
<meta name="medium" content="image">
|
||||
<meta name="theme-color" content="#10c5f8">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<link rel="shortcut icon" type="image/png" href="/img/favicon.png?v=2">
|
||||
<link rel="apple-touch-icon" type="image/png" href="/img/favicon.png?v=2">
|
||||
<style type="text/css">hr,p{margin-bottom:1rem}.small,body{font-weight:400}.card,body{display:flex}*,::after,::before{box-sizing:border-box}p{margin-top:0}a{color:#2c78bf;text-decoration:none;background-color:transparent}a:hover{color:#1e5181;text-decoration:underline}img{vertical-align:middle;border-style:none}hr{box-sizing:content-box;height:0;overflow:visible;margin-top:1rem;border:0;border-top:1px solid rgba(0,0,0,.1)}.small{font-size:.875em}.card{position:relative;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid rgba(0,0,0,.125);border-radius:.25rem}.card-body{flex:1 1 auto;min-height:1px;padding:1.25rem}.card-footer,.card-header{padding:.75rem 1.25rem;background-color:#fff}.card-header{margin-bottom:0;border-bottom:1px solid rgba(0,0,0,.125)}.card-header:first-child{border-radius:calc(.25rem - 1px) calc(.25rem - 1px) 0 0}.card-footer{border-top:1px solid rgba(0,0,0,.125)}.card-footer:last-child{border-radius:0 0 calc(.25rem - 1px) calc(.25rem - 1px)}.bg-white{background-color:#fff!important}.border{border:1px solid #dee2e6!important}.d-inline-flex{display:inline-flex!important}.justify-content-between{justify-content:space-between!important}.align-items-center{align-items:center!important}.my-0{margin-top:0!important}.mb-0,.my-0{margin-bottom:0!important}.mb-2{margin-bottom:.5rem!important}.pr-1{padding-right:.25rem!important}.pl-2{padding-left:.5rem!important}.text-uppercase{text-transform:uppercase!important}.font-weight-bold{font-weight:700!important}a.text-dark:focus,a.text-dark:hover{color:#000!important}a.text-muted:focus,a.text-muted:hover{color:#454b50!important}.text-muted{color:#6c757d!important}@media print{*,::after,::before{text-shadow:none!important;box-shadow:none!important}a:not(.btn){text-decoration:underline}img{page-break-inside:avoid}p{orphans:3;widows:3}body{min-width:992px!important}}body{margin:0;font-size:.9rem;line-height:1.6;color:#212529;text-align:left;background-color:rgba(247,251,253,.4705882353);min-height:100vh;flex-flow:column;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}.text-dark{color:#212529!important}@media (max-width:576px){.card-md-rounded-0{border-width:1px 0;border-radius:0!important}}.card{box-shadow:0 2px 6px 0 hsla(0,0%,0%,.2);border:none}.status-card-embed{box-shadow:none;border-radius:4px;overflow:hidden}body.embed-card{background:#fff!important;margin:0;padding-bottom:0}.avatar{border-radius:100%}</style>
|
||||
</head>
|
||||
<body class="bg-white">
|
||||
<div class="embed-card">
|
||||
@php($item = $status)
|
||||
<div class="card status-card-embed card-md-rounded-0 border">
|
||||
<div class="card-header d-inline-flex align-items-center bg-white">
|
||||
<img src="{{$item->profile->avatarUrl()}}" width="32px" height="32px" style="border-radius: 32px;">
|
||||
<a class="username font-weight-bold pl-2 text-dark" target="_blank" href="{{$item->profile->url()}}">
|
||||
{{$item->profile->username}}
|
||||
</a>
|
||||
</div>
|
||||
<a href="{{$status->url()}}" target="_blank">
|
||||
@php($status = $item)
|
||||
@switch($status->viewType())
|
||||
@case('photo')
|
||||
@case('image')
|
||||
@if($status->is_nsfw)
|
||||
<details class="details-animated">
|
||||
<summary>
|
||||
<p class="mb-0 lead font-weight-bold">CW / NSFW / Hidden Media</p>
|
||||
<p class="font-weight-light">(click to show)</p>
|
||||
</summary>
|
||||
<a class="max-hide-overflow {{$status->firstMedia()->filter_class}}" href="{{$status->url()}}" target="_blank">
|
||||
<img class="card-img-top" src="{{$status->mediaUrl()}}">
|
||||
</a>
|
||||
</details>
|
||||
@else
|
||||
<div class="{{$status->firstMedia()->filter_class}}">
|
||||
<img src="{{$status->mediaUrl()}}" width="100%">
|
||||
</div>
|
||||
@endif
|
||||
@break
|
||||
@case('photo:album')
|
||||
<div id="photo-carousel-wrapper-{{$status->id}}" class="carousel slide carousel-fade mb-n3 " data-ride="carousel">
|
||||
<ol class="carousel-indicators">
|
||||
@for($i = 0; $i < $status->media_count; $i++)
|
||||
<li data-target="#photo-carousel-wrapper-{{$status->id}}" data-slide-to="{{$i}}" class="{{$i == 0 ? 'active' : ''}}"></li>
|
||||
@endfor
|
||||
</ol>
|
||||
<div class="carousel-inner">
|
||||
@foreach($status->media()->orderBy('order')->get() as $media)
|
||||
<div class="carousel-item {{$loop->iteration == 1 ? 'active' : ''}}">
|
||||
<figure class="{{$media->filter_class}}">
|
||||
<div class="float-right mr-3 badge badge-dark border border-secondary rounded-pill p-2" style="position:absolute;top:8px;right:0;margin-bottom:-20px;">{{$loop->iteration}}/{{$loop->count}}</div>
|
||||
<img class="d-block w-100" src="{{$media->url()}}" alt="{{$status->caption}}">
|
||||
</figure>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
<a class="carousel-control-prev" href="#photo-carousel-wrapper-{{$status->id}}" role="button" data-slide="prev">
|
||||
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||
<span class="sr-only">Previous</span>
|
||||
</a>
|
||||
<a class="carousel-control-next" href="#photo-carousel-wrapper-{{$status->id}}" role="button" data-slide="next">
|
||||
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||
<span class="sr-only">Next</span>
|
||||
</a>
|
||||
</div>
|
||||
@break
|
||||
@case('video')
|
||||
@if($status->is_nsfw)
|
||||
<details class="details-animated">
|
||||
<summary>
|
||||
<p class="mb-0 lead font-weight-bold">CW / NSFW / Hidden Media</p>
|
||||
<p class="font-weight-light">(click to show)</p>
|
||||
</summary>
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<video class="video" preload="none" controls loop>
|
||||
<source src="{{$status->firstMedia()->url()}}" type="{{$status->firstMedia()->mime}}">
|
||||
</video>
|
||||
</div>
|
||||
</details>
|
||||
@else
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<video class="video" preload="none" controls loop>
|
||||
<source src="{{$status->firstMedia()->url()}}" type="{{$status->firstMedia()->mime}}">
|
||||
</video>
|
||||
</div>
|
||||
@endif
|
||||
@break
|
||||
@case('video-album')
|
||||
@if($status->is_nsfw)
|
||||
<details class="details-animated">
|
||||
<summary>
|
||||
<p class="mb-0 lead font-weight-bold">CW / NSFW / Hidden Media</p>
|
||||
<p class="font-weight-light">(click to show)</p>
|
||||
</summary>
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<video class="video" preload="none" controls loop>
|
||||
<source src="{{$status->firstMedia()->url()}}" type="{{$status->firstMedia()->mime}}">
|
||||
</video>
|
||||
</div>
|
||||
</details>
|
||||
@else
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<video class="video" preload="none" controls loop>
|
||||
<source src="{{$status->firstMedia()->url()}}" type="{{$status->firstMedia()->mime}}">
|
||||
</video>
|
||||
</div>
|
||||
@endif
|
||||
@break
|
||||
@endswitch
|
||||
</a>
|
||||
@if($layout != 'compact')
|
||||
<div class="card-body">
|
||||
<div class="view-more mb-2">
|
||||
<a class="font-weight-bold" href="{{$status->url()}}" target="_blank">View More on Pixelfed</a>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="caption">
|
||||
<p class="my-0">
|
||||
<span class="username font-weight-bold">
|
||||
<bdi><a class="text-dark" href="{{$item->profile->url()}}" target="_blank">{{$item->profile->username}}</a></bdi>
|
||||
</span>
|
||||
@if($showCaption)
|
||||
<span class="caption-container">{!! $item->rendered ?? e($item->caption) !!}</span>
|
||||
@endif
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
<div class="card-footer bg-white d-inline-flex justify-content-between align-items-center">
|
||||
<div class="timestamp">
|
||||
<p class="small text-uppercase mb-0"><a href="{{$item->url()}}" class="text-muted" target="_blank">{{$item->created_at->diffForHumans()}}</a></p>
|
||||
</div>
|
||||
<div>
|
||||
<a class="small font-weight-bold text-muted pr-1" href="{{config('app.url')}}" target="_blank">{{config('pixelfed.domain.app')}}</a>
|
||||
<img src="/img/pixelfed-icon-color.svg" width="26px">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">window.addEventListener("message",e=>{const t=e.data||{};window.parent&&"setHeight"===t.type&&window.parent.postMessage({type:"setHeight",id:t.id,height:document.getElementsByTagName("html")[0].scrollHeight},"*")});</script>
|
||||
<script type="text/javascript">document.querySelectorAll('.caption-container a').forEach(function(i) {i.setAttribute('target', '_blank');});</script>
|
||||
<script type="text/javascript" src="{{ mix('js/manifest.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ mix('js/vendor.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ mix('js/app.js') }}"></script>
|
||||
<div class="embed-card">
|
||||
<div class="card status-card-embed card-md-rounded-0 border">
|
||||
<div class="card-header d-inline-flex align-items-center bg-white">
|
||||
<img src="{{$status['account']['avatar']}}" width="32" height="32" class="avatar" onerror="this.onerror=null;this.src='/storage/avatars/default.jpg';">
|
||||
<a class="username font-weight-bold pl-2 text-dark" target="_blank" rel="ugc" href="{{$status['account']['url']}}">
|
||||
{{$status['account']['username']}}
|
||||
</a>
|
||||
</div>
|
||||
<a href="{{$status['url']}}" target="_blank" rel="ugc">
|
||||
<div>
|
||||
<img src="{{$status['media_attachments'][0]['preview_url'] ?? $status['media_attachments'][0]['url']}}" width="100%">
|
||||
</div>
|
||||
</a>
|
||||
@if($layout != 'compact')
|
||||
<div class="card-body">
|
||||
<div class="view-more mb-2">
|
||||
<a class="font-weight-bold" href="{{$status['url']}}" target="_blank">View More on Pixelfed</a>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="caption">
|
||||
<p class="my-0">
|
||||
<span class="username font-weight-bold">
|
||||
<bdi><a class="text-dark" href="{{$status['account']['url']}}" target="_blank">{{$status['account']['username']}}</a></bdi>
|
||||
</span>
|
||||
@if($showCaption)
|
||||
<span class="caption-container">{{ $status['content_text'] }}</span>
|
||||
@endif
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
<div class="card-footer bg-white d-inline-flex justify-content-between align-items-center">
|
||||
<div class="timestamp">
|
||||
<p class="small text-uppercase mb-0">
|
||||
<a href="{{$status['url']}}" class="text-muted" target="_blank" rel="ugc">
|
||||
{{now()->parse($status['created_at'])->diffForHumans()}}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<a class="small font-weight-bold text-muted pr-1" href="{{config('app.url')}}" target="_blank">{{config('pixelfed.domain.app')}}</a>
|
||||
<img src="/img/pixelfed-icon-color.svg" width="26" height="26" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
window.addEventListener("message",e=>{const t=e.data||{};window.parent&&"setHeight"===t.type&&window.parent.postMessage({type:"setHeight",id:t.id,height:document.getElementsByTagName("html")[0].scrollHeight},"*")});
|
||||
document.querySelectorAll('.caption-container a').forEach(function(i) {i.setAttribute('target', '_blank');});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
54
webpack.mix.js
vendored
54
webpack.mix.js
vendored
|
|
@ -1,8 +1,10 @@
|
|||
let mix = require('laravel-mix');
|
||||
const fs = require("fs");
|
||||
const path = require("path");
|
||||
|
||||
mix.before(() => {
|
||||
fs.rmSync('public/js', { recursive: true, force: true });
|
||||
fs.rmSync('public/css', { recursive: true, force: true });
|
||||
fs.rmSync('public/js', { recursive: true, force: true });
|
||||
});
|
||||
|
||||
|
||||
|
|
@ -46,31 +48,35 @@ mix.version();
|
|||
const TerserPlugin = require('terser-webpack-plugin');
|
||||
|
||||
mix.options({
|
||||
processCssUrls: false,
|
||||
terser: {
|
||||
parallel: true,
|
||||
terserOptions: {
|
||||
compress: true,
|
||||
output: {
|
||||
comments: false
|
||||
}
|
||||
}
|
||||
}
|
||||
processCssUrls: false,
|
||||
terser: {
|
||||
parallel: true,
|
||||
terserOptions: {
|
||||
compress: true,
|
||||
output: {
|
||||
comments: false
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
mix.alias({
|
||||
'@': path.join(__dirname, 'resources/assets/components'),
|
||||
'~': path.join(__dirname, 'resources/assets/js/components'),
|
||||
});
|
||||
mix.webpackConfig({
|
||||
optimization: {
|
||||
providedExports: false,
|
||||
sideEffects: false,
|
||||
usedExports: false,
|
||||
minimize: true,
|
||||
minimizer: [ new TerserPlugin({
|
||||
extractComments: false,
|
||||
})]
|
||||
},
|
||||
output: {
|
||||
chunkFilename: 'js/[name].[chunkhash].js',
|
||||
}
|
||||
optimization: {
|
||||
providedExports: false,
|
||||
sideEffects: false,
|
||||
usedExports: false,
|
||||
minimize: true,
|
||||
minimizer: [ new TerserPlugin({
|
||||
extractComments: false,
|
||||
})]
|
||||
},
|
||||
output: {
|
||||
chunkFilename: 'js/[name].[chunkhash].js',
|
||||
}
|
||||
});
|
||||
mix.autoload({
|
||||
jquery: ['$', 'jQuery', 'window.jQuery']
|
||||
jquery: ['$', 'jQuery', 'window.jQuery']
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue