「javascript/クエスト情報変換」の編集履歴(バックアップ)一覧はこちら
追加された行は緑色になります。
削除された行は赤色になります。
#js{{{{{
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
// クエストクリアまでは最大5回
var maxQ = 5;
$(document).ready(function(){
for(var num=1; num<=maxQ; num++){
apQuest(num);
}
});
function hyouji(){
var text = '';
// 色指定
var color_design = document.forms['form0'].elements['design'].value;
if(color_design == '1'){
var color_b = '#e6e6fa'; // 強調色
var color_h = '#f5fffa'; // 背景色
var color_t = '#17184b'; // タイトル
}
else if(color_design == '2'){
var color_b = '#bee0c2'; // 強調色
var color_h = '#f5fffa'; // 背景色
var color_t = '#004d25'; // タイトル
}
else if(color_design == '3'){
var color_b = '#fddea5'; // 強調色
var color_h = '#f5fffa'; // 背景色
var color_t = '#d3381c'; // タイトル
}
// Q_head部分 ごり押し
text += '|BGCOLOR(' + color_h + '):CENTER:40|BGCOLOR(' + color_h + '):CENTER:180|BGCOLOR(' + color_h + '):CENTER:180|BGCOLOR(' + color_h + '):CENTER:180|c\n';
text += '|>|>|>|BGCOLOR(' + color_t + '):COLOR(white):' + document.forms['form1'].elements['T_name'].value + '|\n';
text += '|AP' + document.forms['form1'].elements['T_ap'].value;
text += '|>|' + document.forms['form1'].elements['T_pl'].value;
text += '|推奨Lv.' + document.forms['form1'].elements['T_lv'].value + '|\n';
text += '|~|絆P : ' + document.forms['form1'].elements['T_kz'].value;
text += '|EXP : ' + document.forms['form1'].elements['T_xp'].value;
text += '|QP : ' + document.forms['form1'].elements['T_qp'].value + '|\n';
text += '|~|>|>|報酬 : ' + document.forms['form1'].elements['T_housyu'].value + '|\n'
// Q_num部分
for(var i=1; i<=maxQ; i++){
if(i==1){var check = "true";}
else {var check = document.forms['form1'].elements['c'+i].checked;}
if(check){
text += '|>|BGCOLOR(' + color_b + '):' + document.forms['form1'].elements['quest_num'].value + '-' + i + '|>|';
text += 'BGCOLOR(' + color_b + '):' + document.forms['form1'].elements['quest_class'+i].value + '|\n';
var numB = document.forms['form1'].elements['b'+i].value;
for(var j=1; j<=numB; j++){
text += '|' + j + '/' + numB + '|';
for(var k=1; k<=3; k++){
var enemy = '';
var inputNum = String(i)+String(j)+String(k);
if(document.forms['form1'].elements[inputNum+'name'].value != ""){
enemy += document.forms['form1'].elements[inputNum+'name'].value + '&br()';
enemy += 'Lv' + document.forms['form1'].elements[inputNum+'lv'].value;
enemy += '(' + document.forms['form1'].elements[inputNum+'class'].value + ')';
// カンマ区切り
var hp = document.forms['form1'].elements[inputNum+'hp'].value;
enemy += 'HP' + String(hp).replace(/(\d)(?=(\d{3})+$)/g , '$1,');
}
text += enemy + '|';
}
text += '\n';
}
}
else{break;}
}
document.forms['form0'].elements['out'].value = text;
}
// クエスト1回分(#Q_1,2,3,4,5)を作成
function apQuest(num){
// クエスト番号などの情報
var head = '';
head += '<tr><td colspan="2" style="background-color:#e6e6fa; text-align:center;">';
if(num != 1){head += '<input type="checkbox" name="c' + num + '" onclick="questCheck(this.checked, this.value);" value="' + num + '">';}
if(num == 1){head += '<input type="text" style="width:5em;" name="quest_num" value="">-';}
head += num + ' Battle<select name="b' + num + '" style="width:3em;" onChange="battleCheck(this.name, this.value);">';
head += '<option value="1">1</option><option value="2">2</option><option value="3" selected>3</option><option value="4">4</option><option value="5">5</option></select>回</td>';
head += '<td colspan="2" style="background-color:#e6e6fa; text-align:center;">';
head += 'クラス構成<input type="text" style="width:15em;" name="quest_class' + num + '" value=""></td></tr>';
$('#Q_' + num).append($(head));
// バトル情報
var td = '<td style="background-color:#f5fffa; text-align:center;">';
var maxB = 5;
for(var nowB=1; nowB<=maxB; nowB++){
var tr = $('<tr class="battle b' + nowB + '">');
// Battle数
tr.append($(td).html(nowB));
// ひと枠
var nakami = '';
for(var i=1; i<=3; i++){
// クラスだけ別処理
var optionC = ['剣', '弓', '槍', '騎', '術', '殺', '狂', '他'];
var selectC = '';
selectC += '<select style="width:4em;" name="' + num + nowB + i + 'class">';
for(var j=0; j<optionC.length; j++){
selectC += '<option value="' + optionC[j] + '">' + optionC[j] + '</option>';
}
selectC += '</select>';
// 表示
nakami = '<input type="text" style="width:12em;" name="' + num + nowB + i + 'name" value=""><br/>';
nakami += 'Lv<input type="number" style="width:3em;" name="' + num + nowB + i + 'lv" value="">';
nakami += '(' + selectC + ')';
nakami += 'HP<input type="number" style="width:6em;" name="' + num + nowB + i + 'hp" value="">';
tr.append($(td).html(nakami));
}
$('#Q_' + num).append(tr);
}
// 初期状態で非表示
$('#Q_' + num + ' tr.b4').css('display', 'none');
$('#Q_' + num + ' tr.b5').css('display', 'none');
if(num != 1){$('#Q_' + num + ' tr.battle').css('display', 'none');}
}
// チェックされたらクエストを表示
function questCheck(ischecked, num){
var value = document.forms['form1'].elements['b'+num].value;
if(ischecked){battleCheck(num ,value);}
else{battleCheck(num ,0);}
}
// バトル回数に合わせて表示
function battleCheck(num, value){
// 数字部分だけ抽出
var num = num.replace(/b/g, "");
// チェックの有無を確認
if(num == 1){var ischecked = "true";}
else{var ischecked = document.forms['form1'].elements['c'+num].checked;}
// チェックされていたら表示数を0行に
if(!ischecked){value = 0;}
// 表示数に合わせてCSSを変更
for(var i=1; i<=5; i++){
if(i > value){
$('#Q_' + num + ' tr.b' + i).css('display', 'none');
}
else{
$('#Q_' + num + ' tr.b' + i).css('display', 'table-row');
}
}
}
</script>
}}}}}
#html2{
<div>
<form name="form0" id="form0">
<textarea name="out" cols="150" rows="20">ここにwiki編集用の文字列が表示されます</textarea></br>
<select style="width:8em;" name="design">
<option value="1" selected>シナリオ</option>
<option value="2">フリー</option>
<option value="3">幕間</option>
</select>
</form>
<form name="form1" id="form1">
<input type="button" value="作成" onclick="hyouji()">
<table cellspacing="1" border="0">
<tbody id="Q_head">
<tr>
<td colspan="4" style="background-color:#17184b; color:white; text-align:center;">
クエスト名<input type="text" style="width:15em;" name="T_name" value="">
</td>
</tr>
<tr>
<td rowspan="3" style="background-color:#f5fffa; text-align:center; width:80px;">
AP<input type="number" style="width:4em;" name="T_ap" value="">
</td>
<td colspan="2" style="background-color:#f5fffa; text-align:center;">
地名<input type="text" style="width:10em;" name="T_pl" value="">
</td>
<td style="background-color:#f5fffa; text-align:center; width:300px;">
推奨Lv.<input type="number" style="width:4em;" name="T_lv" value="">
</td>
</tr>
<tr>
<td style="background-color:#f5fffa; text-align:center; width:250px;">
絆P : <input type="number" style="width:5em;" name="T_kz" value="">
</td>
<td style="background-color:#f5fffa; text-align:center; width:250px;">
EXP : <input type="number" style="width:5em;" name="T_xp" value="">
</td>
<td style="background-color:#f5fffa; text-align:center; width:250px;">
QP : <input type="number" style="width:5em;" name="T_qp" value="">
</td>
</tr>
<tr>
<td colspan="3" style="background-color:#f5fffa; text-align:center;">
報酬 : <input type="text" style="width:15em;" name="T_housyu" value="">
</td>
</tr>
</tbody>
<tbody id="Q_1"></tbody>
<tbody id="Q_2"></tbody>
<tbody id="Q_3"></tbody>
<tbody id="Q_4"></tbody>
<tbody id="Q_5"></tbody>
<tbody id="Q_hoka"></tbody>
</table>
</form>
</div>
}
#js{{{{{
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
// クエストクリアまでの最大回数
var maxQ = 5;
// 最大バトル数(変更する場合は、apQuestのoption配列も)
var maxB = 5;
$(document).ready(function(){
for(var num=1; num<=maxQ; num++){
apQuest(num);
}
});
function hyouji(){
var text = '';
// 色指定
var color_design = document.forms['form0'].elements['design'].value;
if(color_design == '1'){
var color_b = '#e6e6fa'; // 強調色
var color_h = '#f5fffa'; // 背景色
var color_t = '#17184b'; // タイトル
}
else if(color_design == '2'){
var color_b = '#bee0c2'; // 強調色
var color_h = '#f5fffa'; // 背景色
var color_t = '#004d25'; // タイトル
}
else if(color_design == '3'){
var color_b = '#fddea5'; // 強調色
var color_h = '#f5fffa'; // 背景色
var color_t = '#d3381c'; // タイトル
}
// Q_head部分 ごり押し
text += '|BGCOLOR(' + color_h + '):CENTER:40|BGCOLOR(' + color_h + '):CENTER:180|BGCOLOR(' + color_h + '):CENTER:180|BGCOLOR(' + color_h + '):CENTER:180|c\n';
text += '|>|>|>|BGCOLOR(' + color_t + '):COLOR(white):' + document.forms['form1'].elements['T_name'].value + '|\n';
text += '|AP' + document.forms['form1'].elements['T_ap'].value;
text += '|>|' + document.forms['form1'].elements['T_pl'].value;
text += '|推奨Lv.' + document.forms['form1'].elements['T_lv'].value + '|\n';
text += '|~|絆P : ' + str2num(document.forms['form1'].elements['T_kz'].value);
text += '|EXP : ' + str2num(document.forms['form1'].elements['T_xp'].value);
text += '|QP : ' + str2num(document.forms['form1'].elements['T_qp'].value) + '|\n';
text += '|~|>|>|報酬 : ' + document.forms['form1'].elements['T_housyu'].value + '|\n'
// Q_num部分
for(var i=1; i<=maxQ; i++){
if(i==1){var check = "true";}
else {var check = document.forms['form1'].elements['c'+i].checked;}
if(check){
text += '|>|BGCOLOR(' + color_b + '):' + document.forms['form1'].elements['quest_num'].value + '-' + i + '|>|';
text += 'BGCOLOR(' + color_b + '):' + document.forms['form1'].elements['quest_class'+i].value + '|\n';
var numB = document.forms['form1'].elements['b'+i].value;
for(var j=1; j<=numB; j++){
text += '|' + j + '/' + numB + '|';
for(var k=1; k<=3; k++){
var enemy = '';
var inputNum = String(i)+String(j)+String(k);
if(document.forms['form1'].elements[inputNum+'name'].value != ""){
enemy += document.forms['form1'].elements[inputNum+'name'].value + '&br()';
enemy += 'Lv' + document.forms['form1'].elements[inputNum+'lv'].value;
enemy += '(' + document.forms['form1'].elements[inputNum+'class'].value + ')';
// カンマ区切り
var hp = document.forms['form1'].elements[inputNum+'hp'].value;
enemy += 'HP' + String(hp).replace(/(\d)(?=(\d{3})+$)/g , '$1,');
}
text += enemy + '|';
}
text += '\n';
}
}
else{break;}
}
document.forms['form0'].elements['out'].value = text;
}
// 数字を文字列(カンマ区切り)に変換
function str2num(str){
return String(str).replace(/(\d)(?=(\d{3})+$)/g , '$1,');
}
// クエスト1回分(#Q_1,2,3,4,5)を作成
function apQuest(num){
//
// 番号など(背景色が濃い行)
//
var headTr = $('<tr>').css({'background-color':'#e6e6fa', 'text-align':'center'});
// チェックボックスの有無で条件分岐(バトル初回は常に表示)
if(num == 1){var input = $('<input>').attr({type:'text', name:'quest_num'}).css({width:'5em'}).val('').append('-');}
if(num >= 2){var input = $('<input>').attr({type:'checkbox', name:'c'+num}).click(function(){questCheck(this.checked, num);});}
// option 準備(1から5まで, [2]番目選択)
var arrOp = [1, 2, 3, 4, 5];
var optionNum = optionNumMake(arrOp,2);
// append
headTr
.append(
$('<td>').attr({colSpan:'2'}).append(input)
.append(num+' Battle').append(
$(optionNum).attr({name:'b'+num}).css({width:'3em'})
.change(function(){battleCheck(num, this.value);})
)
).append(
$('<td>').attr({colSpan:'2'}).append('クラス構成')
.append($('<input>').attr({type:'text', name:'quest_class'+num}).css({width:'15em'}).val(''))
);
$('#Q_' + num).append(headTr);
//
// 詳細(背景色が薄い部分)
//
for(var nowB=1; nowB<=maxB; nowB++){
// バトル数の表示
// 敵数調整用のoption
var arrOp = [1,2,3];
var optionNum = optionNumMake(arrOp,0);
// append
var battleNumTd = $('<td>').attr({rowSpan:'3'}).append(nowB)
.append($(optionNum).css({width:'3em'})/* あとでつくる */);
// エネミー情報(3×3)
for(var i=0; i<=2; i++){
var bodyTr = $('<tr>').css({'background-color':'#f5fffa', 'text-align':'center'}).addClass('battle b'+nowB);
// 最初だけバトル回数を表示
if(i == 0){bodyTr.append($(battleNumTd));}
for(var j=1; j<=3; j++){
// 識別用 name タグ(桁数で判別しているので、10枠以上にする場合は区切り文字を追加して全体的に改修)
var tdName = '' + num + nowB + (j + (i * 3));
console.log(tdName);
// クラス選択
var optionC = ['剣', '弓', '槍', '騎', '術', '殺', '狂', '秤', '讐', '他'];
var selectC = optionNumMake(optionC, 0);
// 1枠ぶん
bodyTd = $('<td>')
.append($('<input>').attr({type:'text', name:tdName+'name'}).css({width:'12em'})) /* 名前 */
.append('<br>').append('Lv')
.append($('<input>').attr({type:'number', name:tdName+'lv'}).css({width:'3em'})) /* Lv */
.append('(')
.append($(selectC).attr({name:tdName+'class'}).css({width:'4em'})) /* クラス */
.append(')HP')
.append($('<input>').attr({type:'number', name:tdName+'hp'}).css({width:'6em'})) /* HP */
bodyTr.append(bodyTd);
}
}
$('#Q_' + num).append(bodyTr);
}
// 初期状態で非表示
$('#Q_' + num + ' tr.b4').css('display', 'none');
$('#Q_' + num + ' tr.b5').css('display', 'none');
if(num != 1){$('#Q_' + num + ' tr.battle').css('display', 'none');}
}
// option 作成(arrOp:配列, ed:選択済)
function optionNumMake(arrOp, ed){
sel = $('<select>');
$.each(arrOp, function(i, v){
if(i == ed){sel.append($('<option>').val(v).text(v).attr({selected:'selected'}));}
if(i != ed){sel.append($('<option>').val(v).text(v));}
});
return sel;
}
// チェックされたらクエストを表示
function questCheck(ischecked, num){
var value = document.forms['form1'].elements['b'+num].value;
if(ischecked){battleCheck(num ,value);}
else{battleCheck(num ,0);}
}
// バトル回数に合わせて表示
function battleCheck(num, value){
// チェックの有無を確認
if(num == 1){var ischecked = "true";}
else{var ischecked = document.forms['form1'].elements['c'+num].checked;}
// チェック無しなら 表示数を0行に
if(!ischecked){value = 0;}
// 表示数に合わせてCSSを変更
for(var i=1; i<=5; i++){
if(i > value) {$('#Q_' + num + ' tr.b' + i).css('display', 'none');}
else {$('#Q_' + num + ' tr.b' + i).css('display', 'table-row');}
}
}
</script>
}}}}}
#html2{
<div>
<form name="form0" id="form0">
<textarea name="out" cols="150" rows="20">ここにwiki編集用の文字列が表示されます</textarea></br>
<select style="width:8em;" name="design">
<option value="1" selected>シナリオ</option>
<option value="2">フリー</option>
<option value="3">幕間</option>
</select>
</form>
<form name="form1" id="form1">
<input type="button" value="作成" onclick="hyouji()">
<table cellspacing="1" border="0">
<tbody id="Q_head">
<tr>
<td colspan="4" style="background-color:#17184b; color:white; text-align:center;">
クエスト名<input type="text" style="width:15em;" name="T_name" value="">
</td>
</tr>
<tr>
<td rowspan="3" style="background-color:#f5fffa; text-align:center; width:80px;">
AP<input type="number" style="width:4em;" name="T_ap" value="">
</td>
<td colspan="2" style="background-color:#f5fffa; text-align:center;">
地名<input type="text" style="width:10em;" name="T_pl" value="">
</td>
<td style="background-color:#f5fffa; text-align:center; width:300px;">
推奨Lv.<input type="number" style="width:4em;" name="T_lv" value="">
</td>
</tr>
<tr>
<td style="background-color:#f5fffa; text-align:center; width:250px;">
絆P : <input type="number" style="width:5em;" name="T_kz" value="">
</td>
<td style="background-color:#f5fffa; text-align:center; width:250px;">
EXP : <input type="number" style="width:5em;" name="T_xp" value="">
</td>
<td style="background-color:#f5fffa; text-align:center; width:250px;">
QP : <input type="number" style="width:5em;" name="T_qp" value="">
</td>
</tr>
<tr>
<td colspan="3" style="background-color:#f5fffa; text-align:center;">
報酬 : <input type="text" style="width:15em;" name="T_housyu" value="">
</td>
</tr>
</tbody>
<tbody id="Q_1"></tbody>
<tbody id="Q_2"></tbody>
<tbody id="Q_3"></tbody>
<tbody id="Q_4"></tbody>
<tbody id="Q_5"></tbody>
<tbody id="Q_hoka"></tbody>
</table>
</form>
</div>
}
Comments policy & Terms of Use
・ネタバレ自粛期間中はシナリオや真名のネタバレは禁止です!
ネタバレ自粛期間の文字列挿入箇所
・コメントの内容に準じたコメントフォームを利用しましょう!
※報告を扇動したり異なるフォームへの投稿が散見した場合、coや規制対応することがあります
・現在、異なる板へのガチャ報告に利用者が定型文で誘導を行えるようルール改定するか議論中です。
時間がありましたら賛成/反対だけで構わないのでレスの協力お願いします
閉じる