[advancedcontentfilter] Move Vue template from DOM to compiled render functions (redux)
This commit is contained in:
Hypolite Petovan
parent
d014fa3e28
commit
6e07bf3d29
3 changed files with 48 additions and 114 deletions
File diff suppressed because one or more lines are too long
|
|
@ -208,31 +208,31 @@ function advancedcontentfilter_content(App $a)
|
||||||
} else {
|
} else {
|
||||||
$t = get_markup_template('settings.tpl', 'addon/advancedcontentfilter/');
|
$t = get_markup_template('settings.tpl', 'addon/advancedcontentfilter/');
|
||||||
return replace_macros($t, [
|
return replace_macros($t, [
|
||||||
|
'$messages' => [
|
||||||
|
'backtosettings' => L10n::t('Back to Addon Settings'),
|
||||||
|
'title' => L10n::t('Advanced Content Filter'),
|
||||||
|
'add_a_rule' => L10n::t('Add a Rule'),
|
||||||
|
'help' => L10n::t('Help'),
|
||||||
|
'intro' => L10n::t('Add and manage your personal content filter rules in this screen. Rules have a name and an arbitrary expression that will be matched against post data. For a complete reference of the available operations and variables, check the help page.'),
|
||||||
|
'your_rules' => L10n::t('Your rules'),
|
||||||
|
'no_rules' => L10n::t('You have no rules yet! Start adding one by clicking on the button above next to the title.'),
|
||||||
|
'disabled' => L10n::t('Disabled'),
|
||||||
|
'enabled' => L10n::t('Enabled'),
|
||||||
|
'disable_this_rule' => L10n::t('Disable this rule'),
|
||||||
|
'enable_this_rule' => L10n::t('Enable this rule'),
|
||||||
|
'edit_this_rule' => L10n::t('Edit this rule'),
|
||||||
|
'edit_the_rule' => L10n::t('Edit the rule'),
|
||||||
|
'save_this_rule' => L10n::t('Save this rule'),
|
||||||
|
'delete_this_rule' => L10n::t('Delete this rule'),
|
||||||
|
'rule' => L10n::t('Rule'),
|
||||||
|
'close' => L10n::t('Close'),
|
||||||
|
'addtitle' => L10n::t('Add new rule'),
|
||||||
|
'rule_name' => L10n::t('Rule Name'),
|
||||||
|
'rule_expression' => L10n::t('Rule Expression'),
|
||||||
|
'cancel' => L10n::t('Cancel'),
|
||||||
|
],
|
||||||
'$current_theme' => $a->getCurrentTheme(),
|
'$current_theme' => $a->getCurrentTheme(),
|
||||||
'$backtosettings' => L10n::t('Back to Addon Settings'),
|
|
||||||
'$title' => L10n::t('Advanced Content Filter'),
|
|
||||||
'$add_a_rule' => L10n::t('Add a Rule'),
|
|
||||||
'$help' => L10n::t('Help'),
|
|
||||||
'$advanced_content_filter_intro' => L10n::t('Add and manage your personal content filter rules in this screen. Rules have a name and an arbitrary expression that will be matched against post data. For a complete reference of the available operations and variables, check the <a href="advancedcontentfilter/help">help page</a>.'),
|
|
||||||
'$your_rules' => L10n::t('Your rules'),
|
|
||||||
'$no_rules' => L10n::t('You have no rules yet! Start adding one by clicking on the button above next to the title.'),
|
|
||||||
'$disabled' => L10n::t('Disabled'),
|
|
||||||
'$enabled' => L10n::t('Enabled'),
|
|
||||||
'$disable_this_rule' => L10n::t('Disable this rule'),
|
|
||||||
'$enable_this_rule' => L10n::t('Enable this rule'),
|
|
||||||
'$edit_this_rule' => L10n::t('Edit this rule'),
|
|
||||||
'$edit_the_rule' => L10n::t('Edit the rule'),
|
|
||||||
'$save_this_rule' => L10n::t('Save this rule'),
|
|
||||||
'$delete_this_rule' => L10n::t('Delete this rule'),
|
|
||||||
'$rule' => L10n::t('Rule'),
|
|
||||||
'$close' => L10n::t('Close'),
|
|
||||||
'$addtitle' => L10n::t('Add new rule'),
|
|
||||||
'$rule_name' => L10n::t('Rule Name'),
|
|
||||||
'$rule_expression' => L10n::t('Rule Expression'),
|
|
||||||
'$examples' => L10n::t('<p>Examples:</p><ul><li><pre>author_link == \'https://friendica.mrpetovan.com/profile/hypolite\'</pre></li><li>tags</li></ul>'),
|
|
||||||
'$cancel' => L10n::t('Cancel'),
|
|
||||||
'$rules' => advancedcontentfilter_get_rules(),
|
'$rules' => advancedcontentfilter_get_rules(),
|
||||||
'$baseurl' => System::baseUrl(true),
|
|
||||||
'$form_security_token' => get_form_security_token()
|
'$form_security_token' => get_form_security_token()
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,96 +1,20 @@
|
||||||
<div id="adminpage">
|
<div id="adminpage">
|
||||||
<style>[v-cloak] { display: none; }</style>
|
<style>[v-cloak] { display: none; }</style>
|
||||||
<div id="rules">
|
<div id="rules"></div>
|
||||||
<p><a href="settings/addon">🔙 {{$backtosettings}}</a></p>
|
|
||||||
<h1>
|
|
||||||
{{$title}}
|
|
||||||
|
|
||||||
<a href="{{$baseurl}}/advancedcontentfilter/help" class="btn btn-default btn-sm" title="{{$help}}">
|
<script>
|
||||||
<i class="fa fa-question fa-2x" aria-hidden="true"></i>
|
var existingRules = {{$rules}};
|
||||||
</a>
|
|
||||||
</h1>
|
|
||||||
<div>{{$advanced_content_filter_intro}}</div>
|
|
||||||
<h2>
|
|
||||||
{{$your_rules}}
|
|
||||||
<button class="btn btn-primary btn-sm" title="{{$add_a_rule}}" @click="showModal = true">
|
|
||||||
<i class="fa fa-plus fa-2x" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</h2>
|
|
||||||
<div v-if="rules.length === 0" v-cloak>
|
|
||||||
{{$no_rules}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="list-group" v-cloak>
|
var messages = {
|
||||||
<li class="list-group-item" v-for="rule in rules">
|
{{foreach $messages as $key => $value}}
|
||||||
<p class="pull-right">
|
{{$key}}: "{{$value}}",
|
||||||
<button type="button" class="btn btn-xs btn-primary" v-on:click="toggleActive(rule)" aria-label="{{$disable_this_rule}}" title="{{$disable_this_rule}}" v-if="parseInt(rule.active)">
|
{{/foreach}}
|
||||||
<i class="fa fa-toggle-on" aria-hidden="true"></i> {{$enabled}}
|
};
|
||||||
</button>
|
|
||||||
<button type="button" class="btn btn-xs btn-default" v-on:click="toggleActive(rule)" aria-label="{{$enable_this_rule}}" title="{{$enable_this_rule}}" v-else>
|
|
||||||
<i class="fa fa-toggle-off" aria-hidden="true"></i> {{$disabled}}
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button type="button" class="btn btn-xs btn-primary" v-on:click="editRule(rule)" aria-label="{{$edit_this_rule}}" title="{{$edit_this_rule}}">
|
var csrfToken = "{{$form_security_token}}";
|
||||||
<i class="fa fa-pencil" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
<button type="button" class="btn btn-xs btn-default" v-on:click="deleteRule(rule)" aria-label="{{$delete_this_rule}}" title="{{$delete_this_rule}}">
|
|
||||||
<i class="fa fa-trash-o" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</p>
|
|
||||||
<h3 class="list-group-item-heading">
|
|
||||||
{{$rule}} #{{ rule.id }}: {{ rule.name }}
|
|
||||||
</h3>
|
|
||||||
<pre class="list-group-item-text" v-if="rule.expression">{{ rule.expression }}</pre>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="modal fade" ref="vuemodal" tabindex="-1" role="dialog" v-cloak>
|
var currentTheme = "{{$current_theme}}";
|
||||||
<div class="modal-dialog" role="document">
|
</script>
|
||||||
<div class="modal-content">
|
|
||||||
<div class="modal-header">
|
|
||||||
{{if $current_theme == 'frio'}}
|
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-label="{{$close}}" @click="showModal = false"><span aria-hidden="true">×</span></button>
|
|
||||||
{{/if}}
|
|
||||||
<h3 v-if="rule.id">{{$edit_the_rule}} "{{ rule.name }}"</h3>
|
|
||||||
<h3 v-if="!rule.id">{{$add_a_rule}}</h3>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
<form>
|
|
||||||
<input type="hidden" name="form_security_token" id="csrf" value="{{$form_security_token}}" />
|
|
||||||
<div class="alert alert-danger" role="alert" v-if="errorMessage">{{ errorMessage }}</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<input class="form-control" placeholder="{{$rule_name}}" v-model="rule.name">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<input class="form-control" placeholder="{{$rule_expression}}" v-model="rule.expression">
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-default" data-dismiss="modal" aria-label="Close" @click="resetForm()">{{$cancel}}</button>
|
|
||||||
<button slot="button" class="btn btn-primary" type="button" v-if="rule.id" v-on:click="saveRule(rule)">{{$save_this_rule}}</button>
|
|
||||||
<button slot="button" class="btn btn-primary" type="button" v-if="!rule.id" v-on:click="addRule()">{{$add_a_rule}}</button>
|
|
||||||
</div>
|
|
||||||
</div><!-- /.modal-content -->
|
|
||||||
</div><!-- /.modal-dialog -->
|
|
||||||
</div><!-- /.modal -->
|
|
||||||
|
|
||||||
<form class="form-inline" v-on:submit.prevent="showVariables()">
|
|
||||||
<fieldset>
|
|
||||||
<legend>Show post variables</legend>
|
|
||||||
<div class="form-group" style="width: 50%">
|
|
||||||
<label for="itemUrl" class="sr-only">Post URL or item guid</label>
|
|
||||||
<input class="form-control" id="itemUrl" placeholder="Post URL or item guid" v-model="itemUrl" style="width: 100%">
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-primary">Show Variables</button>
|
|
||||||
</fieldset>
|
|
||||||
</form>
|
|
||||||
<pre v-cloak>
|
|
||||||
{{ itemJson }}
|
|
||||||
</pre>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script> var existingRules = {{$rules}};</script>
|
|
||||||
|
|
||||||
<!-- JS -->
|
<!-- JS -->
|
||||||
<script src="{{$baseurl}}/view/asset/vue/dist/vue.min.js"></script>
|
<script src="{{$baseurl}}/view/asset/vue/dist/vue.min.js"></script>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue