<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
		<script src="/static/angular.min.js"></script>
		<title>SVNOnline</title>
		<style type="text/css">
		body{
			font-size: 14px;
		}
		a{
			color: blue;
			text-decoration: none;
			padding: 5px 0;
		}
		.file{

		}
		.file:hover{
			cursor: pointer;
			background: #E0E0E0;
		}
		table{

		}
		tr,td,table{
			border: none;
			border-collapse: collapse;
		}

		td{
			border-left: 1px solid gray;
			border-right: 1px solid gray;
			/*padding: 2px 5px;*/
			border-bottom: 1px solid gray;
		}
		.titleline td{
			border-bottom: 1px solid gray;
		}
		td.status{
			text-align: center;
			width: 50px;
		}
		.titleline td{
			border-top: 1px solid gray;
		}
		td.checkbox{
			text-align: center;
			/*width: 30px;*/
			width: 1.5rem;
		}
		.checkbox{
			width: 1.2rem;
			height: 1.2rem;
		}
		.btns a{
			color: gray;
		}
		.btns a.enable{
			color: blue;
		}
		</style>
	</head>
	<body>
		<div ng-app="SVNOnline" ng-controller="SVNOnlineCtrl">
			<div style="width: 100%; margin: 0 auto; max-width: 800px;">
				<div>
					<div style="display: inline-block; float: left;">
						/
						<span ng-repeat="p in paths" class="path">
							<a href="#{{p.path}}" ng-if="p.path">{{p.name}}</a>
							<a ng-if="!p.path">{{p.name}}</a>
						</span>
					</div>
					<span style="float: left;">{{status}}</span>
					<span style="color: red; float: left;" ng-if="error.length>0">{{error}}</span>
					<span ng-show="info.rev" style="float: right;">[REV:{{info.rev}}]</span>
					
					<span style="clear: both;"></span>
				</div>
				<table style="width: 100%; margin: 5px 0;">
					<tr class="titleline">
						<td class="checkbox">
							<img class="checkbox" ng-click="checkall()" ng-src="{{checkedall?'/static/checked.png':'/static/unchecked.png'}}">
						</td>
						<td class="status">STATUS</td>
						<td>
							FILE
						</td>
					</tr>
					<tr ng-repeat="f in list" class="file" ng-if="list && list.length>0">
						<td class="checkbox">
							<img class="checkbox" ng-click="f.checked=!f.checked" ng-src="{{f.checked?'/static/checked.png':'/static/unchecked.png'}}">
						</td>
						<td class="status"><span ng-if="f.status">[{{f.status}}]</span></td>
						<td>
							<a style="display: block;" href="#{{path+f.path}}" ng-if="f.path.endsWith('/')">{{f.path}}</a>
							<a style="display: block;" ng-click="f.checked=!f.checked" ng-if="! f.path.endsWith('/')">{{f.path}}</a>
						</td>
					</tr>
					<tr class="file" ng-if="!list || list.length==0">
						<td colspan="3">
							<p style="text-align:center;">
								no file~
							</p>
						</td>
					</tr>
				</table>
				
				<textarea ng-show="showtext" style="display: block; padding: 0; width: 100%; height: 80px; margin-left: -1px; border: 1px solid gray;" ng-bind="text"></textarea>
				<span ng-if="!issvn">
					this path is not a svn copy.
				</span>
				<div style="border: 1px solid gray; padding:5px;" ng-show="logs && logs.length>0">
					<span style="display: block;" ng-repeat="l in logs">{{l}}</span>
				</div>

				<div style="text-align: center; margin-top: 10px;" class="btns">
					<a href="javascript:void(0);" ng-click="chdir();" ng-class="{enable:true}">REFRESH</a>
					|
					<a href="javascript:void(0);" ng-click="svninfo();" ng-enable="can_status()" ng-class="{enable:can_status()}">INFO</a>
					|
					<a href="javascript:void(0);" ng-click="update();" ng-enable="can_status()" ng-class="{enable:can_status()}">UPDATE</a>
					|
					<a href="javascript:void(0);" ng-click="commit();" ng-enable="can_status('AM')" ng-class="{enable:can_status('AM')}">COMMIT</a>
					|
					<a href="javascript:void(0);" ng-click="cleanup();" ng-enable="can_status()" ng-class="{enable:can_status()}">CLEANUP</a>
					|
					<a href="javascript:void(0);" ng-click="revert();" ng-enable="can_status('AM')" ng-class="{enable:can_status('AM')}">REVERT</a>
					|
					<a href="javascript:void(0);" ng-click="remove();" ng-enable="can_select()" ng-class="{enable:can_select()}">REMOVE</a>
					|
					<a href="javascript:void(0);" ng-click="add();" ng-enable="can_status('?')" ng-class="{enable:can_status('?')}">ADD</a>
				</div>
			</div>
		</div>
		<script>
		var app = angular.module('SVNOnline', []);
		app.controller('SVNOnlineCtrl', function($scope, $http,$location,$window) {
			scope = $scope;
			$scope.status = '';
			$scope.checkall = function(){
				$scope.checkedall = !$scope.checkedall;
				for (var i = 0; i < $scope.list.length; i++) {
					$scope.list[i].checked = $scope.checkedall;
				}
			}
			$scope.text = "";
			$scope.issvn = false;
			$scope.chdir = function(p,stop){
				if(!p){
					p = $scope.path;
				}
				if(p != $scope.path){
					$scope.logs = null;
				}
				var prep = $scope.path;
				$scope.path = p;

				$scope.paths = [{
					name:'root/',
					path:'/',
				}];
				if(p.length && p[0]=='/')
					p = p.substring(1);
				if(p.length && p[p.length-1]=='/')
					p = p.substring(0, p.length-1);
				if(p.length>0){
					var paths = p.split('/');
					var pt = '/';
					for (var i = 0; i < paths.length; i++) {
						var np = paths[i]+'/';
						// var pt = np;
						pt += np;
						if(np==""){
							np = "/";
							pt = false;
						}
						$scope.paths.push({
							name:np,
							path:pt
						});
					}
				}

				$scope.status = 'load...';
				$http({url:'/api/list',params:{path:$scope.path}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.list = res.data.list;
					$scope.info = res.data.info;
					$scope.issvn = $scope.info;
					$scope.checkedall = false;

					$scope.text="";
					$scope.showtext = false;
				}).error(function(){
					if(prep!=p && !stop){
						$location.path(prep, true);
					}
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.checkedargs = function(s){
				var arr = [];
				for (var i = 0; i < $scope.list.length; i++) {
					var f = $scope.list[i];
					if(f.checked && (!s || s == '' || f.status == s || (s.indexOf(f.status)>=0 && f.status!=""))){
						arr.push(f.path.trim());
					}
				}
				// console.log(arr);
				return arr.join(";");
			};
			$scope.can_status = function(s){
				if($scope.issvn){
					return (typeof(s)!="undefined" && s!=null)? $scope.checkedargs(s).length>0 : true;
				}
				return false;
			};
			$scope.can_select = function(){
				return $scope.list && $scope.checkedargs("").length>0;
			}
			$scope.cleanup = function(){
				$scope.status = 'cleanup...';
				$scope.logs = null;
				$http({url:'/api/svn',params:{cmd:'cleanup',path:$scope.path}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.logs = res.data;
				}).error(function(){
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.can_update = function(){
				return $scope.issvn;
			}
			$scope.update = function(){
				$scope.status = 'update...';
				$scope.logs = null;
				$http({url:'/api/svn',params:{cmd:'update',path:$scope.path}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.logs = res.data;
					$scope.chdir();
				}).error(function(){
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.revert = function(){
				if(!confirm("revert select ?"))
					return;
				$scope.status = 'revert...';
				$scope.logs = null;
				$http({url:'/api/svn',params:{cmd:'revert',path:$scope.path, args:$scope.checkedargs()}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.logs = res.data;
					$scope.chdir();
				}).error(function(){
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.commit = function(){
				if($scope.showtext){
					// commit
					$scope.status = 'commit...';
					$scope.logs = null;
					$http({url:'/api/svn',params:{cmd:'commit',path:$scope.path, args:"-m;\""+$scope.text.replace(/\n/g,"\\n")+"\";"+$scope.checkedargs('MA')}}).success(function(res) {
						$scope.error = $scope.status = '';
						$scope.logs = res.data;
						$scope.text="";
						$scope.showtext = false;
						$scope.chdir();
					}).error(function(){
						$scope.status = '';
						$scope.error = "error!";
					});
				}
				else{
					$scope.showtext = true;
				}
			}
			$scope.add = function(){
				$scope.status = 'add...';
				$scope.logs = null;
				$http({url:'/api/svn',params:{cmd:'add',path:$scope.path, args:$scope.checkedargs('?')}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.logs = res.data;
					$scope.chdir();
				}).error(function(){
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.svninfo = function(){
				$scope.status = 'info...';
				$scope.logs = null;
				$http({url:'/api/svn',params:{cmd:'info',path:$scope.path}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.logs = res.data;
				}).error(function(){
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.remove = function(){
				if(!confirm("remove select ?"))
					return;
				$scope.status = 'remove...';
				$scope.logs = null;
				$http({url:'/api/remove',params:{args:$scope.checkedargs(''),path:$scope.path}}).success(function(res) {
					$scope.error = $scope.status = '';
					$scope.logs = res.data;
					$scope.chdir();
				}).error(function(){
					$scope.status = '';
					$scope.error = "error!";
				});
			};
			$scope.$on('$locationChangeSuccess', function(r,v){
				$scope.chdir($location.path());
			});
			$scope.chdir("/");
		});
		</script>
	</body>
</html>
