Merge pull request #242 from NicolasConstant/topic_enhanced-cw
Topic enhanced cw
This commit is contained in:
commit
ecc2db9eb6
|
@ -169,6 +169,7 @@ const routes: Routes = [
|
|||
StreamsState,
|
||||
SettingsState
|
||||
]),
|
||||
//], { developmentMode: !environment.production }),
|
||||
NgxsStoragePluginModule.forRoot(),
|
||||
ContextMenuModule.forRoot(),
|
||||
HotkeyModule.forRoot(),
|
||||
|
|
|
@ -39,28 +39,68 @@
|
|||
<div class="sub-section">
|
||||
<span class="sub-section__title">switch column:</span><br />
|
||||
|
||||
<input class="sub-section__checkbox" [checked]="columnShortcutEnabled === 1"
|
||||
(change)="onShortcutChange(1)" type="radio" name="column-ctrl" value="column-ctrl"
|
||||
id="column-ctrl">
|
||||
<input class="sub-section__checkbox" [checked]="columnShortcutEnabled === 1" (change)="onShortcutChange(1)"
|
||||
type="radio" name="column-ctrl" value="column-ctrl" id="column-ctrl">
|
||||
<label class="noselect sub-section__label" for="column-ctrl">Ctrl + Left | Ctrl + Right</label>
|
||||
<br>
|
||||
|
||||
<input class="sub-section__checkbox" [checked]="columnShortcutEnabled === 2"
|
||||
(change)="onShortcutChange(2)" type="radio" name="colmun-win"
|
||||
value="colmun-win" id="colmun-win">
|
||||
<input class="sub-section__checkbox" [checked]="columnShortcutEnabled === 2" (change)="onShortcutChange(2)"
|
||||
type="radio" name="colmun-win" value="colmun-win" id="colmun-win">
|
||||
<label class="noselect sub-section__label" for="colmun-win">Win + Alt + Left | Win + Alt + Right</label>
|
||||
<br>
|
||||
|
||||
<span class="sub-section__title" *ngIf="columnShortcutChanged">this settings needs a <a href (click)="reload()">reload</a> to be effective.</span>
|
||||
<span class="sub-section__title" *ngIf="columnShortcutChanged">this settings needs a <a href
|
||||
(click)="reload()">reload</a> to be effective.</span>
|
||||
</div>
|
||||
|
||||
<h4 class="panel__subtitle">Content-Warning Policies</h4>
|
||||
<div class="sub-section">
|
||||
<span class="sub-section__title">global behavior:</span><br />
|
||||
<input class="sub-section__checkbox" [checked]="contentWarningPolicy === 1" (change)="onCwPolicyChange(1)"
|
||||
type="radio" name="cw-none" value="cw-none" id="cw-none">
|
||||
<label class="noselect sub-section__label" for="cw-none">None</label>
|
||||
<br>
|
||||
|
||||
<input class="sub-section__checkbox" [checked]="contentWarningPolicy === 2" (change)="onCwPolicyChange(2)"
|
||||
type="radio" name="cw-hide-all" value="cw-hide-all" id="cw-hide-all">
|
||||
<label class="noselect sub-section__label" for="cw-hide-all">Hide all CWs</label>
|
||||
<br>
|
||||
<div class="sub-section__cw-settings" *ngIf="contentWarningPolicy === 2">
|
||||
<span class="sub-section__title">but add CW on content containing:</span><br />
|
||||
<div class="sub-text-input">
|
||||
<input type="text" class="form-control form-control-sm sub_section__text-input"
|
||||
[(ngModel)]="setAddCwOnContent" placeholder="example;other example" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input class="sub-section__checkbox" [checked]="contentWarningPolicy === 3" (change)="onCwPolicyChange(3)"
|
||||
type="radio" name="cw-add-on-all" value="cw-add-on-all" id="cw-add-on-all">
|
||||
<label class="noselect sub-section__label" for="cw-add-on-all">Add CW on all content</label>
|
||||
<br>
|
||||
<div class="sub-section__cw-settings" *ngIf="contentWarningPolicy === 3">
|
||||
<span class="sub-section__title">unless content is containing:</span><br />
|
||||
<div class="sub-text-input">
|
||||
<input type="text" class="form-control form-control-sm sub_section__text-input"
|
||||
[(ngModel)]="setRemoveCwOnContent" placeholder="example;other example" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="sub-section__title">hide completely content containing:</span><br />
|
||||
<div class="sub-text-input">
|
||||
<input type="text" class="form-control form-control-sm sub_section__text-input"
|
||||
[(ngModel)]="setContentHidedCompletely" placeholder="example;other example" />
|
||||
</div>
|
||||
|
||||
<span class="sub-section__title" *ngIf="contentWarningPolicyChanged"><br/>this settings needs a <a href (click)="reload()">reload</a> to be effective.</span>
|
||||
</div>
|
||||
|
||||
<h4 class="panel__subtitle">About</h4>
|
||||
<p class="version">
|
||||
Sengi version: {{version}}<br/>
|
||||
Sengi version: {{version}}<br />
|
||||
<a href class="version__link" (click)="checkForUpdates()">check for updates</a>
|
||||
<app-waiting-animation *ngIf="isCheckingUpdates" class="waiting-icon"></app-waiting-animation>
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
<h4 class="panel__subtitle">RESET</h4>
|
||||
<div class="sub-section">
|
||||
|
@ -79,6 +119,7 @@
|
|||
(click)="cancelClearAll()">
|
||||
Cancel
|
||||
</a>
|
||||
<br/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -57,7 +57,30 @@
|
|||
font-weight: bold;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
&__text-input {
|
||||
|
||||
}
|
||||
|
||||
&__cw-settings {
|
||||
padding: 0 0 10px 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-control {
|
||||
border: 1px solid $settings-text-input-border;
|
||||
color: $settings-text-input-foreground;
|
||||
background-color: $settings-text-input-background;
|
||||
height: 24px;
|
||||
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-text-input {
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.sound {
|
||||
|
|
|
@ -6,6 +6,7 @@ import { environment } from '../../../../environments/environment';
|
|||
import { ToolsService } from '../../../services/tools.service';
|
||||
import { UserNotificationService, NotificationSoundDefinition } from '../../../services/user-notification.service';
|
||||
import { ServiceWorkerService } from '../../../services/service-worker.service';
|
||||
import { ContentWarningPolicy, ContentWarningPolicyEnum } from '../../../states/settings.state';
|
||||
|
||||
@Component({
|
||||
selector: 'app-settings',
|
||||
|
@ -27,6 +28,36 @@ export class SettingsComponent implements OnInit {
|
|||
columnShortcutEnabled: ColumnShortcut = ColumnShortcut.Ctrl;
|
||||
columnShortcutChanged = false;
|
||||
|
||||
contentWarningPolicy: ContentWarningPolicyEnum = ContentWarningPolicyEnum.None;
|
||||
contentWarningPolicyChanged = false;
|
||||
|
||||
private addCwOnContent: string;
|
||||
set setAddCwOnContent(value: string) {
|
||||
this.setCwPolicy(null, value, null, null);
|
||||
this.addCwOnContent = value.trim();
|
||||
}
|
||||
get setAddCwOnContent(): string {
|
||||
return this.addCwOnContent;
|
||||
}
|
||||
|
||||
private removeCwOnContent: string;
|
||||
set setRemoveCwOnContent(value: string) {
|
||||
this.setCwPolicy(null, null, value, null);
|
||||
this.removeCwOnContent = value.trim();
|
||||
}
|
||||
get setRemoveCwOnContent(): string {
|
||||
return this.removeCwOnContent;
|
||||
}
|
||||
|
||||
private contentHidedCompletely: string;
|
||||
set setContentHidedCompletely(value: string) {
|
||||
this.setCwPolicy(null, null, null, value);
|
||||
this.contentHidedCompletely = value.trim();
|
||||
}
|
||||
get setContentHidedCompletely(): string {
|
||||
return this.contentHidedCompletely;
|
||||
}
|
||||
|
||||
constructor(
|
||||
private formBuilder: FormBuilder,
|
||||
private serviceWorkersService: ServiceWorkerService,
|
||||
|
@ -53,17 +84,65 @@ export class SettingsComponent implements OnInit {
|
|||
} else {
|
||||
this.columnShortcutEnabled = ColumnShortcut.Win;
|
||||
}
|
||||
|
||||
this.contentWarningPolicy = settings.contentWarningPolicy.policy;
|
||||
this.addCwOnContent = settings.contentWarningPolicy.addCwOnContent.join(';');
|
||||
this.removeCwOnContent = settings.contentWarningPolicy.removeCwOnContent.join(';');
|
||||
this.contentHidedCompletely = settings.contentWarningPolicy.hideCompletlyContent.join(';');
|
||||
}
|
||||
|
||||
onShortcutChange(id: ColumnShortcut) {
|
||||
this.columnShortcutEnabled = id;
|
||||
this.columnShortcutChanged = true;
|
||||
|
||||
let settings = this.toolsService.getSettings()
|
||||
let settings = this.toolsService.getSettings();
|
||||
settings.columnSwitchingWinAlt = id === ColumnShortcut.Win;
|
||||
this.toolsService.saveSettings(settings);
|
||||
}
|
||||
|
||||
onCwPolicyChange(id: ContentWarningPolicyEnum) {
|
||||
this.contentWarningPolicy = id;
|
||||
this.contentWarningPolicyChanged = true;
|
||||
|
||||
this.setCwPolicy(id);
|
||||
}
|
||||
|
||||
private setCwPolicy(id: ContentWarningPolicyEnum = null, addCw: string = null, removeCw: string = null, hide: string = null){
|
||||
this.contentWarningPolicyChanged = true;
|
||||
let settings = this.toolsService.getSettings();
|
||||
let cwPolicySettings = new ContentWarningPolicy();
|
||||
|
||||
if(id !== null){
|
||||
cwPolicySettings.policy = id;
|
||||
} else {
|
||||
cwPolicySettings.policy = settings.contentWarningPolicy.policy;
|
||||
}
|
||||
|
||||
if(addCw !== null){
|
||||
cwPolicySettings.addCwOnContent = this.splitCwValues(addCw);
|
||||
} else {
|
||||
cwPolicySettings.addCwOnContent = settings.contentWarningPolicy.addCwOnContent;
|
||||
}
|
||||
|
||||
if(removeCw !== null){
|
||||
cwPolicySettings.removeCwOnContent = this.splitCwValues(removeCw);
|
||||
} else {
|
||||
cwPolicySettings.removeCwOnContent = settings.contentWarningPolicy.removeCwOnContent;
|
||||
}
|
||||
|
||||
if(hide !== null){
|
||||
cwPolicySettings.hideCompletlyContent = this.splitCwValues(hide);
|
||||
} else {
|
||||
cwPolicySettings.hideCompletlyContent = settings.contentWarningPolicy.hideCompletlyContent;
|
||||
}
|
||||
|
||||
this.toolsService.saveContentWarningPolicy(cwPolicySettings);
|
||||
}
|
||||
|
||||
private splitCwValues(data: string): string[]{
|
||||
return data.split(';').map(x => x.trim().toLowerCase()).filter((value, index, self) => self.indexOf(value) === index).filter(y => y !== '');
|
||||
}
|
||||
|
||||
reload(): boolean {
|
||||
window.location.reload();
|
||||
return false;
|
||||
|
@ -136,7 +215,6 @@ export class SettingsComponent implements OnInit {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
enum ColumnShortcut {
|
||||
Ctrl = 1,
|
||||
Win = 2
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div class="status-wrapper" [class.direct-message]="isDirectMessage" [class.status-selected]="isSelected">
|
||||
<div *ngIf="!hideStatus" class="status-wrapper" [class.direct-message]="isDirectMessage" [class.status-selected]="isSelected">
|
||||
<div class="reblog" *ngIf="reblog">
|
||||
<a class="reblog__profile-link" href title="{{ status.account.acct }}"
|
||||
(click)="openAccount(status.account)"
|
||||
|
|
|
@ -6,6 +6,8 @@ import { OpenThreadEvent, ToolsService } from "../../../services/tools.service";
|
|||
import { ActionBarComponent } from "./action-bar/action-bar.component";
|
||||
import { StatusWrapper } from '../../../models/common.model';
|
||||
import { EmojiConverter, EmojiTypeEnum } from '../../../tools/emoji.tools';
|
||||
import { ContentWarningPolicyEnum } from '../../../states/settings.state';
|
||||
import { stat } from 'fs';
|
||||
|
||||
@Component({
|
||||
selector: "app-status",
|
||||
|
@ -38,6 +40,8 @@ export class StatusComponent implements OnInit {
|
|||
isDirectMessage: boolean;
|
||||
isSelected: boolean;
|
||||
|
||||
hideStatus: boolean = false;
|
||||
|
||||
@Output() browseAccountEvent = new EventEmitter<string>();
|
||||
@Output() browseHashtagEvent = new EventEmitter<string>();
|
||||
@Output() browseThreadEvent = new EventEmitter<OpenThreadEvent>();
|
||||
|
@ -50,7 +54,7 @@ export class StatusComponent implements OnInit {
|
|||
|
||||
private _statusWrapper: StatusWrapper;
|
||||
status: Status;
|
||||
|
||||
|
||||
@Input('statusWrapper')
|
||||
set statusWrapper(value: StatusWrapper) {
|
||||
this._statusWrapper = value;
|
||||
|
@ -95,10 +99,52 @@ export class StatusComponent implements OnInit {
|
|||
}
|
||||
|
||||
private checkContentWarning(status: Status) {
|
||||
if (status.sensitive || status.spoiler_text) {
|
||||
this.isContentWarned = true;
|
||||
this.contentWarningText = this.emojiConverter.applyEmojis(this.displayedStatus.emojis, status.spoiler_text, EmojiTypeEnum.medium);
|
||||
let cwPolicy = this.toolsService.getSettings().contentWarningPolicy;
|
||||
|
||||
let splittedContent = [];
|
||||
if ((cwPolicy.policy === ContentWarningPolicyEnum.HideAll && cwPolicy.addCwOnContent.length > 0)
|
||||
|| (cwPolicy.policy === ContentWarningPolicyEnum.AddOnAllContent && cwPolicy.removeCwOnContent.length > 0)
|
||||
|| (cwPolicy.hideCompletlyContent && cwPolicy.hideCompletlyContent.length > 0)) {
|
||||
let parser = new DOMParser();
|
||||
let dom = parser.parseFromString((status.content + ' ' + status.spoiler_text).replace("<br/>", " ").replace("<br>", " ").replace(/\n/g, ' '), 'text/html')
|
||||
let contentToParse = dom.body.textContent;
|
||||
splittedContent = contentToParse.toLowerCase().split(' ');
|
||||
}
|
||||
|
||||
if (cwPolicy.policy === ContentWarningPolicyEnum.None && (status.sensitive || status.spoiler_text)) {
|
||||
this.setContentWarning(status);
|
||||
} else if (cwPolicy.policy === ContentWarningPolicyEnum.HideAll) {
|
||||
let detected = cwPolicy.addCwOnContent.filter(x => splittedContent.find(y => y == x || y == `#${x}`));
|
||||
if (!detected || detected.length === 0) {
|
||||
this.status.sensitive = false;
|
||||
} else {
|
||||
if (!status.spoiler_text) {
|
||||
status.spoiler_text = detected.join(' ');
|
||||
}
|
||||
this.setContentWarning(status);
|
||||
}
|
||||
} else if (cwPolicy.policy === ContentWarningPolicyEnum.AddOnAllContent) {
|
||||
let detected = cwPolicy.removeCwOnContent.filter(x => splittedContent.find(y => y == x || y == `#${x}`));
|
||||
|
||||
if (detected && detected.length > 0) {
|
||||
this.status.sensitive = false;
|
||||
} else {
|
||||
this.setContentWarning(status);
|
||||
}
|
||||
}
|
||||
|
||||
if (cwPolicy.hideCompletlyContent && cwPolicy.hideCompletlyContent.length > 0) {
|
||||
let detected = cwPolicy.hideCompletlyContent.filter(x => splittedContent.find(y => y == x || y == `#${x}`));
|
||||
if (detected && detected.length > 0) {
|
||||
this.hideStatus = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private setContentWarning(status: Status) {
|
||||
this.status.sensitive = true;
|
||||
this.isContentWarned = true;
|
||||
this.contentWarningText = this.emojiConverter.applyEmojis(this.displayedStatus.emojis, status.spoiler_text, EmojiTypeEnum.medium);
|
||||
}
|
||||
|
||||
removeContentWarning(): boolean {
|
||||
|
@ -167,7 +213,7 @@ export class StatusComponent implements OnInit {
|
|||
}
|
||||
|
||||
textSelected(): boolean {
|
||||
if(this.isSelected) return false;
|
||||
if (this.isSelected) return false;
|
||||
|
||||
const status = this._statusWrapper.status;
|
||||
const accountInfo = this._statusWrapper.provider;
|
||||
|
|
|
@ -5,13 +5,13 @@ import { AccountInfo } from '../states/accounts.state';
|
|||
import { MastodonWrapperService } from './mastodon-wrapper.service';
|
||||
import { Account, Results, Status, Emoji } from "./models/mastodon.interfaces";
|
||||
import { StatusWrapper } from '../models/common.model';
|
||||
import { AccountSettings, SaveAccountSettings, GlobalSettings, SaveSettings } from '../states/settings.state';
|
||||
import { AccountSettings, SaveAccountSettings, GlobalSettings, SaveSettings, ContentWarningPolicy, SaveContentWarningPolicy } from '../states/settings.state';
|
||||
import { AppInfo, RegisteredAppsStateModel } from '../states/registered-apps.state';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class ToolsService {
|
||||
export class ToolsService {
|
||||
private accountAvatar: { [id: string]: string; } = {};
|
||||
private instanceInfos: { [id: string]: InstanceInfo } = {};
|
||||
|
||||
|
@ -96,6 +96,13 @@ export class ToolsService {
|
|||
|
||||
getSettings(): GlobalSettings {
|
||||
let settings = <GlobalSettings>this.store.snapshot().globalsettings.settings;
|
||||
|
||||
if(!settings.contentWarningPolicy){
|
||||
var newCwPolicy = new ContentWarningPolicy();
|
||||
this.saveContentWarningPolicy(newCwPolicy);
|
||||
return <GlobalSettings>this.store.snapshot().globalsettings.settings;
|
||||
}
|
||||
|
||||
return settings;
|
||||
}
|
||||
|
||||
|
@ -105,6 +112,12 @@ export class ToolsService {
|
|||
]);
|
||||
}
|
||||
|
||||
saveContentWarningPolicy(cwSettings: ContentWarningPolicy){
|
||||
this.store.dispatch([
|
||||
new SaveContentWarningPolicy(cwSettings)
|
||||
]);
|
||||
}
|
||||
|
||||
findAccount(account: AccountInfo, accountName: string): Promise<Account> {
|
||||
let findAccountFunc = (result: Results) => {
|
||||
if (accountName[0] === '@') accountName = accountName.substr(1);
|
||||
|
|
|
@ -5,6 +5,11 @@ export class RemoveAccountSettings {
|
|||
constructor(public accountId: string) {}
|
||||
}
|
||||
|
||||
export class SaveContentWarningPolicy {
|
||||
static readonly type = '[Settings] Save ContentWarningPolicy';
|
||||
constructor(public contentWarningPolicy: ContentWarningPolicy) {}
|
||||
}
|
||||
|
||||
export class SaveAccountSettings {
|
||||
static readonly type = '[Settings] Save AccountSettings';
|
||||
constructor(public accountSettings: AccountSettings) {}
|
||||
|
@ -29,6 +34,19 @@ export class AccountSettings {
|
|||
customStatusCharLength: number = 500;
|
||||
}
|
||||
|
||||
export enum ContentWarningPolicyEnum {
|
||||
None = 1,
|
||||
HideAll = 2,
|
||||
AddOnAllContent = 3
|
||||
}
|
||||
|
||||
export class ContentWarningPolicy {
|
||||
policy: ContentWarningPolicyEnum = ContentWarningPolicyEnum.None;
|
||||
addCwOnContent: string[] = [];
|
||||
removeCwOnContent: string[] = [];
|
||||
hideCompletlyContent: string[] = [];
|
||||
}
|
||||
|
||||
export class GlobalSettings {
|
||||
disableAutofocus = false;
|
||||
disableAvatarNotifications = false;
|
||||
|
@ -36,6 +54,8 @@ export class GlobalSettings {
|
|||
|
||||
notificationSoundFileId: string = '0';
|
||||
|
||||
contentWarningPolicy: ContentWarningPolicy = new ContentWarningPolicy();
|
||||
|
||||
columnSwitchingWinAlt = false;
|
||||
|
||||
accountSettings: AccountSettings[] = [];
|
||||
|
@ -65,6 +85,7 @@ export class SettingsState {
|
|||
let newSettings = new GlobalSettings();
|
||||
|
||||
newSettings = this.setGlobalSettingsValues(newSettings, state.settings);
|
||||
newSettings.contentWarningPolicy = state.settings.contentWarningPolicy;
|
||||
newSettings.accountSettings = [...state.settings.accountSettings.filter(x => x.accountId !== action.accountId)];
|
||||
|
||||
ctx.patchState({
|
||||
|
@ -78,6 +99,7 @@ export class SettingsState {
|
|||
|
||||
let newSettings = new GlobalSettings();
|
||||
newSettings = this.setGlobalSettingsValues(newSettings, state.settings);
|
||||
newSettings.contentWarningPolicy = state.settings.contentWarningPolicy;
|
||||
newSettings.accountSettings = [...state.settings.accountSettings.filter(x => x.accountId !== action.accountSettings.accountId), action.accountSettings];
|
||||
|
||||
ctx.patchState({
|
||||
|
@ -91,6 +113,7 @@ export class SettingsState {
|
|||
|
||||
let newSettings = new GlobalSettings();
|
||||
newSettings = this.setGlobalSettingsValues(newSettings, action.settings);
|
||||
newSettings.contentWarningPolicy = state.settings.contentWarningPolicy;
|
||||
newSettings.accountSettings = [...state.settings.accountSettings];
|
||||
|
||||
ctx.patchState({
|
||||
|
@ -98,6 +121,21 @@ export class SettingsState {
|
|||
});
|
||||
}
|
||||
|
||||
@Action(SaveContentWarningPolicy)
|
||||
SaveContentWarningPolicy(ctx: StateContext<SettingsStateModel>, action: SaveContentWarningPolicy){
|
||||
const state = ctx.getState();
|
||||
|
||||
let newSettings = new GlobalSettings();
|
||||
|
||||
newSettings = this.setGlobalSettingsValues(newSettings, state.settings);
|
||||
newSettings.accountSettings = [...state.settings.accountSettings];
|
||||
newSettings.contentWarningPolicy = action.contentWarningPolicy;
|
||||
|
||||
ctx.patchState({
|
||||
settings: newSettings
|
||||
});
|
||||
}
|
||||
|
||||
private setGlobalSettingsValues(newSettings: GlobalSettings, oldSettings: GlobalSettings): GlobalSettings {
|
||||
|
||||
newSettings.disableAutofocus = oldSettings.disableAutofocus;
|
||||
|
|
|
@ -95,4 +95,8 @@ $scheduler-background: #3e455f;
|
|||
|
||||
$notification-column-selector-background: #171c29;
|
||||
$notification-column-selector-color: #999fb1;
|
||||
$notification-column-selector-color-hover: white;
|
||||
$notification-column-selector-color-hover: white;
|
||||
|
||||
$settings-text-input-background: #242836;
|
||||
$settings-text-input-foreground: white;
|
||||
$settings-text-input-border: #32384d;
|
Loading…
Reference in New Issue