From 6560e775541c4f09667517ce842b1e45b8dae909 Mon Sep 17 00:00:00 2001
From: Fernando Blat <ferblape@gmail.com>
Date: Wed, 18 Jan 2017 13:37:11 +0100
Subject: [PATCH] Ask for confirmation when changing the page and the forms
 watched do have changes

---
 app/assets/javascripts/application.js         |  2 ++
 .../javascripts/watch_form_changes.js.coffee  | 31 +++++++++++++++++++
 .../legislation/draft_versions/_form.html.erb |  2 +-
 .../legislation/processes/_form.html.erb      |  2 +-
 .../legislation/questions/_form.html.erb      |  2 +-
 app/views/layouts/admin.html.erb              |  2 +-
 config/locales/en.yml                         |  2 ++
 config/locales/es.yml                         |  2 ++
 8 files changed, 41 insertions(+), 4 deletions(-)
 create mode 100644 app/assets/javascripts/watch_form_changes.js.coffee

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 939705c51..8cc51855f 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -54,6 +54,7 @@
 //= require legislation
 //= require legislation_allegations
 //= require legislation_annotatable
+//= require watch_form_changes
 //= require custom
 
 var initialize_modules = function() {
@@ -83,6 +84,7 @@ var initialize_modules = function() {
   App.Legislation.initialize();
   if ( $(".legislation-annotatable").length )
     App.LegislationAnnotatable.initialize();
+  App.WatchFormChanges.initialize();
 };
 
 $(function(){
diff --git a/app/assets/javascripts/watch_form_changes.js.coffee b/app/assets/javascripts/watch_form_changes.js.coffee
new file mode 100644
index 000000000..b5ef381a9
--- /dev/null
+++ b/app/assets/javascripts/watch_form_changes.js.coffee
@@ -0,0 +1,31 @@
+App.WatchFormChanges =
+  forms: ->
+    return $('form[data-watch-changes]')
+
+  msg: ->
+    if($('[data-watch-form-message]').length)
+      return $('[data-watch-form-message]').data('watch-form-message')
+
+  checkChanges: (event) ->
+    console.log(event)
+    changes = false
+    App.WatchFormChanges.forms().each ->
+      form = $(this)
+      if form.serialize() != form.data('watchChanges')
+        changes = true
+    if changes
+      return confirm(App.WatchFormChanges.msg())
+    else
+      return true
+
+  initialize: ->
+    if App.WatchFormChanges.forms().length == 0 || App.WatchFormChanges.msg() == undefined
+      return
+
+    $(document).off('page:before-change').on('page:before-change', (e) -> App.WatchFormChanges.checkChanges(e))
+
+    App.WatchFormChanges.forms().each ->
+      form = $(this)
+      form.data('watchChanges', form.serialize())
+
+    false
diff --git a/app/views/admin/legislation/draft_versions/_form.html.erb b/app/views/admin/legislation/draft_versions/_form.html.erb
index 8e79c0a56..1f221cd76 100644
--- a/app/views/admin/legislation/draft_versions/_form.html.erb
+++ b/app/views/admin/legislation/draft_versions/_form.html.erb
@@ -1,4 +1,4 @@
-<%= form_for [:admin, @process, @draft_version], url: url do |f| %>
+<%= form_for [:admin, @process, @draft_version], url: url, html: {data: {watch_changes: true}} do |f| %>
 
   <% if @draft_version.errors.any? %>
 
diff --git a/app/views/admin/legislation/processes/_form.html.erb b/app/views/admin/legislation/processes/_form.html.erb
index 06bcfd43c..8f8ee348f 100644
--- a/app/views/admin/legislation/processes/_form.html.erb
+++ b/app/views/admin/legislation/processes/_form.html.erb
@@ -1,4 +1,4 @@
-<%= form_for [:admin, @process] do |f| %>
+<%= form_for [:admin, @process], html: {data: {watch_changes: true}} do |f| %>
 
   <% if @process.errors.any? %>
 
diff --git a/app/views/admin/legislation/questions/_form.html.erb b/app/views/admin/legislation/questions/_form.html.erb
index cca5ca430..9608f3d7d 100644
--- a/app/views/admin/legislation/questions/_form.html.erb
+++ b/app/views/admin/legislation/questions/_form.html.erb
@@ -1,4 +1,4 @@
-<%= form_for [:admin, @process, @question], url: url do |f| %>
+<%= form_for [:admin, @process, @question], url: url, html: {data: {watch_changes: true}} do |f| %>
 
   <% if @question.errors.any? %>
 
diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb
index 95bcae3e3..0cb345830 100644
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -13,7 +13,7 @@
     <%= favicon_link_tag "favicon.ico" %>
   </head>
 
-  <body class="admin">
+  <body class="admin" data-watch-form-message="<%= I18n.t('layouts.admin.watch_form_message') %>">
     <div class="off-canvas-wrapper">
       <div class="off-canvas-wrapper-inner" data-off-canvas-wrapper>
         <div class="off-canvas position-left" id="offCanvas" data-off-canvas>
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 2f192cb0c..06fa86bb0 100755
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -218,6 +218,8 @@ en:
       see_all: See proposals
       budgets: Participatory budgeting
       spending_proposals: Spending Proposals
+    admin:
+      watch_form_message: 'You have unsaved changes. Do you confirm to leave the page?'
   legacy_legislation:
     help:
       alt: Select the text you want to comment and press the button with the pencil.
diff --git a/config/locales/es.yml b/config/locales/es.yml
index 7c418521f..3b44c35a8 100755
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -218,6 +218,8 @@ es:
       see_all: Ver propuestas
       budgets: Presupuestos ciudadanos
       spending_proposals: "Propuestas de inversión"
+    admin:
+      watch_form_message: 'Has realizado cambios que no han sido guardados. ¿Seguro que quieres abandonar la página?'
   legacy_legislation:
     help:
       alt: Selecciona el texto que quieres comentar y pulsa en el botón con el lápiz.