Add Google Camera to icon pack and enhance welcome page layout with n…

…ew accessibility options
groovelauncher · Feb 11, 2025 · bcff843 · bcff843
1 parent 547cca4
commit bcff843
Show file tree

Hide file tree

Showing 4 changed files with 91 additions and 3 deletions.
diff --git a/src/scripts/iconPack.js b/src/scripts/iconPack.js
@@ -62,6 +62,7 @@ const iconPackConverter = [
             "com.freeme.camera",
             "com.fujitsu.mobile_phone.camera",
             "com.google.android.camera",
+            "com.google.android.GoogleCamera",
             "com.google.android.gallery3d",
             "com.hmdglobal.app.camera",
             "com.hmdglobal.camera2",
@@ -707,7 +708,7 @@ const iconPackConverter = [
             "com.lge.qmemo",
             "com.sonymobile.notes",
             "com.asus.quickmemo",
-            "com.lenovo.ideanotepad"
+            "com.lenovo.ideanotepad",
             "com.gh.metro.notes"
         ],
         "icon": "notes"

diff --git a/src/styles/pages/welcome.scss b/src/styles/pages/welcome.scss
@@ -715,4 +715,54 @@ ul {
             display: block;
         }
     }
-}
+}
+.tile-selector {
+    display: flex;
+    margin-bottom: 30px;
+
+    p {
+        flex-grow: 1;
+        font-size: 30px !important;
+        margin: 0px !important;
+        font-weight: 300 !important;
+    }
+
+    div {}
+}
+p.groups-title {
+    color: var(--metro-foreground);
+    font-size: 35px !important;
+    font-weight: 300 !important;
+    margin: 6px 0px !important;
+}
+
+.group {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    padding: 0px 0px;
+    transform-style: preserve-3d;
+
+    p.group-title {
+        color: rgb(153, 153, 153) !important;
+        font-size: 20px !important;
+        margin: 6px 0px !important;
+    }
+
+    p.group-description {
+        color: rgb(153, 153, 153) !important;
+        font-size: 20px !important;
+        margin: 6px 0px !important;
+        margin-top: 0px !important;
+    }
+
+    &:not(div:nth-child(2)):not(.first-group) {
+        margin-top: 22px !important;
+    }
+
+    &.first-group {
+        margin-top: 0px !important;
+    }
+}
+
+
diff --git a/src/welcome.js b/src/welcome.js
@@ -90,6 +90,10 @@ const accessibility_scroller = new GrooveScroll("#page-access div.scroller", {
 const accent_color_scroller = new GrooveScroll("div.accent-color-catalogue", {
     scrollbar: true
 
+})
+const permissions_scroller = new GrooveScroll("#page-permissions div.scroller", {
+    scrollbar: true
+
 })
 const whats_new_scroller = new GrooveScroll("#page-readme div.scroller", {
     scrollbar: true
@@ -348,6 +352,7 @@ var welcomei = 0
 welcomeTitle.innerText = i18n.t(welcomeType)
 function startFlipping() {
     if (!!localStorage.getItem("UIScale")) GrooveBoard.backendMethods.setUIScale(Number(localStorage.getItem("UIScale")), true); else GrooveBoard.backendMethods.setUIScale(.8, true)
+
     setTimeout(() => {
         setTimeout(() => {
             if (isChristmas()) snowStorm.start()

diff --git a/www/welcome.html b/www/welcome.html
@@ -100,6 +100,26 @@ <h1 data-i18n="welcome.access.title" class="small">Ease of Access</h1>
                         that everything feels just right.</p>
                     <div class="scroller" style="margin: 0px;">
                         <div>
+                            <div class="group first-group">
+                                <p class="group-title" data-i18n="settings.ease_of_access.reduce_motion.title">Reduce
+                                    motion</p>
+                                <div class="tile-selector reduce-motion-toggle-switch" style="margin-bottom: 0px;">
+                                    <p data-i18n-init="common.actions.off">Off</p>
+                                    <div>
+                                        <div class="metro-toggle-switch"></div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="group" style="margin-top: 22px !important;">
+                                <p class="group-title" data-i18n="settings.ease_of_access.high_contrast.title">High
+                                    contrast</p>
+                                <div class="tile-selector high-contrast-toggle-switch" style="margin-bottom: 0px;">
+                                    <p data-i18n-init="common.actions.off">Off</p>
+                                    <div>
+                                        <div id="high-contrast-toggle-switch" class="metro-toggle-switch"></div>
+                                    </div>
+                                </div>
+                            </div>
                             <div class="group">
                                 <p class="group-title" data-i18n="welcome.access.background">Background</p>
                                 <div class="metro-dropdown-menu" id="theme-chooser" selected="1">
@@ -122,6 +142,16 @@ <h1 data-i18n="welcome.access.title" class="small">Ease of Access</h1>
                                         data-i18n-params="{value: 125}">125%</div>
                                 </div>
                             </div>
+                            <div class="group">
+                                <p class="group-title" data-i18n="settings.ease_of_access.haptic_feedback.title">Haptic
+                                    feedback</p>
+                                <div class="tile-selector haptic-toggle-switch" style="margin-bottom: 0px;">
+                                    <p data-i18n-init="common.actions.off">Off</p>
+                                    <div>
+                                        <div id="haptic-toggle-switch" class="metro-toggle-switch"></div>
+                                    </div>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -239,7 +269,9 @@ <h1 data-i18n="welcome.permissions.title" class="small">Permissions</h1>
                                 <p class="permission-title"><span class="permission-icon"></span> <span
                                         data-i18n="welcome.permissions.groups.accessibility.title">Accessibility</span>
                                 </p>
-                                <p class="permission-description" data-i18n="welcome.permissions.groups.accessibility.description">Enable accessibility to lock device.</p>
+                                <p class="permission-description"
+                                    data-i18n="welcome.permissions.groups.accessibility.description">Enable
+                                    accessibility to lock device.</p>
                                 <button class="metro-button link" data-i18n="common.actions.allow">allow</button>
                             </div>
                         </div>