are0h
/
FipamoThemeKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

re-organized test data, added basic slider for media

Browse Source
develop
Are0h 3 years ago
parent 5026fc168e
commit 79fbc2437f
8 changed files with 369 additions and 272 deletions
Show Stats Download Patch File Download Diff File

2
.gitignore vendored
Unescape Escape View File

@ -4,6 +4,8 @@ dist
.nova .nova
.cache .cache
.DS_Store .DS_Store
*.sublime-project
*.sublime-workspace
assets assets
vendor vendor

103
data/archives.json
Unescape Escape View 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"
}
]
}
]
}
]
}

138
config.json → data/posts.json
Unescape Escape View File

@ -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.", "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>", "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" }], "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",
"tag_list": [ "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,",
{ "title": "Swaggy Disgust", "slug": "swaggy-disgust", "path": "2020/06" }
],
"meta": { "meta": {
"who": "Are0h", "who": "Are0h",
"when": "6 hours ago", "when": "6 hours ago",
@ -25,29 +15,6 @@
{ "label": " tv", "slug": "tv" } { "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": [ "recent_posts": [
{ {
"title": "Teyonah Parris", "title": "Teyonah Parris",
@ -119,106 +86,5 @@
"slug": "michael-mf-burnam", "slug": "michael-mf-burnam",
"content": "Yall acting like Michael won/'t give you those hands." "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
Unescape Escape View 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"
}
]
}

239
index.php
Unescape Escape View File

@ -3,121 +3,146 @@
require "vendor/autoload.php"; require "vendor/autoload.php";
class StartKit class StartKit
{ {
public function __construct() public function __construct()
{ {
$settings = json_decode(file_get_contents("./package.json"), true); $settings = json_decode(file_get_contents("./package.json"), true);
$theme = $settings["config"]["current_theme"]; $theme = $settings["config"]["current_theme"];
new ThemeEngine( new ThemeEngine(
"src/themes/theme-" . $theme, "src/themes/theme-" . $theme,
"/src/themes/theme-" . $theme . "/" . $theme "/src/themes/theme-" . $theme . "/" . $theme
); );
} }
} }
class ThemeEngine class ThemeEngine
{ {
public $data = []; public $data = [];
public $loader; public $loader;
public $twig; public $twig;
public function __construct(string $themePath, string $themeAssetPath) public function __construct(string $themePath, string $themeAssetPath)
{ {
$this->themePath = $themePath; $this->themePath = $themePath;
$this->themeAssetPath = $themeAssetPath; $this->themeAssetPath = $themeAssetPath;
$path = explode("/", $themeAssetPath); $path = explode("/", $themeAssetPath);
$this->themeFolder = $path[4]; $this->themeFolder = $path[4];
$this->data = json_decode(file_get_contents("./config.json"), true); $this->settings = json_decode(file_get_contents("./data/settings.json"), true);
$this->loader = new \Twig\Loader\FilesystemLoader( $this->posts = json_decode(file_get_contents("./data/posts.json"), true);
$themePath . "/" . $path[4] $this->archives = json_decode(file_get_contents("./data/archives.json"), true);
); $this->loader = new \Twig\Loader\FilesystemLoader(
$this->twig = new \Twig\Environment($this->loader, []); $themePath . "/" . $path[4]
$this->router($_SERVER["REQUEST_URI"]); );
} $this->twig = new \Twig\Environment($this->loader, []);
$this->router($_SERVER["REQUEST_URI"]);
}
public function router(string $request) public function router(string $request)
{ {
$pageInfo = [ $pageInfo = [
"keywords" => $this->data["keywords"], "keywords" => $this->settings["keywords"],
"description" => $this->data["description"], "description" => $this->settings["description"],
"image" => $this->themeAssetPath . "/assets/images/global/default-bg.jpg", "image" => $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
]; ];
$menu = $this->data["menu"]; $featureList = explode(",", $this->posts["feature"]);
switch ($request) { $fileList = explode(",", $this->posts["files"]);
case "/":
$recent = $this->data["recent_posts"];
$featured = $this->data["featured_posts"];
$template = "index.twig";
$content = $this->data["index-content"];
$pageOptions = [ $images = [];
"debug" => true, //for theme kit $files = [];
"theme" => $this->themeFolder, //for theme kit foreach ($featureList as $file) {
"title" => "This is Fipamo", $item = trim($file);
"dynamicRender" => $this->data["dynamicRender"], $ext = pathinfo($item, PATHINFO_EXTENSION);
"background" => if ($item != null || $item != "") {
$this->themeAssetPath . "/assets/images/global/default-bg.jpg", array_push($images, ["file" => $item, "type" => trim($ext)]);
"recent" => $recent, }
"featured" => $featured, }
"info" => $pageInfo,
"menu" => $menu, foreach ($fileList as $file) {
"content" => $content, $item = trim($file);
]; $ext = pathinfo($item, PATHINFO_EXTENSION);
break; if ($item != null || $item != "") {
case "/page": array_push($files, ["file" => $item, "type" => trim($ext)]);
$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;
}
echo $this->twig->render($template, $pageOptions); $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(); new StartKit();

10
src/themes/theme-fipamo-default/com/Base.js
Unescape Escape View File

@ -3,10 +3,18 @@ export default class Base {
// constructor // constructor
//-------------------------- //--------------------------
constructor() { constructor() {
this.currentSlide = 0;
this.slides = document.querySelectorAll("#media .slide");
this.start(); this.start();
} }
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 // methods

41
src/themes/theme-fipamo-default/fipamo-default/frame.twig
Unescape Escape View File

@ -20,10 +20,47 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta property="og:image" content="{{info["image"]}}" /> <meta property="og:image" content="{{info["image"]}}" />
<meta name="twitter: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> </head>
<body> <body>
<!--
<header style="background: url({{ background }}) no-repeat center center; background-size: cover"> <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> <nav>
{% apply spaceless %} {% apply spaceless %}
<div class="left"> <div class="left">
@ -70,6 +107,6 @@
© 2020 By Fipamo © 2020 By Fipamo
</div> </div>
</footer> </footer>
<script src="{{ assetPath~"scripts/start.min.js" }}" type="text/javascript"></script> <script src="{{ assetPath~"scripts/ThemeStart.js" }}" type="text/javascript"></script>
</body> </body>
</html> </html>

71
src/themes/theme-fipamo-default/styles/_structure.sass
Unescape Escape View File

@ -49,34 +49,53 @@ header
height: 90% height: 90%
width: 100% width: 100%
border-top: $white 3px solid border-top: $white 3px solid
nav #media
width: 97% width: 100%
margin: 10px auto height: 90%
color: $primary position: absolute
.left,.right .slide
width: 50% @include object-transitions(.7s)
display: inline-block width: 100%
vertical-align: top height: 100%
.left position: absolute
a.logo-link .hide
border-bottom: none opacity: 0
margin: 0 0 20px 0 .show
display: block opacity: 1
#logo video
width: 50px width: 100%
border-bottom: none height: 100%
.right object-fit: cover
text-align: right nav
a.menu-link width: 97%
background: $secondary margin: 10px auto
margin-bottom: 4px z-index: 1000
padding: 3px position: relative
border-radius: 2px color: $primary
.left,.right
width: 50%
display: inline-block display: inline-block
font-size: 0.8em vertical-align: top
border-bottom: none .left
&:hover 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 background: $secondary
margin-bottom: 4px
padding: 3px
border-radius: 2px
display: inline-block
font-size: 0.8em
border-bottom: none
&:hover
background: $secondary

Write Preview
Loading…
Cancel
Save