project.html

<div class="project-title" ng-show="show_project_title && iframed && project.name">{{ project.name }}</div>
<div class="project-editor" style="position: relative">
  <div id="nav" ng-show="!iframed || show_sidebar">
    <div ng-show="!iframed" id="navheader">
      <div class="project_name" title="{{project.description}}">{{project.name}}</div>
      <!-- div class="dropdown"><a ng-click="project_context_menu($event, 'elipsis')">…</a></div -->
    </div>
    <div id="filelist">
      <div id="file-{{$index}}" class="fileentry"
           ng-class="{selected: file == current_file}"
           ng-repeat="file in visible_files">
        <a ng-click="set_path(file.path)" class="filename">
          {{file.path}} <i class="icon-asterisk dirtymarker" ng-show="file.dirty"></i>
        </a>
        <!-- a ng-show="!iframed || !show_sidebar" class="dropdown" ng-click="file_context_menu($event, file, 'elipsis')">…</a -->
      </div>
      <div><a ng-hide="read_only" class="link newthing" ng-click="prompt_new_file('new-file-link')">+ new file</a></div>
    </div>
  </div>

  <div class="source-main-container" ng-class="{'with-sidebar': !iframed || show_sidebar}">

  <div id="source-container">

    <form ng-show="!iframed || !show_sidebar" class="form-inline form-reduced-margin btn-height">
      <button ng-show="!read_only" ng-click="prompt_reset_project('project-reset-button')" title="Reset {{project.name}}" class="btn pull-right">Reset Project</button>
      <button ng-click="prompt_download_project('project-download-button')" title="Download {{project.name}}" class="btn pull-right"><i class="icon-download"></i> ZIP</button>
      <span ng-show="!iframed" class="current-file-path"> {{current_file.path}}</span>
      <select ng-show="iframed && !show_sidebar && visible_files_count > 5" ng-model="selected_path">
        <option ng-repeat="file in visible_files">{{file.path}}</option>
      </select>
      <div ng-show="iframed && !show_sidebar && visible_files_count <= 5">
        <ul class="nav nav-tabs">
          <li ng-repeat="file in visible_files" ng-class="{active: file == current_file}"><a ng-click="set_path(file.path)" title={{file.path}}>{{file.path | pathonly }}</a></li>
          <li ng-hide="read_only"><a class="link newthing" ng-click="prompt_new_file('new-file-tab')">+ new file</a></li>
        </ul>
      </div>
      <span class="filestatus" ng-bind="filestatus"></span>
    </form>

    <span ng-show="file == current_file" ng-repeat="file in visible_files">
      <div ng-show="!is_image_mime_type(file.mime_type)" class="source-code" ng-class="{'read-only': read_only || file.read_only}" ui-codeMirror="{onChange: create_on_change_closure(file), file: file, readOnly: read_only || file.read_only}" ng-model="file.contents"></div>
      <img ng-show="is_image_mime_type(file.mime_type)" ng-src="{{image_url_of(file)}}">
    </span>
  </div>

  <br ng-show="!show_sidebar">
  <br ng-show="!show_sidebar">
  <hr ng-show="!iframed" pg-resizer="source-container">

  <div>
    <div ng-class="{'form-inline': true, 'url-container': !show_sidebar, 'just-url-button': show_sidebar}">
      <button ng-click="run('blue-button')" class="btn btn-primary url-button pull-left" title="Run"><i class="icon-play icon-white"></i></button>
      <input ng-show="!show_sidebar" ng-model="iframe_run_url" type="url" class="span8 url-bar" ng-click="select_me($event)">
      <button ng-show="!show_sidebar" ng-click="popout('popout-button'); run('popout-button')" class="btn pull-right url-button" title="Open in a separate window"><i class="icon-share-alt"></i></button>
    </div>
    <div id="output-iframe" style="position: relative;">
      <div ng-show= "!output_ready" style="position: absolute; background-color: #eee;">
        <div style="margin: 2em;" ng-show="app_run_count !=0">
          Deploying your code...
        </div>
        <div style="text-align: center; margin-top: 100px;" ng-show="app_run_count == 0">
          Click the blue <a ng-click="run('output-iframe-inline-run-link')">run</a> button to run this code.
        </div>
      </div>
      <div ng-show="!requested_popout" pg-visible="output_ready">
        <iframe ng-src="{{iframe_run_url}}" pg-load="output_loaded()">
        </iframe>
      </div>
    </div>

    <hr ng-show="!iframed" pg-resizer="output-iframe">

    <iframe class="control-iframe" ng-show="control_url" ng-attr-src="{{control_url}}">
    </iframe>

    <button ng-show="iframed && show_sidebar" ng-click="handle_download_button(project)" ng-title="Download {{read_only ? 'this' : 'your'}} code" class="btn btn-primary download-btn">Download {{read_only ? 'this' : 'your'}} code</button>
  </div>

  </div>

  <div ng-show="!iframed">
    <div ng-show="logs.length">
      <a ng-click="clear_logs()" ng-show="logs.length" class="btn pull-right">clear logs</a>
      <h4>Log output</h4>
    </div>
    <div class="ae-logs">
      <div ng-repeat="entry in logs | orderBy:'created':false">
         <span class="ae-logs-timestamp">{{entry.created * 1000 | date:'yyyy-MM-dd HH:mm:ss.sss Z'}}</span>
         <span class="ae-logs-severity ae-logs-severity-{{entry.levelname}}">{{entry.levelname | limitTo:1}}</span>
         <span ng-bind="entry.message" class="ae-logs-message"></span>
      </div>
    </div>
  </div>


  <!-- hidden bits -->
  <div id="file-context-menu" class="context-menu" ng-show="showfilecontextmenu" pg-movable="file_context_menu_pos">
    <div ng-click="prompt_file_rename(current_file, 'file-context-menu')"><b>Rename</b> <code>{{current_file.path}}</code></div>
    <div ng-click="prompt_delete_file(current_file, 'file-context-menu')"><b>Delete</b> <code>{{current_file.path}}</code></div>
  </div>
  <div id="project-context-menu" class="context-menu" ng-show="showprojectcontextmenu" pg-movable="project_context_menu_pos">
    <div ng-click="prompt_project_rename(project, 'project-context-menu')"><b>Rename</b> {{project.name}}</div>
    <div ng-click="prompt_delete_project(project, 'project-context-menu')"><b>Delete</b> {{project.name}}</div>
  </div>
</div>