diff options
| -rw-r--r-- | src/components/conversation/conversation.vue | 2 | ||||
| -rw-r--r-- | src/components/post_status_form/post_status_form.vue | 165 |
2 files changed, 143 insertions, 24 deletions
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index f5642c73..5a900607 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -26,8 +26,8 @@ :in-conversation="isExpanded" :highlight="getHighlight()" :replies="getReplies(status.id)" - @goto="setHighlight" class="status-fadein panel-body" + @goto="setHighlight" @toggleExpanded="toggleExpanded" /> </div> diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 8ffacd75..379c9f3b 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -58,30 +58,150 @@ <span v-if="safeDMEnabled">{{ $t('post_status.direct_warning_to_first_only') }}</span> <span v-else>{{ $t('post_status.direct_warning_to_all') }}</span> </p> - </EmojiInput> - <div class="visibility-tray"> - <scope-selector - :showAll="showAllScopes" - :userDefault="userDefaultScope" - :originalScope="copyMessageScope" - :initialScope="newStatus.visibility" - :onScopeChange="changeVis"/> - - <div class="text-format" v-if="postFormats.length > 1"> - <label for="post-content-type" class="select"> - <select id="post-content-type" v-model="newStatus.contentType" class="form-control"> - <option v-for="postFormat in postFormats" :key="postFormat" :value="postFormat"> - {{$t(`post_status.content_type["${postFormat}"]`)}} - </option> - </select> - <i class="icon-down-open"></i> - </label> + <EmojiInput + v-if="newStatus.spoilerText || alwaysShowSubject" + v-model="newStatus.spoilerText" + :suggest="emojiSuggestor" + class="form-control" + > + <input + + v-model="newStatus.spoilerText" + type="text" + :placeholder="$t('post_status.content_warning')" + class="form-post-subject" + > + </EmojiInput> + <EmojiInput + v-model="newStatus.status" + :suggest="emojiUserSuggestor" + class="form-control main-input" + > + <textarea + ref="textarea" + v-model="newStatus.status" + :placeholder="$t('post_status.default')" + rows="1" + :disabled="posting" + class="form-post-body" + @keydown.meta.enter="postStatus(newStatus)" + @keyup.ctrl.enter="postStatus(newStatus)" + @drop="fileDrop" + @dragover.prevent="fileDrag" + @input="resize" + @paste="paste" + /> + <p + v-if="hasStatusLengthLimit" + class="character-counter faint" + :class="{ error: isOverLengthLimit }" + > + {{ charactersLeft }} + </p> + </EmojiInput> + <div class="visibility-tray"> + <scope-selector + :show-all="showAllScopes" + :user-default="userDefaultScope" + :original-scope="copyMessageScope" + :initial-scope="newStatus.visibility" + :on-scope-change="changeVis" + /> + + <div + v-if="postFormats.length > 1" + class="text-format" + > + <label + for="post-content-type" + class="select" + > + <select + id="post-content-type" + v-model="newStatus.contentType" + class="form-control" + > + <option + v-for="postFormat in postFormats" + :key="postFormat" + :value="postFormat" + > + {{ $t(`post_status.content_type["${postFormat}"]`) }} + </option> + </select> + <i class="icon-down-open" /> + </label> + </div> + <div + v-if="postFormats.length === 1 && postFormats[0] !== 'text/plain'" + class="text-format" + > + <span class="only-format"> + {{ $t(`post_status.content_type["${postFormats[0]}"]`) }} + </span> + </div> </div> - <div class="text-format" v-if="postFormats.length === 1 && postFormats[0] !== 'text/plain'"> - <span class="only-format"> - {{$t(`post_status.content_type["${postFormats[0]}"]`)}} - </span> + </div> + <poll-form + v-if="pollsAvailable" + ref="pollForm" + :visible="pollFormVisible" + @update-poll="setPoll" + /> + <div class="form-bottom"> + <div class="form-bottom-left"> + <media-upload + ref="mediaUpload" + :drop-files="dropFiles" + @uploading="disableSubmit" + @uploaded="addMediaFile" + @upload-failed="uploadFailed" + /> + <div + v-if="pollsAvailable" + class="poll-icon" + > + <i + :title="$t('polls.add_poll')" + class="icon-chart-bar btn btn-default" + :class="pollFormVisible && 'selected'" + @click="togglePollForm" + /> + </div> </div> + + <button + v-if="posting" + disabled + class="btn btn-default" + > + {{ $t('post_status.posting') }} + </button> + <button + v-else-if="isOverLengthLimit" + disabled + class="btn btn-default" + > + {{ $t('general.submit') }} + </button> + <button + v-else + :disabled="submitDisabled" + type="submit" + class="btn btn-default" + > + {{ $t('general.submit') }} + </button> + </div> + <div + v-if="error" + class="alert error" + > + Error: {{ error }} + <i + class="button-icon icon-cancel" + @click="clearError" + /> </div> <div class="attachments"> <div @@ -203,7 +323,6 @@ cursor: pointer; } - .error { text-align: center; } |