added modtap mouse keys and power modules

keycount is now calculated in pog.py
more key labels

Author: JanLunge

package.json

@@ -30,12 +30,16 @@
     "@mdi/font": "^7.1.96",
     "@viselect/vue": "^3.2.5",
     "@vueuse/core": "^9.12.0",
+    "@wagmi/core": "^0.9.7",
+    "@web3modal/ethereum": "^2.1.2",
+    "@web3modal/html": "^2.1.2",
     "@wlard/vue-class-store": "^3.0.0",
     "@wlard/vue3-popper": "^1.3.1",
     "daisyui": "^2.50.0",
     "dayjs": "^1.11.7",
     "decompress": "^4.2.1",
     "electron-updater": "^5.3.0",
+    "ethers": "^5",
     "mini-svg-data-uri": "^1.4.4",
     "request": "^2.88.2",
     "sass": "^1.58.0",

src/main/pythontemplates/coordmaphelper.ts

@@ -2,10 +2,11 @@ export const coordmaphelperpy = `# coordmaphelper.py helper script to get your c
 from kmk.handlers.sequences import simple_key_sequence
 from kmk.keys import KC
 from kb import KMKKeyboard as _KMKKeyboard
+import pog
 class KMKKeyboard(_KMKKeyboard):
     # *2 for split keyboards, which will typically manage twice the number of keys
     # of one side. Having this N too large will have no impact (maybe slower boot..)
-    N = len(_KMKKeyboard.col_pins) * len(_KMKKeyboard.row_pins) *2
+    N = pog.keyCount * 2
     coord_mapping = list(range(N))
 
     layer = []

src/main/pythontemplates/pog.ts

@@ -40,6 +40,11 @@ for i, item in enumerate(config["directPins"]):
     pinsArray.append(renderPin(item))
 pins = ",".join(pinsArray)
 
+if config['wiringMethod'] == 'matrix':
+    keyCount = len(rowPinsArray) * len(colPinsArray)
+else:
+    keyCount = len(pinsArray)
+
 # encoders
 hasEncoders = len(config['encoders']) != 0
 

src/renderer/src/components/Community.vue

@@ -0,0 +1,70 @@
+<template>
+  <div>
+    <w3m-core-button label="Login"></w3m-core-button>
+    <div v-if="accountAddress">
+      {{ renderedAccountAddress }}
+      <div class="btn" @click="sign">sign</div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { EthereumClient, modalConnectors, walletConnectProvider } from '@web3modal/ethereum'
+import { Web3Modal } from '@web3modal/html'
+import { configureChains, createClient, signMessage } from '@wagmi/core'
+import { arbitrum, mainnet, polygon } from '@wagmi/core/chains'
+import { watchAccount } from '@wagmi/core'
+import { computed, ref } from 'vue'
+const chains = [arbitrum, mainnet, polygon]
+
+// Wagmi Core Client
+const { provider } = configureChains(chains, [
+  walletConnectProvider({ projectId: '7f2678536a5b6b5643d94a6428e341a1' })
+])
+const wagmiClient = createClient({
+  autoConnect: true,
+  connectors: modalConnectors({
+    projectId: '7f2678536a5b6b5643d94a6428e341a1',
+    version: '1', // or "2"
+    appName: 'web3Modal',
+    chains
+  }),
+  provider
+})
+
+// Web3Modal and Ethereum Client
+const ethereumClient = new EthereumClient(wagmiClient, chains)
+const web3modal = new Web3Modal(
+  {
+    projectId: '7f2678536a5b6b5643d94a6428e341a1',
+    themeColor: 'orange',
+    themeBackground: 'themeColor',
+    enableAccountView: false
+  },
+  ethereumClient
+)
+// const unsubscribe = web3modal.subscribeModal((newState) =>
+// console.log(newState)
+// );
+const accountAddress = ref('')
+const unwatch = watchAccount((account) => {
+  if (account.address) {
+    console.log('account changed', account.address)
+    accountAddress.value = account.address
+  } else {
+    accountAddress.value = ''
+    console.log('account disconnected')
+  }
+})
+const sign = async () => {
+  const signature = await signMessage({
+    message: 'pog wants authorisation'
+  })
+  console.log(signature)
+}
+const renderedAccountAddress = computed(() => {
+  return accountAddress.value.slice(0, 4) + '...' + accountAddress.value.slice(-4)
+})
+</script>
+
+<style lang="scss" scoped></style>

src/renderer/src/helpers/index.ts

@@ -236,32 +236,64 @@ export const renderLabel = (keycode: string) => {
     DOT: { label: '.' },
     COMM: { label: ',' },
     SLSH: { label: '/' },
+    KP_SLASH: { label: '/' },
     SCLN: { label: ';' },
     QUOT: { label: "'" },
     LSFT: { icon: 'mdi-apple-keyboard-shift' },
     RSFT: { icon: 'mdi-apple-keyboard-shift' },
     LBRC: { label: '[' },
     RBRC: { label: ']' },
+    LABK: { label: '<' },
+    RABK: { label: '>' },
+    LCBR: { label: '{' },
+    RCBR: { label: '}' },
+    LEFT_PAREN: { label: '(' },
+    RIGHT_PAREN: { label: ')' },
+    DQT: { label: '"' },
+    COLN: { label: ':' },
+    EXLM: { label: '!' },
+    PERCENT: { label: '%' },
+    AMPERSAND: { label: '&' },
+    TILDE: { label: '~' },
+    PIPE: { label: '|' },
+    DOLLAR: { label: '$' },
+    HASH: { label: '#' },
+    QUES: { label: '?' },
     BSLS: { label: '\\' },
     MINS: { label: '-' },
     EQL: { label: '=' },
     CAPS: { icon: 'mdi-apple-keyboard-caps' },
     TAB: { icon: 'mdi-keyboard-tab' },
     BSPC: { icon: 'mdi-backspace' },
+    DEL: { icon: 'mdi-backspace-reverse' },
     LCTL: { icon: 'mdi-apple-keyboard-control' },
     RCTL: { icon: 'mdi-apple-keyboard-control' },
     LALT: { icon: 'mdi-apple-keyboard-option' },
     RALT: { icon: 'mdi-apple-keyboard-option' },
     LGUI: { icon: 'mdi-apple-keyboard-command' },
     RGUI: { icon: 'mdi-apple-keyboard-command' },
-    UP: { icon: 'mdi-arrow-up' },
-    LEFT: { icon: 'mdi-arrow-left' },
-    DOWN: { icon: 'mdi-arrow-down' },
-    RIGHT: { icon: 'mdi-arrow-right' },
+    HOME: { icon: 'mdi-arrow-top-left' },
+    END: { icon: 'mdi-arrow-bottom-right' },
+    PGDOWN: { icon: 'mdi-arrow-down' },
+    PGUP: { icon: 'mdi-arrow-up' },
+    UP: { icon: 'mdi-arrow-up-thin' },
+    LEFT: { icon: 'mdi-arrow-left-thin' },
+    DOWN: { icon: 'mdi-arrow-down-thin' },
+    RIGHT: { icon: 'mdi-arrow-right-thin' },
     GRV: { label: '`' },
+    PLUS: { label: '+' },
+    AT: { label: '@' },
+    UNDERSCORE: { label: '_' },
+    CIRCUMFLEX: { label: '^' },
+    ASTERISK: { label: '*' },
+
 
     // Layer
     MO: { label: 'MO' },
+    MT: { label: 'MT' },
+    LT: {
+      label: 'LT'
+    },
 
     // Media
     MPLY: { label: 'Play/Pause', icon: 'mdi-play-pause' },
@@ -299,21 +331,28 @@ export const renderLabel = (keycode: string) => {
     const keyMatch = keycode.match(/KC\.(\w+)/)
     if (keyMatch) {
       const key = keyMatch[1]
-      if (!keyLabels[key]) {
+      const foundKey = keyLabels[key]
+      if (!foundKey) {
         label += keycode
-      } else if (keyLabels[key].icon) {
-        label += `<i class="mdi ${keyLabels[key].icon}"></i>`
-      } else if (keyLabels[key].label) {
-        label += keyLabels[key].label
+      } else if (foundKey.icon) {
+        label += `<i class="mdi ${foundKey.icon}"></i>`
+      } else if (foundKey.label) {
+        label += foundKey.label
       }
       // if it has arguments render them as keycode as well
       if (keycode.includes('(')) {
         const match = keycode.match(/^[^(]+\((.*)\)$/)
         console.log('found params', match) // prints ["0", "KC.A"]
+        // dont render options for some keys eg. MT
+
         if (match && match[1] && match[1].includes(',')) {
           const params = match[1].split(',').map((a) => renderLabel(a))
           console.log('param list', params)
-          label += ` ${params.join(' ')}`
+          let maxParams = 10
+          if(['LT', 'MT'].includes(key)){
+            maxParams =2
+          }
+          label += ` ${params.slice(0,maxParams).join(' ')}`
         } else if (match) {
           // just add that key to label
           label += ` ${renderLabel(match[1])}`

src/renderer/src/router/index.ts

@@ -11,7 +11,8 @@ import MatrixSetup from '../components/MatrixSetup.vue'
 import PinSetup from '../components/PinSetup.vue'
 import RawKeymapEditor from '../components/RawKeymapEditor.vue'
 import KeyboardName from '../components/KeyboardName.vue'
-import CoordMap from "../components/CoordMap.vue";
+import CoordMap from '../components/CoordMap.vue'
+import Community from "../components/Community.vue";
 
 const router = createRouter({
   history: createWebHashHistory(),
@@ -84,6 +85,11 @@ const router = createRouter({
           path: 'coordmap',
           component: CoordMap,
           name: 'CoordMap'
+        },
+        {
+          path: 'community',
+          component: Community,
+          name: 'Community'
         }
       ]
     }

src/renderer/src/screens/KeyboardConfigurator.vue

@@ -22,6 +22,7 @@
       <li><router-link to="/configurator/coordmap">CoordMap</router-link></li>
       <li><router-link to="/configurator/raw-keymap">Raw Keymap</router-link></li>
       <li><router-link to="/configurator/firmware">Firmware</router-link></li>
+<!--      <li><router-link to="/configurator/community">Community</router-link></li>-->
     </ul>
     <div class="h-screen flex-1 overflow-x-auto px-4 pt-8">
       <h1 class="mb-8 text-center text-5xl font-bold" contenteditable="true">
@@ -57,10 +58,17 @@
 <script lang="ts" setup>
 import Popper from '@wlard/vue3-popper'
 import { addToHistory, keyboardStore } from '../store'
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute, useRouter} from 'vue-router'
 import { computed } from 'vue'
 const router = useRouter()
 const route = useRoute()
+
+// nav guard
+console.log('path is',keyboardStore.path)
+if(!keyboardStore.path){
+  router.push('/')
+}
+
 const reselectKeyboard = () => {
   router.push('/')
 }
@@ -86,6 +94,7 @@ const flashingMode = computed({
     keyboardStore.flashingMode = newVal ? 'automatic' : 'manual'
   }
 })
+
 </script>
 
 <style lang="scss" scoped>