'use strict';

angular.module('gisto.directive.editor', []).directive('editor', ['$timeout', 'appSettings', function ($timeout, appSettings) {
    return {
        restrict: 'E',
        template: '<div ng-if="showmd" class="special-editor-markdown" ng-bind-html="file.content | markDown"></div>' +
        '<pre id="editor-{{$index}}" class="editor">{{file.content}}</pre>' +
        '<div data-ng-if="editor_ext.statusbar" id="statusBar-{{$index}}"><i class="icon-info-sign"></i> </div>',
        link: function ($scope, $element, $attrs) {
            $scope.showmd = false;
            if ($attrs.language === 'markdown') {
                $scope.showmd = true;
            }


            appSettings.loadSettings().then(function (appSettingsResult) {

                $timeout(function () {

                    var lang = $attrs.language,
                        font = parseInt(appSettingsResult.font_size),
                        indexed = $attrs.index,
                        editor = ace.edit($element.find('.editor')[0]),
                        session = editor.getSession(),
                        theme = $attrs.theme,
                        inUpdateProcess = false;

                    // Emmet
                    if (lang === 'html' && appSettingsResult.editor_ext.emmet) {
                        console.log('Emmet should be loaded');
                        ace.require("ace/ext/emmet");
                        editor.setOptions({
                            enableEmmet: true
                        });
                    } else {
                        editor.setOptions({
                            enableEmmet: false
                        });
                    }

                    // Auto-completion
                    if (appSettingsResult.editor_ext.emmet) {
                        console.log('language tools should be loaded');
                        ace.require("ace/ext/language_tools");
                        editor.setOptions({
                            enableBasicAutocompletion: true,
                            enableSnippets: true
                        });
                    }
                    // Status bar
                    if (appSettingsResult.editor_ext.statusbar) {
                        var StatusBar = ace.require('ace/ext/statusbar').StatusBar;
                        var statusBar = new StatusBar(editor, document.getElementById('statusBar-' + $attrs.index));
                    }

                    // VIM mode
                    if(appSettingsResult.editor_vim_mode) {
                        editor.setKeyboardHandler("ace/keyboard/vim");
                    }

                    // word wrap
                    if(appSettingsResult.editor_word_wrap) {
                        editor.getSession().setUseWrapMode(true);
                    }

                    editor.setTheme("ace/theme/" + theme);
                    editor.getSession().setMode("ace/mode/" + lang);
                    editor.setFontSize(font);
                    editor.setShowPrintMargin(false);
                    editor.renderer.setShowGutter(true);
                    editor.setAutoScrollEditorIntoView(true);
                    var maxLinesSettings = appSettingsResult.max_lines.toString();
                    var minLinesSettings = (appSettingsResult.min_lines !== 0) ? appSettingsResult.min_lines.toString() : editor.session.getLength().toString();
                    editor.setOption("maxLines", maxLinesSettings);
                    editor.setOption("minLines", minLinesSettings);
                    editor.resize(true);

                    console.log('language:', lang);
                    console.log('Theme:', theme);
                    console.log('Font size:', font);
                    console.log('renderer.lineHeight', editor.renderer.lineHeight);
                    console.log('# of LINES', editor.session.getLength());
                    console.log('max_lines', appSettingsResult.max_lines);
                    console.log('min_lines', appSettingsResult.min_lines);


                    editor.on('paste', function(text) {
                        // delay the change event to the end of the call stack
                        // and fire a change event with an extra parameter indicating
                        // that this is a paste event and continue to update the reference
                        // to angular file model.
                        $timeout(function() {
                            editor._emit('change', {target: editor, pasteEvent: true});
                        },0);

                    });

                    editor.on('change', function (data) {

                        // change coming from manually changing the value using the api
                        // skip the update
                        if (inUpdateProcess) {
                            return;
                        }

                        // only react to user actions
                        if (data.pasteEvent || editor.curOp && editor.curOp.command.name) {
                            $scope.$apply(function () {
                                $scope.file.content = editor.getValue();
                                if (!$scope.edit) {
                                    $scope.enableEdit();
                                }
                            });
                        }
                    });

                    // listen to ngModel render and update the session
                    $scope.$on('ace-update', function (e, updatedFile) {
                        if ($scope.file.filename === updatedFile) {
                            inUpdateProcess = true;
                            session.setValue($scope.file.content);
                            inUpdateProcess = false;
                        }
                    });


                }, 0);
            });
        }

    };
}]);
@@ -371,123 +371,8 @@
 re%3E'
- +%0A        '%3Cdiv data-ng-if=%22editor_ext.statusbar%22 id=%22statusBar-%7B%7B$index%7D%7D%22%3E%3Ci class=%22icon-info-sign%22%3E%3C/i%3E %3C/div%3E'
 ,%0A  
@@ -2117,24 +2117,193 @@
 tatusbar) %7B%0A
+                        var statusBarElement = angular.element('%3Cdiv%3E%3Ci class=%22icon-info-sign%22%3E%3C/i%3E %3C/div%3E');%0A                        $element.append(statusBarElement);%0A
             
@@ -2401,24 +2401,8 @@
     
- var statusBar =
  new
@@ -2424,60 +2424,27 @@
 or, 
-document.getElementById('statusBar-' + $attrs.index)
+statusBarElement%5B0%5D
 );%0A 

Fix ace statusbar html not loading when status bar is on ref: #147