Input code in TinyMCE - symfony1

I'm using TinyMCE on my blog and it seems to be removing the code I'm trying to paste.
I want to add this:
<Files somefile.png>
DefaultType application/x-httpd-php
</Files>
(it's a .htaccess directive)
This gets saved ok (as < and > in the html), but when I reopen my form for editing, it gets transformed as :
DefaultType application/x-httpd-php
Edit : I'm using TinyMCE in a Symfony form, using sfFormExtraPlugin.
Edit 2 : I tried verify_html: false ....
now my code gets transformed as :
<p><files exec="" jpg=""><br /> DefaultType application/x-httpd-php<br /></files></p>
Edit 3: My tinyMCE config is :
tinyMCE.init({
mode: "exact",
elements: "content_contents",
theme: "advanced",
width: "500px",
height: "400px",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "bottom",
theme_advanced_resizing: true
,
language : "fr",
convert_urls : false,
verify_html : false
});

I responded to this on the TinyMCE MoxieCode forums topic that was also opened by #Manu however I wanted to update this topic with my thoughts as well.
If I understand #Manu correctly, the problem is that the HTML source, while saving with &lt and &gt correctly is being interpreted as < and > when reloaded into TinyMCE.
If this is the case, then I believe the problem is that the Symphony plugin isn't encoding the HTML content prior to populating the TextArea that TinyMCE replaces. In other words, it leaves &lt when it should be loading &amplt; so tinyMCE receives &lt

What are you doing to the input when putting it back in to TinyMCE? If you're converting it to HTML or anything TinyMCE will clean it up as it's invalid HTML.
As a work around/experiment you could add File in the custom_elements option in your init.
Update As you are accepting all sorts of code, you will probably have to turn off clean up altogether. Put cleanup: false in the config. If I were you I would implement your own custom formatting (like Stack/overflow does) and generate bold, underline, links etc formatting because it will give you a lot more control over the HTML generation, ie you could just print out everything exactly how it is (with escaping), and then turn the pre-defined symbols to <strong> tags, or what ever. This is be far the easiest way of generating safe, accurate HTML output, and in your case, probably the only way.
You would not want to use TinyMCE is this case...

That is because the invalid HTML gets removed (the tinymce cleanup functionality).
A workaround could be to initialize tinymce using the cleanup paramter:
cleanup: false,
I suggest you have a closer look at the tinymce initialization parameters
custom_elements
valid_elements
and
cleanup

replace your < and >
< becomes: <
> becomes: >

Try including
extended_valid_elements : "Files[]",
In your config. It's used to unlock certain html tags like iframe. In the brackets you usually put the allowed options for the tag (like [src|alt|id]) so I'm not sure what to put there for your example ...

the correct answer to your problem, tested by me and 100% working is to wrap your variable into htmlspecialchars in php like this example:
htmlspecialchars($myText)

Related

Adding Jquery UI to XSLTForms

I was trying to add JQuery UI functionality and styling but I'm having problems with the CSS file. I use to attach a lot of libraries to XSLTForms files, but I really can't make it load. I already put the and tags inside the CSS file, as I use to do with other CSS files, but with no success.
Any idea what could be wrong? Functionality is OK, because Y can make it appear a dialog, but with no style. I copied the source code in a new file and change it to html (replacing the XForms tahgs with HTML ones) and everything worked ok. So I think there is something with XSLTForms.
<xf:trigger id="showDialog">
<xf:label>Show dialog!</xf:label>
<xf:load ev:event="DOMActivate" resource="javascript:
var dialog = document.createElement('div');
dialog.innerHTML = 'Your modal dialog';
$(dialog).dialog({
autoOpen: true,
modal: true,
title: 'Attention',
open: function(){
$('.ui-widget-overlay').bind('click',function(){
$(dialog).dialog('close');
})
}
});
"/>
</xf:trigger>
I also unsuccessfully tryed to load this way:
<style type="text/css">
#import url('res/jquery-ui.css');
</style>
XSLTForms requires CSS files to be XML Well-formed.
This option can be disabled including this processing instruction in your XForms:
<?css-conversion no?>
Take a look to this XSLTForms Wikibook article
This particular file had something than others don't: CSS comments. Just remove comments or make it as in the XML way (<!-- A comment! -->).
But for some reason, any image referenced is not loaded...

Can I tell HTML agility pack to NOT fix some types of invalid markup?

I have HTML agility pack modifying some of my html within the umbraco CMS, however umbraco uses some non-standard html-oid (See below)
The problem is after the html agility pack replaces the closing slash with a question mark.
macro tag before html agility pack:
<?UMBRACO_MACRO macroAlias="RandomMacroTest" />
macro tag after html agility pack:
<?umbraco_macro macroalias="RandomMacroTest"?>
Any clues how I could get around this? Tell Html Agility pack to ignore this tag? I've looked at it's various options and none of them seem to apply.
Last resort: to go back and re-fix the macro tags with a regex replace, but that seems a bit messy.
Enable the OptionWriteEmptyNodes option on the document. It should preserve that tag.
var htmlStr = #"<?UMBRACO_MACRO macroAlias=""RandomMacroTest"" />";
var doc = new HtmlDocument
{
OptionOutputOriginalCase = true,
OptionWriteEmptyNodes = true,
};
doc.LoadHtml(htmlStr);
doc.Save(Console.Out);
You will have the output:
<?UMBRACO_MACRO macroalias="RandomMacroTest" />

TinyMCE do not auto convert a URL into a link on Paste

When I paste a URL into a TinyMCE editor it converts the text into a link.
So http://vimeo.com/18150336 would be come http://vimeo.com/18150336. I would like to keep the plain text. Is their a way to configure TinyMCE to keep the link as plain text.
I do not want to strip out tags as adding a hyperlinks should be an option on the toolbar. It should just not happen by default.
You can use the paste plugin and the setting paste_preprocessing in order to keep the plain text. You might need to check inside the function specified using paste_preprocessing if you got a link or not.
It's been 5 years, So I'm probably using a newer version of TinyMCE, anyway this solution worked for me, Just add this option:
paste_preprocess: function(plugin, args) {
args.content += ' ';
}
So when you initialize the tinymce, it should be something like this:
tinymce.init({
selector: "textarea", // change this value according to your HTML
plugins: "paste",
paste_preprocess: function(plugin, args) {
args.content += ' ';
}
});
This is the page of documentation for TinyMCE V4
It is the TinyMCE plugin autolink which is responsible for automatically creating links on paste. (And write).
https://www.tiny.cloud/docs/plugins/opensource/autolink/

Mantis bugnotes formatting

Is it possible to format bugnotes(comments) entered in Mantis bug tracker for an issue ?
I am using Mantis v1.0.8
e.g.
"sample mantis bug notes"
which appears as plain text.
I would like to make it bold or to display in different color
e.g. similar to https://stackoverflow.com/editing-help
does any other bug tracking system allow such feature ?
As it was said by Gawcio and mhu, the list is limited and in current mantis 1.2.15 use of following tags is allowed in description and other multi-line fields: <p>, <li>, <ul>, <ol>, <br>, <pre>, <i>, <b>, <u>, <em>, <strong>.
Additionally, following tags are allowed in summary and other single-line fields (e.g. OS or Platform): <i>, <b>, <u>, <em>, <strong>. That's funny to have some emphasis in issue summary, right? :)
What is not explicitly said, is that these lists are customizable. Unfortunately, they are so-called global settings, so they can't be set using web interface, but if you have a possibility of tweaking the installed mantis code, you can modify the <mantis-doc-root>/config_inc.php file (which is purposed to be modified locally) and add following options there:
/**
* These are the valid html tags for multi-line fields (e.g. description)
* [...]
*/
$g_html_valid_tags = 'p, li, ul, ol, br, pre, i, b, u, em, strong, code';
/**
* These are the valid html tags for single line fields (e.g. issue summary).
* [...]
*/
$g_html_valid_tags_single_line = 'i, b, u, em, strong, code';
After server restart, you should be able to use the <code> tag in summary and description of your issues.
Unfortunately, mantis tags filters seem to disallow any tag attributes, so it won't be easy to allow free formatting. Personally, I have adjusted its style sheet to tweak the colour in which content of <pre> and <code> tags is displayed. To achieve it, you can edit the <mantis-doc-root>/css/default.css` file and add/adjust following rules:
pre { margin-top: 0px; margin-bottom: 0px; color: #0000CC; }
code { color: #0000CC; }
em > strong { color: #CC0000; }
This way your report may gain some colours :)
In Mantis one can use some of HTML tags (unfortunately not all are supported). From my experience (as I remember well) I've successfully used: <B>, <I>, <U>, <S> and lists, both ordered <OL><LI> and unordered (bullets): <UL><LI>. It makes notes and descriptions more readable.
Currently I'm using 1.1.8 version of Mantis but I was successfully using it in older version (prior to 1.0) - so yours should also handle that.
Overwrite Mantis (ver.<1.3) default configuration by using your personal config_inc.php file under <mantis-doc-root>/config/config_inc.php
You can overwrite all default settings in this config file. E.g. $g_html_valid_tags, $g_bug_view_page_fields, ... Just copy/paste the default values from <mantis-doc-root>/config_defaults_inc.php to your <mantis-doc-root>/config/config_inc.php file.

Sphinx, reStructuredText show/hide code snippets

I've been documenting a software package using Sphinx and reStructuredText.
Within my documents, there are some long code snippets. I want to be able to have them hidden as default, with a little "Show/Hide" button that would expand them (Example).
Is there a standard way to do that?
You don't need a custom theme. Use the built-in directive container that allows you to add custom css-classes to blocks and override the existsting theme to add some javascript to add the show/hide-functionality.
This is _templates/page.html:
{% extends "!page.html" %}
{% block footer %}
<script type="text/javascript">
$(document).ready(function() {
$(".toggle > *").hide();
$(".toggle .header").show();
$(".toggle .header").click(function() {
$(this).parent().children().not(".header").toggle(400);
$(this).parent().children(".header").toggleClass("open");
})
});
</script>
{% endblock %}
This is _static/custom.css:
.toggle .header {
display: block;
clear: both;
}
.toggle .header:after {
content: " ▶";
}
.toggle .header.open:after {
content: " ▼";
}
This is added to conf.py:
def setup(app):
app.add_css_file('custom.css')
Now you can show/hide a block of code.
.. container:: toggle
.. container:: header
**Show/Hide Code**
.. code-block:: xml
:linenos:
from plone import api
...
I use something very similar for exercises here: https://training.plone.org/5/mastering-plone/about_mastering.html#exercises
You can use the built-in HTML collapsible details tag by wrapping the code in two raw HTML directives
.. raw:: html
<details>
<summary><a>big code</a></summary>
.. code-block:: python
lots_of_code = "this text block"
.. raw:: html
</details>
Produces:
<details>
<summary><a>big code</a></summary>
<pre>lots_of_code = "this text block"</pre>
</details>
I think the easiest way to do this would be to create a custom Sphinx theme in which you tell certain html elements to have this functionality. A little JQuery would go a long way here.
If, however you want to be able to specify this in your reStructuredText markup, you would need to either
get such a thing included in Sphinx itself or
implement it in a Sphinx/docutils extension...and then create a Sphinx theme which knew about this functionality.
This would be a bit more work, but would give you more flexibility.
There is a very simplistic extension providing exactly that feature: https://github.com/scopatz/hiddencode
It works rather well for me.
The cloud sphinx theme has custom directive html-toggle that provides toggleable sections. To quote from their web page:
You can mark sections with .. rst-class:: html-toggle, which will make the section default to being collapsed under html, with a “show section” toggle link to the right of the title.
Here is a link to their test demonstration page.
sphinx-togglebutton
Looks like a new sphinx extension has been made to do just this since this question has been answered.
Run: pip install sphinx-togglebutton
Add to conf.py
extensions = [
...
'sphinx_togglebutton'
...
]
In rst source file:
.. admonition:: Show/Hide
:class: dropdown
hidden message
since none of the above methods seem to work for me, here's how I solved it in the end:
create a file substitutions.rst in your source-directory with the following content:
.. |toggleStart| raw:: html
<details>
<summary><a> the title of the collapse-block </a></summary>
.. |toggleEnd| raw:: html
</details>
<br/>
add the following line at the beginning of every file you want to use add collapsible blocks
..include:: substitutions.rst
now, to make a part of the code collapsible simply use:
|toggleStart|
the text you want to collapse
..code-block:: python
x=1
|toggleEnd|
Another option is the dropdown directive in the sphinx-design extension. From the docs:
Install sphinx-design
pip install sphinx-design
Add the extension to conf.py in the extensions list
extensions = ["sphinx_design"]
Use the dropdown directive in your rst file:
.. dropdown::
Dropdown content

Resources