docpad: Use partials after rendering? - docpad

I'm building a plugin to generate site-wide menus; the data for these menus comes from scanning the rendered DOM for *.html.md files; but I only use the menu in one place (root of the site).
Plugin currently generates each page's part of this menu in writeBefore, which works fine as I walk the collection, handle each document, and write a file into the partials directory.
But since the docs have all been rendered already by that time, the <%- #partial('foo.html')%> call in my index.html.eco doesn't work unless I run docpad generate twice.
I assumed that if I set renderPasses to a value > 1, then the partials would get picked up on the > 1 pass, but that doesn't happen.
Is there an event I can use that's after an initial render (so there's a DOM to parse) but before partials get rendered?
Thanks.

You could use the renderDocument event (fired for each document, plus for each layout the document has) or the renderAfter event. But I think you may have the same problem.
What specifically is the reasoning of having your menu require the rendered content of other files? As you could use the text plugin to be able to render meta data attributes just the same, and have those meta data attributes accessible before render. E.g.
---
someMarkdown: "<t render="markdown">*hello*</t>"
---
then in your menu or whatever
<ul><% for page in #getCollection('html').toJSON(): %>
<li><%- page.someMarkdown %></li>
<% end %></ul>
And that will work just as expected with the meta data property being rendered with markdown by the text plugin.

Related

Where does the html code live inside an appex page?

I want to update html code of the page inside an apex app but cannot find it. Is there a way to see the HTML code of a page in apex app?
A page typically consists of regions. Regions can be various types (eg a report, a map, a data entry form etc). For many types of region, the majority of the content is generated by APEX itself, hence the term "low code".
But on most of them, you can add static html that appears at the start or end of the region, and there is a region type of "static content" where all of the content is defined by you at design time. Similarly, there is a region where all of the content comes from a PL/SQL procedure, where you are responsible for providing all the relevant HTML as output from that procedure.
Apex consists of html, css (to make it shiny) and javascript. The default css and javascript are stored in static files (check the page source for that) and the html is stored in the database.
The way the html is applied on a page region is by way of a template. Every component in apex (page, region, report, breadcrumb,button, ...) uses a template and that is just an additional property to check in the builder for that component.
To see all the templates in an app go to Shared Components > User Interface > Templates. To see which templates are referenced in a page check 'Page Shared Components' > Templates (in the left pane of the builder).
It is possible to change templates and even create your own - or you could copy one and modify it to your needs (which is easiest). However, to ensure smoother upgrades it is easier to stick with what is available out of the box.

How to show Ckeditor document in read only mode as in edit mode without the editor

How can I show documents created with Ckeditor in read only so that they as much as possible like in the editing mode but without having to create the editor for each message?
In my project users can send messages to each other among many other things and they create the messages using Ckeditor. I would to render message threads in readonly mode without having to create the Ckeditor for each message. Doing that would be slow and would consume a lot of vertical space. Another problem with that approach is that removing the toolbar removes formatting. I would like to just have the messages in div tags and add a class to them and then include Ckeditor css file. Or also acceptable would be to have one element with certain class whose children would get the Ckeditor styles. Before putting the messages in the html response I do whitelisting on the server so the docs are safe to put inside for example a div tag.
I solved this by wrapping the message in an iframe element and added dynamically a style element that links to the Ckeditor style sheet. Now the message gets Ckeditor styles and I don't need to create the editor at all in the read only state and the rest of my page unaffected by the Ckeditor styles.

AngularJS ng-repeat don't see scope variable - in WYSIWYG editor loaded with AJAX?

I'm modifying a website, built with AngularJS, and in one page I have a WYSIWYG editor.
The whole widget that includes the editor, is a div that has 'ng-controller="TextsController"'.
In this div I have a button, clicking on it displays the editor. And the initializing of the editor happens in a directive - "richTextEditor".
So - I'm making a popup in this editor, that has to show some images from the server. I put the code for pulling the images in the controller ... and there I set
$http.get('/url/to/files').success(function(data) {
$scope.imagesFromServer = data;
});
and in the view I have
'ng-repeat="image in imagesFromServer"'
And the problem is that the ngRepeat doesn't see any items.
I have two ideas:
The view, containing the ngRepeat (the HTML for the editor, and the popup with the images as well) loads with AJAX, and at that very moment the scope variable is not set.
I'm initializing the scope variable in the wrong place. (Eventually has to be in the directive instead of the controller? ... but all examples I've seen and done so far - pull every data in the controller, and the view sees it directly.)
Hope I've described the situation clearly.
Thanks in advance.

CKEditor 4.3.2 - injecting DOM?

I am trying to implement CKEditor v4.3.2. The way our product is set up is there are multiple areas of our pages that can be edited - we open an editor in a modal window and use the iframe method for editing. It works great with one exception:
If the page DOM looked something like "body > div#container > div > div#editcontent"
and there was CSS rules targeting that DOM then the CSS does not apply in the editor because the editor DOM is simply "body"
What I would LIKE to do is supply the editor with the HTML DOM Structure of the page that holds the editor so the ContentCSS rules that normally impact the div would still apply (e.g. white background in the div instead of background color from the body tag)
I am at a loss for how to accomplish this.
Thanks!
If you want the content of editor to inherit styles of your page, so a full integration with all the styles applied with every kind of selector, then you would have to use inline editing. Only inline editing offers that.
When using classic editor (the one using iframe) you still have an option though. It's the config.bodyClass setting which lets you assign a class to the body element into which contents is loaded. Then, if all your contents styles selectors starts with that class and a stylesheet is loaded using the config.contentsCss setting, the content inside editor will look similarly to your final page.

how to disable tag validation in ckeditor?

CKeditor apparently automatically creates matching end tags when you enter a start tag. Is there a way to turn this behavior off?
I have a situation where I am creating two blocks of text in an admin program using CKeditor, then I'm using these to paint a page with the first block, some static content, and then the second block. Now I've got a case where I want to wrap the static content in a table. I was thinking, No problem, I'll just put the <table> tag in the first block and the </table> tag in the second block, and the static content will be inside the table. But no, CKeditor insists on closing the table tag in the first block.
In general, I can go to source mode and enter HTML directly, but CKeditor then decides to reformat my tagging. This seems to rather defeat the purpose of having a source mode. (I hate it when I tell the computer what I want and it tells me, No, you're wrong, I know better than you what you want!)
CKEditor produces valid HTML. Valid HTML has to include both - start and end tags. There's no way to change this behaviour without hacking editor. Note that even if you'll force editor to produce content without one of these tags it will then try to fix this and won't do this as you expect. E.g. load:
<p>foo</p></td></tr></table>
And you'll completely loose this table so only regexp based fix on data loading could help. In the opposite case:
<table><tr><td><p>foo</p>
You'll end up with paragraph wrapped with table, so it's better. But what if someone would remove this table from editor contents?
Therefore you should do this integration outside editor - prepend table to contents of one editor and append to contents of second one. You simply cannot force editor to work on partial HTML.

Resources