promethee 3.0.2 → 4.0.0

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

@@ -8,8 +8,18 @@
       data: {
         type: 'blockquote',
         attributes: {
-          searchable_body: '<p>Edit me</p>',
-          searchable_author: ''
+          body: {
+            searchable: true,
+            translatable: true,
+            type: 'text',
+            value: '<p>Edit me</p>',
+          },
+          author: {
+            searchable: true,
+            translatable: false,
+            type: 'string',
+            value: ''
+          }
         }
       }
     })

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

@@ -1,14 +1,14 @@
 <script type="text/ng-template" id="promethee/components/blockquote/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>
     <small>Quotation marks are added automatically.</small>
   </div>
 
   <div class="form-group">
     <label class="label-control">Author</label>
-    <input ng-model="promethee.inspected.attributes.searchable_author" class="form-control" type="text"/>
+    <input ng-model="promethee.inspected.attributes.author.value" class="form-control" type="text"/>
   </div>
 
-  {{promethee.inspected.attributes.searchable_body | textContentFromHTML: 'distinctParagraphs' | numberOfWords}} words<br>
-  {{promethee.inspected.attributes.searchable_body | textContentFromHTML | numberOfCharacters}} characters
+  {{promethee.inspected.attributes.body.value | textContentFromHTML: 'distinctParagraphs' | numberOfWords}} words<br>
+  {{promethee.inspected.attributes.body.value | textContentFromHTML | numberOfCharacters}} characters
 </script>

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

@@ -1,10 +1,10 @@
 <script type="text/ng-template" id="promethee/components/blockquote/edit/move">
   <%= render 'promethee/edit/move.header', type: 'blockquote' %>
       <div class="row">
-        <div class="col-md-12 blockquote" ng-bind-html="component.attributes.searchable_body | htmlSafe"></div>
+        <div class="col-md-12 blockquote" ng-bind-html="component.attributes.body.value | htmlSafe"></div>
 
-        <div ng-show="component.attributes.searchable_author" class="col-xs-12 col-12">
-          <p class="author">{{component.attributes.searchable_author}}</p>
+        <div ng-show="component.attributes.author.value" class="col-xs-12 col-12">
+          <p class="author">{{component.attributes.author.value}}</p>
         </div>
       </div>
     </div>

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

@@ -1,29 +1,29 @@
 <script type="text/ng-template" id="promethee/components/blockquote/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>Body</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">
         <div class="form-group">
-          <label class="label-control">Body</label>
-          <summernote config="summernoteConfig" ng-model="component.attributes.searchable_body"></summernote>
+          <b>Body</b>
+          <summernote config="summernoteConfig" ng-model="component.attributes.body.value"></summernote>
         </div>
       </div>
     </div>
   </div>
 
-  <div class="row" ng-show="master.attributes.searchable_author">
+  <div class="row" ng-show="master.attributes.author.value">
     <div class="col-md-6">
       <b>Author</b>
-      <p>{{master.attributes.searchable_author}}</p>
+      <p>{{master.attributes.author.value}}</p>
     </div>
     <div class="col-md-6">
       <div class="form-group">
-        <label class="label-control">Author</label>
-        <input class="form-control" ng-model="component.attributes.searchable_author" type="text">
+        <b>Author</b>
+        <input class="form-control" ng-model="component.attributes.author.value" type="text">
       </div>
     </div>
   </div>

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

@@ -1,11 +1,11 @@
 <%
-  body = component[:attributes][:searchable_body].to_s
-  author = component[:attributes][:searchable_author].to_s
+  body = component[:attributes].dig(:body, :value)&.to_s&.html_safe
+  author = component[:attributes].dig(:author, :value)&.to_s
 %>
 
 <div class="row <%= promethee_class_for(component) %>">
   <div class="col-md-12">
-    <div class="blockquote"><%= body.html_safe %></div>
+    <div class="blockquote"><%= body %></div>
     <% if author.present? %>
       <p class="author"><%= author %></p>
     <% end %>

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

@@ -8,7 +8,18 @@
       data: {
         type: 'collection',
         attributes: {
-          items_per_line: 6
+          items_per_line: {
+            collection: [
+              { label: '2', value: 2 },
+              { label: '3', value: 3 },
+              { label: '4', value: 4 },
+              { label: '6', value: 6 }
+            ],
+            searchable: false,
+            translatable: false,
+            type: 'enum',
+            value: 6
+          }
         },
         children: []
       }

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

@@ -3,16 +3,16 @@
     <label class="label-control">Items per line (on desktop):</label>
     <div class="row">
       <div class="col-xs-2 col-2">
-        <input ng-model="promethee.inspected.attributes.items_per_line" type="radio" ng-value="2"> 2
+        <input ng-model="promethee.inspected.attributes.items_per_line.value" type="radio" ng-value="2"> 2
       </div>
       <div class="col-xs-2 col-2">
-        <input ng-model="promethee.inspected.attributes.items_per_line" type="radio" ng-value="3"> 3
+        <input ng-model="promethee.inspected.attributes.items_per_line.value" type="radio" ng-value="3"> 3
       </div>
       <div class="col-xs-2 col-2">
-        <input ng-model="promethee.inspected.attributes.items_per_line" type="radio" ng-value="4"> 4
+        <input ng-model="promethee.inspected.attributes.items_per_line.value" type="radio" ng-value="4"> 4
       </div>
       <div class="col-xs-2 col-2">
-        <input ng-model="promethee.inspected.attributes.items_per_line" type="radio" ng-value="6"> 6
+        <input ng-model="promethee.inspected.attributes.items_per_line.value" type="radio" ng-value="6"> 6
       </div>
     </div>
   </div>

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

@@ -20,7 +20,7 @@
     Object.defineProperties($scope, {
       itemsPerLine: {
         get: function() {
-          return $scope.component.attributes.items_per_line;
+          return $scope.component.attributes.items_per_line.value;
         }
       },
       size: {

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

@@ -1,3 +1,2 @@
 <script type="text/ng-template" id="promethee/components/collection/localize">
-
 </script>

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

@@ -1,6 +1,5 @@
 <%
-  title = component[:attributes][:searchable_title]
-  items_per_line = component[:attributes][:items_per_line]
+  items_per_line = component[:attributes].dig(:items_per_line, :value)
   case items_per_line
   when 6
     col_classes = "col-md-2 col-sm-4 col-xs-6 col-6"

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

@@ -8,14 +8,36 @@
       data: {
         type: 'collection_item',
         attributes: {
-          searchable_caption: "",
-          media_type: "image",
+          caption: {
+            searchable: true,
+            translatable: true,
+            type: 'text',
+            value: ''
+          },
+          media_type: {
+            collection: [
+              { label: 'Image', value: 'image' },
+              { label: 'Video', value: 'video' }
+            ],
+            searchable: false,
+            translatable: false,
+            type: 'enum',
+            value: 'image'
+          },
           image: {
-            id: undefined,
-            name: ""
+            searchable: false,
+            translatable: false,
+            type: 'blob',
+            value: {
+              id: undefined,
+              name: ''
+            }
           },
           video: {
-            url: "https://vimeo.com/115082758"
+            searchable: false,
+            translatable: true,
+            type: 'video',
+            value: 'https://vimeo.com/115082758'
           }
         }
       }

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

@@ -2,23 +2,23 @@
   <div class="form-group">
     <label class="label-control">Media type</label>
     <div>
-      <label class="radio-inline"> <input ng-model="promethee.inspected.attributes.media_type" type="radio" value="image" />Image </label>
-      <label class="radio-inline"> <input ng-model="promethee.inspected.attributes.media_type" type="radio" value="video" />Video </label>
+      <label class="radio-inline"> <input ng-model="promethee.inspected.attributes.media_type.value" type="radio" value="image" />Image </label>
+      <label class="radio-inline"> <input ng-model="promethee.inspected.attributes.media_type.value" type="radio" value="video" />Video </label>
     </div>
   </div>
 
-  <promethee-uploader ng-show="promethee.inspected.attributes.media_type == 'image'" ng-model="promethee.inspected.attributes.image" label="Image" limits="'.jpg,.jpeg,.png,.gif'"></promethee-uploader>
+  <promethee-uploader ng-show="promethee.inspected.attributes.media_type.value == 'image'" ng-model="promethee.inspected.attributes.image.value" label="Image" limits="'.jpg,.jpeg,.png,.gif'"></promethee-uploader>
 
-  <div class="form-group" ng-show="promethee.inspected.attributes.media_type == 'video'">
+  <div class="form-group" ng-show="promethee.inspected.attributes.media_type.value == 'video'">
     <label class="label-control">Video URL</label>
-    <input class="form-control" ng-model="promethee.inspected.attributes.video.url"></summernote>
+    <input class="form-control" ng-model="promethee.inspected.attributes.video.value"></summernote>
   </div>
 
   <div class="row">
     <div class="col-xs-12 col-12">
       <div class="form-group">
         <label class="label-control">Caption</label>
-        <summernote config="summernoteConfig" ng-model="promethee.inspected.attributes.searchable_caption"></summernote>
+        <summernote config="summernoteConfig" ng-model="promethee.inspected.attributes.caption.value"></summernote>
       </div>
     </div>
   </div>

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

@@ -3,8 +3,8 @@
       <div class="header">Collection Item</div>
       <div class="row">
         <div class="col-xs-12 col-12">
-          <img ng-show="component.attributes.media_type == 'image'" ng-src="{{ component.attributes.image.id ? '/promethee/blob/' + component.attributes.image.id : '#' }}" class="img-fluid img-responsive">
-          <div ng-show="component.attributes.media_type == 'video'" ng-controller="CollectionItemVideoController">
+          <img ng-show="component.attributes.media_type.value == 'image'" ng-src="{{ component.attributes.image.value.id ? '/promethee/blob/' + component.attributes.image.value.id : '#' }}" class="img-fluid img-responsive">
+          <div ng-show="component.attributes.media_type.value == 'video'" ng-controller="CollectionItemVideoController">
             <div class="embed-responsive embed-responsive-16by9">
               <iframe ng-if="embed" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="allowfullscreen" ng-src="{{embed | urlSafe}}"></iframe>
               <div class="video-neutralizing-overlay"></div>
@@ -13,8 +13,8 @@
         </div>
       </div>
       <div class="row">
-        <div class="col-xs-12 col-12" ng-show="component.attributes.searchable_caption">
-          <div class="collection-item-caption" ng-bind-html="component.attributes.searchable_caption | htmlSafe"></div>
+        <div class="col-xs-12 col-12" ng-show="component.attributes.caption.value">
+          <div class="collection-item-caption" ng-bind-html="component.attributes.caption.value | htmlSafe"></div>
         </fiv>
       </div>
     </div>
@@ -26,7 +26,7 @@
     Object.defineProperty($scope, 'embed', {
       get: function() {
         var embed = null;
-        var url = this.component.attributes.video.url + '';
+        var url = this.component.attributes.video.value.value + '';
 
         if(url.includes('vimeo')) {
           var id = url.replace(/^(?:https?:)?\/\/(?:(?:www|player)\.)?vimeo\.com\/(?:video\/)?(\d+).*?$/, '$1');

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

@@ -1,26 +1,26 @@
 <script type="text/ng-template" id="promethee/components/collection_item/localize">
-  <div ng-show="master.attributes.searchable_caption !== '' || master.attributes.media_type == 'video'">
+  <div ng-show="master.attributes.caption.value !== '' || master.attributes.media_type.value == 'video'">
     <hr>
 
-    <div class="row" ng-show="master.attributes.searchable_caption !== ''">
+    <div class="row" ng-show="master.attributes.caption.value !== ''">
       <div class="col-md-6">
         <b>Collection Item Caption</b>
-        <div class="promethee-edit__wrapper" ng-bind-html="master.attributes.searchable_caption | htmlSafe"></div>
+        <div class="promethee-edit__wrapper" ng-bind-html="master.attributes.caption.value | htmlSafe"></div>
       </div>
       <div class="col-md-6">
-        <label class="label-control">Collection Item Caption</label>
-        <summernote config="summernoteConfig" ng-model="component.attributes.searchable_caption"></summernote>
+        <b>Collection Item Caption</b>
+        <summernote config="summernoteConfig" ng-model="component.attributes.caption.value"></summernote>
       </div>
     </div>
 
-    <div class="row" ng-show="master.attributes.media_type == 'video'">
+    <div class="row" ng-show="master.attributes.media_type.value == 'video'">
       <div class="col-md-6">
         <b>Video URL</b>
-        <div ng-bind-html="master.attributes.video.url | htmlSafe"></div>
+        <div ng-bind-html="master.attributes.video.value | htmlSafe"></div>
       </div>
       <div class="col-md-6">
-        <label class="label-control">Video URL</label>
-        <input class="form-control" ng-model="component.attributes.video.url" type="text">
+        <b>Video URL</b>
+        <input class="form-control" ng-model="component.attributes.video.value" type="text">
       </div>
     </div>
   </div>

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

@@ -1,11 +1,11 @@
 <%
-searchable_caption = component[:attributes][:searchable_caption]
-media_type = component[:attributes][:media_type]
+caption = component[:attributes].dig(:caption, :value)&.to_s&.html_safe
+media_type = component[:attributes].dig(:media_type, :value)&.to_s
 case media_type
 when 'image'
-  image_blob = blob_from_data component[:attributes][:image]
+  image_blob = blob_from_data component[:attributes][:image][:value]
 when 'video'
-  url = component[:attributes][:video][:url].to_s
+  url = component[:attributes][:video][:value].to_s
   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"
@@ -24,7 +24,7 @@ end
     <iframe frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="allowfullscreen" src="<%= iframe_src %>"></iframe>
   </div>
   <% elsif image_blob.present? %>
-  <%= render 'promethee/show/image.srcset', blob: image_blob, alt: '', caption: searchable_caption %>
+  <%= render 'promethee/show/image.srcset', blob: image_blob, alt: '', caption: caption %>
   <% end %>
-  <%= searchable_caption.to_s.html_safe %>
-</div>
+  <%= caption %>
+</div>

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

@@ -8,17 +8,67 @@
       data: {
         type: 'column',
         attributes: {
-          size: 4,
-          offset: 0,
+          size: {
+            searchable: false,
+            translatable: false,
+            type: 'integer',
+            value: 4
+          },
+          offset: {
+            searchable: false,
+            translatable: false,
+            type: 'integer',
+            value: 0
+          },
           mobile: {
-            enabled: false,
-            size: 12,
-            offset: 0
+            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: {
-            enabled: false,
-            size: 12,
-            offset: 0
+            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: []

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

@@ -8,8 +8,8 @@
 
   <b>Desktop</b>
   <div class="form-group">
-    <label  class="label-control">Size: {{promethee.inspected.attributes.size}}</label><br/>
-    <input  ng-model="promethee.inspected.attributes.size"
+    <label  class="label-control">Size: {{promethee.inspected.attributes.size.value}}</label><br/>
+    <input  ng-model="promethee.inspected.attributes.size.value"
             type="range"
             class="btn-block"
             list="tickmarks"
@@ -17,24 +17,24 @@
             max="12">
   </div>
   <div class="form-group">
-    <label  class="label-control">Offset: {{promethee.inspected.attributes.offset}}</label><br/>
-    <offset-input ng-model="promethee.inspected.attributes.offset"
-                  ng-max="12 - promethee.inspected.attributes.size">
+    <label  class="label-control">Offset: {{promethee.inspected.attributes.offset.value}}</label><br/>
+    <offset-input ng-model="promethee.inspected.attributes.offset.value"
+                  ng-max="12 - promethee.inspected.attributes.size.value">
     </offset-input>
   </div>
 
   <%= render 'promethee/edit/inspect.advanced' %>
     <div class="form-group">
       <input  id="column_edit_inspect_tablet_enabled"
-              ng-model="promethee.inspected.attributes.tablet.enabled"
+              ng-model="promethee.inspected.attributes.tablet.value.enabled.value"
               type="checkbox" />
       <label  class="label-control"
               for="column_edit_inspect_tablet_enabled"> <b>Tablette</b></label>
     </div>
-    <div ng-show="promethee.inspected.attributes.tablet.enabled">
+    <div ng-show="promethee.inspected.attributes.tablet.value.enabled.value">
       <div class="form-group">
-        <label  class="label-control">Size: {{promethee.inspected.attributes.tablet.size}}</label><br/>
-        <input  ng-model="promethee.inspected.attributes.tablet.size"
+        <label  class="label-control">Size: {{promethee.inspected.attributes.tablet.value.size.value}}</label><br/>
+        <input  ng-model="promethee.inspected.attributes.tablet.value.size.value"
                 type="range"
                 class="btn-block"
                 list="tickmarks"
@@ -42,24 +42,24 @@
                 max="12">
       </div>
       <div class="form-group">
-        <label  class="label-control">Offset: {{promethee.inspected.attributes.tablet.offset}}</label><br/>
-        <offset-input ng-model="promethee.inspected.attributes.tablet.offset"
-                      ng-max="12 - promethee.inspected.attributes.tablet.size">
+        <label  class="label-control">Offset: {{promethee.inspected.attributes.tablet.value.offset.value}}</label><br/>
+        <offset-input ng-model="promethee.inspected.attributes.tablet.value.offset.value"
+                      ng-max="12 - promethee.inspected.attributes.tablet.value.size.value">
         </offset-input>
       </div>
     </div>
 
     <div class="form-group">
       <input  id="column_edit_inspect_mobile_enabled"
-              ng-model="promethee.inspected.attributes.mobile.enabled"
+              ng-model="promethee.inspected.attributes.mobile.value.enabled.value"
               type="checkbox" />
       <label  class="label-control"
               for="column_edit_inspect_mobile_enabled"> <b>Mobile</b></label>
     </div>
-    <div ng-show="promethee.inspected.attributes.mobile.enabled">
+    <div ng-show="promethee.inspected.attributes.mobile.value.enabled.value">
       <div class="form-group">
-        <label  class="label-control">Size: {{promethee.inspected.attributes.mobile.size}}</label><br/>
-        <input  ng-model="promethee.inspected.attributes.mobile.size"
+        <label  class="label-control">Size: {{promethee.inspected.attributes.mobile.value.size.value}}</label><br/>
+        <input  ng-model="promethee.inspected.attributes.mobile.value.size.value"
                 type="range"
                 class="btn-block"
                 list="tickmarks"
@@ -67,9 +67,9 @@
                 max="12">
       </div>
       <div class="form-group">
-        <label  class="label-control">Offset: {{promethee.inspected.attributes.mobile.offset}}</label><br/>
-        <offset-input ng-model="promethee.inspected.attributes.mobile.offset"
-                      ng-max="12 - promethee.inspected.attributes.mobile.size">
+        <label  class="label-control">Offset: {{promethee.inspected.attributes.mobile.value.offset.value}}</label><br/>
+        <offset-input ng-model="promethee.inspected.attributes.mobile.value.offset.value"
+                      ng-max="12 - promethee.inspected.attributes.mobile.value.size.value">
         </offset-input>
       </div>
     </div>