CKEditor upgrade

From GLMWiki
Revision as of 09:35, 12 October 2012 by Kc8wxm (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

This checklist upgrades a site from the FCKeditor to CKEditor using Pear Libraries

NOTE: Not for sites on WS1

1) Verify GLM_APP_BASE and GLM_APP_BASE_URL is defined in setup.phtml

2) add to the top function in setup.phtml (or setup_functions.phtml)

	<script type="text/javascript" src="'.GLM_APP_BASE_URL.'ckeditor/current/ckeditor.js"></script>   
	<script type="text/javascript" src="'.GLM_APP_BASE_URL.'libjs/jquery-1.3.2.min.js"></script>     
	<script type="text/javascript" src="./cktoolbox.js "></script>  

3) Add the function __autoload($className) to setup.phtml

4) add the global variable, $flexyOptions to setup.phtml

5) add $dbh to setup

6) Set up client on the image server and add to setup.phtml:

    /**
     * Now using new Image Server
     * http://is0.gaslightmedia.com/admin
     * setup new owner with owner_id and owner_pw
     * MUST BE DONE BEFORE uploading any images
     */
    /**
    * IS_OWNER_ID owner_id from image server config
     */
    define('IS_OWNER_ID', 'Owner');
    /**
     * IS_OWNER_PW owner_pw from image server config
     */
    define('IS_OWNER_PW', 'Password');
    $fileServerUrl
        = ($_SERVER['HTTPS'] == 'on')
        ? 'https://is0.gaslightmedia.com/'
        : 'http://is0.gaslightmedia.com/';
    define('FILE_SERVER_URL', $fileServerUrl);
    /**
     * Toolbox image URLS
     * NOTE: these don't change
     * There are 4 global "image styles"
     * original = used for original images no processing
     * tbs1     = used to be resized
     * tbs2     = used to be midsized
     * tbs3     = used to be thumb
     * check on http://is0.gaslightmedia.com/admin under owner _SYSTEM_
     * for their sizes
     * if you need a different size you'll need to create image style for 
     * your owner with new sizes just use one of set style names
     * tbs1,tbs2,tbs3 (do this before uploading the image will help)
     */
    define('ORIGINAL', FILE_SERVER_URL.IS_OWNER_ID."/original/");
    define('RESIZED', FILE_SERVER_URL.IS_OWNER_ID."/tbs1/");
    define('MIDSIZED', FILE_SERVER_URL.IS_OWNER_ID."/tbs2/");
    define('THUMB', FILE_SERVER_URL.IS_OWNER_ID."/tbs3/");
    define('IMAGE_MANAGER', FILE_SERVER_URL.IS_OWNER_ID."/imgMgr/");
    //  CKImage image rules
    /**
     * This is the rule used to create the Maximum Allowed Size image
     * we allow for CKEditor Images, which is (700x500)
     *
     * If the user resizes (edits) the image, it can be smaller
     */
    define('CKIMAGE', FILE_SERVER_URL.IS_OWNER_ID."/CKImage/");
    define('CKIMAGE_ORIGINAL', TOOLBOX_ORIGINAL);
    define('CKIMAGE_RESIZED', TOOLBOX_RESIZED);
    define('CKIMAGE_MIDSIZED', TOOLBOX_MIDSIZED);
    define('CKIMAGE_THUMB', TOOLBOX_THUMB);

7) add file cktoolbox.js to admin/Toolbox

8) add to function mySubmit in admin/Toolbox/edit_bus.phtml:

    var MemberToolbox =
    {
      init: function()
      {
        if ($('#description').is('textarea')) {
            //  Only try to replace the textarea if the
            //  CKEditor is compatible w/ the browser.
            if (CKEDITOR.env.isCompatible) {
                CKEDITOR.replace('description',
                    {
                        toolbar : 'Default',
                        width : 570,
                        height : 400,
                        filebrowserImageBrowseUrl : '../../Toolkit/CKImages/browser.php?folder=1',
                        filebrowserImageUploadUrl : '../../Toolkit/CKImages/connector.php?command=Upload',
                        filebrowserImageWindowWidth : '760',filebrowserImageWindowHeight : '500'
                    });
            }
        }
     }
   };

9) copy Toolkit/CKImages/ to site root

10) add Common.php and FormBuilder.php to the Toolkit folder

11) copy Image folder to Toolkit

12) run the Toolkit/CKImages/Database/application.sql file against the site db.

13) run psql -U postgres -E -f /usr/share/postgresql/8.2/contrib/tablefunc.sql <database> to add postgres functions

14) Replace description instances where textarea(fn) is called with: echo '<td><textarea name="description" id="description" cols="60" rows="60">'.$value.'</textarea></td>'; in edit_bus and edit_bus_category

15) Remove the htmlcode() function from bottom of admin/Toolbox/edit_bus and edit_bus_category.phtml


To get the toolbox image upload in sync: Remove the old defines for ORIGINAL etc from setup.phtml

Replace old process_image function with new from demo

Mod the case Update in admin/toolbox/update_bus_category and update_bus to call the image server

Mod the case Insert. Change $image_name to $image_name = GLM_TOOLBOX::process_image('image');

Mod the case Delete. Replace the unlinks with the Image server functions