I'm trying to "upload" an html-converted .docx file into a CKEditor. So far, the convertion from .docx to html is nearly perfect and I'm able to pass the code from Java(Spring/Maven) to my webapp(ZK framework, using native CKEditor and JavaScript).
The problems I've had so far revolve around the fact that the loaded text is either half-formatted or not formatted at all, and that's the actual reason I'm working in this (To avoid loss of format present by copy-pasting). I've managed to find the reason of this behaviour: CK likes HTML tags OR won't use multiple styles per container (ie. style="font-weight: bold" is Ok, but style="font-style: italic; font-weight: bold" isn't, it will pick one or another) and Docx4j uses inline styling for formating because of XHTML (As far as I've read).
After that I tried to force the styles in CKEditor by the config file, but that wasn't the solution as one element will overwrite the another, resulting in only one style being used.
With all that, I decided to manipulate a test docx (It's literally a "hello world" line bold, with italics and underline), converted it and forced the tags b, i and u on the resulting HTML file through Java. The result was the desired one.
Now my focus is to config docx4j so it uses tags instead of inline css, as so far it's the "easiest" solution and I liked the resulting html from it. After reasing some more I came across an old class with a method that (by name) will do that, but it's not present in my imported library. I tried both, new and old methods to convert to html but the results are the same.
Is there a setting or a way to let docx4j (v8.2.3 reference) know that I want html tags instead of css styles? I've seen the examples and looked into the javadoc, but it's a bit outdated and didn't really helped me that much. This seems to be the only way to do this, or build my own parser, which is simply not an option due time constraints.
Thanks!
Related
I'm using CKEditor 5 on my website in order to allow users to generate PDF templates for their company.
My issues is, that once I take the data out of the ckEditor, every styled element has a class="CSS-Class-Here", which is problematic due to the fact that when I convert the HTML contents of the CKEditor to PDF, the PDF doesnt know any of these classes.
Is there any way to get CKEditor to save these classes as inline styles?
I know that its possible to create a plugin for a specific element for a specific style, but I want everything to act this way, not something specific.
Also, It's impossible to just inject the styles into the PDF itself, due to the fact that ckEditor keeps their styles in javascript functions and creates them on demand.
For example:
Yellow highlighted text comes out as:
<mark class="" marker-yellow "">Random Text</mark>
I would like it to come out as:
<mark style="background: yellow">Random Text</mark>
Meaning that the style that's present in the marker-yellow class should be applied inline directly to the element itself.
At my company, for templates for Vue.js, we write components in separate Blade files. The problem I have is that HTML code is not highlighted in those files. Whole HTML code is written inside script tags which has the syntax:
<script type="x/templates" id="nameOfComponent">.
By deleting the type attribute, highlighting starts working correctly. I have searched a little bit and found that there are different types, but I have never seen one like the one above (the closest one I saw is text/x-template and highlighting works with it). Now, as I am not allowed to change these kinds of things, I have a couple of questions (also, I have to mention I'm new to JavaScript and PHP):
If this is not predefined type, are user-defined types supported?
If so, is there any extension for VS code which would highlight HTML part of the code?
If user-defined types are not the right solution, which one would be the best solution for me?
try:
https://github.com/vuejs/vetur
Pretty sure it should support vue template syntax highlighting.
Simple blog in Django (1.11.7 - Python3) in which I have impemented the Markdownx plugin. The plugin works for most of the markdown in preview in my 'edit_article' page, and in the normal view where users can read an article. BUT some of the markup isn't working in either:
Not working:
blockquotes using >
headers using one or more # or _
double-space and carriage return doesn't add a line-break
Links, images, numbered lists, emphasis and bold etc all work.
I posted my markdown in here, but of course it all worked here...
Don't really have any code to post, because most things work, so I'm guessing there isn't any problem with my model/view etc.
Anyone experienced this?
# So, let's try a header
doesn't work, neither does
> this type of blockquote
but they shoud produce
So, lets try a header
and
this type of blockquote
So I found the answer to this myself. I am using a CSS framework that resets the styling on the 'broken' markup tags. Until I add back the framework's CSS classes to the H1-H6 tags for example, the reset makes all headers appear as plain text.
So I have to add some custom CSS to the css framework's styling for those tags that are being overridden, or use html in the textarea in the form which should also work.
whether it be ckeditor themes, or codesnippet themes, where are the actual string values to pass as arguments to the config options? I'm having trouble finding the actual string values, or something pointing to the convention/pattern the value follows.
The ckeditor documentation is huge, and the links send you around in circles, referring you to generic documentation pages, but either the actual string values for possible arguments are not available.
the one example for plugins follows all lower case, no separation between words.
the highlight js themes that ckeditor requires seems to be snake case, but some are inconsistent and not working.
For instance, I'm looking to find values for
<script>
CKEDITOR.replace( 'editor1', {
skin: 'kama',
codeSnippet_theme:'tomorrow_night_dark'
} );
</script>
http://cdn.ckeditor.com/4.4.7/full-all/plugins/codesnippet/lib/highlight/styles/
A link to to this in the ckeditor documentation would help, with a short liner saying to copy the file name excluding the paths and the file type suffixes.
reference the file name without the .css suffix to get the correct string format for the codeSnippet_theme,
the files are named inconsistently.
you might think you need
'atelier_forest_dark', since 'school_book' works, but it's actually
'atelier-forest.dark'
It's also
'tomorrow-night-bright'
hybrid, which is available from the demos is not available from this list of CDN files hosted by ckeditor.
Is there any way to fetch the raw contents of a CSS file?
Lets imagine that I wanted to fetch any vendor-specific css properties from a CSS file. I would need to somehow grab the CSS contents and parse them accordingly. Or I could just use the DOM to access the rules of a CSS file.
The problem is that in while using the DOM, mostly all browsers (except for <= IE8) tend to strip out all of the custom properties that do not relate to their browser engine (webkit strips out -moz and -o and -ms). Therefore it wouldn't be possible to fetch the CSS contents.
If I were to use AJAX to fetch the contents of the CSS file, then if that CSS file hosted on another domain, then the same origin policy would break and the CSS contents could not be fetched.
If one were to use a cross-domain AJAX approach then there would only be a JSONP solution which wouldn't work since we're not parsing any javascript code (therefore there is no callback).
Is there any other way to fetch the contents?
If a CSS file is on the same domain as the page you're running the script on, you can just use AJAX to pull in the CSS file:
$.get("/path/to/the.css", function(data) {/* ... */});
If not, you could try using Yahoo! Pipes as a proxy and get the CSS with JSONp.
As for parsing, you can check out Sizzle to parse the selectors. You could also use the CSS grammar (posted in the CSS standards) to use a JS lex/yacc parser to parse out the document. I'll leave you to get creative with that.
Good luck!
No, you've pretty much covered it. Browsers other than IE strip out unknown rules from their object models both in the style/currentStyle objects and in the document.styleSheets interface. (It's usually IE6-7 whose CSS you want to patch up, of course.)
If you wanted to suck a stylesheet from an external domain you would need proxy-assisted-AJAX. And parsing CSS from would be a big nasty job, especially if you needed to replicate browser quirks. I would strenuously avoid any such thing!
JSONP is still a valid solution, though it would hurt the eyes somewhat. Basically, in addition to the callback padding, you would have to add one JSON property "padding" and pass the CSS as a value. For example, a call to a script, http://myserver.com/file2jsonp/?jsonp=myCallback&textwrapper=cssContents could return this:
myCallback("cssContents":"body{text-decoration:blink;}\nb{text-size:10em;}");
You'd have to text-encode all line breaks and wrap the contents of the CSS file in quotes (after encoding any existing quotes). I had to resort to doing this with a Twitter XML feed. It felt like such a horrible idea when I built it, but it did its job.