Commit e2153ff0 authored by Marcello Pivanti's avatar Marcello Pivanti
Browse files

Initial Commit

parents
The MIT License (MIT)
Copyright (c) 2016 Zabolotskikh Boris
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
<?php
/**
* Art-ER Attrattività, ricerca e territorio dell’Emilia-Romagna
* OPEN 2.0
*
* @package Open20Package
* @category CategoryName
* @author Elite Division S.r.l.
*/
namespace pendalf89\filemanager;
use Yii;
class Module extends \yii\base\Module
{
const DEFAULT_THUMB_ALIAS = 'fm';
public $controllerNamespace = 'pendalf89\filemanager\controllers';
/**
* Set true if you want to rename files if the name is already in use
* @var boolean
*/
public $rename = false;
/**
* Set true to enable autoupload
* @var boolean
*/
public $autoUpload = false;
/**
* Thumbnails name template.
* Possible vars: {original}, {width}, {height}, {alias}, {extension}
* Note: "fm" alias is reserved for default thumbnails
* @var string
*/
public $thumbFilenameTemplate = '{original}-{alias}.{extension}';
/**
* @var array upload routes
*/
public $routes = [
// base absolute path to web directory
'baseUrl' => '',
// base web directory url
'basePath' => '@webroot',
// path for uploaded files in web directory
'uploadPath' => 'uploads',
];
/**
* @var array thumbnails info
*/
public $thumbs = [
'small' => [
'name' => 'Small size',
'size' => [120, 80],
],
'medium' => [
'name' => 'Medium size',
'size' => [400, 300],
],
'large' => [
'name' => 'Large size',
'size' => [800, 600],
],
];
/**
* @var array default thumbnail size, using in filemanager view.
*/
private static $defaultThumbSize = [128, 128];
public function init()
{
parent::init();
$this->registerTranslations();
}
public function registerTranslations()
{
Yii::$app->i18n->translations['modules/filemanager/*'] = [
'class' => 'yii\i18n\PhpMessageSource',
'sourceLanguage' => 'en-US',
'basePath' => '@vendor/pendalf89/yii2-filemanager/messages',
'fileMap' => [
'modules/filemanager/main' => 'main.php',
],
];
}
public static function t($category, $message, $params = [], $language = null)
{
if (!isset(Yii::$app->i18n->translations['modules/filemanager/*'])) {
return $message;
}
return Yii::t("modules/filemanager/$category", $message, $params, $language);
}
/**
* @return array default thumbnail size. Using in filemanager view.
*/
public static function getDefaultThumbSize()
{
return self::$defaultThumbSize;
}
}
Yii2 file manager
================
This module provide interface to collect and access all mediafiles in one place. Inspired by WordPress file manager.
Features
------------
* Integrated with TinyMCE editor.
* Automatically create actually directory for uploaded files like "2014/12".
* Automatically create thumbs for uploaded images
* Unlimited number of sets of miniatures
* All media files are stored in a database that allows you to attach to your object does not link to the image, and the id of the media file. This provides greater flexibility since in the future will be easy to change the size of thumbnails.
* If your change thumbs sizes, your may resize all existing thumbs in settings.
Screenshots
------------
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-upload.png">
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-image-select.png">
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-index.png">
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-files-in-admin.png">
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-settings.png">
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-selected-image.png">
<img src="http://zabolotskikh.com/wp-content/uploads/2014/12/yii2-filemanager-selected-image-without-input.png">
Installation
------------
The preferred way to install this extension is through [composer](http://getcomposer.org/download/).
Either run
```
php composer.phar require --prefer-dist pendalf89/yii2-filemanager "*"
```
or add
```
"pendalf89/yii2-filemanager": "*"
```
to the require section of your `composer.json` file.
Apply migration
```sh
yii migrate --migrationPath=vendor/pendalf89/yii2-filemanager/migrations
```
Configuration:
```php
'modules' => [
'filemanager' => [
'class' => 'pendalf89\filemanager\Module',
// Upload routes
'routes' => [
// Base absolute path to web directory
'baseUrl' => '',
// Base web directory url
'basePath' => '@frontend/web',
// Path for uploaded files in web directory
'uploadPath' => 'uploads',
],
// Thumbnails info
'thumbs' => [
'small' => [
'name' => 'Мелкий',
'size' => [100, 100],
],
'medium' => [
'name' => 'Средний',
'size' => [300, 200],
],
'large' => [
'name' => 'Большой',
'size' => [500, 400],
],
],
],
],
```
By default, thumbnails are resized in "outbound" or "fill" mode. To switch to "inset" or "fit" mode, use `mode` parameter and provide. Possible values: `outbound` (`\Imagine\Image\ImageInterface::THUMBNAIL_OUTBOUND`) or `inset` (`\Imagine\Image\ImageInterface::THUMBNAIL_INSET`):
```php
'thumbs' => [
'small' => [
'name' => 'Мелкий',
'size' => [100, 100],
],
'medium' => [
'name' => 'Средний',
'size' => [300, 200],
],
'large' => [
'name' => 'Большой',
'size' => [500, 400],
'mode' => \Imagine\Image\ImageInterface::THUMBNAIL_INSET
],
],
```
Usage
------------
Simple standalone field:
```php
use pendalf89\filemanager\widgets\FileInput;
echo $form->field($model, 'original_thumbnail')->widget(FileInput::className(), [
'buttonTag' => 'button',
'buttonName' => 'Browse',
'buttonOptions' => ['class' => 'btn btn-default'],
'options' => ['class' => 'form-control'],
// Widget template
'template' => '<div class="input-group">{input}<span class="input-group-btn">{button}</span></div>',
// Optional, if set, only this image can be selected by user
'thumb' => 'original',
// Optional, if set, in container will be inserted selected image
'imageContainer' => '.img',
// Default to FileInput::DATA_URL. This data will be inserted in input field
'pasteData' => FileInput::DATA_URL,
// JavaScript function, which will be called before insert file data to input.
// Argument data contains file data.
// data example: [alt: "Ведьма с кошкой", description: "123", url: "/uploads/2014/12/vedma-100x100.jpeg", id: "45"]
'callbackBeforeInsert' => 'function(e, data) {
console.log( data );
}',
]);
echo FileInput::widget([
'name' => 'mediafile',
'buttonTag' => 'button',
'buttonName' => 'Browse',
'buttonOptions' => ['class' => 'btn btn-default'],
'options' => ['class' => 'form-control'],
// Widget template
'template' => '<div class="input-group">{input}<span class="input-group-btn">{button}</span></div>',
// Optional, if set, only this image can be selected by user
'thumb' => 'original',
// Optional, if set, in container will be inserted selected image
'imageContainer' => '.img',
// Default to FileInput::DATA_IDL. This data will be inserted in input field
'pasteData' => FileInput::DATA_ID,
// JavaScript function, which will be called before insert file data to input.
// Argument data contains file data.
// data example: [alt: "Ведьма с кошкой", description: "123", url: "/uploads/2014/12/vedma-100x100.jpeg", id: "45"]
'callbackBeforeInsert' => 'function(e, data) {
console.log( data );
}',
]);
```
With TinyMCE:
```php
use pendalf89\filemanager\widgets\TinyMCE;
<?= $form->field($model, 'content')->widget(TinyMCE::className(), [
'clientOptions' => [
'language' => 'ru',
'menubar' => false,
'height' => 500,
'image_dimensions' => false,
'plugins' => [
'advlist autolink lists link image charmap print preview anchor searchreplace visualblocks code contextmenu table',
],
'toolbar' => 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | code',
],
]); ?>
```
In model you must set mediafile behavior like this example:
```php
use pendalf89\filemanager\behaviors\MediafileBehavior;
public function behaviors()
{
return [
'mediafile' => [
'class' => MediafileBehavior::className(),
'name' => 'post',
'attributes' => [
'thumbnail',
],
]
];
}
```
Than, you may get mediafile from your owner model.
See example:
```php
use pendalf89\filemanager\models\Mediafile;
$model = Post::findOne(1);
$mediafile = Mediafile::loadOneByOwner('post', $model->id, 'thumbnail');
// Ok, we have mediafile object! Let's do something with him:
// return url for small thumbnail, for example: '/uploads/2014/12/flying-cats.jpg'
echo $mediafile->getThumbUrl('small');
// return image tag for thumbnail, for example: '<img src="/uploads/2014/12/flying-cats.jpg" alt="Летающие коты">'
echo $mediafile->getThumbImage('small'); // return url for small thumbnail
```
<?php
/**
* Art-ER Attrattività, ricerca e territorio dell’Emilia-Romagna
* OPEN 2.0
*
* @package Open20Package
* @category CategoryName
* @author Elite Division S.r.l.
*/
namespace pendalf89\filemanager\assets;
use yii\web\AssetBundle;
class FileInputAsset extends AssetBundle
{
public $sourcePath = '@vendor/pendalf89/yii2-filemanager/assets/source';
public $js = [
'js/fileinput.js',
];
public $depends = [
'yii\bootstrap\BootstrapAsset',
'yii\web\JqueryAsset',
'pendalf89\filemanager\assets\ModalAsset',
];
}
<?php
/**
* Art-ER Attrattività, ricerca e territorio dell’Emilia-Romagna
* OPEN 2.0
*
* @package Open20Package
* @category CategoryName
* @author Elite Division S.r.l.
*/
namespace pendalf89\filemanager\assets;
use yii\web\AssetBundle;
class FilemanagerAsset extends AssetBundle
{
public $sourcePath = '@vendor/pendalf89/yii2-filemanager/assets/source';
public $css = [
'css/filemanager.css',
];
public $js = [
'js/filemanager.js',
];
public $depends = [
'yii\bootstrap\BootstrapAsset',
'yii\web\JqueryAsset',
];
}
<?php
/**
* Art-ER Attrattività, ricerca e territorio dell’Emilia-Romagna
* OPEN 2.0
*
* @package Open20Package
* @category CategoryName
* @author Elite Division S.r.l.
*/
namespace pendalf89\filemanager\assets;
use yii\web\AssetBundle;
class ModalAsset extends AssetBundle
{
public $sourcePath = '@vendor/pendalf89/yii2-filemanager/assets/source';
public $css = [
'css/modal.css',
];
public $depends = [
'yii\bootstrap\BootstrapAsset',
];
}
/*------------------------------------*\
#VARIABLES
\*------------------------------------*/
/*------------------------------------*\
#MAIN
\*------------------------------------*/
#header {
font-size: 1.4em;
margin-bottom: 10px;
border-bottom: 1px solid #e5e5e5;
padding-bottom: 5px;
}
/*------------------------------------*\
#ITEMS
\*------------------------------------*/
.list-view {
float: left;
width: 660px;
}
.list-view .items {
border-right: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
.list-view .items .item {
display: inline-block;
margin-bottom: 3px;
}
.list-view .items .item a {
position: relative;
display: inline-block;
color: #5ba6f7;
}
.list-view .items .item a img {
min-width: 128px;
min-height: 128px;
opacity: .8;
}
.list-view .items .item a img:hover {
opacity: 1;
}
.list-view .items .item a .checked {
display: none;
position: absolute;
top: 5px;
right: 6px;
font-size: 3em;
}
.list-view .items .item .active {
outline: 5px solid #5ba6f7;
outline-offset: -5px;
}
.list-view .items .item .active img {
opacity: 1;
}
.list-view .items .item .active .checked {
display: inline-block;
}
/*------------------------------------*\
#PAGINATION
\*------------------------------------*/
.pagination {
display: block;
margin-top: 10px;
}
/*------------------------------------*\
#DASHBOARD
\*------------------------------------*/
.dashboard {
width: 290px;
float: left;
padding-left: 10px;
}
.dashboard .loading {
width: 298px;
margin-top: 50px;
font-size: 5em;
color: #5ba6f7;
text-align: center;
}
/*------------------------------------*\
#UPLOAD MANAGER
\*------------------------------------*/
#uploadmanager {
padding: 0 15px 0 0;
}
#uploadmanager .progress {
margin-top: 10px;
}
/*------------------------------------*\
#FILEINFO
\*------------------------------------*/
#fileinfo img {
float: left;
max-width: 82px;
}
#fileinfo .detail {
float: left;
margin: 0 0 0 10px;
padding: 0;
list-style: none;
font-size: .85em;
}
#fileinfo .filename {
clear: both;
margin-bottom: 5px;
}
#fileinfo #control-form .form-group {
margin-bottom: 0;
}
#fileinfo #control-form .control-label {
margin-bottom: 0;
font-size: .9em;
font-weight: bold;
}
#fileinfo #control-form textarea {
max-width: 100%;
}
/*------------------------------------*\
#SPIN ICONS
\*------------------------------------*/
.spin {
-webkit-animation: spin 1s infinite linear;
-moz-animation: spin 1s infinite linear;
-o-animation: spin 1s infinite linear;
animation: spin 1s infinite linear;
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
/* IE 9 */
}
@-moz-keyframes spin {
from {
-moz-transform: rotate(0deg);
}
to {
-moz-transform: rotate(360deg);
}
}
@-webkit-keyframes spin {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/*------------------------------------*\
#VARIABLES
\*------------------------------------*/
@main-color: #5ba6f7;
/*------------------------------------*\
#MAIN
\*------------------------------------*/
#header {
font-size: 1.4em;
margin-bottom: 10px;
border-bottom: 1px solid #e5e5e5;
padding-bottom: 5px;
}
/*------------------------------------*\
#ITEMS
\*------------------------------------*/
.list-view {
float: left;
width: 660px;
.items {
border-right: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5;
.item {
display: inline-block;
margin-bottom: 3px;
a {
position: relative;
display: inline-block;
color: @main-color;
img {
min-width: 128px;
min-height: 128px;
opacity: .8;
&:hover {
opacity: 1;
}
}
.checked {
display: none;