Okay, so I’m trying to create a “Order Posts by Type” using jQuery JSON to get the data… All the post types works in Chrome, Safari, FF. But in IE, video / audio posts will not display (perhaps something to do with the embedding?) when I filter through the posts using JSON.
Does anyone have a clue what’s going on?! Here’s the code:
<script>
$('#order_by ul li').find('a').click(function() {
var postType = this.className;
var count = 0;
byCategory(postType);
return false;
function byCategory(postType, callback) {
$.getJSON('{URL}/api/read/json?type=' + postType + '&callback=?', function(data) {
var article = [];
$.each(data.posts, function(i, item) {
// i = index
// item = data for a particular post
switch(item.type) {
case 'photo':
article[i] = '<div class="post_wrap"><div class="photo"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/0yplawef6/link_photo.png" /></a><a href="'
+ item.url
+ '"><img src="'
+ item['photo-url-1280']
+ '"alt="image" /></a></div></div>';
count = 1;
break;
case 'video':
article[i] = '<div class="post_wrap"><div class="video"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/FWAlawenw/link_video.png" /></a><span><br />'
+ item['video-player']
+ '</span><div class="video_desc">'
+ item['video-caption']
+ '</div></div></div>';
count = 1;
console.log(article[i]);
break;
case 'audio':
article[i] = '<div class="post_wrap"><div class="audio"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/e8Zlawemi/link_audio.png" /></a><h2 class="heading"><a href="'
+ item.url + '">'
+ item['id3-artist']
+' - '
+ item['id3-title']
+ '</a></h2><div class="player"><br />'
+ item['audio-player']
+ '<p>' + item['id3-artist'] + ' - ' + item['id3-title'] + '</p>'
+ '<p>' + item['audio-plays'] + ' plays</p>'
+ '</div><div class="audio_desc">'
+ item['audio-caption']
+ '</div><div class="clear"></div></div></div>';
count = 1;
break;
case 'regular':
article[i] = '<div class="post_wrap"><div class="regular"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/LH3laweb7/link_text.png" /></a><h2 class="heading"><a href="'
+ item.url
+ '">' + item['regular-title']
+ '</a><div class="description_container">'
+ item['regular-body']
+ '</div></div></div>';
count = 1;
break;
case 'quote':
article[i] = '<div class="post_wrap"><div class="quote"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/1Lwlaweh7/link_quote.png" /></a><blockquote>'
+ item['quote-text']
+ '</blockquote><cite>- '
+ item['quote-source']
+ '</cite></div></div>';
count = 1;
break;
case 'conversation':
article[i] = '<div class="post_wrap"><div class="chat"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/NZ9lawekt/link_chat.png" /></a><h2 class="heading"><a href="'
+ item.url
+ '">' + item['conversation-title']
+ '</a></h2></div></div>';
count = 1;
break;
case 'link':
article[i] = '<div class="post_wrap"><div class="link"><a href="'
+ item.url
+ '" title="View Full Post" class="type_icon"><img src="http://static.tumblr.com/ewjv7ap/G1zlaweir/link_link.png" /></a><h2 class="heading"><a href="'
+ item['link-url']
+ '">' + item['link-text']
+ '</a></h2></div></div>';
count = 1;
break;
default:
alert('No Entries Found.');
};
}) // end each
if (!(count == 0)) {
$('#main_content')
.fadeOut('fast')
.html('<div class="post_wrap"><div class="regular"><h2 class="heading">Displaying '
+ postType
+ ' Posts Only</h2></div></div>'
+ '<div class="post_wrap"'
+ article.join('')
+ '</div>'
).fadeIn('fast')
$('div.video').each(function() {
var video_container_height = $(this).innerHeight();
video_container_height = (video_container_height - 60)
$(this).children('div.video_desc').css(
{'position': 'absolute',
'top': '40px',
'right': '20px',
'width': '380px',
'height': video_container_height}
).jScrollPane({
verticalGutter: 25
});
});
$('div.audio div.audio_desc').each(function() {
var container_width = $('div.audio').outerWidth(true);
var player_width = $('div.audio div.player').outerWidth(true);
var audio_desc_width = (container_width - player_width);
$(this).css(
{'position': 'absolute',
'top': '75px',
'right': '20px',
'height': '125px',
'width': (audio_desc_width - 50 /*The size of the left and right margin*/)})
.jScrollPane({
verticalGutter: 25
});
});
} else {
$('#main_content')
.fadeOut('fast')
.html('<div class="post_wrap"><div class="regular"><h2 class="heading">Whoops! There are no '
+ postType
+ ' Posts To Display</h2></div></div>'
).fadeIn('fast')
} // end IF
}); // end getJSON
}; // end byCategory
}); // end click
</script>
To check out the live version, head on over to http://minimus.tumblr.com
I think you problem is caused by a tiny error at line 1690: