Tdesktop: Automatically Syntax-Highlight received Code

Created on 11 Nov 2014  ·  108Comments  ·  Source: telegramdesktop/tdesktop

It would be great if we were able to send code snippets via Telegram in a way that is nicely readable by the receiver. I'm chatting a lot with other developers and often, I feel the need for such a feature.

enhancement

Most helpful comment

Also, support for GitHub's Markdown would be a wise feature.

All 108 comments

Also, support for GitHub's Markdown would be a wise feature.

Code highlighting, or at least tabulation, would be awesome

The thing is, highlighted code doesn't have to be a new message format like images or videos as it's also just text. It could be marked like code in GitHub flavoured Markdown using three backticks or something like that.

or just by using some library that detects most common programming structures, there is probably some library made to detect code inserted between text

I'll also appreciate this !

code here

will be a nice addition

I like the idea. I'm waiting for later versions of Telegram to see whether I need Kik Messenger installed on my phone or not. Please keep doing well developers.

I absolutely agree. Syntax highlighting is very useful thing

I disagree about automatic mode. Should be some markup language like [code]int main()...[/code] instead of automatic to avoid bugs and excessive CPU consumption on parsing messages.

Nice Feature, Like that ;)

I would love that support! A markdown support as in GitHub or on HabitRPG's chat would solve well the problem about a non-dev sending a sample message and te app reading it as source code.

I know telegram is a mobile-first application, but we already have this kind of functionality in other chat tools like slack that use it in both mobile and desktop implementation.
This kind of markdown language would really help telegram to be adopted by technical teams on internal communication. I am trying to convince my team to replace slack and skype by telegram and this feature would help me a lot on this task!
Keep doing this great work!

@GreatMedivack you just had to be different to everone else :arrow_up:

+1 from me and +1 from my cat

What would be the best way to handle this? Slack does code highlighting, but its not markdown style, rather code upload. UX matters too.

+1 for the same system as Github, backticks with the language code behind, would be super useful

This was implemented, check this out:
image

Inline `code` has `back-ticks around` it.
```
var s = "Block highlighting";
alert(s);
```

This is just the monospace, not Syntax-Highlight. And if a line have more than 51 characters, it breaks the line (if was even the 80 chars i would understand...but why 51?). And the mobile still not working well.
If the feature is already implemented, it need some improves.

+1 highlight syntax like in gitter

It's worth noting that it's now possible to format code blocks by using the @bold bot which accepts markdown.

@joeldrapper @bold didn't support syntax highlighting and use word breaking to separate line. It's makes code more unreadable if you send some example to man for showing some example, it's hard to read and still better sending code with pastebin. It's needs horizontal scroll at minimum, but i don't know, support it's telegram or not.

@Niklan Currently TDesktop does not support horizontal scroll in messages layout :(

Has no way to embed Pastebins links? However, a native option will be great.

If inline-bot is the preferred ways for bold & italic... then we will probably have to resort to inline-bot for this "programmer only" case?

@lawrencegs Could be inline-bots a way to do this, but the API don't have a implement
to modify colors in text. It has only a simple markdown.

I love the ``` block and I use it a lot, but syntax highlighting will be a new level.

Well, I'm upping this since it would be really lovely and useful :+1:

@Niklan Indeed, we need resizable chat width at least. I commented about it here: https://github.com/telegramdesktop/tdesktop/issues/1634#issuecomment-194929183

Use the new reactions of GitHub on the first entry of this issue instead of creating unnecessary +1 comments.

Reactions aren't available in mobile site yet.

@stek29 I know - but you can easily switch to the desktop version.

With this feature, I will change hipchat for telegram desktop directly!

Only that feature stops from using telegram on work.

We want to change skype/hipchat/hangout on work for telegram desktop :8ball:

We're waiting for this feature too! For now we've built a small bot which replies with rtf files. Looks convenient for mobile preview:

https://telegram.me/pastemebot

It works in inline mode too replying with urls for rtf files.

Really hoping to see support for code snippets with syntax highlighting. Even better if Telegram would allow centralised viewing of all code snippets via the "Shared Media" viewer.

hmm...'shared code' inside media section - great idea. too great to be implemented 😄

LaTeX would be awesome to see available.

I think code must be like media files with little preview or just name and some meta info, but on click opens in new modal window with syntax highlighting. Also would be great if we can edit it and resend edited version after that.

At least here in Brazil, many developers uses Telegram so is very useful
this feature 😇

--

Theus Falcão
Sent by Gmail Mobile

+999

Nicaragua, from centroAmerica, we like this

This would be nice
```php

class StreamsServiceProvider extends ServiceProvider
{
    use DispatchesJobs;
    protected $schedule = [];
}

```

Any progress on this? If not, is there any opposition?

I suppose, they just don't want to be the best messenger for programmers :)
image

Come on, developers! It's not that hard to implement!

If you are scared it might mess up with non-programmer users, just make some obscure rules to enable it, prefixes, etc., we won't mind :)

But, don't forget guys, there are some more serious problems. For example, Telegram, could be blocked in Russia soon, and so on...

That's interesting, could the community start such project based on inline bot? I had seen few implementations, but they are not enough convenient for everyday use.

Thoughts? Community! ))

If you are scared it might mess up with non-programmer users, just make some obscure rules to enable it, prefixes, etc., we won't mind :)

What? It's already done through use of code blocks. I'm talking about formatting, not highlighting. And it doesn't mess anything up for non-programmers. Or are talking about _autodetection_? I hope not, as it's very _bad_ idea.

That's interesting, could the community start such project based on inline bot?

Nah. Inline bots are confusing. Should just have clear rules for formatting/highlighting.

Formatting is not so clear, so it could be. I mean, if you would write ``` multiline block, it would transform your code to many lines limited by ` sign.
It's not fully useful for some cases.

Highlighting that what we talk above.

Inline bots... Unfortunately, you are right. ((( This is weird thing. But, as I think, the problem is deeper, some low level problem, like the shell which not supports coloring? Correct me, please if I'm wrong.

But, don't forget guys, there are some more serious problems. For example, Telegram, could be blocked in Russia soon, and so on...

Not our problem :)

What? It's already done through use of code blocks. I'm talking about formatting, not highlighting. And it doesn't mess anything up for non-programmers. Or are talking about autodetection? I hope not, as it's very bad idea.

I am trying to come up with some reason why this is not yet implemented. So I hypothesized that maybe they are worried that autodetection could affect regular users, but I agree with you ofc, that such fears are missplaced.

Not our problem :)

Whom do you mean, @arenaq ?
I think, it is general problem. At the first it is the problem of Pavel Durov.
But I agreed, this is offtop for here.

@Piterden I meant ppl that won't be affected by Telegram blocked in Russia. Was more like a joke, really.

Maybe something like this could be easier to implement instead of trying to do code detection
slackcode

Slack has the worst implementation of highlighting I ever seen.
The best implementation is here, on GitHub.

Still better than nothing, which is what we currently have on Telegram

Does Telegram support any type of modal dialog?

Yes. It does. :-)
image

EDIT: Sorry, I didn't have any larger file.

Btw, guys. I had avoid that problem with the ST3 and its Export HTML plugin. I even have highlighting with my own colors.
Gallery.vue.html.zip
You need to unpack and open it in browser then.

PS Especially for paranoiacs, it looks like:
image

    You shouldn’t share files like that.Why don’t you just create a repo and show the source instead? Otherwise noone have a clue what they’re downloading and opening.



    Get Outlook for iOS

On Wed, Aug 30, 2017 at 3:22 AM +0200, "Denis Efremov" notifications@github.com wrote:

Btw, guys. I had avoid that problem with the ST3 and its Export HTML plugin. I even have highlighting with my own colors.

Gallery.vue.html.zip

You need to unpack and open it in browser then.


You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

@rockymontana
Bro, you shouldn't leave comments like this ^
:rofl:

That's completely unrelated to TDesktop and to syntax highlighting.

UPD: deleting @gogl92's comment to avoid misinformation and confusion.

My tg don't have this ^

image

Code highlighting, and extend the 51 character limit per line please!

```languageName
code
```
syntax like markdown would be perfect... No need to detect the language (which is not only difficult but error prone)..

for example:
```java
public class MyClass {
  public static void main(String[] args) {
    System.out.println("Hello world");
  }
}
```
should give

public class MyClass {
  public static void main(String[] args) {
    System.out.println("Hello world");
  }
}

and
```python
def mysum(x, y):
   return x + y
```
should give

def mysum(x, y):
   return x + y

Is any news about code highlighting?
Does someone work on this feature?

@Piterden it looks your bot doesn't work as it should be

@ShavidzeT, ya it should be rewritten, I had stopped it now.

PS play while in chess...

@Piterden I see that it's useful feature for telegram, if you looking for maintainers, I can help.
I'll ping you on your email.

As a workaround, I made https://t.me/colorcodebot . It's susceptible to #522 problems.

Nice bot, @AndydeCleyre, but I personally hate solarized :joy_cat:

Do you have sources for that your bot? Maybe add there a theme selection functionality from my one?

You know, we could also add there a question about a preferred file format. @AndydeCleyre

Sorry guys your work are great, but imho, this bots are nearly useless :(
Code as img already a big compromise, and more easily done via screenshot.
Code as html is good, but telegram can't render it => what profit from bot, as many sites offer same functionality?
I made some research on this question a time ago, and think that best solution it's implement a html render in telegram. But looking into code, I understand that for me it's hard to achieve, even for personal use :(

@kirsan31 I'm hoping for an in-app solution as well. The benefits of the bot for me:

  • I'm running it, so I can safely share private code
  • sender doesn't have to leave Telegram
  • quick viewing, especially when associating local html files with a simple renderer

Guys, we need the instant view of highlighted code!!!

The bot can share statically the prepared for an instant view HTML files.

I always wanted the idea of having a in-app browser inside tdesktop, I made this concepts
http://telegra.ph/Telegram-Desktop-In-App-Browser-09-04

@AndydeCleyre
Agreed.

quick viewing, especially when associating local html files with a simple renderer

Especially directly in Telegram ;)
Back to your bot, theme selection functionality from @Piterden will be great (don't like black theme in c# :) )!

@Piterden

Guys, we need the instant view of highlighted code!!!
The bot can share statically the prepared for an instant view HTML files.

If it's possible, I think this is the right direction. But we have no instant view support in tdesktop #3492, and as I understand, instant view is not in html :(

@kirsan31 I invite you to take further colorcodebot discussion to its own issues page, and let me know which of these you would appreciate included: theme previews

@AndydeCleyre did you see this stuff?
https://github.com/revolunet/sublimetext-html-export

IMHO it has better render, than your...

Puhleaaase add github-like code highlighting. That would be amazing.

If anyone interested, my workaround for this problem:

Preview:

example

@kirsan31 your approach looks better but we still need markdown support 😄

Bump.

@kirsan31 so does your approach need html key for c++ code?

@Piterden
I like your idea with html file creating by bot. So I thinked, if I can create and send such file on the fly in telegram (if I have html markup in clipboard)...
In my mod you need to type ```html and then paste your html code.
Yes, it's not so good approach, but we are using it along with sending files from bots.

@olleharstedt can I ask if you've tried my bot? https://t.me/colorcodebot

Note that as a convenience, you can invoke it inline to bring up a direct chat button

Totally disagree with this feature. Telegram is for chatting and sharing media, it is not a developer-specific tool. For code sharing use Slack, Mattermost, or whatever.

  1. Any unnecessary complexity implies increased RAM consumption, more bugs in code, slower interface rendering.
  2. All platform client implementations are not very suitable for sharing code due to a very limited line length (up to only 50 symbols).
  3. If the code (regardless of language) needs highlighting to be understood, it's the ugly code and needs to be rewritten. :)

@adrianopol disagree with you completely.

How is being a developer relevant for Telegram usage? Developers are users too and they want to chat and share as well as others. When I chat with my friends who happens to be developers as well, I don't want to invite then to different platform just because I want to send them a small code snippet.

By the way, how do you know what is Telegram for? By the same logic you could have argued, before introducing Telegram calls, that it was meant only for texting and therefore ppl should go to Skype, Discord, or whatever. Are you saying that you won't accept any change at all?

  1. Theoretically, yes. In practice, it is insignificant to features like mentioned calls. I would even argue that it would not consumed any more RAM than before. Maybe you meant CPU or HDD, but RAM would not suffer at all (if any, we are talking about few kB for a few seconds). For comparison, already mentioned calls feature requires tens of MBs of RAM.
  2. Not sure, where did you take that number. The line on my platform shows 71 chars. But, you argue that the implementation are not suitable. I would argue that since there is a demand it means that people are using it already, they just want syntax highlight (which have nothing to do with line breaks).
  3. Are you saying that syntax highlighting is useless and that IDE's are only supporting it cause of ugly code? It is not about "if" it will be understood, but how. I believe that if you would be looking at it for a while, you would figure it out eventually, but wouldn't it be nice to get that right away? As well as if all messages would be mirrored upside down, it would still be understood, but it would not be as pleasant reading, right?

@adrianopol I think that we do not need "Automatically Syntax-Highlight" we need a "Syntax-Highlight Snippet" that when you need you can Highlight the code in a message.

  1. If the code (regardless of language) needs highlighting to be understood, it's the ugly code and needs to be rewritten. :)

Why do you highlight your chat then?
image

Oh you have ugly chat and it needs to be rewritten!

Also I propose you to not use the monospace font, because a good code must be readable even in Arial.

@adrianopol I believe it is just misleading title. If you read what author of this topic wrote, it seems to me that it is very similar to what you are proposing.

It would be great if we were able to send code snippets via Telegram in a way that is nicely readable by the receiver. I'm chatting a lot with other developers and often, I feel the need for such a feature.

@arenaq,

How is being a developer relevant for Telegram usage?

Because this feature is useless for everyone except SW developers. I am not about discarding any improvements or features at all. My message was about a niche feature. Suppose photographers asking for a .psd file previewer, mathematicians asking for LaTeX support, and so on.

Support for calls is a marketing feature, and it is meaningful for all users, so this is not a valid comparison.

Any software product is always a compromise between [a number of features expected by users] and [a number of bugs, fast UI reaction, and a good interrelation between existing features].

The key point is that small code snippets are enough readable without highlighting, and the large ones suffer from size limitation, making them absolutely unreadable (regardless of any highlighting).

it seems to me that it is very similar to what you are proposing

Well, talking about a separate media type (like images, videos) with its own viewer is a more reasonable way, I suppose. But most examples and suggestions are about inline support.

Try my bot @adrianopol
@cris_highlight_bot

Compare these two ways.

horizontalWords () {
  const words = []
  let row = 1

  for (row; row <= this.width; row++) {
    const rowBlankCells = this.blanks
      .filter((cell) => Number(cell.split(':')[1]) === row)
      .map((cell) => Number(cell.split(':')[0]))

    if (rowBlankCells.length > 0) {
      let i = 1
      const cols = new Array(this.height).fill(0).map((col) => i++)

      if (cols) {
        `:${cols.join('::')}:`
          .split(new RegExp(`:${rowBlankCells.join(':|:')}:`))
          .filter((word) => {
            const match = word.match(/:\d+:/g)

            return match ? match.length > 1 : false
          })
          .forEach((word) => {
            const match = word.match(/:\d+:/g)
            const length = match ? match.length : 0

            words.push({
              x: Number(word.match(/^:(\d+)/)[1]),
              y: row,
              type: 'horizontal',
              length,
              question: '',
            })
          })
      }
    } else {
      words.push({
        x: 1,
        y: row,
        type: 'horizontal',
        length: this.width,
        question: '',
      })
    }
  }

  return words
},

image

@adrianopol

Because this feature is useless for everyone except SW developers.

Support for calls is a marketing feature, and it is meaningful for all users

I do not believe it is (to both).

Suppose photographers asking for a .psd file previewer, mathematicians asking for LaTeX support, and so on.

I wouldn't mind. If there will be reasonable demand for it and wouldn't affect other users, why not?

Yes, you are right, it is a compromise, but this is a tiny feature that would not impact performance. In regards of bugs, UI reaction time - this really is negligible, since there are many optimized libraries that can do that.

I would understand the argument about too many options in UI for other users, but since this would be sort of hidden feature, not even that would apply.

And I do believe that in case of snippets, size does not matter. Should be highlighted even when it's just one line :)

PS: I am not talking about parsing all the messages that user type and looking for code, but rather introduce a new syntax for formatting (as now with "`" character, as markdown has for example)

Just like here on GitHub would be nice. @arenaq

```c++
#include <iostream>
using namespace std;

int main()
{    
    int number;

    cout << "Enter an integer: ";
    cin >> number;

    cout << "You entered " << number;    
    return 0;
}
#include <iostream>
using namespace std;

int main()
{    
    int number;

    cout << "Enter an integer: ";
    cin >> number;

    cout << "You entered " << number;    
    return 0;
}

It is enough easy

@Piterden yep, that's exactly what I had in mind 👍

yes, please 👍

Im from a group of devs and we have left gitter for telegram... this is the only feature we miss.

Please implement :)

Any updates?

image

https://core.telegram.org/bots/api#markdownv2-style

The telegram bot docs has an example of this with python, but it does NOTHING different.

Could you post a link to that image? Hard to tell if that is the api docs or some other library. @RusseII

https://core.telegram.org/bots/api#markdownv2-style

I see. Tested it out, and it does remove the language and display the text, but doesn't highlight. Though the docs don't claim it should highlight anything. And yes, I do have the markdown mode as MarkdownV2

telegram.sendMessage(id, message, { parse_mode: "MarkdownV2" });

image

@SvenWritesCode This is the bot api. Must work thru bot, but not from client :(

Hey there!

This issue will be automatically closed in 7 days if there would be no activity. We therefore assume that the user has lost interest or resolved the problem on their own.

Don't worry though; if this is an error, let us know with a comment and we'll be happy to reopen the issue.

Thanks!

This issue will be automatically closed in 7 days if there would be no activity. We therefore assume that the user has lost interest or resolved the problem on their own.

Don't worry though; if this is an error, let us know with a comment and we'll be happy to reopen the issue.

This bot will close all issues due to _no spam_, but reactions policy :)))))

Bump. Considering this issue is from 2014, I have to assume the telegram devs use a different chat client, lol.

Bump. Considering this issue is from 2014, I have to assume the telegram devs use a different chat client, lol.

They use Discord :laughing:

UPD: Or maybe Pavel bought to them enterprise Slack?

They use Discord

UPD: Or maybe Pavel bought to them enterprise Slack?

Literally every other chat client has this feature. Get with the times, telegram. 🙄

Was this page helpful?
0 / 5 - 0 ratings

Related issues

JhonSane picture JhonSane  ·  3Comments

abhyrz picture abhyrz  ·  3Comments

matteotumiati picture matteotumiati  ·  3Comments

whywhyy picture whywhyy  ·  3Comments

Mindstormer619 picture Mindstormer619  ·  3Comments