Skip to content

Instantly share code, notes, and snippets.

@wsalesky

wsalesky/tinymceExample2.xhtml

Created January 2, 2024 23:54
Show Gist options
  • Save wsalesky/bf6b25b50b082c8f0bd8dcf7e7b1eaf2 to your computer and use it in GitHub Desktop.
Save wsalesky/bf6b25b50b082c8f0bd8dcf7e7b1eaf2 to your computer and use it in GitHub Desktop.
Download ZIP
XSLTForms TinyMCE dynamic content example
Raw
gistfile1.txt
<?xml-model href="http://www.tei-c.org/release/xml/tei/custom/schema/relaxng/tei_ms.rng" type="application/xml" schematypens="http://relaxng.org/ns/structure/1.0" schematypens="http://purl.oclc.org/dsdl/schematron"?>
<TEI xmlns="http://www.tei-c.org/ns/1.0">
<data>
<summary>irec2 Summary 1</summary>
<summary>irec2 Summary 2</summary>
</data>
</TEI>
Raw
tinymceExample2.xhtml
<?xml-stylesheet href="xsl/xsltforms.xsl" type="text/xsl"?><html xmlns="http://www.w3.org/1999/xhtml" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:rte="http://www.agencexml.com/xsltforms/rte" xmlns:xsltforms="http://www.agencexml.com/xsltforms" xmlns:xsd="http://www.w3.org/2001/XMLSchema" lang="en">
<head>
<meta name="viewport" content="initial-scale=1, width=device-width, viewport-fit=cover"/>
<title>TinyMCE Support</title>
<style type="text/css">
.large-textarea textarea {
font-family: Courier, sans-serif;
height: 10em;
width: 500px;
}</style>
<script type="text/javascript" src="/exist/apps/xsltforms/scripts/tinymce_4.7.1/tinymce.min.js" data-uri="http://www.tinymce.com" data-version="4.7.1">/* */</script>
<model xmlns="http://www.w3.org/2002/xforms">
<schema xmlns="http://www.w3.org/2001/XMLSchema" targetNamespace="http://www.agencexml.com/xsltforms/rte">
<simpleType name="standardHTML">
<restriction xmlns:xforms="http://www.w3.org/2002/xforms" xforms:xmlns="http://www.w3.org/2002/xforms" base="xforms:HTMLFragment" xsltforms:rte="TinyMCE"/>
<annotation>
<appinfo> { plugins: [ "advlist autolink lists link image charmap print
preview anchor", "searchreplace visualblocks code fullscreen",
"insertdatetime media table contextmenu paste" ], toolbar: "insertelema
insertelemb | insertfile undo redo | styleselect | bold italic |
alignleft aligncenter alignright alignjustify | bullist numlist outdent
indent | link image", custom_elements: "~elem-a,~elem-b", content_style:
"elem-a {color: red; border-style: solid;} elem-b {color: blue;
border-style: solid;}", valid_elements: "p,i,strong,em,elem-a,elem-b",
setup: function(editor) { function insertElem(gi) { var s = "&lt;" + gi
+ "&gt;" + editor.selection.getContent() + "&lt;/" + gi + "&gt;";
editor.insertContent(s); } editor.addButton("insertelema", { text:
"elem-a", onclick: function() { insertElem("elem-a"); }, tooltip:
"Insert elem-a (red)" }); editor.addButton("insertelemb", { text:
"elem-b", onclick: function() { insertElem("elem-b"); }, tooltip:
"Insert elem-b (blue)" }); } } </appinfo>
</annotation>
</simpleType>
</schema>
<instance id="i-rec">
<data xmlns="http://www.tei-c.org/ns/1.0">
<richtext>&lt;p&gt;Paragraph &lt;i&gt;number one&lt;/i&gt;&lt;/p&gt;</richtext>
<richtext>&lt;p&gt;Paragraph &lt;i&gt;number one&lt;/i&gt;&lt;/p&gt;</richtext>
<summary>Summary 1</summary>
<summary>Summary 2</summary>
</data>
</instance>
<instance id="i-selected">
<data xmlns="http://www.tei-c.org/ns/1.0">
<summary>irec2 Summary 1</summary>
<summary>irec2 Summary 2</summary>
</data>
</instance>
<instance id="main">
<data xmlns="">
<richtext>&lt;p&gt;Paragraph &lt;i&gt;number one&lt;/i&gt;&lt;/p&gt;</richtext>
<richtext>&lt;p&gt;Paragraph &lt;i&gt;number one&lt;/i&gt;&lt;/p&gt;</richtext>
<richtext>&lt;p&gt;Paragraph &lt;i&gt;number one&lt;/i&gt;&lt;/p&gt;</richtext>
</data>
</instance>
<instance id="i-user">
<data xmlns="http://www.tei-c.org/ns/1.0">
</data>
</instance>
<submission id="s-load-template" method="get" action="temp2.xml" ref="instance('i-selected')" replace="instance" instance="i-rec" serialization="none" mode="synchronous">
<!-- <resource value="temp2.xml"/>-->
<action ev:event="xforms-submit-done">
<message level="modeless"> Data Loaded! </message>
</action>
<message level="modeless" ev:event="xforms-submit-error"> Submit error. </message>
</submission>
<bind nodeset="*:summary" type="rte:standardHTML"/>
<bind nodeset="*:richtext" type="rte:standardHTML"/>
</model>
</head>
<body>
<group xmlns="http://www.w3.org/2002/xforms">
<submit class="btn btn-outline-secondary" submission="s-load-template">
<label> Load Selected Record </label>
</submit>
<repeat ref="instance('i-rec')//*:summary">
<textarea ref="." class="large-textarea" mediatype="application/xhtml+xml"/>
</repeat>
<repeat ref="instance('i-rec')//*:richtext">
<textarea ref="." class="large-textarea" mediatype="application/xhtml+xml"/>
</repeat>
</group>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment