extends ../layout

block vars
	- var suppressNavbar = true
	- var suppressFooter = true
	- var suppressDefaultJs = true
	- var suppressSystemMessages = true

block content
	.editor(ng-controller="IdeController", ng-class="{'editor-dark': darkTheme}").full-size
		.loading-screen(ng-show="state.loading")
			.container
				h3 Loading...
				.progress
					.progress-bar(style="width: 20%", ng-style="{'width': state.load_progress + '%'}")

		.global-alerts(ng-cloak)
			.alert.alert-danger.small(ng-if="connection.forced_disconnect")
				strong Disconnected
				|  Please refresh the page to continue.

			.alert.alert-warning.small(ng-if="connection.reconnection_countdown")
				strong Lost Connection.
				|  Reconnecting in {{ connection.reconnection_countdown }} secs. 
				a.pull-right(href, ng-click="tryReconnectNow()") Try Now

			.alert.alert-warning.small(ng-if="connection.reconnecting")
				strong Reconnecting...

			.div(ng-controller="SavingNotificationController")
				.alert.alert-warning.small(
					ng-repeat="(doc_id, state) in docSavingStatus"
					ng-if="state.unsavedSeconds > 3"
				)
					| Saving {{ state.doc.name }}... ({{ state.unsavedSeconds }} seconds of unsaved changes)


		include ./editor/left-menu

		#chat-wrapper(
			layout="chat",
			spacing-open="12",
			spacing-closed="0",
			initial-size-east="250",
			init-closed-east="true",
			open-east="ui.chatOpen",
			ng-hide="state.loading",
			ng-cloak
		)
			.ui-layout-center
				include ./editor/header

				include ./editor/share

				#ide-body(ng-cloak, layout="main", ng-hide="state.loading", resize-on="layout:chat:resize")
					.ui-layout-west
						include ./editor/file-tree

					.ui-layout-center
						include ./editor/editor
						include ./editor/binary-file
						include ./editor/track-changes
						include ./editor/publish-template
						include ./editor/dropbox

			.ui-layout-east
				include ./editor/chat
				
	include ./editor/hotkeys

	script(type="text/ng-template", id="genericMessageModalTemplate")
		.modal-header
			button.close(
				type="button"
				data-dismiss="modal"
				ng-click="done()"
			) ×
			h3 {{ title }}
		.modal-body {{ message }}
		.modal-footer
			button.btn.btn-info(ng-click="done()") OK

	script(src='/socket.io/socket.io.js')

	//- We need to do .replace(/\//g, '\\/') do that '</script>' -> '<\/script>'
	//- and doesn't prematurely end the script tag.
	script(type='text/javascript').
		window.project_id = "!{project_id}"
		window.userSettings = !{JSON.stringify(userSettings).replace(/\//g, '\\/')};
		window.user = !{JSON.stringify(user).replace(/\//g, '\\/')};
		window.csrfToken = "!{csrfToken}";
		window.anonymous = #{anonymous};
		window.requirejs = {
			"paths" : {
				"mathjax": "https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS_HTML",
				"moment": "libs/moment-2.7.0"
			},
			"urlArgs" : "fingerprint=#{fingerprint(jsPath + 'ide.js')}-#{fingerprint(jsPath + 'libs.js')}",
			"waitSeconds": 0,
			"shim": {
				"libs/pdfListView/PdfListView": {
					deps: ["libs/pdf"]
				},
				"libs/pdf": {
					deps: ["libs/compatibility"]
				},
				"ace/ext-searchbox": {
					deps: ["ace/ace"]
				}
			}
		};
		window.aceFingerprint = "#{fingerprint(jsPath + 'ace/ace.js')}"

	script(type='text/javascript').
		ga('send', 'event', 'editor-interaction', 'editor-opened')

	- locals.suppressDefaultJs = true

	- var fingerprintedPath = fingerprint(jsPath+'libs/pdf.worker.js')
	- var pdfJsWorkerPath = jsPath+'libs/pdf.worker.js?fingerprint='+fingerprintedPath
	script(type='text/javascript').
		window.pdfJsWorkerPath = "#{pdfJsWorkerPath}";

	script(
		data-main=jsPath+"ide.js",
		baseurl=jsPath,
		data-ace-base=jsPath+'ace',
		src=jsPath+'libs/require.js?fingerprint='+fingerprint(jsPath + 'libs/require.js')
	)