From: zuber Date: Mon, 14 Dec 2009 23:40:32 +0000 (+0100) Subject: Galeria z przeciąganiem obrazków. X-Git-Url: https://git.mdrn.pl/redakcja.git/commitdiff_plain/a1f864eeb12aacf2d2c094c2bcb8add8b10c4e48 Galeria z przeciąganiem obrazków. --- diff --git a/apps/explorer/views.py b/apps/explorer/views.py index 150b03d1..71493c69 100755 --- a/apps/explorer/views.py +++ b/apps/explorer/views.py @@ -8,14 +8,15 @@ from django.conf import settings from django.contrib.auth.decorators import login_required, permission_required from django.core.urlresolvers import reverse -from django.http import HttpResponse +from django.http import HttpResponse, Http404 from django.utils import simplejson as json from django.views.generic.simple import direct_to_template from django.shortcuts import render_to_response from django.template import RequestContext from django.contrib.auth.decorators import login_required -from explorer import forms +from explorer import forms, models +import os # from api.models import PullRequest from bookthemes.models import Theme @@ -131,3 +132,13 @@ def pull_requests(request): def renderer_test(request): return direct_to_template(request, 'renderer.html', mimetype="text/html", extra_context = {} ) + + +def document_gallery(request, document): + assocs = models.GalleryForDocument.objects.filter(document=document) + directory = assocs[0].subpath + try: + images = ['/media/%s/%s' % (directory, f) for f in os.listdir(os.path.join(settings.MEDIA_ROOT, directory)) if f.lower().endswith('.jpg')] + return HttpResponse(json.dumps(images)) + except IndexError: + raise Http404 diff --git a/platforma/static/css/html.css b/platforma/static/css/html.css index cbf18745..574e7646 100755 --- a/platforma/static/css/html.css +++ b/platforma/static/css/html.css @@ -524,4 +524,8 @@ border: 1px solid #C8B849; background-color: #D4CB9C; white-space: pre; + overflow: auto; + margin: 1.5em 0 0; + font-family: monospace; + font-size: 10pt; } \ No newline at end of file diff --git a/platforma/static/css/master.css b/platforma/static/css/master.css index d7b6dc0b..493a1969 100755 --- a/platforma/static/css/master.css +++ b/platforma/static/css/master.css @@ -10,9 +10,10 @@ body { top: 25px; bottom: 0; right: 0;; - width: 14px; - background: #EEE url(/static/img/gallery.png) no-repeat scroll center center; + width: 13px; + background: #C1C1C1 url(/static/img/gallery.png) no-repeat scroll center center; border-left: 1px solid #999; + border-right: 1px solid #999; cursor: col-resize; } @@ -28,7 +29,7 @@ body { #html-view { overflow: auto; position: absolute; - top: 26px; + top: 27px; bottom: 0; left: 0; right: 0; @@ -36,7 +37,7 @@ body { #sidebar { position: absolute; - overflow: auto; + overflow: hidden; top: 25px; right: 0; bottom: 0; @@ -100,10 +101,12 @@ body { } .toolbar { + width: 100%; border-bottom: 1px solid #777; background-color: #C1C1C1; margin: 0; padding: 2px; + z-index: 10; /* height: 22px;*/ } @@ -125,6 +128,7 @@ body { } .toolbar input { + float: left; font-size: 11px; padding: 0; margin: 2px 5px 0 5px; @@ -158,4 +162,29 @@ p { margin: 0;} background-color: #FAFAFA; border: 1px solid #DDD; /* -webkit-transition: all 1s linear;*/ +} + +/* =========== */ +/* = Gallery = */ +/* =========== */ +.gallery-image { + position: absolute; + top: 27px; + right: 0; + bottom: 0; + left: 0; + margin: 0; + border: none; + background-color: #000; + overflow: hidden; +} + +img { + position: absolute; + -moz-drag: none; + user-select: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + cursor: pointer; } \ No newline at end of file diff --git a/platforma/static/js/main.js b/platforma/static/js/main.js index 284fd197..cf89c293 100644 --- a/platforma/static/js/main.js +++ b/platforma/static/js/main.js @@ -111,7 +111,101 @@ function selectTheme(themeId) // }); // } +function gallery(element) { + var element = $(element); + + function changePage(pageNumber) { + $('img', element).attr('src', element.data('images')[pageNumber - 1]); + } + + function normalizeNumber(pageNumber) { + // Numer strony musi być pomiędzy 1 a najwyższym numerem + var pageCount = element.data('images').length; + pageNumber = parseInt(pageNumber, 10); + + if (!pageNumber || pageNumber == NaN || pageNumber == Infinity || pageNumber == -Infinity) { + return 1; + } else if (pageNumber < 1) { + return 1; + } else if (pageNumber > pageCount) { + return pageCount; + } else { + return pageNumber; + } + } + + $.ajax({ + url: '/gallery/sample', + type: 'GET', + dataType: 'json', + + success: function(data) { + element.data('images', data); + var pn = $('.page-number', element); + pn.change(function(event) { + console.log('change!', $(this).val()); + event.preventDefault(); + var n = normalizeNumber(pn.val()); + pn.val(n); + changePage(n); + }); + $('.previous-page', element).click(function() { + pn.val(normalizeNumber(pn.val()) - 1); + pn.change(); + }); + $('.next-page', element).click(function() { + pn.val(normalizeNumber(pn.val()) + 1); + pn.change(); + }); + + var image = $('img', element).attr('unselectable', 'on'); + var origin = {}; + var imageOrigin = {}; + var imageDimensions = {}; + + function onMouseMove(event) { + var delta = { + x: event.clientX - origin.x, + y: event.clientY - origin.y + }; + + var newTop = Math.min(0, Math.max(imageOrigin.top + delta.y, imageDimensions.galleryHeight - imageDimensions.height)); + var newLeft = Math.min(0, Math.max(imageOrigin.left + delta.x, imageDimensions.galleryWidth - imageDimensions.width)); + image.css({position: 'absolute', top: newTop, left: newLeft}); + return false; + } + + function onMouseUp(event) { + $(document) + .unbind('mousemove.gallery') + .unbind('mouseup.gallery'); + return false; + } + + image.bind('mousedown', function(event) { + origin = { + x: event.clientX, + y: event.clientY + }; + imageOrigin = image.position(); + imageDimensions = { + width: image.width(), + height: image.height(), + galleryWidth: image.parent().width(), + galleryHeight: image.parent().height() + }; + $(document) + .bind('mousemove.gallery', onMouseMove) + .bind('mouseup.gallery', onMouseUp); + return false; + }); + } + }); +} + $(function() { + gallery('#sidebar'); + CodeMirror.fromTextArea('id_text', { parserfile: 'parsexml.js', path: "/static/js/lib/codemirror/", @@ -249,7 +343,7 @@ $(function() { $('.vsplitbar').click(function() { if ($('#sidebar').width() == 0) { - $('#sidebar').width(480).show(); + $('#sidebar').width(480).css({right: 0}).show(); $('#source-editor, #simple-editor').css({right: 495}); $('.vsplitbar').css({right: 480}) // $('#splitter').trigger('resize', [$(window).width() - 480]); diff --git a/platforma/templates/wiki/document_details.html b/platforma/templates/wiki/document_details.html index 139ade53..826ac648 100644 --- a/platforma/templates/wiki/document_details.html +++ b/platforma/templates/wiki/document_details.html @@ -11,7 +11,7 @@ {% endblock %} {% block maincontent %} -
+ {# #} -
+ {# #} {% endblock %} \ No newline at end of file diff --git a/platforma/urls.py b/platforma/urls.py index 495c7357..a5667bb7 100755 --- a/platforma/urls.py +++ b/platforma/urls.py @@ -32,6 +32,8 @@ urlpatterns = patterns('', # Our über-restful api # url(r'^api/', include('api.urls')), + url(r'^gallery/(?P[^/]+)$', 'explorer.views.document_gallery'), + # Static files (should be served by Apache) url(r'^%s(?P.+)$' % settings.MEDIA_URL[1:], 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT, 'show_indexes': True}),