re-organized test data, added basic slider for media
This commit is contained in:
Are0h
parent
5026fc168e
commit
79fbc2437f
8 changed files with 371 additions and 274 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -4,6 +4,8 @@ dist
|
|||
.nova
|
||||
.cache
|
||||
.DS_Store
|
||||
*.sublime-project
|
||||
*.sublime-workspace
|
||||
assets
|
||||
vendor
|
||||
|
||||
|
|
|
|||
103
data/archives.json
Normal file
103
data/archives.json
Normal file
|
|
@ -0,0 +1,103 @@
|
|||
{
|
||||
"archives": [
|
||||
{
|
||||
"year": "2020",
|
||||
"year_data": [
|
||||
{
|
||||
"month": "06",
|
||||
"full_month": "June",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 1",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 2",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"month": "05",
|
||||
"full_month": "May",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 3",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 4",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"year": "2019",
|
||||
"year_data": [
|
||||
{
|
||||
"month": "04",
|
||||
"full_month": "April",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 5",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 6",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"year": "2018",
|
||||
"year_data": [
|
||||
{
|
||||
"month": "06",
|
||||
"full_month": "June",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 7",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 8",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,18 +1,8 @@
|
|||
{
|
||||
"title": "This is Fipamo",
|
||||
"welcome_message": "Hey there. So this is a long ass title to see how it breaks",
|
||||
"keywords": "creative technoglogist, graphic design, web development, designer developer, social thought, political discussion, music producer, creative culture, black creative, black geek",
|
||||
"description": "The home site of Creative Technologist, music maker, and social philoshoper, Ro. Ha, I know. Me too.",
|
||||
"dynamicRender": "true",
|
||||
"base_path": "/src/front/",
|
||||
"default_bg": "/assets/images/global/default-bg.jpg",
|
||||
"default_avi": "/assets/images/global/default-avi.png",
|
||||
"index-content": "<img src='/assets/images/global/default-avi.png'><br>The path of the <a href='#'>righteous</a> man is beset on ALL sides by the iniquities of the selfish and the tyranny of evil men. Blessed is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother's keeper and the finder of lost children. <code>And I will strike down upon thee with great vengeance</code> and furious anger those who would attempt to poison and destroy My brothers. And you will know My name is the Lord when I lay My vengeance upon thee.",
|
||||
"content": "<img src='/assets/images/global/default-avi.png'><br>The path of the <a href='#'>righteous</a> man is beset on ALL sides by the iniquities of the selfish and the tyranny of evil men. Blessed is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother's keeper and the finder of lost children. <code>And I will strike down upon thee with great vengeance</code> and furious anger those who would attempt to poison and destroy My brothers. And you will know My name is the Lord when I lay My vengeance upon thee.<pre><code>server\n { listen 80; server_name yourcoolassdomain.com; \n\tlocation / \n\t\t{ \n\t\t\tproxy_pass https://127.0.0.1:2314; \n\t\t\tproxy_http_version 1.1; \n\t\t\tproxy_set_header \n\t\t\tUpgrade $http_upgrade; \n\t\t\tproxy_set_header Connection 'upgrade'; \n\t\t\tproxy_set_header Host $host; \n\t\t\tproxy_cache_bypass $http_upgrade; \n\t\t} \n\t} </code></pre>",
|
||||
"bucket": [{ "item": "one" }, { "item": "two" }, { "item": "three" }],
|
||||
"tag_list": [
|
||||
{ "title": "Swaggy Disgust", "slug": "swaggy-disgust", "path": "2020/06" }
|
||||
],
|
||||
"feature": "/assets/video/blog/2022/01/one.mp4, /assets/images/blog/2022/03/01.jpg, /assets/images/blog/2022/03/02.jpg, /assets/images/blog/2022/03/03.jpg",
|
||||
"files": "/assets/docs/blog/2022/01/one.pdf, /assets/docs/blog/2022/01/two.txt, /assets/docs/blog/2022/01/three.rtf, /assets/sound/blog/2022/01/one.mp3, /assets/sound/blog/2022/01/two.mp3,",
|
||||
"meta": {
|
||||
"who": "Are0h",
|
||||
"when": "6 hours ago",
|
||||
|
|
@ -25,29 +15,6 @@
|
|||
{ "label": " tv", "slug": "tv" }
|
||||
]
|
||||
},
|
||||
"menu": [
|
||||
{
|
||||
"title": "This is the first page",
|
||||
"id": "3",
|
||||
"slug": "page-one",
|
||||
"uuid": "b60d6843-e957-43ac-8425-65145142236c",
|
||||
"path": "2021/04"
|
||||
},
|
||||
{
|
||||
"title": "This is the second page",
|
||||
"id": "4",
|
||||
"slug": "page-two",
|
||||
"uuid": "b60d6843-e957-43ac-8425-65145142236d",
|
||||
"path": "2021/04"
|
||||
},
|
||||
{
|
||||
"title": "This is the second page",
|
||||
"id": "5",
|
||||
"slug": "page-three",
|
||||
"uuid": "b60d6843-e957-43ac-8425-65145142236d",
|
||||
"path": "2021/04"
|
||||
}
|
||||
],
|
||||
"recent_posts": [
|
||||
{
|
||||
"title": "Teyonah Parris",
|
||||
|
|
@ -119,106 +86,5 @@
|
|||
"slug": "michael-mf-burnam",
|
||||
"content": "Yall acting like Michael won/'t give you those hands."
|
||||
}
|
||||
],
|
||||
"archives": [
|
||||
{
|
||||
"year": "2020",
|
||||
"year_data": [
|
||||
{
|
||||
"month": "06",
|
||||
"full_month": "June",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 1",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 2",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"month": "05",
|
||||
"full_month": "May",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 3",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 4",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"year": "2019",
|
||||
"year_data": [
|
||||
{
|
||||
"month": "04",
|
||||
"full_month": "April",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 5",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 6",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"year": "2018",
|
||||
"year_data": [
|
||||
{
|
||||
"month": "06",
|
||||
"full_month": "June",
|
||||
"count": 1,
|
||||
"pages": [
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 7",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"uuid": "29338b67-68d9-4b05-99ac-8d031d27e95c",
|
||||
"title": "Swaggy Disgust 8",
|
||||
"slug": "swaggy-disgust",
|
||||
"content": "My man looks so fed up right now"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
37
data/settings.json
Normal file
37
data/settings.json
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
{
|
||||
"title": "This is Fipamo",
|
||||
"welcome_message": "Hey there. So this is a long ass title to see how it breaks",
|
||||
"keywords": "creative technoglogist, graphic design, web development, designer developer, social thought, political discussion, music producer, creative culture, black creative, black geek",
|
||||
"description": "The home site of Creative Technologist, music maker, and social philoshoper, Ro. Ha, I know. Me too.",
|
||||
"dynamicRender": "true",
|
||||
"base_path": "/src/front/",
|
||||
"default_bg": "/assets/images/global/default-bg.jpg",
|
||||
"default_avi": "/assets/images/global/default-avi.png",
|
||||
"bucket": [{ "item": "one" }, { "item": "two" }, { "item": "three" }],
|
||||
"tag_list": [
|
||||
{ "title": "Swaggy Disgust", "slug": "swaggy-disgust", "path": "2020/06" }
|
||||
],
|
||||
"menu": [
|
||||
{
|
||||
"title": "This is the first page",
|
||||
"id": "3",
|
||||
"slug": "page-one",
|
||||
"uuid": "b60d6843-e957-43ac-8425-65145142236c",
|
||||
"path": "2021/04"
|
||||
},
|
||||
{
|
||||
"title": "This is the second page",
|
||||
"id": "4",
|
||||
"slug": "page-two",
|
||||
"uuid": "b60d6843-e957-43ac-8425-65145142236d",
|
||||
"path": "2021/04"
|
||||
},
|
||||
{
|
||||
"title": "This is the second page",
|
||||
"id": "5",
|
||||
"slug": "page-three",
|
||||
"uuid": "b60d6843-e957-43ac-8425-65145142236d",
|
||||
"path": "2021/04"
|
||||
}
|
||||
]
|
||||
}
|
||||
243
index.php
243
index.php
|
|
@ -3,121 +3,146 @@
|
|||
require "vendor/autoload.php";
|
||||
class StartKit
|
||||
{
|
||||
public function __construct()
|
||||
{
|
||||
$settings = json_decode(file_get_contents("./package.json"), true);
|
||||
$theme = $settings["config"]["current_theme"];
|
||||
new ThemeEngine(
|
||||
"src/themes/theme-" . $theme,
|
||||
"/src/themes/theme-" . $theme . "/" . $theme
|
||||
);
|
||||
}
|
||||
public function __construct()
|
||||
{
|
||||
$settings = json_decode(file_get_contents("./package.json"), true);
|
||||
$theme = $settings["config"]["current_theme"];
|
||||
new ThemeEngine(
|
||||
"src/themes/theme-" . $theme,
|
||||
"/src/themes/theme-" . $theme . "/" . $theme
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class ThemeEngine
|
||||
{
|
||||
public $data = [];
|
||||
public $loader;
|
||||
public $twig;
|
||||
public function __construct(string $themePath, string $themeAssetPath)
|
||||
{
|
||||
$this->themePath = $themePath;
|
||||
$this->themeAssetPath = $themeAssetPath;
|
||||
$path = explode("/", $themeAssetPath);
|
||||
$this->themeFolder = $path[4];
|
||||
$this->data = json_decode(file_get_contents("./config.json"), true);
|
||||
$this->loader = new \Twig\Loader\FilesystemLoader(
|
||||
$themePath . "/" . $path[4]
|
||||
);
|
||||
$this->twig = new \Twig\Environment($this->loader, []);
|
||||
$this->router($_SERVER["REQUEST_URI"]);
|
||||
}
|
||||
|
||||
public function router(string $request)
|
||||
{
|
||||
$pageInfo = [
|
||||
"keywords" => $this->data["keywords"],
|
||||
"description" => $this->data["description"],
|
||||
"image" => $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
];
|
||||
|
||||
$menu = $this->data["menu"];
|
||||
switch ($request) {
|
||||
case "/":
|
||||
$recent = $this->data["recent_posts"];
|
||||
$featured = $this->data["featured_posts"];
|
||||
$template = "index.twig";
|
||||
$content = $this->data["index-content"];
|
||||
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "This is Fipamo",
|
||||
"dynamicRender" => $this->data["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"recent" => $recent,
|
||||
"featured" => $featured,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
"content" => $content,
|
||||
];
|
||||
break;
|
||||
case "/page":
|
||||
$content = $this->data["content"];
|
||||
$meta = $this->data["meta"];
|
||||
$template = $request . ".twig";
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "Page Title",
|
||||
"dynamicRender" => $this->data["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"content" => $content,
|
||||
"meta" => $meta,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
];
|
||||
break;
|
||||
case "/tags":
|
||||
$tags = $this->data["tag_list"];
|
||||
$template = $this->themeFolder . "/tags.twig";
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "Pages Tagged as Tag",
|
||||
"dynamicRender" => $this->data["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"tag_list" => $tags,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
];
|
||||
break;
|
||||
case "/archive":
|
||||
$archive = $this->data["archives"];
|
||||
$template = $this->themeFolder . "/archive.twig";
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "Archive",
|
||||
"dynamicRender" => $this->data["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"archives" => $archive,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
];
|
||||
break;
|
||||
default:
|
||||
http_response_code(404);
|
||||
require __DIR__ . "/views/404.php";
|
||||
break;
|
||||
public $data = [];
|
||||
public $loader;
|
||||
public $twig;
|
||||
public function __construct(string $themePath, string $themeAssetPath)
|
||||
{
|
||||
$this->themePath = $themePath;
|
||||
$this->themeAssetPath = $themeAssetPath;
|
||||
$path = explode("/", $themeAssetPath);
|
||||
$this->themeFolder = $path[4];
|
||||
$this->settings = json_decode(file_get_contents("./data/settings.json"), true);
|
||||
$this->posts = json_decode(file_get_contents("./data/posts.json"), true);
|
||||
$this->archives = json_decode(file_get_contents("./data/archives.json"), true);
|
||||
$this->loader = new \Twig\Loader\FilesystemLoader(
|
||||
$themePath . "/" . $path[4]
|
||||
);
|
||||
$this->twig = new \Twig\Environment($this->loader, []);
|
||||
$this->router($_SERVER["REQUEST_URI"]);
|
||||
}
|
||||
|
||||
echo $this->twig->render($template, $pageOptions);
|
||||
}
|
||||
public function router(string $request)
|
||||
{
|
||||
$pageInfo = [
|
||||
"keywords" => $this->settings["keywords"],
|
||||
"description" => $this->settings["description"],
|
||||
"image" => $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
];
|
||||
|
||||
$featureList = explode(",", $this->posts["feature"]);
|
||||
$fileList = explode(",", $this->posts["files"]);
|
||||
|
||||
$images = [];
|
||||
$files = [];
|
||||
foreach ($featureList as $file) {
|
||||
$item = trim($file);
|
||||
$ext = pathinfo($item, PATHINFO_EXTENSION);
|
||||
if ($item != null || $item != "") {
|
||||
array_push($images, ["file" => $item, "type" => trim($ext)]);
|
||||
}
|
||||
}
|
||||
|
||||
foreach ($fileList as $file) {
|
||||
$item = trim($file);
|
||||
$ext = pathinfo($item, PATHINFO_EXTENSION);
|
||||
if ($item != null || $item != "") {
|
||||
array_push($files, ["file" => $item, "type" => trim($ext)]);
|
||||
}
|
||||
}
|
||||
|
||||
$menu = $this->settings["menu"];
|
||||
switch ($request) {
|
||||
case "/":
|
||||
$recent = $this->posts["recent_posts"];
|
||||
$featured = $this->posts["featured_posts"];
|
||||
$template = "index.twig";
|
||||
$content = $this->posts["index-content"];
|
||||
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "This is Fipamo",
|
||||
"dynamicRender" => $this->settings["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"recent" => $recent,
|
||||
"featured" => $featured,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
"content" => $content,
|
||||
];
|
||||
break;
|
||||
case "/page":
|
||||
$content = $this->posts["content"];
|
||||
$meta = $this->posts["meta"];
|
||||
$template = $request . ".twig";
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "Page Title",
|
||||
"dynamicRender" => $this->settings["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"content" => $content,
|
||||
"meta" => $meta,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
"media" => $images,
|
||||
"files" => $files,
|
||||
];
|
||||
break;
|
||||
case "/tags":
|
||||
$tags = $this->settings["tag_list"];
|
||||
$template = $this->themeFolder . "/tags.twig";
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "Pages Tagged as Tag",
|
||||
"dynamicRender" => $this->settings["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"tag_list" => $tags,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
];
|
||||
break;
|
||||
case "/archive":
|
||||
$archive = $this->archives;
|
||||
$template = $this->themeFolder . "/archive.twig";
|
||||
$pageOptions = [
|
||||
"debug" => true, //for theme kit
|
||||
"theme" => $this->themeFolder, //for theme kit
|
||||
"title" => "Archive",
|
||||
"dynamicRender" => $this->settings["dynamicRender"],
|
||||
"background" =>
|
||||
$this->themeAssetPath . "/assets/images/global/default-bg.jpg",
|
||||
"archives" => $archive,
|
||||
"info" => $pageInfo,
|
||||
"menu" => $menu,
|
||||
];
|
||||
break;
|
||||
default:
|
||||
http_response_code(404);
|
||||
require __DIR__ . "/views/404.php";
|
||||
break;
|
||||
}
|
||||
|
||||
echo $this->twig->render($template, $pageOptions);
|
||||
}
|
||||
}
|
||||
|
||||
new StartKit();
|
||||
|
|
|
|||
|
|
@ -3,10 +3,18 @@ export default class Base {
|
|||
// constructor
|
||||
//--------------------------
|
||||
constructor() {
|
||||
this.currentSlide = 0;
|
||||
this.slides = document.querySelectorAll("#media .slide");
|
||||
this.start();
|
||||
}
|
||||
start() {
|
||||
console.log("Connected like F.E.");
|
||||
if (this.slides.length > 1) {
|
||||
this.slideInterval = setInterval(() => {
|
||||
this.slides[this.currentSlide].className = "slide hide";
|
||||
this.currentSlide = (this.currentSlide + 1) % this.slides.length;
|
||||
this.slides[this.currentSlide].className = "slide show";
|
||||
}, 3000);
|
||||
}
|
||||
}
|
||||
//--------------------------
|
||||
// methods
|
||||
|
|
|
|||
|
|
@ -20,10 +20,47 @@
|
|||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||
<meta property="og:image" content="{{info["image"]}}" />
|
||||
<meta name="twitter:image" content="{{info["image"]}}" />
|
||||
<link rel="stylesheet" type="text/css" href="{{ assetPath~"css/base.css?=adfafd" }}">
|
||||
<link rel="stylesheet" type="text/css" href="{{ assetPath~"css/base.css?=dfvbghh" }}">
|
||||
</head>
|
||||
<body>
|
||||
<!--
|
||||
<header style="background: url({{ background }}) no-repeat center center; background-size: cover">
|
||||
-->
|
||||
<header>
|
||||
<div id="media">
|
||||
{% if media|length > 1 %}
|
||||
{% for item in media %}
|
||||
{% if item.type == "mp4"%}
|
||||
<div id="{{loop.index0}}" class="slide">
|
||||
<video controls autoplay muted>
|
||||
|
||||
<source src="{{item.file}}" type="video/mp4">
|
||||
|
||||
Please get a better browser. They're free.
|
||||
</video>
|
||||
</div>
|
||||
{% else %}
|
||||
<div id="{{loop.index0}}" class="slide hide" style="background: url({{ item.file }}) no-repeat center center / cover"></div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% if media[0] != '' %}
|
||||
{% if media[0].type == "mp4"%}
|
||||
<div id="0" class="slide">
|
||||
<video controls autoplay muted>
|
||||
|
||||
<source src="{{media[0].file}}" type="video/mp4">
|
||||
|
||||
Please get a better browser. They're free.
|
||||
</video>
|
||||
</div>
|
||||
{% else %}
|
||||
<div id="0" class="slide" style="background: url({{ media[0].file }}) no-repeat center center / cover"></div>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<nav>
|
||||
{% apply spaceless %}
|
||||
<div class="left">
|
||||
|
|
@ -70,6 +107,6 @@
|
|||
© 2020 By Fipamo
|
||||
</div>
|
||||
</footer>
|
||||
<script src="{{ assetPath~"scripts/start.min.js" }}" type="text/javascript"></script>
|
||||
<script src="{{ assetPath~"scripts/ThemeStart.js" }}" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -49,34 +49,53 @@ header
|
|||
height: 90%
|
||||
width: 100%
|
||||
border-top: $white 3px solid
|
||||
nav
|
||||
width: 97%
|
||||
margin: 10px auto
|
||||
color: $primary
|
||||
.left,.right
|
||||
width: 50%
|
||||
display: inline-block
|
||||
vertical-align: top
|
||||
.left
|
||||
a.logo-link
|
||||
border-bottom: none
|
||||
margin: 0 0 20px 0
|
||||
display: block
|
||||
#logo
|
||||
width: 50px
|
||||
border-bottom: none
|
||||
.right
|
||||
text-align: right
|
||||
a.menu-link
|
||||
background: $secondary
|
||||
margin-bottom: 4px
|
||||
padding: 3px
|
||||
border-radius: 2px
|
||||
#media
|
||||
width: 100%
|
||||
height: 90%
|
||||
position: absolute
|
||||
.slide
|
||||
@include object-transitions(.7s)
|
||||
width: 100%
|
||||
height: 100%
|
||||
position: absolute
|
||||
.hide
|
||||
opacity: 0
|
||||
.show
|
||||
opacity: 1
|
||||
video
|
||||
width: 100%
|
||||
height: 100%
|
||||
object-fit: cover
|
||||
nav
|
||||
width: 97%
|
||||
margin: 10px auto
|
||||
z-index: 1000
|
||||
position: relative
|
||||
color: $primary
|
||||
.left,.right
|
||||
width: 50%
|
||||
display: inline-block
|
||||
font-size: 0.8em
|
||||
border-bottom: none
|
||||
&:hover
|
||||
vertical-align: top
|
||||
.left
|
||||
a.logo-link
|
||||
border-bottom: none
|
||||
margin: 0 0 20px 0
|
||||
display: block
|
||||
#logo
|
||||
width: 50px
|
||||
border-bottom: none
|
||||
.right
|
||||
text-align: right
|
||||
a.menu-link
|
||||
background: $secondary
|
||||
margin-bottom: 4px
|
||||
padding: 3px
|
||||
border-radius: 2px
|
||||
display: inline-block
|
||||
font-size: 0.8em
|
||||
border-bottom: none
|
||||
&:hover
|
||||
background: $secondary
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue