Merge pull request ezsystems#826 from ezsystems/ezp-27113-subitem_edi…

…t_button

EZP-27113: Add edit button to sub-item list

Resources/config/yui.yml

@@ -484,6 +484,7 @@ system:
                         - 'subitemlistitemview-ez-template'
                         - 'subitemlistitem-name-ez-template'
                         - 'subitemlistitem-priority-ez-template'
+                        - 'ez-draftconflict'
                     path: "%ez_platformui.public_dir%/js/views/subitem/ez-subitemlistitemview.js"
                 subitemlistitemview-ez-template:
                     type: 'template'

Resources/public/css/theme/views/subitem/listitem.css

@@ -110,3 +110,7 @@
     color: #fff;
     font-weight: bold;
 }
+
+.ez-view-subitemlistitemview .ez-subitemlistitem-edit:before {
+    content: "\e606";
+}

Resources/public/js/views/subitem/ez-subitemlistitemview.js

@@ -23,7 +23,7 @@ YUI.add('ez-subitemlistitemview', function (Y) {
      * @constructor
      * @extends eZ.TemplateBasedView
      */
-    Y.eZ.SubitemListItemView = Y.Base.create('subitemListItemView', Y.eZ.TemplateBasedView, [Y.eZ.TranslateProperty], {
+    Y.eZ.SubitemListItemView = Y.Base.create('subitemListItemView', Y.eZ.TemplateBasedView, [Y.eZ.TranslateProperty, Y.eZ.DraftConflict], {
         events: {
             '.ez-subitemlistitem-priority': {
                 'mouseover': '_displayEditIcon',
@@ -40,6 +40,9 @@ YUI.add('ez-subitemlistitemview', function (Y) {
             '.ez-subitem-priority-form': {
                 'submit': '_setPriority'
             },
+            '.ez-subitemlistitem-edit': {
+                'tap': '_editContent',
+            },
         },
 
         initializer: function () {
@@ -365,7 +368,7 @@ YUI.add('ez-subitemlistitemview', function (Y) {
          */
         _validatePriority: function () {
             var validity;
-            
+
             if ( this.get('editingPriority') ) {
                 validity = this._getPriorityInput().get('validity');
 
@@ -396,6 +399,18 @@ YUI.add('ez-subitemlistitemview', function (Y) {
         _getPriorityInput: function (inputId) {
             return this.get('container').one('.ez-subitem-priority-input');
         },
+
+        /**
+         * Edits the content by sending an edit content request
+         *
+         * @method _editContent
+         */
+        _editContent: function () {
+            this._fireEditContentRequest(
+                this.get('location').get('contentInfo'),
+                this.get('contentType')
+            );
+        },
     }, {
          ATTRS: {
             /**

Resources/public/templates/subitem/listitem.hbt

@@ -5,3 +5,8 @@
         <td class="{{ class }}">{{ value }}</td>
     {{/if}}
 {{/each}}
+<td class="ez-subitemlistitem-cell">
+    <button class="ez-subitemlistitem-edit ez-font-icon pure-button ez-button">
+        {{translate 'subitem.listitem.edit' 'subitem'}}
+    </button>
+</td>

Resources/public/templates/subitem/listmore.hbt

@@ -8,6 +8,7 @@
                 {{ name }}
             </th>
             {{/each}}
+            <th class="ez-subitem-column-head ez-subitem-edit-column"></th>
         </tr>
         </thead>
         <tbody class="ez-subitemlist-content ez-loadmorepagination-content"></tbody>

Resources/translations/subitem.en.xlf

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <xliff xmlns="urn:oasis:names:tc:xliff:document:1.2" xmlns:jms="urn:jms:translation" version="1.2">
-  <file date="2017-01-31T10:50:08Z" source-language="en" target-language="en" datatype="plaintext" original="not.available">
+  <file date="2017-03-22T16:01:33Z" source-language="en" target-language="en" datatype="plaintext" original="not.available">
     <header>
       <tool tool-id="JMSTranslationBundle" tool-name="JMSTranslationBundle" tool-version="1.1.0-DEV"/>
       <note>The source node in most cases contains the sample message as written by the developer. If it looks like a dot-delimitted string such as "form.label.firstname", then the developer has not provided a default message.</note>
@@ -74,6 +74,12 @@
         <note>key: subitem.last</note>
         <jms:reference-file>Resources/public/templates/subitem/list.hbt</jms:reference-file>
       </trans-unit>
+      <trans-unit id="e85e98a7e031974c2dc497b926158e893a366f56" resname="subitem.listitem.edit">
+        <source>Edit</source>
+        <target>Edit</target>
+        <note>key: subitem.listitem.edit</note>
+        <jms:reference-file>Resources/public/templates/subitem/listitem.hbt</jms:reference-file>
+      </trans-unit>
       <trans-unit id="c9196a19ae958da788cf0b5fbb4e0fb6451ebdf2" resname="subitem.next">
         <source>Next</source>
         <target>Next</target>

Tests/js/views/ez-searchlistview.html

@@ -60,13 +60,17 @@
                 fullpath: "../../../../Resources/public/js/extensions/ez-loadmorepagination.js"
             },
             "ez-subitemlistitemview": {
-                requires: ['ez-templatebasedview', 'ez-translateproperty'],
+                requires: ['ez-templatebasedview', 'ez-translateproperty', 'ez-draftconflict'],
                 fullpath: "../../../../Resources/public/js/views/subitem/ez-subitemlistitemview.js"
             },
             "ez-translateproperty": {
                 requires: ['base', 'array-extras'],
                 fullpath: "../../../../Resources/public/js/extensions/ez-translateproperty.js"
             },
+            'ez-draftconflict': {
+                requires: ['view'],
+                fullpath: '../../../../Resources/public/js/extensions/ez-draftconflict.js'
+            },
             "ez-templatebasedview": {
                 requires: ['ez-view', 'handlebars', 'template'],
                 fullpath: "../../../Resources/public/js/views/ez-templatebasedview.js"

Tests/js/views/subitem/assets/ez-subitemlistitemview-tests.js

@@ -3,7 +3,7 @@
  * For full copyright and license information view LICENSE file distributed with this source code.
  */
 YUI.add('ez-subitemlistitemview-tests', function (Y) {
-    var renderTest, propertiesTest, priorityUpdateTest,
+    var renderTest, propertiesTest, priorityUpdateTest, editTest,
         Assert = Y.Assert, Mock = Y.Mock;
 
     function createModelMock(name) {
@@ -367,7 +367,7 @@ YUI.add('ez-subitemlistitemview-tests', function (Y) {
                     vars.contentType,
                     "The contentType should be available in the template"
                 );
-                
+
                 return rendered;
             }, this));
             this.view.get('availableProperties')[attr] = {
@@ -628,8 +628,87 @@ YUI.add('ez-subitemlistitemview-tests', function (Y) {
         },
     });
 
+    editTest = new Y.Test.Case({
+        name: "eZ Subitem List View edit test",
+
+        _createModelMock: createModelMock,
+
+        setUp: function () {
+            this._createModelMock('location');
+            this._createModelMock('content');
+            this._createModelMock('contentType');
+            this.languageCode = "fre-FR";
+            this.contentInfoMock = new Mock();
+
+            Mock.expect(this.contentInfoMock, {
+                method: 'get',
+                args: ['mainLanguageCode'],
+                returns: this.languageCode,
+            });
+
+            Mock.expect(this.location, {
+                method: 'get',
+                args: ['contentInfo'],
+                returns: this.contentInfoMock,
+            });
+
+            this.view = new Y.eZ.SubitemListItemView({
+                container: '.container',
+                location: this.location,
+                content: this.content,
+                contentType: this.contentType,
+                displayedProperties: [],
+            });
+            this.view.render();
+        },
+
+        tearDown: function () {
+            this.view.destroy();
+            delete this.view;
+        },
+
+        'Should fire `editContentRequest` when edit button is clicked': function () {
+            var editButton,
+                eventFired = false;
+
+            editButton = this.view.get('container').one('.ez-subitemlistitem-edit');
+
+            this.view.on('editContentRequest', Y.bind(function (e) {
+                eventFired = true;
+
+                Assert.areSame(
+                    this.contentInfoMock,
+                    e.contentInfo,
+                    "The contentInfo provided by the event should be the same."
+                );
+                Assert.areSame(
+                    this.languageCode,
+                    e.languageCode,
+                    "The languageCode provided by the event should be the same."
+                );
+                Assert.areSame(
+                    this.contentType,
+                    e.contentType,
+                    "The contentType provided by the event should be the same."
+                );
+            }, this));
+
+            editButton.simulateGesture('tap', Y.bind(function () {
+                this.resume(function (e) {
+                    Assert.isTrue(
+                        eventFired,
+                        "The `editContentRequest` event should have been fired"
+                    );
+                });
+            }, this));
+            this.wait();
+        },
+    });
+
+
     Y.Test.Runner.setName("eZ Subitem List View tests");
     Y.Test.Runner.add(renderTest);
     Y.Test.Runner.add(propertiesTest);
     Y.Test.Runner.add(priorityUpdateTest);
+    Y.Test.Runner.add(editTest);
 }, '', {requires: ['test', 'template', 'handlebars', 'node-event-simulate', 'ez-subitemlistitemview']});

Tests/js/views/subitem/ez-subitemlistitemview.html

@@ -14,6 +14,7 @@
         <td class="{{ class }}">{{ value }}</td>
     {{/if}}
 {{/each}}
+<button class="ez-subitemlistitem-edit">edit</button>
 </script>
 
 <script type="text/x-handlebars-template" id="priority-tpl">
@@ -52,9 +53,20 @@
         filter: loaderFilter,
         modules: {
             "ez-subitemlistitemview": {
-                requires: ['ez-templatebasedview', 'ez-translateproperty', 'event-tap', 'event-valuechange', 'template'],
+                requires: [
+                    'ez-templatebasedview',
+                    'ez-translateproperty',
+                    'event-tap',
+                    'event-valuechange',
+                    'template',
+                    'ez-draftconflict',
+                ],
                 fullpath: "../../../../Resources/public/js/views/subitem/ez-subitemlistitemview.js"
             },
+            'ez-draftconflict': {
+                requires: ['view'],
+                fullpath: '../../../../Resources/public/js/extensions/ez-draftconflict.js'
+            },
             "ez-templatebasedview": {
                 requires: ['ez-view', 'handlebars', 'template'],
                 fullpath: "../../../../Resources/public/js/views/ez-templatebasedview.js"