<link rel="stylesheet" type="text/css" media="screen" href="https://marines.sakura.ne.jp/script/tablesorter/theme/style.css" charset="Shift_JIS" /> <style type="text/css"> tbody tr th { padding: 0 5px; } tbody tr td.number { text-align: center; } tbody tr td.mark { text-align: center; } tbody tr td.text { text-align: left; } </style> <script type="text/javascript" src="https://marines.sakura.ne.jp/script/jquery.tablesorter.min.js"></script> <script type="text/javascript" src="https://marines.sakura.ne.jp/script/jquery.json2table.js"></script> <script type="text/javascript"> var musics; var table; var level_min = 1; var level_max = 12; var level_delta = 1; var notes_min = 0; var notes_max = 1199; var notes_delta = 100; $(document).ready(function() { $.getJSON('https://library.maplia.jp/json/musics_sevenscode.json', function(data) { musics = data; table = $('#table_musics'); // レベルフィルタ select_level = $('#select_level'); select_level.append($('<option/>', { value: -1, text: 'すべて' })); for (var i = level_min; i <= level_max; i += level_delta) { select_level.append($('<option/>', { value: i, text: i + (level_delta == 1 ? '' : '~' + (i + level_delta - 1)) })); } // ノート数フィルタ select_notes = $('#select_notes'); select_notes.append($('<option/>', { value: -1, text: 'すべて' })); for (var i = notes_min; i <= notes_max; i += notes_delta) { select_notes.append($('<option/>', { value: i, text: i + '~' + (i + notes_delta - 1) })); } createMusicTable(); filterMusicTable(); }); }); function createMusicTable() { var table_data = {}; table_data.thead_column_classes = [ 'style_th', 'style_th', 'style_th', 'style_th', 'style_th' ]; table_data.tbody_column_classes = [ 'style_th', 'text', 'mark', 'number', 'number' ]; table_data.thead = []; table_data.tbody = []; table_data.thead[0] = { values: ['#', 'タイトル', '難易度', 'レベル', 'ノート数'] }; $.each(musics, function(i, music) { if (!music.deleted) { music.full_title = music.title + (typeof music.subtitle === "undefined" ? '' : ' ' + music.subtitle); if (music.number > 900) { music.number = 'Ex' + (music.number % 900); } if (music.simple_normal.level) { table_data.tbody[table_data.tbody.length] = { id: music.id + '_s_nor', class_name: 'chart_7c_s_nor', values: [ music.number, music.full_title, 'S-NOR', parseInt(music.simple_normal.level), music.simple_normal.notes ] }; } if (music.simple_hard.level) { table_data.tbody[table_data.tbody.length] = { id: music.id + '_s_hrd', class_name: 'chart_7c_s_hrd', values: [ music.number, music.full_title, 'S-HRD', parseInt(music.simple_hard.level), music.simple_hard.notes ] }; } if (music.simple_master.level) { table_data.tbody[table_data.tbody.length] = { id: music.id + '_s_mas', class_name: 'chart_7c_s_mas', values: [ music.number, music.full_title, 'S-MAS', parseInt(music.simple_master.level), music.simple_master.notes ] }; } if (music.chaos_normal.level) { table_data.tbody[table_data.tbody.length] = { id: music.id + '_c_nor', class_name: 'chart_7c_c_nor', values: [ music.number, music.full_title, 'C-NOR', parseInt(music.chaos_normal.level), music.chaos_normal.notes ] }; } if (music.chaos_hard.level) { table_data.tbody[table_data.tbody.length] = { id: music.id + '_c_hrd', class_name: 'chart_7c_c_hrd', values: [ music.number, music.full_title, 'C-HRD', parseInt(music.chaos_hard.level), music.chaos_hard.notes ] }; } if (music.chaos_master.level) { table_data.tbody[table_data.tbody.length] = { id: music.id + '_c_mas', class_name: 'chart_7c_c_mas', values: [ music.number, music.full_title, 'C-MAS', parseInt(music.chaos_master.level), music.chaos_master.notes ] }; } } }); table.json2table(table_data); table.tablesorter({sortList: [[3, 1]]}); } function filterMusicTable() { mode = parseInt($(':radio[name="mode"]:checked').val()); diff = parseInt($(':radio[name="diff"]:checked').val()); level = parseInt($('select[name="level"]').val()); notes = parseInt($('select[name="notes"]').val()); count = musics.length * (2 * 3); $.each(musics, function (i, music) { if (((mode == 0) || (mode == 1)) && ((diff == 0) || (diff == 1))) { $('#' + music.id + '_s_nor').show(); } else { count--; $('#' + music.id + '_s_nor').hide(); } if (((mode == 0) || (mode == 1)) && ((diff == 0) || (diff == 2))) { $('#' + music.id + '_s_hrd').show(); } else { count--; $('#' + music.id + '_s_hrd').hide(); } if (((mode == 0) || (mode == 1)) && ((diff == 0) || (diff == 3))) { $('#' + music.id + '_s_mas').show(); } else { count--; $('#' + music.id + '_s_mas').hide(); } if (((mode == 0) || (mode == 2)) && ((diff == 0) || (diff == 1))) { $('#' + music.id + '_c_nor').show(); } else { count--; $('#' + music.id + '_c_nor').hide(); } if (((mode == 0) || (mode == 2)) && ((diff == 0) || (diff == 2))) { $('#' + music.id + '_c_hrd').show(); } else { count--; $('#' + music.id + '_c_hrd').hide(); } if (((mode == 0) || (mode == 2)) && ((diff == 0) || (diff == 3))) { $('#' + music.id + '_c_mas').show(); } else { count--; $('#' + music.id + '_c_mas').hide(); } if (level != -1) { if ((music.simple_normal.level < level) || (music.simple_normal.level >= level + level_delta)) { if ($('#' + music.id + '_s_nor').is(':visible')) { count--; } $('#' + music.id + '_s_nor').hide(); } if ((music.simple_hard.level < level) || (music.simple_hard.level >= level + level_delta)) { if ($('#' + music.id + '_s_hrd').is(':visible')) { count--; } $('#' + music.id + '_s_hrd').hide(); } if ((music.simple_master.level < level) || (music.simple_master.level >= level + level_delta)) { if ($('#' + music.id + '_s_mas').is(':visible')) { count--; } $('#' + music.id + '_s_mas').hide(); } if ((music.chaos_normal.level < level) || (music.chaos_normal.level >= level + level_delta)) { if ($('#' + music.id + '_c_nor').is(':visible')) { count--; } $('#' + music.id + '_c_nor').hide(); } if ((music.chaos_hard.level < level) || (music.chaos_hard.level >= level + level_delta)) { if ($('#' + music.id + '_c_hrd').is(':visible')) { count--; } $('#' + music.id + '_c_hrd').hide(); } if ((music.chaos_master.level < level) || (music.chaos_master.level >= level + level_delta)) { if ($('#' + music.id + '_c_mas').is(':visible')) { count--; } $('#' + music.id + '_c_mas').hide(); } } if (notes != -1) { if ((music.simple_normal.notes < notes) || (music.simple_normal.notes >= notes + notes_delta)) { $('#' + music.id + '_s_nor').hide(); count--; } if ((music.simple_hard.notes < notes) || (music.simple_hard.notes >= notes + notes_delta)) { $('#' + music.id + '_s_hrd').hide(); count--; } if ((music.simple_master.notes < notes) || (music.simple_master.notes >= notes + notes_delta)) { $('#' + music.id + '_s_mas').hide(); count--; } if ((music.chaos_normal.notes < notes) || (music.chaos_normal.notes >= notes + notes_delta)) { $('#' + music.id + '_c_nor').hide(); count--; } if ((music.chaos_hard.notes < notes) || (music.chaos_hard.notes >= notes + notes_delta)) { $('#' + music.id + '_c_hrd').hide(); count--; } if ((music.chaos_master.notes < notes) || (music.chaos_master.notes >= notes + notes_delta)) { $('#' + music.id + '_c_mas').hide(); count--; } } if (count <= 0) { $('#table_rows').text('フィルター条件に該当する譜面はありません'); } else { $('#table_rows').text(count + '譜面が該当しました'); } }); } </script> <p> 譜面タイプフィルター: <label><input type="radio" name="mode" value="0" onchange="filterMusicTable()" checked="checked"> 全譜面</label> <label><input type="radio" name="mode" value="1" onchange="filterMusicTable()"> シンプル</label> <label><input type="radio" name="mode" value="2" onchange="filterMusicTable()"> カオス</label> <br/> 難易度フィルター: <label><input type="radio" name="diff" value="0" onchange="filterMusicTable()" checked="checked"> 全譜面</label> <label><input type="radio" name="diff" value="1" onchange="filterMusicTable()"> NORMAL</label> <label><input type="radio" name="diff" value="2" onchange="filterMusicTable()"> HARD</label> <label><input type="radio" name="diff" value="3" onchange="filterMusicTable()"> MASTER</label> </p> <p> レベルフィルター: <select id="select_level" name="level" onchange="filterMusicTable()"></select> / ノート数フィルター: <select id="select_notes" name="notes" onchange="filterMusicTable()"/></select> </p> <p id="table_rows"></p> <table id="table_musics" class="tablesorter style_table" cellspacing="1" border="0"></table>