Templates based on classes, cache custom paths

This commit is contained in:
Pablo Ferreiro 2022-01-25 17:20:11 +01:00
parent dde4185ad7
commit 6d6ec109ca
No known key found for this signature in database
GPG key ID: 41FBCE65B779FA24
26 changed files with 236 additions and 156 deletions

View file

@ -1,7 +1,7 @@
{layout '../layouts/default.latte'}
{block header}
<p class="title">About</p>
<p class="title">About</p>
{/block}
{block content}

View file

@ -1,9 +1,9 @@
{layout '../layouts/hero.latte'}
{block content}
<p class="title">There was an error processing your request!</p>
<p class="subtitle">HTTP Code: {$error->http_code}</p>
{if $error->tiktok_code}
<p class="subtitle">API error code {$error->tiktok_code} ({$error->tiktok_msg})</p>
{/if}
<p class="title">There was an error processing your request!</p>
<p class="subtitle">HTTP Code: {$error->http_code}</p>
{if $error->tiktok_code}
<p class="subtitle">API error code {$error->tiktok_code} ({$error->tiktok_msg})</p>
{/if}
{/block}

View file

@ -1,7 +1,7 @@
{layout '../layouts/default.latte'}
{block header}
<p class="title">Following</p>
<p class="title">Following</p>
{/block}
{block content}

View file

@ -1,58 +1,58 @@
{layout '../layouts/hero.latte'}
{block content}
<p class="title">Welcome to ProxiTok!</p>
<p class="subtitle">An alternative open source frontend for TikTok</p>
<p>Search user:</p>
<form id="username_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="username" class="input" type="text" placeholder="Type username" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Search video by id:</p>
<form id="video_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="video_id" class="input" type="text" placeholder="Type video ID" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Search tag:</p>
<form id="tag_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="tag" class="input" type="text" placeholder="Type tag" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Search music videos by id:</p>
<form id="music_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="music_id" class="input" type="text" placeholder="Type music id" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Trending:</p>
<a class="button is-success" href="./trending">Go</a>
<p class="title">Welcome to ProxiTok!</p>
<p class="subtitle">An alternative open source frontend for TikTok</p>
<p>Search user:</p>
<form id="username_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="username" class="input" type="text" placeholder="Type username" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Search video by id:</p>
<form id="video_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="video_id" class="input" type="text" placeholder="Type video ID" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Search tag:</p>
<form id="tag_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="tag" class="input" type="text" placeholder="Type tag" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Search music videos by id:</p>
<form id="music_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="music_id" class="input" type="text" placeholder="Type music id" required />
</div>
<div class="control">
<button class="button is-success" type="submit">Go</button>
</div>
</div>
</form>
<hr />
<p>Trending:</p>
<a class="button is-success" href="./trending">Go</a>
{/block}
{block extra}

View file

@ -0,0 +1,14 @@
<?php
namespace Views\Models;
/**
* Base for all templates, needs a Title to set
*/
class BaseTemplate {
public string $title;
public string $version;
function __construct(string $title) {
$this->title = $title;
}
}

View file

@ -0,0 +1,14 @@
<?php
namespace Views\Models;
/**
* Base for templates with a feed
*/
class FeedTemplate extends BaseTemplate {
public object $feed;
function __construct(string $title, object $feed) {
parent::__construct($title);
$this->feed = $feed;
}
}

View file

@ -0,0 +1,14 @@
<?php
namespace Views\Models;
/**
* Exclusive for /following
*/
class FollowingTemplate extends FeedTemplate {
public array $following;
function __construct(array $following, object $feed) {
parent::__construct('Following', $feed);
$this->following = $following;
}
}

View file

@ -0,0 +1,14 @@
<?php
namespace Views\Models;
/**
* Base for templates with item (only /video at the time)
*/
class ItemTemplate extends BaseTemplate {
public object $item;
function __construct(string $title, object $item) {
parent::__construct($title);
$this->item = $item;
}
}

View file

@ -0,0 +1,19 @@
<?php
namespace Views\Models;
use \Helpers\Following;
use \Helpers\Settings;
/**
* Exclusive for /settings
*/
class SettingsTemplate extends BaseTemplate {
public array $proxy_elements = [];
public array $following = [];
function __construct() {
parent::__construct('Settings');
$this->proxy_elements = Settings::PROXY;
$this->following = Following::get();
}
}

View file

@ -1,9 +1,9 @@
{layout '../layouts/default.latte'}
{block header}
<p class="title">{$feed->info->detail->music->title}</p>
<p class="subtitle">{$feed->info->detail->music->desc}</p>
<p>Videos: {number($feed->info->detail->stats->videoCount)}</p>
<p class="title">{$feed->info->detail->music->title}</p>
<p class="subtitle">{$feed->info->detail->music->desc}</p>
<p>Videos: {number($feed->info->detail->stats->videoCount)}</p>
{/block}
{block content}

View file

@ -1,15 +1,15 @@
{layout '../layouts/default.latte'}
{block header}
<p class="title">Settings</p>
<p class="title">Settings</p>
{/block}
{block content}
<!-- Proxy settings -->
<p class="title">Proxy</p>
{include '../components/settings/proxy.latte'}
<hr />
<!-- Following -->
<p class="title">Following</p>
{include '../components/settings/following.latte'}
<!-- Proxy settings -->
<p class="title">Proxy</p>
{include '../components/settings/proxy.latte'}
<hr />
<!-- Following -->
<p class="title">Following</p>
{include '../components/settings/following.latte'}
{/block}

View file

@ -1,9 +1,9 @@
{layout '../layouts/default.latte'}
{block header}
<p class="title">{$feed->info->detail->challenge->title}</p>
<p class="subtitle">{$feed->info->detail->challenge->desc}</p>
<p>Videos: {number($feed->info->detail->stats->videoCount)} / Views: {number($feed->info->detail->stats->viewCount)}</p>
<p class="title">{$feed->info->detail->challenge->title}</p>
<p class="subtitle">{$feed->info->detail->challenge->desc}</p>
<p>Videos: {number($feed->info->detail->stats->videoCount)} / Views: {number($feed->info->detail->stats->viewCount)}</p>
{/block}
{block content}

View file

@ -1,7 +1,7 @@
{layout '../layouts/default.latte'}
{block header}
<p class="title">Trending</p>
<p class="title">Trending</p>
{/block}
{block content}

View file

@ -1,13 +1,13 @@
{layout '../layouts/default.latte'}
{block header}
<figure class="figure is-96x96">
<img src="{path('stream?url=' . urlencode($feed->info->detail->user->avatarThumb))}" />
</figure>
<p class="title">{$feed->info->detail->user->uniqueId}'s profile</p>
<p class="subtitle">{$feed->info->detail->user->signature}</p>
<p>Following: {number($feed->info->detail->stats->followingCount)} / Followers: {number($feed->info->detail->stats->followerCount)}</p>
<p>Hearts: {number($feed->info->detail->stats->heartCount)} / Videos: {$feed->info->detail->stats->videoCount}</p>
<figure class="figure is-96x96">
<img src="{path('stream?url=' . urlencode($feed->info->detail->user->avatarThumb))}" />
</figure>
<p class="title">{$feed->info->detail->user->uniqueId}'s profile</p>
<p class="subtitle">{$feed->info->detail->user->signature}</p>
<p>Following: {number($feed->info->detail->stats->followingCount)} / Followers: {number($feed->info->detail->stats->followerCount)}</p>
<p>Hearts: {number($feed->info->detail->stats->heartCount)} / Videos: {$feed->info->detail->stats->videoCount}</p>
{/block}
{block content}

View file

@ -1,21 +1,21 @@
{layout '../layouts/hero.latte'}
{block content}
<div class="columns is-centered is-vcentered">
<div class="column">
<video autoplay controls src="{path('stream?url=' . urlencode($item->items[0]->video->playAddr))}"></video>
</div>
<div class="column has-text-centered">
<div class="box">
<p class="title">Video by <a href="{path('@'.$item->info->detail->user->uniqueId)}">{$item->info->detail->user->uniqueId}</a></p>
<p class="subtitle">{$item->items[0]->desc}</p>
<p>Played {number($item->info->detail->stats->playCount)} times</p>
<p>Shared {number($item->info->detail->stats->shareCount)} times / {number($item->info->detail->stats->commentCount)} comments</p>
<hr />
<a href="{path('stream?url=' . urlencode($item->items[0]->video->playAddr) . '&download=1')}" class="button is-info">Download video</a>
<p>{$item->items[0]->music->title}</p>
<audio src="{path('stream?url=' . urlencode($item->items[0]->music->playUrl))}" controls preload="none"></audio>
<div class="columns is-centered is-vcentered">
<div class="column">
<video autoplay controls src="{path('stream?url=' . urlencode($item->items[0]->video->playAddr))}"></video>
</div>
<div class="column has-text-centered">
<div class="box">
<p class="title">Video by <a href="{path('@'.$item->info->detail->user->uniqueId)}">{$item->info->detail->user->uniqueId}</a></p>
<p class="subtitle">{$item->items[0]->desc}</p>
<p>Played {number($item->info->detail->stats->playCount)} times</p>
<p>Shared {number($item->info->detail->stats->shareCount)} times / {number($item->info->detail->stats->commentCount)} comments</p>
<hr />
<a href="{path('stream?url=' . urlencode($item->items[0]->video->playAddr) . '&download=1')}" class="button is-info">Download video</a>
<p>{$item->items[0]->music->title}</p>
<audio src="{path('stream?url=' . urlencode($item->items[0]->music->playUrl))}" controls preload="none"></audio>
</div>
</div>
</div>
</div>
{/block}