为KindEditor在线编辑器增加图片水印和缩略图功能
轻量级开源KindEditor在线编辑器非常好用,虽然作者已多年不更新了,但阻挡不了我对它的喜爱。在使用之中,总是想为它加点功能,这样便可使工作更高效!
我们在图片上传时总想自动添加水印和生成缩略图,但这些实用小功能却没见有人制作,遂Google一下资料自己捣鼓了一个,分享给大家!
直接放出源码,对应版本为最新的“4.1.11”:
第一步:修改\editor\kindeditor-all.js中的第7000行,用下面代码替换
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | hiddenElements.join(''), '<label style="width:60px;">' + lang.localUrl + '</label>', '<input type="text" name="localUrl" class="ke-input-text" tabindex="-1" style="width:200px;" readonly="true" /> ', '<input type="button" class="ke-upload-button" value="' + lang.upload + '" />', '<div class="ke-dialog-row">', '<label style="width:60px;">是否水印</label>', '<label><input name="iswater" type="radio" value="1" />加水印</label>', '<label><input name="iswater" type="radio" value="0" checked="checked" />不加水印</label>', '</div>', '<div class="ke-dialog-row">', '<label style="width:60px;">缩略图</label>', '宽:<input name="thumb_width" type="text" class="ke-input-text" style="width:40px;" /> ', '高:<input name="thumb_height" type="text" class="ke-input-text" style="width:40px;" />', '</div>', '', '', '' |
目的是:在图片上传对话框中设置水印和缩略图选项,以便可控。
第二步:修改\editor\lib\editor\php\upload_json.php,在$json = new Services_JSON();下面添加下列代码(注意不是function alert($msg)函数中的那条)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | /* 水印配置开始 */ $watermark = isset($_REQUEST['iswater'])?$_REQUEST['iswater']:''; $thumb_width = isset($_REQUEST['thumb_width'])?(int)$_REQUEST['thumb_width']:false; $thumb_height = isset($_REQUEST['thumb_height'])?(int)$_REQUEST['thumb_height']:false; if($watermark==1){ //判断是否缩放 if($cfg->Def_UploadPic_Width > 0){ //自己根据需要在系统中设置图片是否缩放开关,$cfg->Def_UploadPic_Width这是我系统中使用的全局变量 $sizewith = $cfg->Def_UploadPic_Width; //缩略图的宽度 }else{ $sizewith = false; } if($cfg->Def_UploadPic_Height > 0){ $sizeheight = $cfg->Def_UploadPic_Height; //缩略图的高度 }else{ $sizeheight = false; } if($sizewith > 0 || $sizeheight > 0){ $s = new Image_process( $file_path ); $s->fixSizeImage($sizewith,$sizeheight,false);//缩放且覆盖原文件 } //加水印 $s = new Image_process( $file_path ); $s->watermarkImage($_SERVER['DOCUMENT_ROOT'].$cfg->Def_Water_Img_Path); //$cfg->Def_Water_Img_Path为我系统中设置的水印图片路径 } //缩略图 $thumb_url = ''; if($thumb_width == 0){ $thumb_width = false; } if($thumb_height == 0){ $thumb_height = false; } if($thumb_width > 0 || $thumb_height > 0){ $s = new Image_process( $file_path ); $s->fixSizeImage($thumb_width,$thumb_height,true); $thumb_url = str_ireplace('.','_thumb.',$file_url); //缩略图文件名是在原文件后增加_thumb } /* 水印配置结束 */ |
在文件尾部添加相关处理类:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 | /* 用法: $s = new Image_process( $item ); $s->watermarkImage($logo); //生成水印 $s->fixSizeImage(200,false,true);//生成缩略图 参数:宽,高,true另存缩略图 false覆盖原文件 */ class Image_process{ public $source;//原图 public $source_width;//宽 public $source_height;//高 public $source_type_id; public $orign_name; public $orign_dirname; //传入图片路径 public function __construct($source){ $this->typeList = array(1=>'gif',2=>'jpg',3=>'png'); $ginfo = getimagesize($source); $this->source_width = $ginfo[0]; $this->source_height = $ginfo[1]; $this->source_type_id= $ginfo[2]; $this->orign_url = $source; $this->orign_name = basename($source); $this->orign_dirname = dirname($source); } //判断并处理,返回PHP可识别编码 public function judgeType($type,$source){ if($type==1){ return ImageCreateFromGIF($source);//gif }else if($type==2){ return ImageCreateFromJPEG($source);//jpg }else if($type==3){ return ImageCreateFromPNG($source);//png }else{ return false; } } //生成水印图 public function watermarkImage($logo){ $linfo = getimagesize($logo); $logo_width = $linfo[0]; $logo_height = $linfo[1]; $logo_type_id = $linfo[2]; $sourceHandle = $this->judgeType($this->source_type_id,$this->orign_url); $logoHandle = $this->judgeType($logo_type_id,$logo); if( !$sourceHandle || ! $logoHandle ){ return false; } $x = $this->source_width - $logo_width; $y = $this->source_height- $logo_height; ImageCopy($sourceHandle,$logoHandle,$x,$y,0,0,$logo_width,$logo_width) or die("fail to combine"); // $newPic = $this->orign_dirname .'\water_'. time().'.'. $this->typeList[$this->source_type_id]; $newPic = $this->orign_url; if( $this->saveImage($sourceHandle,$newPic)){ imagedestroy($sourceHandle); imagedestroy($logoHandle); } } // fix 宽度 // height = true 固顶高度 // width = true 固顶宽度 public function fixSizeImage($width,$height,$thubm){ if( $width > $this->source_width) $this->source_width; if( $height > $this->source_height ) $this->source_height; if( $width === false){ $width = floor($this->source_width / ($this->source_height / $height)); } if( $height === false){ $height = floor($this->source_height / ($this->source_width / $width)); } $this->tinyImage($width,$height,$thubm); } //创建略缩图 private function tinyImage($width,$height,$thubm){ $tinyImage = imagecreatetruecolor($width, $height ); $handle = $this->judgeType($this->source_type_id,$this->orign_url); if(function_exists('imagecopyresampled')){ imagecopyresampled($tinyImage,$handle,0,0,0,0,$width,$height,$this->source_width,$this->source_height); }else{ imagecopyresized($tinyImage,$handle,0,0,0,0,$width,$height,$this->source_width,$this->source_height); } //$newPic = time().'_'.$width.'_'.$height.'.'. $this->typeList[$this->source_type_id]; if($thubm===true){ $newPic = $this->orign_url; $newPic = str_ireplace('.','_thumb.',$newPic); }else{ $newPic = $this->orign_url; } if( $this->saveImage($tinyImage,$newPic)){ imagedestroy($tinyImage); imagedestroy($handle); } } //保存图片 private function saveImage($image,$url){ if(ImageJpeg($image,$url)){ return true; } } } |
原创文章如转载,请注明:转载自无花果的原创博客 [ http://wuhuaguo.lifeskillcn.com ]