mirror of
https://git.pleroma.social/sjw/pleroma-fe.git
synced 2024-12-23 15:25:18 +01:00
Basic attachments, some retweet fixes.
This commit is contained in:
parent
7b92ca6f94
commit
5f69014575
BIN
src/assets/nsfw.jpg
Normal file
BIN
src/assets/nsfw.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 18 KiB |
21
src/components/attachment/attachment.js
Normal file
21
src/components/attachment/attachment.js
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
import nsfwImage from '../../assets/nsfw.jpg'
|
||||||
|
|
||||||
|
const Attachment = {
|
||||||
|
props: [
|
||||||
|
'attachment',
|
||||||
|
'nsfw'
|
||||||
|
],
|
||||||
|
data: () => ({ nsfwImage }),
|
||||||
|
computed: {
|
||||||
|
type () {
|
||||||
|
return 'image'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showNsfw () {
|
||||||
|
this.nsfw = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Attachment
|
25
src/components/attachment/attachment.vue
Normal file
25
src/components/attachment/attachment.vue
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
<template>
|
||||||
|
<div class="attachment">
|
||||||
|
<a v-if="nsfw" v-on:click.prevent="showNsfw()">
|
||||||
|
<img :src="nsfwImage"></img>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a v-if="type === 'image' && !nsfw" :href="attachment.url" target="_blank"><img :src="attachment.url"></img></a>
|
||||||
|
<!-- <span ng-if="type === 'unknown'">Don't know how to display this...</span>
|
||||||
|
|
||||||
|
|
||||||
|
<div ng-if="type === 'html' && attachment.oembed" class="oembed">
|
||||||
|
<div ng-if="attachment.thumb_url" class="image">
|
||||||
|
<img ng-src="{{::attachment.thumb_url}}"></img>
|
||||||
|
</div>
|
||||||
|
<div class="text">
|
||||||
|
<h1><a href="{{::attachment.url}}">{{::attachment.oembed.title}}</a></h1>
|
||||||
|
<div ng-bind-html="attachment.oembed.oembedHTML"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<video ng-if="type ==='webm'" ng-src="{{::videoUrl}}" controls></video> -->
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script src="./attachment.js"></script>
|
@ -1,5 +1,24 @@
|
|||||||
|
import Attachment from '../attachment/attachment.vue'
|
||||||
|
|
||||||
const Status = {
|
const Status = {
|
||||||
props: [ 'status' ]
|
props: [ 'statusoid' ],
|
||||||
|
data: () => ({
|
||||||
|
nsfw: true
|
||||||
|
}),
|
||||||
|
computed: {
|
||||||
|
retweet () { return !!this.statusoid.retweeted_status },
|
||||||
|
retweeter () { return this.statusoid.user.name },
|
||||||
|
status () {
|
||||||
|
if (this.retweet) {
|
||||||
|
return this.statusoid.retweeted_status
|
||||||
|
} else {
|
||||||
|
return this.statusoid
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
Attachment
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Status
|
export default Status
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="status-el">
|
<div class="status-el">
|
||||||
<div ng-if="retweet" class="media container retweet-info">
|
<div v-if="retweet" class="media container retweet-info">
|
||||||
<div class="media-left">
|
<div class="media-left">
|
||||||
<i class='fa fa-retweet'></i>
|
<i class='fa fa-retweet'></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="media-body">
|
<div class="media-body">
|
||||||
Retweeted by {{status.user.screen_name}}
|
Retweeted by {{retweeter}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="media status container" ng-class="{compact: compact, notify: notify}">
|
<div class="media status container" ng-class="{compact: compact, notify: notify}">
|
||||||
@ -15,24 +15,22 @@
|
|||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="media-body">
|
<div class="media-body">
|
||||||
<h4 ng-if="!compact" class="media-heading">
|
<h4 class="media-heading">
|
||||||
<strong>{{status.user.name}}</strong>
|
<strong>{{status.user.name}}</strong>
|
||||||
<small>{{status.user.screen_name}}</small>
|
<small>{{status.user.screen_name}}</small>
|
||||||
<small ng-if="status.in_reply_to_screen_name"> > {{status.in_reply_to_screen_name}}</small>
|
<small v-if="status.in_reply_to_screen_name"> > {{status.in_reply_to_screen_name}}</small>
|
||||||
-
|
-
|
||||||
<small ng-click="goToConversation(status.statusnet_conversation_id)">{{status.created_at_parsed | date:'medium'}}</small>
|
<small>{{status.created_at_parsed}}</small>
|
||||||
</h4>
|
</h4>
|
||||||
|
|
||||||
<p>{{status.text}}</p>
|
<div v-html="status.statusnet_html"></div>
|
||||||
|
|
||||||
<div ng-if='status.attachments' class='attachments'>
|
<div v-if='status.attachments' class='attachments'>
|
||||||
<attachment nsfw="nsfw" attachment="attachment" ng-repeat="attachment in status.attachments">
|
<attachment :nsfw="nsfw" :attachment="attachment" v-for="attachment in status.attachments">
|
||||||
</attachment>
|
</attachment>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div ng-if="!compact">
|
<div>
|
||||||
<p>
|
|
||||||
</p>
|
|
||||||
<div class='status-actions'>
|
<div class='status-actions'>
|
||||||
<div ng-click="toggleReplying()">
|
<div ng-click="toggleReplying()">
|
||||||
<i class='fa fa-reply'></i>
|
<i class='fa fa-reply'></i>
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<status v-for="status in timeline.visibleStatuses" v-bind:status="status"></status>
|
<status v-for="status in timeline.visibleStatuses" v-bind:statusoid="status"></status>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script src="./timeline.js"></script>
|
<script src="./timeline.js"></script>
|
||||||
|
Loading…
Reference in New Issue
Block a user