xhtml_style: set the "changed" flag when gadget notifies changes

This way the "you have unsaved changes" pops up also when navigating
away after changing gadget content.

bt5/erp5_ui_test/PathTemplateItem/portal_tests/gadget_field_zuite/testSaveAndLoad.zpt

@@ -61,6 +61,12 @@
 </tr>
 
 
+<!-- the flag used in erp5.js to warn unsaved changes is initially not set -->
+<tr>
+  <td>assertEval</td>
+  <td>selenium.browserbot.currentWindow.changed</td>
+  <td>false</td>
+</tr>
 
 <tr>
   <td>type</td>
@@ -68,6 +74,12 @@
   <td>123</td>
 </tr>
 
+<!-- the flag used in erp5.js to warn unsaved changes is set after gadget is changed -->
+<tr>
+  <td>waitForEval</td>
+  <td>selenium.browserbot.currentWindow.changed</td>
+  <td>true</td>
+</tr>
 
 
 <tr>

bt5/erp5_ui_test/SkinTemplateItem/portal_skins/erp5_ui_test/gadget_textareafield.js.js

@@ -4,13 +4,16 @@
   "use strict";
 
   rJS(window)
+    .declareAcquiredMethod('notifyChange', 'notifyChange')
     .declareMethod('render', function (options) {
       this.element.firstChild.value = options.value || "";
       this.element.firstChild.title = options.key;
       this.element.firstChild.setAttribute('data-name',
                                            options.key || "");
     })
-
+    .onEvent('change', function () {
+      return this.notifyChange();
+    })
     .declareMethod('getContent', function () {
       var input = this.element.firstChild,
         form_gadget = this,

product/ERP5/bootstrap/erp5_xhtml_style/SkinTemplateItem/portal_skins/erp5_xhtml_style/erp5_gadgetfield.js.js

@@ -74,6 +74,8 @@
     /////////////////////////////////////////////////////////////////
     .allowPublicAcquisition('notifyChange',
                             function () {
+       // This flag is used for erp5.js's onBeforeUnload warning for unsaved changes.
+        window.changed = true;
         return;
       })