Cross.Team | Code mirror

Code Editor - Basic example

CodeMirror is a versatile text editor implemented in JavaScript for the browser. It is specialized for editing code, and comes with a number of language modes and addons that implement more advanced editing functionality.

 
<script>
    // Code goes here
​
    // For demo purpose - animation css script
    function animationHover(element, animation){
        element = $(element);
        element.hover(
                function(){
                    element.addClass('animated ' + animation);
                },
                function(){
                    //wait for animation to finish before removing classes
                    window.setTimeout( function(){
                        element.removeClass('animated ' + animation);
                    }, 2000);
                });
    }
</script>
​

Code Editor - Theme Example

A rich programming API and a CSS theming system are available for customizing CodeMirror to fit your application, and extending it with new functionality. For mor info go to http://codemirror.net/

 
    var SpeechApp = angular.module('SpeechApp', []);
​
    function VoiceCtrl($scope)
​
        $scope.said='...';
​
        $scope.helloWorld = function()
            $scope.said = "Hello world!";
        }
​
        $scope.commands =
            'hello (world)': function()
                if (typeof console !== "undefined") console.log('hello world!')
                $scope.$apply($scope.helloWorld);
            },
            'hey': function()
                if (typeof console !== "undefined") console.log('hey!')
                $scope.$apply($scope.helloWorld);
            }
        };
​
        annyang.debug();
        annyang.init($scope.commands);
        annyang.start();
    }
​

Code Editor - Code Mirror

Code Editor - Basic example

Code Editor - Theme Example