CKFinder 3(不包含CKEditor)在选择或上传图像时,如何强制用户使用特定尺寸的图像编辑区域

时间:2016-07-19 22:06:49

标签: php crop dimensions ckfinder

我查看了所有Ckfinder标记的问题,似乎没有任何帮助。这是关于新的CKFinder 3.

我们有一个cms(PHP)。在常规内容页面上,ckeditor和ckfinder可以很好地协同工作。我不在乎他们使用什么尺寸。

我们还允许用户在单独的页面上上传滑块的图像。这些图像应该是特定的宽度和高度。这就是我被困住的地方。一旦用户上传或选择了图像,我想自动将图像放在图像编辑区域中并设置裁剪尺寸。

我正在使用弹出窗口示例。我注意到提供的代码只能使用表单标记之外的按钮。只要我在表单中移动它,它就不会输出文件名。

<button id="ckfinder-popup-1" class="button-a button-a-background">Browse Server</button>    
<input id="ckfinder-input-1" type="text" name="file1" class="form-control">

<script type="text/javascript">
    var button1 = document.getElementById( 'ckfinder-popup-1' );
    button1.onclick = function() {
        selectFileWithCKFinder( 'ckfinder-input-1' );
    };
    function selectFileWithCKFinder( elementId ) {
        CKFinder.popup( {
            chooseFiles: true,
            width: 800,
            height: 600,
            dialogMinHeight: 400,
             resourceType: 'Images',
            plugins: ['StatusBarInfo'],
            onInit: function( finder ) {
                finder.on( 'files:choose', function( evt ) {
                    var file = evt.data.files.first();
                    var output = document.getElementById( elementId );
                    output.value = file.getUrl();
                } );

                finder.on( 'file:choose:resizedImage', function( evt ) {
                    var output = document.getElementById( elementId );
                    output.value = evt.data.resizedUrl;
                } );                
            }
        } );
    }


</script>

1 个答案:

答案 0 :(得分:0)

&#13;
&#13;
Constraints
  ON (organization:Organization) ASSERT organization.id IS UNIQUE
&#13;
&#13;
&#13;