Dockery/Pinry
1
0
Fork 0
mirror of https://github.com/pinry/pinry.git synced 2025-11-14 17:05:50 +01:00
Code Issues Packages Projects Releases Activity

Allow basic sorting by tag.

Browse Source
This commit is contained in:
Isaac Bythewood
2012-09-28 05:28:31 +00:00
parent 230a6e959f
commit ceda2d2cb0
4 changed files with 119 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
pinry/api/api.py
View File

@@ -27,6 +27,7 @@ class PinResource(ModelResource): # pylint: disable-msg=R0904
if 'tag' in filters: if 'tag' in filters:
orm_filters['tags__name__in'] = filters['tag'].split(',') orm_filters['tags__name__in'] = filters['tag'].split(',')
return orm_filters return orm_filters
def dehydrate_tags(self, bundle): def dehydrate_tags(self, bundle):

9
pinry/core/static/core/css/pinry.css
View File

@@ -59,6 +59,15 @@ body {
text-align: center; text-align: center;
} }
.tags {
padding: 13px 0;
}
.tag {
cursor: pointer;
}
#pins { #pins {
top: 70px; top: 70px;
position: absolute; position: absolute;

175
pinry/core/static/core/js/pinry.js
View File

@@ -1,99 +1,112 @@
/** /**
* Based on Wookmark's endless scroll. * Based on Wookmark's endless scroll.
*/ */
$(window).ready(function () { var apiURL = '/api/pin/?format=json&offset='
var apiURL = '/api/pin/?format=json&offset=' var page = 0;
var page = 0; var handler = null;
var handler = null; var globalTag = null;
var isLoading = false; var isLoading = false;
/** /**
* When scrolled all the way to the bottom, add more tiles. * When scrolled all the way to the bottom, add more tiles.
*/ */
function onScroll(event) { function onScroll(event) {
if(!isLoading) { if(!isLoading) {
var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 100); var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 100);
if(closeToBottom) loadData(); if(closeToBottom) loadData();
} }
}; };
function applyLayout() { function applyLayout() {
$('#pins').imagesLoaded(function() { $('#pins').imagesLoaded(function() {
// Clear our previous layout handler. // Clear our previous layout handler.
if(handler) handler.wookmarkClear(); if(handler) handler.wookmarkClear();
// Create a new layout handler. // Create a new layout handler.
handler = $('#pins .pin'); handler = $('#pins .pin');
handler.wookmark({ handler.wookmark({
autoResize: true, autoResize: true,
offset: 3, offset: 3,
itemWidth: 242 itemWidth: 242
});
}); });
}; });
};
/** /**
* Loads data from the API. * Loads data from the API.
*/ */
function loadData() { function loadData(tag) {
isLoading = true; isLoading = true;
$('#loader').show(); $('#loader').show();
$.ajax({ if (tag !== undefined) {
url: apiURL+(page*20), globalTag = tag;
success: onLoadData }
});
};
/** if (tag !== undefined && page != 0) {
* Receives data from the API, creates HTML for images and updates the layout $('#pins').html('');
*/ page = 0;
function onLoadData(data) { if (tag != null) $('.tags').html('<span class="label tag" onclick="loadData(null)">' + tag + ' x</span>');
data = data.objects; else $('.tags').html('');
isLoading = false; }
$('#loader').hide();
page++; var loadURL = apiURL+(page*20);
if (globalTag !== null) loadURL += "&tag=" + tag;
var html = ''; $.ajax({
var i=0, length=data.length, image; url: loadURL,
for(; i<length; i++) { success: onLoadData
image = data[i]; });
html += '<div class="pin">'; };
html += '<div class="pin-options">';
html += '<a href="/pins/delete-pin/'+image.id+'">'; /**
html += '<i class="icon-trash"></i>'; * Receives data from the API, creates HTML for images and updates the layout
html += '</a>'; */
html += '</div>'; function onLoadData(data) {
html += '<a class="fancybox" rel="pins" href="'+image.image+'">'; data = data.objects;
html += '<img src="'+image.thumbnail+'" width="200" >'; isLoading = false;
$('#loader').hide();
page++;
var html = '';
var i=0, length=data.length, image;
for(; i<length; i++) {
image = data[i];
html += '<div class="pin">';
html += '<div class="pin-options">';
html += '<a href="/pins/delete-pin/'+image.id+'">';
html += '<i class="icon-trash"></i>';
html += '</a>'; html += '</a>';
if (image.description) html += '<p>'+image.description+'</p>';
if (image.tags) {
html += '<p>';
for (tag in image.tags) {
html += image.tags[tag] + ', ';
}
html += '</p>';
}
html += '</div>'; html += '</div>';
} html += '<a class="fancybox" rel="pins" href="'+image.image+'">';
html += '<img src="'+image.thumbnail+'" width="200" >';
html += '</a>';
if (image.description) html += '<p>'+image.description+'</p>';
if (image.tags) {
html += '<p>';
for (tag in image.tags) {
html += '<span class="label tag" onclick="loadData(\'' + image.tags[tag] + '\')">' + image.tags[tag] + '</span> ';
}
html += '</p>';
}
html += '</div>';
}
$('#pins').append(html); $('#pins').append(html);
applyLayout(); applyLayout();
}; };
$(document).ready(new function() { $(document).ready(new function() {
$(document).bind('scroll', onScroll); $(document).bind('scroll', onScroll);
loadData(); loadData();
}); });
/** /**
* On clicking an image show fancybox original. * On clicking an image show fancybox original.
*/ */
$('.fancybox').fancybox({ $('.fancybox').fancybox({
openEffect: 'none', openEffect: 'none',
closeEffect: 'none' closeEffect: 'none'
});
}); });

4
pinry/core/templates/core/base.html
View File

@@ -18,7 +18,9 @@
<body> <body>
<div class="navbar navbar-fixed-top"> <div class="navbar navbar-fixed-top">
<div class="navbar-inner"> <div class="navbar-inner">
<a href="{% url core:home %}" class="brand">{{ site_name }}</a> <a href="{% url core:home %}" class="brand pull-left">{{ site_name }}</a>
<div class="tags pull-left"></div>
<ul class="nav pull-right"> <ul class="nav pull-right">
{% if user.is_authenticated %} {% if user.is_authenticated %}