1
0
mirror of https://github.com/e107inc/e107.git synced 2025-07-31 11:50:30 +02:00

MediaPicker icons tab.

This commit is contained in:
Cameron
2018-07-27 17:39:44 -07:00
parent bbb6162181
commit 8124b683c5
5 changed files with 176 additions and 32 deletions

View File

@@ -1353,6 +1353,7 @@ class media_admin_ui extends e_admin_ui
$cat = $this->getQuery('for');
$tabOptions = array(
'core-media-icons' => array('caption'=> $tp->toGlyph('fa-file-photo-o').IMALAN_72, 'text' => $this->iconTab() ),
'core-media-image' => array('caption'=> $tp->toGlyph('fa-file-photo-o').ADLAN_105, 'text' => $this->imageTab2($cat,$options) ),
'core-media-video' => array('caption'=> $tp->toGlyph('fa-file-video-o').IMALAN_163, 'text' => $this->videoTab($cat,$options)),
'core-media-audio' => array('caption'=> $tp->toGlyph('fa-file-audio-o')."Audio", 'text' => $this->audioTab($cat,$options)),
@@ -1378,7 +1379,9 @@ class media_admin_ui extends e_admin_ui
$tabs['core-media-upload'] = array('caption'=> $tp->toGlyph('fa-upload').IMALAN_150, 'text' => $this->uploadTab());
}
return $frm->tabs($tabs, array('id'=>'admin-ui-media-manager', 'class'=>'media-manager'));
$text = $frm->tabs($tabs, array('id'=>'admin-ui-media-manager', 'class'=>'media-manager'));
return $text;
}
@@ -1587,7 +1590,7 @@ class media_admin_ui extends e_admin_ui
if($this->getQuery('glyphs') == 1 || $this->getQuery('bbcode') == 'glyph')
{
$text .= "<div class='tab-pane clearfix {$glyphActive}' id='core-media-glyphs' style='font-size:24px'>";
$text .= "<div class='tab-pane clearfix {$glyphActive}' id='core-media-glyphs'>";
$text .= $this->glyphTab();
$text .= "</div>
";
@@ -1658,6 +1661,76 @@ class media_admin_ui extends e_admin_ui
return $text;
}
private function iconTab($category='',$option=array())
{
$tp = e107::getParser();
$parms = array(
'width' => 64,
'height' => 64,
'type' =>'icon', // how should it be rendered?
'category' => $category,
'tagid' => $this->getQuery('tagid'),
'action' =>'icons', // Used by AJAX to identify correct function.
'perPage' => 80,
'gridClass' => 'media-carousel-item-glyph pull-left',
'bbcode' => 'image',
'close' => 'true'
);
$items = array();
$frm = !empty($option['from']) ? $option['from'] : 0;
$limit = !empty($option['limit']) ? $option['limit'] : 200;
// $cat = ($category) ? $category."+" : ""; // the '+' loads category '_common' as well as the chosen category.
$images = e107::getMedia()->getIcons('',$frm,$limit);
foreach($images as $val)
{
$items[] = array(
'previewHtml' => $tp->toIcon($val['media_url']),
'previewUrl' => '',
'saveValue' => $val['media_url'],
'thumbUrl' => $val['media_url'],
'title' => $val['media_name'],
'tooltip' => basename($val['media_url'])." (".$val['media_dimensions'].")",
'slideCaption' => '',
'slideCategory' => 'bootstrap',
'mime' => $val['media_type']
);
}
if(!empty($option['search']))
{
$filtered = array();
if(!empty($items))
{
foreach($items as $v)
{
if(strpos($v['title'], $option['search'])!==false)
{
$filtered[] = $v;
}
}
}
$items = $filtered;
}
return e107::getMedia()->browserCarousel($items, $parms);
}
private function imageTab2($category,$option=array())
{
$tp = e107::getParser();
@@ -1861,7 +1934,7 @@ class media_admin_ui extends e_admin_ui
'tagid' => $this->getQuery('tagid'),
'action' =>'glyph', // Used by AJAX to identify correct function.
'perPage' => 80,
'gridClass' => 'media-carousel-item-glyph pull-left',
'gridClass' => 'media-carousel-item-glyph pull-left icon-preview',
'bbcode' =>'glyph',
'close' => 'true'
@@ -1870,10 +1943,13 @@ class media_admin_ui extends e_admin_ui
$items = array();
$bs2 = e107::getMedia()->getGlyphs('bs3','glyphicon-');
$md = e107::getMedia();
foreach($bs2 as $val)
{
$items[] = array(
$items[] = array(
'previewHtml' => $md->previewTag('glyphicon '.$val,array('type'=>'glyph')),
'previewUrl' => 'glyphicon '.$val,
'saveValue' => $val.'.glyph',
'thumbUrl' => $val,
@@ -1890,7 +1966,8 @@ class media_admin_ui extends e_admin_ui
foreach($fa4 as $val)
{
$items[] = array(
$items[] = array(
'previewHtml' => $md->previewTag('fa fa-'.$val,array('type'=>'glyph')),
'previewUrl' => 'fa fa-'.$val,
'saveValue' => 'fa-'.$val.'.glyph',
'thumbUrl' => 'fa-'.$val,
@@ -1918,6 +1995,7 @@ class media_admin_ui extends e_admin_ui
foreach($tmp as $val)
{
$items[] = array(
'previewHtml' => $md->previewTag($glyphConfig['class']." ".$val,array('type'=>'glyph')),
'previewUrl' => $glyphConfig['class']." ".$val,
'saveValue' => $val.'.glyph',
'thumbUrl' => $val,
@@ -2653,7 +2731,7 @@ class media_admin_ui extends e_admin_ui
// $ns->tablerender(LAN_MEDIAMANAGER." :: ".IMALAN_18, $mes->render().$text);
}
function iconsPage()
function iconsTab()
{
// $this->icon_editor();
}

View File

@@ -958,7 +958,15 @@ class e_form
*/
function iconpicker($name, $default, $label, $options = array(), $ajax = true)
{
if(deftrue('e_DEBUG_MEDIAPICKER'))
{
$options['icons'] = 1;
$options['glyphs'] = 1;
$options['w'] = 64;
$options['h'] = 64;
return $this->mediapicker($name, $default, $options);
}
$options['media'] = '_icon';
$options['legacyPath'] = "{e_IMAGE}icons";
@@ -1008,6 +1016,11 @@ class e_form
$url .= "&amp;glyphs=1";
}
if(!empty($extras['icons']))
{
$url .= "&amp;icons=1";
}
if(!empty($extras['youtube']))
{
$url .= "&amp;youtube=1";
@@ -1023,6 +1036,8 @@ class e_form
$url .= "&amp;audio=1";
}
if(!empty($extras['path']) && $extras['path'] == 'plugin')
{
$url .= "&amp;path=".deftrue('e_CURRENT_PLUGIN');
@@ -1217,19 +1232,6 @@ class e_form
function imagepicker($name, $default, $previewURL = '', $sc_parameters = '')
{
if(deftrue('e_DEBUG_MEDIAPICKER'))
{
$sc_parameters .= '&image=1';
if(strpos($sc_parameters, 'video=1')!==false) // bc fix
{
$sc_parameters .= '&youtube=1';
}
return $this->mediapicker($name, $default, $sc_parameters);
}
$tp = e107::getParser();
$name_id = $this->name2id($name);
$meta_id = $name_id."-meta";
@@ -1244,6 +1246,21 @@ class e_form
$sc_parameters = array();
}
$cat = $tp->toDB(vartrue($sc_parameters['media']));
if(deftrue('e_DEBUG_MEDIAPICKER'))
{
$sc_parameters['image'] = 1;
$sc_parameters['dropzone'] = 1;
if(!empty($sc_parameters['video'])) // bc fix
{
$sc_parameters['youtube'] = 1;
}
return $this->mediapicker($name, $default, $sc_parameters);
}
if(empty($sc_parameters['media']))
{
@@ -1299,7 +1316,7 @@ class e_form
//$width = intval(vartrue($sc_parameters['width'], 150));
$cat = $tp->toDB(vartrue($sc_parameters['media']));
if($cat == '_icon') // ICONS
{
@@ -1413,8 +1430,19 @@ class e_form
$title = !empty($parms['help']) ? "title='".$parms['help']."'" : "";
$width = vartrue($parms['w'], 220);
$height = vartrue($parms['h'], 190);
if(!isset($parms['w']))
{
$parms['w'] = 220;
}
if(!isset($parms['h']))
{
$parms['h'] = 190;
}
// $width = vartrue($parms['w'], 220);
// $height = vartrue($parms['h'], 190);
// e107::getDebug()->log($parms);
// Test Files...
@@ -1427,14 +1455,23 @@ class e_form
$class = '';
$preview = e107::getMedia()->previewTag($default,array('w'=>$width, 'h'=>$height));
if($parms['icons'])
{
$class = 'mediaselector-container-icons';
$parms['type'] = 'icon';
}
$preview = e107::getMedia()->previewTag($default,$parms);
$cat = $tp->toDB(vartrue($parms['media']));
$ret = "<div class='mediaselector-container e-tip well well-small ".$class."' {$title} style='position:relative;vertical-align:top;margin-right:25px; display:inline-block; width:".$width."px;min-height:".$height."px;'>";
$ret = "<div class='mediaselector-container e-tip well well-small ".$class."' {$title} style='position:relative;vertical-align:top;margin-right:25px; display:inline-block; width:".$parms['w']."px;min-height:".$parms['h']."px;'>";
$parms['class'] = 'btn btn-sm btn-default';
$dropzone = !empty($parms['dropzone']) ? " dropzone" : "";
// $parms['modal-delete-label'] = LAN_DELETE;
if(empty($preview))
{
$parms['title'] = LAN_ADD;
@@ -1448,7 +1485,14 @@ class e_form
$previewIcon = '';
}
$ret .= "<div id='{$name_id}_prev' class='mediaselector-preview dropzone'>";
if(!empty($parms['icons'])) // empty overlay without button.
{
$parms['class'] = '';
$editIcon = $this->mediaUrl($cat, "<span><!-- --></span>", $name_id,$parms);
}
$ret .= "<div id='{$name_id}_prev' class='mediaselector-preview".$dropzone."'>";
$ret .= $preview; // image, video. audio tag etc.
@@ -1460,6 +1504,10 @@ class e_form
$ret .= "<input type='hidden' name='{$name}' id='{$name_id}' value='{$default}' />";
$ret .= "<input type='hidden' name='mediameta_{$name}' id='{$meta_id}' value='' />";
if(empty($dropzone))
{
return $ret;
}
// Drag-n-Drop Upload
// @see https://www.dropzonejs.com/#server-side-implementation

View File

@@ -582,7 +582,7 @@ class e_media
}
e107::getDb()->gen($query);
while($row = e107::getDb()->fetch(mySQL_ASSOC))
while($row = e107::getDb()->fetch())
{
$id = $row['media_id'];
$ret[$id] = $row;
@@ -1125,7 +1125,7 @@ class e_media
{
$tp = e107::getParser();
$type = $this->detectType($default);
$type = !empty($options['type']) ? $options['type'] : $this->detectType($default);
$width = vartrue($options['w'], 220);
$height = vartrue($options['h'], 190);
@@ -1167,7 +1167,12 @@ class e_media
break;
case "glyph":
$preview = $tp->toGlyph($default, array('size'=>'3x'));
$preview = "<span class='icon-preview'>".$tp->toGlyph($default)."</span>";
// $previewURL = false;
break;
case "icon":
$preview = $tp->toIcon($default);
// $previewURL = false;
break;
@@ -1484,6 +1489,12 @@ class e_media
break;
case "icon":
$text .= $linkTag;
$text .= "\n<span style='margin:7px;display:inline-block;color: inherit'>".$tp->toIcon($data['thumbUrl'],array('placeholder'=>''))."</span>";
$text .= "\n</a>\n\n";
break;
default:
// code to be executed if n is different from all labels;

View File

@@ -94,7 +94,7 @@ define("IMALAN_66", "Filename");
define("IMALAN_68", "Close");
define("IMALAN_69", "Folder");
define("IMALAN_70", "Non-system folder is found!");
// define("IMALAN_72", "Icons");
define("IMALAN_72", "Icons");
define("IMALAN_73", "Thumbnail Quality");
define("IMALAN_74", "Set this as low as possible before quality loss is apparent. Max. 100");
define("IMALAN_75", "Avatar Width");

View File

@@ -266,7 +266,9 @@ td.right, th.right { text-align:right }
/* media picker */
#media-browser-container-glyph{ margin-left: 15px }
#media-browser-container-glyph,
#media-browser-container-icons { margin-left: 15px }
.media-carousel-item-image .well { height: 200px; overflow:hidden }
.media-carousel-item-image span { display:block; height:150px; text-align: center; }
@@ -288,7 +290,7 @@ td.right, th.right { text-align:right }
.mediaselector-preview video { position: absolute; top: 0; }
.mediaselector-preview audio { height: 70px }
.mediaselector-preview i { padding: 20% 40%; }
.mediaselector-preview i { /*padding: 20% 40%;*/ }
.mediaselector-container .overlay {
position: absolute;
@@ -299,6 +301,11 @@ width: 100%;
right: 10px;
}
.mediaselector-container-icons { height: 64px; margin:0; }
.mediaselector-container-icons .overlay { top:0; left:0; }
.mediaselector-container-icons .overlay span { width:64px; height:64px; display:block; }
.mediaselector-container-icons .mediaselector-preview { height: auto; padding: 0; text-align: center; }
/* dropzone */
.dropzone { min-height: 100px; padding: 0 }
@@ -359,7 +366,7 @@ right: 10px;
/* icon-picker */
div.image-selector.icon-selector { width: 64px; height:64px; margin-bottom:0; font-size:32px; line-height:40px }
div.image-selector.icon-selector { width: 64px; height:64px; margin-bottom:0; line-height:40px }
div.imgselector-container a { color: inherit; }
#link-button_prev i { line-height:40px; }