code-einbinden.php
Quell Code
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
<style>
.editor {
height: 100%;
width: 80%;
position: fixed;
z-index: 0;
}
.editor .ace_editor {
overflow: hidden;
position:relative;
height: 100%;
width: 100%;
}
.editor .ace_editor .ace_scrollbar-v {
display: none;
}
.dg.ac {
position: fixed;
z-index: 5;
}
.dg .c select {
color: #000;
}
</style>
<div class="editor" ng-app="app" ng-controller="ctrl" ng-class="{'split':editor.splitMode}">
<div ng-style="{opacity:editor.opacity*.01}" ui-ace="{
useWrapMode : editor.useWrapMode,
showGutter: editor.gutter,
theme:editor.theme,
mode: editor.mode,
onLoad: aceLoaded,
onChange: aceChanged
}" ng-model='value'></div>
</div>
</body>
<script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js'></script>
<script src='https://ace.c9.io/build/src-min-noconflict/ace.js'></script>
<script src='https://angular-ui.github.io/ui-ace/dist/ui-ace.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js'></script>
</body>
<script>
angular.module('app', ['ui.ace'])
.controller('ctrl', ['$scope', '$http', '$timeout', function($scope, $http, $timeout) {
$scope.currentTheme = 14;
$scope.value = '<html>333333333333';
$http.get('https://rawgit.com/mrdoob/three.js/master/examples/webgl_lines_dashed.html').
success(function(data, status, headers, config) {
$scope.value = data;
}).
error(function(data, status, headers, config) {
$scope.value = data;
});
$scope.aceLoaded = function (_editor) {
_editor.setFontSize(14);
}
var editor = function() {
this.theme = 'chaos';//themes[$scope.currentTheme];
this.mode = 'html';
this.opacity = 100;
this.useWrapMode = true;
this.gutter = true;
this.splitMode = false;
this.themeCycle = true;
};
$scope.editor = new editor();
}]);
</script>