Hilight TODO comments

[Phyks]

Hi,

Many text editors by default hilight the "TODO" comments. This is not the case for jupyter-notebook which display a # TODO: Something comment just the same color as a normal comment (including the "TODO" string).

I think it would be really useful to hilight such comments (at least the "TODO" string).

[takluyver]

The editor component we use is called CodeMirror. The author of that package describes here how one might add that functionality using 'overlays'.

[Phyks]

Sorry, I am quite new to Jupyter and I am not sure to fully understand how I should add such overlays to my notebooks =(

[eronlloyd]

Jupyer uses Pygments to color source code, from what I understand, and there are some configuration files that probably can be edited to add TODO line coloring for the lexer. It's not obvious to me how one would do this simply, however. I can look into it further for you.

[takluyver]

In the notebook, syntax highlighting is done by CodeMirror. We use pygments if you convert the notebook to HTML or LaTeX, but not in the live view where you edit it.

[Carreau]

That's should be doable just with a codemirror overlay. I see if we can make a demo of that at some point.

[tfors]

I took a stab at this over at tfors/notebook@1321bd53e705c5ba849770285009c4df4b98b7e5. I'm still new to this, so I'm sure it could stand some clean-up, but it is working.

Was this intended to be added to the notebook or somehow made into a plugin?

@hinnefe2 was working on this at JupyterDay Chicago. Henry, you might take a look at this and see what could be improved.

[tfors]

So, I'm attempting to turn this into an extension here: tfors/nbextension-todo-highlight (based on MinRK's scratchpad extension), but I'm stuck for now.

Can someone give me a hint on how to call addOverlay on the CodeMirror instances for all the existing and future CodeCells from an extension? Or am I approaching this all wrong?

Thanks!

[jcb91]

@tfors you could take a look at https://github.com/ipython-contrib/IPython-notebook-extensions/blob/5c7dc53f0bf2ca2bd67a57519bfc98c6a8135528/nbextensions/usability/spellchecker/main.js which uses a codemirror overlay for spellchecker-type highlights, perhaps?

[JamiesHQ]

@gnestor : is this something we're able to wrap up at this point in time?

[gnestor]

It sounds like the best way to implement this would be to create an addon overlay for the ipython mode for Codemirror.

Here is demo: http://codemirror.net/demo/mustache.html

The relevant addon overlay code:

CodeMirror.defineMode("mustache", function(config, parserConfig) {
  var mustacheOverlay = {
    token: function(stream, state) {
      var ch;
      if (stream.match("{{")) {
        while ((ch = stream.next()) != null)
          if (ch == "}" && stream.next() == "}") {
            stream.eat("}");
            return "mustache";
          }
      }
      while (stream.next() != null && !stream.match("{{", false)) {}
      return null;
    }
  };
  return CodeMirror.overlayMode(CodeMirror.getMode(config, parserConfig.backdrop || "text/html"), mustacheOverlay);
});

In this case, we will want to apply it to "ipython":

CodeMirror.overlayMode("ipython"), todoOverlay)

@tfors You wanna give it another shot? If so, just submit a PR against notebook vs. creating an extension. This will be helpful reference for others who want to add overlays to ipython mode. Otherwise, let's mark this as Reference and close it.

[Krista]

@gnestor can I help with this ?

[gnestor]

@Krista By all means! 👍

[ttthao]

Hi everyone,

@Krista are you working on this? I'd like to help! If nobody is, where should I start looking? I've read through the past comments already.

[gnestor]

@ttthao Would very much appreciate your help here, too! See this comment above specifically for some hints 👍

[Nazeeh21]

Is this issue still open? If it is, then I would like to give it a try to solve this.

[afshin]

@Nazeeh21 We are primarily trying to fix bugs and maintain the security of the libraries in the notebook repository right now. If you are interested in working on an issue like this (or this exact problem itself), here is a route I would suggest:

1. Check to see if a similar issue exists in JupyterLab
2. That project has a lot more eyes on it and if this issue is not there you could either choose to implement the feature there or pick any other issue to work on (we have plenty labeled "good first issue" or "help wanted").

[yashkumarjha]

We can simply press Ctrl + / combination keys to comment in Windows System.

[dhivyasreedhar]

Hi, can I work on this? I'm new so can someone guide me?

[kevin-bates]

Hi @dhivyasreedhar - please see this https://github.com/jupyter/notebook/issues/1092#issuecomment-875739619 above.