I have a really nice javascript code highlighter for forums I found which works perfectly except that it will only highlight 1 language at a time for example if I specify php and there is html and css also in that php code, only the php code gets highlight and it will only allow you to specify 1 coding language at a timeI figured out that the highlighter has a function to also highlight the html along with the php so thats fixed except that the css is still not highlighted so after looking at how this javascript system works I changed the javascript file that highlights the html to also highlight the css by combining the two files togethercss file
/*** SyntaxHighlighter* http://alexgorbatchev.com/SyntaxHighlighter** SyntaxHighlighter is donationware. If you are using it, please donate.* http://alexgorbatchev.com/SyntaxHighlighter/donate.html** @version* 3.0.83 (July 02 2010)** @copyright* Copyright (C) 2004-2010 Alex Gorbatchev.** @license* Dual licensed under the MIT and GPL licenses.*/;(function(){// CommonJStypeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;[/font][font=Verdana, sans-serif]function Brush(){ function getKeywordsCSS(str) { return '\\b([a-z_]|)' + str.replace(/ /g, '(?=\\b|\\b([a-z_\\*]|\\*|)') + '(?=\\b'; }; function getValuesCSS(str) { return '\\b' + str.replace(/ /g, '(?!-)(?!\\b|\\b()') + '\:\\b'; };[/font][font=Verdana, sans-serif] var keywords = 'ascent azimuth background-attachment background-color background-image background-position ' + 'background-repeat background baseline bbox border-collapse border-color border-spacing border-style border-top ' + 'border-right border-bottom border-left border-top-color border-right-color border-bottom-color border-left-color ' + 'border-top-style border-right-style border-bottom-style border-left-style border-top-width border-right-width ' + 'border-bottom-width border-left-width border-width border bottom cap-height caption-side centerline clear clip color ' + 'content counter-increment counter-reset cue-after cue-before cue cursor definition-src descent direction display ' + 'elevation empty-cells float font-size-adjust font-family font-size font-stretch font-style font-variant font-weight font ' + 'height left letter-spacing line-height list-style-image list-style-position list-style-type list-style margin-top ' + 'margin-right margin-bottom margin-left margin marker-offset marks mathline max-height max-width min-height min-width orphans ' + 'outline-color outline-style outline-width outline overflow padding-top padding-right padding-bottom padding-left padding page ' + 'page-break-after page-break-before page-break-inside pause pause-after pause-before pitch pitch-range play-during position ' + 'quotes right richness size slope src speak-header speak-numeral speak-punctuation speak speech-rate stemh stemv stress ' + 'table-layout text-align top text-decoration text-indent text-shadow text-transform unicode-bidi unicode-range units-per-em ' + 'vertical-align visibility voice-family volume white-space widows width widths word-spacing x-height z-index';[/font][font=Verdana, sans-serif] var values = 'above absolute all always aqua armenian attr aural auto avoid baseline behind below bidi-override black blink block blue bold bolder '+ 'both bottom braille capitalize caption center center-left center-right circle close-quote code collapse compact condensed '+ 'continuous counter counters crop cross crosshair cursive dashed decimal decimal-leading-zero default digits disc dotted double '+ 'embed embossed e-resize expanded extra-condensed extra-expanded fantasy far-left far-right fast faster fixed format fuchsia '+ 'gray green groove handheld hebrew help hidden hide high higher icon inline-table inline inset inside invert italic '+ 'justify landscape large larger left-side left leftwards level lighter lime line-through list-item local loud lower-alpha '+ 'lowercase lower-greek lower-latin lower-roman lower low ltr marker maroon medium message-box middle mix move narrower '+ 'navy ne-resize no-close-quote none no-open-quote no-repeat normal nowrap n-resize nw-resize oblique olive once open-quote outset '+ 'outside overline pointer portrait pre print projection purple red relative repeat repeat-x repeat-y rgb ridge right right-side '+ 'rightwards rtl run-in screen scroll semi-condensed semi-expanded separate se-resize show silent silver slower slow '+ 'small small-caps small-caption smaller soft solid speech spell-out square s-resize static status-bar sub super sw-resize '+ 'table-caption table-cell table-column table-column-group table-footer-group table-header-group table-row table-row-group teal '+ 'text-bottom text-top thick thin top transparent tty tv ultra-condensed ultra-expanded underline upper-alpha uppercase upper-latin '+ 'upper-roman url visible wait white wider w-resize x-fast x-high x-large x-loud x-low x-slow x-small x-soft xx-large xx-small yellow';[/font][font=Verdana, sans-serif] var fonts = '[mM]onospace [tT]ahoma [vV]erdana [aA]rial [hH]elvetica [sS]ans-serif [sS]erif [cC]ourier mono sans serif'; this.regexList = [ { regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments { regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // double quoted strings { regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // single quoted strings { regex: /\#[a-fA-F0-9]{3,6}/g, css: 'value' }, // html colors { regex: /(-?\d+)(\.\d+)?(px|em|pt|\:|\%|)/g, css: 'value' }, // sizes { regex: /!important/g, css: 'color3' }, // !important { regex: new RegExp(getKeywordsCSS(keywords), 'gm'), css: 'keyword' }, // keywords { regex: new RegExp(getValuesCSS(values), 'g'), css: 'value' }, // values { regex: new RegExp(this.getKeywords(fonts), 'g'), css: 'color1' } // fonts ];[/font][font=Verdana, sans-serif] this.forHtmlScript({ left: /(<|<)\s*style.*?(>|>)/gi, right: /(<|<)\/\s*style\s*(>|>)/gi });};[/font][font=Verdana, sans-serif]Brush.prototype = new SyntaxHighlighter.Highlighter();Brush.aliases = ['css'];[/font][font=Verdana, sans-serif]SyntaxHighlighter.brushes.CSS = Brush;[/font][font=Verdana, sans-serif]// CommonJStypeof(exports) != 'undefined' ? exports.Brush = Brush : null;})();[/font][font=Verdana, sans-serif]
and the normal html file
/*** SyntaxHighlighter* http://alexgorbatchev.com/SyntaxHighlighter** SyntaxHighlighter is donationware. If you are using it, please donate.* http://alexgorbatchev.com/SyntaxHighlighter/donate.html** @version* 3.0.83 (July 02 2010)** @copyright* Copyright (C) 2004-2010 Alex Gorbatchev.** @license* Dual licensed under the MIT and GPL licenses.*/;(function(){// CommonJStypeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;[/font][font=Verdana, sans-serif]function Brush(){ function process(match, regexInfo) { var constructor = SyntaxHighlighter.Match, code = match[0], tag = new XRegExp('(<|<)[\\s\\/\\?]*(?<name>[:\\w-\\.]+)', 'xg').exec(code), result = [] ; if (match.attributes != null) { var attributes, regex = new XRegExp('(?<name> [\\w:\\-\\.]+)' + '\\s*=\\s*' + '(?<value> ".*?"|\'.*?\'|\\w+)', 'xg');[/font][font=Verdana, sans-serif] while ((attributes = regex.exec(code)) != null) { result.push(new constructor(attributes.name, match.index + attributes.index, 'color1')); result.push(new constructor(attributes.value, match.index + attributes.index + attributes[0].indexOf(attributes.value), 'string')); } }[/font][font=Verdana, sans-serif] if (tag != null) result.push( new constructor(tag.name, match.index + tag[0].indexOf(tag.name), 'keyword') );[/font][font=Verdana, sans-serif] return result; } this.regexList = [ { regex: new XRegExp('(\\<|<)\\!\\[[\\w\\s]*?\\[(.|\\s)*?\\]\\](\\>|>)', 'gm'), css: 'color2' }, // <![ ... [ ... ]]> { regex: SyntaxHighlighter.regexLib.xmlComments, css: 'comments' }, // <!-- ... --> { regex: new XRegExp('(<|<)[\\s\\/\\?]*(\\w+)(?<attributes>.*?)[\\s\\/\\?]*(>|>)', 'sg'), func: process } ];};[/font][font=Verdana, sans-serif]Brush.prototype = new SyntaxHighlighter.Highlighter();Brush.aliases = ['xml', 'xhtml', 'xslt', 'html'];[/font][font=Verdana, sans-serif]SyntaxHighlighter.brushes.Xml = Brush;[/font][font=Verdana, sans-serif]// CommonJStypeof(exports) != 'undefined' ? exports.Brush = Brush : null;})();[/font][font=Verdana, sans-serif]
and this is what I came up with for the html file that effectively highlights html and css
/*** SyntaxHighlighter* http://alexgorbatchev.com/SyntaxHighlighter** SyntaxHighlighter is donationware. If you are using it, please donate.* http://alexgorbatchev.com/SyntaxHighlighter/donate.html** @version* 3.0.83 (July 02 2010)** @copyright* Copyright (C) 2004-2010 Alex Gorbatchev.** @license* Dual licensed under the MIT and GPL licenses.*/;(function(){// CommonJStypeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;function Brush(){ function getKeywordsCSS(str) { return '\\b([a-z_]|)' + str.replace(/ /g, '(?=\\b|\\b([a-z_\\*]|\\*|)') + '(?=\\b'; }; function getValuesCSS(str) { return '\\b' + str.replace(/ /g, '(?!-)(?!\\b|\\b()') + '\:\\b'; }; var keywords = 'ascent azimuth background-attachment background-color background-image background-position ' + 'background-repeat background baseline bbox border-collapse border-color border-spacing border-style border-top ' + 'border-right border-bottom border-left border-top-color border-right-color border-bottom-color border-left-color ' + 'border-top-style border-right-style border-bottom-style border-left-style border-top-width border-right-width ' + 'border-bottom-width border-left-width border-width border bottom cap-height caption-side centerline clear clip color ' + 'content counter-increment counter-reset cue-after cue-before cue cursor definition-src descent direction display ' + 'elevation empty-cells float font-size-adjust font-family font-size font-stretch font-style font-variant font-weight font ' + 'height left letter-spacing line-height list-style-image list-style-position list-style-type list-style margin-top ' + 'margin-right margin-bottom margin-left margin marker-offset marks mathline max-height max-width min-height min-width orphans ' + 'outline-color outline-style outline-width outline overflow padding-top padding-right padding-bottom padding-left padding page ' + 'page-break-after page-break-before page-break-inside pause pause-after pause-before pitch pitch-range play-during position ' + 'quotes right richness size slope src speak-header speak-numeral speak-punctuation speak speech-rate stemh stemv stress ' + 'table-layout text-align top text-decoration text-indent text-shadow text-transform unicode-bidi unicode-range units-per-em ' + 'vertical-align visibility voice-family volume white-space widows width widths word-spacing x-height z-index'; var values = 'above absolute all always aqua armenian attr aural auto avoid baseline behind below bidi-override black blink block blue bold bolder '+ 'both bottom braille capitalize caption center center-left center-right circle close-quote code collapse compact condensed '+ 'continuous counter counters crop cross crosshair cursive dashed decimal decimal-leading-zero default digits disc dotted double '+ 'embed embossed e-resize expanded extra-condensed extra-expanded fantasy far-left far-right fast faster fixed format fuchsia '+ 'gray green groove handheld hebrew help hidden hide high higher icon inline-table inline inset inside invert italic '+ 'justify landscape large larger left-side left leftwards level lighter lime line-through list-item local loud lower-alpha '+ 'lowercase lower-greek lower-latin lower-roman lower low ltr marker maroon medium message-box middle mix move narrower '+ 'navy ne-resize no-close-quote none no-open-quote no-repeat normal nowrap n-resize nw-resize oblique olive once open-quote outset '+ 'outside overline pointer portrait pre print projection purple red relative repeat repeat-x repeat-y rgb ridge right right-side '+ 'rightwards rtl run-in screen scroll semi-condensed semi-expanded separate se-resize show silent silver slower slow '+ 'small small-caps small-caption smaller soft solid speech spell-out square s-resize static status-bar sub super sw-resize '+ 'table-caption table-cell table-column table-column-group table-footer-group table-header-group table-row table-row-group teal '+ 'text-bottom text-top thick thin top transparent tty tv ultra-condensed ultra-expanded underline upper-alpha uppercase upper-latin '+ 'upper-roman url visible wait white wider w-resize x-fast x-high x-large x-loud x-low x-slow x-small x-soft xx-large xx-small yellow'; var fonts = '[mM]onospace [tT]ahoma [vV]erdana [aA]rial [hH]elvetica [sS]ans-serif [sS]erif [cC]ourier mono sans serif'; function process(match, regexInfo) { var constructor = SyntaxHighlighter.Match, code = match[0], tag = new XRegExp('(<|<)[\\s\\/\\?]*(?<name>[:\\w-\\.]+)', 'xg').exec(code), result = [] ; if (match.attributes != null) { var attributes, regex = new XRegExp('(?<name> [\\w:\\-\\.]+)' + '\\s*=\\s*' + '(?<value> ".*?"|\'.*?\'|\\w+)', 'xg'); while ((attributes = regex.exec(code)) != null) { result.push(new constructor(attributes.name, match.index + attributes.index, 'color1')); result.push(new constructor(attributes.value, match.index + attributes.index + attributes[0].indexOf(attributes.value), 'string')); } } if (tag != null) result.push( new constructor(tag.name, match.index + tag[0].indexOf(tag.name), 'keyword') ); return result; } this.regexList = [ { regex: new XRegExp('(\\<|<)\\!\\[[\\w\\s]*?\\[(.|\\s)*?\\]\\](\\>|>)', 'gm'), css: 'color2' }, // <![ ... [ ... ]]> { regex: SyntaxHighlighter.regexLib.xmlComments, css: 'comments' }, // <!-- ... --> { regex: new XRegExp('(<|<)[\\s\\/\\?]*(\\w+)(?<attributes>.*?)[\\s\\/\\?]*(>|>)', 'sg'), func: process }, { regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments { regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // double quoted strings { regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // single quoted strings { regex: /\#[a-fA-F0-9]{3,6}/g, css: 'value' }, // html colors { regex: /(-?\d+)(\.\d+)?(px|em|pt|\:|\%|)/g, css: 'value' }, // sizes { regex: /!important/g, css: 'color3' }, // !important { regex: new RegExp(getKeywordsCSS(keywords), 'gm'), css: 'keyword' }, // keywords { regex: new RegExp(getValuesCSS(values), 'g'), css: 'value' }, // values { regex: new RegExp(this.getKeywords(fonts), 'g'), css: 'color1' } // fonts ]; this.forHtmlScript({ left: /(<|<)\s*style.*?(>|>)/gi, right: /(<|<)\/\s*style\s*(>|>)/gi });};Brush.prototype = new SyntaxHighlighter.Highlighter();Brush.aliases = ['xml', 'xhtml', 'xslt', 'html', 'css'];SyntaxHighlighter.brushes.Xml = Brush;// CommonJStypeof(exports) != 'undefined' ? exports.Brush = Brush : null;})();
my problem is now I would like it to highlight javascript as well as the other 2 at the same time but by my attempts to combine this one in with the other 2 keeps failing and I can not figure out how to get it to work as I am not pro with javascriptthis is the javascript highlighting file
/*** SyntaxHighlighter* http://alexgorbatchev.com/SyntaxHighlighter** SyntaxHighlighter is donationware. If you are using it, please donate.* http://alexgorbatchev.com/SyntaxHighlighter/donate.html** @version* 3.0.83 (July 02 2010)** @copyright* Copyright (C) 2004-2010 Alex Gorbatchev.** @license* Dual licensed under the MIT and GPL licenses.*/;(function(){// CommonJStypeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;function Brush(){ var keywords = 'break case catch continue ' + 'default delete do else false ' + 'for function if in instanceof ' + 'new null return super switch ' + 'this throw true try typeof var while with' ; var r = SyntaxHighlighter.regexLib; this.regexList = [ { regex: r.multiLineDoubleQuotedString, css: 'string' }, // double quoted strings { regex: r.multiLineSingleQuotedString, css: 'string' }, // single quoted strings { regex: r.singleLineCComments, css: 'comments' }, // one line comments { regex: r.multiLineCComments, css: 'comments' }, // multiline comments { regex: /\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion { regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' } // keywords ]; this.forHtmlScript(r.scriptScriptTags);};Brush.prototype = new SyntaxHighlighter.Highlighter();Brush.aliases = ['js', 'jscript', 'javascript'];SyntaxHighlighter.brushes.JScript = Brush;// CommonJStypeof(exports) != 'undefined' ? exports.Brush = Brush : null;})();
my problem is that with
this.forHtmlScript(r.scriptScriptTags);
is needed to get the javascript to highlight correctly but to also get the css to highlight correctly you need
this.forHtmlScript({ left: /(<|<)\s*style.*?(>|>)/gi, right: /(<|<)\/\s*style\s*(>|>)/gi });[/font][font=Verdana, sans-serif]
and using both at the same time breaks the code an combining either of them together fails and I cannot figure this outcan anyone help me with this?