본문 바로가기

Slack 채널 정리

실패한 브라우저 탭 갯수 제한 스크립트

오늘 온 종일 걸려 만든 브라우저 탭 갯수 제한 스크립트.

var MAX_OPEN = 3;
var windows = {};
Storage.prototype.setObject = function(key, value) {
    this.setItem(key, simpleStringify(value));
}

Storage.prototype.getObject = function(key) {
    var value = this.getItem(key);
    return value && JSON.parse(value);
}

function simpleStringify (object){
    var simpleObject = {};
    for (var prop in object ){
        if (!object.hasOwnProperty(prop)){
            continue;
        }
        if (typeof(object[prop]) == 'object'){
            continue;
        }
        if (typeof(object[prop]) == 'function'){
            continue;
        }
        simpleObject[prop] = object[prop];
    }
    return JSON.stringify(simpleObject);
};

var winOpen = window.open;

window.open = function() {
    if(window.open.caller.name.indexOf("pop") != -1) {
        var win = winOpen.apply(this, arguments); 
        return win;
    }
    else {
        if(!$.isEmptyObject(windows)) {
            var tmpWinObj = {}
            for (var k in windows){
                if (windows.hasOwnProperty(k) && !windows[k].closed) {
                    tmpWinObj[k] = windows[k];
                }
            }
            windows = tmpWinObj;
        }
        if(Object.keys(windows).length == MAX_OPEN) {
            alert("maximum open : " + MAX_OPEN);
            return false;
        }
        else {
            win = winOpen.apply(this, arguments = 
                (!!arguments[1])?arguments:[arguments[0], new Date().getTime()]
            );
        
            windows[win.name] = win;
            localStorage.setObject('tabcontrol', windows);
            return win;
        }
    }
};

그런데, 이 탭 제어 스크립트에서 결정적인 문제는 윈도우 객체를 localStorage 에 저장할 수 있는 방법이 없다는거. 기존 소스에서 에러가 안나서 알아채지 못했는데  디버깅 하다보니 윈도우 객체 처리 못하고 빈값만 저장되었었네요. 윈도우 객체를 저장하지 못하면 문제가 윈도우 명만으로는 윈도우 객체를 찾을 수 있는 간단한 방법이 없어서 현재 로직에서는 windows 변수에 보관했던 윈도우 정보 중에서 close 된 녀석을 걸러내는게 힘들어지는 점. 더 잡고 늘어질 시간 없어서 일단 포기 ㅜㅠ