ページ作成コンポーネント

まて!これは孔明の罠だ!

ここはSCP Wiki内部で使われているテンプレートページです。

スタッフの許可なしに
このページを触れないでください


1.新しい下書きを作成
CC3.0 BY-SA

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
 
<head>
    <title>Auto Numbering Draft Creater</title>
</head>
<style>
    @import url("https://scp-jp.github.io/files/util/common/styles/off-canvas.css");
 
    body {
        padding: 0;
        background-color: transparent !important;
    }
 
    .fake-link {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
    }
 
    #LinkSentence {
        display: flex;
        justify-content: center;
        align-items: center;
    }
 
    @media (max-width: 580px) {
        #LinkSentence {
            font-size: 0.7em;
        }
    }
 
    @media (min-width: 581px) {
        #LinkSentence {
            font-size: 27px;
        }
    }
 
</style>
<script type="text/javascript" src="https://scp-jp.github.io/files/util/sandbox/scripts/common/check-terminal.js"></script>
<script type="text/javascript" src="https://scp-jp.wdfiles.com/local--code/scpmetatitlesearch/4"></script>
<script type="text/javascript">
 
    var mySite = "http://scp-jp-sandbox3.wikidot.com/"
    var userName = "";
    var accountnumber = "";
    window.onload = function () {
        var showLinkArea = document.getElementById("link");
        var checkWidthElm = document.getElementById("LinkSentence");
        var ElmLen = checkWidthElm.innerHTML.length;
        if (userTerminalData.Os == "iOS") {
            ElmLen++;
        }
        var defaultFontSize = Math.floor(getSentenceWidth() / ElmLen);
        showLinkArea.style.fontSize = defaultFontSize + "px";
        resizeLinkSentence();
        var myURL = location.href;
        var settingParamName = {
            name: "name=",
            createdBy: "createdBy=",
            currentdraft: "currentdraft=",
            accountname: "accountname=",
            accountnum: "accountnum="
        }
        var settingParam = {
            name: "",
            createdBy: "",
            currentdraft: "",
            accountname: "",
            accountnum: ""
        }
 
        if (myURL.indexOf("#") > 0) {
            var tmpURLArray = ((myURL.split("#"))[1]).split(",");
            for (var i = 0; i < tmpURLArray.length; i++) {
                for (var j in settingParam) {
                    if (tmpURLArray[i].indexOf(settingParamName[j]) == 0) {
                        settingParam[j] = decodeURIExtension(tmpURLArray[i].split(settingParamName[j]).join(""));
                        delete settingParamName[j];
                        break;
                    }
                }
            }
        }
        var pageName = settingParam.name;
        accountnumber = settingParam.accountnum;
        pageName = pageName.toLowerCase();
        var baseName = settingParam.currentdraft.replace("draft:","");
        baseName = baseName.toLowerCase();
        var testRegex = new RegExp("^" + settingParam.createdBy);
        if (baseName.match(testRegex)) {
            baseName = baseName.replace(testRegex, "");
        } else {
            testRegex = new RegExp("^" + setEscapeCode(settingParam.accountname));
            if (baseName.match(testRegex)) {
                baseName = baseName.replace(testRegex, "");
            }
        }
        testRegex = null;
        if (baseName.match(/^\-/g)) {
            baseName = baseName.replace(/^\-/g, "");
        }
        baseName = baseName.replace(/[^a-z0-9:\]\[]/g, "-");
        while (baseName.indexOf("--") >= 0) {
            baseName = baseName.replace(/--/g, "-");
        }
        userName = settingParam.createdBy;
        baseName = baseName + "-";
        var nowNo = baseName;
        if (nowNo.indexOf("-") >= 0) {
            nowNo = (nowNo.split("-"))[0];
        } else {
            nowNo = "1";
        }
        nowNo = parseInt(nowNo);
        if (isNaN(nowNo)) {
            nowNo = "";
        } else {
            nowNo++;
            nowNo += "-";
        }
        var unique = "";
        var digit = 0;
        for (var i = 0; i < 4; i++) {
            digit = Math.floor(Math.random() * 16);
            unique += digit.toString(16);
        }
        var Links = document.createElement("span");
        Links.setAttribute("onclick", "GoToLink('" + mySite + "draft:" + settingParam.createdBy + "-" + nowNo + unique + "/title/" + settingParam.name + "-" + nowNo + "-" + unique + "/parentPage/portal:" + settingParam.createdBy + "/#_editpage');");
        Links.setAttribute("class", "fake-link");
        Links.setAttribute("id", checkWidthElm.getAttribute("id"));
        Links.innerHTML = checkWidthElm.innerHTML;
        showLinkArea.replaceChild(Links, checkWidthElm);
        checkWidthElm = Links;
        window.addEventListener('resize', function (event) {
            resizeLinkSentence();
        });
 
        function getSentenceWidth() {
            var left = checkWidthElm.getBoundingClientRect().left;
            var right = checkWidthElm.getBoundingClientRect().right;
            return (right - left);
        }
 
        function resizeLinkSentence() {
 
            var pageWidth = window.innerWidth;
 
            var fontSize = 0;
            fontSize = Math.floor(pageWidth / ElmLen);
            if (fontSize > defaultFontSize) {
                fontSize = defaultFontSize;
            }
            showLinkArea.style.fontSize = fontSize + "px";
            var fontHeight = fontSize;
            if (userTerminalData.Os == "iOS") {
                fontHeight = Math.floor(pageWidth / (ElmLen - 1));
                if (fontHeight > defaultFontSize) {
                    fontHeight = defaultFontSize;
                }
                fontHeight += 5;
            }
            var inHeight = window.innerHeight;
            inHeight -= (fontHeight + 5);
 
        }
 
    }
 
    function GoToLink(url) {
        var userNameL;
        try {
            userNameL = accountnumber;
        } catch (e) {
            alert("サインイン未取得");
            return;
        }
        if (userName == userNameL) {
            window.parent.location.href = url;
        } else {
            alert("自分のポータルからページを作成してください");
            console.log("pageCreate:" + userName + " , RequestUser:" + userNameL);
        }
    }
 
</script>
<body>
<div id="link" style='font-size:200%; text-align: center;'>
    <span id="LinkSentence">新しい下書きを作成する</span>
</div>
<div style="width:100%;height;1px"></div>
</body>
</html>

2.下書き表示用パラメータ取得Js

/*
下書き一覧でパラメータを解析するスクリプト
 */
//親ページのURLを解析する
var PageSetting = new Object();
PageSetting.getParent = true;
PageSetting.currentParam = decodeURIExtension(document.referrer);
if ((!PageSetting.currentParam)||(new URL(PageSetting.currentParam).pathname.length<=1)) {
    PageSetting.currentParam = "http://scp-jp-sandbox3.wikidot.com/draft-list";
    PageSetting.getParent = false;
}
PageSetting.myPage = (function () {
    var tmpURL = PageSetting.currentParam.split("http://").join("").split("/");
    return "http://" + tmpURL[0] + "/" + tmpURL[1];
})();
PageSetting.currentParam = PageSetting.currentParam.split(PageSetting.myPage).join("");
PageSetting.OrderParam = "";
if (PageSetting.currentParam.indexOf("/order/") >= 0) {
    PageSetting.OrderParam = PageSetting.currentParam.substring(PageSetting.currentParam.indexOf("/order/"), PageSetting.currentParam.length);
}
PageSetting.TagsParam = "";
if (PageSetting.currentParam.indexOf("/tag/") >= 0) {
    var tmpCurrentParam = PageSetting.currentParam;
    if (PageSetting.OrderParam.length > 0) {
        tmpCurrentParam = tmpCurrentParam.split(PageSetting.OrderParam).join("");
    }
    PageSetting.TagsParam = tmpCurrentParam;
    if (PageSetting.TagsParam.charAt(PageSetting.TagsParam.length - 1) == "/") {
        PageSetting.TagsParam = PageSetting.TagsParam.substring(0, PageSetting.TagsParam.length - 1);
    }
}

3.カスタム検索jsコード

/*検索選択肢の生成用オブジェクト*/
// <表示>:<タグ>
var SearchTags = {
    Category: {
        "SCP-JP": "_scp-jp",
        "GoIF-JP": "_goi-format-jp",
        "Tale-JP": "_tale-jp",
        "翻訳 (英語)": "_en",
        "翻訳 (その他)": "_ru,_ko,_cn,_fr,_pl,_es,_th,_de,_it,_ua,_pt-br,_cz,_zh-tr,_vn,_otherlang",
        "その他": "_others",
        "未定義": "_null"
    },
    /*ジャンル設定*/
    Genre: {
        "ジョーク": "_joke",
        "ホラー": "_horror",
        "SF": "_sf",
        "オカルト・都市伝説": "_occult",
        "サスペンス": "_suspense",
        "感動系": "_excitement",
        "シュール": "_sur",
        "コミカル": "_comical",
        "メタフィクション": "_metafiction",
        "アダルト": "_adult",
        "既存記事改稿": "_reforming-g",
        "日→外国語翻訳": "_translationjpto",
        "コンテスト": "_contest",
        "その他": "_others-g"
    }
}
/*ジャンル、カテゴリ選択用要素格納*/
var SettingAreaObj = {
    Category: [],
    Genre: []
}
/*ジャンルカテゴリ選択用クラス格納*/
var SelectedClassNames = {
    Category: {
        Base: "CategoryBase",
        Default: "CDefault",
        Selected: "CSelected"
    },
    Genre: {
        Base: "GenreBase",
        Default: "GDefault",
        Or: "GOrSelected",
        And: "GSelected"
    }
}
var searchForm;
document.addEventListener("DOMContentLoaded", function() {
    searchForm = document.getElementById("searchsetting");
    setSelecters("Category");
    setSelecters("Genre");
    SearchTags["MinusCategory"] = new Object();
    var tmpValue = "";
    var minusValue = "";
    for (var i in SearchTags.Category) {
        tmpValue = SearchTags.Category[i].split(",");
        minusValue = "";
        for (var j = 0; j < tmpValue.length; j++) {
            minusValue += (((j > 0) ? "," : "") + "-" + tmpValue[j]);
        }
        SearchTags.MinusCategory[i] = minusValue;
    }
    //URLの状態からカスタム検索の状態を復帰させる
    if (PageSetting.TagsParam.length > 0) {
        var tmpParam = PageSetting.TagsParam;
        //カテゴリ復帰
        var tmpMinus = new Object();
        var categoryFlag = false;
        var targetClass;
        for (var i in SearchTags.MinusCategory) {
            tmpMinus[i] = SearchTags.MinusCategory[i];
        }
        for (var i in tmpMinus) {
            if (tmpParam.indexOf(tmpMinus[i]) >= 0) {
                categoryFlag = true;
                tmpParam = tmpParam.split(tmpMinus[i]).join("");
                delete tmpMinus[i];
            }
        }
        if (categoryFlag) {
            targetClass = SelectedClassNames.Category;
            for (var i = 0; i < SettingAreaObj.Category.length; i++) {
                for (var j in tmpMinus) {
                    if (SettingAreaObj.Category[i].innerHTML == j) {
                        SettingAreaObj.Category[i].removeAttribute("class");
                        SettingAreaObj.Category[i].setAttribute("class", targetClass.Base + " " + targetClass.Selected);
                        delete tmpMinus[j];
                    }
                }
            }
        }
        tmpMinus = undefined; //dispose
        //ジャンル復帰
        var tmpGenre = new Object();
        for (var i in SearchTags.Genre) {
            tmpGenre[i] = SearchTags.Genre[i];
        }
        targetClass = SelectedClassNames.Genre;
        var tmpParamArray = tmpParam.split(",");
        tmpParamArray[0] = tmpParamArray[0].split("/tag/").join("");
        for (var i = 0; i < tmpParamArray.length; i++) {
            for (var j in tmpGenre) {
                if (tmpParamArray[i] == tmpGenre[j]) {
                    restoreGenre(j, targetClass.Or);
                    delete tmpGenre[j];
                } else if (tmpParamArray[i] == ("%2b" + tmpGenre[j])) {
                    restoreGenre(j, targetClass.And);
                    delete tmpGenre[j];
                }
            }
        }
        tmpGenre = undefined; //dispose
        tmpParamArray = undefined; //dispose
        tmpParam = undefined; //dispose
    }
 
    function setSelecters(typeName) {
        var newSelecter;
        //カテゴリ選択欄生成
        var targetBase = document.getElementById(typeName + "Area");
        var classN = SelectedClassNames[typeName];
        var targetSetting = SearchTags[typeName];
        for (var i in targetSetting) {
            if (targetSetting[i] == "_null") continue;
            newSelecter = document.createElement("span");
            newSelecter.setAttribute("class", classN.Base + " " + classN.Default);
            newSelecter.setAttribute("onclick", "changeState(this,'" + typeName + "');");
            newSelecter.innerHTML = i;
            targetBase.appendChild(newSelecter);
            SettingAreaObj[typeName].push(newSelecter);
        }
    }
 
    function restoreGenre(keyName, applyClass) {
        for (var i = 0; i < SettingAreaObj.Genre.length; i++) {
            if (SettingAreaObj.Genre[i].innerHTML == keyName) {
                SettingAreaObj.Genre[i].removeAttribute("class");
                SettingAreaObj.Genre[i].setAttribute("class", SelectedClassNames.Genre.Base + " " + applyClass);
                break;
            }
        }
    }
});
//カテゴリ及びジャンルを選択した時の表示切替
function changeState(elm, selectType) {
    //html要素のクラスを切り替える
    var oldClass = elm.getAttribute("class");
    elm.removeAttribute("class");
    var BaseClass = SelectedClassNames[selectType]["Base"] + " ";
    oldClass = oldClass.split(BaseClass).join("");
    switch (selectType) {
        case "Category":
            switch (oldClass) {
                case SelectedClassNames.Category.Default:
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Category.Selected);
                    break;
                case BaseClass + SelectedClassNames.Category.Selected:
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Category.Default);
                    break;
                default:
                    //万が一のバグ時救済
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Category.Default);
                    break;
            }
            break;
        case "Genre":
            switch (oldClass) {
                case SelectedClassNames.Genre.Default:
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Genre.And);
                    break;
                case SelectedClassNames.Genre.And:
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Genre.Or);
                    break;
                case SelectedClassNames.Genre.Or:
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Genre.Default);
                    break;
                default:
                    //万が一のバグ時救済
                    elm.setAttribute("class", BaseClass + SelectedClassNames.Genre.Default);
                    break;
            }
            break;
    }
}
 
function search() {
    var StateClass = "";
    var isSelectCategory = false;
    var BaseClass = "";
    var keyName = "";
    var tagParam = "";
    /*ジャンル検索設定*/
    BaseClass = SelectedClassNames.Genre.Base + " ";
    var andParam = "%2b_criticism-in";
    var orParam = "";
    var cunma = "";
    for (var i = 0; i < SettingAreaObj.Genre.length; i++) {
        StateClass = (SettingAreaObj.Genre[i].getAttribute("class")).split(BaseClass).join("");
        keyName = SettingAreaObj.Genre[i].innerHTML;
        switch (StateClass) {
            case SelectedClassNames.Genre.And:
                andParam += ("," + "%2b" + SearchTags.Genre[keyName]);
                break;
            case SelectedClassNames.Genre.Or:
                cunma = ((orParam.length > 0) ? "," : "");
                orParam += (cunma + SearchTags.Genre[keyName]);
                break;
        }
    }
    addTagParam(andParam);
    addTagParam(orParam);
    /*カテゴリ検索設定生成*/
    var CategoryClone = new Object();
    for (var i in SearchTags.Category) {
        CategoryClone[i] = SearchTags.Category[i];
    }
    BaseClass = SelectedClassNames.Category.Base + " ";
    for (var i = 0; i < SettingAreaObj.Category.length; i++) {
        StateClass = (SettingAreaObj.Category[i].getAttribute("class")).split(BaseClass).join("");
        if (StateClass == SelectedClassNames.Category.Selected) {
            keyName = SettingAreaObj.Category[i].innerHTML;
            isSelectCategory = true;
            delete CategoryClone[keyName];
        }
        keyName = "";
    }
    if (isSelectCategory) {
        var MinusValue = "";
        var MinusValueArray;
        for (var i in CategoryClone) {
            addTagParam(SearchTags.MinusCategory[i]);
            MinusValue = "";
        }
    }
    if (tagParam.length > 0) {
        tagParam = "/tag/" + tagParam;
    }
    window.parent.location = PageSetting.myPage + tagParam + PageSetting.OrderParam;
 
    function addTagParam(addState) {
        if (addState.length <= 0) {
            return;
        }
        var cunma = ((tagParam.length > 0) ? "," : "");
        tagParam += (cunma + addState);
    }
}

4.UserNameGet

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
    <title>GetUser</title>
<script type="text/javascript" src="https://scp-jp.wdfiles.com/local--code/scpmetatitlesearch/4"></script>
<script type="text/javascript">
 
var UserName = decodeURIExtension((window.location.href.split("#"))[1]);
console.log(UserName);
</script>
</head>
<body>
 
</body>
</html>

5.ID指定 単一ターゲット型 iframeワンライン調整スクリプト

var ctrlLineWidth = {
    value:"",
    actualValue:"",
    baseFontSize:16,
    baseActualFontSize:0,
    translateSize:100,
    targetFontSize:0,
    targetId:"",
    targetElement:undefined,
    ctrlFontSize:(function(){}),
    overValue:undefined,
    setup:undefined
}
 
//フォントサイズ調整実行
ctrlLineWidth.ctrlFontSize = function(){
    //デフォルト設定付与
    ctrlLineWidth.actualValue = ctrlLineWidth.value;
    ctrlLineWidth.targetElement.innerHTML = ctrlLineWidth.actualValue;
    ctrlLineWidth.targetElement.style.fontSize = ctrlLineWidth.baseActualFontSize + "px";
    var actualFont = ctrlLineWidth.baseActualFontSize;
    var stringWidth = strLength(ctrlLineWidth.actualValue) * actualFont;
    var pageWidth = window.innerWidth;
    //文章横幅がWindowを超過していた場合
    if(stringWidth > pageWidth){
        //超過時に内容を変えるメソッドが用意されていた場合
        if(ctrlLineWidth.overValue){
            ctrlLineWidth.actualValue = ctrlLineWidth.overValue();
            ctrlLineWidth.targetElement.innerHTML = ctrlLineWidth.actualValue;
            stringWidth = strLength(ctrlLineWidth.actualValue) * actualFont;
            if(ctrlLineWidth.overValue){
                changeFontSize();
            }
            return;
        }
        changeFontSize();
    }
    //適切なフォントサイズを計算し、付与
    function changeFontSize(){
        var smartsize = Math.floor(pageWidth/strLength(ctrlLineWidth.actualValue));
        ctrlLineWidth.targetElement.style.fontSize = smartsize + "px";    
 
    }
 
    //全角/半角を区別してカウントする
    function strLength(strSrc){
        len = 0;
        strSrc = escape(strSrc);
        for(i = 0; i < strSrc.length; i++, len++){
            if(strSrc.charAt(i) == "%"){
                if(strSrc.charAt(++i) == "u"){
                    i += 3;
                    len++;
                }
                i++;
            }
        }
        len = Math.ceil(len.toString() / 2);
        return len;
    }
 
}
 
//フォントサイズ調整及びイベント紐付け
ctrlLineWidth.setup = function(){
    if(ctrlLineWidth.targetId.lenth == 0){
        return;
    }
    ctrlLineWidth.targetElement = document.getElementById(ctrlLineWidth.targetId);
    ctrlLineWidth.baseActualFontSize = Math.floor(ctrlLineWidth.baseFontSize * (ctrlLineWidth.translateSize/100));
    ctrlLineWidth.ctrlFontSize();
    window.addEventListener('resize', function (event) {
        ctrlLineWidth.ctrlFontSize();
    });
 
};

6:端末判定
var userTerminalData = (function(){
    var os, ua = navigator.userAgent;
 
    if (ua.match(/Win(dows )?NT 10\.0/)) {
        os = "Windows 10";                // Windows 10 の処理
    }else if (ua.match(/Win(dows )?NT 6\.3/)) {
        os = "Windows 8.1";                // Windows 8.1 の処理
    }else if (ua.match(/Win(dows )?NT 6\.2/)) {
        os = "Windows 8";                // Windows 8 の処理
    }else if (ua.match(/Win(dows )?NT 6\.1/)) {
        os = "Windows 7";                // Windows 7 の処理
    }else if (ua.match(/Win(dows )?NT 6\.0/)) {
        os = "Windows Vista";                // Windows Vista の処理
    }else if (ua.match(/Win(dows )?NT 5\.2/)) {
        os = "Windows Server 2003";            // Windows Server 2003 の処理
    }else if (ua.match(/Win(dows )?(NT 5\.1|XP)/)) {
        os = "Windows XP";                // Windows XP の処理
    }else if (ua.match(/Win(dows)? (9x 4\.90|ME)/)) {
        os = "Windows ME";                // Windows ME の処理
    }else if (ua.match(/Win(dows )?(NT 5\.0|2000)/)) {
        os = "Windows 2000";                // Windows 2000 の処理
    }else if (ua.match(/Win(dows )?98/)) {
        os = "Windows 98";                // Windows 98 の処理
    }else if (ua.match(/Win(dows )?NT( 4\.0)?/)) {
        os = "Windows NT";                // Windows NT の処理
    }else if (ua.match(/Win(dows )?95/)) {
        os = "Windows 95";                // Windows 95 の処理
    }else if (ua.match(/Windows Phone/)) {
        os = "Windows Phone";                // Windows Phone (Windows 10 Mobile) の処理
    }else if (ua.match(/iPhone|iPad/)) {
        os = "iOS";                    // iOS (iPhone, iPod touch, iPad) の処理
    }else if (ua.match(/Mac|PPC/)) {
        os = "Mac OS";                    // Macintosh の処理
    }else if (ua.match(/Android ([\.\d]+)/)) {
        os = "Android " + RegExp.$1;            // Android の処理
    }else if (ua.match(/Linux/)) {
        os = "Linux";                    // Linux の処理
    }else if (ua.match(/^.*\s([A-Za-z]+BSD)/)) {
        os = RegExp.$1;                    // BSD 系の処理
    }else if (ua.match(/SunOS/)) {
        os = "Solaris";                    // Solaris の処理
    }else {
        os = "N/A";                    // 上記以外 OS の処理
    }
    var smartPhone = false;
    smartPhone = ((ua.indexOf('iPhone') > 0 && ua.indexOf('iPad') == -1) || ua.indexOf('iPod') > 0 || ua.indexOf('Android') > 0);
 
    var browser = 'unknown';
    if ( ua.indexOf('Edge') !== -1 ) {
        browser = 'edge';
    } else if ( ua.indexOf('Chrome') !== -1 ) {
        browser = 'chrome';
    } else if ( ua.indexOf('Safari') !== -1 ) {
        browser = 'safari';
    }
    if ( ua.indexOf('Firefox') !== -1 ) {
        browser = 'firefox';
    }
    if ( ua.indexOf('MSIE 8') !== -1 ) {
        browser = 'ie8';
    } else if ( ua.indexOf('MSIE 9') !== -1 ) {
        browser = 'ie9';
    } else if ( ua.indexOf('MSIE 10') !== -1 ) {
        browser = 'ie10';
    } else if ( ua.indexOf('Trident') !== -1 ) {
        browser = 'ie11';
    }
    return {
                Os:os,
                SmartPhone:smartPhone,
                Browser:browser
            };
})();

7:下書きタイプ別検索

<html>
 
<head>
 
  <style>
/*
* CSS-Author: ukwhatn
* 
*/
    .selector-wrapper {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      align-items: center;
      width: 26em;
      max-width: 100%;
      height: 61px;
      margin: 0 auto;
    }
 
    .selector-wrapper>a {
      box-sizing: border-box;
      display: inline-block;
      flex: 0 0 12.5em;
      max-width: 45%;
      line-height: 2.25em;
      margin: 0 .25em;
      text-align: center;
      background-color: rgba(50, 141, 162, .75);
      border: rgba(50, 141, 162, 1) 1px solid;
      border-radius: .75em;
      text-decoration: none !important;
      font-weight: bold;
      color: white;
      font-family: sans-serif;
    }
 
    .selector-wrapper>a:hover {
      background: rgba(50, 141, 162, 1);
      border: rgba(50, 141, 162, 1) 1px solid;
      color: white;
    }
 
    .selector-wrapper>a.selected {
      background: rgba(0, 91, 110, 1);
      border: rgba(50, 141, 162, 1) 1px solid;
      color: white;
      pointer-events: none;
    }
 
    #selector-reset {
      display: none;
      flex: 0 0 20em;
      max-width: 90%;
      margin-top: 0.25em;
      line-height: 1.2em;
      text-align: center;
      background-color: rgba(0, 0, 0, .2);
      border: none;
      border-radius: .5em;
    }
 
    #selector-reset:hover {
      background-color: rgba(0, 0, 0, .35);
    }
 
    .selector-wrapper a.selected ~ #selector-reset {
      display: inline-block;
    }
  </style>
</head>
 
<body>
  <div class="selector-wrapper">
    <a id="selector-jp" href="http://scp-jp-sandbox3.wikidot.com/draft-list/tag/%2b_criticism-in,-_en,-_ru,-_ko,-_cn,-_fr,-_pl,-_es,-_th,-_de,-_it,-_ua,-_pt-br,-_cz,-_zh-tr,-_vn,-_otherlang,-_others,-_null" target="_top" class="">JP記事のみ</a>
    <a id="selector-translation" href="http://scp-jp-sandbox3.wikidot.com/draft-list/tag/%2b_criticism-in,-_scp-jp,-_tale-jp,-_goi-format-jp,-_others,-_null" target="_top">翻訳記事のみ</a>
    <a id="selector-reset" href="http://scp-jp-sandbox3.wikidot.com/draft-list" target="_top" style="">リセット</a>
  </div>
</body>
  <script>
/*
 * script-Autohr: C-take
 *
 */
 
    // 先にボタンを表示させたいのでスクリプトを後ろに回す
document.addEventListener('DOMContentLoaded',event=>{
    let ref = document.referrer;
    ref = ref.match(/\/tag\/[^\/]*\/|\/tag\/[^\/]*$/);
    // タグがない
    if(undefined === ref || null === ref || 0 == ref.length)
        return;
    // 余計な文字を消す
    ref = ref[0].replace(/^\/tag\//,'');
    ref = ref.replace(/\/$/,'');
    let target = null;
    switch(ref){
        case '%2b_criticism-in,-_en,-_ru,-_ko,-_cn,-_fr,-_pl,-_es,-_th,-_de,-_it,-_ua,-_pt-br,-_cz,-_zh-tr,-_vn,-_otherlang,-_others,-_null':
            // JP記事のみ
            target = document.querySelector('#selector-jp');
        break;
        case '%2b_criticism-in,-_scp-jp,-_tale-jp,-_goi-format-jp,-_others,-_null':
            // 翻訳のみ
            target = document.querySelector('#selector-translation');
        break;
 
    }
    // 選択リストに該当しない
    if(null == target)
        return;
    // 選択済み
   target.classList.add('selected');
 
});
  </script>
</html>
特に明記しない限り、このページのコンテンツは次のライセンスの下にあります: Creative Commons Attribution-ShareAlike 3.0 License