From 6b1b995c9c1581a91b48b31e7453a8c27f474f78 Mon Sep 17 00:00:00 2001
From: Xymorot <xymorot@mailbox.org>
Date: Thu, 1 Aug 2019 22:32:44 +0200
Subject: [PATCH] remove: delete Divide pattern until there is a clearer idea
 of the UI

---
 src/renderer/App.svelte                       |  17 +--
 .../components/2-molecules/Divide.svelte      | 130 ------------------
 2 files changed, 1 insertion(+), 146 deletions(-)
 delete mode 100644 src/renderer/components/2-molecules/Divide.svelte

diff --git a/src/renderer/App.svelte b/src/renderer/App.svelte
index 0edbfd7..e080a96 100644
--- a/src/renderer/App.svelte
+++ b/src/renderer/App.svelte
@@ -1,5 +1,4 @@
 <script>
-  import Divide from 'molecules/Divide.svelte';
   import NhentaiLogin from 'polymers/NhentaiLogin.svelte';
 </script>
 
@@ -45,19 +44,5 @@
 </style>
 
 <main>
-  <Divide>
-    <div slot="1">
-      <NhentaiLogin></NhentaiLogin>
-    </div>
-    <div slot="2">
-      <Divide mode="v">
-        <div slot="1">
-          <Divide></Divide>
-        </div>
-        <div slot="2">
-          <Divide></Divide>
-        </div>
-      </Divide>
-    </div>
-  </Divide>
+  <NhentaiLogin></NhentaiLogin>
 </main>
diff --git a/src/renderer/components/2-molecules/Divide.svelte b/src/renderer/components/2-molecules/Divide.svelte
deleted file mode 100644
index 30fd83d..0000000
--- a/src/renderer/components/2-molecules/Divide.svelte
+++ /dev/null
@@ -1,130 +0,0 @@
-<script>
-  import { onMount } from 'svelte/internal';
-  import { c, s } from 'services/utils';
-
-  export let mode = 'h';
-  export let basisFirst = 0.5;
-  export let basisSecond = 0.5;
-  export let minSize = 100;
-
-  let divide;
-  let dragging = false;
-  let size = 5;
-  let total = 0;
-
-  $: classes = c({
-    divide: true,
-    'divide--vertical': mode === 'v',
-  });
-
-  $: classesDivider = c({
-    divide__divider: true,
-    'divide__divider--vertical': mode === 'v',
-  });
-
-  $: style = s({
-    '--divide-size': `${size}px`,
-    '--divide-basis-first': `${basisFirst * 100}%`,
-    '--divide-basis-second': `${basisSecond * 100}%`,
-    '--divide-min-width': minSize > 0 && mode === 'h' ? `${minSize}px` : '0',
-    '--divide-min-height': minSize > 0 && mode === 'v' ? `${minSize}px` : '0',
-  });
-
-  function getTotal() {
-    return mode === 'h' ? divide.clientWidth : divide.clientHeight;
-  }
-
-  function handleMousedown(event) {
-    if (event.button === 0) {
-      dragging = true;
-      total = getTotal();
-    }
-  }
-
-  function handleMousemove(event) {
-    if (dragging) {
-      const dragPos =
-        mode === 'h' ? event.x - divide.getBoundingClientRect().x : event.y - divide.getBoundingClientRect().y;
-      basisFirst = dragPos / total;
-      basisSecond = 1 - basisFirst;
-    }
-  }
-
-  function handleMouseup() {
-    dragging = false;
-  }
-
-  function handleMouseenter(event) {
-    if (event.buttons !== 1) {
-      dragging = false;
-    }
-  }
-</script>
-
-<style>
-  .divide {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    height: 100%;
-  }
-
-  .divide__divider {
-    cursor: ew-resize;
-    width: var(--divide-size);
-    height: 100%;
-    background-color: var(--color-foreground);
-  }
-
-  .divide__divider:hover {
-    background-color: var(--color-foreground-light);
-  }
-
-  .divide__elem {
-    flex: 0 0 50%;
-    min-width: var(--divide-min-width);
-    max-width: calc(100% - var(--divide-size) - var(--divide-min-width));
-    min-height: var(--divide-min-height);
-    max-height: calc(100% - var(--divide-size) - var(--divide-min-height));
-  }
-
-  .divide__elem > :global(*) {
-    width: 100%;
-    height: 100%;
-  }
-
-  .divide__elem--first {
-    flex-basis: calc(var(--divide-basis-first) - var(--divide-size) / 2);
-  }
-
-  .divide__elem--second {
-    flex-basis: calc(var(--divide-basis-second) - var(--divide-size) / 2);
-  }
-
-  .divide--vertical {
-    flex-direction: column;
-  }
-
-  .divide__divider--vertical {
-    cursor: ns-resize;
-    width: 100%;
-    height: var(--divide-size);
-  }
-</style>
-
-<div
-  class="{classes}"
-  {style}
-  bind:this="{divide}"
-  on:mousemove|preventDefault="{handleMousemove}"
-  on:mouseup|preventDefault="{handleMouseup}"
-  on:mouseenter|preventDefault="{handleMouseenter}"
->
-  <div class="divide__elem divide__elem--first">
-    <slot name="1"></slot>
-  </div>
-  <div class="{classesDivider}" draggable="true" on:mousedown|preventDefault="{handleMousedown}"></div>
-  <div class="divide__elem divide__elem--second">
-    <slot name="2"></slot>
-  </div>
-</div>