mirror/php-e107
1
0
Fork 0
mirror of https://github.com/e107inc/e107.git synced 2025-06-02 00:45:03 +02:00
Code Issues Releases Wiki Activity

Media-picker work. Add the following to e107_config.php to enable and test. define('e_DEBUG_MEDIAPICKER', true);

Browse Source
This commit is contained in:
Cameron 2018-07-25 20:28:30 -07:00
parent 9e50ae7d06
commit 557dea1f0e
7 changed files with 180 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

138
e107_admin/image.php
View File

@ -1329,10 +1329,65 @@ class media_admin_ui extends e_admin_ui
return $text;
}
/**
* Media-Manager Tabs (new in v2.1.9)
* Replacement for mediaSelectUpload()
* @return string
*/
function mediaManagerTabs()
{
$frm = e107::getForm();
$tp = e107::getParser();
$options = array();
$options['bbcode'] = ($this->getQuery('bbcode')=='img') ? 'img' : FALSE;
if(isset($_GET['from']))
{
$options['from'] .= intval($_GET['from']);
}
$cat = $this->getQuery('for');
$tabOptions = array(
'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()),
'core-media-audio' => array('caption'=> $tp->toGlyph('fa-file-audio-o')."Audio", 'text' => $this->audioTab()),
'core-media-youtube' => array('caption'=> $tp->toGlyph('fa-youtube-play')."Youtube", 'text' => $this->youtubeTab() ),
'core-media-glyphs' => array('caption'=> $tp->toGlyph('fa-flag')."Glyphs", 'text' => $this->glyphTab()),
);
$tabs = array();
// check tab options against URL
foreach($tabOptions as $key=>$val)
{
$id = str_replace('core-media-', '', $key);
if($this->getQuery($id) == 1 || $this->getQuery('bbcode') == $id)
{
$tabs[$key] = $val;
}
}
if(getperms('A|A1'))
{
$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'));
}
/**
* @deprecated by mediaManagerTabs
* @param string $type
* @return string
*/
function mediaSelectUpload($type='image')
{
$frm = e107::getForm();
$tp = e107::getParser();
if($type === 'video')
{
@ -1343,7 +1398,10 @@ class media_admin_ui extends e_admin_ui
return $frm->tabs($tabs, array('class'=>'media-manager'));
}
if(deftrue('e_DEBUG_MEDIAPICKER'))
{
return $this->mediaManagerTabs();
}
$youtubeActive = 'inactive';
@ -1356,11 +1414,11 @@ class media_admin_ui extends e_admin_ui
if($this->getQuery('bbcode') != 'video' && $this->getQuery('bbcode') != 'glyph')
{
$text .= "<li class='active'><a data-toggle='tab' href='#core-media-select'>".IMALAN_151."</a></li>\n";
$text .= "<li class='active'><a data-toggle='tab' href='#core-media-select'>".ADLAN_105."</a></li>\n";
}
else
{
if($this->getQuery('bbcode') == 'glyph')
if($this->getQuery('bbcode') == 'glyphs')
{
$glyphActive = 'active';
}
@ -1372,32 +1430,27 @@ class media_admin_ui extends e_admin_ui
}
if(getperms('A|A1') && ($this->getQuery('bbcode') != 'video' && $this->getQuery('bbcode') !='glyph'))
{
$text .= "<li><a data-toggle='tab' href='#core-media-upload'>".IMALAN_150."</a></li>";
}
if(varset($options['bbcode']) == 'img')
{
$text .= "<li><a data-toggle='tab' href='#core-media-style'>".IMALAN_152."</a></li>\n";
$text .= "<li><a data-toggle='tab' href='#core-media-style'>".IMALAN_152."</a></li>\n";
}
if($this->getQuery('glyphs') == 1 || $this->getQuery('bbcode') == 'glyph')
{
$text .= "<li class='{$glyphActive}'><a data-toggle='tab' href='#core-media-glyphs'>Glyphs</a></li>\n";
}
if($this->getQuery('video') == 1 || $this->getQuery('bbcode') == 'video')
{
$text .= "<li class='{$youtubeActive}'><a data-toggle='tab' href='#core-media-youtube'>Youtube</a></li>\n";
$text .= "<li class='{$videoActive}'><a data-toggle='tab' href='#core-media-video'>".IMALAN_163."</a></li>\n";
$text .= "<li class='{$youtubeActive}'><a data-toggle='tab' href='#core-media-youtube'>"."Youtube</a></li>\n";
}
if($this->getQuery('audio') == 1 || $this->getQuery('bbcode') == 'audio')
{
$text .= "<li class='{$videoActive}'><a data-toggle='tab' href='#core-media-audio'>Audio</a></li>\n";
if($this->getQuery('glyphs') == 1 || $this->getQuery('bbcode') == 'glyph')
{
$text .= "<li class='{$glyphActive}'><a data-toggle='tab' href='#core-media-glyphs'>"."Glyphs</a></li>\n";
}
if(getperms('A|A1') && ($this->getQuery('bbcode') != 'video' && $this->getQuery('bbcode') !='glyph'))
{
$text .= "<li><a data-toggle='tab' href='#core-media-upload'>".IMALAN_150."</a></li>";
}
@ -1447,7 +1500,7 @@ class media_admin_ui extends e_admin_ui
*
*/
if($options['bbcode']) //TODO LAN lan_image.php
if($options['bbcode']) //TODO move to imagestyleTab();
{
$text .= "<div class='tab-pane' id='core-media-style'>
@ -1511,43 +1564,32 @@ class media_admin_ui extends e_admin_ui
</div>";
}
if($this->getQuery('glyphs') == 1 || $this->getQuery('bbcode') == 'glyph')
{
//TODO
$text .= "<div class='tab-pane clearfix {$glyphActive}' id='core-media-glyphs' style='font-size:24px'>";
$text .= $this->glyphTab();
$text .= "</div>
";
}
if($this->getQuery('video') || $this->getQuery('bbcode') == 'video')
{
$text .= "<div class='tab-pane clearfix {$youtubeActive}' id='core-media-youtube' >";
// $text .= "<div class='row-fluid'>";
$text .= $this->youtubeTab();
$text .= "</div>";
$text .= "<div class='tab-pane clearfix {$videoActive}' id='core-media-video' >";
// $text .= "<div class='row-fluid'>";
$text .= $this->videoTab();
$text .= "</div>";
}
if($this->getQuery('audio') || $this->getQuery('bbcode') == 'audio')
{
$text .= "<div class='tab-pane clearfix {$videoActive}' id='core-media-audio' >";
// $text .= "<div class='row-fluid'>";
$text .= $this->audioTab();
$text .= "</div>";
}
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 .= $this->glyphTab();
$text .= "</div>
";
}
$text .= "</div>";
@ -1654,6 +1696,7 @@ class media_admin_ui extends e_admin_ui
'saveValue' => $val['media_url'],
'thumbUrl' => $tp->thumbUrl($val['media_url'], array('w'=>340, 'h'=>220)),
'title' => $val['media_name'],
'tooltip' => basename($val['media_url'])." (".$val['media_dimensions'].")",
'slideCaption' => '',
'slideCategory' => 'bootstrap',
'mime' => $val['media_type']
@ -1742,7 +1785,7 @@ class media_admin_ui extends e_admin_ui
}
function videoTab($parm=array())
private function videoTab($parm=array())
{
$tp = e107::getParser();
@ -1764,13 +1807,18 @@ class media_admin_ui extends e_admin_ui
$videos = e107::getMedia()->getVideos();
foreach($videos as $val)
{
$size = e107::getFile()->file_size_encode($val['media_size']);
$items[] = array(
'previewHtml' => $tp->toVideo($val['media_url'], array('w'=>210, 'h'=>140)), // e_IMAGE_ABS."generic/playlist_120.png",
'saveValue' => $val['media_url'],
'thumbUrl' => $val['media_url'],
'title' => $val['media_name'],
'tooltip' => basename($val['media_url'])." (".$size.")",
'slideCaption' => '',
'slideCategory' => 'bootstrap',
'mime' => $val['media_type']
@ -2053,7 +2101,9 @@ class media_admin_ui extends e_admin_ui
else // empty key.
{
$link = '<a style="color:black" target="_blank" href="'.e_ADMIN.'image.php?mode=main&action=prefs#/tab2">'.IMALAN_177.'</a>';
$items = "<div class='alert alert-info'><p>".e107::getParser()->lanVars(e107::getParser()->toHTML(IMALAN_174, true), array('x'=>$link))."</p></div>";
$items = "
<div class='alert alert-info' style='margin-left: 15px;'><p>".e107::getParser()->lanVars(e107::getParser()->toHTML(IMALAN_174, true), array('x'=>$link))."</p>
</div>";
}

9
e107_admin/newspost.php
View File

@ -1752,15 +1752,8 @@ class news_form_ui extends e_admin_form_ui
}
}
if(deftrue('e_DEBUG_MEDIAPICKER'))
{
$text = $frm->mediapicker('news_thumbnail[0]', varset($thumbTmp[0]),'media=news&image=1&video=1&audio=1');
}
else
{
$text = $frm->imagepicker('news_thumbnail[0]', varset($thumbTmp[0]), varset($paths[0]),'media=news&video=1&legacyPath={e_IMAGE}newspost_images');
}
$text = $frm->imagepicker('news_thumbnail[0]', varset($thumbTmp[0]), varset($paths[0]),'media=news&video=1&legacyPath={e_IMAGE}newspost_images');
$text .= $frm->imagepicker('news_thumbnail[1]', varset($thumbTmp[1]), varset($paths[1]),'media=news&video=1&legacyPath={e_IMAGE}newspost_images');
$text .= $frm->imagepicker('news_thumbnail[2]', varset($thumbTmp[2]), varset($paths[2]),'media=news&video=1&legacyPath={e_IMAGE}newspost_images');
$text .= $frm->imagepicker('news_thumbnail[3]', varset($thumbTmp[3]), varset($paths[3]),'media=news&video=1&legacyPath={e_IMAGE}newspost_images');

3
e107_handlers/e_parse_class.php
View File

@ -4109,8 +4109,9 @@ class e_parser
$idAtt = (!empty($parm['id'])) ? "id='".$parm['id']."' " : '';
$style = (!empty($parm['style'])) ? "style='".$parm['style']."' " : '';
$class = (!empty($parm['class'])) ? $parm['class']." " : '';
$placeholder = isset($parm['placeholder']) ? $parm['placeholder'] : "<!-- -->";
$text = "<".$tag." {$idAtt}class='".$class.$prefix.$id.$size.$spin.$rotate.$fixedW."' {$style}><!-- --></".$tag.">" ;
$text = "<".$tag." {$idAtt}class='".$class.$prefix.$id.$size.$spin.$rotate.$fixedW."' {$style}>".$placeholder."</".$tag.">" ;
$text .= ($options !== false) ? $options : "";
return $text;

39
e107_handlers/form_handler.php
View File

@ -512,9 +512,10 @@ class e_form
function tabs($array,$options = array())
{
$initTab = varset($options['active'],false);
$id = !empty($options['id']) ? 'id="'.$options['id'].'"' : '';
$text ='
<!-- Nav tabs -->
<ul class="nav nav-tabs">';
<ul '.$id.' class="nav nav-tabs">';
$c = 0;
@ -998,10 +999,20 @@ class e_form
$url .= "&amp;w=".$extras['w'];
}
if(!empty($extras['image']))
{
$url .= "&amp;image=1";
}
if(!empty($extras['glyphs']))
{
$url .= "&amp;glyphs=1";
}
}
if(!empty($extras['youtube']))
{
$url .= "&amp;youtube=1";
}
if(!empty($extras['video']))
{
@ -1206,6 +1217,20 @@ 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";
@ -1365,6 +1390,8 @@ class e_form
*/
function mediapicker($name, $default, $parms = '')
{
$tp = e107::getParser();
$name_id = $this->name2id($name);
$meta_id = $name_id."-meta";
@ -1379,6 +1406,7 @@ class e_form
$parms = array();
}
if(empty($parms['media']))
{
$parms['media'] = '_common';
@ -1392,7 +1420,7 @@ class e_form
// Test Files...
// $default = '{e_MEDIA_VIDEO}2018-07/samplevideo_720x480_2mb.mp4';
// $default = '{e_MEDIA_FILE}2016-03/Colony_Harry_Gregson_Williams.mp3';
$default = '{e_PLUGIN}gallery/images/butterfly.jpg';
// $default = '{e_PLUGIN}gallery/images/butterfly.jpg';
// $default = 'NuIAYHVeFYs.youtube';
// $default = ''; // empty
@ -1402,6 +1430,7 @@ class e_form
switch($type)
{
case "video":
$preview = $tp->toVideo($default, array('w'=>$width, 'h'=> ($height - 50)));
$previewURL = $tp->toVideo($default, array('mode'=>'url'));
@ -1434,11 +1463,11 @@ class e_form
// $preview = $tp->toImage($default, array('w'=>$width, 'h'=>$height, 'class'=>'image-selector img-responsive img-fluid'));
// $previewURL = $tp->thumbUrl($default, array('w'=>800));
break;
/*
case "glyph":
$preview = $tp->toGlyph($default, array('size'=>'3x'));
$previewURL = false;
break;*/
break;
default: // blank

49
e107_handlers/media_class.php
View File

@ -1309,7 +1309,8 @@ class e_media
'thumbUrl' => $defaultThumb,
'title' => '',
'gridClass' => 'span2 col-md-2',
'bbcode' => ''
'bbcode' => '',
'tooltip' => '',
);
@ -1327,13 +1328,20 @@ class e_media
<div class='media-carousel ".$data['gridClass']."'>
<div class='well clearfix'>\n";
<div class='well clearfix media-carousel-item-container'>\n";
$caption = $data['title'];
if(!empty($data['tooltip']))
{
$data['title'] = $data['tooltip'];
}
$linkTag = $this->browserCarouselItemSelector($data);
switch($data['type'])
{
case "video":
@ -1348,11 +1356,11 @@ class e_media
$text .= $tp->toAudio($data['thumbUrl'], array('mime'=>$data['mime']));
}
$text .= "<div class='row' style='margin-top:5px'>
$text .= "<div class='row media-carousel-item-controls'>
<div class='col-md-8'><small class='media-carousel-item-caption'>";
$text .= $this->browserCarouselItemSelector($data);
$text .= "\n".$data['title'];
$text .= "\n".$caption;
$text .= "\n</a></small></div>";
$data['style'] = 'float:right';
@ -1365,17 +1373,19 @@ class e_media
case "image":
$text .= $linkTag;
$text .= "<span>";
$text .= '<img class="img-responsive img-fluid" alt="" src="'.$data['thumbUrl'].'" style="width:100%;display:inline-block" />';
$text .= "</span>";
$text .= "\n</a>\n\n";
$text .= "<div class='row' style='margin-top:5px'>
$text .= "<div class='row media-carousel-item-controls'>
<div class='col-md-8'><small class='media-carousel-item-caption'>";
$text .= $this->browserCarouselItemSelector($data);
$text .= "\n".$data['title'];
$text .= "\n".$caption;
$text .= "\n</a></small></div>";
$data['style'] = 'float:right';
@ -1393,8 +1403,9 @@ class e_media
case "glyph":
$text .= $linkTag;
$text .= "\n<span style='margin:7px;display:inline-block;color: inherit'>".$tp->toGlyph($data['thumbUrl'],false)."</span>";
$text .= "\n<span style='margin:7px;display:inline-block;color: inherit'>".$tp->toGlyph($data['thumbUrl'],array('placeholder'=>''))."</span>";
$text .= "\n</a>\n\n";
break;
@ -1531,7 +1542,7 @@ class e_media
$text .= '&nbsp;<div class="btn-group" >
<a id="'.$carouselID.'-prev" class="btn btn-primary btn-secondary" href="#'.$carouselID.'" data-slide="prev"><i class="fa fa-backward"></i></a>
<a id="'.$carouselID.'-index" class="btn btn-primary btn-secondary">1</a>
<a id="'.$carouselID.'-index" class="media-carousel-index btn btn-primary btn-secondary">1</a>
<a id="'.$carouselID.'-next" class="btn btn-primary btn-secondary" href="#'.$carouselID.'" data-slide="next"><i class="fa fa-forward"></i></a>
</div>';
@ -1558,9 +1569,11 @@ class e_media
$perPage = vartrue($parm['perPage'],12);
$c=0;
$count = 0;
$slides = array();
$totalSlides = 0;
if(is_array($data) && count($data) > 0)
{
@ -1568,21 +1581,24 @@ class e_media
foreach($data as $key=>$val)
{
if($c == 0)
{
$active = (count($slides) <1) ? ' active' : '';
$totalSlides++;
$text .= '
<!-- Start Slide -->
<!-- Start Slide '.$parm['action'].' '.$totalSlides.' -->
<div class="item'.$active.'">';
if(count($slides) > 1)
if($totalSlides > 2)
{
$text .= "<!-- ";
}
if(vartrue($val['slideCaption']))
{
$text .= "<h4>".$val['slideCaption']."</h4>";
@ -1614,9 +1630,12 @@ class e_media
}
if($c == $perPage)
$count++;
if($c == $perPage || (count($data) == $count))
{
if(count($slides) > 1)
if($totalSlides > 2)
{
$text .= " -->";
}
@ -1624,9 +1643,7 @@ class e_media
$text .= '
</div>
<!-- End Slide -->
';
<!-- End Slide '.$parm['action'].' '.$totalSlides.' -->';

10
e107_themes/bootstrap3/admin_style.css
View File

@ -266,13 +266,19 @@ td.right, th.right { text-align:right }
/* media picker */
#media-browser-container-glyph{ margin-left: 15px }
.media-carousel-item-image .well { height: 200px; overflow:hidden }
.media-carousel-item-image span { display:block; height:150px; }
.media-carousel-item-image img { width:100%; max-height: 100%; }
.media-carousel-item-video .video-responsive { padding-top: 0; }
.media-carousel-item-video video { max-width: 100%; max-height: 200px; }
.media-carousel .well:hover { border:1px solid silver }
.media-carousel-item-container { position: relative; min-height:100px; }
.media-carousel-item-controls { /*position: absolute;bottom:7px; right: 10px */ margin-top:5px;}
.media-carousel-item-container audio { width: 100% }
.media-carousel-item-glyph { width: 64px; height:64px; overflow:hidden; margin-right:5px; margin-bottom:5px }
.mediaselector-preview img,
.mediaselector-preview video,
@ -1412,7 +1418,7 @@ li.rssRow > div {
/*.media-carousel { margin-bottom:10px }*/
.media-carousel-item-glyph { width: 64px; height:64px; overflow:hidden; margin-left:5px; margin-bottom:5px }
.media-manager {padding:20px; min-height:400px }

8
e107_web/js/core/mediaManager.js
View File

@ -80,12 +80,18 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
// Ajax keyup search. Used by media-browser.
$(context).find('.e-ajax-keyup').once('media-manager-e-ajax-keyup').each(function ()
{
$(this).keyup(function ()
{
var that = this;
e107.callbacks.waitForFinalEvent(function ()
{
$(that).closest('div').find('.media-carousel-index').text('1'); // reset counter when searching.
e107.mediaManager.eAjaxKeyUp(that);
}, 300, "eAjaxKeyUp");
});
@ -611,6 +617,8 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
var src = $this.attr("data-src");
var search = $this.val();
if(search !== null)
{
search = search.replace('https://', 'url:');