Coder Social home page Coder Social logo

Comments (12)

n-peugnet avatar n-peugnet commented on June 10, 2024 1

@RebelCoderRU:

I will wait for you to add the package to the packagist. Let me know when you have done that

I published it on packagist and just released v0.2.0 that adds highlighting in the preview: https://packagist.org/packages/club-1/flarum-ext-server-side-highlight

and also how can I tip you? I don't see a tip/support on your GitHub page.

I did not take the time/motivation to setup it, I just applied for GitHub sponsors but it takes some time to receive the validation.

from framework.

n-peugnet avatar n-peugnet commented on June 10, 2024 1

@RebelCoderRU: you should open an issue in my repo. It looks like there are two problems here. First I should add a note about the fact that the messages need to be reparsed (for example by editing them). Also it seems the dark theme is not properly detected, are you not using the "dark mode" switch in the appearance settings of Flarum ?

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

Apparently, this was reported in 2020: https://discuss.flarum.org/d/22635-how-to-change-syntax-highlighting/20

image

from framework.

askvortsov1 avatar askvortsov1 commented on June 10, 2024

In the interest of eventually allowing CSP headers and removing scripts from textformatter content, maybe the correct action here would be removing highlighting this way in favor of explicitly calling highlightjs.

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

In the interest of eventually allowing CSP headers and removing scripts from textformatter content, maybe the correct action here would be removing highlighting this way in favor of explicitly calling highlightjs.

I have tried the highlight.js extension, and it seems to be broken (syntax highlighting is broken, does not "respect" the theming):

Screenshot_20230417_064151
Screenshot_20230417_064208

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

I am wondering if there is some kind of hack/workaround for this, as I am waiting for this to work to start my community, which is code/programming focused, and this is one of the main features I need to work.

from framework.

n-peugnet avatar n-peugnet commented on June 10, 2024

I started thinking about making a Flarum extension that would do server-side code highlighting. It would produce a "highlight.js compatible" HTML result while parsing the newly posted messages, this way the code parsing and highlighting is only done once. The clients would only have to include a CSS stylesheet.
I will post an update if I finally start to do it.

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

I started thinking about making a Flarum extension that would do server-side code highlighting. It would produce a "highlight.js compatible" HTML result while parsing the newly posted messages, this way the code parsing and highlighting is only done once. The clients would only have to include a CSS stylesheet. I will post an update if I finally start to do it.

Got you. Do you know of any workaround that could be used now, as I am blocked from starting my community for a few weeks now, because of this bug?

from framework.

n-peugnet avatar n-peugnet commented on June 10, 2024

So I started this extension today: club-1/flarum-ext-server-side-highlight.

It works well but is still has a few issues that I would like to address:

  1. the highlighting is not shown in the preview Edit: done in v0.2.0
  2. the themes are not configurable

That said it currently provides the following advantages:

  1. the highlighting is done on the server so it is not up to the clients to do it
  2. the server uses the cache to save highlighted blocks to only do the processing once
  3. it works without any JS so even on the worst web browser the highlight will be there and there is no delay before the highlighting is applied
  4. the theme adapts itself to the "dark mode" setting of Flarum
  5. it works even with BBCode extension disabled (See s9e/TextFormatter#206)

If you want to try it you can use the "repository" feature of composer, but I will probably create the package on packagist soon.

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

@n-peugnet Thank you so much. I will wait for you to add the package to the packagist. Let me know when you have done that, and also how can I tip you? I don't see a tip/support on your GitHub page.

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

@n-peugnet Just tested it and it has highlighting/theme issues:
Screenshot_20230425_171012
Screenshot_20230425_171005

But the highlighting works during the editing:
Screenshot_20230425_171033

Do I need to disable some other extension?

from framework.

rebelC0der avatar rebelC0der commented on June 10, 2024

@n-peugnet

are you not using the "dark mode" switch in the appearance settings of Flarum ?

Yes, correct.

messages need to be reparsed (for example by editing them)

Yes, I have tried that, and it seems to work as expected, after I Edit -> Save.


How hard is it to change the theme of the highlighting? Even though it now works, colors are very bad, hard to read:

Current version:

image
image

Desired version (or at least as readable in both, dark and light mode):

image

from framework.

Related Issues (20)

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.