API tools faq
paste
Advertisement
BlueBear

Untitled

BlueBear
Apr 19th, 2014
186
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 10.66 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.   <meta charset="UTF-8">
  5.   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6.   <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  7.   <script src="upload/ace.js" type="text/javascript" charset="utf-8"></script>
  8.   <title>Editor</title>
  9.   <style type="text/css" media="screen">
  10.     body {
  11.         overflow: hidden;
  12.     }
  13.     #sidebar {
  14.         margin: 0;
  15.         font-family: arial;
  16.         position: absolute;
  17.         left: 0;
  18.         right: 90%;
  19.         top: 0;
  20.         bottom: 0;
  21.         background-color: #111;
  22.         color: #DDD;
  23.     }
  24.     #sidebar input, #sidebar button{
  25.         display: block;
  26.     }
  27.     #editorhead {
  28.         margin: 0;
  29.         padding: 0 10px;
  30.         position: absolute;
  31.         top: 0;
  32.         height: 30px;
  33.         line-height: 30px;
  34.         left: 10%;
  35.         right: 0;
  36.         background-color: #222;
  37.         font-family: arial;
  38.         color: #FFF;
  39.     }
  40.     #sign-out {
  41.         margin: 0;
  42.         padding: 0 10px;
  43.         position: absolute;
  44.         top: 0;
  45.         right: 0;
  46.     }
  47.     #editor {
  48.         margin: 0;
  49.         position: absolute;
  50.         top: 30px;
  51.         bottom: 0;
  52.         left: 10%;
  53.         right: 0;
  54.     }
  55.   </style>
  56. </head>
  57. <body>
  58. <?php
  59. if (isset($_SESSION["LoggedIn"]) && $_SESSION["LoggedIn"]) {
  60. ?>
  61. <div id="sidebar">
  62. <?php
  63.    echo 'File dialog: <br>';
  64.     $files = scandir(getcwd());
  65.     echo '<form method="post" id="fileselector">';
  66.     foreach( $files as $file ){
  67.         if ($file == "index.php") continue;
  68.         if(substr($file, 0, 1) == "." || substr($file, 0, 1) == ".." || is_dir(getcwd() . "/" . $file))
  69.         {
  70.             continue;
  71.         }
  72.         echo '<button type="submit" value="' . $file . '" name="filetoopen">';
  73.         echo $file;
  74.         echo '</button>';
  75.     }
  76.     echo '</form>';
  77.    
  78.     echo '</p>';
  79.     echo 'File actions: <br>';
  80.     echo '<input type="hidden" value="'.$default.'" id="currentfile">';
  81.     echo '<button type="submit" id="file-save">Save</button><br>';
  82.     echo '<button type="submit" id="file-saveas">Save As</button><br>';
  83.     echo '<button type="submit" id="file-new">New</button><br>';
  84.     echo '<button type="submit" id="file-delete">Delete</button><br>';
  85.  
  86.     echo 'Theme: ';
  87.     echo "<select id='theme' size='1'>";
  88.     echo "<option value='ambiance'>Ambiance Dark</option>";
  89.     echo "<option value='chaos'>Chaos Dark</option>";
  90.     echo "<option value='cobalt'>Cobalt Dark</option>";
  91.     echo "<option value='kr_theme'>krTheme Dark</option>";
  92.     echo "<option value='monokai' selected>Monokai Dark</option>";
  93.     echo "<option value='merbivore'>Merbivore Dark</option>";
  94.     echo "<option value='mono_industrial'>Mono Industrial Dark</option>";
  95.     echo "<option value='terminal'>Terminal Dark</option>";
  96.     echo "<option value='twilight'>Twilight Dark</option>";
  97.     echo "<option value='vibrant_ink'>Vibrant Ink Dark</option>";
  98.     echo "<option value='xcode'>XCode Bright</option>";
  99.     echo "<option value='kuroir'>Kuroir Bright</option>";
  100.     echo "<option value='eclipse'>Eclipse Bright</option>";
  101.     echo "<option value='clouds'>Clouds Bright</option>";
  102.     echo "<option value='dawn'>Dawn Bright</option>";
  103.     echo "</select>";
  104.  
  105.     echo '<br>Font size: ';
  106.     echo "<select id='fontsize' size='1'>";
  107.     echo "<option value='8px'>8px</option>";
  108.     echo "<option value='9px'>9px</option>";
  109.     echo "<option value='10px'>10px</option>";
  110.     echo "<option value='11px'>11px</option>";
  111.     echo "<option value='12px' selected>12px</option>";
  112.     echo "<option value='13px'>13px</option>";
  113.     echo "<option value='14px'>14px</option>";
  114.     echo "<option value='15px'>15px</option>";
  115.     echo "<option value='16px'>16px</option>";
  116.     echo "<option value='17px'>17px</option>";
  117.     echo "<option value='18px'>18px</option>";
  118.     echo "<option value='19px'>19px</option>";
  119.     echo "<option value='20px'>20px</option>";
  120.     echo "</select>";
  121.  
  122.     echo '<br>Split: ';
  123.     echo "<select id='split' size='1'>";
  124.     echo "<option value='none'>None</option>";
  125.     echo "<option value='below'>Below</option>";
  126.     echo "<option value='beside'>Beside</option>";
  127.     echo "</select>";
  128. ?>
  129. </div>
  130.  
  131. <div id="editorhead">
  132.     <span id="filename">Loading...</span>
  133.     <span id="codelanguage"></span>
  134. </div>
  135. <form method="post">
  136.     <button type="submit" name="event" value="sign-out" id="sign-out">Sign out</button>
  137. </form>
  138.    
  139. <pre id="editor" style="width: 90%">
  140. </pre>
  141.    
  142. <script>
  143. var editor = ace.edit('editor');
  144. editor.setTheme('ace/theme/twilight');
  145. //editor.getSession().setMode('ace/mode/php');
  146.     document.addEventListener("keydown", function(e) {
  147.         if (e.keyCode == 115 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey )) {
  148.             e.preventDefault();
  149.             var filename = $('#currentfile').val();
  150.                 save(filename);
  151.         }
  152.  
  153.     }, false);
  154.     document.addEventListener("keydown", function(e) {
  155.         if (e.keyCode == 83 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey ) && e.shiftKey) {
  156.             e.preventDefault();
  157.             var filename = prompt("Save file as:","name.format");
  158.             if (filename != null){
  159.                 save(filename);
  160.             }
  161.         }
  162.     }, false);
  163.     document.addEventListener("keydown", function(e) {
  164.         if (e.keyCode == 110 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey)) {
  165.             e.preventDefault();
  166.             var filename = prompt("Please enter the filename","name.format");
  167.             if (filename != null){
  168.                 create(filename);
  169.             }
  170.         }
  171.     }, false);
  172. editor.on('input', function() {
  173.     currentValue = editor.getValue();
  174.        
  175.     if (savedValue != currentValue) {
  176.         if ($('#filename').text().indexOf('*') == -1) {
  177.             $('#filename').append('*');
  178.             $('#filename').css('color', 'gold');
  179.         }
  180.     }
  181.     else {
  182.         filename = $('#filename').text().replace('*', '');
  183.         $('#filename').text(filename)
  184.         $('#filename').css('color', '#FFF');
  185.     }
  186. });
  187. </script>
  188.  
  189.  
  190. <script>
  191. $(document).ready(function(){ //after the document loaded
  192.     var defaultfile = $('#currentfile').val(); //load default file for edit
  193.     open(defaultfile);
  194.  
  195.     $(document).on('change', '#theme', function(e){
  196.         e.preventDefault();
  197.         editor.setTheme('ace/theme/' + $(this).val());
  198.     });
  199.  
  200.     $(document).on('change', '#fontsize', function(e){
  201.         e.preventDefault();
  202.         var filename = $(this).val();
  203.         document.getElementById('editor').style.fontSize=filename;
  204.     });
  205.  
  206.     /* Open file event */
  207.     $(document).on('click', '#fileselector button', function(e){
  208.         e.preventDefault(); //prevent the form submit, so the page won't reload
  209.         var filename = $(this).val(); //reads the file name, from the button's value
  210.         open(filename);
  211.     });
  212.    
  213.     /* Save file event */
  214.     $(document).on('click', '#file-save', function(e){
  215.         e.preventDefault();
  216.        
  217.         var filename = $('#currentfile').val();
  218.         save(filename);
  219.     });
  220.  
  221.     /* Save As file events */
  222.     $(document).on('click', '#file-saveas', function(e){
  223.         e.preventDefault();
  224.        
  225.         var filename = prompt("Save file as:","name.format");
  226.         if (filename != null){
  227.             save(filename);
  228.         }
  229.     });
  230.    
  231.     /* New file event */
  232.     $(document).on('click', '#file-new', function(e){
  233.         var filename = prompt("Please enter the filename","name.format");
  234.         if (filename != null){
  235.             create(filename);
  236.         }
  237.     });
  238.    
  239.     /* Delete file event */
  240.     $(document).on('click', '#file-delete', function(e){
  241.         var remove = confirm("WARNING!\nYou will delete the current file!");
  242.         if (remove){
  243.             var filename = $('#currentfile').val();
  244.             unlink(filename);
  245.         }
  246.     });
  247.  
  248.     /* Keycodes */
  249.     /*$(window).keypress(function(e) {
  250.         console.log("Pressed key: " + e.which);
  251.         console.log("Shift: " + e.shiftKey);
  252.         console.log("Control: " + e.ctrlKey);
  253.        
  254.         if (e.which == 115 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey )) { //CTRL+S event
  255.             e.preventDefault();
  256.             var filename = $('#currentfile').val();
  257.             save(filename);
  258.         }
  259.         if (e.which == 83 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey ) && e.shiftKey) { //CTRL+SHIFT+S event
  260.             e.preventDefault();
  261.             var filename = prompt("Save file as:","name.format");
  262.             if (filename != null){
  263.                 save(filename);
  264.             }
  265.             return false;
  266.         }
  267.         if (e.which == 110 && e.ctrlKey) { //CTRL+N event
  268.             e.preventDefault();
  269.             var filename = prompt("Please enter the filename","name.format");
  270.             if (filename != null){
  271.                 create(filename);
  272.             }
  273.         }
  274.     });*/
  275.    
  276.  
  277.  
  278. });
  279.  
  280. function open(filename) {
  281.     $('#editor').css('opacity', 0.9);
  282.     $('#filename').text('Loading...');
  283.    
  284.     $.post('ajax/file_getcontent.php', {filename: filename}, function(data){ //sends a post request to the file, and that will return it's own code in (to the 'data' variable)
  285.         editor.setValue(data, -1); //sets the editors value, to the new one
  286.         savedValue = data;
  287.        
  288.         var frags = filename.split(".");
  289.         var format = frags[frags.length - 1];
  290.        
  291.         //C/C++
  292.         var language = 'none';
  293.         if (format == 'c' || format == 'cpp' || format == 'h') {
  294.             editor.getSession().setMode('ace/mode/c_cpp');
  295.             language = 'C or C++';
  296.         }
  297.         //HTML/PHP
  298.         if (format == 'php' || format == 'html' || format == 'htm') {
  299.             editor.getSession().setMode('ace/mode/php');
  300.             language = 'PHP, HTML';
  301.         }
  302.         //JavaScript
  303.         if (format == 'js') {
  304.             editor.getSession().setMode('ace/mode/javascript');
  305.             language = 'JavaScript';
  306.         }
  307.        
  308.         if (language != 'none') {
  309.             $('#codelanguage').text("("+language+")");
  310.         }
  311.         else {
  312.             $('#codelanguage').text("(can't recognize)");
  313.             editor.getSession().setUseWorker(false);
  314.         }
  315.        
  316.         $('#filename').text(filename);
  317.         $('#currentfile').val(filename);
  318.         $('#editor').css('opacity', 1);
  319.     });
  320. }
  321. function save(filename) {
  322.     var filecontent = editor.getValue();
  323.        
  324.     $.post('ajax/file_save.php', {filename: filename, filecontent: filecontent}, function(data){
  325.         editor.setValue(filecontent, 1); //sets the editors value, to the new one
  326.        
  327.         if (data) {
  328.             $('#filesave').text('Saved!!!');
  329.             savedValue = filecontent;
  330.             setTimeout(function(){
  331.                 $('#filesave').text('Save');
  332.             }, 2000);
  333.         } else alert(data);
  334.     });
  335. }
  336. function create(filename) {
  337.     $.post('ajax/file_create.php', {filename: filename}, function(data){
  338.         editor.setValue('');
  339.        
  340.         if (data) {
  341.             $('#currentfile').val(filename);
  342.             $('#filename').text(filename);
  343.             $('#fileselector').append('<button type="submit" value="'+filename+'" name="filetoopen">'+filename+'</button>');
  344.         } else alert(data);
  345.     });
  346. }
  347. function unlink(filename) {
  348.     $.post('ajax/file_unlink.php', {filename: filename}, function(data){
  349.         editor.setValue('');
  350.        
  351.         if (data) {
  352.             $('#currentfile').val(filename);
  353.             $('#filename').text(filename);
  354.             $('button[value="'+filename+'"]').remove();
  355.         } else alert(data);
  356.     });
  357. }
  358. </script>
  359. <?php
  360. }
  361. else {
  362. ?>
  363.     <form method="post">
  364.         <input type="password" name="password" placeholder="password">
  365.         <button type="submit" name="event" value="sign-in">Sign In</button>
  366.     </form>
  367. <?php
  368. }
  369. ?>
  370. </body>
  371. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!