OXID Module Review – No.1: fck editor

mathias — Sun, 07 Feb 2010 16:48:50 +0000

Together with the last year release of the OXID eShop open source (GPL V3) version, the OXID eXchange open its doors to the public. The OXID eXchange is similar to the Apple App Store or the Magento connect a central place where developers can put their applications or in terms of OXID eShop extensions (modules, language packs and themes) in order to distribute and sell them. In the eXchange we find a description by the creator of the extension as well as reviews written by customers. But as most of the reviews are more like comments and tend to be quite short it may be hard to determine the quality of the extensions. That’s why we’ll start a series of objective reviews in order to help people in the jungle of OXID extensions. For the start we’ll mainly cover open source extensions but we plan to cover paid extensions as well.

Number one in our series will be the “fck editor” (link to eXchange) extension by top concepts a german OXID partner located in Hambug.

All testing take place with the newest version of the OXID eShop CE (4.2) in UTF-8 mode, installed on my local Mac OSX 10.5.7 with an old PHP 5.2.5.

Description:
This extension adds the open source fck editor, which is today known as the CKEditor, as default WYSIWYG editor in the eShop. Remark: The OXID eShop CE ships without an WYSIWYG editor so you’ll need to install this or the TinyMCE editor in order to use full WYSIWYG features.

Documentation:
There is a small install.txt file in english and german. All you need to know about installing can be found there, but don’t expect any additional information. A new user might have a problem with the term “add the following lines to the ‘Modules’ section”. It would be better to describe where to find the text box in admin area (Master Settings -> Core Settings -> System -> Modules), especially as WYSIWYG usually is the first think installed when someone tries the eShop for the first time.

Installation:
Following the instructions it takes me 20 seconds and FCK Editor is installed an working. No problems at all.

Good:

Easy and fast installation and applies to all OXID eShop text boxes that are capable of html text.
The FCK Editor is a very good editor including adding / uploading of pictures.

Bad:

The FCK Editor interface switches language according to the text language and not based on the admin interface language. So if an english admin edits the german translation of an article the FCK editor’s interface is in german too.
Maximizing the editor can’t be used as the OXID “save” button disappears, although this is mostly a problem of the admin templates.

Conclusion:
Use it! You might also think about replacing the build in editor of PE and EE versions by the FCK editor if you like it more.

Please feel free to comment or recomment other extensions…

Rails 2.2, Active_Scaffold and FCKEditor

christian — Wed, 04 Mar 2009 12:36:43 +0000

In one of our upcomming Projects we are using Active_Scaffold for Backend Functionality. Therefore we want to integrate the FCKEditor. We are using the actual Version of the FCKEditor Plugin for Rails. To integrate the FCKEditor with Active_Scaffold i was following this Tutorial. But it seems that this does not run with Rails 2.2.

We´ve got the following error:

^?View Code RUBY

1
2
3

NoMethodError (undefined method `configure' for #):
    /vendor/plugins/active_scaffold/lib/active_scaffold/config/core.rb:147:in `method_missing'
    /vendor/plugins/active_scaffold/lib/active_scaffold.rb:57:in `active_scaffold'

This was happen right after the instgallation of the FCKEditor Pugin so i was diggin deeper into the Problem. It comes out that the problem was the overwrite of the javascript_include_tag in the fckeditor.rb. My solution was to comment the hole module out.

^?View Code RUBY

# Fckeditor
module Fckeditor
  PLUGIN_NAME = 'fckeditor'
  PLUGIN_PATH = "#{RAILS_ROOT}/vendor/plugins/#{PLUGIN_NAME}"
  PLUGIN_PUBLIC_PATH = "#{PLUGIN_PATH}/public"
  PLUGIN_CONTROLLER_PATH = "#{PLUGIN_PATH}/app/controllers"
  PLUGIN_VIEWS_PATH = "#{PLUGIN_PATH}/app/views"
  PLUGIN_HELPER_PATH = "#{PLUGIN_PATH}/app/helpers"
 
  module Helper
    def fckeditor_textarea(object, field, options = {})
      var = instance_variable_get("@#{object}")
      if var
        value = var.send(field.to_sym)
        value = value.nil? ? "" : value
      else
        value = ""
        klass = "#{object}".camelcase.constantize
        instance_variable_set("@#{object}", eval("#{klass}.new()"))
      end
      id = fckeditor_element_id(object, field)
 
      cols = options[:cols].nil? ? '' : "cols='"+options[:cols]+"'"
      rows = options[:rows].nil? ? '' : "rows='"+options[:rows]+"'"
 
      width = options[:width].nil? ? '100%' : options[:width]
      height = options[:height].nil? ? '100%' : options[:height]
 
      toolbarSet = options[:toolbarSet].nil? ? 'Default' : options[:toolbarSet]
 
      if options[:ajax]
        inputs = "
#{id}_hidden" name="#{object}[#{field}]" type="hidden" />\n" <<
                 "#{id}" name="#{id}">#{value}\n"
      else
        inputs = "#{id}" name="#{object}[#{field}]">#{value}\n"
      end
 
      js_path = "#{ActionController::Base.relative_url_root}/javascripts"
      base_path = "#{js_path}/fckeditor/"
      return inputs &lt;&lt;
        javascript_tag("var oFCKeditor = new FCKeditor('#{id}', '#{width}', '#{height}', '#{toolbarSet}');\n" &lt;&lt;
                       "oFCKeditor.BasePath = \"#{base_path}\"\n" &lt;&lt;
                       "oFCKeditor.Config['CustomConfigurationsPath'] = '#{js_path}/fckcustom.js';\n" &lt;&lt;
                       "oFCKeditor.ReplaceTextarea();\n")
    end
 
    def fckeditor_form_remote_tag(options = {})
      editors = options[:editors]
      before = ""
      editors.keys.each do |e|
        editors[e].each do |f|
          before += fckeditor_before_js(e, f)
        end
      end
      options[:before] = options[:before].nil? ? before : before + options[:before]
      form_remote_tag(options)
    end
 
    def fckeditor_remote_form_for(object_name, *args, &amp;proc)
      options = args.last.is_a?(Hash) ? args.pop : {}
      concat(fckeditor_form_remote_tag(options), proc.binding)
      fields_for(object_name, *(args &lt;&lt; options), &amp;proc)
      concat('
 
', proc.binding)
    end
    alias_method :fckeditor_form_remote_for, :fckeditor_remote_form_for
 
    def fckeditor_element_id(object, field)
      id = eval("@#{object}.id")
      "#{object}_#{id}_#{field}_editor"
    end
 
    def fckeditor_div_id(object, field)
      id = eval("@#{object}.id")
      "div-#{object}-#{id}-#{field}-editor"
    end
 
    def fckeditor_before_js(object, field)
      id = fckeditor_element_id(object, field)
      "var oEditor = FCKeditorAPI.GetInstance('"+id+"'); document.getElementById('"+id+"_hidden').value = oEditor.GetXHTML();"
    end
  end
end
 
#include ActionView
#module ActionView::Helpers::AssetTagHelper
#  alias_method :rails_javascript_include_tag, :javascript_include_tag
#
#  #  <%= javascript_include_tag :defaults, :fckeditor %>
#  def javascript_include_tag(*sources)
#    main_sources, application_source = [], []
#    if sources.include?(:fckeditor)
#      sources.delete(:fckeditor)
#      sources.push('fckeditor/fckeditor')
#    end
#    unless sources.empty?
#      main_sources = rails_javascript_include_tag(*sources).split("\n")
#      application_source = main_sources.pop if main_sources.last.include?('application.js')
#    end
#    [main_sources.join("\n"), application_source].join("\n")
#  end
#end

The second Step was to include the needed Javascript Files on top of our layout file:

^?View Code RUBY

1 2	<%= javascript_include_tag "fckeditor/fckeditor" %> <%= javascript_include_tag "fckcustom" %>

Now the FCKEditor works smoothly with Active_Scaffold. We will show the rest of the Integration with Active_Scaffold in one of our next Posts.

die musterdenker » FCKEditor

OXID Module Review – No.1: fck editor

Rails 2.2, Active_Scaffold and FCKEditor