← Back to branch summary

~didrocks/+junk/face-detection-15.04

« back to all changes in this revision

Viewing changes to facedetection/www/bower_components/prism-element/prism-highlighter.html

  • Committer: Didier Roche
  • Date: 2016-05-10 23:09:11 UTC
  • Revision ID: didier.roche@canonical.com-20160510230911-c7xr490zrj3yrzxd
New version

Show diffs side-by-side

added added

removed removed

Lines of Context:
facedetection/www/bower_components/prism-element/prism-highlighter.html
 
1
<!--
 
2
@license
 
3
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
 
4
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 
5
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 
6
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 
7
Code distributed by Google as part of the polymer project is also
 
8
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 
9
-->
 
10
 
 
11
<link rel="import" href="../polymer/polymer.html">
 
12
 
 
13
<link rel="import" href="prism-import.html">
 
14
 
 
15
<!--
 
16
Syntax highlighting via [Prism](http://prismjs.com/).
 
17
 
 
18
Place a `<prism-highlighter>` in your document, preferably as a direct child of
 
19
`<body>`. It will listen for `syntax-highlight` events on its parent element,
 
20
and annotate the code being provided via that event.
 
21
 
 
22
The `syntax-highlight` event's detail is expected to have a `code` property
 
23
containing the source to highlight. The event detail can optionally contain a
 
24
`lang` property, containing a string like `"html"`, `"js"`, etc.
 
25
 
 
26
This flow is supported by [`<marked-element>`](https://github.com/PolymerElements/marked-element).
 
27
-->
 
28
<script>
 
29
(function() {
 
30
 
 
31
  'use strict';
 
32
 
 
33
  var HIGHLIGHT_EVENT = 'syntax-highlight';
 
34
 
 
35
  Polymer({
 
36
 
 
37
    is: 'prism-highlighter',
 
38
 
 
39
    ready: function() {
 
40
      this._handler = this._highlight.bind(this);
 
41
    },
 
42
 
 
43
    attached: function() {
 
44
      (this.parentElement || this.parentNode.host).addEventListener(HIGHLIGHT_EVENT, this._handler);
 
45
    },
 
46
 
 
47
    detached: function() {
 
48
      (this.parentElement || this.parentNode.host).removeEventListener(HIGHLIGHT_EVENT, this._handler);
 
49
    },
 
50
 
 
51
    /**
 
52
     * Handle the highlighting event, if we can.
 
53
     *
 
54
     * @param {!CustomEvent} event
 
55
     */
 
56
    _highlight: function(event) {
 
57
      if (!event.detail || !event.detail.code) {
 
58
        console.warn('Malformed', HIGHLIGHT_EVENT, 'event:', event.detail);
 
59
        return;
 
60
      }
 
61
 
 
62
      var detail = event.detail;
 
63
      detail.code = Prism.highlight(detail.code, this._detectLang(detail.code, detail.lang));
 
64
    },
 
65
 
 
66
    /**
 
67
     * Picks a Prism formatter based on the `lang` hint and `code`.
 
68
     *
 
69
     * @param {string} code The source being highlighted.
 
70
     * @param {string=} lang A language hint (e.g. ````LANG`).
 
71
     * @return {!prism.Lang}
 
72
     */
 
73
    _detectLang: function(code, lang) {
 
74
      if (!lang) {
 
75
        // Stupid simple detection if we have no lang, courtesy of:
 
76
        // https://github.com/robdodson/mark-down/blob/ac2eaa/mark-down.html#L93-101
 
77
        return code.match(/^\s*</) ? Prism.languages.markup : Prism.languages.javascript;
 
78
      }
 
79
 
 
80
      if (lang === 'js' || lang.substr(0, 2) === 'es') {
 
81
        return Prism.languages.javascript;
 
82
      } else if (lang === 'css') {
 
83
        return Prism.languages.css;
 
84
      } else if (lang === 'c') {
 
85
        return Prism.languages.clike;
 
86
      } else {
 
87
        // The assumption is that you're mostly documenting HTML when in HTML.
 
88
        return Prism.languages.markup;
 
89
      }
 
90
    },
 
91
 
 
92
  });
 
93
 
 
94
})();
 
95
</script>