Split HTML head, PHP, added searching tags

This commit is contained in:
Pablo Ferreiro 2022-01-03 16:11:24 +01:00
parent 477efe8486
commit 340f500206
No known key found for this signature in database
GPG key ID: 41FBCE65B779FA24
17 changed files with 262 additions and 216 deletions

View file

@ -1,14 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>About - TikTok</title>
<link rel="stylesheet" href="https://unpkg.com/bulmaswatch/superhero/bulmaswatch.min.css">
</head>
{include 'components/head.latte', title: 'About'}
<body>
{include 'navbar.latte'}
{include 'components/navbar.latte'}
<section class="hero is-primary">
<div class="hero-body">
<div class="container">
@ -19,6 +15,6 @@
<section class="section">
<p>TODO</p>
</section>
{include 'footer.latte'}
{include 'components/footer.latte'}
</body>
</html>

View file

@ -1,16 +1,17 @@
<link rel="stylesheet" href="{assets('feed.css', 'styles')}">
<section class="section">
<div class="columns is-multiline is-vcentered">
{foreach $feed->items as $item}
<div class="column is-one-quarter">
<a id="{$item->id}" href="#{$item->id}" class="clickable-img"
data-video_url="./stream?url={$item->video->playAddr}"
data-video_download="./stream?url={urlencode($item->video->downloadAddr)}&download=1"
data-video_url="{path('stream?url=' . urlencode($item->video->playAddr))}"
data-video_download="{path('stream?url=' . urlencode($item->video->playAddr) . '&download=1')}"
data-desc="{$item->desc}"
data-video_width="{$item->video->width}"
data-video_height="{$item->video->height}"
data-music_title="{$item->music->title}"
data-music_url="./audios?url={urlencode($item->music->playUrl)}">
<img loading="lazy" src="./images?url={urlencode($item->video->originCover)}"/>
data-music_url="{path('audios?url=' . urlencode($item->music->playUrl))}">
<img loading="lazy" src="{path('images?url=' . urlencode($item->video->originCover))}"/>
</a>
</div>
{/foreach}

View file

@ -0,0 +1,7 @@
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/bulmaswatch/superhero/bulmaswatch.min.css">
<title>{$title} - Tiktok Viewer</title>
</head>

View file

@ -9,7 +9,7 @@
<div id="navbar-menu" class="navbar-menu">
<div class="navbar-start">
<a href="{path('home')}" class="navbar-item">Home</a>
<a href="{path('')}" class="navbar-item">Home</a>
<a href="{path('settings')}" class="navbar-item">Settings</a>
</div>
</div>

View file

@ -1,16 +1,10 @@
<!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.0">
<link rel="stylesheet" href="https://unpkg.com/bulmaswatch/superhero/bulmaswatch.min.css">
<title>Tiktok Viewer</title>
</head>
{include 'components/head.latte', title: 'Home'}
<body>
{include 'navbar.latte'}
{include 'components/navbar.latte'}
<section class="hero is-fullheight-with-navbar">
<div class="hero-body">
<div class="container has-text-centered">
@ -20,7 +14,19 @@
<form id="username_form">
<div class="field has-addons has-addons-centered">
<div class="control">
<input name="username" class="input" placeholder="Type username" required />
<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 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>
@ -33,18 +39,10 @@
</div>
</div>
<div class="hero-foot">
{include 'footer.latte'}
{include 'components/footer.latte'}
</div>
</section>
<script n:syntax=off>
const goToUser = (e) => {
e.preventDefault()
const formData = new FormData(e.target)
const username = formData.get('username')
window.location.href = `./@${username}`
}
document.getElementById('username_form').addEventListener('submit', goToUser, false)
</script>
<script src="{assets('home.js', 'scripts')}"></script>
</body>
</html>

View file

@ -1,14 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Settings - TikTok</title>
<link rel="stylesheet" href="https://unpkg.com/bulmaswatch/superhero/bulmaswatch.min.css">
</head>
{include 'components/head.latte', title: 'Settings'}
<body>
{include 'navbar.latte'}
{include 'components/navbar.latte'}
<section class="hero is-primary">
<div class="hero-body">
<div class="container">
@ -35,6 +31,6 @@
</div>
</form>
</section>
{include 'footer.latte'}
{include 'components/footer.latte'}
</body>
</html>

19
views/tag.latte Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
{include 'components/head.latte', title: 'Challenge'}
<body>
{include 'components/navbar.latte'}
<section class="hero is-primary">
<div class="hero-body">
<div class="container">
<p class="title">{$feed->info->detail->challenge->title}</p>
<p class="subtitle">{$feed->info->detail->challenge->desc}</p>
</div>
</div>
</section>
{include 'components/feed.latte'}
{include 'components/footer.latte'}
</body>
</html>

View file

@ -1,15 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Trending - TikTok</title>
<link rel="stylesheet" href="https://unpkg.com/bulmaswatch/superhero/bulmaswatch.min.css">
<link rel="stylesheet" href="{assets('feed.css', 'styles')}">
</head>
{include 'components/head.latte', title: 'Trending'}
<body>
{include 'navbar.latte'}
{include 'components/navbar.latte'}
<section class="hero is-primary">
<div class="hero-body">
<div class="container">
@ -17,7 +12,7 @@
</div>
</div>
</section>
{include 'feed.latte'}
{include 'footer.latte'}
{include 'components/feed.latte'}
{include 'components/footer.latte'}
</body>
</html>

View file

@ -1,15 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>{$feed->info->detail->user->nickname} - TikTok</title>
<link rel="stylesheet" href="https://unpkg.com/bulmaswatch/superhero/bulmaswatch.min.css">
<link rel="stylesheet" href="{assets('feed.css', 'styles')}">
</head>
{include 'components/head.latte', title: $feed->info->detail->user->nickname}
<body>
{include 'navbar.latte'}
{include 'components/navbar.latte'}
<section class="hero is-primary">
<div class="hero-body">
<div class="container">
@ -18,7 +13,7 @@
</div>
</div>
</section>
{include 'feed.latte'}
{include 'footer.latte'}
{include 'components/feed.latte'}
{include 'components/footer.latte'}
</body>
</html>