Document model appears to fetch mostly properly

Can fetch Documents, and then get pages triggers page retrieval and
related field retrieval.

admin.py

@@ -7,9 +7,34 @@ import models
 class DocumentAdmin(admin.ModelAdmin):
     list_display = ['name', 'pdf', 'number_of_pages']
 
+    class Media:
+        js = (  "lib/jquery.js",
+                "lib/underscore.js",
+                "lib/backbone.js",
+                "lib/backbone.marionette.js",
+                "js/pdfformfiller/pdfformfiller.js")
+
+
     def number_of_pages(self, instance):
         return instance.page_set.count()
 
+    def get_urls(self):
+        urls = super(DocumentAdmin, self).get_urls()
+        my_urls = patterns('',
+                url(r'^(?P<pk>.*)/preview/$', self.admin_site.admin_view(self.preview), name='preview'),
+            )
+        return my_urls + urls
+
+    def preview(self, request, pk):
+        context = {}
+        context['document'] = models.Document.objects.get(pk=pk)
+        context['media'] = self.media
+
+        return TemplateResponse(request,
+                                'admin/pdfformfiller/document/preview.html',
+                                context
+                                )
+
 
 class PageAdmin(admin.ModelAdmin):
     list_display = ['document', 'name', 'image', 'page_num']
@@ -26,7 +51,6 @@ class PageAdmin(admin.ModelAdmin):
         urls = super(PageAdmin, self).get_urls()
         my_urls = patterns('',
                 url(r'^(?P<pk>.*)/preview/$', self.admin_site.admin_view(self.preview), name='preview'),
-                url(r'^(?P<pk>.*)/json/$', self.admin_site.admin_view(self.json), name='json'),
             )
         return my_urls + urls
 
@@ -40,11 +64,6 @@ class PageAdmin(admin.ModelAdmin):
                                 context
                                 )
 
-    def json(self, request, pk):
-        page = models.Page.get(pk=pk)
-        attribs = ['pos_x', 'pos_y', 'name', 'height', 'width', 'fieldtype', 'page']
-
-
 
 class FormFieldAdmin(admin.ModelAdmin):
     list_display = ['name', 'page', 'fieldtype', 'page_number', 'pos_y']

static/js/pdfformfiller/pdfformfiller.js

@@ -11,7 +11,11 @@
 		Page,
 		Field,
 		PageCollection,
-		FieldCollection;
+		FieldCollection,
+		FieldData,
+		FieldDataCollection,
+
+		DocumentView;
 
 	if (typeof exports !== 'undefined') {
 		PDFFormFiller = exports;
@@ -25,6 +29,12 @@
 		model: Field
 	});
 
+	FieldData = PDFFormFiller.FieldData = Backbone.Model.extend({});
+
+	FieldDataCollection = PDFFormFiller.FieldDataCollection = Backbone.Collection.extend({
+		model: FieldData
+	});
+
 	Page = PDFFormFiller.Page = Backbone.Model.extend({
 		initialize: function (options) {
 			var fields,
@@ -42,16 +52,53 @@
 		fetch: function () {
 			var self = this;
 
-			Backbone.Model.prototype.fetch.apply(this, arguments).then(function () {
+			return Backbone.Model.prototype.fetch.apply(this, arguments).then(function () {
 				var model = self;
 				// Auto-fetch the fields collection
 				if (typeof model.get('fields') !== 'undefined') {
-					model.get('fields').fetch();
+					return model.get('fields').fetch();
 				}
 			});
 		},
 	});
 
+	PageCollection = PDFFormFiller.PageCollection = Backbone.Collection.extend({
+		model: Page
+	});
+
+	Document = PDFFormFiller.Document = Backbone.Model.extend({
+		initialize: function (options) {
+			console.log(options);
+
+			if (typeof options.pages === 'undefined') {
+				this.pages = new PageCollection();
+				this.pages.url = this.url + '../page/';
+			}
+		},
+
+		getPage: function (page_num) {
+			var page_ids = this.get('page_ids'),
+				page_id = page_ids[page_num],
+				page = this.pages.findWhere({id: page_id}),
+				defer = new $.Deferred();
+
+			if (typeof page === 'undefined') {
+				page = new Page();
+				page.url = '/formfiller/api/page/' + page_id + '/';
+				this.pages.add(page);
+				page.fetch()
+					.then(function () {
+						return defer.resolve(page);
+					});
+			} else {
+				defer.resolve(page);
+				return defer.promise();
+			}
+
+			return defer.promise();
+		}
+	});
+
 
 	FieldItemPreviewView = PDFFormFiller.FieldItemPreviewView = Marionette.ItemView.extend({
 		/* template: _.template('<div class="pff-field pff-field-<%= fieldtype %>"><%= name %></div>'), */
@@ -131,5 +178,22 @@
 
 	});
 
+	DocumentView = PDFFormFiller.DocumentView = Marionette.Layout.extend({
+		template: _.template('<div class="buttons"><a class="prev" href="#">prev</a><a href="#">next</a></div><div class="editor"></div>'),
+		regions: {
+			buttons: '.buttons',
+			editor: '.editor'
+		},
+
+		ui:  {
+			next: ':contains("next")',
+			prev: ':contains("prev")'
+		},
+
+		initialize: function (options) {
+			console.log(this.ui.next);
+		}
+
+	});
 
 }).call(this);

templates/admin/pdfformfiller/document/change_form.html

@@ -0,0 +1,8 @@
+{% extends 'admin/change_form.html' %}
+{% load i18n admin_static admin_modify %}
+{% load admin_urls %}
+{% block object-tools-items %}
+<li><a href="{% url 'admin:preview' original.pk|admin_urlquote %}">Preview</a></li>
+{{ block.super }}
+{% endblock %}
+

templates/admin/pdfformfiller/document/preview.html

@@ -0,0 +1,57 @@
+{% extends "admin/base_site.html" %}
+{% load i18n admin_static admin_modify %}
+{% load admin_urls %}
+
+{% block extrahead %}{{ block.super }}
+{{ media }}
+{% endblock %}
+{% block content %}
+
+<style type="text/css">
+	.clearfix:after { content: " "; display: block; height: 0; clear:both, visiblity: hidden; }
+	.clearfix { display: inline-block; _height: 1%; clear: both; }
+	.clearfix { display: block; clear: both; }
+	#pff { max-width: 100%; }
+
+	.pff-field {
+		text-indent: -9999px;
+		white-space: nowrap;
+	}
+	.pff-field:hover {
+	}
+
+	.pff-field-t {
+		background: rgba(0,255,0,0.2);
+	}
+
+	.pff-field-b {
+		background: rgba(0,0,255,0.2);
+	}
+</style>
+
+<script type="text/javascript">
+$(function($) {
+
+
+		/*
+		var page = new PDFFormFiller.Page(),
+			preview = new PDFFormFiller.PagePreviewView({
+				el: $('#pff'),
+				model: page
+		});
+		page.url = '{% url "pdfformfiller_api_document_detail" id=document.id %}';
+		page.fetch();
+		*/
+
+		var doc = new PDFFormFiller.Document({id: {{ document.id }}});
+		doc.url = "{% url 'pdfformfiller_api_document_detail' id=document.id %}";
+		window.doc = doc;
+
+	})
+</script>
+{% url "pdfformfiller_api_document_detail" id=document.id %}
+
+<div id="content-main">
+	<div id="pff"></div>
+</div>
+{% endblock %}

views/api.py

@@ -66,7 +66,9 @@ def document(request):
 
 def document_detail(request, id):
     document = models.Document.objects.get(pk=id)
+    pages = models.Page.objects.filter(document__pk=document.id).values('id','page_num')
     context = extract_fields(document)
+    context['page_ids'] = [p['id'] for p in pages]
     return json_response(context)