GithubHelp home page GithubHelp logo

gpoore / codebraid-preview-vscode Goto Github PK

View Code? Open in Web Editor NEW
27.0 27.0 4.0 1.21 MB

Preview Pandoc Markdown in VS Code, and execute code blocks and inline code with Codebraid

License: Other

CSS 5.68% JavaScript 6.12% Lua 23.84% TypeScript 64.06% Python 0.30%

codebraid-preview-vscode's People

Contributors

gpoore avatar haberdashpi avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

codebraid-preview-vscode's Issues

Support for Pandoc Citations

CodeBraid is great! I've started using it as my default Markdown preview within VS Code. I see that support for citations is planned in the future -- do you have any thoughts on how to accomplish this? What's the main blocker?

Depending on the complexity, I might be able to make a PR.

KaTeX math failing to render

The math equations aren't being rendered out of the box for me, while they work with another Markdown preview. Here's a recording:

2022-03-04_12.03.32.mp4

how to add pandoc arguments

From the readme, it says one should add pandoc arguments as follows:

codebraid.preview.pandoc.options [none]: Pandoc command-line options in array form (for example, ["--filter", "FILTER"]).

I've tried several ways but it won't take my options, tried it in different ways (settings.json):

{
  "codebraid.preview.pandoc.options": [
      "`[\"--filter\", \"pandoc-crossref\"]`",
      "[\"--filter\", \"pandoc-crossref\"]",
      "[--filter, pandoc-crossref]",
      "\"--filter=pandoc-crossref\"",
      "--filter=pandoc-crossref",
   ],
}

But none of them seems to work. Could you assist how to add them correctly?

More control over pandoc and lua environment

Ever since the recent pandoc-discuss announcement, I've been meaning to try out Codebraid, and it's great!

I'd like to be able to make it easy for others to run pandoc, together with a quite extensive set of customisations. All the customisations are available in a "data-dir" tree that people can check out from git. I also need to set the lua path so some utilities can be found. Therefore, it would be wonderful to be able to:

  • Set data-dir (ideally allowing the definition to reference an environment variable, as in data-dir: ${PANDOCDIR})
  • Set LUA_PATH (if environment variables can be referenced, then static LUA_PATH="${PANDOCDIR}/?.lua;;" might be sufficient)
  • Search for the defaults file (_codebraid_preview.yaml or another file) in the data-dir tree (in data-dir /defaults by convention)

Also, some of my lua filters aren't working as expected, so it would be great to be able capture the pandoc stdout and stderr output. Could they perhaps be made available via the OUTPUT tab (or elsewhere)?

Note: My filters access files within the data-dir tree, so I wondered whether I was hitting a security issue. I tried setting Codebraid › Preview › Security: Extra Local Resource Roots to the data-dir root (I assume that this is a colon-separated list?) but it didn't seem to make a difference. Ideally this setting might also be able to reference an environment variable (perhaps it already can).

[custom html template compatibility] Everything almost worked, but Codebraid did not say which HTML code is invalid

Hello!

I am always facing a same problem:

image

I reviewed the default and template files, and the Codebraid settings, and did not find any error in these files. I do not know why.

I use the latest version of Pandoc, and of Codebraid.

You can get my tiny and simple file to analyse: small-bugged-test.tar.gz.

I also tried this command, but it was stuck:

pandoc --defaults "confluence.yaml" --template "assets/templates/confluence.html" --file-scope --standalone --from markdown_github --to html -o "result.html"

Feature request: Add option for filters in "_codebraid_preview.yaml"

I usually like to keep my reports consolidated in a single folder, with the filters also stored. The folder organization may vary for different reports, therefore I wish there was an option to specify the filters used for generating the preview.

include-code-files is one of my personal favourites when it comes to filters.

Currently, I did this for the builds using pandocomatic using the following in the document frontmatter.

---
title: 'Exp 4: Stepper motor control with systick timer'
author: Utkarsh Verma
date: \today

pandocomatic_:
  pandoc:
    from: markdown
    to: pdf
    template: ../template.tex
    lua-filter:
      - ../../.filters/include-code-files.lua
---

I also like the fact that pandocomatic can be configured directly inside the frontmatter. Could we have something for codebraid preview as well?

matplotlib plots are not rendering

I'm using codebraid-preview 0.5.1 with codebraid 0.8. When I run the short file below in a conda environment that includes matplotlib I do not get a plot in the output.

  • Tested on M1 Mac, macOS 12.4
  • Python and codebraid installed in a conda environment.
  • Pandoc installed via homebrew

Screenshot of result:

no-plot_md

Input file is attached:

no-plot.md

Change font using my own stylesheet

I am trying to set the previewer to show a font different to the font i am using in vscode?

Is this possible? Maybe Im missing something..

1 - adding pandoc arg --css in vscode settings.json

"codebraid.preview.pandoc.options": [
        "--css assets/css/theme.css"
    ]

2 - Adding css: to _codebrain_preview.yml

#  _codebrain_preview.yml
css: assets/css/theme.css

CSS:

body {
  font-family: 'Liberation Serif';
}

I know its working using only pandoc with this test:

pandoc --defaults _codebraid_preview.yml -o market-research.html market-research.md
# this outputs an html with font as 'Liberation Serif'

Removing --css flags from this.pandocPreviewArgs does enable my custom font from the stylesheet.

[Question] What is the correct code to skip `Para` and `Plain` for supporting Codebraid Preview with `sourcepos`?

Good morning!

I wrote two Pandoc Lua filters – admonition and collapsible section. They work only with the markdown_github variant. Not with the commonmark_x variant because of data-pos and sourcepos, and Para or Plain are like Div. I acknowledged your note on filters.

I was studying @wlupton's old and new old list-table codes to understand better how to add support for Codebraid Preview and for sourcepos. They almost worked, but I failed when I changed to a content filter.

Here is the Markdown admonition syntax code:

::: note
This is a _note_ with a `code`

It has _multiple_ paragraphs for `code`.
:::

It will become into HTML:

<div class="admonition note">
  <p class="admonition-title">This is a <i>note</i> with a <code>code</code></p>

  <p>It has <i>multiple</i> paragraphs for <code>code</code>
</div>

I wrote this Lua filter code:

local function admonition(el)
    if el.classes[1] == "note" or el.classes[1] == "bug" or el.classes[1] == "error" or el.classes[1] == "tip" or
        el.classes[1] == "warning" then
        local title = el.content[1].content
        local pandoc_title = pandoc.Pandoc({pandoc.Para(title)}, pandoc.Meta({}))
        local html_title = pandoc.write(pandoc_title, "html")
        html_title = html_title:gsub("<p>", ""):gsub("</p>", "")
        table.remove(el.content, 1)
        return {pandoc.RawBlock("html",
            '<div class="admonition ' .. el.classes[1] .. '"><p class="admonition-title">' .. html_title .. '</p>'),
                pandoc.Div(el.content), pandoc.RawBlock("html", "</div>")}
    else
        return el
    end
end

return {{Div = admonition}}

It failed because of Para. I switched from local title = el.content[1].content to local summary = el.content[1].classes[1], and it almost worked on Codebraid Preview with commonmark_x, but the problem is that it will display note instead of This is a note with a code.

I was looking at @wlupton's codes about block_skip_data_pos, and I adapted my code, but it didn't work yet.

Here is the Markdown collapsible section syntax code, similar to that below:

::: collapse
Attention to the `code`

Here is some *hidden* **content**
:::

And to HTML:

<details>
   <summary>Attention to the <code>code</code></summary>
   Here is some <i>hidden</i> <b>content</b>
</details

Here is its Lua code:

local function collapsible_section(el)
    if el.classes[1] == "collapse" then
        local summary = el.content[1].content
        local pandoc_summary = pandoc.Pandoc({pandoc.Para(summary)}, pandoc.Meta({}))
       local html_summary = pandoc.write(pandoc_summary, "html")
        html_summary = html_summary:gsub("<p>", ""):gsub("</p>", "")
        table.remove(el.content, 1)
        local details = pandoc.Div(el.content)
        return {pandoc.RawBlock("html", "<details><summary>" .. html_summary .. "</summary>"), details,
                pandoc.RawBlock("html", "</details>")}
    else
        return el
    end
end

return {{ Div = collapsible_section }}

You overwrote our syntax highlighting CSS

Hello,

We have own syntax highlighting CSS. We use Prism.js or Highlight.js.

Using VSCode's native Markdown Preview, our syntax highlighting CSS is used and not overwritten.

But with your extension, our syntax highlighting isn't used and is overwritten.

Codebraid doesn't understand @tarleb's Lua filter `list-table` because of container without point (even if with point)

Hello!

You can check the Lua file at @tarleb's list-table. Codebraid doesn't understand that Lua filter because Codebraid accepts only the container with point.

Observe that I modified the Lua filter, adding a point for list-table as Codebraid, but it gave the same error too.

Here is the screenshot:

image

I tested with the command pandoc -s "List of supported languages in three syntax highlighters.md" -o result.html -f commonmark_x -t html5 -L filters/lua/list-table.lua on terminal. Pandoc understood the Lua filter and generated without error:

image

use own css for vscode preview

I might be missing something, but i cannot make the codebraid markdown preview support my preview css. Here is vscode's documentation for preview css.

My codebraid setting:

  • css override default: false
  • css use default: true
  • css markdown preview font settings: true (inherit)
  • css custome data: vscode_preview.css

Above vscode_preview.css is the css file for this project, which is used by vscode built-in preview.

Min. codebraid version check failing

I'm using the newest version of this extension as well as the newest version of codebraid on a windows machine through WSL. Since updating to the latest version of the preview, the codebraid version check keeps failing, and thus it is not applied.

A notification appears saying:

Codebraid is not installed or is out of date (need v0.7.0+). Install or upgrade (https://pypi.org/project/codebraid/), then reload the extension. Code execution and loading output from cache is disabled.

However running codebraid --version in the terminal yields Codebraid 0.7.0 as required. It seems the check_codebraid.ts has not worked.

`

Previewing Local Images

Hi, I couldn't get local images to render using your extension.

I reviewed issue #13 including this comment which mentions "you may be using a different directory structure or something else may be interfering". I am not sure what would be interfering.

The file for which I want to insert an image is located in a directory structure like this: ~\Documentation\resources\file.md. The image I am linking is located here: ~\Documentation\images\image.jpg. In the markdown, I reference the image like this: ![alt](../images/image.jpg.

I am not sure what to change in order to get this to work. I am unfamiliar with the Webview API - any direction you could provide would be greatly appreciated!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.