mirror of
https://github.com/YGGverse/Yo.git
synced 2025-02-05 11:24:20 +00:00
draft webui
This commit is contained in:
ghost
parent
bdd90bd270
commit
905af165fb
14
README.md
14
README.md
@ -5,13 +5,13 @@ Next generation of [YGGo!](https://github.com/YGGverse/YGGo) project with goal t
|
||||
- Index model changed to the distributed cluster model, and oriented to aggregate search results from different instances trough API
|
||||
- Refactored data exchange model with drop all primary keys dependencies
|
||||
- Snaps now using tar.gz compression to reduce storage requirements and still supporting remote mirrors, FTP including
|
||||
- Codebase following minimalism principles everywhere
|
||||
- Minimalism everywhere
|
||||
|
||||
## Implementation
|
||||
|
||||
Engine written in PHP and uses [Manticore](https://github.com/manticoresoftware) on backend.
|
||||
|
||||
Default build inspired and adapted for [Yggdrasil](https://github.com/yggdrasil-network) eco-system but could be used to make own search project.
|
||||
Default build inspired and adapted for [Yggdrasil](https://github.com/yggdrasil-network) but could be used to make internet search portal.
|
||||
|
||||
## Components
|
||||
|
||||
@ -32,7 +32,15 @@ Default build inspired and adapted for [Yggdrasil](https://github.com/yggdrasil-
|
||||
4. Check `src/config.json` for any customizations
|
||||
5. Make sure `storage` folder writable
|
||||
6. Run indexes init script `php src/cli/index/init.php`
|
||||
7. [Start crawling!](https://github.com/YGGverse/Yo#documentation)
|
||||
7. Add new URL `php src/cli/document/add.php URL`
|
||||
8. Run crawler `php src/cli/document/crawl.php`
|
||||
9. Get search results `php src/cli/document/search.php '*'`
|
||||
|
||||
#### Web UI
|
||||
|
||||
1. `cd src/webui`
|
||||
2. `php -S 127.0.0.1:8080`
|
||||
3. now open `127.0.0.1:8080` in your browser!
|
||||
|
||||
## Documentation
|
||||
|
||||
|
||||
@ -16,6 +16,7 @@
|
||||
"require": {
|
||||
"manticoresoftware/manticoresearch-php": "^3.1",
|
||||
"symfony/css-selector": "^6.3",
|
||||
"symfony/dom-crawler": "^6.3"
|
||||
"symfony/dom-crawler": "^6.3",
|
||||
"jdenticon/jdenticon": "^1.0"
|
||||
}
|
||||
}
|
||||
|
||||
@ -11,6 +11,17 @@
|
||||
"document":"yo_document"
|
||||
}
|
||||
},
|
||||
"webui":
|
||||
{
|
||||
"url":
|
||||
{
|
||||
"base":"http://127.0.0.1:8888"
|
||||
},
|
||||
"pagination":
|
||||
{
|
||||
"limit":20
|
||||
}
|
||||
},
|
||||
"cli":
|
||||
{
|
||||
"document":
|
||||
|
||||
288
src/webui/index.php
Normal file
288
src/webui/index.php
Normal file
@ -0,0 +1,288 @@
|
||||
<?php
|
||||
|
||||
// Debug
|
||||
ini_set('display_errors', '1');
|
||||
ini_set('display_startup_errors', '1');
|
||||
error_reporting(E_ALL);
|
||||
|
||||
// Load dependencies
|
||||
require_once __DIR__ . '/../../vendor/autoload.php';
|
||||
|
||||
// Init config
|
||||
$config = json_decode(
|
||||
file_get_contents(
|
||||
__DIR__ . '/../config.json'
|
||||
)
|
||||
);
|
||||
|
||||
/* @TODO show totals in placeholder
|
||||
|
||||
// Init
|
||||
$client = new \Manticoresearch\Client(
|
||||
[
|
||||
'host' => $config->manticore->server->host,
|
||||
'port' => $config->manticore->server->port,
|
||||
]
|
||||
);
|
||||
|
||||
// Init index
|
||||
$index = $client->index(
|
||||
$config->manticore->index->document
|
||||
);
|
||||
|
||||
*/
|
||||
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="<?php echo _('en-US') ?>">
|
||||
<head>
|
||||
<title><?php echo _('Yo! Web Search Engine') ?></title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="description" content="<?php echo _('Yo! Micro Web Crawler in PHP & Manticore') ?>" />
|
||||
<meta name="keywords" content="<?php echo _('web, search, engine, crawler, manticore, yggdrasil, js-less, open source') ?>" />
|
||||
<style>
|
||||
|
||||
* {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Sans-serif;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #2e3436;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #fff;
|
||||
font-weight: normal;
|
||||
font-size: 32px;
|
||||
margin: 16px 0
|
||||
}
|
||||
|
||||
form {
|
||||
display: block;
|
||||
max-width: 640px;
|
||||
margin: 16% auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
margin: 8px 0;
|
||||
padding: 12px 0;
|
||||
border-radius: 32px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input:hover {
|
||||
background-color: #111
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none;
|
||||
background-color: #111
|
||||
}
|
||||
|
||||
input:focus::placeholder {
|
||||
color: #090808;
|
||||
}
|
||||
|
||||
button {
|
||||
margin: 22px 0;
|
||||
padding: 10px 16px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
background-color: #3394fb;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #4b9df4;
|
||||
}
|
||||
|
||||
footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left:0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
padding: 24px;
|
||||
color: #9ba2ac;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
footer > a, a:visited,
|
||||
footer > a:active {
|
||||
color: #9ba2ac;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
footer > a:hover {
|
||||
color: #54a3f7;
|
||||
}
|
||||
|
||||
footer > a,
|
||||
footer > a:visited,
|
||||
footer > a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* CSS animation
|
||||
* by https://codepen.io/alvarotrigo/pen/GRvYNax
|
||||
*/
|
||||
|
||||
main {
|
||||
background: #2e3436;
|
||||
background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
ul {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
z-index:-1
|
||||
}
|
||||
|
||||
li {
|
||||
position: absolute;
|
||||
display: block;
|
||||
list-style: none;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
animation: animate 25s linear infinite;
|
||||
bottom: -150px;
|
||||
}
|
||||
|
||||
li:nth-child(1) {
|
||||
left: 25%;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
animation-delay: 0s;
|
||||
}
|
||||
|
||||
li:nth-child(2) {
|
||||
left: 10%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
animation-delay: 2s;
|
||||
animation-duration: 12s;
|
||||
}
|
||||
|
||||
li:nth-child(3) {
|
||||
left: 70%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
animation-delay: 4s;
|
||||
}
|
||||
|
||||
li:nth-child(4) {
|
||||
left: 40%;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 18s;
|
||||
}
|
||||
|
||||
li:nth-child(5) {
|
||||
left: 65%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
animation-delay: 0s;
|
||||
}
|
||||
|
||||
li:nth-child(6) {
|
||||
left: 75%;
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
animation-delay: 3s;
|
||||
}
|
||||
|
||||
li:nth-child(7) {
|
||||
left: 35%;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
animation-delay: 7s;
|
||||
}
|
||||
|
||||
li:nth-child(8) {
|
||||
left: 50%;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
animation-delay: 15s;
|
||||
animation-duration: 45s;
|
||||
}
|
||||
|
||||
li:nth-child(9) {
|
||||
left: 20%;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
animation-delay: 2s;
|
||||
animation-duration: 35s;
|
||||
}
|
||||
|
||||
li:nth-child(10) {
|
||||
left: 85%;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
animation-delay: 0s;
|
||||
animation-duration: 11s;
|
||||
}
|
||||
|
||||
@keyframes animate {
|
||||
0%{
|
||||
transform: translateY(0) rotate(0deg);
|
||||
opacity: 1;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
100%{
|
||||
transform: translateY(-1000px) rotate(720deg);
|
||||
opacity: 0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<form name="search" method="GET" action="<?php echo $config->webui->url->base; ?>/search.php">
|
||||
<h1><?php echo _('Yo!') ?></h1>
|
||||
<input type="text" name="q" placeholder="<?php echo ('request...') ?>" value="" />
|
||||
<button type="submit"><?php echo _('search') ?></button>
|
||||
</form>
|
||||
</header>
|
||||
<!-- css animation : begin -->
|
||||
<main>
|
||||
<ul>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
<li></li>
|
||||
</ul>
|
||||
</main>
|
||||
<!-- css animation : end -->
|
||||
<footer>
|
||||
<a href="https://github.com/YGGverse/Yo"><?php echo _('GitHub') ?></a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
273
src/webui/search.php
Normal file
273
src/webui/search.php
Normal file
@ -0,0 +1,273 @@
|
||||
<?php
|
||||
|
||||
// Debug
|
||||
ini_set('display_errors', '1');
|
||||
ini_set('display_startup_errors', '1');
|
||||
error_reporting(E_ALL);
|
||||
|
||||
// Load dependencies
|
||||
require_once __DIR__ . '/../../vendor/autoload.php';
|
||||
|
||||
// Init config
|
||||
$config = json_decode(
|
||||
file_get_contents(
|
||||
__DIR__ . '/../config.json'
|
||||
)
|
||||
);
|
||||
|
||||
// Init
|
||||
$client = new \Manticoresearch\Client(
|
||||
[
|
||||
'host' => $config->manticore->server->host,
|
||||
'port' => $config->manticore->server->port,
|
||||
]
|
||||
);
|
||||
|
||||
// Init index
|
||||
$index = $client->index(
|
||||
$config->manticore->index->document
|
||||
);
|
||||
|
||||
// Request
|
||||
$q = !empty($_GET['q']) ? $_GET['q'] : '';
|
||||
$p = !empty($_GET['p']) ? (int) $_GET['p'] : 1;
|
||||
|
||||
// Check URL for exist
|
||||
$results = $index->search($q)
|
||||
->offset($p * $config->webui->pagination->limit - $config->webui->pagination->limit)
|
||||
->limit($config->webui->pagination->limit)
|
||||
->get();
|
||||
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="<?php echo _('en-US'); ?>">
|
||||
<head>
|
||||
<title><?php echo sprintf(_('%s - YGGo!'), htmlentities($q)) ?></title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="keywords" content="<?php echo htmlentities($q) ?>" />
|
||||
<style>
|
||||
|
||||
* {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Sans-serif;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #2e3436;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: #34393b;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
main {
|
||||
margin-top: 110px;
|
||||
margin-bottom: 76px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
position: fixed;
|
||||
top: 8px;
|
||||
left: 24px;
|
||||
}
|
||||
|
||||
h1 > a,
|
||||
h1 > a:visited,
|
||||
h1 > a:active,
|
||||
h1 > a:hover {
|
||||
color: #fff;
|
||||
font-weight: normal;
|
||||
font-size: 24px;
|
||||
margin: 10px 0;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h2 {
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
margin: 4px 0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
form {
|
||||
display: block;
|
||||
max-width: 678px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
margin: 12px 0;
|
||||
padding: 10px 0;
|
||||
border-radius: 32px;
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input:hover {
|
||||
background-color: #111
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none;
|
||||
background-color: #111
|
||||
}
|
||||
|
||||
input:focus::placeholder {
|
||||
color: #090808
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
float: left;
|
||||
margin-left: 16px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
label > input {
|
||||
width: auto;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 8px 16px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
background-color: #3394fb;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
position: fixed;
|
||||
top: 15px;
|
||||
right: 24px;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #4b9df4;
|
||||
}
|
||||
|
||||
a, a:visited, a:active {
|
||||
color: #9ba2ac;
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #54a3f7;
|
||||
}
|
||||
|
||||
img.icon {
|
||||
float: left;
|
||||
border-radius: 50%;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
img.image {
|
||||
max-width: 100%;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
div {
|
||||
max-width: 640px;
|
||||
margin: 0 auto;
|
||||
padding: 16px 0;
|
||||
border-top: 1px #000 dashed;
|
||||
font-size: 14px
|
||||
}
|
||||
|
||||
span {
|
||||
display: block;
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 16px 0;
|
||||
text-align: right;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
p > a, p > a:visited, p > a:active {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: #db6161;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<form name="search" method="GET" action="<?php echo $config->webui->url->base; ?>/search.php">
|
||||
<h1><a href="<?php echo $config->webui->url->base; ?>"><?php echo _('Yo!') ?></a></h1>
|
||||
<input type="text" name="q" placeholder="<?php echo _('request') ?>" value="<?php echo htmlentities($q) ?>" />
|
||||
<button type="submit"><?php echo _('search'); ?></button>
|
||||
</form>
|
||||
</header>
|
||||
<main>
|
||||
<?php if ($results->getTotal()) { ?>
|
||||
<?php foreach ($results as $result) { ?>
|
||||
<div>
|
||||
<?php if (!empty($result->url)) { ?>
|
||||
<h2><?php echo $result->title ?></h2>
|
||||
<?php } ?>
|
||||
<?php if (!empty($result->description)) { ?>
|
||||
<span><?php echo $result->description ?></span>
|
||||
<?php } ?>
|
||||
<?php if (!empty($result->keywords)) { ?>
|
||||
<span><?php echo $result->keywords ?></span>
|
||||
<?php } ?>
|
||||
<a href="<?php echo $result->url ?>">
|
||||
<?php
|
||||
$identicon = new \Jdenticon\Identicon();
|
||||
|
||||
$identicon->setValue($result->url);
|
||||
$identicon->setSize(16);
|
||||
$identicon->setStyle(
|
||||
[
|
||||
'backgroundColor' => 'rgba(255, 255, 255, 0)',
|
||||
'padding' => 0
|
||||
]
|
||||
);
|
||||
?>
|
||||
<img src="<?php echo $identicon->getImageDataUri('webp') ?>" alt="identicon" width="16" height="16" class="icon" />
|
||||
<?php echo htmlentities(urldecode($result->url)) ?>
|
||||
</a>
|
||||
<!-- @TODO
|
||||
|
|
||||
<a href="<?php echo $config->webui->url->base; ?>/snap">
|
||||
<?php echo _('cache'); ?>
|
||||
</a>
|
||||
-->
|
||||
</div>
|
||||
<?php } ?>
|
||||
<?php if ($p * $config->webui->pagination->limit <= $results->getTotal()) { ?>
|
||||
<div>
|
||||
<a href="<?php echo $config->webui->url->base; ?>/search.php?q=<?php echo urlencode(htmlentities($q)) ?>&p=<?php echo $p + 1 ?>">
|
||||
<?php echo _('Next page') ?>
|
||||
</a>
|
||||
</div>
|
||||
<?php } ?>
|
||||
<?php } else { ?>
|
||||
<div>
|
||||
<?php echo _('Nothing found!') ?>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user