promethee 0.1.6 → 0.1.7

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 14fcd1ec2bd76b0e5a05757927c5fb38b292638c
-  data.tar.gz: 2fb7d856837d11869f7390ef44fc97985fa7da22
+  metadata.gz: edbf8c8f6f4faf5e23d93c3989cbab31908c2469
+  data.tar.gz: d35e771e4690ad8f9d07f20b1a14c59c0a7775f1
 SHA512:
-  metadata.gz: a2c4c4b361aa1e2e6a938127cfaa83c43a89adbee44969d3452b1e8ec9b110d386454671a35278c2c4910976578d59c4e083c563c141501cdef51334ed3d44fb
-  data.tar.gz: '0219cf7aa0bbc9f06c677966db46c4bfcf86c282731ecb9700f8abf02f196aafb281ebf30232271b499131368a3f7641c63cd48be40d8dcf75c5dc9c94b9c1f1'
+  metadata.gz: 67dfd501d49e2cf8d8c3cb142c884743a342859b6e330ec179ddba123f1a28f20808e861fe856d751f324aab0230c420cf3713d37dc61a1919bc249e9065d026
+  data.tar.gz: 5e8ea6705e07e64e62eed6df26b40c473f918bfb7c566ae20c98bdff021f766f0ceba70b78375f8b3a2159ab48500004dce52db035b694fe4fba3b6486241386

data/app/assets/javascripts/promethee-editor.js

@@ -5,4 +5,6 @@
 //= require angular
 //= require angular-animate
 //= require angular-ui-tinymce-rails
+//= require summernote
+//= require angular-summernote
 //= require_self

data/app/assets/stylesheets/promethee-editor.sass

@@ -1,6 +1,7 @@
 @import 'bootstrap'
 @import 'font-awesome.css'
 @import 'material_icons.css'
+@import 'summernote'
 
 $promethee-grey: #bbb
 $promethee-transparent-grey: transparentize($promethee-grey, .8)

data/app/views/promethee/_edit.html.erb

@@ -2,9 +2,26 @@
 data = data.to_json unless data.is_a? String
 %>
 
+<div id="promethee"
+     class="promethee-editor"
+     ng-app="Promethee"
+     ng-controller="PrometheeController as prometheeController"
+     ng-class="{
+       'promethee-editor--fullscreen': fullscreen,
+       'promethee-editor--move': move,
+       'promethee-editor--preview': preview
+     }">
+  <input type="hidden" name="page[data]" id="page_data" value="{{data}}" />
+  <%= render 'promethee/partials/include_components' %>
+  <%= render 'promethee/partials/navbar' %>
+  <%= render 'promethee/partials/preview' %>
+  <%= render 'promethee/partials/mover' %>
+  <%= render 'promethee/partials/page' %>
+</div>
+
 <script>
   var promethee = angular
-    .module('Promethee', ['ui.tinymce', 'ngAnimate'])
+    .module('Promethee', ['summernote', 'ngAnimate'])
     .value('data', <%= data.html_safe %>)
     .value('definitions', [])
     .filter('htmlSafe', ['$sce', function($sce) {
@@ -81,20 +98,3 @@ data = data.to_json unless data.is_a? String
   }]);
 
 </script>
-
-<div id="promethee"
-     class="promethee-editor"
-     ng-app="Promethee"
-     ng-controller="PrometheeController as prometheeController"
-     ng-class="{
-       'promethee-editor--fullscreen': fullscreen,
-       'promethee-editor--move': move,
-       'promethee-editor--preview': preview
-     }">
-  <input type="hidden" name="page[data]" id="page_data" value="{{data}}" />
-  <%= render 'promethee/partials/include_components' %>
-  <%= render 'promethee/partials/navbar' %>
-  <%= render 'promethee/partials/preview' %>
-  <%= render 'promethee/partials/mover' %>
-  <%= render 'promethee/partials/page' %>
-</div>

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

@@ -0,0 +1,49 @@
+<%
+data = data.to_json unless data.is_a? String
+master = master.to_json unless master.is_a? String
+%>
+
+<div id="prometheeLocalizer"
+     class="promethee-localizer"
+     ng-app="PrometheeLocalizer"
+     ng-controller="PrometheeLocalizerController as prometheeLocalizerController">
+  <input type="hidden" name="page[data]" id="page_data" value="{{data}}" />
+  <%= render 'promethee/partials/include_components' %>
+  <div ng-repeat="component in data.components">
+    <ng-include src="'promethee/components/' + component.type + '/localize'"></ng-include>
+  </div>
+</div>
+
+<script>
+  var prometheeLocalizer = angular
+    .module('PrometheeLocalizer', ['summernote'])
+    .value('data', <%= data.html_safe %>)
+    .value('master', <%= master.html_safe %>);
+
+  prometheeLocalizer.controller('PrometheeLocalizerController', ['data', 'master', '$scope', '$http', function(data, master, $scope, $http) {
+    
+    if (data === null || data === '') {
+      data = {
+        locale: '',
+        components: []
+      };
+    }
+    $scope.data = data;
+    $scope.master = master;
+
+    $scope.options = {
+      toolbar: [
+        ['headline', ['style']],
+        ['style', ['bold', 'italic']],
+        ['alignment', ['ul', 'ol', 'paragraph']],
+        ['code', ['codeview']]
+      ]
+    };
+    
+  }]);
+
+  angular.element(function() {
+    angular.bootstrap(document.getElementById('prometheeLocalizer'), ['PrometheeLocalizer']);
+  });
+
+</script>

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

@@ -1,7 +1,7 @@
 <%
-master_data = Promethee::Data.prepare data
+data = Promethee::Data.prepare data
 l = Promethee::Data.prepare l
-Promethee::Localization.localize! master_data, l unless l.nil?
+Promethee::Localization.localize! data, l unless l.nil?
 %>
 <div class="promethee">
   <%= render 'promethee/components/page', page: data %>

data/app/views/promethee/components/_text_edit.html.erb

@@ -6,7 +6,7 @@
       <%= render 'promethee/partials/toolbar_buttons' %>
     </div>
     <div ng-show="editing">
-      <textarea ui-tinymce="tinymceOptions" ng-model="component.attributes.body"></textarea>
+      <summernote config="options" ng-model="component.attributes.body"></summernote>
     </div>
     <div ng-hide="editing">
       <div class="promethee-editor__wrapper" ng-bind-html="component.attributes.body | htmlSafe" ng-click="edit()"></div>
@@ -18,6 +18,10 @@
   <div ng-bind-html="component.attributes.body | htmlSafe"></div>
 </script>
 
+<script type="text/ng-template" id="promethee/components/text/localize">
+  <summernote config="options" ng-model="component.attributes.body"></summernote>
+</script>
+
 <script>
   angular.injector(['ng', 'Promethee']).get('definitions').push({
     name: 'Text',
@@ -42,13 +46,13 @@
       this.editing = false;
     };
 
-    $scope.tinymceOptions = {
-      plugins: 'autoresize',
-      toolbar: 'styleselect | bold italic',
-      menubar: false,
-      statusbar: false,
-      branding: false,
-      autoresize_bottom_margin: 0
+    $scope.options = {
+      toolbar: [
+        ['headline', ['style']],
+        ['style', ['bold', 'italic']],
+        ['alignment', ['ul', 'ol', 'paragraph']],
+        ['code', ['codeview']]
+      ]
     };
 
   }]);

data/app/views/promethee/partials/_page.html.erb

@@ -1,5 +1,5 @@
 <div class="promethee-editor__page" ng-hide="preview || move">
-  <div ng-class="{ 'container-fluid': fullscreen }">
+  <div ng-class="{ 'container': fullscreen }">
     <ng-include src="'promethee/components/page'"></ng-include>
   </div>
   <%= render 'promethee/partials/adder' %>

data/lib/promethee/core_ext/form_builder.rb

@@ -3,4 +3,8 @@ ActionView::Helpers::FormBuilder.class_eval do
   def promethee(method, options = {})
     @template.promethee_editor(@object_name, method, objectify_options(options))
   end
+
+  def promethee_localizer(method, options = {})
+    @template.promethee_localizer(@object_name, method, objectify_options(options))
+  end
 end

data/lib/promethee/core_ext/form_helper.rb

@@ -3,4 +3,8 @@ ActionView::Helpers::FormHelper.class_eval do
   def promethee_editor(object_name, method, options = {})
     ActionView::Helpers::Tags::PrometheeEditor.new(object_name, method, self, options).render
   end
+
+  def promethee_localizer(object_name, method, options = {})
+    ActionView::Helpers::Tags::PrometheeLocalizer.new(object_name, method, self, options).render
+  end
 end

data/lib/promethee/core_ext/tags.rb

@@ -11,6 +11,15 @@ module ActionView
           ApplicationController.renderer.render partial: 'promethee/edit', locals: { data: data }
         end
       end
+
+      class PrometheeLocalizer < Base
+        def render
+          data = object.send @method_name unless object.nil?
+          data = @options[:value] if @options.include? :value
+          master = @options[:master]
+          ApplicationController.renderer.render partial: 'promethee/localize', locals: { data: data, master: master }
+        end
+      end
     end
   end
 end

data/lib/promethee/rails/engine.rb

@@ -6,6 +6,5 @@ class Promethee::Rails::Engine < ::Rails::Engine
   end
   initializer 'assets' do |app|
     Rails.application.config.assets.precompile += %w( logo-promethee-vertical.svg logo-promethee-horizontal.svg icon-promethee.png )
-    # Rails.application.config.assets.paths << Rails.root.join('vendor')
   end
 end

data/lib/promethee/rails/version.rb

@@ -1,5 +1,5 @@
 module Promethee
   module Rails
-    VERSION = "0.1.6"
+    VERSION = '0.1.7'
   end
 end

data/vendor/assets/javascripts/angular-summernote.js

@@ -0,0 +1,207 @@
+/*  angular-summernote v0.8.1 | (c) 2016 JeongHoon Byun | MIT license */
+/* global angular */
+angular.module('summernote', [])
+
+  .controller('SummernoteController', ['$scope', '$attrs', '$timeout', function($scope, $attrs, $timeout) {
+    'use strict';
+
+    var currentElement,
+        summernoteConfig = angular.copy($scope.summernoteConfig) || {};
+
+    if (angular.isDefined($attrs.height)) { summernoteConfig.height = +$attrs.height; }
+    if (angular.isDefined($attrs.minHeight)) { summernoteConfig.minHeight = +$attrs.minHeight; }
+    if (angular.isDefined($attrs.maxHeight)) { summernoteConfig.maxHeight = +$attrs.maxHeight; }
+    if (angular.isDefined($attrs.placeholder)) { summernoteConfig.placeholder = $attrs.placeholder; }
+    if (angular.isDefined($attrs.focus)) { summernoteConfig.focus = true; }
+    if (angular.isDefined($attrs.airmode)) { summernoteConfig.airMode = true; }
+    if (angular.isDefined($attrs.dialogsinbody)) { summernoteConfig.dialogsInBody = true; }
+    if (angular.isDefined($attrs.lang)) {
+      if (!angular.isDefined($.summernote.lang[$attrs.lang])) {
+        throw new Error('"' + $attrs.lang + '" lang file must be exist.');
+      }
+      summernoteConfig.lang = $attrs.lang;
+    }
+
+    summernoteConfig.callbacks = summernoteConfig.callbacks || {};
+
+    if (angular.isDefined($attrs.onInit)) {
+      summernoteConfig.callbacks.onInit = function(evt) {
+        $scope.init({evt:evt});
+      };
+    }
+    if (angular.isDefined($attrs.onEnter)) {
+      summernoteConfig.callbacks.onEnter = function(evt) {
+        $scope.enter({evt:evt});
+      };
+    }
+    if (angular.isDefined($attrs.onFocus)) {
+      summernoteConfig.callbacks.onFocus = function(evt) {
+        $scope.focus({evt:evt});
+      };
+    }
+    if (angular.isDefined($attrs.onPaste)) {
+      summernoteConfig.callbacks.onPaste = function(evt) {
+        $scope.paste({evt:evt});
+      };
+    }
+    if (angular.isDefined($attrs.onKeyup)) {
+      summernoteConfig.callbacks.onKeyup = function(evt) {
+        $scope.keyup({evt:evt});
+      };
+    }
+    if (angular.isDefined($attrs.onKeydown)) {
+      summernoteConfig.callbacks.onKeydown = function(evt) {
+        $scope.keydown({evt:evt});
+      };
+    }
+    if (angular.isDefined($attrs.onImageUpload)) {
+      summernoteConfig.callbacks.onImageUpload = function(files) {
+        $scope.imageUpload({files:files, editable: $scope.editable});
+      };
+    }
+    if (angular.isDefined($attrs.onMediaDelete)) {
+      summernoteConfig.callbacks.onMediaDelete = function(target) {
+        // make new object that has information of target to avoid error:isecdom
+        var removedMedia = {attrs: {}};
+        removedMedia.tagName = target[0].tagName;
+        angular.forEach(target[0].attributes, function(attr) {
+          removedMedia.attrs[attr.name] = attr.value;
+        });
+        $scope.mediaDelete({target: removedMedia});
+      };
+    }
+
+    this.activate = function(scope, element, ngModel) {
+      var updateNgModel = function() {
+        var newValue = element.summernote('code');
+        if (element.summernote('isEmpty')) { newValue = ''; }
+        if (ngModel && ngModel.$viewValue !== newValue) {
+          $timeout(function() {
+            ngModel.$setViewValue(newValue);
+          }, 0);
+        }
+      };
+
+      var originalOnChange = summernoteConfig.callbacks.onChange;
+      summernoteConfig.callbacks.onChange = function (contents) {
+        $timeout(function () {
+          if (element.summernote('isEmpty')) {
+            contents = '';
+          }
+          updateNgModel();
+        }, 0);
+        if (angular.isDefined($attrs.onChange)) {
+          $scope.change({contents: contents, editable: $scope.editable});
+        } else if (angular.isFunction(originalOnChange)) {
+          originalOnChange.apply(this, arguments);
+        }
+      };
+      if (angular.isDefined($attrs.onBlur)) {
+        summernoteConfig.callbacks.onBlur = function (evt) {
+          (!summernoteConfig.airMode) && element.blur();
+          $scope.blur({evt: evt});
+        };
+      }
+      element.summernote(summernoteConfig);
+
+      var editor$ = element.next('.note-editor'),
+          unwatchNgModel;
+      editor$.find('.note-toolbar').click(function() {
+        updateNgModel();
+
+        // sync ngModel in codeview mode
+        if (editor$.hasClass('codeview')) {
+          editor$.on('keyup', updateNgModel);
+          if (ngModel) {
+            unwatchNgModel = scope.$watch(function () {
+              return ngModel.$modelValue;
+            }, function(newValue) {
+              editor$.find('.note-codable').val(newValue);
+            });
+          }
+        } else {
+          editor$.off('keyup', updateNgModel);
+          if (angular.isFunction(unwatchNgModel)) {
+            unwatchNgModel();
+          }
+        }
+      });
+
+      if (ngModel) {
+        ngModel.$render = function() {
+          if (ngModel.$viewValue) {
+            element.summernote('code', ngModel.$viewValue);
+          } else {
+            element.summernote('empty');
+          }
+        };
+      }
+
+      // set editable to avoid error:isecdom since Angular v1.3
+      if (angular.isDefined($attrs.editable)) {
+        $scope.editable = editor$.find('.note-editable');
+      }
+      if (angular.isDefined($attrs.editor)) {
+        $scope.editor = element;
+      }
+
+      currentElement = element;
+      // use jquery Event binding instead $on('$destroy') to preserve options data of DOM
+      element.on('$destroy', function() {
+        element.summernote('destroy');
+        $scope.summernoteDestroyed = true;
+      });
+    };
+
+    $scope.$on('$destroy', function () {
+      // when destroying scope directly
+      if (!$scope.summernoteDestroyed) {
+        currentElement.summernote('destroy');
+      }
+    });
+  }])
+  .directive('summernote', [function() {
+    'use strict';
+
+    return {
+      restrict: 'EA',
+      transclude: 'element',
+      replace: true,
+      require: ['summernote', '?ngModel'],
+      controller: 'SummernoteController',
+      scope: {
+        summernoteConfig: '=config',
+        editable: '=',
+        editor: '=',
+        init: '&onInit',
+        enter: '&onEnter',
+        focus: '&onFocus',
+        blur: '&onBlur',
+        paste: '&onPaste',
+        keyup: '&onKeyup',
+        keydown: '&onKeydown',
+        change: '&onChange',
+        imageUpload: '&onImageUpload',
+        mediaDelete: '&onMediaDelete'
+      },
+      template: '<div class="summernote"></div>',
+      link: function(scope, element, attrs, ctrls, transclude) {
+        var summernoteController = ctrls[0],
+          ngModel = ctrls[1];
+
+          if (!ngModel) {
+            transclude(scope, function(clone, scope) {
+              // to prevent binding to angular scope (It require `tranclude: 'element'`)
+              element.append(clone.html());
+            });
+            summernoteController.activate(scope, element, ngModel);
+          } else {
+            var clearWatch = scope.$watch(function() { return ngModel.$viewValue; }, function(value) {
+              clearWatch();
+              element.append(value);
+              summernoteController.activate(scope, element, ngModel);
+            }, true);
+          }
+      }
+    };
+  }]);