Add push, pull and fetch features

src/share/git-webui/webui/css/git-webui.less

@@ -152,6 +152,10 @@ body {
             content: url(/img/daemon.svg);
         }
 
+        #sidebar-sync h4:before {
+            content: url(/img/mail-send-receive-symbolic.svg);
+        }
+
         #sidebar-local-branches, #sidebar-remote-branches {
             h4:before {
                 content: url(/img/branch.svg);
@@ -611,6 +615,7 @@ body {
     }
 }
 
+
 #commit-explorer-view {
     #commit-explorer-navigator-view {
         .panel {

src/share/git-webui/webui/js/git-webui.js

@@ -309,6 +309,9 @@ webui.SideBarView = function(mainView) {
                                 '<section id="sidebar-remote">' +
                                     '<h4>Remote access</h4>' +
                                 '</section>' +
+                                '<section id="sidebar-sync">' +
+                                    '<h4>Remote sync</h4>' +
+                                '</section>' +
                                 '<section id="sidebar-local-branches">' +
                                     '<h4>Local Branches</h4>' +
                                 '</section>' +
@@ -323,13 +326,20 @@ webui.SideBarView = function(mainView) {
 
     if (webui.viewonly) {
         $("#sidebar-workspace", self.element).remove();
+        $("#sidebar-sync", self.element).remove();
     } else {
         var workspaceElement = $("#sidebar-workspace h4", self.element);
         workspaceElement.click(function (event) {
             $("*", self.element).removeClass("active");
             workspaceElement.addClass("active");
             self.mainView.workspaceView.update("stage");
         });
+        var syncElement = $("#sidebar-sync h4", self.element);
+        syncElement.click(function (event) {
+            $("*", self.element).removeClass("active");
+            syncElement.addClass("active");
+            self.mainView.syncView.update();
+        });
     }
 
     var remoteElement = $("#sidebar-remote h4", self.element);
@@ -1710,6 +1720,49 @@ webui.RemoteView = function(mainView) {
     $(".git-pull", self.element).text("git pull http://" + webui.hostname + ":" + document.location.port + "/");
 };
 
+/*
+ * == SyncView =======================================================
+ */
+webui.SyncView = function(mainView) {
+
+    var self = this;
+
+    self.show = function() {
+        mainView.switchTo(self.element);
+    };
+
+    self.update = function() {
+        self.show();
+    };
+
+    self.onPush = function() {
+        webui.git("push");
+        self.update();
+    }
+
+    self.onFetch = function() {
+        webui.git("fetch");
+        self.update();
+    }
+
+    self.onPull = function() {
+        webui.git("pull");
+        self.update();
+    }
+
+    self.element = $(   '<div class="jumbotron">' +
+                            '<h1>Sync between local and remote</h1>' +
+                            '<div>' +
+                                '<button type="button" class="btn btn-sm btn-default sync-pull"><img src="img/pull.svg" />Pull</button>' +
+                                '<button type="button" class="btn btn-sm btn-default sync-push"><img src="img/pull.svg" style="transform: scaleY(-1);" />Push</button>' +
+                                '<button type="button" class="btn btn-sm btn-default sync-fetch"><img src="img/folder-download-symbolic.svg" />Fetch</button>' +
+                            '</div>' +
+                        '</div>')[0];
+    $(".sync-pull", self.element).click(self.onPull);
+    $(".sync-push", self.element).click(self.onPush);
+    $(".sync-fetch", self.element).click(self.onFetch);
+};
+
 /*
  *  == Initialization =========================================================
  */
@@ -1744,6 +1797,7 @@ function MainUi() {
                 self.historyView = new webui.HistoryView(self);
                 self.remoteView = new webui.RemoteView(self);
                 if (!webui.viewonly) {
+                    self.syncView = new webui.SyncView(self);
                     self.workspaceView = new webui.WorkspaceView(self);
                 }
             });