mozilla
/
popcorn-js
зеркало из https://github.com/mozilla/popcorn-js.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Merge remote-tracking branch 'mbuttu/t516' into develop 

Conflicts:
	plugins/flickr/popcorn.flickr.js
This commit is contained in:
Jon Buckley 2011-06-21 10:31:10 -04:00
Родитель 3c5727f9c8 99548a7b44
Коммит b6c8afa84f
3 изменённых файлов: 170 добавлений и 97 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

63
plugins/flickr/popcorn.flickr.html
Просмотреть файл

@ -11,38 +11,39 @@
<script src="../../popcorn.js"></script>
<script src="popcorn.flickr.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
var p = Popcorn('#video')
document.addEventListener( "DOMContentLoaded", function () {
var p = Popcorn( "#video" )
.flickr({
start: 0, // seconds
end: 5, // seconds
username: 'AniaSob',
apikey: 'd1d249260dd1673ec8810c8ce5150ae1',
target: 'flickrdiv'
} )
start: 0,
end: 5,
username: "AniaSob",
apikey: "d1d249260dd1673ec8810c8ce5150ae1",
target: "flickrdiv"
})
.flickr({
start: 5, // seconds
end: 15, // seconds
userid: '35034346917@N01',
target: 'flickrdiv'
} )
start: 5,
end: 15,
userid: "35034346917@N01",
target: "flickrdiv"
})
.flickr({
start: 20, // seconds
end: 30, // seconds
tags: 'georgia',
numberofimages: '8',
target: 'flickrdiv'
} )
start: 20,
end: 30,
tags: "georgia",
numberofimages: 8,
target: "flickrdiv"
})
.flickr({
start: 35, // seconds
end: 45, // seconds
userid: '35034346917@N01',
tags: 'georgia',
numberofimages: '8',
target: 'flickrdiv'
} )
start: 35,
end: 45,
userid: "35034346917@N01",
tags: "georgia",
numberofimages: 8,
target: "flickrdiv"
})
.play();
}, false);
}, false );
</script>
</head>
@ -53,16 +54,16 @@
<br />Flickr images tagged 'georgia' will appear at 20 seconds and disappear at 30 seconds.
<br />Flickr images by '35034346917@N01' and tagged 'georgia' will appear at 35 seconds and disappear at 45 seconds.</p>
<div>
<video id='video'
<video id="video"
controls
width= '250px'
width= "250px"
poster="../../test/poster.png">
<source id='mp4'
<source id="mp4"
src="../../test/trailer.mp4"
type='video/mp4; codecs="avc1, mp4a"'>
<source id='ogv'
<source id="ogv"
src="../../test/trailer.ogv"
type='video/ogg; codecs="theora, vorbis"'>

130
plugins/flickr/popcorn.flickr.js
Просмотреть файл

@ -6,8 +6,8 @@
* Appends a users Flickr images to an element on the page.
* Options parameter will need a start, end, target and userid or username and api_key.
* Optional parameters are numberofimages, height, width, padding, and border
* Start is the time that you want this plug-in to execute
* End is the time that you want this plug-in to stop executing
* Start is the time that you want this plug-in to execute (in seconds)
* End is the time that you want this plug-in to stop executing (in seconds)
* Userid is the id of who's Flickr images you wish to show
* Tags is a mutually exclusive list of image descriptor tags
* Username is the username of who's Flickr images you wish to show
@ -49,18 +49,18 @@
_uri,
_link,
_image,
_count = options.numberofimages || 4 ,
_height = options.height || "50px",
_width = options.width || "50px",
_count = options.numberofimages || 4 ,
_height = options.height || "50px",
_width = options.width || "50px",
_padding = options.padding || "5px",
_border = options.border || "0px";
_border = options.border || "0px";
// create a new div this way anything in the target div is left intact
// this is later populated with Flickr images
containerDiv = document.createElement( "div" );
containerDiv.id = "flickr" + idx;
containerDiv.style.width = "100%";
containerDiv.style.height = "100%";
containerDiv = document.createElement( "div" );
containerDiv.id = "flickr" + idx;
containerDiv.style.width = "100%";
containerDiv.style.height = "100%";
containerDiv.style.display = "none";
idx++;
@ -68,38 +68,43 @@
if ( document.getElementById( options.target ) ) {
document.getElementById( options.target ).appendChild( containerDiv );
} else {
throw ( "flickr target container doesn't exist" );
throw ( "flickr target container doesn't exist" );
}
// get the userid from Flickr API by using the username and apikey
var isUserIDReady = function() {
if ( !_userid ) {
_uri = "http://api.flickr.com/services/rest/?method=flickr.people.findByUsername&";
_uri += "username=" + options.username + "&api_key=" + options.apikey + "&format=json&jsoncallback=flickr";
Popcorn.xhr.getJSONP( _uri, function(data) {
Popcorn.getJSONP( _uri, function( data ) {
_userid = data.user.nsid;
getFlickrData();
});
} else {
setTimeout(function () {
isUserIDReady();
}, 5);
}, 5 );
}
};
// get the photos from Flickr API by using the user_id and/or tags
var getFlickrData = function() {
_uri = "http://api.flickr.com/services/feeds/photos_public.gne?";
_uri += "id=" + _userid + "&";
_uri = "http://api.flickr.com/services/feeds/photos_public.gne?";
if ( _userid ) {
_uri += "id=" + _userid + "&";
}
if ( options.tags ) {
_uri += "tags=" + options.tags + "&";
}
_uri += "lang=en-us&format=json&jsoncallback=flickr";
Popcorn.xhr.getJSONP( _uri, function( data ) {
containerDiv.innerHTML = "<p style='padding:" + _padding + ";'>" + data.title + "<p/>";
Popcorn.forEach( data.items, function ( item, i ) {
if ( i < _count ) {
_link = document.createElement( 'a' );
_link.setAttribute( 'href', item.link );
_link.setAttribute( "target", "_blank" );
@ -110,18 +115,21 @@
_image.setAttribute( 'style', 'border:' + _border + ';padding:' + _padding );
_link.appendChild( _image );
containerDiv.appendChild( _link );
} else {
return false;
}
});
});
};
if ( options.userid ) {
if ( options.username && options.apikey ) {
isUserIDReady();
}
else {
_userid = options.userid;
getFlickrData();
} else if ( options.username && options.apikey ) {
isUserIDReady();
}
return {
/**
@ -130,7 +138,7 @@
* of the video reaches the start time provided by the
* options variable
*/
start: function( event, options ){
start: function( event, options ) {
containerDiv.style.display = "inline";
},
/**
@ -139,8 +147,8 @@
* of the video reaches the end time provided by the
* options variable
*/
end: function( event, options ){
containerDiv.style.display = "none";
end: function( event, options ) {
containerDiv.style.display = "none";
},
_teardown: function( options ) {
document.getElementById( options.target ) && document.getElementById( options.target ).removeChild( containerDiv );
@ -148,25 +156,69 @@
};
},
{
about:{
name: "Popcorn Flickr Plugin",
about: {
name: "Popcorn Flickr Plugin",
version: "0.2",
author: "Scott Downe, Steven Weerdenburg, Annasob",
author: "Scott Downe, Steven Weerdenburg, Annasob",
website: "http://scottdowne.wordpress.com/"
},
options:{
start : {elem:'input', type:'number', label:'In'},
end : {elem:'input', type:'number', label:'Out'},
userid : {elem:'input', type:'text', label:'UserID'},
tags : {elem:'input', type:'text', label:'Tags'},
username : {elem:'input', type:'text', label:'Username'},
apikey : {elem:'input', type:'text', label:'Api_key'},
target : 'flickr-container',
height : {elem:'input', type:'text', label:'Height'},
width : {elem:'input', type:'text', label:'Width'},
padding : {elem:'input', type:'text', label:'Padding'},
border : {elem:'input', type:'text', label:'Border'},
numberofimages : {elem:'input', type:'text', label:'Number of Images'}
options: {
start: {
elem: "input",
type: "number",
label: "In"
},
end: {
elem: "input",
type: "number",
label: "Out"
},
userid: {
elem: "input",
type: "text",
label: "UserID"
},
tags: {
elem: "input",
type: "text",
label: "Tags"
},
username: {
elem: "input",
type: "text",
label: "Username"
},
apikey: {
elem: "input",
type: "text",
label: "Api_key"
},
target: "flickr-container",
height: {
elem: "input",
type: "text",
label: "Height"
},
width: {
elem: "input",
type: "text",
label: "Width"
},
padding: {
elem: "input",
type: "text",
label: "Padding"
},
border: {
elem: "input",
type: "text",
label: "Border"
},
numberofimages: {
elem: "input",
type: "text",
label: "Number of Images"
}
}
});
})( Popcorn );

74
plugins/flickr/popcorn.flickr.unit.js
Просмотреть файл

@ -1,67 +1,87 @@
test("Popcorn Flickr Plugin", function () {
var popped = Popcorn("#video"),
expects = 8,
var popped = Popcorn( "#video" ),
expects = 10,
count = 0,
setupId,
flickrdiv = document.getElementById('flickrdiv');
flickrdiv = document.getElementById( "flickrdiv" );
expect( expects );
function plus() {
if ( ++count === expects) {
if ( ++count === expects ) {
start();
}
}
stop();
ok('flickr' in popped, "flickr is a method of the popped instance");
ok( "flickr" in popped, "flickr is a method of the popped instance" );
plus();
equals ( flickrdiv.innerHTML, "", "initially, there is nothing inside the flickrdiv" );
plus();
popped.flickr({
start: 0, // seconds
end: 2, // seconds
userid: '35034346917@N01',
numberofimages: '1',
target: 'flickrdiv'
} )
start: 0,
end: 3,
userid: "35034346917@N01",
numberofimages: 1,
target: "flickrdiv"
})
.flickr({
start: 2, // seconds
end: 4, // seconds
username: 'AniaSob',
apikey: 'd1d249260dd1673ec8810c8ce5150ae1',
numberofimages: '1',
target: 'flickrdiv'
start: 4,
end: 7,
tags: "georgia",
numberofimages: 8,
target: "flickrdiv"
})
.flickr({
start: 8,
end: 10,
username: "AniaSob",
apikey: "d1d249260dd1673ec8810c8ce5150ae1",
numberofimages: 1,
target: "flickrdiv"
});
setupId = popped.getLastTrackEventId();
popped.exec( 1, function() {
ok( /display: inline;/.test( flickrdiv.innerHTML ), "Div contents are displayed" );
plus();
ok( /img/.test( flickrdiv.innerHTML ), "An image exists" );
plus();
});
popped.exec( 3, function() {
popped.exec( 2, function() {
ok( /display: inline;/.test( flickrdiv.innerHTML ), "Div contents are displayed" );
plus();
ok( /img/.test( flickrdiv.innerHTML ), "An image exists" );
plus();
});
popped.exec( 4, function() {
popped.exec( 5, function() {
var numberOfImages = document.getElementById( "flickrdiv" ).childNodes[1].getElementsByTagName( "a" ).length;
ok( /display: inline;/.test( flickrdiv.innerHTML ), "Div contents are displayed" );
plus();
ok( /img/.test( flickrdiv.innerHTML ), "An image exists" );
plus();
ok( /display: inline;/.test( flickrdiv.innerHTML ), "Images tagged 'georgia' are displayed in div" );
plus();
equal( numberOfImages, 8, "There are 8 images tagged 'georgia' being displayed" );
plus();
});
popped.exec( 11, function() {
ok( /display: none;/.test( flickrdiv.innerHTML ), "Div contents are hidden again" );
plus();
popped.pause().removeTrackEvent( setupId );
ok( !flickrdiv.children[1], "removed flickr was properly destroyed" );
ok( !flickrdiv.children[2], "Removed flickr was properly destroyed" );
plus();
});
popped.volume(0).play();
});