refactor
This commit is contained in:
		
							parent
							
								
									333ac62b61
								
							
						
					
					
						commit
						4ef576b7f1
					
				
					 8 changed files with 34 additions and 34 deletions
				
			
		| 
						 | 
				
			
			@ -23,7 +23,7 @@ export function switchToInstance (instanceName) {
 | 
			
		|||
    currentInstance: instanceName,
 | 
			
		||||
    searchResults: null,
 | 
			
		||||
    queryInSearch: '',
 | 
			
		||||
    rawInputTextInCompose: ''
 | 
			
		||||
    rawComposeText: ''
 | 
			
		||||
  })
 | 
			
		||||
  store.save()
 | 
			
		||||
  switchToTheme(instanceThemes[instanceName])
 | 
			
		||||
| 
						 | 
				
			
			@ -47,7 +47,7 @@ export async function logOutOfInstance (instanceName) {
 | 
			
		|||
    currentInstance: newInstance,
 | 
			
		||||
    searchResults: null,
 | 
			
		||||
    queryInSearch: '',
 | 
			
		||||
    rawInputTextInCompose: ''
 | 
			
		||||
    rawComposeText: ''
 | 
			
		||||
  })
 | 
			
		||||
  store.save()
 | 
			
		||||
  toast.say(`Logged out of ${instanceName}`)
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -16,8 +16,8 @@
 | 
			
		|||
  export default {
 | 
			
		||||
    store: () => store,
 | 
			
		||||
    computed: {
 | 
			
		||||
      disabled: ($rawInputTextInComposeOverLimit, $rawInputTextInComposeLength) => {
 | 
			
		||||
        return $rawInputTextInComposeOverLimit || $rawInputTextInComposeLength === 0
 | 
			
		||||
      disabled: ($rawComposeTextOverLimit, $rawComposeTextLength) => {
 | 
			
		||||
        return $rawComposeTextOverLimit || $rawComposeTextLength === 0
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -2,7 +2,7 @@
 | 
			
		|||
  class="compose-box-input"
 | 
			
		||||
  placeholder="What's on your mind?"
 | 
			
		||||
  ref:textarea
 | 
			
		||||
  bind:value=$rawInputTextInCompose
 | 
			
		||||
  bind:value=$rawComposeText
 | 
			
		||||
></textarea>
 | 
			
		||||
<style>
 | 
			
		||||
  .compose-box-input {
 | 
			
		||||
| 
						 | 
				
			
			@ -31,7 +31,7 @@
 | 
			
		|||
 | 
			
		||||
  export default {
 | 
			
		||||
    oncreate() {
 | 
			
		||||
      this.store.set({rawInputTextInCompose: store.get('currentInputTextInCompose')})
 | 
			
		||||
      this.store.set({rawComposeText: store.get('currentComposeText')})
 | 
			
		||||
 | 
			
		||||
      requestAnimationFrame(() => {
 | 
			
		||||
        mark('autosize()')
 | 
			
		||||
| 
						 | 
				
			
			@ -40,11 +40,11 @@
 | 
			
		|||
      })
 | 
			
		||||
 | 
			
		||||
      const saveText = debounce(() => scheduleIdleTask(() => this.store.save()), 1000)
 | 
			
		||||
      this.observe('rawInputTextInCompose', rawInputTextInCompose => {
 | 
			
		||||
        let inputTextInCompose = this.store.get('inputTextInCompose')
 | 
			
		||||
      this.observe('rawComposeText', rawComposeText => {
 | 
			
		||||
        let composeText = this.store.get('composeText')
 | 
			
		||||
        let currentInstance = this.store.get('currentInstance')
 | 
			
		||||
        inputTextInCompose[currentInstance] = rawInputTextInCompose || ''
 | 
			
		||||
        this.store.set({inputTextInCompose: inputTextInCompose})
 | 
			
		||||
        composeText[currentInstance] = rawComposeText || ''
 | 
			
		||||
        this.store.set({composeText: composeText})
 | 
			
		||||
        saveText()
 | 
			
		||||
      }, {init: false})
 | 
			
		||||
    },
 | 
			
		||||
| 
						 | 
				
			
			@ -55,8 +55,8 @@
 | 
			
		|||
    },
 | 
			
		||||
    store: () => store,
 | 
			
		||||
    computed: {
 | 
			
		||||
      rawInputTextInCompose: ($rawInputTextInCompose) => $rawInputTextInCompose,
 | 
			
		||||
      currentInputTextInCompose: ($currentInputTextInCompose) => $currentInputTextInCompose,
 | 
			
		||||
      rawComposeText: ($rawComposeText) => $rawComposeText,
 | 
			
		||||
      currentComposeText: ($currentComposeText) => $currentComposeText,
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
| 
						 | 
				
			
			@ -1,4 +1,4 @@
 | 
			
		|||
<div class="compose-box-length-gauge {{shouldAnimate ? 'should-animate' : ''}}  {{$rawInputTextInComposeOverLimit ? 'over-char-limit' : ''}}"
 | 
			
		||||
<div class="compose-box-length-gauge {{shouldAnimate ? 'should-animate' : ''}}  {{$rawComposeTextOverLimit ? 'over-char-limit' : ''}}"
 | 
			
		||||
     style="transform: scaleX({{inputLengthAsFractionRoundedAfterRaf || 0}});"
 | 
			
		||||
     aria-hidden="true"
 | 
			
		||||
></div>
 | 
			
		||||
| 
						 | 
				
			
			@ -36,8 +36,8 @@
 | 
			
		|||
    },
 | 
			
		||||
    store: () => store,
 | 
			
		||||
    computed: {
 | 
			
		||||
      inputLengthAsFraction: ($rawInputTextInComposeLength) => {
 | 
			
		||||
        return Math.min(CHAR_LIMIT, $rawInputTextInComposeLength) / CHAR_LIMIT
 | 
			
		||||
      inputLengthAsFraction: ($rawComposeTextLength) => {
 | 
			
		||||
        return Math.min(CHAR_LIMIT, $rawComposeTextLength) / CHAR_LIMIT
 | 
			
		||||
      },
 | 
			
		||||
      inputLengthAsFractionRounded: (inputLengthAsFraction) => {
 | 
			
		||||
        // We don't need to update the gauge for every decimal point, so round it to the nearest 0.02
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,4 +1,4 @@
 | 
			
		|||
<span class="compose-box-length {{$rawInputTextInComposeOverLimit ? 'over-char-limit' : ''}}"
 | 
			
		||||
<span class="compose-box-length {{$rawComposeTextOverLimit ? 'over-char-limit' : ''}}"
 | 
			
		||||
      aria-label="{{inputLengthLabel}}">
 | 
			
		||||
      {{inputLengthToDisplayAfterRaf || '0'}}
 | 
			
		||||
    </span>
 | 
			
		||||
| 
						 | 
				
			
			@ -33,13 +33,13 @@
 | 
			
		|||
    },
 | 
			
		||||
    store: () => store,
 | 
			
		||||
    computed: {
 | 
			
		||||
      inputLengthToDisplay: ($rawInputTextInComposeLength) => {
 | 
			
		||||
        return ($rawInputTextInComposeLength <= CHAR_LIMIT
 | 
			
		||||
          ? $rawInputTextInComposeLength
 | 
			
		||||
          : CHAR_LIMIT - $rawInputTextInComposeLength)
 | 
			
		||||
      inputLengthToDisplay: ($rawComposeTextLength) => {
 | 
			
		||||
        return ($rawComposeTextLength <= CHAR_LIMIT
 | 
			
		||||
          ? $rawComposeTextLength
 | 
			
		||||
          : CHAR_LIMIT - $rawComposeTextLength)
 | 
			
		||||
      },
 | 
			
		||||
      inputLengthLabel: ($rawInputTextInComposeOverLimit, inputLengthToDisplay) => {
 | 
			
		||||
        if ($rawInputTextInComposeOverLimit) {
 | 
			
		||||
      inputLengthLabel: ($rawComposeTextOverLimit, inputLengthToDisplay) => {
 | 
			
		||||
        if ($rawComposeTextOverLimit) {
 | 
			
		||||
          return `${inputLengthToDisplay} characters over limit`
 | 
			
		||||
        } else {
 | 
			
		||||
          return `${inputLengthToDisplay} characters`
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -102,8 +102,8 @@ export function instanceComputations (store) {
 | 
			
		|||
      return statusModifications[currentInstance]
 | 
			
		||||
    })
 | 
			
		||||
 | 
			
		||||
  store.compute('currentInputTextInCompose',
 | 
			
		||||
    ['inputTextInCompose', 'currentInstance'],
 | 
			
		||||
    (inputTextInCompose, currentInstance) => (inputTextInCompose[currentInstance] || '')
 | 
			
		||||
  store.compute('currentComposeText',
 | 
			
		||||
    ['composeText', 'currentInstance'],
 | 
			
		||||
    (composeText, currentInstance) => (composeText[currentInstance] || '')
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,13 +1,13 @@
 | 
			
		|||
import { CHAR_LIMIT } from '../_static/statuses'
 | 
			
		||||
 | 
			
		||||
export function statusComputations (store) {
 | 
			
		||||
  store.compute('rawInputTextInComposeLength',
 | 
			
		||||
    ['rawInputTextInCompose'],
 | 
			
		||||
    (rawInputTextInCompose) => rawInputTextInCompose.length
 | 
			
		||||
  store.compute('rawComposeTextLength',
 | 
			
		||||
    ['rawComposeText'],
 | 
			
		||||
    (rawComposeText) => rawComposeText.length
 | 
			
		||||
  )
 | 
			
		||||
 | 
			
		||||
  store.compute('rawInputTextInComposeOverLimit',
 | 
			
		||||
    ['rawInputTextInComposeLength'],
 | 
			
		||||
    (rawInputTextInComposeLength) => rawInputTextInComposeLength > CHAR_LIMIT
 | 
			
		||||
  store.compute('rawComposeTextOverLimit',
 | 
			
		||||
    ['rawComposeTextLength'],
 | 
			
		||||
    (rawComposeTextLength) => rawComposeTextLength > CHAR_LIMIT
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -14,7 +14,7 @@ const KEYS_TO_STORE_IN_LOCAL_STORAGE = new Set([
 | 
			
		|||
  'autoplayGifs',
 | 
			
		||||
  'markMediaAsSensitive',
 | 
			
		||||
  'pinnedPages',
 | 
			
		||||
  'inputTextInCompose'
 | 
			
		||||
  'composeText'
 | 
			
		||||
])
 | 
			
		||||
 | 
			
		||||
class PinaforeStore extends LocalStorageStore {
 | 
			
		||||
| 
						 | 
				
			
			@ -39,8 +39,8 @@ export const store = new PinaforeStore({
 | 
			
		|||
  pinnedStatuses: {},
 | 
			
		||||
  instanceInfos: {},
 | 
			
		||||
  statusModifications: {},
 | 
			
		||||
  inputTextInCompose: {},
 | 
			
		||||
  rawInputTextInCompose: ''
 | 
			
		||||
  composeText: {},
 | 
			
		||||
  rawComposeText: ''
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
mixins(PinaforeStore)
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue