]> source.dussan.org Git - archiva.git/commitdiff
use an icon for edit link in grids
authorOlivier Lamy <olamy@apache.org>
Tue, 14 Feb 2012 08:20:58 +0000 (08:20 +0000)
committerOlivier Lamy <olamy@apache.org>
Tue, 14 Feb 2012 08:20:58 +0000 (08:20 +0000)
git-svn-id: https://svn.apache.org/repos/asf/archiva/trunk@1243819 13f79535-47bb-0310-9956-ffa450edef68

archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/repository-groups.js
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/network-proxies.html
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/proxy-connectors.html
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/repositories.html
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/repository-groups.html
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/redback/templates/roles-tmpl.html
archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/redback/templates/user-grids.html

index fb2bd9f41f7eaac856811ba2abe4a8a17efccc6f..8d1b9195b2abc32d03ca8fbdb464f19d92af7fad 100644 (file)
@@ -33,24 +33,51 @@ $(function() {
     this.modified=ko.observable(false);
   }
 
-  RepositoryGroupViewModel=function(){
+  RepositoryGroupViewModel=function(repositoryGroup,update,repositoryGroupsViewModel){
+    this.repositoryGroup=repositoryGroup;
+    this.update=update;
+    this.repositoryGroupsViewModel=null;
+  }
+
+  RepositoryGroupsViewModel=function(){
+    var self=this;
     this.repositoryGroups=ko.observableArray([]);
     this.managedRepositories=ko.observableArray([]);
 
-    findManagedRepository=function(id){
+    this.findManagedRepository=function(id){
       return findManagedRepository(id,self.managedRepositories());
     }
+
+    this.deleteRepositoryGroup=function(repositoryGroup){
+      $.log("deleteRepositoryGroup:"+repositoryGroup.id());
+    }
+
+    this.editRepositoryGroup=function(repositoryGroup){
+      $.log("editRepositoryGroup:"+repositoryGroup.id());
+      var repositoryGroupViewModel=new RepositoryGroupViewModel(repositoryGroup,true,self);
+      activateRepositoryGroupEditTab();
+      ko.applyBindings(repositoryGroupViewModel,$("#main-content #repository-groups-edit" ).get(0));
+    }
+
+    repositoryMoved=function(){
+      $.log("repositoryMoved");
+    }
+
+    getManagedRepository=function(id){
+      $.log("getManagedRepository:"+id);
+      return findManagedRepository(self.managedRepositories());
+    }
   }
 
   displayRepositoryGroups=function(){
     screenChange();
     var mainContent = $("#main-content");
     mainContent.html(mediumSpinnerImg());
-    this.repositoryGroupViewModel=new RepositoryGroupViewModel();
+    this.repositoryGroupsViewModel=new RepositoryGroupsViewModel();
     var self=this;
 
     loadManagedRepositories(function(data) {
-      self.repositoryGroupViewModel.managedRepositories(mapManagedRepositories(data));
+      self.repositoryGroupsViewModel.managedRepositories(mapManagedRepositories(data));
 
       $.ajax("restServices/archivaServices/repositoryGroupService/getRepositoriesGroups", {
           type: "GET",
@@ -58,9 +85,9 @@ $(function() {
           success: function(data) {
             var mappedRepositoryGroups=mapRepositoryGroups(data);
             mainContent.html($("#repositoryGroupsMain").tmpl());
-            self.repositoryGroupViewModel.repositoryGroups(mappedRepositoryGroups);
+            self.repositoryGroupsViewModel.repositoryGroups(mappedRepositoryGroups);
             //ko.applyBindings(repositoryGroupViewModel,mainContent.find("#repository-groups-table" ).get(0));
-            ko.applyBindings(repositoryGroupViewModel,mainContent.get(0));
+            ko.applyBindings(repositoryGroupsViewModel,mainContent.find("#repository-groups-view" ).get(0));
 
           }
         }
@@ -71,6 +98,27 @@ $(function() {
 
   }
 
+  activateRepositoryGroupsGridTab=function(){
+    var mainContent = $("#main-content");
+    mainContent.find("#repository-groups-view-tabs-content div[class*='tab-pane']").removeClass("active");
+    mainContent.find("#repository-groups-view-tabs li").removeClass("active");
+
+    mainContent.find("#repository-groups-view").addClass("active");
+    mainContent.find("#repository-groups-view-tabs-li-grid").addClass("active");
+    mainContent.find("#repository-groups-view-tabs-li-edit a").html($.i18n.prop("add"));
+
+  }
+
+  activateRepositoryGroupEditTab=function(){
+    var mainContent = $("#main-content");
+
+    mainContent.find("#repository-groups-view-tabs-content div[class*='tab-pane']").removeClass("active");
+    mainContent.find("#repository-groups-view-tabs li").removeClass("active");
+
+    mainContent.find("#repository-groups-edit").addClass("active");
+    mainContent.find("#repository-groups-view-tabs-li-edit").addClass("active");
+  }
+
   mapRepositoryGroups=function(data){
     if (data == null){
       return new Array();
index 45fb7eb53ae2a29d2ef0d88f12c70aaea840b998..66ade36471927e1d7320cacbc758f306fd263b0a 100644 (file)
@@ -71,7 +71,9 @@
         {{/if}}
           <td>${row.useNtlm()}</td>
           <td>
-            <a href="#" data-bind="click: function(){ editNetworkProxy(row) }">${$.i18n.prop('edit')}</a>
+            <a href="#" data-bind="click: function(){ editNetworkProxy(row) }">
+              <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
+            </a>
           </td>
           <td>
             <a href="#" data-bind="click: function(){ removeNetworkProxy(row) }">
index 089490485bff324d23540247564fca083694f48f..b0877f79f4a2582b30a230c437b2ce110379e94b 100644 (file)
@@ -81,7 +81,7 @@
       </td>
       <td>
         <a data-bind="click: function(){ editProxyConnector(row)}" href="#">
-           ${$.i18n.prop('edit')}
+          <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
         </a>
       </td>
       <td>
@@ -98,7 +98,7 @@
       </td>
       <td>
         {{if orderChangeAware(row)}}
-          <a href="#" class="btn btn-warning" data-bind="click: function(){ displayOrderEdit(row)}">
+          <a href="#" class="btn btn-info" data-bind="click: function(){ displayOrderEdit(row)}">
               ${$.i18n.prop('proxy-connectors.order.edit')}
           </a>
         {{/if}}
index 461b83e4cb7c1610088c94de5966b2b66f5f4dbb..8e0d3b9cb81ae4242fb22f4ba11187ebeab2fcba 100644 (file)
                 <img src="images/view-refresh-22-22.png" title="${$.i18n.prop('managedrepository.scan.now')}"/>
               </a>
             </td>
-            <td><a href="#" data-bind="click: function(){ editManagedRepository(row) }">${$.i18n.prop('edit')}</a></td>
+            <td>
+              <a href="#" data-bind="click: function(){ editManagedRepository(row) }">
+                <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
+              </a>
+            </td>
             <td>
               <a href="#" data-bind="click: function(){ removeManagedRepository(row) }">
                 <img src="images/edit-cut-22-22.png" title="${$.i18n.prop('delete')}"/>
   </thead>
   <tbody>
       {{each(i, row) itemsOnCurrentPage()}}
-          <tr>
+          <tr data-bind="css:{ 'modified': row.modified()}">
             {{each(j, columnDefinition) columns}}
               <td>${ typeof columnDefinition.rowText == 'function' ? columnDefinition.rowText(row) : row[columnDefinition.rowText] }</td>
             {{/each}}
             <td>
-              <a href="#" data-bind="click: function(){ editRemoteRepository(row) }">${$.i18n.prop('edit')}</a>
+              <a href="#" data-bind="click: function(){ editRemoteRepository(row) }">
+                <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
+              </a>
             </td>
             <td>
               <a href="#" data-bind="click: function(){ removeRemoteRepository(row) }">
     <form id="remote-repository-edit-form" class="form-horizontal">
       <fieldset id="remote-repository-edit-fieldset">
         <div class="control-group">
-          <label class="control-label" for="name">${$.i18n.prop('id')}</label>
+          <label class="control-label" for="id">${$.i18n.prop('id')}</label>
           <div class="controls">
             {{if update}}
               <span class="uneditable-input">${$data.remoteRepository.id}</span>
index 03390f482e7d303a6e780f1cc13a70f7359e0d9a..7b6288fbdd01d80c7ef390163e8ddba7179bd599 100644 (file)
   <div class="page-header">
     <h2>${$.i18n.prop('repository.groups.list')}</h2>
   </div>
-  <div id="repository-groups-table" data-bind='template:{name:"repository-groups-table-tmpl"}'>
+  <ul id="repository-groups-view-tabs" class="nav nav-tabs">
+    <li id="repository-groups-view-tabs-li-grid" class="active">
+      <a data-toggle="tab" href="#repository-groups-view" id="repository-groups-view-tabs-a-network-proxies-grid">${$.i18n.prop('repository-groups.grid.tab.title')}</a>
+    </li>
+    <li id="repository-groups-view-tabs-li-edit">
+      <a data-toggle="tab" href="#repository-groups-edit" id="repository-groups-view-tabs-a-edit">${$.i18n.prop('add')}</a>
+    </li>
 
-  </div>
-  <br/><br/>
-    <table class="table table-striped table-bordered">
-      <thead>
-        <th>group</th>
-        <th>repos</th>
-      </thead>
-      <tbody>
-        <div id="repository-groups-table-bind" data-bind="foreach: repositoryGroups">
-          <tr>
-            <td data-bind="value: $data.id"></td>
-          </tr>
+  </ul>
+  <div id="repository-groups-view-tabs-content" class="tab-content">
+    <div id="repository-groups-view" class="tab-pane active">    
+      <div id="repository-groups-table" data-bind='template:{name:"repository-groups-table-tmpl"}'>
+      </div>
+    </div>
+    <div id="repository-groups-edit" class="tab-pane active">
+        <div id="repository-groups-edit-div" data-bind='template:{name:"repository-group-edit-tmpl"}'></div>
+        <div id="repository-groups-edit-order-div"
+             data-bind="sortable: { template: 'repository-group-edit-order-tmpl',data:repositoryGroup.repositories,afterMove: repositoryMoved}">
         </div>
-      </tbody>
-    </table>
-
-  </div>
+    </div>
+  </div>  
 </script>
 
 <script id="repository-groups-table-tmpl" type="text/html">
   <table class="table table-striped table-bordered">
     <thead>
-      <th>group</th>
-      <th>repos</th>
+      <th>${$.i18n.prop('repository.groups.groups.grid.header')}</th>
+      <th>${$.i18n.prop('repository.groups.repositories.grid.header')}</th>
+      <th>${$.i18n.prop('edit')}</th>
+      <th>${$.i18n.prop('delete')}</th>
     </thead>
     <tbody>
     {{each(i, repositoryGroup) repositoryGroups}}
           {{/each}}
           </ul>
         </td>
+        <td>
+          <a href="#" data-bind="click: function(){editRepositoryGroup(repositoryGroup)}">
+            <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
+          </a>
+        </td>
+        <td>
+          <a href="#" data-bind="click: function(){deleteRepositoryGroup(repositoryGroup)}">
+            <img src="images/edit-cut-22-22.png" title="${$.i18n.prop('delete')}"/>
+          </a>
+        </td>
       </tr>
     {{/each}}
     </tbody>
   </table>
+</script>
+
+<script id="repository-group-edit-tmpl" type="text/html">
+  <form id="repository-group-edit-form" class="form-horizontal">
+    <fieldset id="repository-group-edit-fieldset">
+      <div class="control-group">
+        <label class="control-label" for="id">${$.i18n.prop('id')}</label>
+        <div class="controls">
+          {{if update}}
+            <span class="uneditable-input">${repositoryGroup.id}</span>
+          {{else}}
+            <input type="text" class="xlarge required" id="id" name="id" size="50"
+                   data-bind="value: repositoryGroup.id,css:{'uneditable-input': update},readonly:update"/>
+          {{/if}}
+        </div>
+      </div>
+    </fieldset>
+  </form>
+</script>
+
+<script id="repository-group-edit-order-tmpl" type="text/html">
+  <div class="well draggable-item">
+    ${$data}-${managedRepository.name()}
+  </div>
 </script>
\ No newline at end of file
index 243d573d22c1ac56618789e0cd800e11c8d20fa8..ca3ba47374ce30c0406efd362631f59fd8970732 100644 (file)
               </td>
               {{/each}}
               <td>
-                <a id="edit-role-${row.name()}" href="#" data-bind="click: function(){ editRole(row) }">${$.i18n.prop('edit')}</a>
+                <a id="edit-role-${row.name()}" href="#" data-bind="click: function(){ editRole(row) }">
+                  <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
+                </a>
               </td>
               <td>
                 {{if row.modified()}}
index 03f119f11c8c4c10d6e574f761400b22db1859a3..e1a057ca2d6b0989fc99d968174c224a3b7a6685 100644 (file)
               {{each(j, columnDefinition) columns}}
               <td>${ typeof columnDefinition.rowText == 'function' ? columnDefinition.rowText(row) : row[columnDefinition.rowText] }</td>
               {{/each}}
-              <td id="users-grid-user-id-${row.username()}"><a href="#" data-bind="click: function(){ editUserBox(row) }">Edit</a></td>
+              <td id="users-grid-user-id-${row.username()}">
+                <a href="#" data-bind="click: function(){ editUserBox(row) }">
+                  <img src="images/edit-find-22-22.png" title="${$.i18n.prop('edit')}">
+                </a>
+              </td>
               {{if row.username()=="admin" || row.username()=="guest"}}
                 <td></td>
               {{else}}