add extjs 6.0.1 sources

[extjs.git] / extjs / examples / kitchensink / modern / src / view / SourceItem.js

Ext.define('KitchenSink.view.SourceItem', {\r
    extend: 'Ext.Panel',\r
    xtype: 'sourceitem',\r
\r
    config: {\r
        cls: 'ux-code',\r
        styleHtmlContent: true,\r
        scrollable: true\r
    },\r
\r
    exampleRe: /^\s*\/\/\s*(\<\/?example\>)\s*$/,\r
\r
    clearExampleTags: function (text) {\r
        var lines = text.split('\n'),\r
            removing = false,\r
            keepLines = [],\r
            len = lines.length,\r
            exampleRe = this.exampleRe,\r
            i, line;\r
\r
        for (i = 0; i < len; ++i) {\r
            line = lines[i];\r
            if (removing) {\r
                if (exampleRe.test(line)) {\r
                    removing = false;\r
                }\r
            } else if (exampleRe.test(line)) {\r
                removing = true;\r
            } else {\r
                keepLines.push(line);\r
            }\r
        }\r
\r
        return keepLines.join('\n');\r
    },\r
\r
    applyHtml: function(html) {\r
        html = this.clearExampleTags(html);\r
        this.matches = [];\r
\r
        var v   = html,\r
            fmt = '<span class="ux-code-{0}">{1}</span>';\r
\r
        var between = Ext.Function.bind(function(idx, length) {\r
            for (var i = 0; i < this.matches.length; i++){\r
                var m = this.matches[i],\r
                    s = m[0],\r
                    e = m[1];\r
                /*if (s <= idx && (idx + length) <= e){\r
                    return true;\r
                }*/\r
                if ((s <= idx && idx < e) || (s < (idx + length) && (idx + length) <= e)){\r
                    return true;\r
                }\r
            }\r
            return false;\r
        }, this);\r
\r
        var highlight = Ext.Function.bind(function(str, regex, cls, fn){\r
            regex.compile(regex);\r
            var match;\r
\r
            while (match = regex.exec(str)) {\r
                var mdata = fn ? fn(match) : [match.index, match[0]],\r
                    midx = mdata[0],\r
                    mstr = mdata[1];\r
                if (!between(midx, mstr.length)){\r
                    var replacement = Ext.util.Format.format(fmt, cls, mstr),\r
                        diff = (replacement.length - mstr.length);\r
                    str = str.slice(0, midx) + replacement + str.slice(midx + mstr.length);\r
                    regex.lastIndex = midx + replacement.length;\r
                    for (var i = 0; i < this.matches.length; i++){\r
                        var m = this.matches[i];\r
                        if (m[1] < midx) continue;\r
\r
                        m[0] += diff;\r
                        m[1] += diff;\r
                    }\r
                    this.matches.push([midx, regex.lastIndex]);\r
                }\r
                else {\r
                    break;\r
                }\r
            }\r
            return str;\r
        }, this);\r
\r
        // Escape HTML...whatever\r
\r
        // var htmlRE = /<((.|\w)*)>/ig, match;\r
        // while (match = htmlRE.exec(v)) {\r
            // v = v.slice(0, match.index) + Ext.util.Format.format('&lt;{0}&gt;', match[1]) + v.slice(match.index + match[0].length);\r
        // }\r
\r
        v = v.replace(/</g, '&lt;');\r
        v = v.replace(/</g, '&gt;');\r
\r
        // Block comments\r
        v = highlight(v, /\/\*(.|\s)*?\*\//ig, 'comment');\r
\r
        // String literals\r
        v = highlight(v, (/("|')[^\1\n\r]*?\1/ig), 'string');\r
\r
        // Line comments\r
        v = highlight(v, /\/\/[^\n\r]*/ig, 'comment');\r
\r
        // Function names\r
        v = highlight(v, /(\w+)\s*\:\s*function/ig, 'function', function(match){\r
            return [match.index, match[1]];\r
        });\r
\r
        v = highlight(v, /function (\w+)/ig, 'function', function(match){\r
            return [match.index + 9, match[1]];\r
        });\r
\r
        // Keywords\r
        v = highlight(v, /\b(this|function|null|return|true|false|new|int|float|break|const|continue|delete|do|while|for|in|switch|case|throw|try|catch|typeof|instanceof|var|void|with|yield|if|else)\b/ig, 'keyword');\r
\r
        // Operators\r
        v = highlight(v, /\.|\,|\:|\;|\=|\+|\-|\&|\%|\*|\/|\!|\?|\<|\>|\||\^|\~/ig, 'operator');\r
\r
        return '<pre>' + v + '</pre>';\r
    }\r
});