没有JScript知识请帮助修改以使Photobox工作 [英] no JScript knowledge please help modify to make Photobox work

问题描述

我找到了一个名为Photobox的插件，我很想在我的网站上实现。它是一个图像库，它可以在这个链接找到http://codepen.io/vsync/pen/upeBw



唯一的问题是当前的JScript调用通过错误的Flickr API拍摄照片。



我试图更改使用的API方法，它返回最近一天最有趣的照片（flickr.interestingness.getList ）使用我自己的API密钥返回我的一个照片集（flickr.photosets.getPhotos）中的照片的API方法，但我似乎无法使其工作。



这是我见过的最好的画廊，我真的很想让它适合我的网站。请帮帮我。



这是代码：

I have found a plugin called Photobox that I am dying to implement on my site. It's an image gallery and it can be found at this link http://codepen.io/vsync/pen/upeBw

The only problem is that the current JScript calls photos through the wrong Flickr API.

I've tried to change the used API method which returns the most interesting photos for the most recent day (flickr.interestingness.getList) to an API method that returns the photos in one of my photo sets (flickr.photosets.getPhotos) using my own API key but I can't seem to make it work.

This is the best gallery I've seen outh there and I would really like to make it work for my site. Please help me do that.

This is the code:

!(function(){ 'use strict';

var numOfImages = window.location.search ? parseInt(window.location.search.match(/\d+$/)[0]) : 70,
    gallery = $('#gallery'),
    videos = [
    ];

// Get some photos from Flickr for the demo
$.ajax({
    url: 'http://api.flickr.com/services/rest/',
    data: {
        format: 'json',
        method: 'flickr.interestingness.getList',
        per_page : numOfImages,
        api_key: 'b51d3a7c3988ba6052e25cb152aecba2' // this is my own API key, please use yours
    },
    dataType: 'jsonp',
    jsonp: 'jsoncallback'
})
.done(function (data){
    var loadedIndex = 1, isVideo;

    // add the videos to the collection
    data.photos.photo = data.photos.photo.concat(videos);

    $.each( data.photos.photo, function(index, photo){
        isVideo = photo.thumb ? true : false;
        // http://www.flickr.com/services/api/misc.urls.html
        var url = 'http://farm' + photo.farm + '.static.flickr.com/' + photo.server + '/' + photo.id + '_' + photo.secret,
            img = document.createElement('img');

        // lazy show the photos one by one
        img.onload = function(e){
            img.onload = null;
            var link = document.createElement('a'),
            li = document.createElement('li')
            link.href = this.largeUrl;

            link.appendChild(this);
            if( this.isVideo ){
                link.rel = 'video';
                li.className = 'video'
            }
            li.appendChild(link);
            gallery[0].appendChild(li);

            setTimeout( function(){ 
                $(li).addClass('loaded');
            }, 25*loadedIndex++);
        };

        img['largeUrl'] = isVideo ? photo.url : url + '_b.jpg';
        img['isVideo'] = isVideo;
        img.src = isVideo ? photo.thumb : url + '_t.jpg';
        img.title = photo.title;
    });

    // finally, initialize photobox on all retrieved images
    $('#gallery').photobox('a', { thumbs:true }, callback);
    // using setTimeout to make sure all images were in the DOM, before the history.load() function is looking them up to match the url hash
    setTimeout(window._photobox.history.load, 1000);
    function callback(){
        console.log('callback for loaded content:', this);
    };
});
})();

推荐答案

/）[ 0 ]）： 70 ，
gallery =

/)[0]) : 70, gallery =

（' ＃gallery'），
videos = [
];

// 从Flickr获取一些照片进行演示

.ajax（{
url：' http://api.flickr。 com / services / rest /'，
data：{
format：' json'，
方法：' flickr.interestingness.getList'，
per_page：numOfImages，
api_key：' b51d3a7c3988ba6052e25cb152aecba2' // 这是我自己的API密钥，请使用你的
}，
dataType：' jsonp'，
jsonp：' < span class =code-string> jsoncallback'
}）
.done（ function （data）{
var loadedIndex = 1 ，isVideo;

// 将视频添加到集合
数据。 photos.photo = data.photos.photo.concat（videos）;

.ajax({ url: 'http://api.flickr.com/services/rest/', data: { format: 'json', method: 'flickr.interestingness.getList', per_page : numOfImages, api_key: 'b51d3a7c3988ba6052e25cb152aecba2' // this is my own API key, please use yours }, dataType: 'jsonp', jsonp: 'jsoncallback' }) .done(function (data){ var loadedIndex = 1, isVideo; // add the videos to the collection data.photos.photo = data.photos.photo.concat(videos);

这篇关于没有JScript知识请帮助修改以使Photobox工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！