/**
* 게임 탐색기 2.0 기술 실증 스크립트
* 여기서 작성한 내용을 테스트한 후 [[미디어위키:Gadget-gamelistjs.js]]에 붙여넣게 됩니다.
* 작성자: [[사:Senouis|Senouis]]
* 버전: 1.5.2
* 소스 코드 라이선스: CCL BY-NC-SA 4.0
*/
var genreMenuArea = document.getElementById("categoryList");
var genreViewArea = document.getElementById("libertygame-genre");
var gameListArea = document.getElementById("categoryResult");
var additionalLoadButtonArea = document.getElementById("libertygame-additionalLoad");
var searchresult = {};
var gamelist = [];
var totalgenre = []; // 전체 게임 수(index 0) + 장르별 총 게임 수(index 1+)
var moreInfoTarget = "";
var viewcount = 50;
var viewoffset = 0;
// auto loading with scroll
//var isLoading = false;
//var allLoaded = false;
function LoadMoreGame(e){
var totalgame = totalgenre[0];
if (viewoffset < totalgame) { // TODO: viewoffset >= totalgame
var api = new mw.Api();
api.get({
action: 'parse',
page: '사용자:Senouis/게임 탐색기/DPL 틀',
contentmodel: "wikitext",
formatversion: 2,
category: genre_list[libertygame_selectedCategory],
offset: viewoffset,
count: viewcount
}).then( function (result) {
// 더 보기 버튼 추가는 불필요
var temphtml = document.createElement("div");
temphtml.innerHTML = result.parse.text;
gameListArea.appendChild(temphtml);
var resultlist = document.getElementById("categoryResult");
resultlist.id += "-" + Number(viewoffset).toString();
gameListArea.appendChild(resultlist);
gameListArea.removeChild(temphtml);
if (document.getElementsByClassName("gamecard-404").length !== 0) {
// 더 이상 해당하는 게임이 없다는 메세지가 temphtml에 있었음, 해당 메세지와 더 보기 링크를 숨김 처리
document.getElementsByClassName("gamecard-404").item(0).style.display = "none";
additionalLoadButtonArea.style.display = "none";
}
viewoffset += viewcount;
});
} else {
allLoaded = true;
additionalLoadButtonArea.style.display = "none";
}
}
function LgGamelist_LoadAllGame(){
genreViewArea.innerText = "전체 게임";
gameListArea.innerText = "로딩 중...";
viewoffset = 0;
libertygame_selectedCategory = 0;
var api = new mw.Api();
api.get({
action: 'parse',
page: '사용자:Senouis/게임 탐색기/DPL 틀',
contentmodel: "wikitext",
formatversion: 2,
category: genre_list[libertygame_selectedCategory],
offset: viewoffset,
count: viewcount
}).then( function (result) {
gameListArea.replaceChildren();
// 더 보기 버튼
var moreGameButton = document.createElement("a");
moreGameButton.addEventListener("click", LoadMoreGame);
moreGameButton.innerText = "더 보기";
additionalLoadButtonArea.appendChild(moreGameButton);
var temphtml = document.createElement("div");
temphtml.innerHTML = result.parse.text;
gameListArea.appendChild(temphtml);
var resultlist = document.getElementById("categoryResult");
resultlist.id += "-" + Number(viewoffset).toString();
gameListArea.appendChild(resultlist);
gameListArea.removeChild(temphtml);
viewoffset += viewcount;
allLoaded = false;
});
return;
}
var libertygame_selectedCategory = 0;
function LoadMoreGenre(e){ // category는 외부에 저장할 예정
var totalgame = totalgenre[Number(e.currentTarget.id.slice(12))];
if (viewoffset < totalgame) {
var api = new mw.Api();
api.get({
action: 'parse',
page: '사용자:Senouis/게임 탐색기/DPL 틀',
contentmodel: "wikitext",
formatversion: 2,
category: genre_list[libertygame_selectedCategory],
offset: viewoffset,
count: viewcount
}).then( function (result) {
// 일단 더 보기 버튼 추가는 불필요
var temphtml = document.createElement("div");
temphtml.innerHTML = result.parse.text;
gameListArea.appendChild(temphtml);
var resultlist = document.getElementById("categoryResult");
resultlist.id += "-" + Number(viewoffset).toString();
gameListArea.appendChild(resultlist);
gameListArea.removeChild(temphtml);
if (document.getElementsByClassName("gamecard-404").length !== 0) {
// 더 이상 해당하는 게임이 없다는 메세지가 temphtml에 있었음, 해당 메세지와 더 보기 링크를 숨김 처리
document.getElementsByClassName("gamecard-404").item(0).style.display = "none";
additionalLoadButtonArea.style.display = "none";
}
viewoffset += viewcount;
});
} else {
additionalLoadButtonArea.style.display = "none";
allLoaded = true;
}
}
function LgGamelist_LoadGenre(e){
viewoffset = 0;
var api = new mw.Api();
api.get({
action: 'parse',
page: '사용자:Senouis/게임 탐색기/DPL 틀',
contentmodel: "wikitext",
formatversion: 2,
category: genre_list[libertygame_selectedCategory],
offset: viewoffset,
count: viewcount
}).then( function (result) {
gameListArea.replaceChildren();
// 일단 더 보기 버튼
var moreGameButton = document.createElement("a");
moreGameButton.addEventListener("click", LoadMoreGenre);
moreGameButton.innerText = "더 보기";
additionalLoadButtonArea.appendChild(moreGameButton);
var temphtml = document.createElement("div");
temphtml.innerHTML = result.parse.text;
gameListArea.appendChild(temphtml);
var resultlist = document.getElementById("categoryResult");
resultlist.id += "-" + Number(viewoffset).toString();
gameListArea.appendChild(resultlist);
gameListArea.removeChild(temphtml);
viewoffset += viewcount;
allLoaded = false;
});
return;
}
var genre_list = ["리버티게임", "어드벤처 게임", "액션 게임","퍼즐 게임","퀴즈 게임","보드 게임","캐주얼 게임","음악 게임","롤플레잉 게임","시뮬레이션 게임","전략 게임","스포츠 게임"]; // 2023년 7월 22일 시점 [[리버티게임: 게임 메타데이터]] 문서의 1차 장르 분류들, 0은 리버티게임 분류를 대신 가리킴
function GenreLinkClicked (genre) {
additionalLoadButtonArea.style.display = "block";
genreViewArea.innerText = genre_list[genre];
libertygame_selectedCategory = genre;
LgGamelist_LoadGenre();
return;
}
function addGenreLink(genre_index) {
var genre_linkline = document.createElement("li");
var genre_link = document.createElement("a");
genre_link.id = "LgGameGenre-" + genre_index; // DOM ID 추가
// 플러그인X의 문제인지 switch 문의 expression이 string으로 인식됨
// 플러그인X의 버그 수정 후에는 integer 처리로 환원
switch(genre_index) {
case '1':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(1);});
genre_link.innerText = "어드벤처 게임";
break;
case '2':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(2);});
genre_link.innerText = "액션 게임";
break;
case '3':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(3);});
genre_link.innerText = "퍼즐 게임";
break;
case '4':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(4);});
genre_link.innerText = "퀴즈 게임";
break;
case '5':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(5);});
genre_link.innerText = "보드 게임";
break;
case '6':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(6);});
genre_link.innerText = "캐주얼 게임";
break;
case '7':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(7);});
genre_link.innerText = "음악 게임";
break;
case '8':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(8);});
genre_link.innerText = "롤플레잉 게임";
break;
case '9':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(9);});
genre_link.innerText = "시뮬레이션 게임";
break;
case '10':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(10);});
genre_link.innerText = "전략 게임";
break;
case '11':
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); GenreLinkClicked(11);});
genre_link.innerText = "스포츠 게임";
break;
default:
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); additionalLoadButtonArea.replaceChildren(); GenreLinkClicked("분류 없는");});
genre_link.innerText = "잘못된 장르 분류(이 링크가 보이면 관리단에게 보고 부탁드립니다)";
}
genre_linkline.appendChild(genre_link);
genreMenuArea.appendChild(genre_linkline);
return;
}
function LgGamelist_LoadDefaultMenu() {
// 시작 전 게임 목록 문서가 맞는지 확인
if (mw.config.values.wgTitle != '게임 목록' && mw.config.values.wgTitle != 'Senouis/게임 탐색기') return;
// 먼저 기존 게임 목록 element를 비움
document.getElementById("categoryList").replaceChildren();
document.getElementById("categoryResult").replaceChildren();
// 장르별 보기 링크 추가
// Note: [[리버티게임: 게임 메타데이터]]의 1차 장르 분류가 변경될 때마다 이 부분을 수정해야 합니다.
for (var index in genre_list) {
if (index === '0') continue;
addGenreLink(index);
}
// 분류별 장르 갯수 확인
var totalgamestring = document.getElementById("LgTotalGameNum").innerText.split(",");
for (var index2 in totalgamestring) {
totalgenre.push(totalgamestring[Number(index2)]);
}
var genre_linkline = document.createElement("li");
var genre_link = document.createElement("a");
// 플러그인X의 문제인지 switch 문의 expression이 string으로 인식됨
// 플러그인X의 버그 수정 후에는 integer 처리로 환원
genre_link.id = "LgGameTotal";
genre_link.addEventListener("click", function() { gameListArea.replaceChildren(); gameListArea.innerText = "로딩 중..."; additionalLoadButtonArea.replaceChildren(); additionalLoadButtonArea.style.display = "block"; LgGamelist_LoadAllGame();});
genre_link.innerText = "전체 게임 보기";
genre_linkline.appendChild(genre_link);
genreMenuArea.appendChild(genre_linkline);
// 기본적으로 전체 장르 보기를 함
document.getElementById("categoryList").style.display = "block"; // 장르별 게임 목록 링크 활성화
document.getElementById("categoryResult").style.display = "block"; // 게임 목록 활성화
additionalLoadButtonArea.style.display = "block"; // 더 보기 링크 표시
LgGamelist_LoadAllGame();
genreViewArea.style.display = "block";
}
$(LgGamelist_LoadDefaultMenu);
// 스크롤을 끝까지 내리면 로딩
/*
$(window).scroll(function () {
if (allLoaded === true) return;
var height = document.body.scrollTop;
var maxelementheight = document.getElementsByClassName("mw-page-container")[0].getBoundingClientRect().height; // mw-page-container 클래스 element의 첫 원소가 스크롤링하는 사이트 높이를 결정
if ( height >= 240 && height >= maxelementheight - document.documentElement.scrollHeight - 10 ) {
if (!isLoading) {
if (libertygame_selectedCategory === 0) LoadMoreGame();
else LoadMoreGenre();
isLoading = true;
}
} else {
isLoading = false;
return;
}
});
*/
스크립트(커먼자스 병합 후보)
틀:리버티게임 라벨
게임 목록
