promethee 3.0.2 → 4.0.0

data/app/views/promethee/components/table_cell/_edit.define.html.erb

@@ -0,0 +1,22 @@
+<%
+  init = <<~JAVASCRIPT
+    promethee.definitions.push({
+      name: 'Table cell',
+      icon: #{ promethee_component_render_icon 'table_cell' },
+      position: 60,
+      library: false,
+      data: {
+        type: 'table_cell',
+        attributes: {
+          text: {
+            searchable: true,
+            translatable: true,
+            type: 'string',
+            value: ''
+          }
+        }
+      }
+    })
+  JAVASCRIPT
+%>
+<div ng-init="<%= init %>"></div>

data/app/views/promethee/components/table_cell/_icon.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="500" height="500" viewBox="0 0 500 500">
+  <image id="Objet_dynamique_vectoriel" data-name="Objet dynamique vectoriel" x="72" y="113" width="355" height="274" xlink:href="data:img/png;base64,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"/>
+</svg>

data/app/views/promethee/components/table_cell/_localize.html.erb

@@ -0,0 +1,14 @@
+<script type="text/ng-template" id="promethee/components/table_cell/localize">
+  <div ng-show="master.attributes.text.value !== ''">
+    <div class="row mt-2" ng-show="master.attributes.text.value !== ''">
+      <div class="col-md-6">
+        <b>Text</b>
+        <p>{{ master.attributes.text.value }}</p>
+      </div>
+      <div class="col-md-6">
+        <b>Text</b>
+        <input class="form-control" ng-model="component.attributes.text.value" type="text">
+      </div>
+    </div>
+  </div>
+</script>

data/app/views/promethee/components/text/_edit.define.html.erb

@@ -8,7 +8,12 @@
       data: {
         type: 'text',
         attributes: {
-          searchable_body: '<p>Edit me</p>'
+          body: {
+            searchable: true,
+            translatable: true,
+            type: 'text',
+            value: '<p>Edit me</p>'
+          }
         }
       }
     })

data/app/views/promethee/components/text/_edit.inspect.html.erb

@@ -1,8 +1,8 @@
 <script type="text/ng-template" id="promethee/components/text/edit/inspect">
   <div class="form-group">
-    <summernote config="summernoteConfig" ng-model="promethee.inspected.attributes.searchable_body"></summernote>
+    <summernote config="summernoteConfig" ng-model="promethee.inspected.attributes.body.value"></summernote>
   </div>
 
-  {{promethee.inspected.attributes.searchable_body | textContentFromHTML | numberOfWords}} words<br>
-  {{promethee.inspected.attributes.searchable_body | textContentFromHTML | numberOfCharacters}} characters
+  {{promethee.inspected.attributes.body.value | textContentFromHTML | numberOfWords}} words<br>
+  {{promethee.inspected.attributes.body.value | textContentFromHTML | numberOfCharacters}} characters
 </script>

data/app/views/promethee/components/text/_edit.move.html.erb

@@ -1,6 +1,6 @@
 <script type="text/ng-template" id="promethee/components/text/edit/move">
   <%= render 'promethee/edit/move.header', type: 'text' %>
-      <div ng-bind-html="component.attributes.searchable_body | htmlSafe"></div>
+      <div ng-bind-html="component.attributes.body.value | htmlSafe"></div>
     </div>
   </div>
 </script>

data/app/views/promethee/components/text/_localize.html.erb

@@ -1,14 +1,14 @@
 <script type="text/ng-template" id="promethee/components/text/localize">
-  <div ng-show="master.attributes.searchable_body">
+  <div ng-show="master.attributes.body.value">
     <hr>
     <div class="row">
       <div class="col-md-6">
         <b>Text</b>
-        <div ng-bind-html="master.attributes.searchable_body | htmlSafe"></div>
+        <div ng-bind-html="master.attributes.body.value | htmlSafe"></div>
       </div>
       <div class="col-md-6">
         <b>Text</b>
-        <summernote config="summernoteConfig" ng-model="component.attributes.searchable_body"></summernote>
+        <summernote config="summernoteConfig" ng-model="component.attributes.body.value"></summernote>
       </div>
     </div>
   </div>

data/app/views/promethee/components/text/_show.html.erb

@@ -1,6 +1,6 @@
 <%
-searchable_body = component[:attributes][:searchable_body].to_s
+body = component[:attributes].dig(:body, :value)&.to_s&.html_safe
 %>
 <div class="<%= promethee_class_for component %>">
-  <%= searchable_body.html_safe %>
+  <%= body %>
 </div>

data/app/views/promethee/components/video/_edit.define.html.erb

@@ -8,8 +8,18 @@
       data: {
         type: 'video',
         attributes: {
-          url: 'https://vimeo.com/115082758',
-          autoplay: false
+          url: {
+            searchable: false,
+            translatable: true,
+            type: 'string',
+            value: 'https://vimeo.com/115082758'
+          },
+          autoplay: {
+            searchable: false,
+            translatable: false,
+            type: 'boolean',
+            value: false
+          }
         }
       }
     })

data/app/views/promethee/components/video/_edit.inspect.html.erb

@@ -1,11 +1,11 @@
 <script type="text/ng-template" id="promethee/components/video/edit/inspect">
   <div class="form-group">
     <label class="label-control">Url</label>
-    <input ng-model="promethee.inspected.attributes.url" class="form-control" type="text" />
+    <input ng-model="promethee.inspected.attributes.url.value" class="form-control" type="text" />
   </div>
 
   <div class="form-group">
-    <input ng-model="promethee.inspected.attributes.autoplay" type="checkbox" />
+    <input ng-model="promethee.inspected.attributes.autoplay.value" type="checkbox" />
     <label class="label-control"> Autoplay</label>
   </div>
 </script>

data/app/views/promethee/components/video/_edit.move.html.erb

@@ -2,11 +2,11 @@
   <%= render 'promethee/edit/move.header', type: 'video' %>
       <div ng-controller="VideoController">
         <div class="embed-responsive embed-responsive-16by9">
-          <iframe ng-if="embed" 
-                  frameborder="0" 
-                  webkitallowfullscreen="" 
-                  mozallowfullscreen="" 
-                  allowfullscreen="allowfullscreen" 
+          <iframe ng-if="embed"
+                  frameborder="0"
+                  webkitallowfullscreen=""
+                  mozallowfullscreen=""
+                  allowfullscreen="allowfullscreen"
                   ng-src="{{embed | urlSafe}}"></iframe>
           <div class="video-neutralizing-overlay"></div>
         </div>
@@ -20,7 +20,7 @@
     Object.defineProperty($scope, 'embed', {
       get: function() {
         var embed = null;
-        var url = this.component.attributes.url + '';
+        var url = this.component.attributes.url.value + '';
 
         if(url.includes('vimeo')) {
           var id = url.replace(/^(?:https?:)?\/\/(?:(?:www|player)\.)?vimeo\.com\/(?:video\/)?(\d+).*?$/, '$1');

data/app/views/promethee/components/video/_localize.html.erb

@@ -1,15 +1,15 @@
 <script type="text/ng-template" id="promethee/components/video/localize">
-  <div ng-show="master.attributes.url !== ''">
+  <div ng-show="master.attributes.url.value !== ''">
     <hr>
     <div class="row">
       <div class="col-md-6">
         <b>URL</b>
-        <div ng-bind-html="master.attributes.url | htmlSafe"></div>
+        <div ng-bind-html="master.attributes.url.value | htmlSafe"></div>
       </div>
       <div class="col-md-6">
         <div class="form-group">
-          <label class="label-control">URL</label>
-          <input class="form-control" ng-model="component.attributes.url" type="text">
+          <b>URL</b>
+          <input class="form-control" ng-model="component.attributes.url.value" type="text">
         </div>
       </div>
     </div>

data/app/views/promethee/components/video/_show.html.erb

@@ -1,14 +1,15 @@
 <%
-url = component[:attributes][:url].to_s
+url = component[:attributes].dig(:url, :value)&.to_s
+autoplay = component[:attributes].dig(:autoplay, :value)
 
 if 'vimeo'.in? url
   video_id = url.gsub(/\A(?:https?:)?\/\/(?:(?:www|player)\.)?vimeo\.com\/(?:video\/)?(\d+).*?\z/, '\1')
   iframe_src = "https://player.vimeo.com/video/#{video_id}?color=ffffff&title=0&byline=0&portrait=0"
-  iframe_src += "&loop=1&autoplay=1&autopause=0&muted=1" if component[:attributes][:autoplay]
+  iframe_src += "&loop=1&autoplay=1&autopause=0&muted=1" if autoplay
 elsif 'youtube'.in? url
   video_id = url.split('watch?v=').last
   iframe_src = "https://www.youtube.com/embed/#{video_id}"
-  iframe_src += "?autoplay=1&mute=1&loop=1" if component[:attributes][:autoplay]
+  iframe_src += "?autoplay=1&mute=1&loop=1" if autoplay
 else
   iframe_src = url
 end

data/app/views/promethee/presets/_image-with-text.html.erb

@@ -7,27 +7,192 @@
       {
         "type": "row",
         "attributes": {
-          "bgcolor": "rgba(255,255,255,0)",
-          "backgrounds": []
+          bgcolor: {
+            searchable: false,
+            translatable: false,
+            type: 'color',
+            value: "rgba(255,255,255,0)",
+          },
+          backgrounds: {
+            searchable: false,
+            translatable: false,
+            type: 'array',
+            value: []
+          }
         },
         "children": [
           {
             "type": "column",
-            "attributes": {"size": 4, "offset": 0},
+            "attributes": {
+              size: {
+                searchable: false,
+                translatable: false,
+                type: 'integer',
+                value: 4
+              },
+              offset: {
+                searchable: false,
+                translatable: false,
+                type: 'integer',
+                value: 0
+              },
+              mobile: {
+                searchable: false,
+                translatable: false,
+                type: 'hash',
+                value: {
+                  enabled: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'boolean',
+                    value: false
+                  },
+                  size: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 12
+                  },
+                  offset: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 0
+                  }
+                }
+              },
+              tablet: {
+                searchable: false,
+                translatable: false,
+                type: 'hash',
+                value: {
+                  enabled: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'boolean',
+                    value: false
+                  },
+                  size: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 12
+                  },
+                  offset: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 0
+                  }
+                }
+              }
+            },
             "children": [
               {
                 "type": "image",
-                "attributes": {"id": undefined, "name": ''}
+                "attributes": {
+                  image: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'blob',
+                    value: {
+                      id: undefined,
+                      name: ''
+                    }
+                  },
+                  alt: {
+                    searchable: true,
+                    translatable: true,
+                    type: 'string',
+                    value: ''
+                  },
+                  caption: {
+                    searchable: true,
+                    translatable: true,
+                    type: 'string',
+                    value: ''
+                  }
+                }
               }
             ]
           },
           {
             "type": "column",
-            "attributes": {"size": 8, "offset": 0},
+            "attributes": {
+              size: {
+                searchable: false,
+                translatable: false,
+                type: 'integer',
+                value: 8
+              },
+              offset: {
+                searchable: false,
+                translatable: false,
+                type: 'integer',
+                value: 0
+              },
+              mobile: {
+                searchable: false,
+                translatable: false,
+                type: 'hash',
+                value: {
+                  enabled: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'boolean',
+                    value: false
+                  },
+                  size: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 12
+                  },
+                  offset: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 0
+                  }
+                }
+              },
+              tablet: {
+                searchable: false,
+                translatable: false,
+                type: 'hash',
+                value: {
+                  enabled: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'boolean',
+                    value: false
+                  },
+                  size: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 12
+                  },
+                  offset: {
+                    searchable: false,
+                    translatable: false,
+                    type: 'integer',
+                    value: 0
+                  }
+                }
+              }
+            },
             "children": [
               {
                 "type": "text",
-                "attributes": {"searchable_body": "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A dicta, est quos distinctio culpa! Quasi cupiditate, totam nulla reprehenderit animi iusto qui cumque culpa repellat eum sit? Debitis, laboriosam reiciendis!</p>"}
+                "attributes": {
+                  body: {
+                    searchable: true,
+                    translatable: true,
+                    type: 'text',
+                    value: '<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A dicta, est quos distinctio culpa! Quasi cupiditate, totam nulla reprehenderit animi iusto qui cumque culpa repellat eum sit? Debitis, laboriosam reiciendis!</p>'
+                  }
+                }
               }
             ]
           }

data/lib/promethee/data/localization.rb

@@ -25,16 +25,27 @@ class Promethee::Data::Localization < Promethee::Data
     @master_data.flat.each do |master_component|
       localized_component = find_localized_component master_component[:id]
       # We take the localized component if it exists, the master component otherwise
-      component = localized_component || master_component.except(:attributes)
+      component = localized_component || get_component_without_attributes_values(master_component)
       component[:attributes] ||= {}
       # We add it to the list of localized components
       @data[:components] << component
     end
   end
 
+  def get_component_without_attributes_values(component)
+    clean_component = component.deep_dup
+    clean_component[:attributes] = clean_component[:attributes].keep_if { |key, object_value|
+      object_value[:translatable]
+    }.map { |key, object_value|
+      [key, object_value.merge({ value: '' })]
+    }.to_h
+
+    clean_component
+  end
+
   def find_localized_component(id)
     return unless @data_before_merge
     return unless @data_before_merge.include? :components
     @data_before_merge[:components].find { |component| component[:id] == id }
   end
-end
+end