Permalink
Browse files

lernhilfen_ajax: paginator impelentiert, code aufgeräumt

  • Loading branch information...
baracoder committed Apr 7, 2012
1 parent 2312a02 commit f8a76d1281a7262e68a9bf926eb918f59de4212f
Showing with 183 additions and 149 deletions.
  1. +19 −6 lernhilfen/views.py
  2. +125 −0 media/lernhilfen.js
  3. +33 −0 media/style.css
  4. +6 −143 templates/lernhilfen/index.html
View
@@ -24,30 +24,43 @@ def index(request):
return render_response(request,'lernhilfen/index.html',c)
def ajax_get(request):
+ # anzahl lernhilfen pro seite
+ onpage = 10
+
if request.GET and request.GET.has_key('semester'):
filterset = forms.LernhilfenFilterSet(request.GET)
else:
filterset = forms.LernhilfenFilterSet()
- l = filterset.qs
+ offset = 0
+ if request.GET and request.GET.has_key('offset'):
+ offset = int(request.GET['offset'])
+ list_strt = offset * onpage
+ list_end = (offset+1) * onpage
+
+ qs = filterset.qs
if request.GET.has_key('ungesichtet'):
- l = l.filter(gesichtet=False)
+ qs = qs.filter(gesichtet=False)
if not request.user.is_staff:
- l = l.filter(gesichtet=True)
+ qs = qs.filter(gesichtet=True)
+
+ qs_page = qs[list_strt:list_end]
+ has_prev = offset>0
+ has_next = len(qs)>list_end
fields = [ 'id', 'name', 'endung', 'art', 'modul', 'dozent',
'studiengang', 'semester', 'gesichtet']
rows = []
- for r in l:
+ for r in qs_page:
row = {}
for f in fields:
row[f]=unicode(r.__getattribute__(f))
# datei braucht sonder bhandlung
row['datei'] = unicode(r.datei.url)
rows.append(row)
- resp = {'has_prev':False,
- 'has_next':False,
+ resp = {'has_prev':has_prev,
+ 'has_next':has_next,
'rows':rows,
}
return HttpResponse(json.dumps(resp), mimetype="application/json")
View
@@ -0,0 +1,125 @@
+
+function file_rows(rows) {
+ var file_row_cycle=2;
+ var strr='';
+ for(var i in rows) {
+ strr+=file_row(rows[i],file_row_cycle++%2+1);
+ }
+ $('#filerows').html(strr);
+ //$('#filerows').fadeIn();
+ // TODO: Ajax-loader background ausblenden
+ $('#loader').hide();
+}
+
+function file_row(data,rownr) {
+ var row = '\
+ <div class="filerow filerow'+ rownr +'" id="filerow-'+data['id']+'">\
+ <div class="name" style="padding:2px;text-align:left;">\
+ <a href="'+ data['datei'] +'" target="_blank">'+ data['name'] +'</a>\
+ <sup>('+ data['endung'].substring(1) +')</sup>';
+ if(user_is_staff) {
+ row += '\
+ <div style="float:right;">';
+ if(data['gesichtet']=="False") row += '\
+ <a href="javascript:review('+data['id']+');">\
+ <img src="/admin/media/img/admin/icon-yes.gif" alt="als gesichtet markieren"/>\
+ </a>';
+ row += '\
+ <a href="/admin/lernhilfen/lernhilfe/'+ data['id'] +'/">\
+ <img src="/admin/media/img/admin/icon_changelink.gif" alt="Bearbeiten/Löschen" />\
+ </a>\
+ </div>';
+ }
+
+ row +='\
+ <div style="clear:both;"></div>\
+ </div>\
+ <div class="meta">\
+ <span>'+ data['studiengang'] +'</span>\
+ <span>'+ data['modul'] +'</span>\
+ <span>'+ data['dozent'] +'</span>\
+ <span>'+ data['semester'] +'</span>\
+ <span>'+ data['art'] +'</span>\
+ <div style="clear:both;"></div>\
+ </div>\
+ </div>\
+ ';
+ return row;
+}
+
+function get_filter_vals() {
+ filter = {
+ 'studiengang':$('#id_studiengang').val(),
+ 'modul':$('#id_modul').val(),
+ 'dozent':$('#id_dozent').val(),
+ 'semester':$('#id_semester').val(),
+ 'art':$('#id_art').val(),
+ 'offset':offset,
+ };
+ if(user_is_staff && $('#show_unreviewed').attr('checked'))
+ filter['ungesichtet']=true;
+ return filter;
+}
+
+function parse_response(response) {
+ if(response['has_next']) $('#btn_nextpage').show();
+ else $('#btn_nextpage').hide();
+
+ if(response['has_prev']) $('#btn_prevpage').show();
+ else $('#btn_prevpage').hide();
+
+ file_rows(response['rows']);
+
+}
+
+
+function request_filerows(l_offset) {
+ if(!l_offset) offset=0;
+ else offset = l_offset;
+ $.get( '/lernhilfen/get/',get_filter_vals(),parse_response );
+ // 2. suchanfrage stellen und anntwort-funktion als callback setzen
+ // 3. ajax-loader bild anzeigen
+ $('#loader').fadeIn();
+ //$('#filerows').hide();
+}
+
+function review(id) {
+ $('#filerow-'+id).css({'background-color':'#080'});
+ $.get( '/lernhilfen/sichten/'+id,review_callback);
+}
+
+function callback_filter_change() {
+ request_filerows();
+}
+
+function review_callback() {
+ request_filerows();
+}
+
+// Optional:
+// Hash-url auswerten
+
+// Ablauf beim laden der seite:
+// 1. Optional: hash auswerten
+// 2. suchanfrage stellen und anntwort-funktion als callback setzen
+// 3. ajax-loader bild anzeigen
+
+request_filerows();
+
+$('.filter select').change(callback_filter_change);
+$('#show_unreviewed').change(callback_filter_change);
+
+$('#btn_hochladen').click( function() {
+ $('#ulform1').fadeToggle(500)
+ $('#ulform2').delay(300).fadeToggle(500)
+ return false;
+}
+);
+
+$('#btn_nextpage').click(function () {
+ request_filerows(offset+1);
+});
+
+$('#btn_prevpage').click(function () {
+ request_filerows(offset-1);
+});
View
@@ -50,6 +50,39 @@ sup{font-size:0.7em;}
.lernhilfen .filerow1 { background-color:#353535;}
.lernhilfen .filerow2 { background-color:#454545;}
+.lernhilfen #filerows {position:relative;z-index:1;}
+
+.upload_form {
+ text-align:left;
+ background-color:#080;
+ display:none;
+ border-bottom: 1px solid #222222;
+ border-top: 1px solid #222222;
+ clear:both;
+}
+
+#btn_prevpage, #btn_nextpage {
+ z-index:1;
+ background-color:#444;
+ cursor:pointer;
+ padding:1em;
+}
+#btn_prevpage:hover, #btn_nextpage:hover {
+ background-color:#222;
+}
+
+#loader {
+ position:absolute;
+ top:0;left:0;
+ opacity:0.9;
+ z-index:2;
+ background-color:#333;
+ height:100%;width:100%;
+}
+#loader div { margin-top:2em; }
+
+
+
/* messages --------------------------------------------------------- */
.messages li { border:1px solid #CC0;background-color:#FF8;padding:0.1em;list-style:none;}
.messages li.success { border:1px solid #080;background-color:#1b1;}
@@ -7,32 +7,6 @@
{% block content %}
<div class="login">{% include "login_box.html" %}</div>
-<style>
-.upload_form {
- text-align:left;
- background-color:#080;
- display:none;
- border-bottom: 1px solid #222222;
- border-top: 1px solid #222222;
- clear:both;
-}
-
-#btn_prevpage, #btn_nextpage {
- z-index:1;
-}
-
-#loader {
- position:absolute;
- top:0;left:0;
- opacity:0.9;
- z-index:2;
- background-color:#333;
- height:100%;width:100%;
-}
-#loader div { margin-top:2em; }
-
-</style>
-
<form action="./upload/" method="POST" enctype="multipart/form-data">
<div class="lernhilfen block">
<div align="left">
@@ -73,134 +47,23 @@ <h2>Hochladen</h2>
Lade...
</div>
</div>
- <div id="btn_prevpage">Hasprev</div>
- <div id="filerows" style="position:relative;z-index:1;"></div>
- <div id="btn_nextpage">Hasnext</div>
+ <div id="btn_prevpage" class="filerow"><a>Zurück</a></div>
+ <div id="filerows"></div>
+ <div id="btn_nextpage" class="filerow"><a href="#">Weiter</a></div>
</div>
</div>
</div>
</form>
-<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
+var offset=0;
{% if user.is_staff %}
var user_is_staff = true;
{% else %}
var user_is_staff = false;
{% endif %}
-
-function file_rows(rows) {
- var file_row_cycle=2;
- var strr='';
- for(var i in rows) {
- strr+=file_row(rows[i],file_row_cycle++%2+1);
- }
- $('#filerows').html(strr);
- //$('#filerows').fadeIn();
- // TODO: Ajax-loader background ausblenden
- $('#loader').hide();
-}
-
-function file_row(data,rownr) {
- var row = '\
- <div class="filerow filerow'+ rownr +'" id="filerow-'+data['id']+'">\
- <div class="name" style="padding:2px;text-align:left;">\
- <a href="'+ data['datei'] +'" target="_blank">'+ data['name'] +'</a>\
- <sup>('+ data['endung'].substring(1) +')</sup>';
- if(user_is_staff) {
- row += '\
- <div style="float:right;">';
- if(data['gesichtet']=="False") row += '\
- <a href="javascript:review('+data['id']+');">\
- <img src="/admin/media/img/admin/icon-yes.gif" alt="als gesichtet markieren"/>\
- </a>';
- row += '\
- <a href="/admin/lernhilfen/lernhilfe/'+ data['id'] +'/">\
- <img src="/admin/media/img/admin/icon_changelink.gif" alt="Bearbeiten/Löschen" />\
- </a>\
- </div>';
- }
-
- row +='\
- <div style="clear:both;"></div>\
- </div>\
- <div class="meta">\
- <span>'+ data['studiengang'] +'</span>\
- <span>'+ data['modul'] +'</span>\
- <span>'+ data['dozent'] +'</span>\
- <span>'+ data['semester'] +'</span>\
- <span>'+ data['art'] +'</span>\
- <div style="clear:both;"></div>\
- </div>\
- </div>\
- ';
- return row;
-}
-
-function get_filter_vals() {
- filter = {
- 'studiengang':$('#id_studiengang').val(),
- 'modul':$('#id_modul').val(),
- 'dozent':$('#id_dozent').val(),
- 'semester':$('#id_semester').val(),
- 'art':$('#id_art').val(),
- };
- if(user_is_staff && $('#show_unreviewed').attr('checked'))
- filter['ungesichtet']="";
- return filter;
-}
-
-function parse_response(response) {
- if(response['has_next']) $('#button_nextpage').show();
- else $('#btn_nextpage').hide();
-
- if(response['has_prev']) $('#button_prevpage').show();
- else $('#btn_prevpage').hide();
-
- file_rows(response['rows'])
-
-}
-
-
-function request_filerows(offset) {
- if(!offset) offset=0;
- $.get( '/lernhilfen/get/',get_filter_vals(),parse_response );
- // 2. suchanfrage stellen und anntwort-funktion als callback setzen
- // 3. ajax-loader bild anzeigen
- $('#loader').fadeIn();
- //$('#filerows').hide();
-}
-
-function review(id) {
- $('#filerow-'+id).css({'background-color':'#080'});
- $.get( '/lernhilfen/sichten/'+id,review_callback);
-}
-
-function review_callback() {
- request_filerows();
-}
-
-// Optional:
-// Hash-url auswerten
-
-// Ablauf beim laden der seite:
-// 1. Optional: hash auswerten
-// 2. suchanfrage stellen und anntwort-funktion als callback setzen
-// 3. ajax-loader bild anzeigen
-
-request_filerows();
-
-$('.filter select').change(request_filerows);
-$('#show_unreviewed').change(request_filerows);
-
-$('#btn_hochladen').click(
-function() {
- $('#ulform1').fadeToggle(500)
- $('#ulform2').delay(300).fadeToggle(500)
- return false;
-}
-);
-
</script>
+<script src="/media/lernhilfen.js" type="text/javascript"></script>
+
{% endblock %}

0 comments on commit f8a76d1

Please sign in to comment.