Add jump step

components/Kryptos/Step/Base.vue

@@ -3,6 +3,7 @@ import KryptosStepVigenere from './Vigenere.vue';
 import KryptosStepRotate from './Rotate.vue';
 import KryptosStepReverse from './Reverse.vue';
 import KryptosStepPad from './Pad.vue';
+import KryptosStepJump from './Jump.vue';
 
 const emit = defineEmits(['change', 'remove']);
 
@@ -23,7 +24,8 @@ const modes = [
   KryptosStepVigenere,
   KryptosStepRotate,
   KryptosStepReverse,
-  KryptosStepPad
+  KryptosStepPad,
+  KryptosStepJump
 ];
 </script>
 

components/Kryptos/Step/Jump.vue

@@ -0,0 +1,24 @@
+<script setup lang="ts">
+const emit = defineEmits(['change']);
+const props = defineProps({input: String});
+
+const jump = ref(0);
+const shift = ref(0);
+
+const { result } = useJump(toRef(() => props.input), jump, shift);
+
+const propagate = () => emit('change', result.value);
+onMounted(propagate);
+watch(result, propagate);
+</script>
+
+<template>
+<label>
+Shift
+<input v-model="shift" type="number" />
+</label>
+<label>
+Jump
+<input v-model="jump" type="number" />
+</label>
+</template>

components/Kryptos/Step/Mode.vue

@@ -8,6 +8,7 @@ const model = defineModel();
   <option value="1">Rotate</option>
   <option value="2">Reverse</option>
   <option value="3">Pad</option>
+  <option value="4">Jump</option>
 </select>
 </template>
 

composables/index.ts

@@ -2,3 +2,4 @@ export { useVigenere } from './kryptos/use-vigenere.ts';
 export { useRotate } from './kryptos/use-rotate.ts';
 export { useReverse } from './kryptos/use-reverse.ts';
 export { usePad } from './kryptos/use-pad.ts';
+export { useJump } from './kryptos/use-jump.ts';

composables/kryptos/use-jump.ts

@@ -0,0 +1,24 @@
+export const useJump = (cipher, jump, shift) => {
+  const result = ref('');
+
+  const decode = (cipher, jump, shift) => {
+    const text = cipher.split('');
+    const result = [];
+    let x = shift - 1;
+
+    for (let i = 0; i < text.length; i++) {
+      x = (x + jump) % text.length;
+      result.push(text[x]);
+    }
+
+    return result.join('');
+  };
+
+  const update = () => {
+    result.value = decode(toValue(cipher), toValue(jump), toValue(shift));
+  };
+
+  watchEffect(update);
+
+  return { result };
+};