rewrite for cleaner dev aber geht noch nicht
All checks were successful
Build and push / Pulling repo on server (push) Successful in 2s

This commit is contained in:
Chris 2023-10-21 13:04:53 +02:00
parent 47543076bb
commit 3bb9f4ea76
18 changed files with 43 additions and 44 deletions

View File

@ -5,20 +5,19 @@
- [HTMX](https://htmx.org/) - [HTMX](https://htmx.org/)
- [Tailwind](https://tailwindcss.com/) - [Tailwind](https://tailwindcss.com/)
## Start Dev ## Start Dev
### Beim ersten Start ### Beim ersten Start
Config file erstellen bzw kopieren Config file erstellen bzw kopieren
1. `cd web/api/inc` 1. `cd web/inc`
2. Datei `example.config.inc.php` umbenennen auf `config.inc.php` 2. Datei `example.config.inc.php` umbenennen auf `config.inc.php`
3. Gegebenenfalls Werte anpassen in der Config 3. Gegebenenfalls Werte anpassen in der Config
Composer sachen holen Composer sachen holen
1. `cd web/api/inc` 1. `cd web/inc`
2. `composer install` 2. `composer install`
### Linux ### Linux
@ -33,3 +32,23 @@ In zweitem Terminal dann Webserver starten
1. `cd web` 1. `cd web`
2. `php -S localhost:8080` 2. `php -S localhost:8080`
3. Browser auf http://localhost:8080 öffnen 3. Browser auf http://localhost:8080 öffnen
## Ordnerstruktur
```
.
├── tools Tools halt
└── web
├── css CSS files, braucht man eigentlich nicht weil tailwind macht das schon
├── imgs Statische Bilder hier rein
├── inc Paar Sachen, die wichtig sind, damit das backend überhaupt funktioniert
│ ├── classes Allgemeine Klassen für die Seite
│ └── vendor Composer pakete
├── js JS Libraries
├── pages Alle Ordner hier drinnen sind automatisch dann endpoints. zB wenn man /home
│ ├── auth aufrufen können möchte, muss man einen home Ordner erstellen und drinnen eine PHP Datei namens
│ ├── err controller.php haben. Die wiederum muss eine Klasse sein, die den Namen des Ordners hat (nur großer Anfangsbuchstabe)
│ └── home Am einfachsten einen bestehenden anschauen oder kopieren 😁
└── templates Allgemeine Templates, mal schauen ob benötigt
└── partials
```

View File

@ -1,6 +1,6 @@
/** @type {import('tailwindcss').Config} */ /** @type {import('tailwindcss').Config} */
module.exports = { module.exports = {
content: ["../web/**/*.{html,js,mustache}","../web/api/**/*.{html,js,mustache}"], content: ["../web/**/*.{html,js,mustache}"],
theme: { theme: {
extend: {}, extend: {},
}, },

View File

@ -839,9 +839,9 @@ video {
border-color: rgb(209 213 219 / var(--tw-border-opacity)); border-color: rgb(209 213 219 / var(--tw-border-opacity));
} }
.border-green-500 { .border-red-500 {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-color: rgb(34 197 94 / var(--tw-border-opacity)); border-color: rgb(239 68 68 / var(--tw-border-opacity));
} }
.bg-gray-50 { .bg-gray-50 {
@ -849,41 +849,21 @@ video {
background-color: rgb(249 250 251 / var(--tw-bg-opacity)); background-color: rgb(249 250 251 / var(--tw-bg-opacity));
} }
.bg-green-100 {
--tw-bg-opacity: 1;
background-color: rgb(220 252 231 / var(--tw-bg-opacity));
}
.bg-indigo-600 { .bg-indigo-600 {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(79 70 229 / var(--tw-bg-opacity)); background-color: rgb(79 70 229 / var(--tw-bg-opacity));
} }
.bg-red-100 {
--tw-bg-opacity: 1;
background-color: rgb(254 226 226 / var(--tw-bg-opacity));
}
.bg-white { .bg-white {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
} }
.bg-indigo-500 {
--tw-bg-opacity: 1;
background-color: rgb(99 102 241 / var(--tw-bg-opacity));
}
.bg-green-50 {
--tw-bg-opacity: 1;
background-color: rgb(240 253 244 / var(--tw-bg-opacity));
}
.bg-red-50 {
--tw-bg-opacity: 1;
background-color: rgb(254 242 242 / var(--tw-bg-opacity));
}
.bg-red-200 {
--tw-bg-opacity: 1;
background-color: rgb(254 202 202 / var(--tw-bg-opacity));
}
.bg-gradient-to-tr { .bg-gradient-to-tr {
background-image: linear-gradient(to top right, var(--tw-gradient-stops)); background-image: linear-gradient(to top right, var(--tw-gradient-stops));
} }
@ -1061,16 +1041,16 @@ video {
color: rgb(17 24 39 / var(--tw-text-opacity)); color: rgb(17 24 39 / var(--tw-text-opacity));
} }
.text-green-700 {
--tw-text-opacity: 1;
color: rgb(21 128 61 / var(--tw-text-opacity));
}
.text-indigo-600 { .text-indigo-600 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity)); color: rgb(79 70 229 / var(--tw-text-opacity));
} }
.text-red-700 {
--tw-text-opacity: 1;
color: rgb(185 28 28 / var(--tw-text-opacity));
}
.text-slate-500 { .text-slate-500 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(100 116 139 / var(--tw-text-opacity)); color: rgb(100 116 139 / var(--tw-text-opacity));

View File

@ -97,7 +97,7 @@ class Page
$partials = []; $partials = [];
if(is_dir($controller_dir.'partials')) if(is_dir($controller_dir.'partials'))
$partials[] = new Mustache_Loader_FilesystemLoader($controller_dir.'partials'); $partials[] = new Mustache_Loader_FilesystemLoader($controller_dir.'partials');
$partials[] = new Mustache_Loader_FilesystemLoader(ROOT.DS.'..'.DS.'templates'.DS.'partials'); $partials[] = new Mustache_Loader_FilesystemLoader(ROOT.DS.DS.'templates'.DS.'partials');
$m = new Mustache_Engine(array( $m = new Mustache_Engine(array(
'entity_flags' => ENT_QUOTES, 'entity_flags' => ENT_QUOTES,
'partials_loader' => new Mustache_Loader_CascadingLoader($partials) 'partials_loader' => new Mustache_Loader_CascadingLoader($partials)

View File

@ -3,6 +3,9 @@
define('DS', DIRECTORY_SEPARATOR); define('DS', DIRECTORY_SEPARATOR);
define('ROOT', dirname(__FILE__)); define('ROOT', dirname(__FILE__));
if($_SERVER['HTTP_HX_REQUEST']!='true')
exit(file_get_contents(ROOT.DS.'templates'.DS.'mainpage.html'));
// if(file_exists(ROOT.DS.'inc'.DS.'config.inc.php')) // if(file_exists(ROOT.DS.'inc'.DS.'config.inc.php'))
// include_once(ROOT.DS.'inc'.DS.'config.inc.php'); // include_once(ROOT.DS.'inc'.DS.'config.inc.php');
// else die('ERR: no config file found :('); // else die('ERR: no config file found :(');
@ -14,8 +17,6 @@ if($_GET['url'])
$url = explode('/',ltrim(parse_url($_GET['url'], PHP_URL_PATH),'/')); $url = explode('/',ltrim(parse_url($_GET['url'], PHP_URL_PATH),'/'));
else $url = array_filter(explode('/',ltrim(parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH),'/'))); else $url = array_filter(explode('/',ltrim(parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH),'/')));
if(count($url) > 0 && ($url[0]=='api' || $url[0]=='backend'))
array_shift($url);
if($url==[] && $_SERVER['HTTP_HX_CURRENT_URL']) if($url==[] && $_SERVER['HTTP_HX_CURRENT_URL'])
$url = explode('/',ltrim(parse_url($_SERVER['HTTP_HX_CURRENT_URL'], PHP_URL_PATH),'/')); $url = explode('/',ltrim(parse_url($_SERVER['HTTP_HX_CURRENT_URL'], PHP_URL_PATH),'/'));
@ -23,7 +24,6 @@ if($url==[] && $_SERVER['HTTP_HX_CURRENT_URL'])
//echo print_r(['url'=>$url,'server'=>$_SERVER,'request'=>$_REQUEST,'cookie'=>$_COOKIE,'session'=>$_SESSION],true); //echo print_r(['url'=>$url,'server'=>$_SERVER,'request'=>$_REQUEST,'cookie'=>$_COOKIE,'session'=>$_SESSION],true);
$response = callHook($url); $response = callHook($url);
if(is_string($response)) if(is_string($response))

View File

@ -7,7 +7,7 @@
<div id="response" class="text-gray-900 dark:text-white"> <div id="response" class="text-gray-900 dark:text-white">
yes yes
</div> </div>
<form class="space-y-4 md:space-y-6" hx-post="/api/auth/login" hx-target="#response"> <form class="space-y-4 md:space-y-6" hx-post="/auth/login" hx-target="#response">
<div> <div>
<label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your email</label> <label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your email</label>
<input type="email" name="email" id="email" class="bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="name@company.com" required=""> <input type="email" name="email" id="email" class="bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="name@company.com" required="">

View File

@ -14,7 +14,7 @@
<header class="absolute inset-x-0 top-0 z-50"> <header class="absolute inset-x-0 top-0 z-50">
<nav class="flex items-center justify-between p-6 lg:px-8" aria-label="Global"> <nav class="flex items-center justify-between p-6 lg:px-8" aria-label="Global">
<div class="flex lg:flex-1"> <div class="flex lg:flex-1">
<a href="#" hx-get="/api/home" hx-target="#main" class="-m-1.5 p-1.5"> <a href="#" hx-get="/home" hx-push-url="/home" hx-target="#main" class="-m-1.5 p-1.5">
<span class="sr-only">Dogstats</span> <span class="sr-only">Dogstats</span>
<img class="h-8 w-auto" src="/imgs/dogstats-50.png" alt=""> <img class="h-8 w-auto" src="/imgs/dogstats-50.png" alt="">
</a> </a>
@ -85,7 +85,7 @@
style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"> style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)">
</div> </div>
</div> </div>
<div id="main" hx-get="/api" hx-trigger="load" class="mx-auto max-w-2xl"> <div id="main" hx-get="/" hx-trigger="load" class="mx-auto max-w-2xl">
<div class="hidden sm:mb-8 sm:flex sm:justify-center"> <div class="hidden sm:mb-8 sm:flex sm:justify-center">
<div <div
class="relative rounded-full px-3 py-1 text-sm leading-6 text-gray-600 ring-1 ring-gray-900/10 hover:ring-gray-900/20"> class="relative rounded-full px-3 py-1 text-sm leading-6 text-gray-600 ring-1 ring-gray-900/10 hover:ring-gray-900/20">