{% extends "layout.html" %}
{% block title %}View and edit source code{% endblock %}
{% block head %}
  {{ super() }}
  <link href="{{ url_for('static', filename='css/ui.fancytree.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
  <link href="{{ url_for('static', filename='css/jquery.contextMenu.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
  <link href="{{ url_for('static', filename='css/editor.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
  <script src="{{ url_for('static', filename='js/jquery/jquery.contextMenu-custom.js') }}" type="application/javascript" charset="utf-8"></script>
  <script src="{{ url_for('static', filename='js/jquery/jquery.fancytree.min.js') }}" type="application/javascript" charset="utf-8"></script>
  <link href="{{ url_for('static', filename='css/colorbox.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
  <script src="{{ url_for('static', filename='js/jquery/jquery.colorbox-min.js') }}" type="application/javascript" charset="utf-8"></script>
  <script src="{{ url_for('static', filename='js/scripts/softwareFolder.js') }}" type="application/javascript" charset="utf-8"></script>
  <script src="{{ url_for('static', filename='js/scripts/shell.js') }}" type="application/javascript" charset="utf-8"></script>
{% endblock %}
{% block body %}
<style>
  .ace_search{
    max-width: 350px;
    width: 350px;
  }
  .ace_searchbtn:hover{background-color: #F8F8F8;}
  .ace_replacebtn{padding: 5px;}
  .ace_replacebtn:hover{background: #F8F8F8;}
</style>
<form action="" method=post>
<input type="hidden" name="project" id="project" value="{{project}}" />
<input type="hidden" name="workdir" id="workdir" value="{{workDir}}" />
<input type="hidden" name="subfolder" id="subfolder" value="" />

<!-- Definition of context menu -->
<ul id="fileTreeMenu" class="contextMenu">
  <li class="edit"><a href="#edit">Edit</a></li>
  <li class="view"><a href="#view">Open in popup</a></li>
  <li class="rename separator"><a href="#rename">Rename</a></li>
  <li class="delete "><a href="#delete">Delete</a></li>
  <li class="refresh separator"><a href="#refresh">Refresh</a></li>
  <li class="md5sum"><a href="#md5sum">File md5 sum</a></li>
  <li class="favorite"><a href="#favorite">Add to favorites list</a></li>
  <li class="copy separator"><a href="#copy">Copy</a></li>
  <li class="cut"><a href="#cut">Cut</a></li>
  <li class="paste"><a href="#paste">Paste</a></li>
  <li class="newfile separator"><a href="#nfile">New File</a></li>
  <li class="newdir"><a href="#nfolder">New Folder</a></li>
  <li class="uploadfile"><a href="#ufile">Upload File</a></li>
</ul>
<div id="software_folder">
  <div class='box_header'>
    <ul>
      <li id="switch"><span class="swith_btn" title="Switch between differents file source">This project</span></li>
      <li id="filelist"><span class="flist_btn" title="Favourites files list" rel='tooltip'>&nbsp;</span></li>
      <li id="fullscreen"><span class="expand_editor" title="Show Editor in Full window. Hint: Use Ctrl+E">&nbsp;</span></li>
      <li id="save"><span class="save_btn" title="Save current file. Hint: Use Ctrl+S">&nbsp;</span></li>
      <li id="option"><span class="fmenu_btn" title='Show more options' rel='tooltip'>Menu</span></li>
      <li id="shell"><span class="shell_btn" title="Run a command in a shell">Shell</span></li>
    </ul>
    <div id="tabControl"></div>
    <div class="clear"></div>
  </div>
  <div class="clear"></div>
  <div id="shell-window">
    <div id="shell-result">
    </div>
    <input type="text" name="command" id="shell-input" autocomplete="off" placeholder="Type command ..." />
  </div>
  <div class="clear"></div>
  <div class="software_details">
    <div id="details_box">
  	  <div id="fileTree" class="file_tree_short"></div>
      <div id="fileTreeFull" style='display:none' class="file_tree_short"></div>
    </div>
  </div>
  <div id="code">
    <div class="main_content">
      <div id="tabContent"></div>
    </div>
	</div>
  <div class="clear"></div>
</div>
<div id="file_info" class="file_info"><span id="info"></span></div>
<div class='clear'></div>
</form>


<div id="tooltip-option" style="display:none;min-width: 190px;">
  <span class="list first-list">Current file Menu</span>
  <ul class="inline">
    <li><a id='getmd5' href="#">Get or Update md5sum</a></li>
    <li><a id='addflist' href="#">Add to favourites</a></li>
    <li><a id='expand' title="Show or Hide file tree view area." href="#">
      Show or Hide FileTree</a>
    </li>
    <li><a id='find' href="#">Find in file &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[Ctrl+F]</a></li>
    <li><a id='replace' href="#">Replace in file &nbsp;&nbsp;[Ctrl+H]</a></li>
  </ul>
  <div class="sep"></div>
  <span class="list">Add project development</span>
  <ul id="plist">
  {% for name in projectList%}
    <li><input type="checkbox" name="develop" value="{{name}}" id="{{name}}">
    <label>{{name}}</label></li>
  {% endfor %}
  </ul>
  <a href="#" id="adddevelop" class="lshare">Add to profile</a>
</div>

<div id="tooltip-filelist" style="display:none">
  <div style="min-width: 190px; padding-bottom:10px;">
    <span class="list first-list">Favourites Files / Folders</span>
    <ul class="file inline">
      <li>Your favourites files list is <br/>empty for the moment!</li>
    </ul>
  </div>
</div>

<!-- This contains the hidden content for inline calls -->
<a id='inlineViewer' style='display:none' href="#inline_content">Inline HTML</a>
<div style='display:none'>
  <div id='inline_content' style='padding:10px; background:#fff;'>

  </div>
</div>

<a id='inlineUpload' style='display:none' href="#uploadContent">Inline HTML</a>
<div style='display:none'>
  <div id="uploadContent" style="padding:10px; background:#fff;">
    <h2 style="color: #4c6172; font: 18px \'Helvetica Neue\', Helvetica, Arial, sans-serif;">
    Upload local file to your workspace</h2>
    <p id="uploadlog" class="message"><br/></p>
    <br/>
    <form action="{{ url_for('fileBrowser') }}" id="uploadForm" enctype="multipart/form-data">
      <div class="fileinputs">
        <input type="file" name="filename" size="30" id="choosefiles" />
        <input type="hidden" name="opt" value="11" />
        <input type="hidden" name="dir" value="" />
        <br/>
        <input type=submit value="Upload" id="submitUpload" class="button" />
      </div>
    </form>
  </div>
</div>
{% endblock %}
