<%--
    Document   : composition
    Created on : Jul 31, 2013, 1:59:50 PM
    Author     : Joos Kiener <Joos.Kiener@gmail.com>
--%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<jsp:include page="/WEB-INF/jsp/header.jsp"/>
<script type="text/javascript" language="javascript" src="<c:url value="/resources/js/jsme/jsme.nocache.js"/>"></script>
<script type="text/javascript">
function jsmeOnLoad() {
    jsmeApplet = new JSApplet.JSME("structureEditor", {
        //optional parameters
        "options" : "noquery"
    });
    document.JME = jsmeApplet;
}

$(function() {
    $("#composition").submit(function() {
        var smiles = document.JME.smiles();
        document.getElementById('structure').value = smiles;
    });
});


</script>

<!-- Surrounding div required. JSME messes up html...
    Without it the structureEditor div will include the form and the
    editor will be drawn below the search button.
-->
<h3>Add Composition</h3>
<div>
    <div id="structureEditor"/>
</div>

<form:form commandName="composition" class="cssform" method="post">
    <div>
        <label>Percentage</label>
        <form:input path="percentage" />
    </div>
    <div>
        <label>Add another Composition?</label>
        <input type="checkbox" name="addAnother" value="true">
    </div>
    <input type="hidden" id="structure" name="structure">
    <div class="buttons"><input id="saveButton" class="save" type="submit" value="Add Composition"/></div>
</form:form>
<div class="message">For salts draw the complete salt into the structure field: eg. Na+ Cl-</div>
<jsp:include page="/WEB-INF/jsp/footer.jsp"/>