Fred
/
pcards
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

When random-thumbnail image is clicked, modal dialog is shown

This commit is contained in:
Fred Pauchet 2013-02-03 14:22:55 +01:00
parent 15e7c8c72c
commit cb3bb2ffe3
3 changed files with 36 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
templates/base.html
View File

@ -9,13 +9,47 @@
<script src="{{ STATIC_URL }}js/jquery-1.8.2.min.js"></script>
<script src="{{ STATIC_URL }}js/bootstrap.min.js"></script>
<title>{% block page_title %}Collec' de cart'{% endblock %}</title>
<script>
$(function() {
// When DOM is ready, select the container element and call the jQCloud method, passing the array of words as the first argument.
$("a.thumbnail, a.randomized").click(function(e) {
e.preventDefault();
$('#modalDisplay').modal();
var request = $.ajax({
url: $(this).attr('href'),
type: 'GET',
dataType: 'html'
});
request.done(function(result) {
$('#modalDisplay').html(result);
});
request.fail(function(jqxhr, textStatus) {
$('#modalDisplay').html('La requête a foiré: ' + textStatus);
});
});
$('legend').click(function(){
$(this).parent().find('.content').slideToggle("slow");
});
});
</script>
</head>
<body>
<div id="modalDisplay" class="modal large hide fade">
</div>
<div class="container">
<header>
<div style="padding-bottom: 1em;">
{% random_pics %}<!--<a href="/"><img src="{{STATIC_URL}}img/header.png" alt="Ma collection de télécartes" /></a>-->
{% random_pics %}
</div>
<div>
<ul class="nav nav-pills menu">

35
templates/cards_list.html
View File

@ -1,40 +1,5 @@
{% load image_tags %}
<script>
$(function() {
// When DOM is ready, select the container element and call the jQCloud method, passing the array of words as the first argument.
$("a.thumbnail").click(function(e) {
e.preventDefault();
$('#modalDisplay').modal();
var request = $.ajax({
url: $(this).attr('href'),
type: 'GET',
dataType: 'html'
});
request.done(function(result) {
$('#modalDisplay').html(result);
});
request.fail(function(jqxhr, textStatus) {
$('#modalDisplay').html('La requête a foiré: ' + textStatus);
});
});
$('legend').click(function(){
$(this).parent().find('.content').slideToggle("slow");
});
});
</script>
<div id="modalDisplay" class="modal large hide fade">
</div>
<ul class="thumbnails">
{% for card in cards_list %}
<li class="span2">

2
templates/random_pics.html
View File

@ -4,7 +4,7 @@
<div style="margin: auto; width: 85%:">
{% for card in random_pics %}
{% if card.image %}
<a href="{% url card-details card.id %}"><img src="{{card|tiny}}" alt="" /></a>
<a class="randomized" href="{% url card-details card.id %}"><img src="{{card|tiny}}" alt="" /></a>
{% endif %}
{% endfor %}
</div>