Raid Page

tailwind/custom/components/widgets.css

@@ -12,7 +12,7 @@
 .top-title {
     order: 1;
     grid-area: 1 / 2 / 2 / 3;
-    @apply bg-glass shadow text-4xl font-bold text-center p-2;
+    margin-bottom: var(--wowp-gap);
 }
 
 .content {

tailwind/tailwind.config.js

@@ -1,5 +1,6 @@
 // Set the Preflight flag based on the build target.
 const includePreflight = 'editor' === process.env._TW_TARGET ? false : true;
+import themejson from '@_tw/themejson';
 import plugin from 'tailwindcss/plugin';
 
 module.exports = {
@@ -17,23 +18,6 @@ module.exports = {
 		extend: {
 		},
 	},
-	daisyui: {
-		themes: [
-			{
-				wowpress: {
-					"primary": "#a991f7",
-					"secondary": "#f6d860",
-					"accent": "#37cdbe",
-					"neutral": "#fff",
-					"base-100": "#ffffff",
-					"primary-content": "#fff",
-					"--rounded-box": "0rem", // border radius rounded-box utility class, used in card and other large boxes
-					"--rounded-btn": "0rem", // border radius rounded-btn utility class, used in buttons and similar element
-					"--rounded-badge": "0rem", 
-				}
-			}
-		]
-	},
 	corePlugins: {
 		// Disable Preflight base styles in builds targeting the editor.
 		preflight: includePreflight,
@@ -53,17 +37,17 @@ module.exports = {
 		plugin(function ({ theme, addUtilities }) {
 			const colorUtilities = {};
 			const colors = theme('colors');
+			const themecolors = themejson().config.theme.extend.colors;
+			for (const color in themecolors){
+				colorUtilities[`.btn-${color}`] = {
+					'--btn-color': themecolors[color]
+				}
+			}
 			for (const color in colors) {
 				if (typeof colors[color] === 'object') {
-				   colorUtilities[`.button-${color}`] = {
+					if (colors[color]['500'] !== undefined) {
-					'background': colors[color]['400'],
+						colorUtilities[`.btn-${color}`] = {
-					'color': colors[color]['800'],
+							'--btn-color': colors[color]['500']
-					'border': '1px solid '+colors[color]['800'],
-					'outline': colors[color]['800'],
-					'&:hover': {
-						'background': colors[color]['300'],
-						'border': '1px solid'+ colors[color]['900']
-					}
 						}
 						colorUtilities[`.badge-${color}`] = {
 							'background': colors[color]['200'],
@@ -83,16 +67,17 @@ module.exports = {
 						}
 					}
 				}
+			}
+
 
 			addUtilities(colorUtilities);
 		})
 	],
 	safelist: [
-        {pattern: /button-+/},
+		{ pattern: /btn-([a-zA-Z]+)$/ },
-        {pattern: /badge-+/},
+		{ pattern: /bg-([a-zA-Z]+)$/, variants: ['has-\[\:checked\]']},
-        {pattern: /alert-+/},
+		{ pattern: /text-([a-zA-Z]+)$/, variants: ['hover', 'group-hover','has-\[\:checked\]'] },
-        {pattern: /bg-[^/]+-200$/},
+		{ pattern: /shadow-([a-zA-Z]+)$/ },
-        {pattern: /text-+/},
+		{ pattern: /border-([a-zA-Z]+)$/ },
-        {pattern: /border-[^/]+-700$/},
 	]
 };

tailwind/tailwind.css

@@ -57,11 +57,16 @@
     padding: var(--wowp-gap);
 }
 
+.gap-auto{
+    gap: var(--wowp-gap);
+}
+
 body {
     background-color: unset;
     --body-bg: url('https://nebelkrieger.de/wp-content/uploads/2023/05/F8lCEpyWoAAFCFS-scaled.jpg');
     position: relative;
 z-index: -10;
+    @apply min-h-screen;
 }
 
 .bg-glass {

theme/components/toggle-button.php

@@ -0,0 +1,25 @@
+<?php
+use WoWPress\Frontend\Icon;
+?>
+<div>
+    <label style="" for="tb_<?= $this->id ?>" class="w-full flex <?= $this->row ? 'flex-row gap-2' : 'flex-col' ?> items-center justify-center h-auto select-none cursor-pointer border py-3 px-6
+     font-bold border-<?=$this->color_no?>  transition-colors duration-200 ease-in-out has-[:checked]:bg-<?=$this->color_yes?> has-[:checked]:text-black has-[:checked]:border-<?=$this->color_yes?> ">
+        <input type="<?= $this->type ?>" id="tb_<?= $this->id ?>" name="<?= $this->name ?>" class="peer group hidden" <?= $this->disabled ? 'disabled' : '' ?> <?= $this->checked ? 'checked' : '' ?> />
+        <div class="peer-checked:block hidden">
+            <?php
+            if ($this->icons) : ?>
+                <?= Icon::get($this->icon_yes) ?>
+            <?php else : ?>
+                Ja
+            <?php endif; ?>
+        </div>
+        <div class="peer-checked:hidden block">
+            <?php if ($this->icons) : ?>
+                <?= Icon::get($this->icon_no) ?>
+            <?php else : ?>
+                Nein
+            <?php endif; ?>
+        </div>
+        <?= $this->text ?>
+    </label>
+</div>

theme/footer.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * The template for displaying the footer
  *
@@ -12,36 +13,23 @@
 ?>
 
 </div><!-- #content -->
-<?php
+<?php if (is_active_sidebar('right-widgets') && get_sidebar_status('right')) : ?>
-if ($GLOBALS['wowpress']['widget_area']['right'] !== false) :
-?>
 	<div class="widget-wrapper right-widgets">
-		<div id="demo-widget" class="widget">
+		<?php dynamic_sidebar('right-widgets'); ?>
-			<h3>Titel Right 1</h3>
 	</div>
-		<div id="demo-widget" class="widget">
+<?php endif; ?>
-			<h3>Titel Right 2</h3>
-		</div>
-	</div>
-<?php
-endif;
-if ($GLOBALS['wowpress']['widget_area']['bottom'] !== false) :
-?>
-	<div class="widget-wrapper bottom-widgets">
-		<div id="demo-widget" class="widget">
-			<h3>Titel Bottom 1</h3>
-		</div>
-		<?php get_template_part('template-parts/layout/footer', 'content'); ?>
 
-	</div>
-<?php
-endif;
-?>
 </div> <!-- grid -->
 
+<div class="sticky top-[100vh]">
+<?php if (is_active_sidebar('bottom-widgets') && get_sidebar_status('bottom')) : ?>
+	<div class="widget-wrapper bottom-widgets">
+		<?php dynamic_sidebar('bottom-widgets'); ?>
+	</div>
+<?php endif; ?>
 
 <?php wp_footer(); ?>
-
+</div>
 
 </body>
 

theme/functions.php

@@ -63,7 +63,8 @@ if ( ! function_exists( 'wowpress_setup' ) ) :
 	 * runs before the init hook. The init hook is too late for some features, such
 	 * as indicating support for post thumbnails.
 	 */
-	function wowpress_setup() {
+	function wowpress_setup()
+	{
 
 		/*
 		 * Make theme available for translation.
@@ -131,14 +132,13 @@ if ( ! function_exists( 'wowpress_setup' ) ) :
 
 		// Remove support for block templates.
 		remove_theme_support('block-templates');
-
-	
 	}
 endif;
 
 if (!function_exists('wowpress_database')) :
 
-	function wowpress_database(){
+	function wowpress_database()
+	{
 		global $wpdb;
 		require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
 		dbDelta([
@@ -157,12 +157,13 @@ add_action( 'after_switch_theme','wowpress_database');
  *
  * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar
  */
-function wowpress_widgets_init() {
+function wowpress_widgets_init()
+{
 	register_sidebar(
 		array(
-			'name'          => __( 'Footer', 'wowpress' ),
+			'name'          => __('Header', 'wowpress'),
-			'id'            => 'bottom-widgets',
+			'id'            => 'top-widgets',
-			'description'   => __( 'Add widgets here to appear in your footer.', 'wowpress' ),
+			'description'   => __('Add widgets here to appear on the header.', 'wowpress'),
 			'before_widget' => '<section id="%1$s" class="widget %2$s">',
 			'after_widget'  => '</section>',
 			'before_title'  => '<h2 class="widget-title">',
@@ -180,13 +181,36 @@ function wowpress_widgets_init() {
 			'after_title'   => '</h2>',
 		)
 	);
+	register_sidebar(
+		array(
+			'name'          => __('Rechte Seite', 'wowpress'),
+			'id'            => 'right-widgets',
+			'description'   => __('Add widgets here to appear on the right side.', 'wowpress'),
+			'before_widget' => '<section id="%1$s" class="widget %2$s">',
+			'after_widget'  => '</section>',
+			'before_title'  => '<h2 class="widget-title">',
+			'after_title'   => '</h2>',
+		)
+	);
+	register_sidebar(
+		array(
+			'name'          => __('Footer', 'wowpress'),
+			'id'            => 'bottom-widgets',
+			'description'   => __('Add widgets here to appear in your footer.', 'wowpress'),
+			'before_widget' => '<section id="%1$s" class="widget %2$s">',
+			'after_widget'  => '</section>',
+			'before_title'  => '<h2 class="widget-title">',
+			'after_title'   => '</h2>',
+		)
+	);
 }
 add_action('widgets_init', 'wowpress_widgets_init');
 
 /**
  * Enqueue scripts and styles.
  */
-function wowpress_scripts() {
+function wowpress_scripts()
+{
 	wp_enqueue_style('wowpress-style', get_stylesheet_uri(), array(), WOWPRESS_VERSION);
 	wp_enqueue_script('wowpress-script', get_template_directory_uri() . '/js/script.min.js', array(), WOWPRESS_VERSION, true);
 
@@ -199,7 +223,8 @@ add_action( 'wp_enqueue_scripts', 'wowpress_scripts' );
 /**
  * Enqueue the block editor script.
  */
-function wowpress_enqueue_block_editor_script() {
+function wowpress_enqueue_block_editor_script()
+{
 	wp_enqueue_script(
 		'wowpress-editor',
 		get_template_directory_uri() . '/js/block-editor.min.js',
@@ -218,7 +243,8 @@ add_action( 'enqueue_block_editor_assets', 'wowpress_enqueue_block_editor_script
  * editor, using an inline script to create a JavaScript array containing the
  * Tailwind Typography classes from WOWPRESS_TYPOGRAPHY_CLASSES.
  */
-function wowpress_enqueue_typography_script() {
+function wowpress_enqueue_typography_script()
+{
 	if (is_admin()) {
 		wp_enqueue_script(
 			'wowpress-typography',
@@ -241,7 +267,8 @@ add_action( 'enqueue_block_assets', 'wowpress_enqueue_typography_script' );
  * @param array $settings TinyMCE settings.
  * @return array
  */
-function wowpress_tinymce_add_class( $settings ) {
+function wowpress_tinymce_add_class($settings)
+{
 	$settings['body_class'] = WOWPRESS_TYPOGRAPHY_CLASSES;
 	return $settings;
 }
@@ -270,7 +297,7 @@ add_filter('show_admin_bar', '__return_false');
  */
 
 // Show Widgets
- $GLOBALS['wowpress']['widget_area'] = [
+$GLOBALS['wowpress']['sidebar'] = [
 	'left' => true,
 	'right' => true,
 	'top' => true,
@@ -292,16 +319,17 @@ require get_template_directory() . '/inc/config-routing.php';
  * Neue Werte für Kategorien
  */
 
- function wowpress_color_picker_scripts() {
+function wowpress_color_picker_scripts()
+{
 	wp_enqueue_style('wp-color-picker');
 	wp_enqueue_script('cp-active', get_template_directory_uri() . "/plugins/cp-active.js", array('wp-color-picker'), false, true);
-	
 }
 add_action('admin_enqueue_scripts', 'wowpress_color_picker_scripts');
 
 add_action('category_add_form_fields', 'wowpress_add_category_meta', 10, 2);
 
-function wowpress_add_category_meta($taxonomy) {
+function wowpress_add_category_meta($taxonomy)
+{
 	$colors = $GLOBALS['wowpress']['theme']['settings']['color']['palette'];
 ?><div class="form-field term-group">
 		<label for="color"><?php _e('Farbe', 'wowpress'); ?></label>
@@ -311,7 +339,8 @@ function wowpress_add_category_meta($taxonomy) {
 
 		add_action('created_category', 'wowpress_save_category_meta', 10, 2);
 
-function wowpress_save_category_meta( $term_id, $tt_id ){
+		function wowpress_save_category_meta($term_id, $tt_id)
+		{
 			if (isset($_POST['color']) && '' !== $_POST['color']) {
 				$color = sanitize_title($_POST['color']);
 				add_term_meta($term_id, 'color', $color, true);
@@ -320,7 +349,8 @@ function wowpress_save_category_meta( $term_id, $tt_id ){
 
 		add_action('category_edit_form_fields', 'wowpress_edit_category_meta', 10, 2);
 
-function wowpress_edit_category_meta( $term, $taxonomy ){
+		function wowpress_edit_category_meta($term, $taxonomy)
+		{
 
 			$colors = $GLOBALS['wowpress']['theme']['settings']['color']['palette'];
 
@@ -338,7 +368,8 @@ function wowpress_edit_category_meta( $term, $taxonomy ){
 
 		add_action('edited_category', 'wowpress_update_category_meta', 10, 2);
 
-function wowpress_update_category_meta( $term_id, $tt_id ){
+		function wowpress_update_category_meta($term_id, $tt_id)
+		{
 
 			if (isset($_POST['color']) && '' !== $_POST['color']) {
 				$color = sanitize_title($_POST['color']);
@@ -350,7 +381,8 @@ function wowpress_update_category_meta( $term_id, $tt_id ){
 		require_once(get_stylesheet_directory() . '/options/api.php');
 
 		/** Global Helper functions */
-function translate_string($string,$lang="deu"){
+		function translate_string($string, $lang = "deu")
+		{
 			$dict_path = get_template_directory() . "/lang/$lang.json";
 			if (!file_exists($dict_path)) return $string;
 			$dict = json_decode(file_get_contents($dict_path), true);
@@ -360,7 +392,8 @@ function translate_string($string,$lang="deu"){
 			return $string;
 		}
 
-function format_date($timestamp="NOW",$format="dd.MM.yyyy"){
+		function format_date($timestamp = "NOW", $format = "dd.MM.yyyy")
+		{
 			return datefmt_format(\IntlDateFormatter::create(
 				'de_DE.UTF-8',
 				\IntlDateFormatter::NONE,
@@ -371,6 +404,49 @@ function format_date($timestamp="NOW",$format="dd.MM.yyyy"){
 			), is_numeric($timestamp) ? $timestamp : strtotime($timestamp));
 		}
 
+		function dd(...$vars)
+		{
+			echo "<pre>";
+			var_dump($vars);
+			echo "</pre>";
+			exit;
+		}
+
+		function set_sidebar_status($location, bool $active = true)
+		{
+			switch ($location) {
+				case 'top':
+					$GLOBALS['wowpress']['sidebar']['top'] = $active;
+					break;
+				case 'left':
+					$GLOBALS['wowpress']['sidebar']['left'] = $active;
+					break;
+				case 'right':
+					$GLOBALS['wowpress']['sidebar']['right'] = $active;
+					break;
+				case 'bottom':
+					$GLOBALS['wowpress']['sidebar']['bottom'] = $active;
+					break;
+			}
+		}
+		function get_sidebar_status($location)
+		{
+			switch ($location) {
+				case 'top':
+					return $GLOBALS['wowpress']['sidebar']['top'];
+					break;
+				case 'left':
+					return $GLOBALS['wowpress']['sidebar']['left'];
+					break;
+				case 'right':
+					return $GLOBALS['wowpress']['sidebar']['right'];
+					break;
+				case 'bottom':
+					return $GLOBALS['wowpress']['sidebar']['bottom'];
+					break;
+			}
+			return false;
+		}
 
 		/** Roles */
 		set_roles();

theme/header.php

@@ -32,31 +32,14 @@
 	<?php get_template_part('template-parts/layout/header', 'content'); ?>
 
 	<div class="content-wrapper">
-		<?php
+		<?php if (is_active_sidebar('top-widgets') && get_sidebar_status('top') )  : ?>
-		if ($GLOBALS['wowpress']['widget_area']['top'] !== false) :
-		?>
 			<div class="widget-wrapper top-widgets">
-				<div id="demo-widget" class="widget">
+				<?php dynamic_sidebar('top-widgets'); ?>
-					<h3>Titel Top 1</h3>
 			</div>
-			</div>
+		<?php endif; ?>
-		<?php
+		<?php if (is_active_sidebar('left-widgets') && get_sidebar_status('left')) : ?>
-		else :
-		?>
-			<div class="top-title">
-				<?= $GLOBALS['wowpress']['page_title'] ?>
-			</div>
-		<?php
-		endif;
-		if ($GLOBALS['wowpress']['widget_area']['left'] !== false) :
-		?>
-			<?php if (is_active_sidebar('left-widgets')) : ?>
 			<div class="widget-wrapper left-widgets">
 				<?php dynamic_sidebar('left-widgets'); ?>
 			</div>
 		<?php endif; ?>
-		<?php
-		endif;
-		?>
-
 		<div id="content" class="content">

theme/inc/config-routing.php

@@ -1,9 +1,13 @@
 <?php
 
+use WoWPress\Models\Raid;
+
 add_filter('generate_rewrite_rules', function ($wp_rewrite) {
     $wp_rewrite->rules = array_merge(
         ['roster/?$' => 'index.php?wowpress_page=roster'],
+        ['raids/?$' => 'index.php?wowpress_page=raids&year='.date('Y')."&month=".date('m')],
         ['raids/(\d+)/(\d+)?$' => 'index.php?wowpress_page=raids&year=$matches[1]&month=$matches[2]'],
+        ['raid/(\d+)/?$' => 'index.php?wowpress_page=raid&raid_id=$matches[1]'],
         ['request/?$' => 'index.php?wowpress_page=form_request'],
         $wp_rewrite->rules
     );
@@ -13,6 +17,7 @@ add_filter('query_vars', function ($query_vars) {
     $query_vars[] = 'wowpress_page';
     $query_vars[] = 'year';
     $query_vars[] = 'month';
+    $query_vars[] = 'raid_id';
 
     return $query_vars;
 });
@@ -45,6 +50,21 @@ add_action('template_redirect', function () {
             include plugin_dir_path(__FILE__) . '../pages/raids.php';
             die;
             break;
+        case 'raid':
+            $GLOBALS['wowpress']['widget_area'] = [
+                'left' => true,
+                'right' => true,
+                'top' => false,
+                'bottom' => true,
+            ];
+
+            $raid = Raid::find(get_query_var('raid_id'));
+            $GLOBALS['wowpress']['raid'] = $raid;
+            $GLOBALS['wowpress']['page_title'] = $raid->title;
+
+            include plugin_dir_path(__FILE__) . '../pages/single_raid.php';
+            die;
+            break;
         case 'form_request':
             include plugin_dir_path(__FILE__) . '../request.php';
             die;

theme/index.php

@@ -11,10 +11,11 @@
  *
  * @package WowPress
  */
+
 get_header();
 ?>
 
-	<section id="primary">
+	<section id="primary" <?php if(!get_sidebar_status('top')):?> style="margin-top:calc(-1 * var(--wowp-gap))" <?php endif; ?>>
 		<main id="main">
 
 		<?php

theme/lang/deu.json

@@ -2,5 +2,8 @@
     "Warlock" : "Hexenmeister",
     "Destruction": "Zerstörung",
     "Evoker" : "Rufer",
-    "Devastation" : "Verheerung"
+    "Devastation" : "Verheerung",
+    "Retribution": "Vergeltung",
+    "Monk" : "Mönch",
+    "Windwalker" : "Windläufer"
 }

theme/pages/raids.php

@@ -6,13 +6,18 @@ global $widget_area;
 
 global $year;
 global $month;
+set_sidebar_status('top', false);
 
-$raids = Raid::whereStart("$year-$month-01",">")->whereEnd("$year-$month-31","<")->get();
 
-var_dump($raids);
+$raids = Raid::where("start", ">", "$year-$month-01 00:00:00")->get();
 
 get_header();
 ?>
+<div class="top-title flex flex-row gap-2" style="margin-top:calc(-1 * var(--wowp-gap))">
+<div class="text-3xl font-bold bg-glass shadow p-3 text-center w-full">
+    <?= $GLOBALS['wowpress']['page_title'] ?>
+</div>
+</div>
 
 <section id="primary">
     <main id="main">
@@ -21,19 +26,27 @@ get_header();
             <div class="grid grid-cols-7 gap-1 pt-1" style="grid-auto-rows: 1fr">
                 <?php
                 for ($i = 1; $i <= date("t", strtotime("$year-$month-01")); $i++) {
+                    $has_raid = [];
+                    foreach ($raids as $raid) {
+                        if (format_date($raid->start) == format_date("$year-$month-$i")) {
+                            $has_raid[] = $raid;
+                        }
+                    }
                 ?>
-                    <div class="bg-glass p-auto text-center <?php if($i== 24 || $i == 12){ ?> glow shadow-hunter <?php } ?> grid grid-cols-2 grid-rows-2">
+                    <div class="bg-glass p-auto text-center <?php if (count($has_raid) > 0) { ?> glow shadow-<?=$has_raid[0]->color?> <?php } ?> grid grid-cols-2 grid-rows-2">
                         <div class="text-left"><?= date('d', strtotime("$year-$month-$i")) ?></div>
                         <div class="text-right"><?= format_date("$year-$month-$i", 'E') ?></div>
 
                         <?php
-                if($i == 24 || $i == 12){
+                        foreach($has_raid as $raid){
                         ?>
-                    <div style="grid-area: 2 / 1 / 3 / 3;">
+
-                        <div>Raid XY</div>
+                                <a href="<?=$raid->link?>" class="group" style="grid-area: 2 / 1 / 3 / 3;">
-                        <div class="text-sm text-slate-500">(Heroisch)</div>
+                                    <div class="group-hover:text-<?=$raid->color?> bg-<?=$raid->color?>-200"><?=$raid->title?></div>
-                    </div>
+                                    <?php if($raid->difficulty): ?><div class="text-sm text-slate-500">(<?=$raid->difficulty?>)</div><?php endif; ?>
+                                </a>
                         <?php
+                            
                         }
                         ?>
                     </div>

theme/pages/roster.php

@@ -7,11 +7,18 @@ use WoWPress\Frontend\Icon;
 use WoWPress\Models\Character;
 
 global $widget_area;
+set_sidebar_status('top', false);
 
 $characters = Character::orderBy('rank')->get();
 get_header();
 
 ?>
+<div class="top-title flex flex-row gap-2" style="margin-top:calc(-1 * var(--wowp-gap))">
+<div class="text-3xl font-bold bg-glass shadow p-3 text-center w-full">
+    <?= $GLOBALS['wowpress']['page_title'] ?>
+</div>
+</div>
+
 <section id="primary">
     <main id="main">
         <div class="bg-glass shadow p-auto">
@@ -19,23 +26,23 @@ get_header();
                 <thead class="bg-glass">
                     <tr>
                         <td class="p-auto">Name</td>
-                        <td class="p-auto">Klasse</td>
+                        <td class="p-auto hidden lg:table-cell">Klasse</td>
-                        <td class="p-auto">Rang</td>
+                        <td class="p-auto hidden lg:table-cell">Rang</td>
-                        <td class="p-auto">Server</td>
+                        <td class="p-auto hidden lg:table-cell">Server</td>
-                        <td class="p-auto">Gilde</td>
+                        <td class="p-auto hidden lg:table-cell">Gilde</td>
                         <td class="p-auto">Aktionen</td>
                     </tr>
                 </thead>
                 <tbody class="bg-slate-900">
                     <?php foreach ($characters as $char) : ?>
-                        <tr class="text-<?= $char->color ?>">
+                        <tr class="text-<?= $char->color ?> even:bg-slate-800">
                             <td class="p-auto">
                                 <div class="flex flex-row gap-2 items-center">
                                     <img class="w-[42px] aspect-1 rounded-full" src="<?= $char->avatar ?>" alt="">
                                     <span><?= $char->name ?></span>
                                 </div>
                             </td>
-                            <td class="p-auto">
+                            <td class="p-auto hidden lg:table-cell">
                                 <div class="flex flex-row gap-2 items-center">
                                     <img class="w-[30px] aspect-1 rounded-full" src="<?= $char->class_icon ?>" alt="">
                                     <img class="w-[30px] aspect-1 rounded-full" src="<?= $char->spec_icon ?>" alt="">
@@ -43,9 +50,9 @@ get_header();
                                         <?= translate_string($char->spec) ?></span>
                                 </div>
                             </td>
-                            <td class="p-auto"><?= $char->rank ?></td>
+                            <td class="p-auto hidden lg:table-cell"><?= $char->rank ?></td>
-                            <td class="p-auto"><?= $char->realm ?></td>
+                            <td class="p-auto hidden lg:table-cell"><?= $char->realm ?></td>
-                            <td class="p-auto"><?= $char->guild ?></td>
+                            <td class="p-auto hidden lg:table-cell"><?= $char->guild ?></td>
 
                             <td class="p-auto">
                                 <div class="flex flex-row justify-end gap-2">

theme/pages/single_raid.php

@@ -0,0 +1,184 @@
+<?php
+
+use WoWPress\Frontend\Icon;
+use WoWPress\Frontend\ToggleButton;
+use WoWPress\Models\Raid;
+
+
+
+$raid = $GLOBALS['wowpress']['raid'];
+set_sidebar_status('top', false);
+set_sidebar_status('left', false);
+set_sidebar_status('right', false);
+
+get_header();
+?>
+<div class="top-title flex flex-col lg:flex-row gap-auto" style="margin-top:calc(-1 * var(--wowp-gap))">
+    <?php if ($raid->previous) : ?>
+        <a href="<?= $raid->previous->link ?>" class="btn btn-outline hidden lg:flex">Vorheriger</a>
+    <?php endif; ?>
+    <div class="text-3xl font-bold bg-glass shadow p-3 text-center w-full">
+        <?= $GLOBALS['wowpress']['page_title'] ?>
+    </div>
+    <?php if ($raid->next) : ?>
+        <a href="<?= $raid->next->link ?>" class="btn btn-outline hidden lg:flex">Nächster</a>
+    <?php endif; ?>
+</div>
+<section id="primary">
+    <main id="main">
+        <div class="flex flex-col lg:flex-row gap-auto">
+            <div class="bg-glass shadow p-auto w-full lg:w-1/5 order-2 lg:order-1">
+                <div class="grid text-center gap-1">
+                    <div class="bg-<?= $raid->color ?> text-black text-2xl "><?= format_date($raid->start, "EEEE") ?></div>
+                    <div class="border border-<?= $raid->color ?>">
+                        <div class="text-3xl p-auto "><?= format_date($raid->start, "dd. MMMM") ?></div>
+                    </div>
+                    <div class="border border-<?= $raid->color ?> p-2">Start: <?= format_date($raid->start, "HH:mm") ?></div>
+                    <div class="border border-<?= $raid->color ?> p-2">Ende: <?= format_date($raid->end, "HH:mm") ?></div>
+                    <?php if ($raid->difficulty) : ?>
+                        <div class="border border-<?= $raid->color ?> p-2"><?= $raid->difficulty ?></div>
+                    <?php endif; ?>
+                </div>
+            </div>
+            <div class="w-full flex flex-col gap-auto order-3 lg:order-2">
+                <div class="bg-glass shadow p-auto">
+                    <h3 class="text-xl font-bold">Informationen:</h3>
+                </div>
+                <div class="flex flex-col lg:flex-row gap-auto">
+                    <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                        <h3 class="text-xl font-bold text-center">Bosse</h3>
+                        <div class="grid gap-auto">
+                            <button class="btn btn-outline btn-alliance">Alle</button>
+                            <button class="btn btn-outline btn-priest">Fahrs'tuhl der Raidzerstörer</button>
+                            <button class="btn btn-outline btn-priest">Hogger</button>
+                            <button class="btn btn-outline btn-priest">Sylvanas linker Zeh</button>
+                            <button class="btn btn-outline btn-priest">RC Loot Council (Endboss)</button>
+
+                        </div>
+                    </div>
+                    <div class="w-full grid grid-cols-1 lg:grid-cols-4 gap-auto">
+                        <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                            <h3 class="text-xl font-bold text-center">Tank</h3>
+                            <button class="btn btn-outline btn-deathknight">Zauron</button>
+                            <button class="btn btn-outline btn-paladin">Moodyblues</button>
+
+                        </div>
+                        <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                            <h3 class="text-xl font-bold text-center">Heal</h3>
+                            <button class="btn btn-outline btn-monk">Pandacetamol</button>
+                            
+                        </div>
+                        <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                            <h3 class="text-xl font-bold text-center">Range</h3>
+                            <button class="btn btn-outline btn-hunter">Bleihagel</button>
+
+                        </div>
+                        <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                            <h3 class="text-xl font-bold text-center">Melee</h3>
+                            <button class="btn btn-outline btn-shaman">Yorndar</button>
+
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="flex flex-col gap-auto w-full lg:w-1/5 order-1 lg:order-3">
+                <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                    <h3 class="text-xl font-bold text-center">Status</h3>
+                    <div class="text-center text-monk flex flex-row gap-auto justify-center p-auto border border-monk">
+                        <?= Icon::get('c-check') ?>
+                        <span>Angemeldet</span>
+                    </div>
+                </div>
+
+                <div class="bg-glass shadow p-auto flex flex-col gap-auto">
+                    <h3 class="text-xl font-bold text-center">Status ändern</h3>
+                    <div class="grid grid-cols-2 gap-auto">
+                        <div class="col-span-2 text-center">Anwesenheit</div>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_status',
+                            'text' => 'Anwesend',
+                            'color' => 'monk',
+                            'icon_yes' => 'o-check-circle',
+                            'row' => false,
+                        ]))->render() ?>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_status',
+                            'text' => 'Abwesend',
+                            'color' => 'deathknight',
+                            'icon_yes' => 'o-x-circle',
+                            'row' => false,
+                        ]))->render() ?>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_status',
+                            'text' => 'Ersatzbank',
+                            'color' => 'druid',
+                            'icon_yes' => 'o-question-mark-circle',
+                            'row' => false,
+                        ]))->render() ?>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_status',
+                            'text' => 'Verspätet',
+                            'color' => 'demonhunter',
+                            'icon_yes' => 'o-clock',
+                            'row' => false,
+                        ]))->render() ?>
+                        <div class="col-span-2 text-center">Rolle</div>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_role',
+                            'text' => 'Tank',
+                            'color' => 'priest',
+                            'icon_yes' => 'o-shield-exclamation',
+                            'row' => false,
+                        ]))->render() ?>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_role',
+                            'text' => 'Heal',
+                            'color' => 'priest',
+                            'icon_yes' => 'o-heart',
+                            'row' => false,
+                        ]))->render() ?>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_role',
+                            'text' => 'Ranged',
+                            'color' => 'priest',
+                            'icon_yes' => 'o-bolt',
+                            'row' => false,
+                        ]))->render() ?>
+                        <?= (new ToggleButton([
+                            'type' => 'radio',
+                            'name' => 'raid_role',
+                            'text' => 'Melee',
+                            'color' => 'priest',
+                            'icon_yes' => 'o-hand-raised',
+                            'row' => false, 
+                        ]))->render() ?>
+                    </div>
+                    <button class="btn btn-outline btn-monk">
+                        <?=Icon::get('o-paper-airplane')?>
+                        <span>Status Speichern</span>
+                    </button>
+                </div>
+            </div>
+        </div>
+        <div class="w-full order-4 bg-glass shadow p-auto flex flex-col gap-auto">
+            <h3 class="text-xl font-bold text-center">Keine Rückmeldung</h3>
+            <div class="grid grid-cols-1 lg:grid-cols-12 gap-auto">
+                <button class="btn btn-outline btn-evoker">Yorndragon</button>
+                <button class="btn btn-outline btn-mage">Aye</button>
+                <button class="btn btn-outline btn-warrior">Stormranger</button>
+                <button class="btn btn-outline btn-druid">Kaldori</button>
+                <button class="btn btn-outline btn-shaman">Nokin</button>
+
+            </div>
+            </div>
+    </main>
+</section>
+<?php
+get_footer();

theme/theme.json

@@ -93,6 +93,11 @@
 					"slug": "warrior",
 					"color": "#C69B6D",
 					"name": "Warrior"
+				},
+				{
+					"slug": "alliance",
+					"color": "#f7941e",
+					"name": "Allianz"
 				}
 			]
 		},

theme/wowpress/Api/BattleNet.php

@@ -61,8 +61,12 @@ class BattleNet extends Api{
             'access_token' => $this->bearer()
         ], false, $timeout);
 
-        var_dump($data);
+        if(!empty($data['code']) && $data['code'] == 403){
-        exit;
+       #    var_dump($data);
+       #    exit;
+       return false;
+        }
+
 
         return $data;
     }

theme/wowpress/Database/CreateCharacterTable.php

@@ -2,7 +2,7 @@
 
 namespace WoWPress\Database;
 
-class CreateRaidTable extends CreateTable
+class CreateCharacterTable extends CreateTable
 {
     
     public static $table_name = "characters";
@@ -11,8 +11,10 @@ class CreateRaidTable extends CreateTable
         'realm' =>  'text NOT NULL',
         'class' =>  "text DEFAULT Adventurer",
         'spec'  =>  "text DEFAULT Brave",
+        'id_blizz' => 'mediumint(9)',
         'guild' =>  "text",
         'rank' =>   'tinyint DEFAULT 99',
+        'user_id' => 'mediumint(9)',
     ];
 
 }

theme/wowpress/Database/CreateRaidTable.php

@@ -2,7 +2,7 @@
 
 namespace WoWPress\Database;
 
-class CreateCharacterTable extends CreateTable
+class CreateRaidTable extends CreateTable
 {
     
     public static $table_name = "raids";

theme/wowpress/Frontend/ToggleButton.php

@@ -0,0 +1,51 @@
+<?php
+
+namespace WoWPress\Frontend;
+
+class ToggleButton{
+
+    private $id;
+    public $row = true;
+    public $icons = true;
+    public $gray = true;
+    public $type = "checkbox";
+    public $name;
+    public $checked;
+    public $disabled;
+    public $text;
+    public $icon_yes = "o-check-badge";
+    public $icon_no = "o-no-symbol";
+
+    public $color_yes = "monk";
+    public $color_no = "monk";
+
+    public function __construct($args)
+    {
+    
+        foreach($args as $key => $value){
+            if(property_exists(self::class,$key)){
+                $this->$key = $value;
+            }
+
+            if(!empty($args['color'])){
+                $this->color_yes = $args['color'];
+                $this->color_no = $args['color'];
+
+            }
+
+            if(empty($this->id)){
+                $this->id = uniqid();
+            }
+            if(empty($this->name)){
+                $this->name = uniqid();
+            }
+        }
+
+    }
+
+
+    public function render(){
+        require(get_template_directory()."/components/toggle-button.php");
+    }
+
+}

theme/wowpress/Models/Character.php

@@ -29,9 +29,12 @@ class Character extends Model
         $this->api = new BattleNet($id,$key);
     }
 
-    protected function sanitize($string)
+    protected function sanitize($string,$delimiter_space="")
     {
-        return strtolower(str_replace(" ", "", $string));
+        $string = strtolower(str_replace(" ", $delimiter_space, $string));
+        $string = strtolower(str_replace("'", "", $string));
+
+        return $string;
     }
 
     public function getRankAttribute($rank){
@@ -69,14 +72,15 @@ class Character extends Model
 
     public function updateFromAPI()
     {
-        $char_from_api = $this->api->getCharacter($this->name,$this->realm);
+        $realm = $this->sanitize($this->realm,"-");
+        $char_from_api = $this->api->getCharacter($this->name,$realm);
         if(!array_key_exists('character_class',$char_from_api)){
             return false;
         }
         $this->class = $char_from_api['character_class']['name'];
         $this->spec = $char_from_api['active_spec']['name'];
-
+        $this->id_blizz = $char_from_api['id'];
-        $guild_data = $this->api->getGuildRank($this->name,$this->realm);
+        $guild_data = $this->api->getGuildRank($this->name,$realm);
         $this->guild = $guild_data['guild'];
         $this->rank = $guild_data['rank'];
         
@@ -85,22 +89,19 @@ class Character extends Model
     }
 
     public function updateMedia($force = false){
+        if(empty($this->id_blizz)){
+            return false;
+        }
         $character_dir = wp_upload_dir()['basedir']."/characters/".$this->ID."/";
         if(!is_dir($character_dir)){
             mkdir($character_dir,0777,true);
         }
 
-        $char_from_api = $this->api->getMedia($this->name,$this->realm,$force?-1:360);
+        $id = $this->id_blizz;
-        if(empty($char_from_api['assets'])){
+        $mod = $id % 256;
-            return $char_from_api;
+        $realm = $this->sanitize($this->realm,'-');
-        }
+        $img_url = "https://render.worldofwarcraft.com/eu/character/$realm/$mod/$id-avatar.jpg";
-        foreach($char_from_api['assets'] as $asset){
+        file_put_contents($character_dir."avatar.jpg",file_get_contents($img_url));
-            switch($asset['key']){
-                case 'avatar':
-                    file_put_contents($character_dir."avatar.jpg",file_get_contents($asset['value']));
-                    break;
-            }
-        }
     }
 
     public function getAvatarAttribute(){

theme/wowpress/Models/Raid.php

@@ -13,6 +13,8 @@ class Raid extends Model
     protected $primaryKey = 'ID';
     protected $guarded = ['ID'];
 
+    private $api;
+
     public function __construct($attrs = [])
     {
         parent::__construct($attrs);
@@ -27,4 +29,42 @@ class Raid extends Model
     }
 
 
+    public function getColorAttribute($type=""){
+        switch($this->difficulty){
+            case 'Normal': return "shaman";
+            case 'Heroic': return "warlock";
+            case 'Mythic': return "deathknight";
+            case 'Teamspeak': return "hunter";
+            default: return "priest";
+        }
+    }
+
+    public function getLinkAttribute(){
+        return "/raid/".$this->ID;
+    }
+
+
+    public function getPreviousAttribute(){
+        $id = $this->ID;
+        while($id){
+            $raid = Raid::find(--$id);
+            if(!empty($raid->ID)){
+                return $raid;
+            }
+        }
+        return false;
+    }
+
+
+    public function getNextAttribute(){
+        $id = $this->ID;
+        while($id <= Raid::max('ID')){
+            $raid = Raid::find(++$id);
+            if(!empty($raid->ID)){
+                return $raid;
+            }
+        }
+        return false;
+    }
+
 }