1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
|
<!DOCTYPE html><html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="theme-color" content="#000000">
<title>Chrisoft::Blog</title>
<script type="text/javascript" src="/panel.js"></script>
<script type="text/javascript" src="/themer.js"></script>
<script type="text/javascript" src="/blog/footnoter.js"></script>
<script type="text/javascript" src="/blog/aes-js.js"></script>
<script type="text/javascript" src="/blog/scrypt.js"></script>
<script type="text/javascript" src="/blog/sha256.js"></script>
<script type="text/javascript" src="/blog/decryptor.js"></script>
<link rel="stylesheet" type="text/css" href="/common.css">
<link rel="stylesheet" type="text/css" href="/panel.css">
<link rel="stylesheet" type="text/css" href="/theme0a.css" id="theme0a">
<link rel="stylesheet" type="text/css" href="/theme0b.css" id="theme0b">
<link rel="stylesheet" type="text/css" href="/theme1a.css" id="theme1a">
<link rel="stylesheet" type="text/css" href="/theme1b.css" id="theme1b">
<link rel="stylesheet" type="text/css" href="/theme2a.css" id="theme2a">
<link rel="stylesheet" type="text/css" href="/theme2b.css" id="theme2b">
<link rel="stylesheet" type="text/css" href="/theme3a.css" id="theme3a">
<link rel="stylesheet" type="text/css" href="/theme3b.css" id="theme3b">
<link rel="stylesheet" type="text/css" href="/blog/blogext.css">
<script>
function ol()
{
window.onresize=function()
{
if(window.innerWidth<768)
setupevents();
else unsetevents();
}
window.onresize();
loadTheme();
_decryptonload();
}
</script>
</head>
<body onload="ol()" style="overflow-x:hidden;">
<div id="panel" class="TText">
<ul id="panellist">
<li><a href="/"><h1>Chrisoft</h1></a></li>
<li><a href="/blog"><h2>Blog</h2></a></li>
<li><a href="#"><h3 id="title">SBS 2.0 is now the default blog browser</h3></a></li>
<li><span>Tags</span>
<ul id="tagslist">
<li><a href="/blog/list/devel/">devel</a></li><li><a href="/blog/list/web/">web</a></li></ul>
</li>
<li id="tocouter" style="display: none;">
<span>Table of Contents</span>
<ul id="tocroot">
</ul>
</li>
<li style="margin-left:-0.5em"><a id="prevp" href="2017-02-13.html">Prev post</a></li>
<li style="margin-left:-0.5em"><a id="nextp" href="2017-05-08.html">Next post</a></li>
</ul>
</div>
<div id="content">
<h2 id="titleh" class="TText" style="font-wight:normal;">SBS 2.0 is now the default blog browser</h2>
<div id="datetags" class="TText" style="margin-bottom:1em;">2017-04-11<br>#devel #web</div>
<hr><div id="article" class="TText">
<article>
<p>
As you may have noticed, the blog system has been fully revamped. The new system
-- the Stupid Blogging System 2.0 -- uses the same design as the new home page
and assemblies the page dynamically in the browser using AJAX. The backend is
written in C++ with a snake oil "cgilib" and its source code can be found
<a href="/blog/cgi-src">here</a>. All frontend and backend code is licensed
under the Expat (MIT) license (possibly because the code is way too useless for
general-purpose web application development).
</p>
<p>
One of the biggest changes brought to the visitors by SBS2.0 is the tags
support. Now you can filter the posts through a single tag of your choice. By
far the filter only accepts a single tag. Although adding support of multi-tags
filter is fairly easy, I haven't found the reason to implement it yet.
</p>
<p>
Obviously this won't work if you disable JS in your browser. Also, due to the
usage of some ES6 features, it requires an ES6-enabled browser. The frontend is
developed with the help of Chrome 56 and Firefox 52. Microsoft Edge doesn't like
my code. I don't have any Apple iOS/macOS devices so I didn't test it in Safari.
Sorry to Microsoft and Apple fanboys and fangirls!
</p>
<p>
SBS2.0 is still shit compared to any other blogging systems.
</p>
<table>
<tbody><tr>
<td>Backend: </td>
<td>cgi programs written in pure C++</td>
</tr>
<tr>
<td>Frontend: </td>
<td>Vanilla JS(ES5+some ES6 features)+HTML5+CSS3</td>
</tr>
<tr>
<td>Officially supported browsers: </td>
<td>Chrome 56+ & Firefox 51+</td>
</tr>
</tbody></table>
</article>
</div><br><hr>
<div class="TText" id="notediv" style="font-size:80%;"></div>
<div id="insanch" style="height:3em;"></div>
<div id="footer" style="">
<div id="pagesw" class="TText" style="width:100%;height:0.5em;"></div>
<div style="text-align:center;" class="TText">
Proudly powered by SSBS <reduced style="font-size:70%;">(the static stupid blogging system)</reduced> 2.5
<br>
Content licensed under CC BY-SA 4.0. <span id="purgep" style="display:none;font-size:70%;">This page has passphrase(s) stored. Click <a href="javascript:_purgep()">here</a> to purge.</span>
</div>
</div>
<div id="cmdbuf" class="TText" style="transition:500ms;padding:1em;font-size:2em;color:white;position:absolute;background-color:rgba(0,0,0,0.6);left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;opacity:0;">
</div>
</div>
<div id="decryptui" style="display:none;opacity:0;color:white;z-index:1000;position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.4);transition:opacity 0.5s;">
<div id="decryptdlg" class="TText" style="padding:10px 20px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:rgba(0,0,0,0.6);">
<div id="keyhint" style="margin-bottom:8px;"></div>
<div style="margin-bottom:8px;">Key: <input id="keyinp" type="text" style="color:#fff;"></div>
<div style="height:2.25em;">
<button id="btndecrypt" onclick="decryptor(decid,document.getElementById('keyinp').value);" style="position:absolute;left:20px;">Decrypt</button>
<button onclick="hidedecryptui();" style="position:absolute;right:20px;">Cancel</button>
</div>
</div>
</div></body></html>
|
