サンプル
コード
<!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> <meta http-equiv="Content-Script-Type" content="text/javascript"/> <meta http-equiv="Content-Style-Type" content="text/css"/> <meta http-equiv="content-language" content="ja,jp-ja"/> <meta charset="UTF-8"/> <title>ページクリエイター</title> <style type="text/css"> @import url(http://scp-jp.wdfiles.com/local--files/japanese-syntax/scp-WikidotCss.css); </style> <script type="text/javascript" src="http://ja.scp-wiki.net/scpmetatitlesearch/code/1"></script> <script type="text/javascript" src="http://ja.scp-wiki.net/scpmetatitlesearch/code/4"></script> <script type="text/javascript"> document.addEventListener("DOMContentLoaded",function(){ var paramNameEntity = { pagename:"pagename", category:"category", parent:"parent", tags:"tags", tagSelect:"tagselect", forcetag:"forcetag", pagetitle:"pagetitle", createButton:"createButton" } var displayParamTitle = new Object(); displayParamTitle[paramNameEntity.category] = "categoryName"; displayParamTitle[paramNameEntity.pagename] = "PageName"; displayParamTitle[paramNameEntity.pagetitle] = "PageTitle"; displayParamTitle[paramNameEntity.tags] = "tagsSet"; displayParamTitle[paramNameEntity.tagSelect] = "Select Tag: "; displayParamTitle[paramNameEntity.createButton] = "ページを作成"; var isForceTag = false; var isSelectBox = false; var paramsEntity = function(BooleanDefault){ var paramsSetting = new Object(); paramsSetting[paramNameEntity.category] = "string"; paramsSetting[paramNameEntity.parent] = "string"; paramsSetting[paramNameEntity.tags] = "string"; paramsSetting[paramNameEntity.forcetag] = "string"; paramsSetting[paramNameEntity.pagetitle] = "reverse-boolean"; paramsSetting[paramNameEntity.tagSelect] = "boolean"; for(var i in paramsSetting){ if(BooleanDefault){ switch(paramsSetting[i]){ case "boolean": paramsSetting[i] = false; break; case "string": paramsSetting[i] = ""; break; case "number": paramsSetting[i] = 0; break; case "reverse-boolean": paramsSetting[i] = true; break; } }else{ switch(paramsSetting[i]){ case "reverse-boolean": paramsSetting[i] = "boolean"; break; } } } this.paramList = paramsSetting; } var paramList = (new paramsEntity(false)).paramList; var locationH = location.href; if(locationH.indexOf("#") < 0)locationH += "#"; var settingList = locationH.split("#"); var setting = ""; for(var i = 1;i < settingList.length;i++){ setting += "#" + settingList[i]; } setting = setting.substring(1,setting.length); var params = setting.split(";"); var paramResult = (new paramsEntity(true)).paramList; for(i = 0; i < params.length;i++){ var singl = params[i]; if(singl){ setParam(singl); } } var paramDiv = document.createElement("div"); var paramTitle = document.createElement("b"); paramTitle.setAttribute("style","display:block;"); paramTitle.innerHTML = displayParamTitle[paramNameEntity.pagename]; var categorySpan = document.createElement("span"); categorySpan.setAttribute("id",displayParamTitle[paramNameEntity.category]); categorySpan.innerHTML = ""; if(paramResult[paramNameEntity.category]){ paramResult[paramNameEntity.category] = replasticPageName(paramResult[paramNameEntity.category]); if(paramResult[paramNameEntity.category].match(/\:./))paramResult[paramNameEntity.category] = ""; if(paramResult[paramNameEntity.category].length > 0){ if(!paramResult[paramNameEntity.category].match(/$\:/)){ paramResult[paramNameEntity.category] += ":"; } categorySpan.innerHTML = paramResult[paramNameEntity.category]; } } var pageNameInput = document.createElement("input"); pageNameInput.setAttribute("type","text"); pageNameInput.setAttribute("name",paramNameEntity.pagename); pageNameInput.setAttribute("style","height:1.5em;width:50%;"); pageNameInput.addEventListener( "keyup" ,function(e){ var obj = e.currentTarget; var objValue = obj.value; if(!objValue)return; var check = false; if(objValue.match(/[^a-zA-Z0-9\-_\:\[\]]/)){ check = true; } if(check){ obj.blur(); setTimeout(function(){obj.focus();},5) } while(objValue.match(/[^a-zA-Z0-9\-_\:\[\]]/)){ objValue=objValue.replace(/[^a-zA-Z0-9\-_\:\[\]]/,function(){ return ""; }); } obj.value = objValue; }); pageNameInput.addEventListener( "change" ,function(e){ var obj = e.currentTarget; obj.value=replasticPageName(obj.value); }); paramDiv.appendChild(paramTitle); paramDiv.appendChild(categorySpan); paramDiv.appendChild(pageNameInput); pagecreateForm.appendChild(paramDiv); if(paramResult[paramNameEntity.pagetitle]){ paramDiv = document.createElement("div"); paramTitle = document.createElement("b"); paramTitle.setAttribute("style","display:block;"); paramTitle.innerHTML = displayParamTitle[paramNameEntity.pagetitle]; var pageTitleInput = document.createElement("input"); pageTitleInput.setAttribute("name",paramNameEntity.pagetitle); pageTitleInput.setAttribute("type","text"); pageTitleInput.setAttribute("style","height:1.5em;width:50%;"); paramDiv.appendChild(paramTitle); paramDiv.appendChild(pageTitleInput); pagecreateForm.appendChild(paramDiv); } var createButton = document.createElement("input"); createButton.setAttribute("type","button"); createButton.setAttribute("value",displayParamTitle[paramNameEntity.createButton]); createButton.setAttribute("style","cursor:pointer;"); pagecreateForm.appendChild(createButton); paramResult[paramNameEntity.forcetag] = paramResult[paramNameEntity.forcetag].split(",").join(""); if(paramResult[paramNameEntity.tagSelect]){ var baseDiv = document.createElement("div"); paramTitle = document.createElement("b"); var selecter = document.createElement("select"); paramTitle.innerHTML = displayParamTitle[paramNameEntity.tagSelect]; if(paramResult[paramNameEntity.tags]){ if(paramResult[paramNameEntity.tags].length > 0){ paramResult[paramNameEntity.tags] = paramResult[paramNameEntity.tags].split(" ").join(","); var tagList = paramResult[paramNameEntity.tags].split(","); selecter.setAttribute("name",paramNameEntity.tags); for(var j = 0;j < tagList.length;j++){ if(tagList[j]){ if(tagList[j].length > 0){ var option = document.createElement("option"); option.value = tagList[j]; option.innerHTML = decodeURIExtension(tagList[j]); if(j == 0){ option.selected = true; isSelectBox = true; } selecter.appendChild(option); } } } } } if(isSelectBox){ baseDiv.appendChild(paramTitle); baseDiv.appendChild(selecter); baseDiv.appendChild(document.createElement("br")); baseDiv.appendChild(document.createElement("br")); pagecreateForm.insertBefore(baseDiv,pagecreateForm.firstChild); if(paramResult[paramNameEntity.forcetag].length > 0){ isForceTag = true; } } } if(!isSelectBox){ if(paramResult[paramNameEntity.forcetag].length > 0){ paramResult[paramNameEntity.tags] = paramResult[paramNameEntity.forcetag] + "," + paramResult[paramNameEntity.tags]; } createHideParam(paramNameEntity.tags); } createHideParam(paramNameEntity.parent); var StringFunction = "(function(elm){elm = elm.parentNode;\n"+ "elm." + paramNameEntity.pagename + ".value = replasticPageName(elm." + paramNameEntity.pagename + ".value);\n" + "if(elm." + paramNameEntity.pagename + ".value.length <= 0){return;}\n"+ "var url = document.referrer;\n"+ "url = 'http://' + (url.split('http://').join('').split('/')[0]) + '/';\n"+ "var category = document.getElementById('" + displayParamTitle[paramNameEntity.category] + "').innerHTML;\n"+ "url += category + elm." + paramNameEntity.pagename + ".value;\n"+ "url += '/edit/true';" + createFunction()+ "\n"+ createForceTag() + "if(elm." + paramNameEntity.parent + ".value.length > 0){url += '/parentPage/';\n"+ "url += elm." + paramNameEntity.parent + ".value;}\n"+ "window.parent.location.href = url;})(this);"; createButton.setAttribute("onclick",StringFunction); function setParam(target){ if(!target)return; target = target.trim(); if(target.indexOf("=") < 0)return; var parmName = target.split("=")[0]; if(!parmName)return; parmName = parmName.trim(); var paramValue = target.split("=")[1]; if(!paramValue)return; paramValue = paramValue.trim(); for(var i in paramList){ if(parmName == i){ switch(paramList[i]){ case "string": paramResult[i] = paramValue; break; case "boolean": if(paramValue == "false" || paramValue == "False" || paramValue == "0"){ paramResult[i] = false; }else if(paramValue == "true" || paramValue == "True" || paramValue == "1"){ paramResult[i] = true; } break; case "number": var checkNum = Number(paramValue); if(isNaN(checkNum))return; paramResult[i] = checkNum; break; } } } } function createHideParam(paramName){ var UnDisplaySetting = document.createElement("textarea"); UnDisplaySetting.setAttribute("name",paramName); UnDisplaySetting.setAttribute("style","display:none;"); UnDisplaySetting.value = ""; if(paramResult[paramName]){ if(paramResult[paramName].length > 0){ UnDisplaySetting.value = paramResult[paramName]; if(paramName == paramNameEntity.tags){ UnDisplaySetting.value = UnDisplaySetting.value.split(" ").join(","); var deleteSpace = UnDisplaySetting.value.split(","); UnDisplaySetting.value = ""; var isFirst = true; for(var i = 0;i < deleteSpace.length;i++){ if(deleteSpace[i].length > 0){ UnDisplaySetting.value += ((!isFirst)?",":"") +deleteSpace[i]; isFirst = false; } } } } } pagecreateForm.appendChild(UnDisplaySetting); } function createFunction(){ if(!paramResult[paramNameEntity.pagetitle])return ""; var result = "url += '/title/';if(elm." + paramNameEntity.pagetitle + ".value.length <= 0){"+ "url += elm."+paramNameEntity.pagename+".value;}else{"+ "url += elm."+ paramNameEntity.pagetitle + ".value;}"; return result; } function createForceTag(){ var result = "if(elm."+ paramNameEntity.tags + ".value.length > 0){\n"+ "url += '/tags/' + elm." + paramNameEntity.tags + ".value;}\n"; if(isForceTag){ result = "url += '/tags/" + paramResult[paramNameEntity.forcetag] + "';\n" + "if(elm."+ paramNameEntity.tags + ".value.length > 0){\n"+ "url += ',' + elm." + paramNameEntity.tags + ".value;}\n"; } return result; } }); </script> </head> <body> <form id="pagecreateForm"> </form> </body>
概要
ページ作成時に下記要素について任意の値を初期値とするページ作成フォームを作る事ができます。
- ページカテゴリ
- タグ
- 親ページ
使い方
下記の呼び出しコードを使用します。
[[iframe http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1 width="100%" height="120px"]]
上記のコードでは通常のページ作成フォームと機能的に変わりありません。
呼び出しするURLの後ろにハッシュ(#)を付け、その後に各パラメータを設定する事でページ作成時の初期値を設定できます。
カテゴリ初期値を設定
ハッシュの後に下記のコードを記述します。
category=<カテゴリ名>
カテゴリは必ずwikidotのページ名規則に則ったものを使用してください。
カテゴリの設定が適切である場合はページ名入力欄の左にカテゴリ名が表示されます。
コード例
[[iframe http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1#category=sample width="100%" height="120px"]]
タグの初期値を設定
ハッシュの後に下記のコードを記述します。
tags=<タグ名>
半角カンマ区切り(,)で複数のタグを設定できます。
tags=<タグA>,<タグB>
また[[iframe ~]]の場合は[[iframe ~ ]]自体の仕様の為不可能ですが、[[embed]]タグを用いた場合は、半角スペース区切りでタグを複数指定する事もできます。
tags=<タグA> <タグB>
コード例
[[embed]]
<iframe src="http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1#tags=sample tags" style="width:100%;height:120px;" frameborder="no"></iframe>
[[/embed]]
親ページ初期値を設定
ハッシュの後に下記のコードを記述します。
parent=<親ページ名>
親ページ名はカテゴリを含めたfullnameで指定してください。
複数のパラメータの設定
パラメータの後にセミコロンをつけ、そこから続けて他のパラメーターを設定します。
category=<カテゴリ名>;tags=<タグA>,<タグB>;parent=<親ページ名>
パラメーターを設定する順番は問いません。
1度のURLで同一のパラメーターを複数回設定できますが、その場合、最後におこなった設定が適用されます。
その他設定
ページタイトルフォーム非表示
下記のパラメーターを渡す事でページタイトル入力フォームを非表示にできます。
pagetitle=false
コード例
[[iframe http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1#pagetitle=false width="100%" height="80px"]]
このパラメーターもセミコロンを使う事によって他のパラメーターと同時に設定する事が可能です。
タグセレクターの表示
下記のパラメーターを設定するとタグセレクターが表示されます。
tagselect=true
タグセレクターはtagsで設定したタグの内、どれを初期値として設定するかユーザに選択させるコンボボックスです。この設定においては作成されたページに初期値として複数のタグを設定する事はできません。
コード例
[[iframe http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1#tags=タグa,タグb,タグc;tagselect=true width="100%" height="160px"]]
このパラメータも半角カンマを用いる事で他のパラメータと合わせて設定する事ができます。
強制タグ
上記のタグセレクター設定をtrueにした場合のみ有効です。下記パラメータによって強制的に初期設定されるタグを設定する事ができます。
forcetag=<タグ名>
この設定を付与した場合、ページ作成によって作られるページのタグはユーザが選択したタグと上記で設定タグの2つが初期設定として付与されます。
[[iframe http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1#tags=タグa,タグb,タグc;tagselect=true;forcetag=強制タグ width="100%" height="160px"]]
Wikidotモジュールとの連携
WikidotのListPagesから取得した値をパラメータに渡す事もできます。例えば下記のコードだとこのフォームを設置したページの子ページでなおかつカテゴリとタグが親ページと同一であるページを作る事ができます。
[[module ListPages range="." separate="yes"]]
[[embed]]
<iframe src="http://shitake-crude-production.wikidot.com/extension:pagecreate/code/1#tags=%%tags%%;category=%%category%%;parent=%%fullname%%" style="width:100%;height:120px;" frameborder="no"></iframe>
[[/embed]]
[[/module]]
その他機能
ページ名入力フォームは特定の半角文字のみ受け付けます。またフォーカスを外した際は、入力された文字を自動でWikidotのpagenameの規則に沿った形で加工します。




.png)


