1
0
Fork 1
mirror of https://github.com/pixelfed/pixelfed.git synced 2024-12-23 16:24:29 +00:00

Update ComposeModal

This commit is contained in:
Daniel Supernault 2019-03-26 15:12:55 -06:00
parent aa6afb8ca1
commit 756e91e63a
No known key found for this signature in database
GPG key ID: 0DEF1C662C9033F7

View file

@ -73,32 +73,21 @@
<input type="text" class="form-control" v-model="media[carouselCursor].license" placeholder="Optional media license"> <input type="text" class="form-control" v-model="media[carouselCursor].license" placeholder="Optional media license">
</div> </div>
</div> </div>
<div class="col-6 pt-2"> <!-- <div class="col-6 pt-2">
<!-- <button class="btn btn-outline-secondary btn-sm mr-1"><i class="fas fa-map-marker-alt"></i></button> <button class="btn btn-outline-secondary btn-sm mr-1"><i class="fas fa-map-marker-alt"></i></button>
<button class="btn btn-outline-secondary btn-sm"><i class="fas fa-tools"></i></button> --> <button class="btn btn-outline-secondary btn-sm"><i class="fas fa-tools"></i></button>
</div> </div> -->
<div class="col-6 text-right pt-2"> <div class="col-12 text-right pt-2">
<button class="btn btn-outline-danger btn-sm font-weight-bold mr-1" v-on:click="deleteMedia()"><i class="fas fa-trash"></i></button> <button class="btn btn-outline-danger btn-sm font-weight-bold mr-1" v-on:click="deleteMedia()">Delete Photo</button>
<button class="btn btn-outline-secondary btn-sm font-weight-bold" v-on:click="updateMedia()">Close</button> <button class="btn btn-outline-secondary btn-sm font-weight-bold" v-on:click="updateMedia()">Hide Media Toolbar</button>
</div> </div>
</div> </div>
</div> </div>
<div :class="[mediaDrawer?'glass card-body disabled':'card-body']"> <div :class="[mediaDrawer?'d-none':'card-body']">
<div class="reactions my-1">
<h3 class="far fa-heart pr-3 m-0 text-lighter" title="Like"></h3>
<h3 class="far fa-comment pr-3 m-0 text-lighter" title="Comment"></h3>
</div>
<div class="likes font-weight-bold">
<span class="like-count">0</span> likes
</div>
<div class="caption"> <div class="caption">
<p class="mb-2 read-more" style="overflow: hidden;"> <p class="mb-2">
<span class="username font-weight-bold d-inline-block clearfix"> <textarea class="form-control d-inline-block" rows="3" placeholder="Add an optional caption" v-model="composeText"></textarea>
<bdi><a class="text-dark" :href="profile.url">{{profile.username}}</a></bdi>
</span>
<span contenteditable="" style="outline:none;" v-on:keyup="textWatcher"></span>
</p> </p>
</div> </div>
<div class="comments"> <div class="comments">
@ -112,7 +101,7 @@
</div> </div>
</div> </div>
<div :class="[mediaDrawer?'glass card-footer':'card-footer']"> <div :class="[mediaDrawer?'d-none':'card-footer']">
<div class="d-flex justify-content-between align-items-center"> <div class="d-flex justify-content-between align-items-center">
<div> <div>
<div class="custom-control custom-switch d-inline mr-3"> <div class="custom-control custom-switch d-inline mr-3">
@ -183,7 +172,7 @@
</div> </div>
</div> </div>
<div class="small text-muted font-weight-bold"> <div class="small text-muted font-weight-bold">
{{composeTextLength}} / 500 {{composeText.length}} / 500
</div> </div>
<div class="pl-md-5"> <div class="pl-md-5">
<div class="btn-group"> <div class="btn-group">
@ -209,15 +198,6 @@
</template> </template>
<style type="text/css" scoped> <style type="text/css" scoped>
.glass {
-webkit-filter: blur(2px);
-moz-filter: blur(2px);
-o-filter: blur(2px);
-ms-filter: blur(2px);
filter: blur(2px);
width: 100%;
height: 100%;
}
.media-drawer-filters { .media-drawer-filters {
overflow-x: scroll; overflow-x: scroll;
flex-wrap:unset; flex-wrap:unset;
@ -310,16 +290,6 @@ export default {
]; ];
}, },
watch: {
composeText: function (newComposeText, oldComposeText) {
this.debouncedTextWatcher();
}
},
created: function() {
this.debouncedTextWatcher = _.debounce(this.textWatcher, 300)
},
methods: { methods: {
fetchConfig() { fetchConfig() {
@ -345,11 +315,6 @@ export default {
el.removeAttr('disabled'); el.removeAttr('disabled');
}, },
textWatcher() {
this.composeText = event.target.innerText;
this.composeTextLength = event.target.innerText.length;
},
mediaWatcher() { mediaWatcher() {
let self = this; let self = this;
$(document).on('change', '.file-input', function(e) { $(document).on('change', '.file-input', function(e) {