tincr / editorpanel.html

<html>
<head>
	<link rel="stylesheet" type="text/css" href="aui.css" />
	<link rel="stylesheet" type="text/css" href="editorpanel.css" />

	<script src="zepto1.0rc1.js"></script>
	<script src="BackgroundMsgSupport.js"></script>
	<script src="Logger.js"></script>
	<script>
		
		var projectTypes;
		
		var checkProjectState = function(){
			var projectState = window.devtoolsWindow.projectState;
				
			if (projectState.type == 'fileUrl'){
				$('#project-type').attr('disabled', 'true');
				$('#native-browse').attr('disabled', 'true');
				
				$('#file-select').hide();
				$('#auto-refresh').hide();
				$('#auto-save').hide();
			}
			else if (projectState.type){
				var typeSelect = document.getElementById('project-type');
				$('#project-type').removeAttr('disabled');
				$('#native-browse').removeAttr('disabled');
				
				for (var i = 0; i < projectTypes.length; i++){
					if (projectTypes[i].key === projectState.type){
						typeSelect.value = String(i);
						break;
					}
				}
				$('#local-file-path').text(projectState.path).show();
				$('#toggle-watch')[0].checked = projectState.watchFiles;
				$('#toggle-autosave')[0].checked = projectState.autosave;
				
				$('#file-select').show();
				$('#auto-refresh').show();
				$('#auto-save').show();
				
				$('#load-error').hide();
				$('#error-img').hide();
				$('#success-img').show();
				$('#load-success').show();
			}
			
			var loggingEnabled = devtoolsWindow.localStorage['logging'] === 'true';
			toggleLogging(loggingEnabled);
			$('#toggle-logging')[0].checked = loggingEnabled;
			
		}
		
		var initUI = function(){
		
			var typeSelect = document.getElementById('project-type');
			
			backgroundMsgSupport.getProjectTypes(function(types){
				projectTypes = types;
				for (var i = 0; i < projectTypes.length; ++i) {
					var projectType = projectTypes[i];
					typeSelect.add(new Option(projectType.name, i));
				}
				checkProjectState();
			});
			$(typeSelect).on('change', function(e){
				var index = Number(typeSelect.value);
				var projectType = projectTypes[index];
				if (projectType.locationType == 'local'){
					$('#file-select').show();
				}
			});
			$('#native-browse').on('click', function(e){
				var index = Number(typeSelect.value);
				backgroundMsgSupport.launchFileSelect(index, window.devtoolsWindow.inspectedLocation.origin, function(result){
					if (result.path && result.path.length){
						$('#local-file-path').text(result.path).show();
						if (result.error){
							logError(result.error);
							$('#load-error').text(result.error).show();
							$('#error-img').show();
							$('#success-img').hide();
							$('#load-success').hide();
						}
						else{
							var projectType = projectTypes[index];
							window.devtoolsWindow.loadProject(projectType.key, result.path, true, true);
							$('#toggle-autosave')[0].checked = true;
							$('#toggle-watch')[0].checked = true;
							$('#auto-refresh').show();
				            $('#auto-save').show();
				            
				            $('#load-error').hide();
							$('#error-img').hide();
							$('#success-img').show();
							$('#load-success').show();
						}
					}
				});
				return false;
			});
			$('#toggle-watch').on('change', function(e){
				var path = $('#local-file-path').text();
				if (path && path.length){
					this.disabled=true;
					var self = this;
					window.devtoolsWindow.toggleWatchingFiles(this.checked, path, function(){
						self.disabled = false;
						window.devtoolsWindow.saveProjectState();
					});
				}
			});
			$('#toggle-autosave').on('change', function(e){
				if (window.devtoolsWindow.projectState){
					window.devtoolsWindow.projectState.autosave = this.checked;
				}
				window.devtoolsWindow.saveProjectState();
			});
			$('#toggle-logging').on('change', function(e){
				devtoolsWindow.localStorage['logging'] = '' + this.checked;
				toggleLogging(this.checked);
				devtoolsWindow.toggleLogging(this.checked);
			});
			
		};
	</script>
</head>
<body>
	<div id="project-select-form">
		<form class="aui">
			 <h2>Configuration</h2>
		 <fieldset>
			<div class="field-group">
				<label>Project Type:</label>
				<select id="project-type">
					<option value="-1" selected="selected">Choose...</option>
				</select>
			</div>
			<div class="field-group" id="file-select" style="display:none">
				<label>Root Directory:</label><span id="local-file-path" style="display:none"></span>
				<button id="native-browse">Browse</button><img id="error-img" style="display:none" src="error.png"/><img id="success-img" style="display:none" src="success.png"/>
				<div id="load-error" class="description" style="display:none"></div>
				<div id="load-success" class="description" style="display:none">Project loaded successfully</div>
			</div>
			<div class="field-group" id="auto-refresh" style="display:none">
				<label>Auto-Refresh</label>
				<input type="checkbox" id="toggle-watch"/>
				<div class="description">Reload file system changes in the background</div>
			</div>
			<div class="field-group" id="auto-save" style="display:none">
				<label>Auto-Save</label>
				<input type="checkbox" id="toggle-autosave"/>
				<div class="description">Save changes from devtools to the file system</div>
			</div>
		</fieldset>
		    <h2>Flags</h2>
			<div class="field-group">
				<label>Enable Logging</label>
				<input type="checkbox" id="toggle-logging"/>
				<div class="description">Logs Tincr errors and messages to the devtools console</div>
			</div>
		</form>
	</div>
</body>
</html>
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.