Wiki Plume Community : InsertThumbnail

HomePage :: Categories :: PageIndex :: RecentChanges :: RecentlyCommented :: Login/Register

Insert a thumbnail rather than a picture

Sometimes you want to insert a thumbnail in a text, rather than the full picture. It is possible by modifying the function line_file in the file manager/xmedia.php
The modified function inserts a new icon (actually ico_image.png) for each picture available.
You will have to add a translation for "Send the thumbnail" in translation file.

Insérer une miniature plutot qu'une image

Il est parfois utile d'insérer une miniature dans un texte, plutot qu'une image complète. C'est possible en modifiant la fonction line_file dans le fichier manager/xmedia.php
La fonction modifiée insère une nouvelle icône pour chaque image (basée sur ico_image.png)
Il faut ajouter la traduction pour "Send the thumbnail" dans le fichier de traduction.




/* Line to display a file */
function line_file($data,$i)
{
    global $mode, $up_dir, $_PX_website_config, $m,
        $px_gd_version, $env, $_px_theme;

    // 4 kinds of entry: "up" folder, folder, image and normal file
    // 2 modes: popup and normal
    $is_dir = false;
    $is_file = false;
    $is_image = false;
    $is_updir = false;
    $url = $data['url'];
    $name = $data['name'];
    $current_dir = $data['current_dir'];

    switch ($data['type']) {
    case 'file':
        $is_image = isImage($name);
        $is_file = !$is_image;
        $ext = getFileExtension($name);
        break;
    case 'dir':
        $is_dir = true;
        break;
    case 'updir':
        $is_updir = true;
        break;
    }

    $res = ''; //final string to be displayed.

    //contains the height/width of the image or the size of
    // the file, nothing if an image and impossible to get the size   
    $file_size = '';
   
    $create_thumb = ''; //link to create the thumbnail
    $send_thumb=''; //insertThumbnailModification
    $url2=''; //insertThumbnailModification
    $action_link2=''; //insertThumbnailModification
    $icons_dir = config::f('manager_path').'/themes/'
        .$_px_theme.'/images/icons/';

    $delete_link = '<a href="xmedia.php?dir='.rawurlencode($current_dir)
        .'&file='.rawurlencode($current_dir.$name).'&del=1&mode='
        .$mode.'&env='.$env.'" title="'. __('Delete')
        .'" onclick="return window.confirm(\''
        . __('Are you sure you want to delete this file?')
        .'\')"><img src="themes/'.$_px_theme.'/images/delete.png" alt="'
        .__('Delete').'" /></a>';

    // Get size of the file in $file_size format ready to be displayed
    if ($is_image) {
        $siz = @getimagesize(config::f('xmedia_root').'/'.$current_dir.$name);
        if ($siz !== false && 'html' == $m->user->getPref('content_format')) {
            //HTML format
            $file_size = __('<strong>size</strong>:').' '.$siz[3];
        } elseif ($siz !== false) {
            //wiki format
            $file_size = __('<strong>size</strong>:').' '.$siz[0].'x'.$siz[1];
        }
    } elseif ($is_file) {
        //size in kb
        $file_size = __('<strong>size</strong>:').' '
            .prettySize(filesize(config::f('xmedia_root').'/'
                                 .$current_dir.$name));
    }

    if ($mode == 'popup' && ($is_image || $is_file)) {
        //call from the popup
        $act = ($is_image) ? 'img' : 'file';
        $action_link = '<a href="#" '
            .'onclick="insertImage(window.opener.document,\''.$url
            .'\',\''.$act.'\',\''
            .addslashes(__('Title of the file or image:')).'\'); '
            .'window.close(); return false;">%s</a>';
    } elseif ($is_dir || $is_updir) {
        $slash = ($is_dir) ? '/' : '';
        $action_link = '<a href="xmedia.php?dir='.$current_dir.$slash
            .'&mode='.$mode.'">%s</a>';
    } else {
        //call from the "normal" list of files page
        $action_link = '<a href="http://'.config::f('domain').$url.'">%s</a>';
    }

    // create the thumbnail link
    if ($is_file || $is_image) {
        if (file_exists($up_dir.'/thumb/'.md5($current_dir.$name).'.jpg')) {
            //thumbnail exists
            $th = sprintf($action_link,
                          '<img class="thumbnail" src="'
                          .www::getManagedWebsiteUrl()
                          .config::f('rel_url_files')
                          .'/thumb/'.md5($current_dir.$name).'.jpg" alt="" />'
                          );
            if ($mode == 'popup') { //insertThumbnailModification
                $url2=config::f('rel_url_files').'/thumb/'.md5($current_dir.$name).'.jpg'; //insertThumbnailModification
                $action_link2 = '<a href="#"  title="'.__('Send the thumbnail').'" '.
                'onclick="insertImage(window.opener.document,\''.$url2.'\',\''.$act.'\',\''.addslashes( __('Title of the file or image:')).'\'); '.
                'window.close(); return false;">%s</a>'; //insertThumbnailModification
                $send_thumb= sprintf($action_link2,'<img src="themes/'.$_px_theme.'/images/ico_image.png" alt="'.__('Send the thumbnail').'" />'); //insertThumbnailModification
            }
        } elseif ($is_image && $px_gd_version) {
            //image without thumbnail
            if (file_exists($icons_dir.$ext.'-dist.png')) {
                $img = 'themes/'.$_px_theme.'/images/icons/'.$ext.'-dist.png';
            } else {
                $img = 'themes/'.$_px_theme.'/images/icons/default-dist.png';
            }
            $th = sprintf($action_link,
                          '<img class="thumbnailicon" src="'.$img
                          .'" alt="" />');
            $create_thumb = '<a href="xmedia.php?dir='
                .rawurlencode($current_dir).'&file='
                .rawurlencode($current_dir.$name).'&thumb=1&mode='
                .$mode.'&env='.$env.'" title="'
                .__('Try to create the thumbnail').'"><img src="themes/'
                .$_px_theme.'/images/ico_createthumb.png" alt="'
                .__('Try to create the thumbnail').'" /></a>';
        } else {
            //normal file
            $ext = getFileExtension($name);
            if (file_exists($icons_dir.$ext.'-dist.png')) {
                $img = 'themes/'.$_px_theme.'/images/icons/'.$ext.'-dist.png';
            } else {
                $img = 'themes/'.$_px_theme.'/images/icons/default-dist.png';
            }
            $th = sprintf($action_link,
                          '<img class="thumbnailicon" src="'.$img
                          .'" alt="" />');
        }
        $res = '<div class="icon">'."\n"
            .'<p class="legend action">'.$send_thumb.' '.$create_thumb.' '.$delete_link.'</p>'
            ."\n".'<p class="icon">'.$th.'</p>'."\n".'<p class="legend">'
            .sprintf($action_link,$name).'<br />'."\n".$file_size.'</p>'."\n"
            .'</div>'."\n"; //insertThumbnailModification
    } elseif ($is_dir || $is_updir) {
        $ico = ($is_dir) ? 'ico_folder.png' : 'ico_folder_up.png';
        $img = 'themes/'.$_px_theme.'/images/'.$ico;
        $th = sprintf($action_link,
                      '<img class="thumbnailicon" src="'.$img.'" alt="" />');
            $res = '<div class="icon">'."\n"
                .'<p class="icon">'.$th.'</p>'."\n"
                .'<p class="legend">'.sprintf($action_link,$name).'</p>'."\n"
                .'</div>'."\n";
    }
    return $res;
}




Automatically link the thumbnail to the original picture

A thumbnail is generally used in order to create a link to the picture at the original size. To make the edition of a ressource easier, this link will be automatically inserted in the form while we use the thumbnail.

Créer automatiquement un lien vers l'original

Une miniature est généralement utilisée afin de pouvoir créer un lien vers l'image en grande taille. Pour nous simplifier la vie, nous allons faire en sorte que ce lien soit automatiquement inséré dans l'article lorsque l'on décide d'utiliser la miniature.

First, we have to modify the file /manager/tools.js/ and add the function insertThumbLinked

Pour cela, nous devons tout d'abord modifier le fichier /manager/tools.js/ et ajouter la fonction insertThumbLinked

function insertThumbLinked(origine,urlThumb,url,text,textLink)
{
    form = origine.forms['formPost'];
   
    if (form.n_content_format)           format = form.n_content_format.value;
    else if (form.a_description_format)  format = form.a_description_format.value;
    else if (form.a_page_content_format) format = form.a_page_content_format.value;
    else if (form.c_format)              format = form.c_format.value;

    title = window.prompt(text);
   
    if (format == 'wiki')
    {
        if (title != '') {
            image = '[(('+urlThumb+'|'+title+'))|'+url+'|'+textLink+']';
        } else {
            image = '[(('+urlThumb+'))|'+url+'|'+textLink+']';
        }
    }
    else
    {
        image = '<p><a href="'+url+'" title="'+textLink+'"><img src="'+urlThumb+'" alt="'+title+'" /></a></p>';
    }

    image = "\n\n"+image;

    if (tb && format != 'wiki') {
        tb.syncContents('iframe');
    }

    if (form.n_content)           form.n_content.value += image;
    else if (form.a_description)  form.a_description.value += image;
    else if (form.a_page_content) form.a_page_content.value += image;
    else if (form.c_description)  form.c_description.value += image;

    if (tb && format != 'wiki') {
        tb.syncContents('textarea');
    }
}


Then, in the new function line_file of the modified file /manager/xmedia.php/ we have to change one line.

Puis, dans la nouvelle fonction line_file du fichier modifié /manager/xmedia.php/ nous devons changer une ligne.

Original Line :
'onclick="insertImage(window.opener.document,\''.$url2.'\',\''.$act.'\',\''.addslashes( __('Title of the file or image:')).'\'); '.


Modified Line :
'onclick="insertThumbLinked(window.opener.document,\''.$url2.'\',\''.$url.'\',\''.addslashes( __('Title of the file or image:')).'\',\''.addslashes( __('Enlarge the image')).'\'); '.


You will have to add a translation for "Enlarge the image" in translation file.

Il faut ajouter la traduction pour "Enlarge the image" dans le fichier de traduction.

code original par Damdam et Josselin
Valid XHTML 1.0 Transitional :: Valid CSS :: Powered by Wikka Wakka Wiki 1.1.6.1
Page was generated in 4.4160 seconds