자사 이북 컨텐츠에서 페이지가 순서대로 보여지지 않는다는 cs가 왔다.
소스코드를 살펴보니 json 파일이 이런식으로 오고 있었다.
{
...
"pages": [
{
"idx": 0,
"url": "/index.php/viewer/blank/",
"thumbnail": ""
},
{
"idx": 1,
"url": "p001.xhtml",
"thumbnail": "001.jpg",
"contents": ""
},
{
"idx": 2,
"url": "p002.xhtml",
"thumbnail": "002.jpg",
"contents": ""
},
{
"idx": 3,
"url": "p003.xhtml",
"thumbnail": "003.jpg",
"contents": ""
},
{
"idx": 4,
"url": "p004.xhtml",
"thumbnail": "004.jpg",
"contents": ""
},
{
"idx": 5,
"url": "p005.xhtml",
"thumbnail": "005.jpg",
"contents": ""
},
{
"idx": 6,
"url": "p006.xhtml",
"thumbnail": "006.jpg",
"contents": ""
},
{
"idx": 7,
"url": "p007.xhtml",
"thumbnail": "007.jpg",
"contents": ""
},
{
"idx": 8,
"url": "p008.xhtml",
"thumbnail": "008.jpg",
"contents": ""
},
{
"idx": 9,
"url": "p009.xhtml",
"thumbnail": "009.jpg",
"contents": ""
},
{
"idx": 10,
"url": "p-01.xhtml",
"thumbnail": "-01.jpg",
"contents": ""
},
{
"idx": 11,
"url": "p010.xhtml",
"thumbnail": "010.jpg",
"contents": ""
},
{
"idx": 12,
"url": "p011.xhtml",
"thumbnail": "011.jpg",
"contents": ""
},
{
"idx": 13,
"url": "p012.xhtml",
"thumbnail": "012.jpg",
"contents": ""
},
{
"idx": 14,
"url": "p013.xhtml",
"thumbnail": "013.jpg",
"contents": ""
},
{
"idx": 15,
"url": "p014.xhtml",
"thumbnail": "014.jpg",
"contents": ""
},
{
"idx": 16,
"url": "p015.xhtml",
"thumbnail": "015.jpg",
"contents": ""
},
{
"idx": 17,
"url": "p016.xhtml",
"thumbnail": "016.jpg",
"contents": ""
},
{
"idx": 18,
"url": "p017.xhtml",
"thumbnail": "017.jpg",
"contents": ""
},
{
"idx": 19,
"url": "p018.xhtml",
"thumbnail": "018.jpg",
"contents": ""
},
{
"idx": 20,
"url": "p019.xhtml",
"thumbnail": "019.jpg",
"contents": ""
},
{
"idx": 21,
"url": "p-02.xhtml",
"thumbnail": "-02.jpg",
"contents": ""
},
{
"idx": 22,
"url": "p020.xhtml",
"thumbnail": "020.jpg",
"contents": ""
},
{
"idx": 23,
"url": "p021.xhtml",
"thumbnail": "021.jpg",
"contents": ""
},
{
"idx": 24,
"url": "p022.xhtml",
"thumbnail": "022.jpg",
"contents": ""
},
{
"idx": 25,
"url": "p023.xhtml",
"thumbnail": "023.jpg",
"contents": ""
},
{
"idx": 26,
"url": "p024.xhtml",
"thumbnail": "024.jpg",
"contents": ""
},
{
"idx": 27,
"url": "p025.xhtml",
"thumbnail": "025.jpg",
"contents": ""
},
{
"idx": 28,
"url": "p026.xhtml",
"thumbnail": "026.jpg",
"contents": ""
},
{
"idx": 29,
"url": "p027.xhtml",
"thumbnail": "027.jpg",
"contents": ""
},
{
"idx": 30,
"url": "p028.xhtml",
"thumbnail": "028.jpg",
"contents": ""
},
{
"idx": 31,
"url": "p029.xhtml",
"thumbnail": "029.jpg",
"contents": ""
},
{
"idx": 32,
"url": "p030.xhtml",
"thumbnail": "030.jpg",
"contents": ""
},
{
"idx": 33,
"url": "p031.xhtml",
"thumbnail": "031.jpg",
"contents": ""
},
{
"idx": 34,
"url": "p032.xhtml",
"thumbnail": "032.jpg",
"contents": ""
},
{
"idx": 35,
"url": "p033.xhtml",
"thumbnail": "033.jpg",
"contents": ""
},
{
"idx": 36,
"url": "p034.xhtml",
"thumbnail": "034.jpg",
"contents": ""
},
{
"idx": 37,
"url": "p035.xhtml",
"thumbnail": "035.jpg",
"contents": ""
},
{
"idx": 38,
"url": "p036.xhtml",
"thumbnail": "036.jpg",
"contents": ""
},
{
"idx": 39,
"url": "p037.xhtml",
"thumbnail": "037.jpg",
"contents": ""
},
{
"idx": 40,
"url": "p038.xhtml",
"thumbnail": "038.jpg",
"contents": ""
},
{
"idx": 41,
"url": "p039.xhtml",
"thumbnail": "039.jpg",
"contents": ""
},
{
"idx": 42,
"url": "p040.xhtml",
"thumbnail": "040.jpg",
"contents": ""
},
{
"idx": 43,
"url": "p041.xhtml",
"thumbnail": "041.jpg",
"contents": ""
},
{
"idx": 44,
"url": "p042.xhtml",
"thumbnail": "042.jpg",
"contents": ""
},
{
"idx": 45,
"url": "p043.xhtml",
"thumbnail": "043.jpg",
"contents": ""
},
{
"idx": 46,
"url": "p044.xhtml",
"thumbnail": "044.jpg",
"contents": ""
},
{
"idx": 47,
"url": "p045.xhtml",
"thumbnail": "045.jpg",
"contents": ""
},
{
"idx": 48,
"url": "p046.xhtml",
"thumbnail": "046.jpg",
"contents": ""
},
{
"idx": 49,
"url": "/index.php/viewer/blank/",
"thumbnail": "",
"contents": ""
}
]
}
이런식으로 json 파일을 받아서 사용을 한다.
그런데 중간에 보면 p-01.xhtml이나 p-02.xhtml이 중간에 끼여 있다.
제일 처음과 끝에 blank가 하나씩 있고 그 사이에는 순서대로 오게 해달라는게 요구사항이다.
아래와 같이 추가를 했지만 중간에 idx는 어디에 쓰는지 아직 알 수가 없어서 그대로 뒀다.
var testArray = [ {"id" : 1, "total" : 3}, {"id" : 2, "total" : 20}, {"id" : 3, "total" : 12}, {"id" : 4, "total" : 9}, {"id" : 3, "total" : 24} ];
function custonSort(a, b) {
if(a.total == b.total){
return 0;
}
return a.total > b.total ? 1 : -1;
}
testArray.sort(custonSort);
console.log(testArray);
위의 식을 토대로 만들어 봤다.
function customSort(a, b) {
let before = a.thumbnail;
let after = b.thumbnail;
if (a.idx != 0 && before.indexOf('.jpg') < 0) return 0;
if (b.idx != 0 && after.indexOf('.jpg') < 0) return 0;
if (
before.indexOf('.jpg') > -1
&& after.indexOf('.jpg') > -1
) {
let beforeText = before.split(/[.jpg]/)[0]*1;
let afterText = after.split(/[.jpg]/)[0]*1;
if ( beforeText == afterText ) {
return 0
} else {
return beforeText > afterText ? 1 : -1;
}
} else {
if ( after.indexOf('.jpg') > -1 ) return -1;
}
}
일단 이렇게 해결 되었다. 추가 사항이 있으면 업데이트 하겠다.