{% extends "pylucid/css_anchor_div.html" %}


{% block plugin_content %}

{% extrahead %}
<style type="text/css"><!--
{% if not preview_html %}
{# Hide preview div only, if no preview html content exist. #}
#preview_fieldset {
  display: none;
}
{% endif %}
#ajax_preview { /* hide Ajax preview button and unhide it with JS */
  display: none;
}
textarea {
  display:block;
  margin-bottom:0pt;
  min-height: 300px;
  height: 20%;
}
--></style>
{% if pagecontent.markup == 1 %}{# current markup is HTML+Editor #}
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}PyLucid/jwysiwyg/jquery.wysiwyg.css"  onerror="JavaScript:alert('Error loading file ['+this.href+'] !');" />
<script type="text/javascript" src="{{ STATIC_URL }}PyLucid/jwysiwyg/jquery.wysiwyg.js" onerror="JavaScript:alert('Error loading file ['+this.src+'] !');"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
  log("init wysiwyg");
  $('#id_content').wysiwyg({
    controls: {
      html         : { visible : true }
    }
  });
});
</script>
{% endif %}
<script type="text/javascript">
var textarea_changed = false;

jQuery(document).ready(function($) {
    log("edit_inline_form.html ready.");

	  // remove old page_msg, if exist
	  $("#page_msg").slideUp();

    $("#ajax_preview").show(); // unhide ajax preview button

    $("#edit_page_form").change(function() {
        log("edit page form change");
        textarea_changed = true;
    });
    $("#edit_page_form").keypress(function() {
        log("edit page form keypress");
        textarea_changed = true;
    });
    $("#edit_page_form").bind('submit', function() {
        log("submit: set textarea_changed = false");
        textarea_changed = false;
        // $("#preview_fieldset").slideUp("slow");
        $("#edit_page_form").before('<h2 class="ajax_msg">{% trans "submit" %}...</h2>');
    });

    // $(window).bind('beforeunload', function() {
    // ^ this doesn't work!
    window.onbeforeunload = function() {
        log("beforeunload evend called. textarea_changed:" + textarea_changed);
        if (textarea_changed == true) {
            return "{% trans "Textarea has been changed! Changes are not saved if you leave." %}";
        }
    }

    // from media/PyLucid/pylucid_js_tools.js
    // pylucid_ajax_form_view('#edit_page_form');
    replace_openinwindow_links();

    var preview_div = $("#edit_page_preview");

    $("#ajax_preview").click(function() {
        log("ajax preview clicked");
        {# It's important here to add a class in h2 tag to make it invisible for the headline ancor! #}
        $("#edit_page_preview").html('<h2 class="ajax_msg">{% trans "loading" %}...</h2>');
        $("#preview_fieldset").slideDown();

        var content = $("#id_content")[0].value;

        var url = encodeURI("{{ preview_url }}");
        log("post:" + url);
        log("content:" + content);

        $.post(url, { "content": content, "preview": true }, function(form_html){
            preview_div.html(form_html);
        });
    });
    $("#submit_preview").hide();

    $("#abort_button").click(function() {
        {% comment %}
        // How can we here give a feedback and remove it on a window.onbeforeunload abort ?
        // $("#edit_page_form").before('<h2 class="ajax_msg">{% trans "abort" %}...</h2>');
        {% endcomment %}
        self.location.href='{{ abort_url }}';
    });
});
</script>
{% endextrahead %}

<fieldset id="preview_fieldset">
<legend>{% trans 'Preview' %}</legend>
<div id="edit_page_preview">{{ preview_html }}</div>
</fieldset>

<fieldset>
<legend>
    {% trans 'Edit the CMS page' %} '<strong>{{ pagemeta.get_title|escape }}</strong>'
</legend>
<form action="{{ form_url }}" method="post" id="edit_page_form">
{% csrf_token %}
 <div class="helper_buttons">
     <input type="submit" name="save" value="{% trans 'save' %}" />
     <input type="submit" id="submit_preview" name="preview" value="{% trans 'markup preview' %}" />
     <button type="button" id="ajax_preview" title="{% trans 'markup preview' %}">
         {% trans 'markup preview' %}
     </button>
     <input type="button" id="abort_button" name="abort" value="{% trans 'abort' %}" />
     <a href="{% url PageAdmin-page_list %}?markup_id={{ pagecontent.markup }}" class="openinwindow" title="{% trans 'List of all pages for creating links' %}">
         <button type="button" class="button">{% trans 'page list' %}</button>
     </a>
     <a href="{% url PageAdmin-tag_list %}" class="openinwindow" title="{% trans 'List of all available PyLucid template tags' %}">
         <button type="button" class="button">{% trans 'tag list' %}</button>
     </a>

     <a href="{% url PageAdmin-markup_help %}?markup_id={{ pagecontent.markup }}" class="openinwindow" title="{% trans 'Markup help' %}">
         <button type="button" class="button">{% trans 'markup help' %}</button>
     </a>
 </div>
{% with edit_page_form as form %}
    {% include "admin/pylucid/includes/pylucid_formset.html" %}
{% endwith %}
</form>
</fieldset>
{% endblock %}