First Push
This commit is contained in:
commit
a832461316
|
@ -0,0 +1,2 @@
|
|||
posts
|
||||
image
|
|
@ -0,0 +1,57 @@
|
|||
|
||||
<title>Loading BLOG</title>
|
||||
<meta http-equiv="refresh" content="35; URL=index.php" />
|
||||
<link rel="stylesheet" href="matrix.css">
|
||||
<canvas id="c"></canvas>
|
||||
<script>
|
||||
c = document.getElementById("c");
|
||||
var ctx = c.getContext("2d");
|
||||
|
||||
//making the canvas full screen
|
||||
c.height = window.innerHeight;
|
||||
c.width = window.innerWidth;
|
||||
|
||||
//chinese characters - taken from the unicode charset
|
||||
var chinese = "MIF";
|
||||
//converting the string into an array of single characters
|
||||
chinese = chinese.split(" ");
|
||||
|
||||
var font_size = 25;
|
||||
var columns = c.width/font_size; //number of columns for the rain
|
||||
//an array of drops - one per column
|
||||
var drops = [];
|
||||
//x below is the x coordinate
|
||||
//1 = y co-ordinate of the drop(same for every drop initially)
|
||||
for(var x = 0; x < columns; x++)
|
||||
drops[x] = 1;
|
||||
|
||||
//drawing the characters
|
||||
function draw()
|
||||
{
|
||||
//Black BG for the canvas
|
||||
//translucent BG to show trail
|
||||
ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
|
||||
ctx.fillRect(0, 0, c.width, c.height);
|
||||
|
||||
ctx.fillStyle = "#0F0"; //green text
|
||||
ctx.font = font_size + "px arial";
|
||||
//looping over drops
|
||||
for(var i = 0; i < drops.length; i++)
|
||||
{
|
||||
//a random chinese character to print
|
||||
var text = chinese[Math.floor(Math.random()*chinese.length)];
|
||||
//x = i*font_size, y = value of drops[i]*font_size
|
||||
ctx.fillText(text, i*font_size, drops[i]*font_size);
|
||||
|
||||
//sending the drop back to the top randomly after it has crossed the screen
|
||||
//adding a randomness to the reset to make the drops scattered on the Y axis
|
||||
if(drops[i]*font_size > c.height && Math.random() > 0.91)
|
||||
drops[i] = 0;
|
||||
|
||||
//incrementing Y coordinate
|
||||
drops[i]++;
|
||||
}
|
||||
}
|
||||
|
||||
setInterval(draw, 90);
|
||||
</script>
|
|
@ -0,0 +1,55 @@
|
|||
<?php require "markdown.php"; ?>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>MIF's Blog</title>
|
||||
<style>
|
||||
body, html {
|
||||
background: lightgrey;
|
||||
margin: auto;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.post {
|
||||
background: white;
|
||||
padding: 5px 5px;
|
||||
margin-bottom: 20px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.post h1 {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="header">
|
||||
<h1>My Blog</h1>
|
||||
<h3>Cool things go here.</h3>
|
||||
</div>
|
||||
<?php
|
||||
$specificPost = $_GET["post"];
|
||||
$postCount = 2;
|
||||
|
||||
# Show specific post or all
|
||||
if (!isset($specificPost)) {
|
||||
for ($post = $postCount; $post >= 1; $post--) {
|
||||
makePost($post, FALSE);
|
||||
}
|
||||
} else {
|
||||
makePost($specificPost, TRUE);
|
||||
}
|
||||
|
||||
function makePost($post, $showRest) {
|
||||
$text = file_get_contents("posts/" . strval($post));
|
||||
$text = parse($text, $showRest, $post);
|
||||
|
||||
echo("<div class='post' title='Post number $post'>" . $text . "</div>");
|
||||
}
|
||||
?>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,38 @@
|
|||
<?php
|
||||
function parse($string, $showRest, $post) {
|
||||
$asHtml = $string;
|
||||
|
||||
$asHtml = htmlspecialchars($asHtml);
|
||||
|
||||
# Replace "# " with h1
|
||||
$asHtml = preg_replace("/# (.+)/i", "<h1>$1</h1>", $asHtml);
|
||||
|
||||
# Replace [text](link) with HTML links. Prevent ][ and )( in them
|
||||
$findBetween = "([^\n|\[\]]+)";
|
||||
|
||||
# Parse images first, since they require a ! in front of them
|
||||
$imageRegex = "/\!\[" . $findBetween . "\]\(" . $findBetween . "\)/i";
|
||||
$asHtml = preg_replace($imageRegex, "<img src='$2' title='$1'>", $asHtml);
|
||||
|
||||
# Parse links, Prevent ! at beginning
|
||||
$linkRegex = "/(?!\!)\[" . $findBetween . "\]\(" . $findBetween . "\)/i";
|
||||
$asHtml = preg_replace($linkRegex, "<a href='$2'>$1</a>", $asHtml);
|
||||
|
||||
#
|
||||
$asHtml = preg_replace("/```([^```]+)```/s", "<code>$1</code>", $asHtml);
|
||||
$asHtml = preg_replace("/\`([^\n]+)\`/i", "<code>$1</code>", $asHtml);
|
||||
|
||||
# Replace --- and after with read more if needed
|
||||
if ($showRest == TRUE) {
|
||||
$asHtml = preg_replace("/---/s", "", $asHtml);
|
||||
$asHtml .= "<a href='index.php'>Back</a>";
|
||||
} else {
|
||||
$asHtml = preg_replace("/---(.+)/s", "<p><a href='?post=$post'>Read more</a></p>", $asHtml);
|
||||
}
|
||||
|
||||
# Replace two newlines with a paragraph element
|
||||
//$asHtml = preg_replace("/[\n][\n](.*)/i", "<p>$1</p>", $asHtml);
|
||||
|
||||
return $asHtml;
|
||||
}
|
||||
?>
|
|
@ -0,0 +1,7 @@
|
|||
/* Credit https://codepen.io/P3R0/pen/MwgoKv */
|
||||
|
||||
/*basic reset*/
|
||||
* {margin: 0; padding: 0;}
|
||||
/*adding a black bg to the body to make things clearer*/
|
||||
body {background: black;}
|
||||
canvas {display: block;}
|
|
@ -0,0 +1,8 @@
|
|||
# TinyBlog
|
||||
See it in action: http://petabyte.heb12.com/blog/
|
||||
|
||||
## Setup
|
||||
Make a folder called "posts", and touch files 1 - however many posts you want.
|
||||
Edit them with markdown, and bam.
|
||||
|
||||
(You have to change index.php $postCount to how many posts you have. This will be fixed soon.)
|
Loading…
Reference in New Issue