From e68699ef2ed3f514a72409940789ada57f26f571 Mon Sep 17 00:00:00 2001
From: Olivier Lamy <olamy@apache.org>
Date: Mon, 27 Feb 2012 10:34:45 +0000
Subject: [PATCH] start binding for searching

git-svn-id: https://svn.apache.org/repos/asf/archiva/trunk@1294098 13f79535-47bb-0310-9956-ffa450edef68
---
 .../src/main/webapp/js/archiva/search.js      | 61 ++++++++++++-
 .../webapp/js/archiva/templates/search.html   | 91 +++++++++++--------
 2 files changed, 114 insertions(+), 38 deletions(-)

diff --git a/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/search.js b/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/search.js
index f9d698a21..0134565d2 100644
--- a/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/search.js
+++ b/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/search.js
@@ -408,8 +408,67 @@ $(function() {
   // search part
   //-----------------------------------------
 
+  SearchRequest=function(){
+    //private String groupId;
+    this.groupId=ko.observable();
+
+    //private String artifactId;
+    this.artifactId=ko.observable();
+
+    //private String version;
+    this.version=ko.observable();
+
+    //private String packaging;
+    this.packaging=ko.observable();
+
+    //private String className;
+    this.className=ko.observable();
+
+    //private List<String> repositories = new ArrayList<String>();
+    this.repositories=ko.observableArray();
+
+    //private String bundleVersion;
+    this.bundleVersion=ko.observable();
+
+    //private String bundleSymbolicName;
+    this.bundleSymbolicName=ko.observable();
+
+    //private String bundleExportPackage;
+    this.bundleExportPackage=ko.observable();
+
+    //private String bundleExportService;
+    this.bundleExportService=ko.observable();
+
+    //private String classifier;
+    this.classifier=ko.observable();
+
+    //private boolean includePomArtifacts = false;
+    this.includePomArtifacts=ko.observable(false);
+  }
+
+
+  SearchParameters=function(){
+    this.basicQueryString=ko.observable();
+    this.searchRequest=ko.observable(new SearchRequest());
+  }
+
+  SearchViewModel=function(){
+    this.searchParameters=ko.observable(new SearchParameters());
+
+    basicSearch=function(){
+      $.log("query:"+this.searchParameters().basicQueryString())
+    }
+
+    advancedSearch=function(){
+      $.log("groupId:"+this.searchParameters().searchRequest().groupId());
+    }
+  }
+
   displaySearch=function(){
-    $("#main-content" ).html($("#search-artifacts-form" ).tmpl());
+    var mainContent=$("#main-content");
+    mainContent.html($("#search-artifacts-div-tmpl" ).tmpl());
+    var searchViewModel=new SearchViewModel();
+    ko.applyBindings(searchViewModel,mainContent.find("#search-artifacts-div").get(0));
   }
 
 });
\ No newline at end of file
diff --git a/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/search.html b/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/search.html
index 8118426c5..9b2f85e90 100644
--- a/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/search.html
+++ b/archiva-modules/archiva-web/archiva-webapp-js/src/main/webapp/js/archiva/templates/search.html
@@ -145,59 +145,76 @@
     </div>
   </div>
 </script>
+<script id="search-artifacts-div-tmpl" type="text/html">
+    <div id="search-artifacts-div" data-bind='template:{name:"search-artifacts-form-tmpl"}'>
+    </div>
+</script>
+<script id="search-artifacts-form-tmpl" type="text/html">
 
-<script id="search-artifacts-form" type="text/html">
   <div class="page-header">
     <h3>${$.i18n.prop('search.artifact.header')}</h3>
   </div>
   <div class="accordion" id="search-artifacts-accordion">
     <div class="accordion-group">
-        <div class="accordion-heading">
-          <a class="accordion-toggle" href="#search-form-collapse" data-parent="#search-artifacts-accordion" data-toggle="collapse">${$.i18n.prop('search.artifact.form.header')}</a>
-        </div>
-        <div id="search-form-collapse" class="accordion-body collapse in">
-          <div class="tabbable tabs-below">
-            <ul class="nav nav-tabs">
-              <li class="active">
-                <a href="#search-basic-form-pane" data-toggle="tab">${$.i18n.prop('search.artifact.search.form.basic')}</a>
-              </li>
-              <li>
-                <a href="#search-advanced-form-pane" data-toggle="tab">${$.i18n.prop('search.artifact.search.form.advanced')}</a>
-              </li>
-              <li>
-                <a href="#search-osgi-form-pane" data-toggle="tab">${$.i18n.prop('search.artifact.search.form.osgi')}</a>
-              </li>
-            </ul>
-            <div class="tab-content">
-              <div class="tab-pane active" id="search-basic-form-pane">
-                <form class="well form-horizontal" id="search-basic-form">
+      <div class="accordion-heading">
+        <a class="accordion-toggle" href="#search-form-collapse" data-parent="#search-artifacts-accordion" data-toggle="collapse">${$.i18n.prop('search.artifact.form.header')}</a>
+      </div>
+      <div id="search-form-collapse" class="accordion-body collapse in">
+        <div class="tabbable tabs-below">
+          <ul class="nav nav-tabs">
+            <li class="active">
+              <a href="#search-basic-form-pane" data-toggle="tab">${$.i18n.prop('search.artifact.search.form.basic')}</a>
+            </li>
+            <li>
+              <a href="#search-advanced-form-pane" data-toggle="tab">${$.i18n.prop('search.artifact.search.form.advanced')}</a>
+            </li>
+            <li>
+              <a href="#search-osgi-form-pane" data-toggle="tab">${$.i18n.prop('search.artifact.search.form.osgi')}</a>
+            </li>
+          </ul>
+          <div class="tab-content">
+            <div class="tab-pane active" id="search-basic-form-pane">
+              <form class="well form-horizontal" id="search-basic-form">
+                <fieldset>
+                  <div class="control-group">
+                    <label class="control-label" for="search-terms">${$.i18n.prop('search.artifact.search.form.query.terms')}</label>
+                    <div class="controls">
+                      <input type="text" class="input-medium search-query" id="search-terms" name="search-terms" size="50"
+                             data-bind="value: searchParameters().basicQueryString"/>
+                    </div>
+                  </div>
+                </fieldset>
+                <button type="submit" class="btn" data-bind="click: basicSearch">Search</button>
+              </form>
+            </div>
+            <div class="tab-pane" id="search-advanced-form-pane">
+                <form class="well form-horizontal" id="search-advanced-form">
                   <fieldset>
                     <div class="control-group">
-                      <label class="control-label" for="search-terms">${$.i18n.prop('search.artifact.search.form.query.terms')}</label>
+                      <label class="control-label" for="groupId">${$.i18n.prop('search.artifact.search.form.query.groupId')}</label>
                       <div class="controls">
-                        <input type="text" class="input-medium search-query" id="search-terms" name="search-terms" size="50"
-                               data-bind="value: managedRepository.name"/>
+                        <input type="text" class="input-medium search-query" id="groupId" name="groupId" size="50"
+                               data-bind="value: searchParameters().searchRequest().groupId"/>
                       </div>
                     </div>
                   </fieldset>
-                  <button type="submit" class="btn">Search</button>
+                  <button type="submit" class="btn" data-bind="click: advancedSearch">Search</button>
                 </form>
-              </div>
-              <div class="tab-pane" id="search-advanced-form-pane">
-                <p>advanced search form.</p>
-              </div>
-              <div class="tab-pane" id="search-osgi-form-pane">
-                <p>osgi search form.</p>
-              </div>
+            </div>
+            <div class="tab-pane" id="search-osgi-form-pane">
+              <p>osgi search form.</p>
             </div>
           </div>
         </div>
+      </div>
 
-        <div class="accordion-heading">
-          <a class="accordion-toggle" href="#search-results" data-parent="#search-artifacts-accordion" data-toggle="collapse">${$.i18n.prop('search.artifact.results.header')}</a>
-        </div>
-        <div id="search-results" class="accordion-body collapse">
-          results
-        </div>
+      <div class="accordion-heading">
+        <a class="accordion-toggle" href="#search-results" data-parent="#search-artifacts-accordion" data-toggle="collapse">${$.i18n.prop('search.artifact.results.header')}</a>
+      </div>
+      <div id="search-results" class="accordion-body collapse">
+        results
+      </div>
     </div>
+  </div>
+
 </script>
\ No newline at end of file
-- 
2.39.5