Add Profile Embeds

This commit is contained in:
Daniel Supernault 2019-12-04 21:21:08 -07:00
parent b793f9c4bb
commit fb7a3cf0e4
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7
4 changed files with 174 additions and 0 deletions

View file

@ -5,6 +5,7 @@ namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Auth;
use Cache;
use View;
use App\Follower;
use App\FollowRequest;
use App\Profile;
@ -189,4 +190,29 @@ class ProfileController extends Controller
abort_if(!Auth::check(), 404);
return redirect(Auth::user()->url());
}
public function embed(Request $request, $username)
{
$res = view('profile.embed-removed');
if(strlen($username) > 15 || strlen($username) < 2) {
return response($res)->withHeaders(['X-Frame-Options' => 'ALLOWALL']);
}
$profile = Profile::whereUsername($username)
->whereIsPrivate(false)
->whereNull('status')
->whereNull('domain')
->first();
if(!$profile) {
return response($res)->withHeaders(['X-Frame-Options' => 'ALLOWALL']);
}
$content = Cache::remember('profile:embed:'.$profile->id, now()->addHours(12), function() use($profile) {
return View::make('profile.embed')->with(compact('profile'))->render();
});
return response($content)->withHeaders(['X-Frame-Options' => 'ALLOWALL']);
}
}

View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<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>Pixelfed | 404 Embed Not Found</title>
<meta property="og:site_name" content="{{ config('app.name', 'pixelfed') }}">
<meta property="og:title" content="{{ $title ?? config('app.name', 'pixelfed') }}">
<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>
</head>
<body class="bg-white">
<div class="embed-card">
<div class="card status-card-embed card-md-rounded-0 border card-body border shadow-none rounded-0 d-flex justify-content-center align-items-center">
<div class="text-center p-5">
<img src="/img/pixelfed-icon-color.svg" width="40px" height="40px">
<p class="h2 py-3 font-weight-bold">Pixelfed</p>
<p style="font-size:14px;font-weight: 500;" class="px-2 py-4">Cannot display profile embed, it may be deleted or set to private.</p>
<p><a href="{{config('app.url')}}" class="font-weight-bold" target="_blank">Visit Pixelfed</a></p>
</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>
</body>
</html>

View file

@ -0,0 +1,101 @@
<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<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="{{$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="/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>
</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->avatarUrl()}}" width="32px" height="32px" target="_blank" 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>
</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">{{$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">{{$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 font-weight-bold prettyCount">{{$profile->following()->count()}}</p>
<p class="mb-0 text-muted text-uppercase small font-weight-bold">Following</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">
@foreach($profile->statuses()->latest()->whereScope('public')->whereIsNsfw(false)->has('media')->whereType('photo')->take(9)->get() as $post)
<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->thumb()}}')">
</div>
<div class="info-overlay-text">
</div>
</div>
</a>
</div>
@endforeach
</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||{};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">
document.querySelectorAll('.prettyCount').forEach(function(i) {
i.innerText = App.util.format.count(i.innerText);
});
</script>
</body>
</html>

View file

@ -382,5 +382,6 @@ Route::domain(config('pixelfed.domain.app'))->middleware(['validemail', 'twofact
Route::post('p/{username}/{id}/edit', 'StatusController@editStore');
Route::get('p/{username}/{id}.json', 'StatusController@showObject');
Route::get('p/{username}/{id}', 'StatusController@show');
Route::get('{username}/embed', 'ProfileController@embed');
Route::get('{username}', 'ProfileController@show');
});