style="display: none;" ]]
<html>
<head>
<style>body {font-family: sans-serif; font-size: .8em;} .sample {width: 100%;height: 0;padding-bottom: calc(50% / 3);background-position: center; background-size: contain; background-repeat: no-repeat;} .opt {display: grid; grid-template-columns: 15em 1fr;} .opt > b {grid-column: 1 / 2;} .opt > input {font-size: 16px; grid-column: 2 / 2;} .opt > span {color: #888; grid-column: 2 / 2; margin: 0 0 1em;} textarea {font-family: sans-serif; height: 300px; width: 100%;} .rounded-border {border: 2px dotted #000000; border-radius: 15px; background: #ffffff; padding-left: 20px; padding-right: 10px;}</style>
</head>
<body>
<br>
<b>【预览效果】</b>
<br>
<br>
<div class="rounded-border">
<div class="sample"></div>
</div>
<div class="opt">
<br>
<br>
<br>
<b>安全等级:</b> <input type="number" min="0" max="6" value="3" />
<span>可填入0, 1, 2, 3, 4, 5, 6, 数字越大代表危险性越高。</span>
<b>现象名称:</b> <input type="text" value="名称" />
<b>现象编号:</b> <input type="text" value="C-X" />
<b>适用区域:</b> <input type="text" value="Level C-XXX" />
<b>存在形式:</b> <input type="text" value="形式" />
<b>条件与成因:</b> <input type="text" value="成因" />
<b>效果及影响:</b> <input type="text" value='影响' />
<br>
<b>复制以下框内的代码:</b>
</div>
<textarea readonly></textarea>
<script>
var o = {};
var txt = document.querySelector('textarea');
var smp = document.querySelector('.sample');
var ipt = Array.from(document.querySelectorAll('input')).map(function(v, i) {
['onchange', 'oninput'].forEach(function(f) {
v[f] = function(e) {
txt.value = '[[include :backrooms-wiki-cn:component:pcs\n' + ipt.map(function(v) {return '|' + v.name + '=' + encodeURI(v.input.value)}).join('\n') + '\n]]';
smp.setAttribute('style', 'background-image: url("data:image/svg+xml;charset=utf8,' + encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="600" height="100" viewBox="0 0 600 100"><defs><style>rect[fill*="b01"] {animation: blink 3s ease-in-out infinite;}@keyframes blink {0%,20%{fill-opacity: 1;}50%{fill-opacity: 0.75;}80%,100% {fill-opacity: 1;}}</style><filter id="shadow" width="200%" height="200%"><feGaussianBlur stdDeviation="3" result="shadow"/><feOffset dx="0" dy="0"/></filter></defs><g><text x="10" y="40" font-size="20" font-family="Arial,sans-serif"><tspan font-weight="bold">名称:</tspan> ' + o.name.value + '</text><text x="10" y="70" font-size="20" font-family="Arial,sans-serif"><tspan font-weight="bold">编号:</tspan> ' + o.number.value + '</text></g><g><rect x="220" y="25" width="2" height="50" rx="2" ry="2" fill="#333"/><text x="230" y="32" font-size="12" font-family="Arial,sans-serif"><tspan font-weight="bold">适用区域:</tspan> ' + o['area'].value + '</text><text x="230" y="46" font-size="12" font-family="Arial,sans-serif"><tspan font-weight="bold">存在形式:</tspan> ' + o['existence'].value + '</text><text x="230" y="60" font-size="12" font-family="Arial,sans-serif"><tspan font-weight="bold">成因:</tspan> ' + o['cause'].value + '</text><text x="230" y="74" font-size="12" font-family="Arial,sans-serif"><tspan font-weight="bold">影响:</tspan> ' + o['effects'].value + '</text><rect x="488" y="25" width="2" height="50" rx="2" ry="2" fill="#333"/></g><g transform="skewX(-15)"><rect x="523" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 ? '#b01' : 'transparent') + '"/><rect x="535" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 5 ? '#b01' : '#aaa') + '"/><rect x="547" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 4 ? '#b01' : Number(o.lv.value) > 4 ? '#333' : '#aaa') + '"/><rect x="559" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 3 ? '#b01' : Number(o.lv.value) > 3 ? '#333' : '#aaa') + '"/><rect x="571" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 2 ? '#b01' : Number(o.lv.value) > 2 ? '#333' : '#aaa') + '"/><rect x="583" y="25" width="10" height="50" rx="2" ry="2" fill="' + (Number(o.lv.value) == 6 || Number(o.lv.value) == 1 ? '#b01' : Number(o.lv.value) > 1 ? '#333' : '#aaa') + '"/></g><text x="535" y="70" font-size="16" font-family="Arial,sans-serif" font-weight="bold" fill="#fff" filter="url(#shadow)">Lv.<tspan font-size="25">' + o.lv.value + '</tspan></text><text x="535" y="70" font-size="16" font-family="Arial,sans-serif" font-weight="bold" fill="' + (Number(o.lv.value) == 6 ? '#fff' : '#000') + '">Lv.<tspan font-size="25">' + o.lv.value + '</tspan></text></svg>') + '");')
}
})
var _ = {name: [
'lv',
'name',
'number',
'area',
'existence',
'cause',
'effects'
][i],
input: v};
o[_.name] = v;
return _;
});
txt.onfocus = function(e) {
e.target.select();
}
ipt[0].input.onchange();
</script>
</body>
</html>描述:
Phenomenon R-32被认为是“存在于内心的假象”。由于其特殊性,该现象发生时,流浪者会误认为自己闯入了一个房间。
据亲历者描述,该现象发生时,流浪者会在无意间步入一片黑暗的空间,白色的线条描绘着他们记忆中的某处街道1,通常为工作日时忙碌的街景。流浪者无法与行人互动,行人也无法察觉流浪者,但流浪者可与街道内物品互动,行人无法察觉流浪者对街道做出的变化。流浪者无法带离街道内物品。
其中,一位由黄色线条描绘的匆忙的小身影格外显眼。流浪者会本能认为其为“过去的自己”,可通过改变街道细节从而帮助其顺利穿过,流浪者也可选择不提供帮助。
无论作何选择,待其离开街道,白色的线条也会随之消退,黑暗再次笼罩。
阻拦其离开街道的方式均以失败告终。
影响:
据他人描述,受该现象影响的流浪者会毫无征兆的晕倒,双目失神,无法唤醒。一段时间后,其会缓慢苏醒,但双眼空洞,对一切感到迷惘。
街道消退后,流浪者因盲目而焦躁不安,产生强烈的离开此处的想法,开始在黑暗空间内四处碰壁,此行为会导致外界的流浪者变得狂躁,具有攻击性。若流浪者在黑暗中崩溃绝望,外界的自己将失去神智,变为一具空洞的躯壳。若流浪者保持理智,一段时间后,外界的自己将苏醒并恢复神智,但由于现象的影响,随着时间推移,其将逐渐失去记忆,往后意念将长期与黑暗抗争。
应对方式:
由于暂无有效应对方式,你的未来由你自己决定……
附录:
迄今为止,仍无法得知该现象的起因究竟是什么。在他人看来,一旦踏入那片黑色房间,就相当于被宣告死刑,大多数人都会放弃反抗,接受命运。毕竟,就算反抗了也会一直被困在黑暗之中,那还不如一死了之。
然而,我不是一个轻易向命运屈服的人。我选择了反抗,现在的生活也与常人无异,除了记性不好和时常发呆走神外没啥区别……
顺便解释一下什么是“长期与黑暗抗争”吧。在外界看来,我只是走神的太频繁了。然而实际情况却是,我一次次的被拉回那片黑暗的空间,我必须时刻保持清醒,失神的代价与绝望无异…
我不知道这将持续多久,或将伴我一生?但既然选择了反抗,日后还要好好活下去呢。
