diff --git a/fileupload/migrations/0001_initial.py b/fileupload/migrations/0001_initial.py new file mode 100644 index 0000000..778269a --- /dev/null +++ b/fileupload/migrations/0001_initial.py @@ -0,0 +1,72 @@ +# -*- coding: utf-8 -*- +import datetime +from south.db import db +from south.v2 import SchemaMigration +from django.db import models + + +class Migration(SchemaMigration): + + def forwards(self, orm): + # Adding model 'Picture' + db.create_table('fileupload_picture', ( + ('id', self.gf('django.db.models.fields.AutoField')(primary_key=True)), + ('file', self.gf('django.db.models.fields.files.FileField')(max_length=100)), + ('slug', self.gf('django.db.models.fields.SlugField')(max_length=50, blank=True)), + ('creator', self.gf('django.db.models.fields.related.ForeignKey')(to=orm['auth.User'])), + )) + db.send_create_signal('fileupload', ['Picture']) + + + def backwards(self, orm): + # Deleting model 'Picture' + db.delete_table('fileupload_picture') + + + models = { + 'auth.group': { + 'Meta': {'object_name': 'Group'}, + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'name': ('django.db.models.fields.CharField', [], {'unique': 'True', 'max_length': '80'}), + 'permissions': ('django.db.models.fields.related.ManyToManyField', [], {'to': "orm['auth.Permission']", 'symmetrical': 'False', 'blank': 'True'}) + }, + 'auth.permission': { + 'Meta': {'ordering': "('content_type__app_label', 'content_type__model', 'codename')", 'unique_together': "(('content_type', 'codename'),)", 'object_name': 'Permission'}, + 'codename': ('django.db.models.fields.CharField', [], {'max_length': '100'}), + 'content_type': ('django.db.models.fields.related.ForeignKey', [], {'to': "orm['contenttypes.ContentType']"}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'name': ('django.db.models.fields.CharField', [], {'max_length': '50'}) + }, + 'auth.user': { + 'Meta': {'object_name': 'User'}, + 'date_joined': ('django.db.models.fields.DateTimeField', [], {'default': 'datetime.datetime.now'}), + 'email': ('django.db.models.fields.EmailField', [], {'max_length': '75', 'blank': 'True'}), + 'first_name': ('django.db.models.fields.CharField', [], {'max_length': '30', 'blank': 'True'}), + 'groups': ('django.db.models.fields.related.ManyToManyField', [], {'to': "orm['auth.Group']", 'symmetrical': 'False', 'blank': 'True'}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'is_active': ('django.db.models.fields.BooleanField', [], {'default': 'True'}), + 'is_staff': ('django.db.models.fields.BooleanField', [], {'default': 'False'}), + 'is_superuser': ('django.db.models.fields.BooleanField', [], {'default': 'False'}), + 'last_login': ('django.db.models.fields.DateTimeField', [], {'default': 'datetime.datetime.now'}), + 'last_name': ('django.db.models.fields.CharField', [], {'max_length': '30', 'blank': 'True'}), + 'password': ('django.db.models.fields.CharField', [], {'max_length': '128'}), + 'user_permissions': ('django.db.models.fields.related.ManyToManyField', [], {'to': "orm['auth.Permission']", 'symmetrical': 'False', 'blank': 'True'}), + 'username': ('django.db.models.fields.CharField', [], {'unique': 'True', 'max_length': '30'}) + }, + 'contenttypes.contenttype': { + 'Meta': {'ordering': "('name',)", 'unique_together': "(('app_label', 'model'),)", 'object_name': 'ContentType', 'db_table': "'django_content_type'"}, + 'app_label': ('django.db.models.fields.CharField', [], {'max_length': '100'}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'model': ('django.db.models.fields.CharField', [], {'max_length': '100'}), + 'name': ('django.db.models.fields.CharField', [], {'max_length': '100'}) + }, + 'fileupload.picture': { + 'Meta': {'object_name': 'Picture'}, + 'creator': ('django.db.models.fields.related.ForeignKey', [], {'to': "orm['auth.User']"}), + 'file': ('django.db.models.fields.files.FileField', [], {'max_length': '100'}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'slug': ('django.db.models.fields.SlugField', [], {'max_length': '50', 'blank': 'True'}) + } + } + + complete_apps = ['fileupload'] \ No newline at end of file diff --git a/fileupload/migrations/0002_auto__chg_field_picture_file.py b/fileupload/migrations/0002_auto__chg_field_picture_file.py new file mode 100644 index 0000000..8af7bde --- /dev/null +++ b/fileupload/migrations/0002_auto__chg_field_picture_file.py @@ -0,0 +1,66 @@ +# -*- coding: utf-8 -*- +import datetime +from south.db import db +from south.v2 import SchemaMigration +from django.db import models + + +class Migration(SchemaMigration): + + def forwards(self, orm): + + # Changing field 'Picture.file' + db.alter_column('fileupload_picture', 'file', self.gf('django.db.models.fields.files.ImageField')(max_length=100)) + + def backwards(self, orm): + + # Changing field 'Picture.file' + db.alter_column('fileupload_picture', 'file', self.gf('django.db.models.fields.files.FileField')(max_length=100)) + + models = { + 'auth.group': { + 'Meta': {'object_name': 'Group'}, + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'name': ('django.db.models.fields.CharField', [], {'unique': 'True', 'max_length': '80'}), + 'permissions': ('django.db.models.fields.related.ManyToManyField', [], {'to': "orm['auth.Permission']", 'symmetrical': 'False', 'blank': 'True'}) + }, + 'auth.permission': { + 'Meta': {'ordering': "('content_type__app_label', 'content_type__model', 'codename')", 'unique_together': "(('content_type', 'codename'),)", 'object_name': 'Permission'}, + 'codename': ('django.db.models.fields.CharField', [], {'max_length': '100'}), + 'content_type': ('django.db.models.fields.related.ForeignKey', [], {'to': "orm['contenttypes.ContentType']"}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'name': ('django.db.models.fields.CharField', [], {'max_length': '50'}) + }, + 'auth.user': { + 'Meta': {'object_name': 'User'}, + 'date_joined': ('django.db.models.fields.DateTimeField', [], {'default': 'datetime.datetime.now'}), + 'email': ('django.db.models.fields.EmailField', [], {'max_length': '75', 'blank': 'True'}), + 'first_name': ('django.db.models.fields.CharField', [], {'max_length': '30', 'blank': 'True'}), + 'groups': ('django.db.models.fields.related.ManyToManyField', [], {'to': "orm['auth.Group']", 'symmetrical': 'False', 'blank': 'True'}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'is_active': ('django.db.models.fields.BooleanField', [], {'default': 'True'}), + 'is_staff': ('django.db.models.fields.BooleanField', [], {'default': 'False'}), + 'is_superuser': ('django.db.models.fields.BooleanField', [], {'default': 'False'}), + 'last_login': ('django.db.models.fields.DateTimeField', [], {'default': 'datetime.datetime.now'}), + 'last_name': ('django.db.models.fields.CharField', [], {'max_length': '30', 'blank': 'True'}), + 'password': ('django.db.models.fields.CharField', [], {'max_length': '128'}), + 'user_permissions': ('django.db.models.fields.related.ManyToManyField', [], {'to': "orm['auth.Permission']", 'symmetrical': 'False', 'blank': 'True'}), + 'username': ('django.db.models.fields.CharField', [], {'unique': 'True', 'max_length': '30'}) + }, + 'contenttypes.contenttype': { + 'Meta': {'ordering': "('name',)", 'unique_together': "(('app_label', 'model'),)", 'object_name': 'ContentType', 'db_table': "'django_content_type'"}, + 'app_label': ('django.db.models.fields.CharField', [], {'max_length': '100'}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'model': ('django.db.models.fields.CharField', [], {'max_length': '100'}), + 'name': ('django.db.models.fields.CharField', [], {'max_length': '100'}) + }, + 'fileupload.picture': { + 'Meta': {'object_name': 'Picture'}, + 'creator': ('django.db.models.fields.related.ForeignKey', [], {'to': "orm['auth.User']"}), + 'file': ('django.db.models.fields.files.ImageField', [], {'max_length': '100'}), + 'id': ('django.db.models.fields.AutoField', [], {'primary_key': 'True'}), + 'slug': ('django.db.models.fields.SlugField', [], {'max_length': '50', 'blank': 'True'}) + } + } + + complete_apps = ['fileupload'] \ No newline at end of file diff --git a/fileupload/migrations/__init__.py b/fileupload/migrations/__init__.py new file mode 100644 index 0000000..e69de29 diff --git a/fileupload/models.py b/fileupload/models.py index 64cf98b..9493501 100644 --- a/fileupload/models.py +++ b/fileupload/models.py @@ -1,18 +1,15 @@ from django.db import models +from django.contrib.auth.models import User class Picture(models.Model): - - # This is a small demo using just two fields. The slug field is really not - # necessary, but makes the code simpler. ImageField depends on PIL or - # pillow (where Pillow is easily installable in a virtualenv. If you have - # problems installing pillow, use a more generic FileField instead. - - #file = models.FileField(upload_to="pictures") + # This is a small demo using FileField instead of ImageField, not + # depending on PIL. You will probably want ImageField in your app. file = models.ImageField(upload_to="pictures") slug = models.SlugField(max_length=50, blank=True) + creator = models.ForeignKey(User) def __unicode__(self): - return self.file + return self.file.name @models.permalink def get_absolute_url(self): @@ -21,7 +18,3 @@ def get_absolute_url(self): def save(self, *args, **kwargs): self.slug = self.file.name super(Picture, self).save(*args, **kwargs) - - def delete(self, *args, **kwargs): - self.file.delete(False) - super(Picture, self).delete(*args, **kwargs) diff --git a/fileupload/static/css/style.css b/fileupload/static/css/style.css index cc924c5..0921e10 100644 --- a/fileupload/static/css/style.css +++ b/fileupload/static/css/style.css @@ -3,5 +3,30 @@ body{ } .preview img { - max-height: 50px; + max-height: 100px; } + +a.gallerypic{ + text-decoration:none; + position:relative; + display:block; + border:1px solid #666; + padding:3px; + margin-right:5px; + float:left; +} + +a.gallerypic span.zoom-icon{ + visibility:hidden; + position:absolute; + left:40%; + top:35%; + filter:alpha(opacity=50); + -moz-opacity:0.5; + -khtml-opacity: 0.5; + opacity: 0.5; +} + +a.gallerypic:hover span.zoom-icon{ + visibility:visible; +} \ No newline at end of file diff --git a/fileupload/static/js/jquery.fileupload-fp.js b/fileupload/static/js/jquery.fileupload-fp.js index 634fb5e..9b45c68 100644 --- a/fileupload/static/js/jquery.fileupload-fp.js +++ b/fileupload/static/js/jquery.fileupload-fp.js @@ -20,7 +20,7 @@ 'jquery', 'load-image', 'canvas-to-blob', - './jquery.fileupload' + './jquery.fileupload.js' ], factory); } else { // Browser globals: diff --git a/fileupload/static/js/jquery.fileupload-ui.js b/fileupload/static/js/jquery.fileupload-ui.js index f7fc3bf..11d1b96 100644 --- a/fileupload/static/js/jquery.fileupload-ui.js +++ b/fileupload/static/js/jquery.fileupload-ui.js @@ -20,7 +20,7 @@ 'jquery', 'tmpl', 'load-image', - './jquery.fileupload-fp' + './jquery.fileupload-fp.js' ], factory); } else { // Browser globals: diff --git a/fileupload/static/js/jquery.fileupload.js b/fileupload/static/js/jquery.fileupload.js index 05a654b..e145d21 100644 --- a/fileupload/static/js/jquery.fileupload.js +++ b/fileupload/static/js/jquery.fileupload.js @@ -18,7 +18,7 @@ // Register as an anonymous AMD module: define([ 'jquery', - 'jquery.ui.widget' + 'jquery.ui.widget.js' ], factory); } else { // Browser globals: diff --git a/fileupload/static/js/jquery_fix_csrf.js b/fileupload/static/js/jquery_fix_csrf.js new file mode 100644 index 0000000..5635522 --- /dev/null +++ b/fileupload/static/js/jquery_fix_csrf.js @@ -0,0 +1,41 @@ +//Source https://github.com/miki725/Django-jQuery-File-Uploader-Integration-demo/blob/master/static/js/jquery_fix_csrf.js + +// jQuery alteration which send CSRF token on each ajax request in order to pass Django CSRF +$(document).ajaxSend(function(event, xhr, settings) { + function getCookie(name) { + var cookieValue = null; + if (document.cookie && document.cookie != '') { + var cookies = document.cookie.split(';'); + for (var i = 0; i < cookies.length; i++) { + var cookie = jQuery.trim(cookies[i]); + // Does this cookie string begin with the name we want? + if (cookie.substring(0, name.length + 1) == (name + '=')) { + cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); + break; + } + } + } + return cookieValue; + } + + function sameOrigin(url) { + // url could be relative or scheme relative or absolute + var host = document.location.host; // host + port + var protocol = document.location.protocol; + var sr_origin = '//' + host; + var origin = protocol + sr_origin; + // Allow absolute or scheme relative URLs to same origin + return (url == origin || url.slice(0, origin.length + 1) == origin + '/') || + (url == sr_origin || url.slice(0, sr_origin.length + 1) == sr_origin + '/') || + // or any other URL that isn't scheme relative or absolute i.e relative. + !(/^(\/\/|http:|https:).*/.test(url)); + } + + function safeMethod(method) { + return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method)); + } + + if (!safeMethod(settings.type) && sameOrigin(settings.url)) { + xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); + } +}); \ No newline at end of file diff --git a/fileupload/static/js/main.js b/fileupload/static/js/main.js index 01c86fe..dee3276 100644 --- a/fileupload/static/js/main.js +++ b/fileupload/static/js/main.js @@ -16,7 +16,25 @@ $(function () { 'use strict'; // Initialize the jQuery File Upload widget: - $('#fileupload').fileupload(); +// $('#fileupload').fileupload(); + $('#fileupload').fileupload( + 'option', + { +// url: '/path/to/upload/handler.json', +// sequentialUploads: true + autoUpload: true, + // this formData is neccessary to pass the csrf and pass uid to django + formData: [ + { name: "csrfmiddlewaretoken", value: "{{ csrf_token }}"} + ] + } + ); + + $('#fileupload').fileupload({ + add: function (e, data) { + data.submit(); + } + }); // Enable iframe cross-domain access via redirect option: $('#fileupload').fileupload( diff --git a/fileupload/templates/fileupload/picture_form.html b/fileupload/templates/fileupload/picture_form.html index 89b764a..6ae8177 100644 --- a/fileupload/templates/fileupload/picture_form.html +++ b/fileupload/templates/fileupload/picture_form.html @@ -1,88 +1,133 @@ -{% extends "base.html" %} -{% load upload_tags %} - -{% block content %} -
- -
{% csrf_token %} -
-
- - - Add files... - - - - - - -
-
-
-
+{% load upload_tags %} + + + + Django Jquery File Upload Example + + + + + + + + + + + + + + + + - -