Issue #399 - Use a stage parameter for the filters

webcompat/static/js/lib/issue-list.js

@@ -79,7 +79,7 @@ issueList.FilterView = Backbone.View.extend({
   events: {
     'click .js-filter-button': 'toggleFilter'
   },
-  _filterRegex: /(new|needsdiagnosis|contactready|sitewait|closed)=1/ig,
+  _filterRegex: /(stage=(?:new|needscontact|needsdiagnosis|contactready|sitewait|closed))/ig,
   _isLoggedIn: $('body').data('username'),
   _userName: $('body').data('username'),
   initialize: function() {
@@ -130,7 +130,7 @@ issueList.FilterView = Backbone.View.extend({
     this.removeFiltersFromModel();
 
     if (history.pushState) {
-      // remove filter from URL
+      // remove filter stage param from URL
       history.pushState({}, '', location.search.replace(this._filterRegex, ''));
     }
   },
@@ -162,7 +162,7 @@ issueList.FilterView = Backbone.View.extend({
     }
 
     if (btn.hasClass('is-active')) {
-      filterParam = btn.data('filter') + "=1";
+      filterParam = 'stage=' + btn.data('filter');
       this.updateResults(btn.data('filter'));
       this.addFilterToModel(filterParam);
     } else {
@@ -303,7 +303,7 @@ issueList.IssueView = Backbone.View.extend({
   events: {
     'click .js-issue-label': 'labelSearch',
   },
-  _filterRegex: /&*(new|needsdiagnosis|contactready|sitewait|closed)=1&*/i,
+  _filterRegex: /&*stage=(new|needscontact|needsdiagnosis|contactready|sitewait|closed)&*/i,
   _isLoggedIn: $('body').data('username'),
   _loadingIndicator: $('.js-loader'),
   initialize: function() {
@@ -425,14 +425,12 @@ issueList.IssueView = Backbone.View.extend({
     e.preventDefault();
   },
   removeAllFiltersFromModel: function() {
-    // We can't have more than one filter at once for the issues model,
-    // and there's no meaningful notion of contactready=0, so remove them all.
-    var filters = ['new', 'needsdiagnosis', 'contactready',
-                   'sitewait', 'closed', 'needscontact', 'q'];
+    // We can't have more than one stage filter at once for the issues model,
+    // so remove them all. We also want to remove 'q' if present as well.
+    var filters = ['stage', 'q'];
     _.forEach(filters, function(filter) {
       delete this.issues.params[filter];
     }, this);
-
   },
   requestNextPage: function() {
     var nextPage;

webcompat/templates/browse-issues.html

@@ -3,19 +3,19 @@
     <h2 class="wc-Title--l">Browse Issues</h2>
     <ul class="r-ResetList u-inlineBlock">
       <li class="IssueItem IssueItem--list IssueItem--new">
-        <a href="{{ url_for('show_issues') }}?new=1">New Issues</a>
+        <a href="{{ url_for('show_issues') }}?stage=new">New Issues</a>
       </li>
       <li class="IssueItem IssueItem--list IssueItem--need">
-        <a href="{{ url_for('show_issues') }}?needsdiagnosis=1">Needs&nbsp;Diagnosis</a>
+        <a href="{{ url_for('show_issues') }}?stage=needsdiagnosis">Needs&nbsp;Diagnosis</a>
       </li>
       <li class="IssueItem IssueItem--list IssueItem--ready">
-        <a href="{{ url_for('show_issues') }}?contactready=1">Ready&nbsp;for&nbsp;Outreach</a>
+        <a href="{{ url_for('show_issues') }}?stage=contactready">Ready&nbsp;for&nbsp;Outreach</a>
       </li>
       <li class="IssueItem IssueItem--list IssueItem--sitewait">
-        <a href="{{ url_for('show_issues') }}?sitewait=1">Site&nbsp;Contacted</a>
+        <a href="{{ url_for('show_issues') }}?stage=sitewait">Site&nbsp;Contacted</a>
       </li>
       <li class="IssueItem IssueItem--list IssueItem--close">
-        <a href="{{ url_for('show_issues') }}?closed=1">Closed</a>
+        <a href="{{ url_for('show_issues') }}?stage=closed">Closed</a>
       </li>
     </ul>
     {% include "browse-issues/my-issues.html" %}

webcompat/templates/browse-issues/needs-diagnosis.html

@@ -1,7 +1,7 @@
 <div id="needs-diagnosis" class="r-Grid-cell r-all--1of2 r-maxM--2of2">
   <script type="text/template" id="needs-diagnosis-tmpl">
   <h3 class="wc-titleIssue">
-    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?needsdiagnosis=1">Needs Diagnosis</a>
+    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?stage=needsdiagnosis">Needs Diagnosis</a>
   </h3>
   <% if (needsDiagnosis.length) { %>
     <% _.each(needsDiagnosis, function(issue) { %>

webcompat/templates/browse-issues/new.html

@@ -1,7 +1,7 @@
 <div id="new" class="r-Grid-cell r-all--1of2 r-maxM--2of2">
   <script type="text/template" id="new-tmpl">
   <h3 class="wc-titleIssue">
-    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?new=1">New Issues</a>
+    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?stage=new">New Issues</a>
   </h3>
   <% if (newIssues.length) { %>
     <% _.each(newIssues, function(issue) { %>

webcompat/templates/browse-issues/ready-for-outreach.html

@@ -1,7 +1,7 @@
 <div id="ready-for-outreach" class="r-Grid-cell r-all--1of2 r-maxM--2of2">
   <script type="text/template" id="contactready-tmpl">
   <h3 class="wc-titleIssue">
-    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?contactready=1">Ready for Outreach</a>
+    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?stage=contactready">Ready for Outreach</a>
   </h3>
   <% if (contactReady.length) { %>
     <% _.each(contactReady, function(issue) { %>

webcompat/templates/browse-issues/site-contacted.html

@@ -1,7 +1,7 @@
 <div id="sitewait" class="r-Grid-cell r-all--1of2 r-maxM--2of2">
   <script type="text/template" id="sitewait-tmpl">
   <h3 class="wc-titleIssue">
-    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?sitewait=1">Site Contacted</a>
+    <a class="wc-titleIssue-link" href="{{ url_for('show_issues') }}?stage=sitewait">Site Contacted</a>
   </h3>
   <% if (sitewait.length) { %>
     <% _.each(sitewait, function(issue) { %>