XengShi · ashesbloom · Jan 13, 2025 · Jan 13, 2025 · Jan 13, 2025 · Jan 13, 2025
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,5 @@
+# Ignore macOS system files
+.DS_Store
+
+# Ignore VSCode workspace settings
+.vscode/
diff --git a/index.html b/index.html
@@ -733,6 +733,7 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                                     Bing
                                 </span>
                             </div>
+
                             <div data-engine="4" data-engine-name="brave" id="brave-dropdown" class="dropdown-item">
                                 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
                                     <rect class="accentColor" height="24" rx="12" width="24" />
@@ -745,6 +746,7 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                                     Brave
                                 </span>
                             </div>
+
                             <div data-engine="5" data-engine-name="youtube" id="youtube-dropdown" class="dropdown-item">
                                 <svg fill="none" height="28" viewBox="0 0 28 28" width="28"
                                     xmlns="http://www.w3.org/2000/svg">
@@ -758,6 +760,28 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                                     YouTube
                                 </span>
                             </div>
+
+                            <div data-engine="6" data-engine-name="gImages" id="gImages-dropdown" class="dropdown-item">
+                                <svg height="100%" width="100%" viewBox="0 0 50 50" xmlns="http://www.w3.org/2000/svg">
+                                    <rect class="accentColor" height="100%" rx="50%" width="100%" />
+                                    <path class="darkIconForDarkTheme" fill="#fffffff0"
+                                        style="transform: scale(0.8); transform-origin: center;"
+                                        d="M 24.84375 0 C 24.351563 0.078125 23.992188 0.503906 24 1 L 24 11 L 13 11 C 12.96875 11 12.9375 11 12.90625 11 C 12.65625 11.019531 12.421875 11.128906 12.25 11.3125 L 12.25 11.34375 C 12.226563 11.363281 12.207031 11.382813 12.1875 11.40625 L 0.25 24.3125 C -0.0273438 24.605469 -0.101563 25.039063 0.0625 25.40625 C 0.226563 25.777344 0.597656 26.007813 1 26 L 11 26 L 11 37 C 10.992188 37.28125 11.105469 37.554688 11.3125 37.75 L 24.3125 49.75 C 24.605469 50.027344 25.039063 50.101563 25.40625 49.9375 C 25.777344 49.773438 26.007813 49.402344 26 49 L 26 39 L 37 39 C 37.28125 39.007813 37.554688 38.894531 37.75 38.6875 L 49.75 25.6875 C 50.027344 25.394531 50.101563 24.960938 49.9375 24.59375 C 49.773438 24.222656 49.402344 23.992188 49 24 L 39 24 L 39 13 C 39.007813 12.71875 38.894531 12.445313 38.6875 12.25 L 25.6875 0.25 C 25.460938 0.0390625 25.148438 -0.0507813 24.84375 0 Z M 26 3.3125 L 36.5 13 L 27.25 22.25 C 26.480469 21.363281 26 20.210938 26 18.9375 L 26 12 C 26 11.96875 26 11.9375 26 11.90625 Z M 13 13.5 L 22.25 22.75 C 21.363281 23.519531 20.210938 24 18.9375 24 L 3.3125 24 Z M 25 22.5625 C 25.597656 23.558594 26.441406 24.402344 27.4375 25 C 26.441406 25.597656 25.597656 26.441406 25 27.4375 C 24.402344 26.441406 23.558594 25.597656 22.5625 25 C 23.558594 24.402344 24.402344 23.558594 25 22.5625 Z M 31.0625 26 L 46.6875 26 L 37 36.5 L 27.75 27.25 C 28.636719 26.480469 29.789063 26 31.0625 26 Z M 22.75 27.75 C 23.519531 28.636719 24 29.789063 24 31.0625 L 24 38 C 24 38.03125 24 38.0625 24 38.09375 L 24 46.6875 L 13.5 37 Z" />
+                                </svg>
+                                <span class="engine-name" id="gImagesEngineDD">Images</span>
+                            </div>
+
+                            <div data-engine="7" data-engine-name="wikipedia" id="wikipedia-dropdown"
+                                class="dropdown-item">
+                                <svg height="100%" width="100%" viewBox="0 -0.7 32 32"
+                                    xmlns="http://www.w3.org/2000/svg">
+                                    <rect class="accentColor" height="100%" rx="50%" width="100%" />
+                                    <path class="darkIconForDarkTheme" fill="#fffffff0"
+                                        style="transform: scale(0.85); transform-origin: center;"
+                                        d="M30 9.215a.31.31 0 0 1-.313.308h-1.68l-7.616 16.215a.31.31 0 0 1-.278.18h-.004a.31.31 0 0 1-.28-.172l-3.614-7.168l-3.902 7.18a.313.313 0 0 1-.555-.016L4.055 9.523H2.313A.31.31 0 0 1 2 9.215V8.39a.31.31 0 0 1 .313-.309h6.21a.31.31 0 0 1 .313.309v.824a.31.31 0 0 1-.313.308H7.188l5.316 12.262l2.766-5.168l-3.508-7.09h-.844a.313.313 0 0 1-.313-.312v-.82c0-.172.141-.313.313-.313h4.598a.31.31 0 0 1 .308.313v.82a.307.307 0 0 1-.308.308h-.813l2.02 4.415l2.402-4.415h-1.473a.31.31 0 0 1-.312-.308v-.82a.31.31 0 0 1 .312-.313h4.465a.31.31 0 0 1 .309.313v.82a.307.307 0 0 1-.309.308h-.98l-3.504 6.372l2.855 5.875L26 9.523h-1.746a.31.31 0 0 1-.313-.308v-.82c0-.172.141-.313.313-.313h5.433a.31.31 0 0 1 .313.313z" />
+                                </svg>
+                                <span class="engine-name" id="wikipediaEngineDD">Wikipedia</span>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -784,10 +808,10 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
             <!-- ----------search with------------------- -->
             <div class="searchWithCont" style="visibility: hidden;" id="search-with-container">
 
-                <div class="hint bgLightTint" id="searchWithHint">Search With</div>
+                <div class="hint bgLightTint" id="searchWithHint"></div>
 
                 <div class="searchEnginesContainer">
-                    <div class="search-engine bgLightTint">
+                    <div class="search-engine bgLightTint" data-category="search-with">
                         <!-- <img src="./svgs/google.svg" alt="G" class="logo"> -->
                         <svg fill="none" height="28" viewBox="0 0 28 28" width="28" xmlns="http://www.w3.org/2000/svg">
                             <rect class="accentColor" fill="#FF000F" height="28" rx="14" width="28" />
@@ -799,7 +823,7 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                         <input checked class="radio-button" name="search-engine" type="radio" value="engine1">
                     </div>
 
-                    <div class="search-engine bgLightTint">
+                    <div class="search-engine bgLightTint" data-category="search-with">
                         <!-- <img src="./svgs/duck.svg" alt="D" class="logo"> -->
                         <svg fill="none" height="28" viewBox="0 0 28 28" width="28" xmlns="http://www.w3.org/2000/svg">
                             <rect class="accentColor" fill="#FF00ff" height="28" rx="14" width="28" />
@@ -811,19 +835,19 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                         <input class="radio-button" name="search-engine" type="radio" value="engine2">
                     </div>
 
-                    <div class="search-engine bgLightTint">
+                    <div class="search-engine bgLightTint" data-category="search-with">
                         <!-- <img src="./svgs/bing.svg" alt="B" class="logo"> -->
                         <svg fill="none" height="28" viewBox="0 0 28 28" width="28" xmlns="http://www.w3.org/2000/svg">
                             <rect class="accentColor" fill="#FF000F" height="28" rx="14" width="28" />
                             <path class="darkIconForDarkTheme"
                                 d="M22.9991 13.1645C22.9954 13.0734 22.9651 12.9855 22.9119 12.9118C22.8588 12.8382 22.7853 12.7822 22.7007 12.751L13.8694 9.98251C13.7046 9.93107 13.6294 10.0197 13.7018 10.1788L15.3442 13.8304C15.4167 13.9904 15.604 14.18 15.7602 14.2524L18.0135 15.2966C18.1697 15.369 18.1735 15.4957 18.021 15.5776L8.40754 20.7525C8.25601 20.8345 8.23624 20.8059 8.36425 20.6887L12.0575 17.3219C12.197 17.1796 12.28 16.9905 12.291 16.7904L12.2947 6.58526C12.291 6.49394 12.2606 6.40578 12.2073 6.33199C12.154 6.25821 12.0803 6.20212 11.9954 6.17084L8.2993 5.01334C8.13459 4.9619 8 5.06383 8 5.24008V20.7211C8 20.8974 8.11483 21.1241 8.25601 21.2251L12.0114 23.9183C12.1526 24.0193 12.3879 24.0279 12.5357 23.9373L22.7308 17.723C22.8093 17.6688 22.8744 17.597 22.921 17.5133C22.9677 17.4295 22.9947 17.336 23 17.24V13.1645H22.9991Z"
                                 fill="white" />
                         </svg>
-                        <label class="engine-name" id="bingEngine">Bing</label>
+                        <label class="engine-name" id="bingEngine" data-category="search-with">Bing</label>
                         <input class="radio-button" name="search-engine" type="radio" value="engine3">
                     </div>
 
-                    <div class="search-engine bgLightTint">
+                    <div class="search-engine bgLightTint" data-category="search-with">
                         <!-- <img src="./svgs/brave.svg" alt="B" class="logo"> -->
                         <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 -0.5 24 24">
                             <rect class="accentColor" fill="#FF000F" height="28" rx="14" width="28" />
@@ -835,7 +859,7 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                         <input class="radio-button" name="search-engine" type="radio" value="engine4">
                     </div>
 
-                    <div class="search-engine bgLightTint">
+                    <div class="search-engine bgLightTint" data-category="search-on">
                         <!-- <img src="./svgs/youtube.svg" alt="Y" class="logo"> -->
                         <svg fill="none" height="28" viewBox="0 0 28 28" width="28" xmlns="http://www.w3.org/2000/svg">
                             <rect class="accentColor" fill="#FF000F" height="28" rx="14" width="28" />
@@ -846,6 +870,28 @@ <h2 id="editBookmarkHeading">Edit Bookmark</h2>
                         <label class="engine-name" id="youtubeEngine">YouTube</label>
                         <input class="radio-button" name="search-engine" type="radio" value="engine5">
                     </div>
+
+                    <div class="search-engine bgLightTint" data-category="search-on">
+                        <svg height="100%" width="100%" viewBox="0 0 50 50" xmlns="http://www.w3.org/2000/svg">
+                            <rect class="accentColor" fill="#FF000F" height="100%" rx="50%" width="100%" />
+                            <path class="darkIconForDarkTheme" style="transform: scale(0.92); transform-origin: center;"
+                                d="M 24.84375 0 C 24.351563 0.078125 23.992188 0.503906 24 1 L 24 11 L 13 11 C 12.96875 11 12.9375 11 12.90625 11 C 12.65625 11.019531 12.421875 11.128906 12.25 11.3125 L 12.25 11.34375 C 12.226563 11.363281 12.207031 11.382813 12.1875 11.40625 L 0.25 24.3125 C -0.0273438 24.605469 -0.101563 25.039063 0.0625 25.40625 C 0.226563 25.777344 0.597656 26.007813 1 26 L 11 26 L 11 37 C 10.992188 37.28125 11.105469 37.554688 11.3125 37.75 L 24.3125 49.75 C 24.605469 50.027344 25.039063 50.101563 25.40625 49.9375 C 25.777344 49.773438 26.007813 49.402344 26 49 L 26 39 L 37 39 C 37.28125 39.007813 37.554688 38.894531 37.75 38.6875 L 49.75 25.6875 C 50.027344 25.394531 50.101563 24.960938 49.9375 24.59375 C 49.773438 24.222656 49.402344 23.992188 49 24 L 39 24 L 39 13 C 39.007813 12.71875 38.894531 12.445313 38.6875 12.25 L 25.6875 0.25 C 25.460938 0.0390625 25.148438 -0.0507813 24.84375 0 Z M 26 3.3125 L 36.5 13 L 27.25 22.25 C 26.480469 21.363281 26 20.210938 26 18.9375 L 26 12 C 26 11.96875 26 11.9375 26 11.90625 Z M 13 13.5 L 22.25 22.75 C 21.363281 23.519531 20.210938 24 18.9375 24 L 3.3125 24 Z M 25 22.5625 C 25.597656 23.558594 26.441406 24.402344 27.4375 25 C 26.441406 25.597656 25.597656 26.441406 25 27.4375 C 24.402344 26.441406 23.558594 25.597656 22.5625 25 C 23.558594 24.402344 24.402344 23.558594 25 22.5625 Z M 31.0625 26 L 46.6875 26 L 37 36.5 L 27.75 27.25 C 28.636719 26.480469 29.789063 26 31.0625 26 Z M 22.75 27.75 C 23.519531 28.636719 24 29.789063 24 31.0625 L 24 38 C 24 38.03125 24 38.0625 24 38.09375 L 24 46.6875 L 13.5 37 Z"
+                                fill="white" />
+                        </svg>
+                        <label class="engine-name" id="gImagesEngine">Images</label>
+                        <input class="radio-button" name="search-engine" type="radio" value="engine6">
+                    </div>
+
+                    <div class="search-engine bgLightTint" data-category="search-on">
+                        <svg height="100%" width="100%" viewBox="0 -0.5 32 32" xmlns="http://www.w3.org/2000/svg">
+                            <rect class="accentColor" fill="#FF000F" height="100%" rx="50%" width="100%" />
+                            <path class="darkIconForDarkTheme" style="transform: scale(0.95); transform-origin: center;"
+                                d="M30 9.215a.31.31 0 0 1-.313.308h-1.68l-7.616 16.215a.31.31 0 0 1-.278.18h-.004a.31.31 0 0 1-.28-.172l-3.614-7.168l-3.902 7.18a.313.313 0 0 1-.555-.016L4.055 9.523H2.313A.31.31 0 0 1 2 9.215V8.39a.31.31 0 0 1 .313-.309h6.21a.31.31 0 0 1 .313.309v.824a.31.31 0 0 1-.313.308H7.188l5.316 12.262l2.766-5.168l-3.508-7.09h-.844a.313.313 0 0 1-.313-.312v-.82c0-.172.141-.313.313-.313h4.598a.31.31 0 0 1 .308.313v.82a.307.307 0 0 1-.308.308h-.813l2.02 4.415l2.402-4.415h-1.473a.31.31 0 0 1-.312-.308v-.82a.31.31 0 0 1 .312-.313h4.465a.31.31 0 0 1 .309.313v.82a.307.307 0 0 1-.309.308h-.98l-3.504 6.372l2.855 5.875L26 9.523h-1.746a.31.31 0 0 1-.313-.308v-.82c0-.172.141-.313.313-.313h5.433a.31.31 0 0 1 .313.313z"
+                                fill="white" />
+                        </svg>
+                        <label class="engine-name" id="wikipediaEngine">Wikipedia</label>
+                        <input class="radio-button" name="search-engine" type="radio" value="engine7">
+                    </div>
                 </div>
             </div>
             <!-- ----------end of search with------------- -->
@@ -1221,6 +1267,14 @@ <h1>Material You NewTab</h1>
                             </label>
                         </div>
 
+                        <div class="ttcont">
+                            <div class="texts">
+                                <div class="bigText" id="switchSearchModes">Switch Search Modes</div>
+                                <div class="infoText" id="switchSearchModesInfo">Click on ‘Search With’ to change the
+                                    mode</div>
+                            </div>
+                        </div>
+
                         <div class="ttcont">
                             <div class="texts">
                                 <div class="bigText" id="hideSearchWith">Hide Search Engines</div>

diff --git a/locales/en.js b/locales/en.js
@@ -48,6 +48,8 @@ const en = {
     // Search
     "micIconTitle": "Hide Microphone Icon",
     "micIconInfo": "If voice typing is not working",
+    "switchSearchModes": "Switch Search Modes",
+    "switchSearchModesInfo": "Click on ‘Search With’ to change the mode",
     "hideSearchWith": "Hide Search Engines",
     "hideSearchWithInfo": "Switch between search engines by clicking its icon",
     "search_suggestions_button": "Search Suggestions",
@@ -97,6 +99,7 @@ const en = {
     "searchPlaceholder": "Type here...",
     "listenPlaceholder": "Listening...",
     "searchWithHint": "Search With",
+    "searchOnHint": "Search On",
     "userText": "Click here to edit",
 
     // Greeting
@@ -112,6 +115,8 @@ const en = {
     "bingEngine": "Bing",
     "braveEngine": "Brave",
     "youtubeEngine": "YouTube",
+    "gImagesEngine": "Images",
+    "wikipediaEngine": "Wikipedia",
 
     // AI Tools
     "ai_tools": "AI Tools",

diff --git a/locales/hi.js b/locales/hi.js
@@ -117,6 +117,8 @@ const hi = {
     "bingEngine": "बिंग",
     "braveEngine": "ब्रेव",
     "youtubeEngine": "यूट्यूब",
+    "gImagesEngine": "इमेज़्स",
+    "wikipediaEngine": "विकिपीडिया",
 
     // AI Tools
     "ai_tools": "AI उपकरण",

diff --git a/manifest(firefox).json b/manifest(firefox).json
@@ -7,7 +7,8 @@
 		"bookmarks",
 		"https://www.google.com/complete/search*",
 		"https://duckduckgo.com/ac/*",
-		"https://search.brave.com/api/suggest*"
+		"https://search.brave.com/api/suggest*",
+		"https://*.wikipedia.org/w/api.php?action=opensearch&search=*"
 	],
 	"background": {
 		"scripts": ["scripts/background.js"],

diff --git a/manifest.json b/manifest.json
@@ -7,7 +7,8 @@
 	"host_permissions": [
 		"https://www.google.com/complete/search*",
 		"https://duckduckgo.com/ac/*",
-		"https://search.brave.com/api/suggest*"
+		"https://search.brave.com/api/suggest*",
+		"https://*.wikipedia.org/w/api.php?action=opensearch&search=*"
 	],
 	"icons": {
 		"16": "favicon/icon16.png",

diff --git a/scripts/languages.js b/scripts/languages.js
@@ -111,6 +111,8 @@ function applyLanguage(lang) {
         'hideWeatherBoxInfo',
         'micIconTitle',
         'micIconInfo',
+        'switchSearchModes',
+        'switchSearchModesInfo',
         'hideSearchWith',
         'hideSearchWithInfo',
         'search_suggestions_button',
@@ -137,7 +139,6 @@ function applyLanguage(lang) {
         'saveAPI',
         'conditionText',
         'enterBtn',
-        'searchWithHint',
         'ai_tools',
         'humidityLevel',
         'feelsLike',
@@ -147,6 +148,8 @@ function applyLanguage(lang) {
         'bingEngine',
         'braveEngine',
         'youtubeEngine',
+        'gImagesEngine',
+        'wikipediaEngine',
         'chatGPT',
         'gemini',
         'copilot',
@@ -191,6 +194,8 @@ function applyLanguage(lang) {
         { id: 'bingEngineDD', key: 'bingEngine' },
         { id: 'braveEngineDD', key: 'braveEngine' },
         { id: 'youtubeEngineDD', key: 'youtubeEngine' },
+        { id: 'gImagesEngineDD', key: 'gImagesEngine' },
+        { id: 'wikipediaEngineDD', key: 'wikipediaEngine' },
         { id: 'bookmarksHover', key: 'bookmarksHeading' },
         { id: 'saveproxy', key: 'saveAPI' },
         { id: 'saveLoc', key: 'saveAPI' },