WIP

traPtitech · Sep 22, 2020 · 3ae8aa2 · 3ae8aa2
1 parent c6442c1
commit 3ae8aa2
Show file tree

Hide file tree

Showing 8 changed files with 47 additions and 39 deletions.
diff --git a/public/index.html b/public/index.html
@@ -16,6 +16,9 @@
       </strong>
     </noscript>
     <div id="app"></div>
+    <div id="sidebar-opener"></div>
+    <div id="stamp-picker"></div>
+    <div id="message-menu-popup"></div>
     <!-- built files will be auto injected -->
   </body>
 </html>
diff --git a/src/components/Main/MainView/ChannelView/ChannelView.vue b/src/components/Main/MainView/ChannelView/ChannelView.vue
@@ -12,7 +12,7 @@
       :channel-id="channelId"
       :entry-message-id="entryMessageId"
     />
-    <teleport v-if="!isSidebarOpen" to="sidebar-opener" :class="$style.opener">
+    <teleport v-if="!isSidebarOpen" to="#sidebar-opener" :class="$style.opener">
       <channel-sidebar-hidden
         @open="openSidebar"
         :viewer-ids="viewerIds"

diff --git a/src/components/Main/MainView/MessageInput/MessageInputTextArea.vue b/src/components/Main/MainView/MessageInput/MessageInputTextArea.vue
@@ -1,21 +1,24 @@
 <template>
-  <textarea-autosize
-    ref="textareaAutosizeRef"
-    :class="$style.container"
-    :value="text"
-    :readonly="isPosting"
-    placeholder="メッセージを送信"
-    rows="1"
-    :max-height="160"
-    @input="onInput"
-    @compositionupdate.native="onCompositionUpdate"
-    @before-input.native="onBeforeInput"
-    @keydown.native="onKeyDown"
-    @keyup.native="onKeyUp"
-    @focus.native="onFocus"
-    @blur.native="onBlur"
-    @paste.native="onPaste"
-  />
+  <div>textarea</div>
+  <!--
+    <textarea-autosize
+      ref="textareaAutosizeRef"
+      :class="$style.container"
+      :value="text"
+      :readonly="isPosting"
+      placeholder="メッセージを送信"
+      rows="1"
+      :max-height="160"
+      @input="onInput"
+      @compositionupdate.native="onCompositionUpdate"
+      @before-input.native="onBeforeInput"
+      @keydown.native="onKeyDown"
+      @keyup.native="onKeyUp"
+      @focus.native="onFocus"
+      @blur.native="onBlur"
+      @paste.native="onPaste"
+    />
+  -->
 </template>
 
 <script lang="ts">

diff --git a/src/components/UI/Slider.vue b/src/components/UI/Slider.vue
@@ -1,26 +1,29 @@
 <template>
-  <vue-slider
-    :value="value"
-    @change="onChange"
-    :min="min"
-    :max="max"
-    :disabled="disabled"
-    :tooltip="tooltip"
-    :tooltip-formatter="tooltipFormatter"
-    :dot-size="12"
-  />
+  <div>slider</div>
+  <!--
+    <vue-slider
+      :value="value"
+      @change="onChange"
+      :min="min"
+      :max="max"
+      :disabled="disabled"
+      :tooltip="tooltip"
+      :tooltip-formatter="tooltipFormatter"
+      :dot-size="12"
+    />
+  -->
 </template>
 
 <script lang="ts">
 import { defineComponent, PropType } from 'vue'
-import VueSlider from 'vue-slider-component'
-import { TooltipFormatter } from 'vue-slider-component/typings/typings'
+// import VueSlider from 'vue-slider-component'
+// import { TooltipFormatter } from 'vue-slider-component/typings/typings'
 
 export default defineComponent({
   name: 'Slider',
-  components: {
-    VueSlider
-  },
+  // components: {
+  //   VueSlider
+  // },
   props: {
     value: {
       type: [Number, String] as PropType<number | string>,
@@ -38,7 +41,7 @@ export default defineComponent({
       type: Number,
       default: 100
     },
-    tooltipFormatter: [String, Function] as PropType<TooltipFormatter>,
+    tooltipFormatter: [String, Function], // as PropType<TooltipFormatter>,
     tooltip: {
       type: String as PropType<
         'none' | 'always' | 'hover' | 'focus' | 'active'

diff --git a/src/main.ts b/src/main.ts
@@ -4,7 +4,7 @@ import router from './router'
 import store from './store'
 import boolAttr from './bool-attr'
 import vClickOutside from 'v-click-outside'
-import VueTextareaAutosize from 'vue-textarea-autosize'
+// import VueTextareaAutosize from 'vue-textarea-autosize'
 import { setupGlobalFuncs } from './markdown-bridge'
 import { loadResizeObserver } from './resizeObserver'
 
@@ -21,7 +21,7 @@ import('katex/dist/katex.css')
 
   app.use(boolAttr)
   app.use(vClickOutside)
-  app.use(VueTextareaAutosize)
+  //app.use(VueTextareaAutosize)
 
   app.mount('#app')
 

diff --git a/src/store/ui/stampPicker/mutations.ts b/src/store/ui/stampPicker/mutations.ts
@@ -21,7 +21,7 @@ export const mutations = defineMutations<S>()({
     state.selectHandler = (_: SelectedStampData) => {}
   },
   clearTeleportTargetName(state) {
-    state.teleportTargetName = ''
+    state.teleportTargetName = 'stamp-picker'
   },
   clearCurrentStampPaletteId(state) {
     state.currentStampSet = {

diff --git a/src/store/ui/stampPicker/state.ts b/src/store/ui/stampPicker/state.ts
@@ -30,7 +30,7 @@ export interface S {
 }
 
 export const state: S = {
-  teleportTargetName: '', // TODO validにする
+  teleportTargetName: 'stamp-picker',
   selectHandler: defaultSelectHandler,
   currentStampSet: {
     type: 'history',

diff --git a/src/views/Main.vue b/src/views/Main.vue
@@ -37,7 +37,6 @@
     <stamp-picker-container />
     <message-tools-menu-container />
     <toast-container />
-    <div :id="teleportTargetName" />
   </div>
   <div v-else></div>
 </template>