Using Confluence REST API to create a table that sorts - confluence

I can create simple tables in Confluence using their existing API. It works great. This might be asking a lot, but one thing it doesn't do is sort like tables that are created in Confluence through the wysiwyg editor.
For example, I copy the HTML for a table from a hand-made Confluence document, and then create a new document using their api. I stick this html into the document:
myHtml = '<div class="table-wrap"><table class="confluenceTable tablesorter tablesorter-default stickyTableHeaders" style="padding: 0px;"><thead class="tableFloatingHeaderOriginal"><tr class="tablesorter-headerRow"><th class="confluenceTh sortableHeader tablesorter-headerAsc" data-column="0" tabindex="0" unselectable="on"><div class="tablesorter-header-inner">testcol</div></th><th class="confluenceTh sortableHeader" data-column="1" tabindex="0" unselectable="on"><div class="tablesorter-header-inner"> </div></th><th class="confluenceTh sortableHeader" data-column="2" tabindex="0" unselectable="on"><div class="tablesorter-header-inner"> </div></th></tr></thead><thead class="tableFloatingHeader" style="display: none;"><tr class="tablesorter-headerRow"><th class="confluenceTh sortableHeader" data-column="0" tabindex="0" unselectable="on"><div class="tablesorter-header-inner">testcol</div></th><th class="confluenceTh sortableHeader" data-column="1" tabindex="0" unselectable="on"><div class="tablesorter-header-inner"> </div></th><th class="confluenceTh sortableHeader" data-column="2" tabindex="0" unselectable="on"><div class="tablesorter-header-inner"> </div></th></tr></thead><tbody><tr><td class="confluenceTd">q</td><td class="confluenceTd"> </td><td class="confluenceTd"> </td></tr><tr><td class="confluenceTd">r</td><td class="confluenceTd"> </td><td class="confluenceTd"> </td></tr></tbody></table></div>'
curl -u username:password -X POST -H 'Content-Type: application/json' -d'{"type":"page","ancestors":[{"type":"page","id":6358857}],"title":"new page 4","space":{"key":"~theuser"},"body":{"storage":{"value":myHtml,"representation":"storage"}}}' https://confluence.macsales.com/rest/api/content/ | python -mjson.tool
Everything looks great, except the table will not sort. I did notice some of the tags like 'data-column="2"' were stripped from the HTML. Is there a way to not strip these tags?
I saw another posts that suggests using Confluence CLI instead, but this technique is working just fine so far. It would just be nice to be able to sort.

It was a silly mistake on my part. I was copying the html that was generated post-rendering instead of the html source. By using Confluence's classes, sorting works:
<table class="confluenceTable"><tbody><tr><th class="confluenceTh">test321</th><th class="confluenceTh"> </th></tr><tr><td class="confluenceTd">h</td><td class="confluenceTd"> </td></tr><tr><td class="confluenceTd">k</td><td class="confluenceTd"> </td></tr></tbody></table>

Related

'itemListElement' not recognized in 'HowTo' schema

Based on the Microdata example in http://schema.org/HowTo and extrapolating syntax from the Microdata vs RDFa example in http://schema.org/hasOfferCatalog (there seem to be so few actual examples of RDFa to find?), I put together something like so:
<main vocab="http://schema.org/" typeof="HowTo">
<h1><span property="name">How to do the Hokey Pokey</span></h1>
<ol property="steps">
<li property="itemListElement" typeof="HowToStep">
<img alt="step 1" src="step1.jpg" align="left">
<p property="itemListElement" typeof="HowToDirection">
put your left hand in</p></li>
<li property="itemListElement" typeof="HowToStep">
<img alt="step 2" src="step2.jpg" align="left">
<p property="itemListElement" typeof="HowToDirection">
put your left hand out</p></li>
But, when put into Google's Structured Data Testing Tool, I get:
The property itemListElement is not recognized by Google for an object of type HowTo.
Yandex's validator also says:
WARNING: http://schema.org/itemListElement field not specified in http://schema.org/HowTo
What am I doing wrong?
You missed to specify the HowToSection (or HowToStep) type as value for the steps property.
The Microdata example uses:
<div id="steps" itemprop="steps" itemscope itemtype="http://schema.org/HowToSection">
The equivalent RDFa would be:
<div id="steps" property="steps" typeof="HowToSection">
If you aren’t providing an ItemList/CreativeWork value for the steps property, you are providing a Text value (this is what you are doing in your example markup). But you can’t add properties (like itemListElement) to a Text value.

Using both containedIn and additionalProperty to describe an item

I have a table containing some properties of a city. The city is part of a larger area, so I want to add the property containedIn. However, I also want to indicate the type of that area, like "region", "province", or "state", so I am trying to add additionalProperty to these areas. I am very confused about how to do this correctly and efficiently.
This is what I have tried, but Google Structured Data Testing Tool gives two/duplicate items (and two name properties). I want to add both containedIn and additionalProperty to San Juan and San Pablo, but it seems the property name is recognized by both containedIn and additionalProperty, so I do not know how to fix it:
<div itemscope itemtype='http://schema.org/City'>
<h1 itemprop='name'>San Pedro</h1>
<table>
<tr itemprop='additionalProperty' itemscope itemtype='http://schema.org/PropertyValue'>
<td itemprop='name'>Type</td>
<td itemprop='value'>city</td>
</tr>
<tr itemprop='additionalProperty containedIn' itemscope itemtype='http://schema.org/PropertyValue http://schema.org/AdministrativeArea'>
<td itemprop='name'>State</td>
<td itemprop='value'><a itemprop='url' href='#.html'><span itemprop='name'>San Juan</span></a></td>
</tr>
<tr itemprop='additionalProperty containedIn' itemscope itemtype='http://schema.org/PropertyValue http://schema.org/AdministrativeArea'>
<td itemprop='name'>Region</td>
<td itemprop='value'><a itemprop='url' href='#.html'><span itemprop='name'>San Pablo</span></a></td>
</tr>
</table>
</div>
Display in Google’s SDTT
The display in Google’s SDTT appears to be correct for the Microdata you provide:
If you use multiple properties to add an item, SDTT displays this item once for every property.
It’s just the way they decided to display it. They could as well have decided to display something like this instead, but they didn’t:
additionalProperty, containedIn
#type PropertyValue
#type AdministrativeArea
If you use multiple properties to add an item, and/or if this item has multiple types, you don’t add multiple/different items, it’s one and the same item.
It wouldn’t make sense that the name is only for one of the multiple types, or only for the item added by one of the multiple properties. There is only one item, with one set of properties, with multiple types, added by multiple properties.
Meaning
As far as I understand your data, you have a city (San Pedro) which is part of two administrative areas (San Juan, San Pablo).
I’m not sure it makes sense to model it so that the AdministrativeArea is also a PropertyValue. It seems to make more sense to apply the additionalProperty PropertyValue to the AdministrativeArea.
It’s not that easy within a table, so for the sake of this example, I’m using div:
<div itemprop='containedIn' itemscope itemtype='http://schema.org/AdministrativeArea'>
<a itemprop='url' href='#.html'><span itemprop='name'>San Juan</span></a>
<div itemprop='additionalProperty' itemscope itemtype='http://schema.org/PropertyValue'>
<meta itemprop='name' content='State'>
<meta itemprop='value' content='San Juan'>
</div>
</div>
Remark: using additionalType instead of additionalProperty for the "type of area"
Using additionalProperty PropertyValue to specify the type of the area is possible, but unusual. Typically actual types are used for such a purpose.
Find a type that represents the concept (e.g. "Region"), or create your own, and add it in addition to the most specific Schema.org type you can find.
In Microdata, the itemtype attribute can only take types from the same vocabulary, so you have to use the additionalType property:
<div itemprop='containedIn' itemscope itemtype='http://schema.org/AdministrativeArea'>
<a itemprop='url' href='#.html'><span itemprop='name'>San Juan</span></a>
<link itemprop="additionalType" href="http://example.com/some-vocabulary/Region">
</div>
And for the city: by using Schema.org’s City type, you already convey that it’s a city, so your additionalProperty (with type=city) seems to be superfluous. But if you want to convey some other type, you can use the same method with additionalType here, too.

Is it possible to have a table in the center in a GitHub gist Markdown?

Is it possible to have a table in the center in a GitHub gist Markdown? If so, how?
I've used the following syntax to create a table on a Markdown file:
Somehow the table is always flushed to the left!!!
|Column1|Column1|Column1|
|:----|:----:|----:|
|Column1|Column1|Column1|
But the table is flushed left, see https://gist.github.com/alvations/5095d3bcc0eec357c78f1c21a49e334f
Is it possible to have the table at the center of the page when viewing?
I've tried the suggestion from Is it possible to center tables in a markdown file? to use:
Somehow the table is always flushed to the left!!!
<center>
|Column1|Column1|Column1|
|:----|:----:|----:|
|Column1|Column1|Column1|
</center>
And the table disappears when viewing, see https://gist.github.com/alvations/cd3495e7107b7701cf1cf1da2a839534
I've also tried How do I center an image in the README.md on GitHub?:
Still on the left!!!
<p align="center">
|Column1|Column1|Column1|
|:----|:----:|----:|
|Column1|Column1|Column1|
</p>
But it's still on the left, see https://gist.github.com/alvations/23c18681df7a6bbf175d0e8c2cfccba3
Images for all three versions above:
In short, it's not possible. GitHub does not allow you to define your own styling.
First, note that there is no mention of the ability to apply any styling to any block level types in the GitHub Flavored Markdown spec (see the tables section). As your examples show, you are aware that you can center text within table cells, but that only applies to the cells and has no effect on the parent table (which is how HTML and CSS work and is not specific to Markdown or GitHub).
There are a few ways to define custom styles for HTML (which Markdown generates), but GitHub does not permit them.
One such way is to define CSS rules. However, right in the spec, GitHub explicitly states that they do not allow <style> tags.
Another way is to include raw HTML right in the Markdown document (with inline styles). However, for security reasons, GitHub is very selective about what they allow. In the Markup project they define the filters they apply to all markup languages they support (including, but not limited to Markdown). In pertinent part, the docs explain (emphasis added):
The HTML is sanitized, aggressively removing things that could harm you and your kin—such as script tags, inline-styles, and class or id attributes. See the sanitization filter for the full whitelist.
Given the above, it is simply not possible to define your own styling for documents hosted on GitHub. That said, some expect to be able to define styling within the Markdown syntax itself. However, the original Markdown rules explain (emphasis added):
Markdown’s syntax is intended for one purpose: to be used as a format for writing for the web.
Markdown is not a replacement for HTML, or even close to it. Its syntax is very small, corresponding only to a very small subset of HTML tags. The idea is not to create a syntax that makes it easier to insert HTML tags. In my opinion, HTML tags are already easy to insert. The idea for Markdown is to make it easy to read, write, and edit prose. HTML is a publishing format; Markdown is a writing format. Thus, Markdown’s formatting syntax only addresses issues that can be conveyed in plain text.
For any markup that is not covered by Markdown’s syntax, you simply use HTML itself.
As it is not a "publishing format," providing a way to style your document is out-of-scope for Markdown. Which leaves us with the ways which GitHub explicitly disallows. Therefore it is not possible to center a table (or apply any other custom styling) on GitHub.
As an aside, while GitHub uses the CommonMark spec (with extensions) rather than the original Markdown Rules, I make reference to the original rules as the section I quote from discusses the philosophy behind various design decisions made when creating Markdown. Markdown's (and CommonMark's) behaviors are directly related to that philosophy. While the CommonMark spec does not get into the design decisions (expect when it differs from Markdown), it does make reference to some of the points discussed in the very paragraph I quoted above. And nowhere does it contradict that philosophy. Therefore, I consider it relevant to the expectations we should have about what is and what is not part of CommonMark, and by extension, GitHub Flavored Markdown.
For completness, let's examine each of the examples provided by the OP.
The first example is simply a table with the middle column aligned "center". If we "view source" (or use the browser's "inspect" tool), we see the following HTML was generated:
<table>
<thead>
<tr>
<th align="left">Column1</th>
<th align="center">Column1</th>
<th align="right">Column1</th>
</tr>
</thead>
<tbody>
<tr>
<td align="left">Column1</td>
<td align="center">Column1</td>
<td align="right">Column1</td>
</tr>
</tbody>
</table>
Note that align="center" is only defined on the middle cell of each row. As such styling is only inherited by children elements, not parent elements, this does not get applied to the the table as a whole.
As an aside, the align attribute is not even mentioned in the HTML5 spec (that I could find); however, in the HTML 4.01 spec, you can define an align attribute on a table element or any of its children which is then inherited by the children of that element only.
Of course as established above, Markdown does not provide a mechanism to define alignment on anything except the cells. But even if you could define align on the table element, the spec explains that "[t]his attribute specifies the alignment of data and the justification of text in a cell."
Therefore, if would still have no effect on how the table is positioned in its parent element.
The second example is a table wrapped in a <center> element. A look at the source HTML reveals that the <center> tag was stripped out.
In fact, a look at GitHub's whitelisted elements reveals that center elements are not allowed and stripped out.
The third example attempts to wrap the table in a paragraph with align="center" defined on the paragraph. However, note the (interpreted) HTML:
<p align="center"></p>
<table>
<thead>
<tr>
<th align="left">Column1</th>
<th align="center">Column1</th>
<th align="right">Column1</th>
</tr>
</thead>
<tbody>
<tr>
<td align="left">Column1</td>
<td align="center">Column1</td>
<td align="right">Column1</td>
</tr>
</tbody>
</table>
<p></p>
According to the HTML5 spec:
A p element's end tag may be omitted if the p element is immediately followed by an... table... element.
Therefore, the paragraph does not actually wrap the table, but is implicitly closed by the table's opening tag.
But that got me curious. What if you used a div instead of a paragraph. But that makes no difference. As we've established earlier, the align attribute only effects cell text. You need to assign a style to change the position of a table on the page and Github explicitly disallows defining your own styles.
As you can see in the following image, GitHub automatically renders tables so that they're already taking up the full width. Because of this, you cannot center the text that GitHub's Markdown renderer generates (aka the table is really, really fat and technically already centered).
So totally possible !
 
<div align="center">
COLUMN 1 | </br>COLUMN 2 | </br></br>COLUMN 3
:--- | :---: | ---:
</br></br>left | center | </br></br>right
</div>
: Spacer
</br> : Skip line
:--- : Left
:---: : Center
---: : Right
It is possible to center a table. Essentially, on GitHub the table is already width 100%. You just need to give the tbody enough content for it take up 100% width too.
The trick: fill it with spaces.
<table>
<tbody>
<tr>
<td align="center">Key Features<br>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
</td>
<td align="center">Examples<br>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
</td>
<td align="center">Supported Methods<br>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
<span> </span>
</td>
</tr>
</tbody>
</table>
Result:
Narrow browser window:
Using mathjax:
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_HTML-full"></script> <script type="text/x-mathjax-config"> MathJax.Hub.Config({"HTML-CSS": { preferredFont: "TeX", availableFonts:["STIX","TeX"], linebreaks: { automatic:true }, EqnChunk:(MathJax.Hub.Browser.isMobile ? 10 : 50) }, tex2jax: { inlineMath: [ ["$", "$"], ["\\\\(","\\\\)"] ], displayMath: [ ["$$","$$"], ["\\[", "\\]"] ], processEscapes: true, ignoreClass: "tex2jax_ignore|dno" }, TeX: { noUndefined: { attributes: { mathcolor: "red", mathbackground: "#FFEEEE", mathsize: "90%" } }, Macros: { href: "{}" } }, messageStyle: "none" }); </script>
$$
\begin{array}{|c|c|c|}
\hline
\textbf{Column1} & \textbf{Column1} & \textbf{Column1} \\
\hline
\text{Column1} & \text{Column1} & \text{Column1} \\
\hline
\end{array}
$$
Just add align="center" into tag table
<table align="center"></table>

Remove and replace with PostgreSQL

With PostgreSQL I want to remove the image classes. The image classes has different ones. This is what I want to achieve of some sort:
<img src="#" class="one two three" alt="">
So that the result is:
<img src="#" class="" alt="">
So I can then do a UPDATE:
UPDATE posts SET content = 'class="new-class"' WHERE content = 'class=""'
I don't think the above is a good way to do it though.
update posts set content = replace(content, 'class="one two three"', 'class=""')

Link to a line Markdown file on GitHub

I often link to GitHub source code via the #L param in the URI.
e.g. : https://github.com/github/learn.github.com/blob/gh-pages/episodes.yaml#L1
But is there a way to link to lines within a Markdown file?
e.g. https://github.com/github/learn.github.com/blob/gh-pages/README.md#L1 (does not work!)
I know I can link to 'sections', but lines are much better!
e.g. https://github.com/github/learn.github.com/blob/gh-pages/README.md#learngithubcom
As it is currently not possible, I take the next best option: use blame and then highlight the lines, e.g. https://github.com/rails/rails/blame/master/guides/source/configuring.md#L166
Now Supported with ?plain=1
Announced on June 30, 2021, there is now a parameter to disable markdown rendering:
Appending ?plain=1 to the url for any Markdown file will now display the file without rendering. As with other code files, it will also show line numbers, and can be used to link other users to a specific line or lines. For example, appending ?plain=1#L52 will highlight line 52 of a plain text Markdown file.
It sounded like you might want to use line numbers to link to a point in the rendered document. That is still possible, nor is it a standard feature of markdown renders to add line number anchors like that.
For the benefit of the reader: The long answer is yes, it is difficult, but possible.
GitHub allows to inline permalinks to the text portion of Markdown files
However there seems currently to be no way to create such permalinks directly, you must manually create them. As follows:
Display the markdown document
Above the document on the right click on the shortened SHA of the document
(you can use "History" and the commit in question as well)
The commit's diff is shown.
Above the commit on the right click on the the 3 dots ... and select "View file"
Now the Mardown is presented again however it is the permanent variant.
Above the document on the right click on "Blame"
Scroll down to the lines which contain the Markdown representation of the text to cite
Select the line or lines in question
Copy the URL from the address bar of the browser
Paste the URL into the issue etc.
This step is only needed within issues: In the URL replace /blame/ by /blob/
In the preview of the Issue you will see the expected direct citing of the text portion of the Markdown.
Drawback of the /blob/-variant
If you click on the URL, you see the full Markdown in the browser, the text portion is not marked as expected.
This is a limitation on how GitHub handles those URLs.
Drawback of the /blame/-variant
It is plain unreadable because of all those annotations and non-rendering of the Markdown.
Example
Note that I had to clone this example to be able to create an issue:
https://github.com/hilbix/learn.github.com/blob/gh-pages/README.md
Click on the SHA
https://github.com/hilbix/learn.github.com/commit/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba
"View File"
https://github.com/hilbix/learn.github.com/blob/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba/README.md
"Blame"
https://github.com/hilbix/learn.github.com/blame/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba/README.md
Mark some lines
https://github.com/hilbix/learn.github.com/blame/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba/README.md#L20-L23
Change the URL
https://github.com/github/learn.github.com/blob/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba/README.md#L20-L23
Paste this URL into some issue
Result: https://github.com/hilbix/learn.github.com/issues/1
This was entered into the issue:
https://github.com/hilbix/learn.github.com/blob/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba/README.md#L20-L23
see https://stackoverflow.com/a/57202063/490291
This renders to something like
learn.github.com/README.md
Lines 20 to 23 in 38034b3
$ git clone https://github.com/github/learn.github.com
$ cd learn.github.com
$ script/bootstrap
$ jekyll --server
see https://stackoverflow.com/a/57202063/490291
Here is the full HTML of the issue created (sorry, I did not manage to copy the CSS, too):
<td class="d-block comment-body markdown-body js-comment-body">
<p></p><div class="border rounded-1 my-2">
<div class="f6 px-3 py-2 lh-condensed border-bottom bg-gray-light">
<p class="mb-0 text-bold">
learn.github.com/README.md
</p>
<p class="mb-0 text-gray-light">
Lines 20 to 23
in
<a data-pjax="true" class="commit-tease-sha" href="/hilbix/learn.github.com/commit/38034b3aee7f4fb7f46e94b3f9c2b3d3554291ba">38034b3</a>
</p>
</div>
<div itemprop="text" class="blob-wrapper blob-wrapper-embedded data">
<table class="highlight tab-size mb-0 js-file-line-container" data-tab-size="8">
<tbody><tr class="border-0">
<td id="L20" class="blob-num border-0 px-3 py-0 bg-white js-line-number" data-line-number="20"></td>
<td id="LC20" class="blob-code border-0 px-3 py-0 bg-white blob-code-inner js-file-line"> <span class="pl-s1">$ git clone https://github.com/github/learn.github.com</span> </td>
</tr>
<tr class="border-0">
<td id="L21" class="blob-num border-0 px-3 py-0 bg-white js-line-number" data-line-number="21"></td>
<td id="LC21" class="blob-code border-0 px-3 py-0 bg-white blob-code-inner js-file-line"> <span class="pl-s1">$ <span class="pl-c1">cd</span> learn.github.com</span> </td>
</tr>
<tr class="border-0">
<td id="L22" class="blob-num border-0 px-3 py-0 bg-white js-line-number" data-line-number="22"></td>
<td id="LC22" class="blob-code border-0 px-3 py-0 bg-white blob-code-inner js-file-line"> <span class="pl-s1">$ script/bootstrap</span> </td>
</tr>
<tr class="border-0">
<td id="L23" class="blob-num border-0 px-3 py-0 bg-white js-line-number" data-line-number="23"></td>
<td id="LC23" class="blob-code border-0 px-3 py-0 bg-white blob-code-inner js-file-line"> <span class="pl-s1">$ jekyll --server</span> </td>
</tr>
</tbody></table>
</div>
</div>
<p></p>
<p>see <a rel="nofollow" href="https://stackoverflow.com/a/57202063/490291">https://stackoverflow.com/a/57202063/490291</a></p>
</td>
I recently looked for the same. Answer is No, as mentioned in other answers.
But I found a good alternative which gives almost the same result we want.
Adding text fragment to url.
For example: https://github.com/github/balanced-employee-ip-agreement#:~:text=FAQ
You just have to append #:~:text={text-that-you-want-to-be-focussed} at the end of the url
read more about text fragment here.
https://wicg.github.io/scroll-to-text-fragment/
Short answer: no. Markdown is rendered into an HTML document by GitHub, so it's not currently possible to see it in a raw form that also allows you to link to individual lines. Maybe GitHub will implement this kind of functionality sometime in the future, but for now, it's not possible.
There's now support for this in the UI
This just dropped: https://twitter.com/github/status/1443572280924147717
Click on README.md in the directory you're looking at
Its URL will look like this: https://github.com/rust-lang/rust/blob/master/README.md
Click the "Display the source blob" button:
The URL will change to https://github.com/rust-lang/rust/blob/master/README.md?plain=1, as described in this answer
You can now click on line numbers and obtain links to these lines
There's still no such button to do this for .rst files, but adding ?plain=1 to the URL works: https://github.com/python/cpython/blob/main/README.rst?plain=1
When you want to link to a line in a file controlled by you, you can use <a>: https://stackoverflow.com/a/6494918/5053865
Example:
<a name="your_link_name">
Some line which you want to link to
</a>
... some wall of text ...
and here you are able to link to [the line](#your_link_name)
Example on GitHub: https://github.com/evis/markdown-link-to-line (it's in readme file).
This way, you can't refer to a line with a given number, but can refer to a line with needed content (which is exactly what you often need).