『弓手の庵』 -ラグナロクオンラインROのレンジャーの日記-

ラグナロクオンラインROのレンジャーの日記 復帰しました

 

精算計算機を作ってみました&公開もします(更新)


Category: 開発部   Tags: ---
011.jpg

ブログの左上に置いてますが簡単な精算計算機をつくってみました。
これは何かと言うと臨時後の精算時の手間を減らすツールです。

メカニックを持っていますが臨時後に精算する機会が増えました。

例えばタナトスタワーへ大人数PTで行っ後には
重量いっぱいに荷物を持ち帰りカート⇔荷物で装備や収集品を移動しなければなりません。

さらに厄介なことに重量オーバーだったりすると
装備や収集品を2回に分けて売る必要があります。

そうなると何を売っていくらだったのかをメモることが必要になるのですが地味に面倒です。

以前はエクセルで計算できるものを作ったのですが
そのファイルを探して立ち上げることも面倒に感じるようになりました。

ブログの左側に分からないことを調べるためのリンクを並べていますが
いっそのことブログのプラグインとして作ればブログを開くついでに
計算できてしまうじゃないか!ということで作りました。

ソースを公開することにしたので使ってみたい!と思った人は使ってください。

メカニックで精算するときに使ったんですが激しく便利でした。(本人談)
一番楽なのはコピペで貼りつけられるところです。

***機能追加***
・コメント機能を追加(2011/02/21)
 狩りは楽しかった、アクビが神だった、レンジャーは引退します、など、
 その狩りに対してコメントを添えることができます。

 コメント機能は削除(2013/11/11)
・別ウインドウにテキスト出力する機能を追加(2011/02/21)
 コピペしてテキストファイルに保存ができます。
 露店でドロップ品を売って後で配布、などの状況になった際
 そのことをメモっておいてテキストファイルをスカイプで共有、もできるかと思います。
・計算枠を6つから8つに増加(2011/03/06)

***精錬計算機の使い方***
�テキストボックス内に金額を入力します。
 数字以外を入れると計算ボタンを押した際にエラーがでます。

�金額の右側の選択項目を選択します。
 何を売って得た金額なのかを設定できます。

�コメントを選択してください。

�配布する人数を確認して入力します。

�金額と人数を入力したら計算ボタンを押します。
 テキストボックス内の数値の合計と人数で割った配布額が出力されます。

�計算結果をコピーし、ラグナロクのウインドウに切り替えた後に
 ゲーム内のテキストボックスにShift+Insertで貼り付けます。

�出力ボタンを押すと別ウインドウが開いてデータがテキストで出力されます。
 狩場名、金額を配布していない人などのメモ書きも付け加えられます。
 保存したい場合は全てを選択してコピー&ペーストでテキストファイルに保存してください。

---------------------------------------------

***FC2ブログへの設置の仕方***

自分のブログのプラグインとして使ってみたい!って人は使ってみてください。
ソースの改変又は改良したものを再配布などは自由に行なってもらっても構いません。

FC2ブログへの設置の仕方は次の通りです。
FC2ブログ以外への設置は自分でなんとかしてください。

1.管理画面の「プラグインの設定」をクリック
012.jpg

2.PC用「公式プラグイン追加」を選択
013.jpg

3.拡張プラグイン、フリーエリアの「追加」を選択
014.jpg

4.「フリーエリア内容の変更」の欄に以下のソースをそのままコピペします。
<form name="keisan">
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
<input type="text" name="txtb" value="0" style="text-align: right;" size=15>
<select name="item" size=1>
<option value="------">------</option><option value="装備">装備</option>
<option value="収集品">収集品</option><option value="オークション">オークション</option>
<option value="武器">武器</option><option value="防具">防具</option>
<option value="カード">カード</option><option value="レア">レア</option>
<option value="その他">その他</option>
</select><br>
人数<input type="text" name="num" value="12" style="text-align: right;" size=3>
<input type="button" value="計算" onclick="sum()"><input type="button" value="出力" onclick="writeresult()"><br>

合計<input type="text" name="result" value="0" style="text-align: right;" size=28><br>
配布<input type="text" name="result" value="0" style="text-align: right;" size=28><br>
時計<input type="text" name="clock" style="text-align: right;" size="28"><br>
</form>

<script type="text/javascript" charset="euc-jp">
<!--

(function() {
clock();
})()

//時計
function clock(){
daytable = new Array("Sun","Mon","Tue","Wed","Thu","Fri","Sat");
now = new Date();
yy = now.getYear();
mm = now.getMonth() + 1;
dd = now.getDate();
dy = now.getDay();
if (yy < 2000) { yy += 1900; }
if (mm < 10) { mm = "0" + mm; }
if (dd < 10) { dd = "0" + dd; }
hh = now.getHours();
ms = now.getMinutes();
ss = now.getSeconds();
if (hh < 10) { hh = "0" + hh; }
if (ms < 10) { ms = "0" + ms; }
if (ss < 10) { ss = "0" + ss; }
document.keisan.clock.value = yy+"."+mm+"."+dd+" "+daytable[dy]+" "+hh+":"+ms+":"+ss;
setTimeout( "clock()", 1000 );
}

function txwrite(str){
document.write(str);
}

//userAgentを取得しブラウザ名とバージョンを取得して表示する
uAgent = navigator.userAgent;
if( uAgent.indexOf("Opera",0 ) != -1){ //Opera
brwsr = "Opera";
if( ( mytop = uAgent.indexOf("Version/",0 ) ) != -1){ //ver10以上かを確認
//IEもしくはFirefoxとして認識させた場合
if( (uAgent.indexOf("MSIE",0 ) != -1)||(uAgent.indexOf("Firefox",0 ) != -1) ){
mytop = uAgent.indexOf("Opera/",0 ) + 6;
}else { //それ以外
mytop += 8;
}
txwrite( "Opera"+" "+uAgent.substring( mytop ) );
}else{ //ver10未満の場合
txwrite( "Opera" );
}
}else if( ( mytop = uAgent.indexOf( "Chrome/",0 )) != -1){ //Google Chrome
//ChromeのuserAgentは"GoogleChrome *.*.***.** Safari..."のような表示
//"Chrome/"+7個目からスペース" "までを切り取ってversionとする
brwsr = "Chrome";
mytop += 7;
txwrite( "Google"+brwsr+" "+uAgent.substring( mytop, uAgent.indexOf( " ",mytop ) ) );
}else if( ( mytop = uAgent.indexOf("Firefox/",0 )) != -1){ //Firefox
brwsr = "Firefox";
 mytop += 8;
if ( ( mylast = uAgent.indexOf( " ",mytop ) ) != -1 ){ //"Firefox/**.**.** "の最後のスペース" "を検索
//" "があれば"Firefox/**.**.** "の"/"と" "の間をversionとして表示
txwrite( brwsr+" "+uAgent.substring( mytop,mylast ) );
}else{ //"Firefox/**.**.**"のようにスペースがなかったら文字列の最後までversionとする
txwrite( brwsr+" "+uAgent.substring( mytop ) );
}
}else if(( mytop = uAgent.indexOf("Netscape",0 )) != -1){ //Netscape
brwsr = "Netscape";
txwrite( brwsr );
}else if(( mytop = uAgent.indexOf("Safari/",0 )) != -1){ //Safari
if( uAgent.indexOf( "Chrome",0 ) == -1){ //"Chrome"が含まれていなければSafari
brwsr = "Safari";
txwrite( brwsr );
}
}else if( ( mytop = uAgent.indexOf("MSIE ",0 )) != -1){ //IE
//userAgent"...(compatible; MSIE 8.0; Windows NT..."の
//"MSIE "の次の文字から";"までを切り取りversionとする
brwsr = "Internet Explorer";
mytop += 5;
txwrite( brwsr+" "+uAgent.substring( mytop, uAgent.indexOf( ";",mytop ) ) );
}

//ブラウザによってテキストボックスの幅が長く表示されるので調整する
if ( brwsr == "Chrome" || brwsr == "Safari" || brwsr == "Firefox" ){
for(i=0; i<document.keisan.txtb.length;i++){
document.keisan.txtb[i].size = 10;
}
document.keisan.result[0].size = 20;
document.keisan.result[1].size = 20;
document.keisan.clock.size = 20;
}
if ( brwsr == "Opera" ){
document.keisan.result[0].size = 24;
document.keisan.result[1].size = 24;
document.keisan.clock.size = 24;
}

//計算ボタンを押した際の動作
function sum()
{
function checkIsNumber(value){ //0123456789の数字かどうかをチェック
return (value.match(/[0-9]+/g) == value);
}

function PrintError(str){ //エラー出力
throw str;
}

try{
  //入力チェック
for (i=0; i<document.keisan.txtb.length; i++){
//扱う桁数は12桁までとする [***,***,***,***]
if( document.keisan.txtb[i].value.length > 12) PrintError("1-6:over 12digits.");
//数字以外の文字が含まれていればエラー扱い
if( !checkIsNumber( document.keisan.txtb[i].value ) ) PrintError("input number only.");
}
//人数は3桁までとする [***]
if( document.keisan.num.value.length > 3) PrintError("人数:over 3digits.");
//数字以外の文字が含まれていればエラー扱い
if( !checkIsNumber( document.keisan.num.value ) ) PrintError("input number only.");

var all = 0;
for (i=0; i<document.keisan.txtb.length; i++){
all += eval( parseInt( document.keisan.txtb[i].value,10 ) );
}
document.keisan.result[0].value = all;
document.keisan.result[1].value = Math.round( all/eval( parseInt( document.keisan.num.value,10 ) ) );
}
catch(e){
document.keisan.result[0].value = e; //エラー内容をテキストボックスで表示
}

}


//出力を別ウインドウで出力する
function writeresult(){
var w = window.open( "","","width=440,height=470" );
var data = "<textarea name=\"text\" cols=\"50\" rows=\"18\" >精算計算機 計算結果 "+document.keisan.clock.value+"\n";
for (i=0; i<document.keisan.txtb.length; i++){
data += ( document.keisan.txtb[i].value+" "+document.keisan.item[i].value+"\n");
}
data += ( "合計 "+document.keisan.result[0].value+"\n人数 "+document.keisan.num.value+"\n配布 "+document.keisan.result[1].value+"\n狩場:\n未配布:\nメモ:\n"+"</textarea><br>保存する場合はコピー&ペーストして<br>テキストファイルに保存してください。<br><a href=\"javascript:window.close();\" title=\"close\">close</a>" );

w.document.write(data);
w.document.close();
}

// -->
</script>


動かない、形が崩れるなどは自分で調整してください。

テンプレートの種類によっては
CSSでプラグインのテキストボックスの幅を固定していて
形が崩れる場合もあるかもしれません。
そちらの設定を解除するなどの確認をお願いします。

---------------------------------------------

***技術的な追記***

・時計(ローカルタイム)表示機能を追加
使っているPCのローカルタイム表示をします。時計が狂っていれば狂った時刻が表示されるでしょう

・userAgentを取得してブラウザ名とバージョンを表示する機能を追加
 表示自体はあまり意味のない機能ですがブラウザ判別を行うために付けてみました

・ブラウザ別にテキストボックスの幅を変えるように修正

・コメント機能を追加(2011/02/21)
 意外とおもしろかった

・別ウインドウを開きテキストエリアにデータを出力できるように修正(2011/02/21)
 コピペしてテキストファイルに結果を保存できるようにした

・計算枠を6つから8つにした(2011/03/06)

初めてjavascriptでソフトというかプラグインを作ってみたんですが
面白いですねjavascript。

エクセルでできるくらいの簡単な計算ソフトを作るつもりでしたが
あれをやるにはこうしなくちゃいけないとかいろいろ出てきてしまい
結構時間を費やしてしまいました。

メソッドの概念ってこれでいいのか?とか、、、
formの羅列ってなんかあまり美しくないなとか
javascriptってこんな書き方でいいのかとか
未だに疑問が多いんですがとりあえず動くので公開します。

javascriptに精通している人なら突込みどころもあると思いますが
初心者の第一歩ってことで。
ここをこうしたほうがいいよって意見はありがたいです。


メモ
・使用しているブラウザを判別するにはuserAgentを取得して
 ブラウザ名とバージョンはuserAgentに含まれる文字列から判断する
・見た目調整のためだけならブラウザ名の取得だけでよく、
 バージョン名は取得する必要はなかった
・eval関数は0x0010や0010のように0が先頭にくると8進法や16進法で計算してしまう!
 parseInt関数と合わせて処理した。
・記号を入力したらエラー扱いに
・時計の表示は"yyyy/mm/dd day hh:mm:ss"のように二桁なら二桁で固定しないと
 0~9のような一桁の時に形が崩れてしまう。
・ブラウザ毎にローカルタイム表示したときの表示形式が違うw
 のでどのブラウザでも同じ表示になるようにした。
・GoogleChrome、Opera、Safari、Firefoxはテキストボックスの長さが
 全体の形が崩れるので調整(2013/11/11)
・IE8.0、Firefox、GoogleChrome、Opera、Safariの5つのブラウザで動作確認(2011/08/23)
 NetscapeNavigaterでの表示は未確認
スポンサーサイト


Comments

Leave a Comment


 
リンク
 
精算計算機
臨時精算の計算を行えるプラグインです。ボックス内の数字の合計と合計を人数で割った配布額を計算します。それぞれ何を売って得たお金なのかも設定できます。計算結果をコピー&ペーストします。(ゲーム内への貼り付けはShift+Insert)
詳細はこちら








人数
合計
配布
時計
 
 
 
全記事表示リンク
 
プロフィール

レンジャー

Author:レンジャー
ラグナロクオンラインのMimir鯖の某レンジャーです。2年半の冬眠(休止)を経て復帰。

© Gravity Co., Ltd. & LeeMyoungJin(studio DTDS) All rights reserved.
© GungHo Online Entertainment, Inc. All Rights Reserved.
当コンテンツの再利用(再転載・配布など)は、禁止しています。

 
 
検索フォーム
 
訪問者数
 


Archive RSS Login