Pretty

example_project/myapp/admin.py

@@ -1,15 +1,49 @@
 from django.contrib import admin
-from myapp.models import Author, Book
-from pretty_inline import PrettyInline
+from myapp.models import Book, Author, AuthorTabular, AuthorStacked, AuthorPretty, Address
+from pretty_inline.admin import TabularInline, StackedInline, PrettyInline
 
 
-class BookInline(PrettyInline):
+class BookRegularTabularInline(admin.StackedInline):
     model = Book
+    max_num = 5
 
 
-class AuthorAdmin(admin.ModelAdmin):
-    inlines = [BookInline, ]
+class BookTabularInline(TabularInline):
+    model = Book
+    max_num = 5
+
+
+class BookStackedInline(StackedInline):
+    model = Book
+    max_num = 5
+
+
+class BookPrettyInline(PrettyInline):
+    model = Book
+    max_num = 5
+
+
+class AddressPrettyInline(PrettyInline):
+    model = Address
+
+
+class AuthorTabularAdmin(admin.ModelAdmin):
+    inlines = [BookTabularInline, ]
+
+
+class AuthorStackedAdmin(admin.ModelAdmin):
+    inlines = [BookStackedInline, ]
+
+
+class AuthorRegularTabularAdmin(admin.ModelAdmin):
+    inlines = [BookRegularTabularInline]
+
 
+class AuthorPrettyAdmin(admin.ModelAdmin):
+    inlines = [BookPrettyInline, AddressPrettyInline]
 
-admin.site.register(Author, AuthorAdmin)
+admin.site.register(AuthorTabular, AuthorTabularAdmin)
+admin.site.register(AuthorStacked, AuthorStackedAdmin)
+admin.site.register(AuthorPretty, AuthorPrettyAdmin)
+admin.site.register(Author, AuthorRegularTabularAdmin)
 admin.site.register(Book)

example_project/myapp/models.py

@@ -6,5 +6,29 @@ class Author(models.Model):
 
 
 class Book(models.Model):
+    author = models.ForeignKey(Author)
     title = models.CharField(max_length=255)
+    eancode = models.CharField(max_length=255)
+    description = models.TextField()
+    language = models.CharField(max_length=7, choices=[("dutch", "Dutch"), ("english", "English")])
+
+
+class Address(models.Model):
     author = models.ForeignKey(Author)
+    street = models.CharField(max_length=100)
+    postal = models.CharField(max_length=100)
+    city = models.CharField(max_length=100)
+
+class AuthorTabular(Author):
+    class Meta:
+        proxy = True
+
+
+class AuthorStacked(Author):
+    class Meta:
+        proxy = True
+
+
+class AuthorPretty(Author):
+    class Meta:
+        proxy = True

pretty_inline/admin.py

@@ -1,12 +1,40 @@
+from django.conf import settings
 from django.contrib.admin.options import InlineModelAdmin
 from django.contrib.admin.templatetags.admin_static import static
+from django.contrib.admin import TabularInline as BaseTabularInline
+from django.contrib.admin import StackedInline as BaseStackedInline
+from django.forms import forms
 
 
-class PrettyInline(InlineModelAdmin):
-    template = 'pretty_inline/edit_inline/pretty.html'
-
+class BaseInlineModelAdmin(InlineModelAdmin):
     @property
     def media(self):
-        js = super(PrettyInline, self).media
-        js.add_js([static('pretty_inline/js/%s' % 'pretty_inline.js'), ])
-        return js
+        from django import VERSION as DJANGO_VERSION
+
+        media = super(BaseInlineModelAdmin, self).media
+
+        if DJANGO_VERSION[0] is 1 and DJANGO_VERSION[1] < 6:
+            media.add_js(['//code.jquery.com/jquery-1.11.0.min.js'])
+
+        media.add_css({
+            "all": [static('pretty_inline/css/baseInlineFormset.css')]
+        })
+        media.add_js([static('libs/jquery.fix.clone.js')])
+        media.add_js([static('pretty_inline/js/baseInlineFormset.js')])
+
+
+        return media
+
+
+class TabularInline(BaseInlineModelAdmin, BaseTabularInline):
+    template = 'pretty_inline/edit_inline/tabular.html'
+
+
+class StackedInline(BaseInlineModelAdmin, BaseStackedInline):
+    template = 'pretty_inline/edit_inline/stacked.html'
+
+
+class PrettyInline(BaseInlineModelAdmin):
+    template = 'pretty_inline/edit_inline/pretty.html'
+    extra = 0
+

pretty_inline/static/libs/jquery.fix.clone.js

@@ -0,0 +1,27 @@
+// Textarea and select clone() bug workaround | Spencer Tipping
+// Licensed under the terms of the MIT source code license
+
+// Motivation.
+// jQuery's clone() method works in most cases, but it fails to copy the value of textareas and select elements. This patch replaces jQuery's clone() method with a wrapper that fills in the
+// values after the fact.
+
+// An interesting error case submitted by Piotr Przybył: If two <select> options had the same value, the clone() method would select the wrong one in the cloned box. The fix, suggested by Piotr
+// and implemented here, is to use the selectedIndex property on the <select> box itself rather than relying on jQuery's value-based val().
+
+(function ($) {
+    var original = $.fn.clone;
+    $.fn.clone = function () {
+        var result = original.apply(this, arguments),
+            my_textareas = this.find('textarea').add(this.filter('textarea')),
+            result_textareas = result.find('textarea').add(result.filter('textarea')),
+            my_selects = this.find('select').add(this.filter('select')),
+            result_selects = result.find('select').add(result.filter('select'));
+
+        for (var i = 0, l = my_textareas.length; i < l; ++i) $(result_textareas[i]).val($(my_textareas[i]).val());
+        for (var i = 0, l = my_selects.length; i < l; ++i) result_selects[i].selectedIndex = my_selects[i].selectedIndex;
+
+        return result;
+    };
+})(django.jQuery);
+
+// Generated by SDoc

pretty_inline/static/pretty_inline/css/baseInlineFormset.css

@@ -0,0 +1,204 @@
+.inline-group td {
+    line-height: 34px;
+}
+
+.inline-group .form-row:nth-child(odd) {
+    background: #EDF3FE;
+}
+
+.inline-group .add-button {
+    background: url('../../admin/img/icon_addlink.gif') 0 50% no-repeat;
+    margin-left: 10px;
+    padding-left: 15px;
+    border: 0;
+    color: #5b80b2;
+    cursor: pointer;
+}
+
+.inline-group .add-button:hover,
+.inline-group .add-button:focus {
+    color: #036;
+}
+
+.inline-group .change-button {
+    background: url('../../admin/img/icon_changelink.gif') 0 50% no-repeat;
+    margin-left: 10px;
+    padding-left: 15px;
+    border: 0;
+    color: #5b80b2;
+    cursor: pointer;
+}
+
+.inline-group .change-button:hover,
+.inline-group .change-button:focus {
+    color: #036;
+}
+
+.inline-group .change-button.disabled {
+    opacity: 0.2;
+    color: #999;
+}
+
+.inline-group .delete-button {
+    background: url('../../admin/img/icon_deletelink.gif') 0 50% no-repeat;
+    margin-left: 10px;
+    padding-left: 15px;
+    border: 0;
+    color: #CC3434;
+    cursor: pointer;
+}
+
+.inline-group .delete-button:hover,
+.inline-group .delete-button:focus {
+    color: #993333;
+}
+
+.inline-group .delete-button.disabled {
+    opacity: 0.2;
+    color: #999;
+}
+
+.inline-group .save-button {
+    border: 2px solid #5b80b2;
+    background: #7CA0C7 url(../../admin/img/default-bg.gif) bottom repeat-x;
+    font-weight: bold;
+    color: white;
+    padding-left: 12px;
+    padding-right: 12px;
+}
+
+.inline-group .cancel-button {
+    background: white url(../../admin/img/nav-bg.gif) bottom repeat-x;
+    padding: 3px 5px;
+    color: black;
+    border: 1px solid #bbb;
+    border-color: #ddd #aaa #aaa #ddd;
+}
+
+.inline-group .button-row {
+    padding-left: 115px;
+    padding-top: 20px;
+    padding-bottom: 40px;
+}
+
+
+.inline-group .form-row.removed,
+.inline-group .removed .form-row {
+    background: #FFF4F9;
+}
+
+.inline-group .removed .form-row:nth-child(odd),
+.inline-group .form-row:nth-child(odd).removed {
+    background: #FFECF4;
+}
+
+.inline-group .removed * {
+    text-decoration: line-through;
+}
+
+.inline-group .removed button.delete-button,
+.inline-group .removed button.change-button {
+    text-decoration: none;
+}
+
+.inline-group .add-button.disabled {
+    color: #ddd;
+}
+
+.inline-group .form-row.errors {
+    background: #FFC;
+    border: 1px solid #F00;
+}
+
+/* Stacked */
+.inline-group.stacked-inline .delete-button {
+    padding: 0 0 0 15px;
+}
+
+.inline-group .hidden {
+    display: none;
+}
+
+/* Pretty */
+.inline-group.pretty .overview {
+    position: relative;
+    opacity: 1;
+    -webkit-transition: all 0.2s;
+    -moz-transition: all 0.2s;
+    -ms-transition: all 0.2s;
+    -o-transition: all 0.2s;
+    transition: all 0.2s;
+}
+
+.inline-group.pretty .editor {
+    opacity: 0;
+    -webkit-transition: all 0.2s;
+    -moz-transition: all 0.2s;
+    -ms-transition: all 0.2s;
+    -o-transition: all 0.2s;
+    transition: all 0.2s;
+}
+
+.inline-group.pretty.editor-active .overview {
+    display: none;
+    position: absolute;
+}
+
+.inline-group.pretty.editor-active .editor {
+    opacity: 1;
+}
+
+.inline-group.pretty.editor-active .add-button {
+    display: none;
+}
+
+.inline-group.pretty .form-row.errors .item {
+    background: #FFC url('../../admin/img/icon_error.gif') 5px 50% no-repeat;
+    padding-left: 25px;
+}
+
+.inline-group.pretty .change-form td {
+    overflow: hidden;
+}
+
+.inline-group.pretty .change-form fieldset {
+    -webkit-transition: all 200ms;
+    -moz-transition: all 200ms;
+    -ms-transition: all 200ms;
+    -o-transition: all 200ms;
+    transition: all 200ms;
+    overflow: hidden;
+    margin: -50% auto 50px;
+    width: 90%;
+
+}
+
+.inline-group.pretty .change-form.original {
+    display: none;
+}
+
+.inline-group.pretty .change-form.original fieldset {
+    display: none;
+}
+
+.inline-group.pretty .change-form.active {
+    background: #F5F8FF;
+}
+
+.inline-group.pretty .change-form.active fieldset {
+    margin: 0 auto 50px;
+}
+
+.inline-group.pretty .change-form.active .form-row:nth-child(odd) {
+    background: #FFF;
+}
+
+.inline-group.pretty .change-form.active > td {
+    padding: 0;
+}
+
+.inline-group.pretty .change-form.active fieldset {
+    border-left: 1px solid #ddd;
+    border-bottom: 1px solid #ddd;
+    border-right: 1px solid #ddd;
+}