Set different defaults for windows

Author: Ives van Hoorne

packages/app/src/app/store/preferences/keybindings.js

@@ -7,6 +7,9 @@ import {
   workspaceHiddenSelector,
 } from '../view/selectors';
 
+const isMac = !!navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i);
+const metaKey = isMac ? 'Meta' : 'Ctrl';
+
 export const KEYBINDINGS = {
   'editor.workspace': {
     title: 'Toggle Sidebar',
@@ -19,31 +22,31 @@ export const KEYBINDINGS = {
 
   'editor.editor-mode': {
     title: 'Editor View',
-    bindings: [['Meta', 'K', 'E']],
+    bindings: [[metaKey, 'K', 'E']],
     action: ({ id }) => (dispatch: Function) => {
       dispatch(sandboxActions.setViewMode(id, true, false));
     },
   },
 
   'editor.preview-mode': {
     title: 'Preview View',
-    bindings: [['Meta', 'K', 'P']],
+    bindings: [[metaKey, 'K', 'P']],
     action: ({ id }) => (dispatch: Function) => {
       dispatch(sandboxActions.setViewMode(id, false, true));
     },
   },
 
   'editor.split-mode': {
     title: 'Split View',
-    bindings: [['Meta', 'K', 'S']],
+    bindings: [[metaKey, 'K', 'S']],
     action: ({ id }) => (dispatch: Function) => {
       dispatch(sandboxActions.setViewMode(id, true, true));
     },
   },
 
   'editor.zen-mode': {
     title: 'Zen Mode',
-    bindings: [['Meta', 'K', 'Z']],
+    bindings: [[metaKey, 'K', 'Z']],
     action: () => (dispatch: Function, getState: Function) => {
       const currentZenMode = preferencesSelector(getState()).zenMode;
       dispatch(
@@ -56,7 +59,7 @@ export const KEYBINDINGS = {
 
   'editor.toggle-console': {
     title: 'Toggle Console',
-    bindings: [['Meta', 'K', 'D']],
+    bindings: [[metaKey, 'K', 'D']],
     action: () => (dispatch: Function, getState: Function) => {
       const devToolsOpen = devToolsOpenSelector(getState());
       dispatch(viewActions.setDevToolsOpen(!devToolsOpen));