Navigation Menu

Skip to content
This repository has been archived by the owner on Nov 25, 2020. It is now read-only.

Commit

Permalink
Rework LogoWidget to take a parameter for the image (plugin.id/parame…
Browse files Browse the repository at this point in the history
…ter_name), and adapt the various minisite templates. We should clean all this awfull css.
  • Loading branch information
cdujeu committed Sep 19, 2014
1 parent 5b1a77f commit 92e95ee
Show file tree
Hide file tree
Showing 5 changed files with 118 additions and 61 deletions.
4 changes: 2 additions & 2 deletions core/src/conf/bootstrap_context.php
Expand Up @@ -65,9 +65,9 @@


// DEBUG OPTIONS
define("AJXP_CLIENT_DEBUG" , false);
define("AJXP_CLIENT_DEBUG" , true );
define("AJXP_SERVER_DEBUG" , false);
define("AJXP_SKIP_CACHE" , false);
define("AJXP_SKIP_CACHE" , true );


// PBKDF2 CONSTANTS FOR A SECURE STORAGE OF PASSWORDS
Expand Down
74 changes: 46 additions & 28 deletions core/src/plugins/action.share/res/minisite.php
Expand Up @@ -50,35 +50,21 @@
#ajxp_embed_template #display_toolbar,
#ajxp_dropbox_template #display_toolbar
{
width: 200px;
}
#breadcrumb span.icon-refresh.ajxp-goto-refresh {
margin-left: 5px;
opacity: 0.2;
}
.widget_logo {
background-image: url('AJXP_MINISITE_LOGO');
background-repeat: no-repeat;
background-position: right 5px;
background-size: 170px;
margin-right: 5px;
position: absolute;
top: 0;
right: 0;
height: 70px;
width: 180px;
z-index: 50;
width: 430px;
white-space: nowrap;
font-size: 12px;
}
#ajxp_embed_template .widget_logo
#ajxp_dropbox_template #inline_toolbar span.actionbar_button_label,
#ajxp_embed_template #inline_toolbar span.actionbar_button_label,
#ajxp_embed_template #minisite_toolbar span.actionbar_button_label,
#ajxp_dropbox_template #minisite_toolbar span.actionbar_button_label,
#ajxp_film_strip #minisite_toolbar span.actionbar_button_label,
#ajxp_film_strip #inline_toolbar span.actionbar_button_label
{
top: inherit;
bottom: 0;
left: 0;
right: inherit;
height: 95px;
display: inline-block;
margin-left: 2px;
margin-right: 6px;
}
#ajxp_dropbox_template .widget_logo {
Expand All @@ -97,14 +83,45 @@
}
#ajxp_dropbox_template #browser{
background-color: rgb(54, 60, 68);
padding: 15px;
}
#ajxp_dropbox_template #content_pane{
border: 5px dotted rgb(233, 233, 233) !important;
margin: 8px 8px 20px;
margin: 0 5px 30px;
padding: 10px;
border-radius: 10px;
}
#breadcrumb span.icon-refresh.ajxp-goto-refresh {
margin-left: 5px;
opacity: 0.2;
}
.widget_logo {
/*
background-image: url('AJXP_MINISITE_LOGO');
background-position: right 5px;
background-size: 170px;
*/
background-repeat: no-repeat;
margin-right: 5px;
position: absolute;
top: 0;
right: 0;
height: 70px;
width: 180px;
z-index: 50;
}
#ajxp_embed_template .widget_logo
{
top: inherit;
bottom: 0;
left: inherit;
right: 0;
height: 95px;
}
#ajxp_shared_folder{
width:100%;
text-align:left;
Expand All @@ -113,7 +130,8 @@
position:relative;
}
#ajxp_shared_folder .widget_logo {
height: 90px;
height: 43px;
padding-top: 0 !important;
}
.action_bar{
background-color: #ffffff;
Expand Down
50 changes: 38 additions & 12 deletions core/src/plugins/gui.ajax/manifest.xml
Expand Up @@ -348,9 +348,15 @@
background-color: #ccc;
padding: 9px 9px 8px;
}
img.custom_logo_image{
height:90px !important;
right: 0;
top: 5px !important;
left: inherit !important;
}
</style>
<div id="browser" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height"}'>
<div class="widget_logo" ajxpClass="LogoWidget"></div>
<div id="logo_widget" class="widget_logo" ajxpClass="LogoWidget" ajxpOptions='{"imageParameter":"action.share/CUSTOM_MINISITE_LOGO"}'></div>
<div id="widget_title" ajxpClass="RepositorySimpleLabel" ajxpOptions='{"displayLabelLegend":false,"displayWorkspaceDescription":true}'></div>
<div id="breadcrumb" ajxpClass="Breadcrumb" ajxpOptions='{}'></div>
<div id="display_toolbar" ajxpClass="ActionsToolbar" ajxpOptions='{"submenuClassName":"panelHeaderMenu","submenuPosition":"bottom right","submenuOffsetTop":12,"toolbarsList":["default"],"skipBubbling":true, "skipCarousel":true,"submenuOffsetTop":2}'></div>
Expand Down Expand Up @@ -410,16 +416,16 @@
background-color: #222;
box-shadow: 0 2px 4px rgba(0,0,0,0.5);
margin-bottom:5px;
padding-top: 16px;
padding-left: 16px;
height: 112px !important;
padding-top: 3px;
padding-left: 3px;
height: 60px !important;
}
.fl-displayMode-thumb div.thumbnail_selectable_cell div.thumbLabel {
color: #555;
background-color: transparent;
}
.fl-displayMode-thumb div.thumbnail_selectable_cell{
margin: 1px 6px;
margin: 2px 2px;
}
div.thumbnail_selectable_cell{
background-color: transparent;
Expand All @@ -441,17 +447,22 @@
#diaporama_box{
position:relative;
}
img.custom_logo_image{
right: 0px !important;
left: inherit !important;
height: 65px !important;
}
</style>
<div id="browser" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height"}'>
<div class="widget_logo"></div>
<div id="logo_widget" class="widget_logo" ajxpClass="LogoWidget" ajxpOptions='{"imageParameter":"action.share/CUSTOM_MINISITE_LOGO"}'></div>
<div id="widget_title" ajxpClass="RepositorySimpleLabel" ajxpOptions='{"displayLabelLegend":false,"displayWorkspaceDescription":true}'></div>
<div id="cpane_container" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height","fitParent":"browser"}'>
<div id="cpane_header" class="panelHeader">
<div id="display_toolbar" ajxpClass="ActionsToolbar" ajxpOptions='{"submenuClassName":"panelHeaderMenu","submenuPosition":"bottom right","submenuOffsetTop":12,"toolbarsList":["minisite", "inline"],"skipBubbling":true, "skipCarousel":true,"submenuOffsetTop":2}'></div>
<div id="breadcrumb" ajxpClass="Breadcrumb" style="width:50%;" ajxpOptions='{"flexTo":"cpane_header", "flexToMargin":50}'></div>
</div>
<div id="content_pane" ajxpClass="FilesList" ajxpOptions='{"displayMode":"thumb", "fixedDisplayMode":"thumb", "fixedThumbSize":80,"replaceScroller":false, "horizontalScroll":true, "messageBoxReference":true, "fit":"content", "fitParent":"cpane_container", "cellPaddingCorrection":6, "iconBgPosition" : "5px 4px", "invisibleSelection":false}'></div>
<div id="content_pane" ajxpClass="FilesList" ajxpOptions='{"displayMode":"thumb", "fixedDisplayMode":"thumb", "fixedThumbSize":40,"replaceScroller":false, "horizontalScroll":true, "messageBoxReference":true, "fit":"content", "fitParent":"cpane_container", "cellPaddingCorrection":6, "iconBgPosition" : "5px 4px", "invisibleSelection":false}'></div>
<div id="cpane_tabs" ajxpClass="AjxpTabulator" ajxpOptions='{"fit":"height", "fitParent":"cpane_container","registerAsEditorOpener":true, "saveState":false, "defaultTabId": "","tabInfos" : [], "uniqueTab":true}'></div>
</div>
</div>
Expand Down Expand Up @@ -550,10 +561,15 @@
#display_toolbar span.actionbar_button_label {
display: inline-block !important;
margin-left: 4px !important;
}
img.custom_logo_image{
right: 0 !important;
left: inherit !important;
height: 66px !important;
}
</style>
<div id="browser" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height"}'>
<div class="widget_logo"></div>
<div id="logo_widget" class="widget_logo" ajxpClass="LogoWidget" ajxpOptions='{"imageParameter":"action.share/CUSTOM_MINISITE_LOGO"}'></div>
<div id="display_toolbar" ajxpClass="ActionsToolbar" ajxpOptions='{"submenuClassName":"panelHeaderMenu","submenuPosition":"bottom right","submenuOffsetTop":12,"toolbarsList":["inline", "minisite-share-actions"],"skipBubbling":true, "skipCarousel":true,"submenuOffsetTop":2}'></div>
<div id="widget_title" style="padding: 28px 0 22px 20px;" ajxpClass="RepositorySimpleLabel" ajxpOptions='{"displayLabelLegend":false,"displayWorkspaceDescription":true}'></div>
<div id="cpane_container" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height","fitParent":"browser"}'>
Expand Down Expand Up @@ -629,7 +645,8 @@
border-radius: 5px;
}
div.widget_logo{
height: 75px;
height: 90px;
background-position: 86px 76px !important;
}
div#widget_title{
color: rgba(255,255,255,0.8);
Expand Down Expand Up @@ -658,11 +675,16 @@
bottom: 37px;
font-size: 21px;
}
img.custom_logo_image{
right: 6px !important;
left: inherit !important;
height: 90px !important;
}
</style>
<div id="browser" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height"}'>
<div id="background_container" ajxpClass="AjxpPane" ajxpOptions='{"imageBackgroundFromConfigs":"action.share/CUSTOM_SHAREPAGE_BACKGROUND_"}'></div>
<div id="cpane_container" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height","fitParent":"browser"}'>
<div class="widget_logo"></div>
<div id="logo_widget" class="widget_logo" ajxpClass="LogoWidget" ajxpOptions='{"imageParameter":"action.share/CUSTOM_MINISITE_LOGO"}'></div>
<div id="widget_title" ajxpClass="RepositorySimpleLabel" ajxpOptions='{"displayLabelLegend":false,"displayWorkspaceDescription":true}'>
</div>
<div id="dl_toolbar" ajxpClass="ActionsToolbar" ajxpOptions='{"toolbarsList":["inline"], "skipCarousel":true}'></div>
Expand Down Expand Up @@ -700,8 +722,10 @@
<div id="breadcrumb" ajxpClass="Breadcrumb" style="width:50%;" ajxpOptions='{"flexTo":"cpane_header", "flexToMargin":30}'></div>
</div>
<div id="content_pane" ajxpClass="FilesList" ajxpOptions='{"displayMode":"detail", "detailThumbSize": 50 ,"replaceScroller":true, "messageBoxReference":true, "fit":"height", "fitParent":"cpane_container", "cellPaddingCorrection":6, "iconBgPosition" : "5px 4px", "invisibleSelection":false}' style="border: 1px solid #bbb; border-width:0 1px;"></div>
<div class="widget_logo"></div>
<div id="logo_widget" class="widget_logo" ajxpClass="LogoWidget" ajxpOptions='{"imageParameter":"action.share/CUSTOM_MINISITE_LOGO"}'></div>
</div>
<link rel="stylesheet" href="plugins/gui.ajax/res/themes/orbit/css/fontfaces.css"/>
<style>img.custom_logo_image{ height: 85px !important; top: inherit !important; bottom: 25px; }</style>
]]></template>
<template name="minisite_dropbox" element="ajxp_dropbox_template" position="top" label="share_center.163"><![CDATA[
<div id="browser" ajxpClass="AjxpPane" ajxpOptions='{"fit":"height"}'>
Expand All @@ -710,8 +734,10 @@
<div id="breadcrumb" ajxpClass="Breadcrumb" style="width:50%;" ajxpOptions='{"flexTo":"cpane_header", "flexToMargin":30}'></div>
</div>
<div id="content_pane" ajxpClass="FilesList" ajxpOptions='{"displayMode":"detail", "detailThumbSize": 50 ,"replaceScroller":true, "messageBoxReference":true, "fit":"height", "fitParent":"cpane_container", "cellPaddingCorrection":6, "iconBgPosition" : "5px 4px", "invisibleSelection":false}' style="border: 1px solid #bbb; border-width:0 1px;"></div>
<div class="widget_logo"></div>
<div id="logo_widget" class="widget_logo" ajxpClass="LogoWidget" ajxpOptions='{"imageParameter":"action.share/CUSTOM_MINISITE_LOGO"}'></div>
</div>
<link rel="stylesheet" href="plugins/gui.ajax/res/themes/orbit/css/fontfaces.css"/>
<style>img.custom_logo_image{ right: 6px !important; left: inherit !important; height: 87px !important; bottom: 3px; top: inherit !important; }</style>
]]></template>
<component_config className="FilesList">
<property name="thumbSize" value="64"/>
Expand Down
2 changes: 1 addition & 1 deletion core/src/plugins/gui.ajax/res/js/ajaxplorer.js

Large diffs are not rendered by default.

49 changes: 31 additions & 18 deletions core/src/plugins/gui.ajax/res/js/ajaxplorer/class.LogoWidget.js
Expand Up @@ -19,9 +19,17 @@
*/
Class.create("LogoWidget", AjxpPane, {

_imageParameter:null,
_imagePlugin:null,

initialize : function($super, element, options){
$super(element, options);
var configs = ajaxplorer.getPluginConfigs("guidriver");
var paramLocation = options.imageParameter || "gui.ajax/CUSTOM_TOP_LOGO";
var parts = paramLocation.split("/");
this._imagePlugin = parts[0];
this._imageParameter = parts[1];

var configs = ajaxplorer.getPluginConfigs(this._imagePlugin);
this.updateConfig(configs);
if(options.link){
var linkTitle;
Expand Down Expand Up @@ -75,7 +83,7 @@ Class.create("LogoWidget", AjxpPane, {
}else{
this.titleDiv.update(configs.get("CUSTOM_TOP_TITLE"));
}
if(!configs.get("CUSTOM_TOP_LOGO") || configs.get("CUSTOM_TOP_LOGO") == 'ajxp-remove-original'){
if(!configs.get(this._imageParameter) || configs.get(this._imageParameter) == 'ajxp-remove-original'){
if(this.image){
if(this.image.parentNode) this.image.remove();
this.image = null;
Expand All @@ -86,25 +94,27 @@ Class.create("LogoWidget", AjxpPane, {
this.titleDiv.remove();
this.titleDiv = null;
}
var defaultImage = ajaxplorer.getDefaultImageFromParameters("gui.ajax", "CUSTOM_TOP_LOGO");
if((configs.get("CUSTOM_TOP_LOGO") || defaultImage) && configs.get("CUSTOM_TOP_LOGO") != 'ajxp-remove-original'){
var defaultImage = ajaxplorer.getDefaultImageFromParameters(this._imagePlugin, this._imageParameter);
if((configs.get(this._imageParameter) || defaultImage) && configs.get(this._imageParameter) != 'ajxp-remove-original'){
var parameter = 'binary_id';
if(configs.get("CUSTOM_TOP_LOGO_ISTMP")){
if(configs.get( this._imageParameter + "_ISTMP")){
parameter = 'tmp_file';
}
var url;
if(configs.get("CUSTOM_TOP_LOGO")){
var url = window.ajxpServerAccessPath + "&get_action=get_global_binary_param&"+parameter+"=" + configs.get("CUSTOM_TOP_LOGO");
if(configs.get("CUSTOM_TOP_LOGO").indexOf('plugins/') === 0){
if(configs.get(this._imageParameter)){
var url = window.ajxpServerAccessPath + "&get_action=get_global_binary_param&"+parameter+"=" + configs.get(this._imageParameter);
if(configs.get(this._imageParameter).indexOf('plugins/') === 0){
// It's not a binary but directly an image.
url = configs.get("CUSTOM_TOP_LOGO");
url = configs.get(this._imageParameter);
}
}else{
url = defaultImage;
this.imageIsDefault = true;
// Get parameters defaults
$A(["CUSTOM_TOP_LOGO_H", "CUSTOM_TOP_LOGO_W","CUSTOM_TOP_LOGO_L", "CUSTOM_TOP_LOGO_T"]).each(function(param){
configs.set(param, parseInt(XPathGetSingleNodeText(ajaxplorer.getXmlRegistry(), "plugins/*[@id='gui.ajax']/server_settings/global_param[@name='"+param+"']/@default")));
$A([this._imageParameter + "_H", this._imageParameter + "_W",this._imageParameter + "_L", this._imageParameter + "_T"]).each(function(param){
var v = XPathGetSingleNodeText(ajaxplorer.getXmlRegistry(), "plugins/*[@id='gui.ajax']/server_settings/global_param[@name='"+param+"']/@default");
if(!v) v = 0;
configs.set(param, parseInt(v));
});
}
if(!this.image){
Expand All @@ -120,7 +130,7 @@ Class.create("LogoWidget", AjxpPane, {
this.resizeImage(configs, false);
}.bind(this);
}
}else if(configs.get("CUSTOM_TOP_LOGO") == 'ajxp-remove-original' && this.image){
}else if(configs.get(this._imageParameter) == 'ajxp-remove-original' && this.image){
if(this.image.parentNode) this.image.remove();
this.image = null;
this.htmlElement.setAttribute('style', '');
Expand All @@ -135,19 +145,19 @@ Class.create("LogoWidget", AjxpPane, {
if(this.image){
var w = this.image.width;
var h = this.image.height;
if(configs.get("CUSTOM_TOP_LOGO_H")){
imgH = parseInt(configs.get("CUSTOM_TOP_LOGO_H")) || h;
if(configs.get(this._imageParameter + "_H")){
imgH = parseInt(configs.get(this._imageParameter + "_H")) || h;
imgW = parseInt(imgH * w / h);
}else if(configs.get("CUSTOM_TOP_LOGO_W")){
imgW = parseInt(configs.get("CUSTOM_TOP_LOGO_W"));
}else if(configs.get(this._imageParameter + "_W")){
imgW = parseInt(configs.get(this._imageParameter + "_W"));
imgH = parseInt(imgW * h / w);
}
if(!imgW){
imgW = w;
imgH = h;
}
var imgTop = parseInt(configs.get("CUSTOM_TOP_LOGO_T")) || 0;
var imgLeft = parseInt(configs.get("CUSTOM_TOP_LOGO_L")) || 0;
var imgTop = parseInt(configs.get(this._imageParameter + "_T")) || 0;
var imgLeft = parseInt(configs.get(this._imageParameter + "_L")) || 0;
this.image.setStyle({
position : 'absolute',
height : imgH + 'px',
Expand All @@ -163,6 +173,9 @@ Class.create("LogoWidget", AjxpPane, {
this.htmlElement.setStyle({paddingTop:(ajxpBootstrap.parameters.get("theme") == 'orbit' ? 0: '9px')});
if(imgH > parseInt(this.htmlElement.getHeight())){
var elPadding = parseInt(this.htmlElement.getStyle('paddingTop')) + (imgH - parseInt(this.htmlElement.getHeight()));
if(ajxpBootstrap.parameters.get("theme") == 'orbit'){
elPadding += 9;
}
this.htmlElement.setStyle({paddingTop: elPadding + 'px'});
}
var htHeight = parseInt(this.htmlElement.getHeight());
Expand Down

0 comments on commit 92e95ee

Please sign in to comment.