shri home work, flickr image viewer bookmarklet.

flickr_bookmarklet_obf.js

javascript:(function(){function G(){d?f(d,"opacity",0,animateDuration,function(){d.parentNode.removeChild(d);p.style.opacity=unactiveKnobOpacity;d=""}):(f(q,"opacity",0,animateDuration,function(){q.parentNode.removeChild(q);q=""}),document.body.onkeypress=M,document.body.onkeydown=wasOnkeydown,document.body.style.overflow="auto")}function y(b,c){var a={position:"fixed",zIndex:"9985",opacity:unactiveKnobOpacity,cursor:"pointer"};switch(b){case "listLeft":a.top="50%";a.left="1%";a.color="gray";a.fontSize="80px";break;case "close":a.top="3%";a.right="3%";a.color="red";a.fontSize="50px";break;case "listRight":a.top="50%",a.right="1%",a.color="gray",a.fontSize="80px"}a=r("div",a,c);a.onmouseover=function(){a.style.opacity=activeKnobOpacity};a.onmouseout=function(){a.style.opacity=unactiveKnobOpacity};return a}function H(){z();1!=imagesList[e].s?A(imagesList[e].s,H):n=s("c");h=0<e?s("l"):"";k=e<imagesList.length-1?s("r"):""}function A(b,c){0==b?(m='<img src="http://l.yimg.com/g/images/progress/balls-24x12-black.gif" />',setTimeout(c,200)):m="Can not load the image.";document.getElementById("messageCont").innerHTML=m;w.style.display="block"}function z(){w.style.display="none"}function B(){imagesList[e+1]&&(z(),1!=imagesList[e+1].s?A(imagesList[e+1].s,B):(j.style.display="block",f(n,"left",7,animateDuration),f(n,"opacity",0,animateDuration),f(k,"left",10,animateDuration),f(k,"opacity",1,animateDuration),h&&h.parentNode.removeChild(h),h=n,n=k,k=null,e++,imagesList[e+1]?k=s("r"):l.style.display="none"))}function C(){0!=e&&(z(),1!=imagesList[e-1].s?A(imagesList[e-1].s,C):(l.style.display="block",f(n,"left",13,animateDuration),f(n,"opacity",0,animateDuration),f(h,"left",10,animateDuration),f(h,"opacity",1,animateDuration),k&&k.parentNode.removeChild(k),k=n,n=h,h=null,e--,0<e?h=s("l"):j.style.display="none"))}function s(b){return r("div",{position:"fixed",width:"80%",height:"80%",top:"10%",left:"l"==b?"7%":"r"==b?"13%":"10%",backgroundImage:"url("+imagesList[1*e+1*("l"==b?-1:"r"==b?1:0)].l+")",backgroundRepeat:"no-repeat",backgroundPosition:"center",backgroundSize:"contain",mozBackgroundSize:"contain",opacity:"l"==b||"r"==b?0:1},d)}function r(b,c,a){b=document.createElement(b);for(property in c)b.style[property]=c[property];a&&"object"==typeof a&&a.appendChild(b);return b}var f,u=function(b,c,a,t,e){"object"!=typeof b&&(b=document.getElementById(b)||b);if("object"!=typeof b)throw Error("[animate]: '"+b+"' is not id or object");var d=b.style[c]||u.getComputedProperty(b,c),f=/^([0-9.]+)(\w+|%)?$/.exec(d);if(!f)throw Error("[animate]: can't animate this ( "+c+" : "+d+" )");var d=1*f[1],f=f[2]||"",h=Math.floor(D*t),k=(a-d)/h;t=[d+f];for(var j=0;j<h;j++)d+=k,t.push(Math.round(100*d)/100+f);d!=a&&t.push(a);for(a=(new Date).getTime();g[a];)a+="a";g[a]={};g[a].o=b;g[a].p=c;g[a].v=t;g[a].h=e;I||J();return a},I=0,g={},D=25,K=Math.floor(1E3/D),J=function(){var b=!1,c=[],a;for(a in g)g[a].o.style[g[a].p]=g[a].v.shift(),1<g[a].v.length?b=!0:("function"==typeof g[a].h&&c.push(g[a].h),delete g[a]);I=b?setTimeout(J,K):0;for(var d in c)c[d]()};u.stop=function(b){delete g[b]};u.setFps=function(b){K=Math.floor(1E3/b);D=b};u.getComputedProperty=function(b,c){"object"!=typeof b&&(b=document.getElementById(b));if(document.defaultView&&document.defaultView.getComputedStyle)return c=c.replace(/([A-Z])/g,"-$1").toLowerCase(),document.defaultView.getComputedStyle(b,"").getPropertyValue(c);if(b.currentStyle){for(var a;-1!=(a=c.indexOf("-"));)c=c.substr(0,a)+c.substr(a+1,1).toUpperCase()+c.substr(a+2);return b.currentStyle[c]}return""};f=u;var e,n,h,k,d,w,j,l,x,M=document.body.onkeypress;wasOnkeydown=document.body.onkeydown;unactiveKnobOpacity=0.3;animateDuration=activeKnobOpacity=0.5;imagesList=[];var E=document.getElementsByClassName("pc_img"),v=[],F;for(F in E)/_m\.(\w+)$/.test(E[F].src)&&v.push(E[F].src);if(0==v.length)alert("this bookmarklet works in flickr's photostreams only");else{document.body.style.overflow="hidden";var q=r("div",{position:"fixed",width:"100%",height:"100%",backgroundColor:"white",top:"0px",left:"0px",zIndex:"9980",overflow:"auto"},document.body),L;for(L in v)(function(b){var c=v[b].replace(/_m\.(\w+)$/,"_z.$1");imagesList.push({l:c,s:0});var a=document.createElement("img");a.onload=function(){imagesList[b].s=1};a.onerror=function(){imagesList[b].s=2};a.src=c;r("div",{backgroundImage:"url("+v[b]+")",backgroundRepeat:"no-repeat",backgroundPosition:"center",width:"200px",height:"200px",cssFloat:"left",margin:"10px 10px"},q).onclick=function(){e=1*b;d=r("div",{position:"fixed",width:"100%",height:"100%",backgroundColor:"black",top:"0px",left:"0px",zIndex:"9981"},q);w=r("div",{position:"fixed",width:"100%",height:"25px",top:"2%",left:"0px",zIndex:"9984",color:"white",fontSize:"20px",display:"none"},d);w.innerHTML='<center id="messageCont"></center>';document.body.onkeydown=function(a){a=a||window.event;a.cancelBubble=!0;a=a.keyCode;39==a?B():37==a?C():27==a&&G()};document.body.onkeypress=function(a){a=event||window.event;a.cancelBubble=!0};p.style.opacity=0;l=y("listRight",d);l.style.display=imagesList[e+1]?"block":"none";l.innerHTML="}";l.onclick=B;j=y("listLeft",d);j.style.display=0==e?"none":"block";j.innerHTML="{";j.onclick=C;d.onmousemove=function(){p.style.opacity!=activeKnobOpacity&&(p.style.opacity=unactiveKnobOpacity);l.style.opacity!=activeKnobOpacity&&(l.style.opacity=unactiveKnobOpacity);j.style.opacity!=activeKnobOpacity&&(j.style.opacity=unactiveKnobOpacity);x&&clearTimeout(x);x=setTimeout(function(){p.style.opacity!=activeKnobOpacity&&(l.style.opacity!=activeKnobOpacity&&j.style.opacity!=activeKnobOpacity)&&(p.style.opacity=l.style.opacity=j.style.opacity=0);x=null},800)};H()}})(L);r("div",{clear:"both"},q);var p=y("close",q);p.innerHTML="X";p.onclick=G}})();

flickr_bookmarklet_src.js

javascript:
    (function(){

var animate = (function(){
    var isRunning   = 0,
        bin         = {},
        fps         = 25,
        perFramesInterval = Math.floor( 1000/fps );

    var process = function () {
        var isSomething = false,
            handlers     = [];
        for ( var item in bin ) {
            bin[item].o.style[ bin[item].p ] = bin[item].v.shift();
            if ( bin[item].v.length > 1 ) isSomething = true;
            else {
                if ( typeof bin[item].h == 'function' ) handlers.push( bin[item].h );
                delete bin[item]
            }
        }
        if ( isSomething ) isRunning = setTimeout ( process, perFramesInterval );
        else isRunning = 0;
        for ( var i in handlers ) { handlers[i]() }
    };

    function animate ( obj, property, end, animateDuration, handler ) {
        if ( typeof obj != 'object' ) obj = document.getElementById( obj ) || obj;
        if ( typeof obj != 'object' )
            throw new Error('[animate]: \'' + obj + '\' is not id or object');
        var current = obj.style[property] ||
            animate.getComputedProperty( obj, property );
        var tempArr = /^([0-9.]+)(\w+|%)?$/.exec( current );
        if ( ! tempArr ) throw new Error (
                '[animate]: can\'t animate this ( '+ property +' : '+ current +' )'
            );
        current = tempArr[1] * 1;
        var edizm = tempArr[2] || '',
            iterations = Math.floor( fps * animateDuration ),
            delta = ( end - current ) / iterations,
            values = [ ( current + edizm ) ];
        for ( var i = 0; i < iterations; i++ ) {
            current += delta;
            values.push( Math.round( current * 100 )/ 100 + edizm );
        }
        if ( current != end) values.push( end );
        var binId = new Date().getTime();
        while ( bin[binId] ) { binId += 'a' }
        bin[binId] = {};
        bin[binId].o = obj;
        bin[binId].p = property;
        bin[binId].v = values;
        bin[binId].h = handler;
    
        if ( ! isRunning ) process();
        return binId;
    }

    animate.stop = function (id) { delete bin[id] };

    animate.setFps = function ( newfps ) {
        perFramesInterval = Math.floor( 1000/newfps );
        fps = newfps;
    };

    animate.getComputedProperty = function ( element, property ) {
        if ( typeof element != 'object' )
            element = document.getElementById( element );
        if ( document.defaultView && document.defaultView.getComputedStyle ) {
            property = property.replace(/([A-Z])/g, '-$1').toLowerCase();
            return document.defaultView.getComputedStyle(element, '').
                getPropertyValue(property);
        }
        if ( element.currentStyle ) {
            var i;
            while ( ( i = property.indexOf('-') ) != -1 ) {
                property = property.substr( 0, i )+
                property.substr( i+1, 1 ).toUpperCase()+
                property.substr( i + 2 );
            }
            return element.currentStyle[ property ];
        }
        return '';
    };

    return animate;
})();

var pointer, center, left, right, lightBox,
    message, knobLeft, knobRight, moveProc,
    wasOnkeypress = document.body.onkeypress;
    wasOnkeydown = document.body.onkeydown;
    unactiveKnobOpacity = 0.3,
    activeKnobOpacity = 0.5,
    animateDuration = 0.5,
    imagesList = [];

function collectImagesLinks () {
    var raw = document.getElementsByClassName('pc_img'),
        fittedLinks = [];
    for ( var i in raw ) {
        if ( /_m\.(\w+)$/.test( raw[i].src ) ) fittedLinks.push( raw[i].src );
    }
    return fittedLinks;
}

function addImagesToList ( links ) {
    for ( var i in links ) (function(i){
        var bigImageLink = links[i].replace(/_m\.(\w+)$/, "_z.$1");
        imagesList.push( {
            l : bigImageLink,
            s : 0
        } );
        var img = document.createElement('img');
        img.onload = function () { imagesList[i].s = 1 };
        img.onerror = function () { imagesList[i].s = 2 };
        img.src = bigImageLink;


        var cont = makeElement( 'div', {
                backgroundImage:'url(' + links[i] + ')',
                backgroundRepeat:'no-repeat',
                backgroundPosition:'center',
                width:'200px',
                height:'200px',
                cssFloat:'left',
                margin:'10px 10px'
            }, imagesListContainer
        );
        cont.onclick=(function(i){ return function(){initLightBox(i)} })(i);
    })(i);
};

function keyPushed ( key ) {
    if ( key == 39 ) { listRight(); return }
    if ( key == 37 ) { listLeft(); return }
    if ( key == 27 ) { closeDiv(); return }
}

function closeDiv () {
    if ( lightBox ) {
        animate( lightBox, 'opacity', 0, animateDuration, function(){
                lightBox.parentNode.removeChild(lightBox);
                knobClose.style.opacity = unactiveKnobOpacity;
                lightBox='';
            }
        );
        return;
    }
        animate( imagesListContainer, 'opacity', 0, animateDuration, function(){
                imagesListContainer.parentNode.removeChild(imagesListContainer);
                imagesListContainer=''
            }
        );
        document.body.onkeypress = wasOnkeypress;
        document.body.onkeydown = wasOnkeydown; 
        document.body.style.overflow='auto';
}

function addKnob ( what, appendTo ) {
    var knob = {
        position    :'fixed',
        zIndex      :'9985',
        opacity     :unactiveKnobOpacity,
        cursor      :'pointer'
    };
    switch ( what ) {
        case 'listLeft':
           knob['top']  = '50%';
           knob.left   = '1%';
           knob.color   = 'gray';
           knob.fontSize= '80px';
        break;
        case 'close':
           knob['top']  = '3%';
           knob.right   = '3%';
           knob.color   = 'red';
           knob.fontSize= '50px';
        break;
        case 'listRight':
           knob['top']  = '50%';
           knob.right   = '1%';
           knob.color   = 'gray';
           knob.fontSize= '80px';
        break;
        default:
    }
    knob = makeElement('div', knob, appendTo);

    knob.onmouseover = function(){ knob.style.opacity = activeKnobOpacity };
    knob.onmouseout = function(){ knob.style.opacity = unactiveKnobOpacity };

    return knob;
}

function initLightBox ( i ) {
    pointer = i*1;
    lightBox = makeElement('div', {
            position:'fixed',
            width:'100%',
            height:'100%',
            backgroundColor:'black',
            top:'0px',
            left:'0px',
            zIndex:'9981'
        }, imagesListContainer
    );
    message = makeElement('div', {
            position:'fixed',
            width:'100%',
            height:'25px',
            'top':'2%',
            left:'0px',
            zIndex:'9984',
            color:'white',
            fontSize:'20px',
            display:'none'
        }, lightBox
    );
    message.innerHTML = '<center id="messageCont"></center>';
    document.body.onkeydown = function ( event ) {
        event = event || window.event;
        event.cancelBubble = true;
        keyPushed( event.keyCode );
    };
    document.body.onkeypress = function (e) {
        e = event || window.event;
        e.cancelBubble = true;
    };

    knobClose.style.opacity = 0;


    knobRight = addKnob( 'listRight', lightBox );
    knobRight.style.display = imagesList[pointer+1] ? 'block' : 'none';
    knobRight.innerHTML = '}';
    knobRight.onclick = listRight;

    knobLeft = addKnob( 'listLeft', lightBox );
    knobLeft.style.display = pointer == 0 ? 'none' : 'block';
    knobLeft.innerHTML = '{';
    knobLeft.onclick = listLeft;

    lightBox.onmousemove = function(){
        if ( knobClose.style.opacity != activeKnobOpacity )
            knobClose.style.opacity = unactiveKnobOpacity;
        if ( knobRight.style.opacity != activeKnobOpacity )
            knobRight.style.opacity = unactiveKnobOpacity;
        if ( knobLeft.style.opacity != activeKnobOpacity )
            knobLeft.style.opacity = unactiveKnobOpacity;
        if ( moveProc ) { clearTimeout( moveProc ); }
        moveProc = setTimeout( function(){
            if (    knobClose.style.opacity != activeKnobOpacity &&
                    knobRight.style.opacity != activeKnobOpacity &&
                    knobLeft.style.opacity  != activeKnobOpacity ) {

                knobClose.style.opacity =
                knobRight.style.opacity =
                knobLeft.style.opacity  = 0;
            }
            moveProc = null;
        }, 800 );

    };

    showChoosenPic();
};

function showChoosenPic () {
    hideMessageBox();
    if ( imagesList[pointer]['s'] != 1 )
        showMessageBox ( imagesList[pointer]['s'], showChoosenPic );
    else center = makeImageContainer('c');

    left = ( pointer > 0 ) ? makeImageContainer('l') : '';
    right = ( pointer < ( imagesList.length -1 ) ) ? makeImageContainer('r') : '';
}

function showMessageBox ( loadState, handler ) {
    if ( loadState == 0 ) {
        m = '<img src="http://l.yimg.com/g/images/progress/balls-24x12-black.gif" />';
        setTimeout( handler, 200 );
    }
    else m = 'Can not load the image.';

    document.getElementById('messageCont').innerHTML = m;
    message.style.display = 'block';
}

function hideMessageBox () {
    message.style.display = 'none';
}

function listRight () {
    if ( ! imagesList[pointer+1] ) return;
    hideMessageBox();
    if ( imagesList[pointer+1]['s'] != 1 ) {
        showMessageBox ( imagesList[pointer+1]['s'], listRight );
        return;
    }
    knobLeft.style.display = 'block';
    animate( center, 'left', 7, animateDuration);
    animate( center, 'opacity', 0, animateDuration);
    animate( right, 'left', 10, animateDuration);
    animate( right, 'opacity', 1, animateDuration);
    if ( left ) left.parentNode.removeChild( left );
    left = center;
    center = right;
    right = null;
    pointer++;
    if ( imagesList[pointer + 1] ) right = makeImageContainer('r');
    else knobRight.style.display = 'none';
}

function listLeft () {
    if ( pointer == 0 ) return;
    hideMessageBox();
    if ( imagesList[pointer-1]['s'] != 1 ) {
        showMessageBox ( imagesList[pointer-1]['s'], listLeft );
        return;
    }
    knobRight.style.display = 'block';
    animate( center, 'left', 13, animateDuration);
    animate( center, 'opacity', 0, animateDuration);
    animate( left, 'left', 10, animateDuration);
    animate( left, 'opacity', 1, animateDuration);
    if ( right ) right.parentNode.removeChild( right );
    right = center;
    center = left;
    left = null;
    pointer--;
    if ( pointer > 0 ) left = makeImageContainer('l');
    else knobLeft.style.display = 'none';
}

function makeImageContainer (w) {

    var myleft  =   ( w == 'l' ) ? '7%' :
                    ( w == 'r' ) ? '13%' : '10%',
        opacity =   (( w == 'l' ) || ( w == 'r' )) ? 0 : 1,
        d       =   ( w == 'l' ) ? -1 :
                    ( w == 'r' ) ? 1 : 0;
    var img     =   'url(' + imagesList[pointer*1 + d*1]['l'] + ')';
    var frame = makeElement('div', {
            position:'fixed',
            width:'80%',
            height:'80%',
            'top':'10%',
            left:myleft,
            backgroundImage:img,
            backgroundRepeat:'no-repeat',
            backgroundPosition: 'center',
            backgroundSize:'contain',
            mozBackgroundSize:'contain',
            opacity:opacity
        }, lightBox);
    return frame;
}

function makeElement ( element, styles, appendTo ) {
    var newElement = document.createElement( element );
    for ( property in styles ) { newElement.style[property] = styles[property] }
    if ( appendTo && ( typeof appendTo == 'object' ) )
        appendTo.appendChild( newElement );
    return newElement
}

var links = collectImagesLinks();
if ( links.length == 0 ) {
    alert ('this bookmarklet works in flickr\'s photostreams only');
    return;
}

document.body.style.overflow='hidden';
var imagesListContainer = makeElement('div',{
        position:'fixed',
        width:'100%',
        height:'100%',
        backgroundColor:'white',
        top:'0px',
        left:'0px',
        zIndex:'9980',
        overflow:'auto'
    },document.body
);

addImagesToList(links);
makeElement('div',{clear:'both'},imagesListContainer);

var knobClose = addKnob( 'close', imagesListContainer );
knobClose.innerHTML = 'X';
knobClose.onclick = closeDiv;

})();

все супер!