advancedcontentfilter/templates/advancedcontentfilter.vue

   1 <!--
   2         This the the source HTML for the render functions defined in advancedcontentfilter.js
   3         This file is only for reference only and editing it won't change the addon display.
   4         Here's the workflow to change the actual display:
   5         1. Edit this file
   6         2. Run it through https://vuejs.org/v2/guide/render-function.html#Template-Compilation
   7         3. Replace the render and staticRenderFns members in advancedcontentfilter.js by the contents of the anonymous() functions
   8 -->
   9 <div id="rules">
  10         <p><a href="settings/addons">🔙 {{ messages.backtosettings }}</a></p>
  11         <h1>
  12                 {{ messages.title }}
  13                 &nbsp;
  14                 <a href="advancedcontentfilter/help" class="btn btn-default btn-sm" :title="messages.help">
  15                         <i class="fa fa-question fa-2x" aria-hidden="true"></i>
  16                 </a>
  17         </h1>
  18         <div>{{ messages.intro }}</div>
  19         <h2>
  20                 {{ messages.your_rules }}
  21                 &nbsp;
  22                 <button class="btn btn-primary btn-sm" :title="messages.add_a_rule" @click="showModal = true">
  23                         <i class="fa fa-plus fa-2x" aria-hidden="true"></i>
  24                 </button>
  25         </h2>
  26         <div v-if="rules.length === 0" v-cloak>
  27                 {{ messages.no_rules }}
  28         </div>
  29
  30         <ul class="list-group" v-cloak>
  31                 <li class="list-group-item" v-for="rule in rules">
  32                         <p class="pull-right">
  33                                 <button type="button" class="btn btn-xs btn-primary" v-on:click="toggleActive(rule)" :aria-label="messages.disable_this_rule" :title="messages.disable_this_rule" v-if="parseInt(rule.active)">
  34                                         <i class="fa fa-toggle-on" aria-hidden="true"></i> {{ messages.enabled }}
  35                                 </button>
  36                                 <button type="button" class="btn btn-xs btn-default" v-on:click="toggleActive(rule)" :aria-label="messages.enable_this_rule" :title="messages.enable_this_rule" v-else>
  37                                         <i class="fa fa-toggle-off" aria-hidden="true"></i> {{ messages.disabled }}
  38                                 </button>
  39                                 &nbsp;
  40                                 <button type="button" class="btn btn-xs btn-primary" v-on:click="editRule(rule)" :aria-label="messages.edit_this_rule" :title="messages.edit_this_rule">
  41                                         <i class="fa fa-pencil" aria-hidden="true"></i>
  42                                 </button>
  43                                 &nbsp;
  44                                 <button type="button" class="btn btn-xs btn-default" v-on:click="deleteRule(rule)" :aria-label="messages.delete_this_rule" :title="messages.delete_this_rule">
  45                                         <i class="fa fa-trash-o" aria-hidden="true"></i>
  46                                 </button>
  47                         </p>
  48                         <h3 class="list-group-item-heading">
  49                                 {{ messages.rule }} #{{ rule.id }}: {{ rule.name }}
  50                         </h3>
  51                         <pre class="list-group-item-text" v-if="rule.expression">{{ rule.expression }}</pre>
  52                 </li>
  53         </ul>
  54
  55         <div class="modal fade" ref="vuemodal" tabindex="-1" role="dialog" v-cloak>
  56                 <div class="modal-dialog" role="document">
  57                         <div class="modal-content">
  58                                 <div class="modal-header">
  59                                         <button type="button" class="close" data-dismiss="modal" :aria-label="messages.close" @click="showModal = false"  v-if="currentTheme === 'frio'"><span aria-hidden="true">&times;</span></button>
  60                                         <h3 v-if="rule.id">{{ messages.edit_the_rule }} "{{ rule.name }}"</h3>
  61                                         <h3 v-if="!rule.id">{{ messages.add_a_rule }}</h3>
  62                                 </div>
  63                                 <div class="modal-body">
  64                                         <form>
  65                                                 <div class="alert alert-danger" role="alert" v-if="errorMessage">{{ errorMessage }}</div>
  66                                                 <div class="form-group">
  67                                                         <input class="form-control" :placeholder="messages.rule_name" v-model="rule.name">
  68                                                 </div>
  69                                                 <div class="form-group">
  70                                                         <input class="form-control" :placeholder="messages.rule_expression" v-model="rule.expression">
  71                                                 </div>
  72                                         </form>
  73                                 </div>
  74                                 <div class="modal-footer">
  75                                         <button type="button" class="btn btn-default" data-dismiss="modal" aria-label="Close" @click="resetForm()">{{ messages.cancel }}</button>
  76                                         <button slot="button" class="btn btn-primary" type="button" v-if="rule.id" v-on:click="saveRule(rule)">{{ messages.save_this_rule }}</button>
  77                                         <button slot="button" class="btn btn-primary" type="button" v-if="!rule.id" v-on:click="addRule()">{{ messages.add_a_rule }}</button>
  78                                 </div>
  79                         </div><!-- /.modal-content -->
  80                 </div><!-- /.modal-dialog -->
  81         </div><!-- /.modal -->
  82
  83         <form class="form-inline" v-on:submit.prevent="showVariables()">
  84                 <fieldset>
  85                         <legend>Show post variables</legend>
  86                         <div class="form-group" style="width: 50%">
  87                                 <label for="itemUrl" class="sr-only">Post URL or item guid</label>
  88                                 <input class="form-control" id="itemUrl" placeholder="Post URL or item guid" v-model="itemUrl" style="width: 100%">
  89                         </div>
  90                         <button type="submit" class="btn btn-primary">Show Variables</button>
  91                 </fieldset>
  92         </form>
  93         <pre v-cloak>
  94 {{ itemJson }}
  95         </pre>
  96 </div>