diff --git a/client/bower.json b/client/bower.json index 3f50fae..079aa26 100644 --- a/client/bower.json +++ b/client/bower.json @@ -15,7 +15,9 @@ "angular-toastr": "~1.5.0", "moment": "~2.10.6", "animate.css": "~3.4.0", - "angular": "~1.4.2" + "angular": "~1.4.2", + "highlightjs": "~8.8.0", + "angular-highlightjs": "~0.4.3" }, "devDependencies": { "angular-mocks": "~1.4.2" diff --git a/client/src/app/index.module.js b/client/src/app/index.module.js index de7d269..7bbbaa6 100644 --- a/client/src/app/index.module.js +++ b/client/src/app/index.module.js @@ -9,16 +9,24 @@ import { WebDevTecService } from '../app/components/webDevTec/webDevTec.service' import { NavbarDirective } from '../app/components/navbar/navbar.directive'; import { MalarkeyDirective } from '../app/components/malarkey/malarkey.directive'; import { roboChatMessagesDirective } from './main/robochat.messages.directive'; +import { highlightMessageDirective } from './main/highlight.message.directive'; -angular.module('client', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ngMessages', 'ngAria', 'ui.router', 'ui.bootstrap', 'toastr']) +angular.module('client', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ngMessages', 'ngAria', 'ui.router', 'ui.bootstrap', 'toastr', 'hljs']) .constant('malarkey', malarkey) .constant('moment', moment) .config(config) .config(routerConfig) + .config(function (hljsServiceProvider) { + hljsServiceProvider.setOptions({ + // replace tab with 4 spaces + tabReplace: ' ' + }); + }) .run(runBlock) .service('githubContributor', GithubContributorService) .service('webDevTec', WebDevTecService) .controller('MainController', MainController) .directive('acmeNavbar', NavbarDirective) .directive('acmeMalarkey', MalarkeyDirective) - .directive('robochatMessages', roboChatMessagesDirective); + .directive('robochatMessages', roboChatMessagesDirective) + .directive('highlightMessage',['$compile', highlightMessageDirective]); diff --git a/client/src/app/main/highlight.message.directive.js b/client/src/app/main/highlight.message.directive.js new file mode 100644 index 0000000..07942c0 --- /dev/null +++ b/client/src/app/main/highlight.message.directive.js @@ -0,0 +1,33 @@ +export function highlightMessageDirective( $compile ) { + + return { + scope: { }, + link: function(scope, el, attr) { + var onlyRunOne = scope.$watch( + function(scope) { + return scope.$eval(attr.compile); + }, + function(value) { + var content = el.text(); + var codeParts = content.split("```").filter(function(el) {return el.length != 0}); + var startCode = (content.indexOf("```")==0) + if(codeParts.length>1 || startCode){ + el.html(""); + + codeParts.forEach(function(part, it){ + if(startCode != (it%2)){ + console.log("is Code"); + el.append(""+part+""); + }else{ + el.append(part); + } + console.log(it, part); + }); + $compile(el.contents())(scope); + } + // Angular un-watch + onlyRunOne(); + }); + } + }; +} \ No newline at end of file diff --git a/client/src/app/main/main.jade b/client/src/app/main/main.jade index 33ef628..48c0e75 100644 --- a/client/src/app/main/main.jade +++ b/client/src/app/main/main.jade @@ -22,7 +22,7 @@ div header span.member(data-ng-bind="message.member") span.timestamp(data-ng-bind="message.ts | date:'HH:mm:ss'") - div(data-ng-bind="message.text") + div(ng-bind="message.text" highlight-message="") footer footer textarea(data-ng-model="main.message" ng-keyup="$event.keyCode == 13 && main.post()")