elegant preview now only available for non-IE because jquery can't adequately talk to child windows in IE.

This commit is contained in:
Dave Cranwell 2014-06-20 17:24:27 +01:00
parent b8c0594fdf
commit e1155c32ef
5 changed files with 74 additions and 40 deletions

View file

@ -331,36 +331,65 @@ $(function() {
/* Set up behaviour of preview button */
$('.action-preview').click(function(e) {
e.preventDefault();
$this = $(this);
var previewWindow = window.open($(this).data('placeholder'), $(this).data('windowname'));
$.ajax({
type: "POST",
url: $(this).data('action'),
data: $('#page-edit-form').serialize(),
success: function(data, textStatus, request) {
if (request.getResponseHeader('X-Wagtail-Preview') == 'ok') {
previewWindow.document.open();
previewWindow.document.write(data);
previewWindow.document.close();
} else {
previewWindow.close();
document.open();
document.write(data);
document.close();
}
},
error: function(xhr, textStatus, errorThrown) {
/* If an error occurs, display it in the preview window so that
we aren't just showing the spinner forever. We preserve the original
error output rather than giving a 'friendly' error message so that
developers can debug template errors. (On a production site, we'd
typically be serving a friendly custom 500 page anyhow.) */
previewWindow.document.open();
previewWindow.document.write(xhr.responseText);
previewWindow.document.close();
var previewWindow = window.open($this.data('placeholder'), $this.data('windowname'));
if(/MSIE/.test(navigator.userAgent)){
submitPreview.call($this, false);
} else {
previewWindow.onload = function(){
submitPreview.call($this, true);
}
});
}
function submitPreview(enhanced){
$.ajax({
type: "POST",
url: $(this).data('action'),
data: $('#page-edit-form').serialize(),
success: function(data, textStatus, request) {
if (request.getResponseHeader('X-Wagtail-Preview') == 'ok') {
var pdoc = previewWindow.document;
if(enhanced){
var frame = pdoc.getElementById('preview-frame');
frame = frame.contentWindow || frame.contentDocument.document || frame.contentDocument;
frame.document.open();
frame.document.write(data);
frame.document.close();
var hideTimeout = setTimeout(function(){
pdoc.getElementById('loading-spinner-wrapper').className += 'remove';
clearTimeout(hideTimeout);
}) // just enough to give effect without adding discernible slowness
} else {
pdoc.open();
pdoc.write(data);
pdoc.close()
}
} else {
previewWindow.close();
document.open();
document.write(data);
document.close();
}
},
error: function(xhr, textStatus, errorThrown) {
/* If an error occurs, display it in the preview window so that
we aren't just showing the spinner forever. We preserve the original
error output rather than giving a 'friendly' error message so that
developers can debug template errors. (On a production site, we'd
typically be serving a friendly custom 500 page anyhow.) */
previewWindow.document.open();
previewWindow.document.write(xhr.responseText);
previewWindow.document.close();
}
});
}
});
});

View file

@ -11,5 +11,6 @@
<div id="loading-spinner-wrapper">
<div id="loading-spinner"></div>
</div>
<iframe id="preview-frame" src="{% url 'wagtailadmin_pages_preview_loading' %}"></iframe>
</body>
</html>

View file

@ -1,10 +1,7 @@
<!doctype html>
{% load compress %}
<!--[if lt IE 7]> <html class="no-js ie lt-ie9 lt-ie8 lt-ie7" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie lt-ie9 lt-ie8" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie lt-ie9" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <![endif]-->
<!--[if IE 9]> <html class="no-js ie lt-ie10" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="no-js" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <!--<![endif]-->
<!--[if lt IE 9]> <html class="no-js ie lt-ie9" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <![endif]-->
<!--[if IE 9]> <html class="no-js ie lt-ie10" lang="{{ LANGUAGE_CODE|default:"en-gb" }}"> <![endif]-->
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

View file

@ -50,6 +50,7 @@ urlpatterns += [
url(r'^pages/(\d+)/edit/preview/$', pages.preview_on_edit, name='wagtailadmin_pages_preview_on_edit'),
url(r'^pages/preview/$', pages.preview, name='wagtailadmin_pages_preview'),
url(r'^pages/preview_loading/$', pages.preview_loading, name='wagtailadmin_pages_preview_loading'),
url(r'^pages/(\d+)/view_draft/$', pages.view_draft, name='wagtailadmin_pages_view_draft'),
url(r'^pages/(\d+)/add_subpage/$', pages.add_subpage, name='wagtailadmin_pages_add_subpage'),

View file

@ -25,14 +25,16 @@ def index(request, parent_page_id=None):
pages = parent_page.get_children().prefetch_related('content_type')
# Get page ordering
ordering = request.GET.get('ordering', 'title')
if ordering not in ['title', '-title', 'content_type', '-content_type', 'live', '-live', 'ord']:
if 'ordering' in request.GET:
ordering = request.GET['ordering']
if ordering in ['title', '-title', 'content_type', '-content_type', 'live', '-live']:
pages = pages.order_by(ordering)
else:
ordering = 'title'
# Pagination
if ordering != 'ord':
pages = pages.order_by(ordering)
p = request.GET.get('p', 1)
paginator = Paginator(pages, 50)
try:
@ -177,7 +179,6 @@ def create(request, content_type_app_name, content_type_model_name, parent_page_
'parent_page': parent_page,
'edit_handler': edit_handler,
'display_modes': page.get_page_modes(),
'form': form, # Used in unit tests
})
@ -263,7 +264,6 @@ def edit(request, page_id):
'edit_handler': edit_handler,
'errors_debug': errors_debug,
'display_modes': page.get_page_modes(),
'form': form, # Used in unit tests
})
@ -420,6 +420,12 @@ def preview(request):
"""
return render(request, 'wagtailadmin/pages/preview.html')
def preview_loading(request):
"""
This page is blank, but must be real HTML so its DOM can be written to once the preview of the page has rendered
"""
return HttpResponse("<html><head><title></title></head><body></body></html>")
@permission_required('wagtailadmin.access_admin')
def unpublish(request, page_id):
page = get_object_or_404(Page, id=page_id)