-
Notifications
You must be signed in to change notification settings - Fork 0
/
recipe.js
171 lines (150 loc) · 7.47 KB
/
recipe.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
// レシピクラスの定義
var Recipe = (function () {
let search_word, RecipeBooks = [], Materials = [], Icons = {};
return {
master: (json) => { // レシピ帳Jsonをセット or 返す
if (json !== undefined) { // データ形式:配列 レシビ帳名と入手は配列へ挿入
Object.keys(json).forEach((bookname) => {
let bookdata = { "book_name": bookname, "get": json[bookname].get, "icon": json[bookname].icon };
for (let key in json[bookname].list) {
RecipeBooks.push(Object.assign(json[bookname].list[key], bookdata));
};
});
Recipe.sort(RecipeBooks, "reset");
}
return RecipeBooks;
},
material: (json) => {
if (json !== undefined) Materials = json;
return Materials;
},
icon: function (json) {
if (json !== undefined) Icons = json;
return Icons;
},
icon_file: icon_name => { // アイコンファイル名検索(Recipeクラス)
return Icons[icon_name] == undefined ? "noimage" : Icons[icon_name];
},
// 検索メゾッド
// 入力:keywords 検索キーワード(半角空白区切りで複数or検索機能も有り)
search: function (keywords) {
let MList = []; // 検索ワードの配列変数
let FList = {}; // 検索結果の保存リスト
FList = JSON.parse(JSON.stringify(RecipeBooks));
if (keywords == undefined) keywords = "";
search_word = keywords;
MList = keywords.split(" ").join(" ").replace(/^[ ]+|[ ]+$/g, ''); // 全角空白→半角、前後の空白削除
MList = MList.split(" "); // 並び替えてまとめる
MList = Array.from(new Set(MList)); // ユニーク化
for (let MCnt = 0; MCnt < MList.length; MCnt++) { // 検索キーワード数だけ繰り返す
let keyword = MList[MCnt];
for (let idx in FList) {
let data = FList[idx];
let bookname = data.book_name;
let texts = bookname + " " + data.product_name + " " + data.recipe_name +
" " + data.item1_name + " " + data.item2_name + " " + data.item3_name;
if (texts.indexOf(keyword) == -1) { // 検索に引っかからない場合
delete FList[idx]; // 削除
};
};
};
return FList;
},
// ソート処理(入力:ソート対象、ソート順)
sort: function (FList, mode) {
let params = mode.split('.');
switch (params[0]) {
case "HP":
FList = FList.filter(a => parseInt(a.recovery) > 0);
FList = FList.sort((a, b) => parseInt(a.recovery) < parseInt(b.recovery) ? -1 : 1);
break;
case "Rank": // Rankソート(Rank)
FList = FList.sort((a, b) => parseInt(a.req_rank1) < parseInt(b.req_rank1) ? -1 : 1);
break;
default: // 通常ソート(レシピ帳、Rank、レシピ名)
FList = FList.sort((a, b) => a.recipe_name > b.recipe_name ? -1 : 1);
FList = FList.sort((a, b) => parseInt(a.req_rank1) < parseInt(b.req_rank1) ? -1 : 1);
FList = FList.sort((a, b) => a.book_name < b.book_name ? -1 : 1);
break;
};
switch (params[1]) {
case "desc":
FList = FList.reverse();
break;
default: // "asc"などはこちら
break;
};
return FList;
},
// HTML書き出しメゾット
write: function (FList, slist) {
let HTML = "", old_book = "", data = [];
let mobile = window.innerWidth >= 768 ? false : true; // 768以上はPC。他はモバイル
document.getElementById('result').textContent = '';
if (search_word !== "") HTML = "<h2>" + search_word + "の検索結果</h2>"; // 検索キーワード
switch (slist) {
case true: // ソート時
Object.keys(FList).forEach(idx => data.push(FList[idx]));
break;
case false: // 非ソート時
Object.keys(FList).forEach(idx => {
if (FList[idx].book_name !== old_book && old_book !== "") { // レシピ帳名変更&初期以外
HTML += write_table({ "data": data, "sort": slist, "mobile": mobile }); // HTML生成を行う
data = []; // データ初期化
}
data.push(FList[idx]); // データ追加
old_book = FList[idx].book_name; // 変化チェック用変数へレシピ帳名を保管
});
break;
};
if (data.length > 0) HTML += write_table({ "data": data, "sort": slist, "mobile": mobile }); // HTML生成を行う
document.getElementById("result").insertAdjacentHTML('afterbegin', HTML);
return;
// 1テーブルを生成する関数(writeの内部処理)
// 入力:params / 出力:HTMLにHTML生成結果
function write_table(params) {
let HTML = "", data;
if (!params.sort && params.mobile) { // 非ソート&モバイル時はレシピ帳のタイトルを表示
data = params.data[0];
HTML += `<hr>\n<h3><img class="float" src="./icon/${data.icon }.png" onerror="this.onerror = null; this.src='./icon/noimage.png';"><a onclick="Cooking.search('${data.book_name}');">${data.book_name}</a><br>`;
HTML += "<span class='get'>入手:" + data.get + "</span></h3>\n";
}
if (params.mobile || params.sort) {
HTML += `<table><colgroup><col class="s15"><col class="s55"></colgroup>\n`; // mobileテーブル開始
} else {
HTML += `<hr>\n<table><colgroup><col class="s20"><col class="s10"><col class="s50"></colgroup>\n`; // テーブル開始
};
Object.keys(params.data).forEach(idx => {
data = params.data[idx];
HTML += "<tr>" // 1行目開始
if (!params.sort && !params.mobile && idx == 0) { // 非ソート&PC時&1行目はレシピ帳のタイトルを表示
HTML += `<td rowspan="${params.data.length * 3}"><img src="./icon/${data.icon}.png" onerror="this.onerror = null; this.src='./icon/noimage.png';"><br><a onclick="Cooking.search('${data.book_name}');">${data.book_name}</a><br>`;
HTML += "<span class='get'>入手:" + data.get + "</span></td>\n";
}
HTML += '<td class="icon" rowspan="3">'; // 完成品アイコンの表示
HTML += `<img class="icon" src="./icon/${Recipe.icon_file(data.product_name)}.png" onerror="this.onerror = null; this.src='./icon/noimage.png';">`;
HTML += data.recovery > 0 ? `<br>+${data.recovery}` : "";
//HTML += `<img class="icon" src="./icon/${Recipe.icon_file(data.product_name)}.png"><br>+${data.recovery}`;
HTML += `</td><td><a onclick="Cooking.search('${data.product_name}');">${data.product_name}</a>(Rank:${data.req_rank1})`; // 完成品とレシピ名の表示
HTML += `<span class="recipe nobr"> / レシピ: <a onclick="Cooking.search('${data.recipe_name}');">${data.recipe_name}</a></span></td>`;
HTML += '</tr>\n<tr>'; // 1行目終了&2行目開始
let MateHTML = ""; // 材料の表示
let item_name = [data.item1_name, data.item2_name, data.item3_name].filter(v => v !== "");
let item_rnum = [data.item1_reqnum, data.item2_reqnum, data.item3_reqnum].filter(v => v !== "");
item_name.forEach((mkey, midx) => {
let matename = mkey + "(" + item_rnum[midx] + ")";
let alink = `<a onclick="Cooking.search('${mkey}');">${matename}</a>`;
MateHTML += `<span class='recipe'>${alink}</span>, `;
MateHTML = item_name.length == midx + 1 ? MateHTML.slice(0, -2) : MateHTML;
});
HTML += `<td><span class='recipe nobr'>材料: </span>${MateHTML} <span class='recipe nobr'> / 生産数: ${data.created}</span></td>`;
HTML += '</tr>\n<tr>'; // 2行目終了&3行目開始
HTML += `<td><span class="recipe">備考: ${data.memo}</span></td>`;
HTML += '</tr>\n'; // 3行目終了
});
HTML += '</table>\n'; // テーブル終了
return HTML;
}
}
};
})();