Merge pull request #752 from kartoza/search-page-doc

Add search page docs
kartoza · Feb 26, 2025 · fd951d9 · fd951d9
2 parents b5b605a + 9143aee
commit fd951d9
Show file tree

Hide file tree

Showing 48 changed files with 166 additions and 1 deletion.
diff --git a/docs/mkdocs-base.yml b/docs/mkdocs-base.yml
@@ -51,10 +51,12 @@ nav:
                           - user/guide/index.md
                           - Sign Up: user/guide/sign-up.md
                           - Login: user/guide/login.md
+                          - Search Page: user/guide/search-page.md
                   - Manual :
                           - user/manual/index.md
                           - Sign Up: user/manual/sign-up.md
                           - Login: user/manual/login.md
+                          - Search Page: user/manual/search-page.md
                           - Landing Page: user/manual/landing-page.md
         - Administrators:
                 - administrator/index.md
@@ -98,4 +100,3 @@ nav:
                   - License: about/license.md
                   - Contributing: about/contributing.md
                   - Disclaimer: about/disclaimer.md
-
diff --git a/docs/src/user/guide/img/search-img-1.png b/docs/src/user/guide/img/search-img-1.png
diff --git a/docs/src/user/guide/img/search-img-10.png b/docs/src/user/guide/img/search-img-10.png
diff --git a/docs/src/user/guide/img/search-img-11.png b/docs/src/user/guide/img/search-img-11.png
diff --git a/docs/src/user/guide/img/search-img-12.png b/docs/src/user/guide/img/search-img-12.png
diff --git a/docs/src/user/guide/img/search-img-13.png b/docs/src/user/guide/img/search-img-13.png
diff --git a/docs/src/user/guide/img/search-img-14.png b/docs/src/user/guide/img/search-img-14.png
diff --git a/docs/src/user/guide/img/search-img-15.png b/docs/src/user/guide/img/search-img-15.png
diff --git a/docs/src/user/guide/img/search-img-2.png b/docs/src/user/guide/img/search-img-2.png
diff --git a/docs/src/user/guide/img/search-img-3.png b/docs/src/user/guide/img/search-img-3.png
diff --git a/docs/src/user/guide/img/search-img-4.png b/docs/src/user/guide/img/search-img-4.png
diff --git a/docs/src/user/guide/img/search-img-5.png b/docs/src/user/guide/img/search-img-5.png
diff --git a/docs/src/user/guide/img/search-img-6.png b/docs/src/user/guide/img/search-img-6.png
diff --git a/docs/src/user/guide/img/search-img-7.png b/docs/src/user/guide/img/search-img-7.png
diff --git a/docs/src/user/guide/img/search-img-8.png b/docs/src/user/guide/img/search-img-8.png
diff --git a/docs/src/user/guide/img/search-img-9.png b/docs/src/user/guide/img/search-img-9.png
diff --git a/docs/src/user/guide/index.md b/docs/src/user/guide/index.md
@@ -16,3 +16,5 @@ license: This program is free software; you can redistribute it and/or modify it
 * **[Sign Up](./sign-up.md):** You can use this page to walk through the signup process.
 
 * **[Login](./login.md):** You can use this page to walk through the login process.
+
+* **[Search](./search-page.md):** You can use this page as a walkthrough to learn how to access the search page.
diff --git a/docs/src/user/guide/search-page.md b/docs/src/user/guide/search-page.md
@@ -0,0 +1,53 @@
+---
+title: PROJECT_TITLE
+summary: PROJECT_SUMMARY
+    - Ketan Bamniya
+date: 28-03-2024
+some_url: https://github.com/kartoza/catalogue
+copyright: Copyright 2024, SANSA
+contact: PROJECT_CONTACT
+license: This program is free software; you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation; either version 3 of the License, or (at your option) any later version.
+#context_id: 1234
+---
+
+# Search Page
+
+You can access the search page by clicking on the 1️⃣ `Search` option in the navigation bar or by clicking on the 2️⃣ `SEARCH` button in the middle of the page. Both options will redirect you to the search page.
+
+[![Home Page](./img/search-img-1.png)](./img/search-img-1.png)
+
+You can access various functionalities to explore the map. You can apply different parameters by clicking on the 1️⃣ ![Parameters](./img/search-img-3.png) icon, this icon hide/show the filter menu. You can zoom in and zoom out using the 2️⃣ `➕` and 3️⃣ `➖` icons. Use the 4️⃣ ![Draw](./img/search-img-4.png) icon to draw a polygon on the map. To download the map in PNG format, click on the 5️⃣ ![Print](./img/search-img-5.png) icon. After drawing a polygon, you can copy the link by clicking on the 6️⃣ ![Link](./img/search-img-6.png) icon. To change the type of map, click on the 7️⃣ ![Legend](./img/search-img-7.png) icon.
+
+[![Home Page 2](./img/search-img-2.png)](./img/search-img-2.png)
+
+## How to apply parameters?
+
+First, you need to select the 1️⃣ `SATELLITES` type by checking the checkbox of the respective satellite. If you want to select a specific satellite, you can do so by clicking on the satellite type, which will open the dropdown menu. Then, check the checkbox of the respective satellite. If no satellite is selected, all satellites are selected by default. Then, select the 2️⃣ `DATES RANGES` (from and to) by clicking on the respective fields. After this, click on the 3️⃣ `Add` button to add it to the 4️⃣ `From/To` field. You can access additional options from the 5️⃣ `OTHER` section. Once all necessary details are filled in, apply them by clicking on the 7️⃣ `APPLY` button or you can reset the form using the 6️⃣ `RESET` button.
+
+[![Parameters](./img/search-img-8.png)](./img/search-img-8.png)
+
+* You will encounter the following error if you forget to fill in either of the date fields.
+
+    ![Error](./img/search-img-9.png)
+
+* You will encounter this alert message, if no data is found based you search results.
+
+    ![Alert Message](./img/search-img-10.png)
+
+### Result Data
+
+After successfully retrieving the data, this menu will appear. You can use the 1️⃣ ![Menu Icon](./img/search-img-12.png) icon to hide this menu. To access the metadata of any specific result, click on the 2️⃣ ![Explore Icon](./img/search-img-13.png) icon. This will open a pop-up window containing the metadata of the particular result. 
+
+[![Result Data](./img/search-img-11.png)](./img/search-img-11.png)
+
+* You can see the available data in the 1️⃣ `Data` as shown in the below image.
+
+    [![Metadata](./img/search-img-14.png)](./img/search-img-14.png)
+
+## How to draw polygon?
+
+Users are required to click on the 1️⃣ `Draw polygon` icon to draw the polygon, then points the locations on which you want to draw the polygon then to end the drawing click on the last point.
+
+[![Draw Polygon](./img/search-img-15.png)](./img/search-img-15.png)
+
+For better understanding you can use [manual](./search-page.md).
diff --git a/docs/src/user/manual/img/search-img-1.png b/docs/src/user/manual/img/search-img-1.png
diff --git a/docs/src/user/manual/img/search-img-10.png b/docs/src/user/manual/img/search-img-10.png
diff --git a/docs/src/user/manual/img/search-img-11.png b/docs/src/user/manual/img/search-img-11.png
diff --git a/docs/src/user/manual/img/search-img-12.png b/docs/src/user/manual/img/search-img-12.png
diff --git a/docs/src/user/manual/img/search-img-13.png b/docs/src/user/manual/img/search-img-13.png
diff --git a/docs/src/user/manual/img/search-img-14.png b/docs/src/user/manual/img/search-img-14.png
diff --git a/docs/src/user/manual/img/search-img-15.png b/docs/src/user/manual/img/search-img-15.png
diff --git a/docs/src/user/manual/img/search-img-16.png b/docs/src/user/manual/img/search-img-16.png
diff --git a/docs/src/user/manual/img/search-img-17.png b/docs/src/user/manual/img/search-img-17.png
diff --git a/docs/src/user/manual/img/search-img-18.png b/docs/src/user/manual/img/search-img-18.png
diff --git a/docs/src/user/manual/img/search-img-19.png b/docs/src/user/manual/img/search-img-19.png
diff --git a/docs/src/user/manual/img/search-img-2.png b/docs/src/user/manual/img/search-img-2.png
diff --git a/docs/src/user/manual/img/search-img-20.png b/docs/src/user/manual/img/search-img-20.png
diff --git a/docs/src/user/manual/img/search-img-21.png b/docs/src/user/manual/img/search-img-21.png
diff --git a/docs/src/user/manual/img/search-img-22.png b/docs/src/user/manual/img/search-img-22.png
diff --git a/docs/src/user/manual/img/search-img-23.png b/docs/src/user/manual/img/search-img-23.png
diff --git a/docs/src/user/manual/img/search-img-24.png b/docs/src/user/manual/img/search-img-24.png
diff --git a/docs/src/user/manual/img/search-img-25.png b/docs/src/user/manual/img/search-img-25.png
diff --git a/docs/src/user/manual/img/search-img-26.png b/docs/src/user/manual/img/search-img-26.png
diff --git a/docs/src/user/manual/img/search-img-27.png b/docs/src/user/manual/img/search-img-27.png
diff --git a/docs/src/user/manual/img/search-img-28.png b/docs/src/user/manual/img/search-img-28.png
diff --git a/docs/src/user/manual/img/search-img-3.png b/docs/src/user/manual/img/search-img-3.png
diff --git a/docs/src/user/manual/img/search-img-4.png b/docs/src/user/manual/img/search-img-4.png
diff --git a/docs/src/user/manual/img/search-img-5.png b/docs/src/user/manual/img/search-img-5.png
diff --git a/docs/src/user/manual/img/search-img-6.png b/docs/src/user/manual/img/search-img-6.png
diff --git a/docs/src/user/manual/img/search-img-7.png b/docs/src/user/manual/img/search-img-7.png
diff --git a/docs/src/user/manual/img/search-img-8.png b/docs/src/user/manual/img/search-img-8.png
diff --git a/docs/src/user/manual/img/search-img-9.png b/docs/src/user/manual/img/search-img-9.png
diff --git a/docs/src/user/manual/index.md b/docs/src/user/manual/index.md
@@ -21,3 +21,5 @@ you may prefer to work through our [user guide](../guide/index.md).
 * **[Sign Up](./sign-up.md):** Users can use this page to walk through the signup process.
 
 * **[Login](./login.md):** Users can use this page to walk through the login process.
+
+* **[Search](./search-page.md):** Users can use this page as a walkthrough to learn how to access the search page.
diff --git a/docs/src/user/manual/search-page.md b/docs/src/user/manual/search-page.md
@@ -0,0 +1,107 @@
+---
+title: PROJECT_TITLE
+summary: PROJECT_SUMMARY
+    - Ketan Bamniya
+date: 28-03-2024
+some_url: https://github.com/kartoza/catalogue
+copyright: Copyright 2024, SANSA
+contact: PROJECT_CONTACT
+license: This program is free software; you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation; either version 3 of the License, or (at your option) any later version.
+#context_id: 1234
+---
+
+# Search Page
+
+[![Home Page](./img/search-img-1.png)](./img/search-img-1.png)
+
+1. **Search:** By clicking on this link users will be able to access the search page.
+
+2. **SEARCH:** Alternatively users can use this button access the search page.
+
+[![Search Page](./img/search-img-2.png)](./img/search-img-2.png)
+
+1. **![Parameter Icon](./img/search-img-3.png) Icon:** Users can use this icon to hide/show the parameters, although this is show by default.
+
+    [![Search Page](./img/search-img-4.png)](./img/search-img-4.png)
+
+2. **![Zoom In](./img/search-img-5.png) Icon:** By clicking on this icon, users can zoom in on the map.
+
+3. **![Zoom Out](./img/search-img-6.png) Icon:** By clicking on this icon, users can zoom out on the map.
+
+4. **![Draw Icon](./img/search-img-7.png) Icon:** By clicking on this icon, users can draw on the map.
+
+5. **![Print Icon](./img/search-img-8.png) Icon:** By clicking on this icon, users can print the map. After clicking on the icon, the map will be downloaded in `PNG` format.
+
+    ![Map](./img/search-img-9.png)
+
+6. **![Copy Link](./img/search-img-10.png) Icon:** Users can copy the link (if available) by clicking on this icon.
+
+7. **![Legend Icon](./img/search-img-11.png) Icon:** Users can use this button change the type of the map.
+
+    ![Map Legend](./img/search-img-12.png)
+
+    * **OpenStreetMap:** This is the default map type. OpenStreetMap (OSM) is a collaborative mapping project that provides freely accessible and editable geographic data. It is built by a global community of volunteers who contribute and maintain map data for public use.
+
+        [![OSM](./img/search-img-13.png)](./img/search-img-14.png)
+
+    * **Tone:** This map type is used for visualizing the data in a tone map.
+
+    * **Topography:** Topography refers to the detailed mapping and study of the Earth's surface features, including mountains, valleys, plains, and bodies of water. It helps in understanding elevation, terrain shapes, and landforms, often represented through contour lines on maps.
+
+        [![Topography](./img/search-img-14.png)](./img/search-img-14.png)
+
+## Apply Parameters
+
+![Parameters](./img/search-img-15.png)
+
+1. **SATELLITES:** Users can select the type of satellite by checking the respective checkboxes. If they want to choose a specific satellite, they can select it from the dropdown menu. If users do not select a specific satellite, all satellites will be selected by default.
+
+2. **DATE RANGES:** Users are required to select the `From` and `To` dates from the calendar.
+
+    ![Calender](./img/search-img-16.png)
+
+    * If users click on the `APPLY` button without specifying the dates, they will encounter the following error.
+
+        ![Error](./img/search-img-18.png)
+
+    * If users click on the `Add` button without selecting the either dates, they will encounter the following error.
+
+        ![Error](./img/search-img-19.png)
+
+3. **Add:** After selecting the dates click in this button, this will add those date into the below input.
+
+![Parameters](./img/search-img-17.png)
+
+1. **From/To Dates:** These dates are automatically added when user clicks on the `Add` button. To remove the dates click on the `x` icon. Users can select multiple dates.
+
+    ![Dates](./img/search-img-20.png)
+
+2. **Others:** Users can use these options to add some more filters to the data.
+
+3. **RESET:** Use this button to reset the form.
+
+4. **APPLY:** To apply the filter click on this apply button.
+
+    ![Alert Message](./img/search-img-24.png)
+
+    * Users will get the above alert message if no results were found.
+
+![Data](./img/search-img-21.png)
+
+1. **![Hide](./img/search-img-22.png) Icon:** Users can use this button to hide the data.
+
+2. **![Explore](./img/search-img-23.png) Icon:** Users can use this icon to open explore the metadata of the result set.
+
+    [![Metadata](./img/search-img-25.png)](./img/search-img-25.png)
+
+## Draw Polygon
+
+[![Home Page](./img/search-img-26.png)](./img/search-img-26.png)
+
+1. **![Draw Icon](./img/search-img-7.png) Icon:** By clicking on this, users will be able to draw a polygon. After clicking on this icon, they need to mark points on the map, and to complete the drawing, they must click on the first point. After drawing the polygon users will also be able to copy the link using the ![Copy](./img/search-img-10.png) icon.
+
+    [![Polygon](./img/search-img-27.png)](./img/search-img-27.png)
+
+* After completing the editing, the `Draw Polygon` changes to `Delete Polygon`.
+
+    [![Delete Polygon](./img/search-img-28.png)](./img/search-img-28.png)
Original file line number	Diff line number	Diff line change
Expand Up		@@ -16,3 +16,5 @@ license: This program is free software; you can redistribute it and/or modify it
		* [Sign Up](./sign-up.md): You can use this page to walk through the signup process.

		* [Login](./login.md): You can use this page to walk through the login process.

		* [Search](./search-page.md): You can use this page as a walkthrough to learn how to access the search page.
Original file line number	Diff line number	Diff line change
Expand Up		@@ -21,3 +21,5 @@ you may prefer to work through our [user guide](../guide/index.md).
		* [Sign Up](./sign-up.md): Users can use this page to walk through the signup process.

		* [Login](./login.md): Users can use this page to walk through the login process.

		* [Search](./search-page.md): Users can use this page as a walkthrough to learn how to access the search page.