Giter Club home page Giter Club logo

prism's People

Contributors

apfelbox avatar aviaryan avatar bholst avatar cedporter avatar conaclos avatar cupoftea696 avatar dellagustin avatar dependabot[bot] avatar dev-itsheng avatar edukisto avatar golmote avatar hoonweiting avatar hyuchia avatar idleberg avatar leaverou avatar maadhattah avatar mcdurdin avatar milesj avatar nauzilus avatar ravinggenius avatar robfletcher avatar rundevelopment avatar tshedor avatar uranusjr avatar valtlai avatar vitaliyr avatar vkbansal avatar wayward710 avatar westonganger avatar zeitgeist87 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  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  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  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  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  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  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  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

prism's Issues

Autolinker issues

Adding the autolinker plugin from the download page didn't find the links. Only if I add the prism-autolinker.js as a separate file like in the site it works.

language guess / better support for markdown

I really wish I could simply use prism with markdown generated content where you don't get much control of html elements. The way to embed code snippet is usually to just indent the block, which generates pre rather then code :(

Also specifying language is also pain. It would be great if one could specify language in a code snippet itself using shebang for example:

#!/bin/js

function hello(world) {
   // ....
}

And hopefully prism could make sense out of this and highlight code snippets properly. I do smallish hack on my blog to achieve that. This allows me to write markdown that would make sense without syntax highlighter support to:

https://github.com/Gozala/gozala.github.com/blob/master/_posts/JS/2012-04-26-code-logic-not-mechanics.md

Curious about all the hanging pull requests

Just wondering what's going on with all the pull requests piling up?

Just saying because this is such a wonderful project, but seeing requests going unanswered since like 9 months ago is really detrimental about attracting future wannabe contributors.

Lowercase prism

The fact that the Prism global variable is capitalized is confusing, as you would expect it to be a constructor.

Highlight specific lines

With line numbers. That would be cool, and it could be done in the same way as in dabblet. The question is, what should the syntax be.

Options:

  1. data- attributes on the code block
  2. Some token in the beginning of those lines.

The 2nd one is easier for authors, but harder to implement. It can also potentially conflict with the code, if the token is chosen poorly.

Also, to avoid cluttering the Prism source, it might be a good idea to do things like that as a plugin. That means, I should add hooks to Prism that plugins can use.

SCSS Class w/Pseudo Class Misparsed

I have the following using SCSS syntax highlighting:

/*comment*/
.icon:before {
  font-family: 'Icon Font', sans-serif;
  content: 'icon';
}

The .icon is parsed into .<span class="token property">icon</span> producing incorrect highlighting for it.

Point to Homepage in Repo Head

Hey,

it would be nice if people were directed to a place where they can learn more about prism.

Two easy solutions:

    1. Add http://prismjs.com/ as the repo's homepage (when hovering over the description you'll see an 'edit' button)
    1. Add a short readme.

Thanks.
Thomas

Why do not add more tokens to CSS ?

Like you did on Dabblet, why not add more tokens to have a more awesome syntax highlight for CSS ?
You can easily add highlight for unit, hexa, angle, time and easing.
And what about some font-family, & some CSS functions like gradient ?

Publish on npm

This looks like it would be useful to run serverside via node.js. Could you add a package.json and publish on npm?

Highlight links (and mark them usable too)

There can be a lot of links in code — to stylesheets, scripts, images etc. — it would be nice to have them highlighted and be actual links, so you could jump to the associated resources.

However, there can be an issue with relative links — in most cases it wouldn't be obvious to the script what is the base for them. So as a starter, only the absolute links can be the actual links and then there can be an option to set the base url manually (in the pre/code attributes maybe?) and if so, then use it with concatenation with the relative links inside.

determine what language is in use in a callback for the 'wrap' hook

I'm writing a syntax for the Groovy language and having to handle strings in a slightly unusual way. The reason for this is Groovy supports 3 types of string delimiter ', " or /. The 2nd and 3rd forms can contain interpolated expressions (similar to Ruby or CoffeeScript), the single quote form cannot.

I'm trying to highlight the content of the expression but since it's not uncommon for strings to contain other types of delimiter I can't really separate the two into an interpolated and non-interpolated forms. An example of the problem:

'a string "may" contain other delimiters'
"an interpolated string may ${a ? 'contain' : 'include'} delimiters in an expression"

If I create separate tokens for the single and double quoted forms one or other of these examples would fail to highlight properly depending on which token is evaluated first.

The solution I've come up with is to use a wrap callback to call Prism.highlight again on string tokens if the delimiter is " or /. This works great for Groovy but has the unfortunate side-effect of applying to any language. If it was possible to determine the current language syntax in the wrap callback I could prevent this.

My syntax definition is here

Of course, I'm open to suggestions of other ways to handle this. It does feel kind of like a hack to use a hook to do this.

Add the entity as a symbol in token's title attribute

There can be small, but useful enhancement: we can add the parsed entity as a symbol to the title attribute of it's token. So if we'd have &amp;amp; in code, it would become <span class="token entity" title="&amp;">&amp;amp;</span> etc.

Autolinker doesn't work when async is enabled

Autolinker plugin works when async is disabled, but it dosn't work when I enable async.

I'm using Firefox 17.

Console's output:
window is not defined - prism.js:10

When I remove the "if(!window.Prism)return;" condition from Autolinker, it works.
Is this a bug or I'm missing something?

CSS * hacks don't display

Hi there!

This is not a huge problem (maybe it has already been discussed) but it seems that prism strips off some CSS "hacks", like the asterix (*) in front of properties.

*display: inline

becomes

display: inline

It would by nice to really see those back in the presented code. But then again, one could argue that prism is supposed to be given valid CSS, not hacks and stuff.

Just mentioning it. :)

Jelmer

Showing invisible characters

While this can be easy, but there are few issues to thought on:

  • Do we need to highlight all the special characters like tab symbol? While highlighting the non-breakable spaces would be always good, highlighting the tabs would be trashy for indentations that use them.
  • Do we need to highlight line breaks or any other special white-space symbols?
  • Can we do the highlighting of such symbols only on the text selection like it can be done in the Sublime Text?

Namespace/prefix all the classes?

As the Prism can be embedded in different environments, there could be already any of the class names that Prism uses, like tag, token, number etc. So it's possible that those styles would override or change Prism's.

The usual way to fix that is to use some prefix for all the classes used in Prism, so we can add the prism- prefix to all those classes: prism-tag, prism-token, prism-number etc.

I can't see any serious drawbacks, the gzip would cover neglect all the added prefixes.

IE8 support discussion

I understand a decision has been made not to support these browsers. Your blog post mentioned nothing would break in IE8, though — would you be open to updating Prism.js so it doesn’t throw errors in IE6?

(I quickly “tested” this by opening prismjs.com in IE6, so perhaps the issue is not in Prism.js at all — but either way it would be nice to have this mentioned on the home page.)

Python syntax highlighter

I'm not sure what the easiest way to get to a Python highlighter is.

I don't have any experience writing one of these but I can try if nobody else is.

SCSS parser fails lots of common declarations

I'm finding that the SCSS parser is failing on lots of fairly standard declarations. For instance, media queries with a media type (@media screen… fails to highlight the @media), lots of sibling selectors fail to highlight the first half of the selector (.foo > .bar fails to highlight .foo), and absolutely no numbers (or their units) get properly highlighted.

Nested tokens?

Hello! First of all, Prism is six kinds of miraculous. Thanks, Lea.

Secondly: is it possible to have nested tokens? For example, given the following:

# Hello, I suppose _this_ is an option.

Would it be possible to produce

<span class="token hed"># Hello, I suppose <span class="token em">_this_</span> is an option.</span>

Did a couple quick tests, and it seemed as though Prism applies the first token defined in the relevant languages.* object, and disregards the second. But I could be wrong.

So, before I go messing with my probably broken regexes, does Prism recurse at all? Thanks!

Option to show the language that is highlighted

For big code blocks it would be nice to have somewhere a badge or any other sign of what the language is in there. While it can be obvious in most cases, for some languages it would be better to show this information.

As a suggestion of the possible design — put the name of the current language in the top right corner as a backgound. However, it would need an extra markup to have it don't scroll with the content of the code block. But if it's acceptable, then it can be done by plain CSS with pseudo-element.

Add a markdown syntax highlighter

I'm working on a project for offline markdown editing, and I'm totally willing to change the highlighting system for prism.

I'm suggesting a code highlighting for markdown. Probably I will end up implementing this one :)

Thanks

Make Autolinker escape URLs with ambiguous characters

Some websites use certain characters in their shortened links that Autolinker doesn't seem to understand. In my case I have trouble with a shortened Forrst url, http://forr.st/~IW5 to be specific.

Autolinker will only generate a link for the part before the tilde. Using a tilde in a URL seems like a bad practice to me and I don't think Autolinker should support this by default. However, there should be a way to escape problematic URLs.

Perhaps using quotes, simple as that?

Doesn't work if prism is asynchronously loaded

If prism is loaded asynchronously then it doesn't highlight any code. It appears because it is being loaded after DOMContentLoaded event has already fired.

Damn shame this does not work out of the box as I would definitely like this kind of thing loaded asynchronously as it's (technically) non-essential and a discrete piece of functionality.

Any help much appreciated

A CSS/base64 sample hung Safari/Mac

Probably not totally unexpected, but this code sample:

<pre><code class="language-css">#nav li:after {
    content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAI0lEQVQIW24//8/w8yZM//DMIjPAGPAMIiPWxCIMQQxzAQAoFpF7lGFr24AAAAASUVORK5CYII=);
}</code></pre>

… caused the Safari Web Content process to freak out. Removing the class eliminated the issue.

(line-highlight) Bug in Safari if no line-height set on pre tag

If the pre tag doesnt have a line-height then getComputedStyle returns "normal" which cannot be parsed as a float and causes the lines and highlight to be placed underneath the code.

not sure how best to solve that except by including a default line-height in the stylesheets that come with prism and adding a little comment in the files to help warn users.

tested with Safari 5.0.6 on Leopard.

HTML Syntax Highlighting Broken

I've got the following code block:

<pre><code class="language-html">&lt;body&gt;
  &lt;div class="main"&gt;Main Section&lt;/div&gt;
  &lt;div class="first"&gt;First Section&lt;/div&gt;
  &lt;div class="second"&gt;Second Section&lt;/div&gt;
&lt;/body&gt;</code></pre>

Doing so doesn't even trigger Prism's standard adding language class to the <pre> element, nonetheless syntax highlighting it. Any ideas?

line highlight error in Chromium (Webkit?)

Got some trouble with the absolute positioning in Chromium and Opera for Ubuntu Linux.

The code is styled correctly and looks like this. But then for the syntax highlighting looks like this, as you can see the Highlight area is inserted as supposed but it clear itself. The theme is not modified from what the site provides.

I tried this also without any of my site's styles and the problem persists, even with the default theme; so I'm forced to conclude it may be a bug in the prism theme styles or a style clash with Chromium/Webkit/Opera maybe? the problem does not appear in Firefox.

My build includes only the line highlight plugin and excludes Java syntax.

Help to solve or work-around this is most appreciated.

Thanks!

[Update] I just found out that div.line-highlight element is not given the style attribute in Chromium and Opera. So that kindof points to the JS part of Prism.

Namespace class names

Like several other syntax highlighters, the classes it uses (e.g. comment) are not namespaced, which significantly increases the chances of them clashing with author styles of equal or greater specificity. Would be great if all those classes used in theming could be namespaced.

Uncaught TypeError

Hi,

I just downloaded prism and added them to my Wordpress site.

I downloaded the minified version.

Right now Chrome is throwing me an error "Uncaught TypeError: object is not a function" on line 10.

Do you have any idea why it is throwing an error?

Build step

I can't find a way to compile the files in components/ to the prism.js file. How is this generally done?

If I would add a build step with grunt or a make file, would you consider integrating that?

Don't run highlightAll by default

I think it would be nice and a bit cleaner if running highlightAll by default would be enabled through a plugin or setting.

I want to include Prism in my app JavaScript bundle, and not with a script tag, so the data-manual approach isn't very convenient. It also feels a bit weird for a third party script to automatically do things just by being included.

Matching string literals earlier in CSS language definition

Hi Lea,

I found in the case of quoted data-uris the property matching conflicts with the string matching:

ul li {
  background-image: url("data:image/png;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==");
}

Currently matches the 'data:' part as a property, and doesn't match the string. Moving the string literal match earlier fixes this:

    Prism.languages.css = {
        'comment': /\/\*[\w\W]*?\*\//g,
        'string': /("|')(\\?.)*?\1/g,
        'atrule': /@[\w-]+?(\s+.+)?(?=\s*{|\s*;)/gi,
        'selector': /[^\{\}\s][^\{\}]*(?=\s*\{)/g,
        'property': /(\b|\B)[a-z-]+(?=\s*:)/ig,
        'important': /\B!important\b/gi,
        'ignore': /&(lt|gt|amp);/gi,
        'punctuation': /[\{\};:]/g
    };

I imagine having the string matching earlier may resolve some other edge cases too.

Issue with bold in monospace

There is a minor issue, but it bugs me since I saw it: when you use the bold in the blocks with monospace font, the bold letters brake the vertical monospace grid, 'cause they're wider.

Maybe it's not in every font, so this issue must be researched more widely, but the easiest fix if it the same for everyone is adding letter-spacing: -1px for all the bold tokens. But, again, we must assure that this issue reproduces for all the fonts in our monospace font stack.

I can surely say that it reproduces for Monaco on Mac.

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.