1
0
mirror of https://github.com/e107inc/e107.git synced 2025-08-06 14:46:56 +02:00

Closes #4744 - Media-Manager default set to Grid. New CSS grid added. Extra tests added for toGlyph(). Added wildcard mime-type filters in Media-Manager.

This commit is contained in:
Cameron
2022-04-02 09:34:06 -07:00
parent 9e8e7966a5
commit e801b02dee
5 changed files with 230 additions and 33 deletions

View File

@@ -130,7 +130,7 @@ class media_admin extends e_admin_dispatcher
protected $adminMenu = array(
'main/list' => array('caption'=> LAN_IMA_M_01, 'perm' => 'A'),
'main/grid' => array('caption'=> LAN_IMA_M_01, 'perm' => 'A'),
// 'main/create' => array('caption'=> "Add New Media", 'perm' => 'A'), // Should be handled in Media-Import.
'main/import' => array('caption'=> LAN_IMA_M_02, 'perm' => 'A|A1'),
'divider/01' => array('divider'=>true),
@@ -160,8 +160,8 @@ class media_admin extends e_admin_dispatcher
protected $adminMenuAliases = array(
'main/edit' => 'main/list',
'main/grid' => 'main/list'
'main/edit' => 'main/grid',
'main/list' => 'main/grid'
);
protected $menuTitle = LAN_MEDIAMANAGER;
@@ -206,7 +206,7 @@ class media_cat_ui extends e_admin_ui
function init()
{
$this->restricted = array(
'_common' => '_common',
'_icon' => '_icon',
@@ -338,6 +338,7 @@ class media_cat_form_ui extends e_admin_form_ui
$owner = $this->getController()->getListModel()->get('media_cat_owner');
if(!in_array($owner,$this->restrictedOwners))
{
return $this->renderValue('options',$value,null,$id);
}
@@ -664,9 +665,11 @@ class media_form_ui extends e_admin_form_ui
$tagid = vartrue($_GET['tagid']);
$tagid = e107::getParser()->filter($tagid);
$path = $this->getController()->getListModel()->get('media_url');
$title = $this->getController()->getListModel()->get('media_name');
$id = $this->getController()->getListModel()->get('media_id');
$model = $this->getController()->getListModel();
$path = $model->get('media_url');
$title = $model->get('media_name');
$id = $model->get('media_id');
$preview = basename($path);
$bbcode = (vartrue($_GET['bbcode']) === 'file') ? 'file' : '';
@@ -693,7 +696,37 @@ class media_form_ui extends e_admin_form_ui
}
else
{
$text = $this->renderValue('options',$value,null,$id);
if($dimensions = $model->get('media_dimensions'))
{
$title .= " (".$dimensions.")";
}
$type = $model->get('media_type');
$action = $this->getController()->getAction();
$att = ['query' => e_QUERY."&after=".$action];
$url = $this->media_sef('', 'read', ['url'=>1]);
$modal = (strpos($type, 'application') === false) ? 'e-modal' : '';
if($action === 'grid')
{
$text = "<a class='btn btn-default ".$modal."' title='".LAN_VIEW."' href='".$url."' data-modal-caption=\"".$title."\" target='_blank'>".$this->tp->toGlyph('e-search-16')."</a>";
$att['icons'] = [
'edit' => $this->tp->toGlyph('e-edit-16'),
'delete' => $this->tp->toGlyph('e-delete-16'),
];
$text .= $this->renderValue('options',$value,$att,$id);
}
else
{
// $text = "<a class='btn btn-default ".$modal."' href='".$url."' data-modal-caption=\"".$title."\" target='_blank'>".$this->tp->toGlyph('e-search-32')."</a>";
$text = $this->renderValue('options',$value,$att,$id);
}
}
return "<div class='nowrap'>".$text. '</div>';
@@ -726,8 +759,9 @@ class media_form_ui extends e_admin_form_ui
if($this->getController()->getAction() === 'grid')
{
$size = 250;
return "<div style='min-height:250px'>".e107::getMedia()->previewTag($value, array('type'=>$type, 'w'=>250, 'h'=>$size, 'crop'=>1)). '</div>';
$size = 235;
// min-height:".$size."px
return "<div>".e107::getMedia()->previewTag($value, array('type'=>$type, 'w'=>$size, 'h'=>$size, 'crop'=>1)). '</div>';
}
$size = ($mode === 'write') ? 400 : 180;
@@ -765,7 +799,13 @@ class media_form_ui extends e_admin_form_ui
}
$url = SITEURLBASE.$path;
return "<a href='".$url."' rel='external' title='".LAN_EFORM_010."'><small>".$url. '</small></a>';
if(!empty($attributes['url']))
{
return $url;
}
return "<a href='".$url."' rel='external' title='".LAN_EFORM_010."' target='_blank'><small>".$url. '</small></a>';
}
@@ -827,7 +867,7 @@ class media_admin_ui extends e_admin_ui
public $deleteConfirmScreen = true;
public $deleteConfirmMessage = IMALAN_129;
protected $grid = array('title'=>'media_name', 'image'=>'media_preview', 'body'=>'', 'class'=>'col-sm-6 col-md-4 col-lg-2', 'perPage'=>12, 'carousel'=>false);
protected $grid = array('id'=>'media_id', 'title'=>'media_name', 'image'=>'media_preview', 'body'=>'', 'class'=>'col-sm-6 col-md-4 col-lg-2', 'perPage'=>24, 'carousel'=>false);
protected $preftabs = array(IMALAN_78,IMALAN_89, 'Youtube');
@@ -880,7 +920,10 @@ class media_admin_ui extends e_admin_ui
'image_post_class' => array('title'=> IMALAN_10, 'type' => 'userclass', 'data'=>'int', 'writeParms'=>'help=IMALAN_11&classlist=public,guest,nobody,member,admin,main,classes' ),
'image_post_disabled_method' => array('title'=> IMALAN_12, 'type' => 'boolean','writeParms'=>'enabled=IMALAN_15&disabled=IMALAN_14'),
'resize_method' => array('title'=> IMALAN_3, 'type'=>'method', 'data'=>'str'),
// XXX TBD 'thumbnail_per_page' => array('title'=> "Thumbnails per page", 'type'=>'dropdown', 'data'=>'int', 'help'=>'Applies to the Media Library page', 'writeParms'=>['optArray'=> [8=>8, 12=>12, 16=>16, 24=>24, 36=>36, 48=>48]]),
'thumbnail_quality' => array('title'=> IMALAN_73, 'type'=>'number', 'data'=>'int', 'writeParms'=>'', 'help'=>IMALAN_74),
// 'convert_to_jpeg' => array('title'=> IMALAN_182, 'type'=>'number', 'data'=>'int', 'writeParms'=> array('tdClassRight'=>'form-inline', 'post'=> CORE_LAN_KB), 'help'=>IMALAN_183),
'convert_to_jpeg' => array('title'=> IMALAN_182, 'type'=>'boolean', 'data'=>'int', 'writeParms'=>'', 'help'=>IMALAN_183),
@@ -939,7 +982,7 @@ class media_admin_ui extends e_admin_ui
$sql = e107::getDb();
// $sql->gen("SELECT media_cat_title, media_title_nick FROM #core_media as m LEFT JOIN #core_media_cat as c ON m.media_category = c.media_cat_owner GROUP BY m.media_category");
$sql->gen('SELECT media_cat_title, media_cat_owner, media_cat_category FROM `#core_media_cat`');
$sql->gen('SELECT media_cat_title, media_cat_owner, media_cat_category FROM `#core_media_cat` WHERE media_cat_title !="" ');
while($row = $sql->fetch())
{
$cat = $row['media_cat_category'];
@@ -960,6 +1003,11 @@ class media_admin_ui extends e_admin_ui
$id = $val['media_type'];
$mimeTypes[$id] = $id;
}
$mimeTypes['image/*'] = 'image/*';
$mimeTypes['video/*'] = 'video/*';
$mimeTypes['audio/*'] = 'audio/*';
$mimeTypes['application/*'] = 'application/*';
asort($mimeTypes);
$this->fields['media_category']['writeParms'] = $this->cats;
@@ -1041,6 +1089,8 @@ class media_admin_ui extends e_admin_ui
exit;
}
/*
if($this->getAction() === 'youtube')
{
@@ -1150,6 +1200,20 @@ class media_admin_ui extends e_admin_ui
}
/** Wildcard support for media-type filter */
function handleGridMediaTypeFilter($var)
{
if(strpos($var,'*')!== false)
{
$var = str_replace('*', '%', $var);
return "m.media_type LIKE '".$var."'";
}
return "m.media_type = '".$var."'";
}
/**
* Handle Batch options as defined in media_form_ui::options(); handle+action+field+Batch
* @param $selected
@@ -1223,7 +1287,76 @@ class media_admin_ui extends e_admin_ui
$this->getTreeModel()->setParam('db_query', $this->_modifyListQry(false, false, 0, false, $this->listQry))->loadBatch();
}
function EditObserver()
{
$mode = $this->getMode();
$this->afterSubmitOptions = ($mode === 'main' && ($this->getQuery('after')==='grid')) ? ['grid'=>LAN_UI_VIEW_GRID_LABEL] : true;
parent::EditObserver();
}
function CreateObserver()
{
$mode = $this->getMode();
// Return to the same 'view' based
$this->afterSubmitOptions = ($mode === 'main' && ($this->getQuery('after')==='grid')) ? ['grid'=>LAN_UI_VIEW_GRID_LABEL] : true;
parent::CreateObserver();
}
function GridObserver()
{
$this->setGridObserver();
parent::GridObserver();
}
function GridAjaxObserver()
{
$this->setGridObserver();
parent::GridAjaxObserver();
}
private function setGridObserver()
{
/* $this->grid['perPage'] = e107::pref('core', 'thumbnail_per_page',24); // XXX TBD
switch($this->grid['perPage'])
{
case 8:
$cols = '1fr 1fr 1fr 1fr'; // 4 columns.
break;
case 12:
$cols = '1fr 1fr 1fr 1fr 1fr 1fr'; // 6 columns.
break;
case 16:
case 24:
$cols = '1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr'; // 8 columns.
break;
case 36:
case 48:
$cols = '1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr'; // 12 columns.
break;
default:
// code to be executed if n is different from all labels;
}
e107::css('inline', '#core-core-media-list-grid { grid-template-columns: '.$cols.';');*/
$this->grid['template'] = '<div class="panel panel-default">
<div class="e-overlay" >{IMAGE}
<div class="e-overlay-content">
<p>{TITLE}</p>
<p>{OPTIONS}</p>
<p>{CHECKBOX} <label for="multiselect-{ID}-{ID}">'.LAN_SELECT.'</label></p>
</div>
</div>
</div>';
}
function dialogPage() // Popup dialogPage for Image Selection.
{

View File

@@ -82,7 +82,7 @@ class e_form
/**
* @var e_parse
*/
private $tp;
protected $tp;
public function __construct($enable_tabindex = false)
{
@@ -4989,6 +4989,15 @@ var_dump($select_options);*/
$editIconDefault = deftrue('ADMIN_EDIT_ICON', $tp->toGlyph('fa-edit'));
$deleteIconDefault = deftrue('ADMIN_DELETE_ICON', $tp->toGlyph('fa-trash'));
// option to set custom icons. @see e107_admin/image.php media_form_ui::options
if(!empty($attributes['icons']))
{
$editIconDefault = !empty($attributes['icons']['edit']) ? $attributes['icons']['edit'] : $editIconDefault;
$deleteIconDefault = !empty($attributes['icons']['delete']) ? $attributes['icons']['delete'] : $deleteIconDefault;
unset($attributes['icons']);
}
/*
if($attributes['grid'])
{
@@ -5028,8 +5037,10 @@ var_dump($select_options);*/
if(($cls === false || check_class($cls)) && varset($parms['edit'],1) == 1)
{
parse_str(str_replace('&amp;', '&', e_QUERY), $query); //FIXME - FIX THIS
// keep other vars in tact
$qry = isset($attributes['query']) ? $attributes['query'] : e_QUERY; // @see image.php - media_form_ui::options()
parse_str(str_replace('&amp;', '&', $qry), $query); //FIXME - FIX THIS
// keep other vars in tact
$query['action'] = 'edit';
$query['id'] = $id;
@@ -5053,8 +5064,8 @@ var_dump($select_options);*/
'class' => "btn btn-default btn-secondary$eModal",
'data-modal-caption' => $eModalCap,
'title' => LAN_EDIT,
'data-toggle' => 'tooltip',
'data-bs-toggle' => 'tooltip',
// 'data-toggle' => 'tooltip',
// 'data-bs-toggle' => 'tooltip',
'data-placement' => 'left',
];

View File

@@ -1216,37 +1216,34 @@ class e_media
*/
public function previewTag($default, $options=array())
{
$tp = e107::getParser();
$type = !empty($options['type']) ? $options['type'] : $this->detectType($default);
$type = !empty($options['type']) ? $options['type'] : $this->detectType($default);
$width = vartrue($options['w'], 220);
$height = vartrue($options['h'], 190);
$crop = vartrue($options['crop'], 0);
$preview = '';
$width = vartrue($options['w'], 220);
$height = vartrue($options['h'], 190);
$crop = vartrue($options['crop'], 0);
$preview = '';
switch($type)
{
case "video":
$preview = $tp->toVideo($default, array('w'=>$width, 'h'=> ($height - 50)));
// $previewURL = $tp->toVideo($default, array('mode'=>'url'));
break;
break;
case "audio":
$preview = $tp->toAudio($default);
// $previewURL = false;
break;
break;
case "image":
$preview = $tp->toImage($default, array('w'=>$width, 'h'=>$height, 'crop'=>$crop, 'class'=> varset($options['class'],'image-selector img-responsive img-fluid'), 'legacy'=>varset($options['legacyPath'])));
// $previewURL = $tp->thumbUrl($default, array('w'=>800));
break;
break;
case "application": // file.
// $preview = $tp->toImage($default, array('w'=>$width, 'h'=>$height, 'class'=>'image-selector img-responsive img-fluid'));
// $previewURL = $tp->thumbUrl($default, array('w'=>800));
break;
$preview = "<div class='text-center' style='padding-top:40px; padding-bottom:40px'>".defset('LAN_FILE', 'File')."</div>";
break;
case "glyph":
$preview = $tp->toGlyph($default);
@@ -1254,7 +1251,6 @@ class e_media
case "icon":
$preview = $tp->toIcon($default);
// $previewURL = false;
break;
default: // blank

View File

@@ -2201,6 +2201,42 @@ EXPECTED;
}
// test options.
$this->tp->setFontAwesome(5);
$opts = array(
0 => ['size'=>'3x', 'expected' => "<i class='fas fa-camera fa-3x' ></i>"],
1 => ['spin'=>1, 'expected' => "<i class='fas fa-camera fa-spin' ></i>"],
2 => ['rotate'=>180, 'expected' => "<i class='fas fa-camera fa-rotate-180' ></i>"],
3 => ['fw'=>1, 'expected' => "<i class='fas fa-camera fa-fw' ></i>"],
);
foreach($opts as $parm)
{
$expected = $parm['expected'];
unset($parm['expected']);
$result = $this->tp->toGlyph('fa-camera', $parm);
$this->assertSame($expected, $result);
}
// test options.
$this->tp->setFontAwesome(4);
$opts = array(
0 => ['size'=>'3x', 'expected' => "<i class='fa fa-camera fa-3x' ></i>"],
1 => ['spin'=>1, 'expected' => "<i class='fa fa-camera fa-spin' ></i>"],
2 => ['rotate'=>180, 'expected' => "<i class='fa fa-camera fa-rotate-180' ></i>"],
3 => ['fw'=>1, 'expected' => "<i class='fa fa-camera fa-fw' ></i>"],
);
foreach($opts as $parm)
{
$expected = $parm['expected'];
unset($parm['expected']);
$result = $this->tp->toGlyph('fa-camera', $parm);
$this->assertSame($expected, $result);
}
}
function testToGlyphFallback()

View File

@@ -132,6 +132,7 @@ cursor: help;
}
@media (max-width: 992px){
.core-mainpanel-block { width:20%; }
}
@media (max-width: 768px){
.core-mainpanel-block { width:25%; }
@@ -219,6 +220,26 @@ td .file.well { margin-bottom:0 }
#admin-ui-media-manager-search { margin-bottom: 20px }
/* Media manager */
#core-core-media-list-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap:15px; margin:0 0 15px 0; }
#core-core-media-list-grid:before { content:none; }
#core-core-media-list-grid .admin-ui-grid { width: 100%;padding: 0; }
#core-core-media-list-grid .admin-ui-grid .panel { height:100%; padding:0; margin:0px !important; }
@media (max-width: 1400px )
{
#core-core-media-list-grid { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr }
}
@media (max-width: 1200px )
{
#core-core-media-list-grid { grid-template-columns: 1fr 1fr 1fr 1fr }
}
@media (max-width: 800px )
{
#core-core-media-list-grid { grid-template-columns: 1fr 1fr }
}
/*
.panel-default:hover { transition: color .50s ease-in-out; -moz-transition: color .50s ease-in-out; -webkit-transition: color .50s ease-in-out; color: #fff }