在你的hexo博客上使用“程序员老黄历”

注意:1.“程序员老黄历”来源于runjs.cn(http://sandbox.runjs.cn/show/ydp3it7b ) ,作者:Yiding He 项目源码有标明 2.作者和White_mu均不对“老黄历”所产生的内容负责

导入:

请在blog目录下的source文件夹创建一个新的文件夹,名字自拟

在新文件夹中创建以下文件:

ProgrammersYellowCalender.htm(可自拟):

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
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta description="runjs.cn 首发,求好看的 CSS">
<meta description="信则有,不信则无,总之作者不会对该程序生成的内容负任何责任。">
<meta description="虽然在微博发现冒充原作者的账号,但不想打击大家 fork 的热情,所以页面上不会有任何关于作者的声明。">
<meta author="twitter: @fake_faith, G+: Yiding He">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>程序员老黄历</title>
<!--<script id="jquery_183" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.3.min.js"></script>-->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<link rel="stylesheet" type="text/css" href="Calender.css"/>
<script src="DivergenceMeter.js"></script>
<body>
<div class="container">
<div class="title">
程序员老黄历<sup></sup>
</div>
<div class="date">
</div>
<div class="good">
<div class="title">
<table>
<tr><td></td></tr>
</table>
</div>
<div class="content">
<ul></ul>
</div>
<div class="clear"></div>
</div>
<div class="split"></div>
<div class="bad">
<div class="title">
<table>
<tr><td>不宜</td></tr>
</table>
</div>
<div class="content">
<ul></ul>
</div>
<div class="clear"></div>
</div>
<div class="split"></div>
<div class="line-tip">
<strong>座位朝向:</strong>面向<span class="direction_value"></span>写程序,BUG 最少。
</div>
<div class="line-tip">
<strong>今日宜饮:</strong><span class="drink_value"></span>
</div>
<div class="line-tip">
<strong>女神亲近指数:</strong><span class="goddes_value"></span>
</div>

<!--<div class="comment">
<ul>
<li>本老黄历尚处于beta阶段,作者随时会修改,所以如果上午看到的内容跟下午不同,请勿惊慌;</li>
<li>本老黄历仅面向程序员;</li>
<li>本老黄历内容是程序生成的,因为只有这样程序员才会信。</li>
</ul>
</div>-->
<ul>
<li>原作者:Yiding He</li>
</ul>
</div>
</body>
</html>

当然,你也可以略为修改,比如像这样:

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
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta description="runjs.cn 首发,求好看的 CSS">
<meta description="信则有,不信则无,总之作者不会对该程序生成的内容负任何责任。">
<meta description="虽然在微博发现冒充原作者的账号,但不想打击大家 fork 的热情,所以页面上不会有任何关于作者的声明。">
<meta author="twitter: @fake_faith, G+: Yiding He; Transplantation: Whitemu_mu">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>程序员老黄历</title>
<!--<script id="jquery_183" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.3.min.js"></script>-->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<link rel="stylesheet" type="text/css" href="Calender.css"/>
<script src="DivergenceMeter.js"></script>
<body>
<div class="container">
<div class="title">
程序员老黄历<sup></sup>
</div>
<div class="date">
</div>
<div class="good">
<div class="title">
<table>
<tr><td></td></tr>
</table>
</div>
<div class="content">
<ul></ul>
</div>
<div class="clear"></div>
</div>
<div class="split"></div>
<div class="bad">
<div class="title">
<table>
<tr><td>不宜</td></tr>
</table>
</div>
<div class="content">
<ul></ul>
</div>
<div class="clear"></div>
</div>
<div class="split"></div>
<div class="line-tip">
<strong>座位朝向:</strong>面向<span class="direction_value"></span>写程序,BUG 最少。
</div>
<div class="line-tip">
<strong>今日宜饮:</strong><span class="drink_value"></span>
</div>
<div class="line-tip">
<strong>女神亲近指数:</strong><span class="goddes_value"></span>
</div>

<!--<div class="comment">
<ul>
<li>本老黄历尚处于beta阶段,作者随时会修改,所以如果上午看到的内容跟下午不同,请勿惊慌;</li>
<li>本老黄历仅面向程序员;</li>
<li>本老黄历内容是程序生成的,因为只有这样程序员才会信。</li>
</ul>
</div>-->
<ul>
<li>原作者:Yiding He;移植: White_mu。 本页面生成的结果仅供参考,White_mu不对此页面生成的内容负责</li>
</ul>
</div>
</body>
</html>

创建DivergenceMeter.js

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
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
   //

/*
* 注意:本程序中的“随机”都是伪随机概念,以当前的天为种子。
*/
function random(dayseed, indexseed) {
var n = dayseed % 11117;
for (var i = 0; i < 100 + indexseed; i++) {
n = n * n;
n = n % 11117; // 11117 是个质数
}
return n;
}

var today = new Date();
var iday = today.getFullYear() * 10000 + (today.getMonth() + 1) * 100 + today.getDate();

var weeks = ["日","一","二","三","四","五","六"];
var directions = ["北方","东北方","东方","东南方","南方","西南方","西方","西北方"];
var activities = [
{name:"写单元测试", good:"写单元测试将减少出错",bad:"写单元测试会降低你的开发效率"},
{name:"洗澡", good:"你几天没洗澡了?",bad:"会把设计方面的灵感洗掉", weekend: true},
{name:"锻炼一下身体", good:"",bad:"能量没消耗多少,吃得却更多", weekend: true},
{name:"抽烟", good:"抽烟有利于提神,增加思维敏捷",bad:"除非你活够了,死得早点没关系", weekend: true},
{name:"白天上线", good:"今天白天上线是安全的",bad:"可能导致灾难性后果"},
{name:"重构", good:"代码质量得到提高",bad:"你很有可能会陷入泥潭"},
{name:"使用%t", good:"你看起来更有品位",bad:"别人会觉得你在装逼"},
{name:"跳槽", good:"该放手时就放手",bad:"鉴于当前的经济形势,你的下一份工作未必比现在强"},
{name:"招人", good:"你面前这位有成为牛人的潜质",bad:"这人会写程序吗?"},
{name:"面试", good:"面试官今天心情很好",bad:"面试官不爽,会拿你出气"},
{name:"提交辞职申请", good:"公司找到了一个比你更能干更便宜的家伙,巴不得你赶快滚蛋",bad:"鉴于当前的经济形势,你的下一份工作未必比现在强"},
{name:"申请加薪", good:"老板今天心情很好",bad:"公司正在考虑裁员"},
{name:"晚上加班", good:"晚上是程序员精神最好的时候",bad:"", weekend: true},
{name:"在妹子面前吹牛", good:"改善你矮穷挫的形象",bad:"会被识破", weekend: true},
{name:"WTMSB", good:"避免缓冲区溢出",bad:"强*灰飞烟灭", weekend: true},
{name:"浏览P站", good:"重拾对生活的信心",bad:"你会心神不宁", weekend: true},
{name:"命名变量\"%v\"", good:"",bad:""},
{name:"写超过%l行的方法", good:"你的代码组织的很好,长一点没关系",bad:"你的代码将混乱不堪,你自己都看不懂"},
{name:"提交代码", good:"遇到冲突的几率是最低的",bad:"你遇到的一大堆冲突会让你觉得自己是不是时间穿越了"},
{name:"代码复审", good:"发现重要问题的几率大大增加",bad:"你什么问题都发现不了,白白浪费时间"},
{name:"开会", good:"写代码之余放松一下打个盹,有益健康",bad:"小心被扣屎盆子背黑锅"},
{name:"打DOTA", good:"你将有如神助",bad:"你会被虐的很惨", weekend: true},
{name:"晚上上线", good:"晚上是程序员精神最好的时候",bad:"你白天已经筋疲力尽了"},
{name:"修复BUG", good:"你今天对BUG的嗅觉大大提高",bad:"新产生的BUG将比修复的更多"},
{name:"设计评审", good:"设计评审会议将变成头脑风暴",bad:"人人筋疲力尽,评审就这么过了"},
{name:"需求评审", good:"",bad:""},
{name:"上微博", good:"今天发生的事不能错过",bad:"今天的微博充满负能量", weekend: true},
{name:"上AB站", good:"还需要理由吗?",bad:"满屏兄贵亮瞎你的眼", weekend: true},
{name:"玩FlappyBird", good:"今天破纪录的几率很高",bad:"除非你想玩到把手机砸了", weekend: true}
];



var specials = [
{date:today.getFullYear() * 10000 + 1024 , type:'bad', name:'加班', description:'#996.icu#'},
{date:today.getFullYear() * 10000 + 514 , type:'good' , name:'拜访守矢神社', description:'有机会和一位淡绿发的少女相遇,然后……'},
];

var tools = ["Eclipse写程序", "MSOffice写文档", "记事本写程序", "Windows10", "Linux", "MacOS", "IE", "Android设备", "iOS设备"];

var varNames = ["jieguo", "huodong", "pay", "expire", "zhangdan", "every", "free", "i1", "a", "virtual", "ad", "spider", "mima", "pass", "ui"];

var drinks = ["水","茶","红茶","绿茶","咖啡","奶茶","可乐","鲜奶","豆奶","果汁","果味汽水","苏打水","运动饮料","酸奶","酒"];

function is_someday() {
return today.getMonth() == 5 && today.getDate() == 4;
}

function getTodayString() {
return "今天是" + today.getFullYear() + "年" + (today.getMonth() + 1) + "月" + today.getDate() + "日 星期" + weeks[today.getDay()];
}

function star(num) {
var result = "";
var i = 0;
while (i < num) {
result += "★";
i++;
}
while(i < 5) {
result += "☆";
i++;
}
return result;
}

// 生成今日运势
function pickTodaysLuck() {
var _activities = filter(activities);

var numGood = random(iday, 98) % 3 + 2;
var numBad = random(iday, 87) % 3 + 2;
var eventArr = pickRandomActivity(_activities, numGood + numBad);

var specialSize = pickSpecials();

for (var i = 0; i < numGood; i++) {
addToGood(eventArr[i]);
}

for (var i = 0; i < numBad; i++) {
addToBad(eventArr[numGood + i]);
}
}

// 去掉一些不合今日的事件
function filter(activities) {
var result = [];

// 周末的话,只留下 weekend = true 的事件
if (isWeekend()) {

for (var i = 0; i < activities.length; i++) {
if (activities[i].weekend) {
result.push(activities[i]);
}
}

return result;
}

return activities;
}

function isWeekend() {
return today.getDay() == 0 || today.getDay() == 6;
}

// 添加预定义事件
function pickSpecials() {
var specialSize = [0,0];

for (var i = 0; i < specials.length; i++) {
var special = specials[i];

if (iday == special.date) {
if (special.type == 'good') {
specialSize[0]++;
addToGood({name: special.name, good: special.description});
} else {
specialSize[1]++;
addToBad({name: special.name, bad: special.description});
}
}
}

return specialSize;
}

// 从 activities 中随机挑选 size 个
function pickRandomActivity(activities, size) {
var picked_events = pickRandom(activities, size);

for (var i = 0; i < picked_events.length; i++) {
picked_events[i] = parse(picked_events[i]);
}

return picked_events;
}

// 从数组中随机挑选 size 个
function pickRandom(array, size) {
var result = [];

for (var i = 0; i < array.length; i++) {
result.push(array[i]);
}

for (var j = 0; j < array.length - size; j++) {
var index = random(iday, j) % result.length;
result.splice(index, 1);
}

return result;
}

// 解析占位符并替换成随机内容
function parse(event) {
var result = {name: event.name, good: event.good, bad: event.bad}; // clone

if (result.name.indexOf('%v') != -1) {
result.name = result.name.replace('%v', varNames[random(iday, 12) % varNames.length]);
}

if (result.name.indexOf('%t') != -1) {
result.name = result.name.replace('%t', tools[random(iday, 11) % tools.length]);
}

if (result.name.indexOf('%l') != -1) {
result.name = result.name.replace('%l', (random(iday, 12) % 247 + 30).toString());
}

return result;
}

// 添加到“宜”
function addToGood(event) {
$('.good .content ul').append('<li><div class="name">' + event.name + '</div><div class="description">' + event.good + '</div></li>');
}

// 添加到“不宜”
function addToBad(event) {
$('.bad .content ul').append('<li><div class="name">' + event.name + '</div><div class="description">' + event.bad + '</div></li>');
}

$(function(){
if (is_someday()) {document.body.className = 'someday'};
$('.date').html(getTodayString());
$('.direction_value').html(directions[random(iday, 2) % directions.length]);
$('.drink_value').html(pickRandom(drinks,2).join(','));
$('.goddes_value').html(star(random(iday, 6) % 5 + 1));
pickTodaysLuck();
});

里面的内容也可自定义,像这样:

1
{name:"上B站", good:"来看看White_mu今天更新了什么",bad:"White_mu根本没更新", weekend: true},

创建Calender.css

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
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
body * {
font-family:"Consolas","Microsoft Yahei", Arial, sans-serif;
}

body {
background: white;
margin: 0;
padding: 0;
}

.container {
/*width: 320px;*/
margin: 0 auto 50px;
}

.container>.title {
color: #bbb;
font-weight: bold;
margin-bottom: 10px;
background: #555;
padding: 5px 15px;
}

.adlink {
text-align: center;
font-size: 11pt;
}

.adlink a {
text-decoration: none;
display:block;
color: #666;
font-weight: bold;
margin-bottom: 10px;
background: #eee;
border: 1px solid #ddd;
border-radius: 4px;
padding: 10pt;
margin-top: 10pt;
}

.date{
font-size:17pt;
font-weight: bold;
line-height: 30pt;
text-align: center;
}

.split, .clear {
clear: both;
height: 1px;
overflow-y: hidden;
}

.good, .bad {
clear: both;
position: relative;
}

.bad {
/*top: -1px;*/
}

.good .title, .bad .title {
float: left;
width: 100px;
font-weight: bold;
text-align: center;
font-size: 30pt;
position:absolute;
top:0;
bottom:0;
}

.good .title>table, .bad .title>table {
position:absolute;
width:100%;
height:100%;
border:none;
}

.good .title {
background: #ffee44;
}

.someday .good .title {
background: #aaaaaa;
}

.bad .title {
background: #ff4444;
color: #fff;
}

.someday .bad .title {
background: #666666;
color: #fff;
}

.good .content, .bad .content {
margin-left: 115px;
padding-right: 10px;
padding-top: 1px;
font-size:15pt;
}

.someday .good {
background: #dddddd;
}

.someday .bad {
background: #aaaaaa;
}

.good {
background: #ffffaa;
}

.bad {
background: #ffddd3;
}

.content ul {
list-style: none;
margin:10px 0 0;
padding:0;
}

.content ul li {
line-height:150%;
font-size: 15pt;
font-weight: bold;
color: #444;
}

.content ul li div.description {
font-size: 11pt;
font-weight: normal;
color: #777;
line-height: 110%;
margin-bottom: 10px;
}

.line-tip {
font-size: 11pt;
margin-top: 10px;
margin-left: 10px;
}

.direction_value {
color:#4a4;
font-weight: bold;
}

.someday .direction_value {
color:#888;
}

.goddes_value {
color: #f87;
}

.someday .goddes_value {
color: #777;
}

.comment {
margin-top: 50px;
font-size: 11pt;
margin-left: 10px;
}

.comment ul {
margin-left: 0;
padding-left: 20px;
color: #999;
}

应用:

1
2
3
hexo clean
hexo g
hexo s #看看效果

在local:4000中进入到你刚才创建的local:4000/.../ProgrammersYellowCalender.htm看看效果吧,别忘了在主页添加超链接

来看看我的:程序员老黄历

封面PixivID: 78413548