mirror of
https://github.com/Combodo/iTop.git
synced 2026-04-24 11:08:45 +02:00
Add File Select widget
This commit is contained in:
@@ -30,4 +30,5 @@
|
||||
@import "formtable";
|
||||
@import "formtablerow";
|
||||
@import "search-form";
|
||||
@import "field-badge";
|
||||
@import "field-badge";
|
||||
@import "file-select";
|
||||
22
css/backoffice/components/_file-select.scss
Normal file
22
css/backoffice/components/_file-select.scss
Normal file
@@ -0,0 +1,22 @@
|
||||
/*!
|
||||
* copyright Copyright (C) 2010-2020 Combodo SARL
|
||||
* license http://opensource.org/licenses/AGPL-3.0
|
||||
*/
|
||||
|
||||
$ibo-input-file-select--file-name-margin-left: 10px !default;
|
||||
|
||||
.ibo-input-file-select--container {
|
||||
|
||||
.ibo-input-file-select {
|
||||
|
||||
.ibo-input-file-select--file-input {
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ibo-input-file-select--file-name {
|
||||
margin-left: $ibo-input-file-select--file-name-margin-left;
|
||||
@extend %ibo-font-ral-med-150;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -431,6 +431,8 @@ Dict::Add('EN US', 'English', 'English', array(
|
||||
'UI:Treeview:CollapseAll' => 'Collapse All',
|
||||
'UI:Treeview:ExpandAll' => 'Expand All',
|
||||
'UI:UserPref:DoNotShowAgain' => 'Do not show again',
|
||||
'UI:InputFile:NoFileSelected' => 'No File Selected',
|
||||
'UI:InputFile:SelectFile' => 'Select a file',
|
||||
|
||||
'UI:SearchToggle' => 'Search',
|
||||
'UI:ClickToCreateNew' => 'Create a %1$s',
|
||||
|
||||
@@ -412,6 +412,8 @@ Dict::Add('FR FR', 'French', 'Français', array(
|
||||
'UI:Button:Wait' => 'Patientez pendant la mise à jour des champs',
|
||||
'UI:Treeview:CollapseAll' => 'Tout replier',
|
||||
'UI:Treeview:ExpandAll' => 'Tout déplier',
|
||||
'UI:InputFile:NoFileSelected' => 'Aucun fichier sélectionné',
|
||||
'UI:InputFile:SelectFile' => 'Sélectionner un fichier',
|
||||
|
||||
'UI:SearchToggle' => 'Recherche',
|
||||
'UI:ClickToCreateNew' => 'Créer un(e) %1$s',
|
||||
|
||||
@@ -188,6 +188,8 @@ return array(
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Html\\Html' => $baseDir . '/sources/application/UI/Base/Component/Html/Html.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Html\\HtmlFactory' => $baseDir . '/sources/application/UI/Base/Component/Html/HtmlFactory.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\AbstractInput' => $baseDir . '/sources/application/UI/Base/Component/Input/AbstractInput.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\FileSelect\\FileSelect' => $baseDir . '/sources/application/UI/Base/Component/Input/FileSelect/FileSelect.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\FileSelect\\FileSelectUIBlockFactory' => $baseDir . '/sources/application/UI/Base/Component/Input/FileSelect/FileSelectUIBlockFactory.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\Input' => $baseDir . '/sources/application/UI/Base/Component/Input/Input.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\InputUIBlockFactory' => $baseDir . '/sources/application/UI/Base/Component/Input/InputUIBlockFactory.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\InputWithLabel' => $baseDir . '/sources/application/UI/Base/Component/Input/InputWithLabel.php',
|
||||
|
||||
@@ -418,6 +418,8 @@ class ComposerStaticInit0018331147de7601e7552f7da8e3bb8b
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Html\\Html' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Html/Html.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Html\\HtmlFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Html/HtmlFactory.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\AbstractInput' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Input/AbstractInput.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\FileSelect\\FileSelect' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Input/FileSelect/FileSelect.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\FileSelect\\FileSelectUIBlockFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Input/FileSelect/FileSelectUIBlockFactory.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\Input' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Input/Input.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\InputUIBlockFactory' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Input/InputUIBlockFactory.php',
|
||||
'Combodo\\iTop\\Application\\UI\\Base\\Component\\Input\\InputWithLabel' => __DIR__ . '/../..' . '/sources/application/UI/Base/Component/Input/InputWithLabel.php',
|
||||
|
||||
@@ -0,0 +1,83 @@
|
||||
<?php
|
||||
/**
|
||||
* @copyright Copyright (C) 2010-2021 Combodo SARL
|
||||
* @license http://opensource.org/licenses/AGPL-3.0
|
||||
*/
|
||||
|
||||
|
||||
namespace Combodo\iTop\Application\UI\Base\Component\Input\FileSelect;
|
||||
|
||||
|
||||
use Combodo\iTop\Application\UI\Base\UIBlock;
|
||||
use Dict;
|
||||
|
||||
class FileSelect extends UIBlock
|
||||
{
|
||||
// Overloaded constants
|
||||
public const BLOCK_CODE = 'ibo-input-file-select';
|
||||
public const DEFAULT_HTML_TEMPLATE_REL_PATH = 'base/components/input/file-select/layout';
|
||||
public const DEFAULT_JS_TEMPLATE_REL_PATH = 'base/components/input/file-select/layout';
|
||||
|
||||
/** @var string */
|
||||
private $sName;
|
||||
/** @var string */
|
||||
private $sFileName;
|
||||
/** @var string */
|
||||
private $sButtonText;
|
||||
|
||||
public function __construct(string $sName, string $sId = null)
|
||||
{
|
||||
parent::__construct($sId);
|
||||
$this->sName = $sName;
|
||||
$this->sFileName = Dict::S('UI:InputFile:NoFileSelected');
|
||||
$this->sButtonText = Dict::S('UI:InputFile:SelectFile');
|
||||
}
|
||||
|
||||
/**
|
||||
* @return string
|
||||
*/
|
||||
public function GetFileName()
|
||||
{
|
||||
return $this->sFileName;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param mixed $sFileName
|
||||
*
|
||||
* @return $this
|
||||
*/
|
||||
public function SetFileName($sFileName)
|
||||
{
|
||||
$this->sFileName = $sFileName;
|
||||
|
||||
return $this;
|
||||
}
|
||||
|
||||
/**
|
||||
* @return string
|
||||
*/
|
||||
public function GetButtonText(): string
|
||||
{
|
||||
return $this->sButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param string $sButtonText
|
||||
*
|
||||
* @return $this
|
||||
*/
|
||||
public function SetButtonText(string $sButtonText)
|
||||
{
|
||||
$this->sButtonText = $sButtonText;
|
||||
|
||||
return $this;
|
||||
}
|
||||
|
||||
/**
|
||||
* @return string
|
||||
*/
|
||||
public function GetName(): string
|
||||
{
|
||||
return $this->sName;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
<?php
|
||||
/**
|
||||
* @copyright Copyright (C) 2010-2021 Combodo SARL
|
||||
* @license http://opensource.org/licenses/AGPL-3.0
|
||||
*/
|
||||
|
||||
|
||||
namespace Combodo\iTop\Application\UI\Base\Component\Input\FileSelect;
|
||||
|
||||
|
||||
use Combodo\iTop\Application\UI\Base\AbstractUIBlockFactory;
|
||||
|
||||
class FileSelectUIBlockFactory extends AbstractUIBlockFactory
|
||||
{
|
||||
public const TWIG_TAG_NAME = 'UIFileSelect';
|
||||
public const UI_BLOCK_CLASS_NAME = FileSelect::class;
|
||||
|
||||
public static function MakeStandard(string $sName, string $sId = null): FileSelect
|
||||
{
|
||||
return new FileSelect($sName, $sId);
|
||||
}
|
||||
}
|
||||
@@ -12,7 +12,7 @@ use Combodo\iTop\Application\UI\Base\AbstractUIBlockFactory;
|
||||
|
||||
class ToolbarSpacerUIBlockFactory extends AbstractUIBlockFactory
|
||||
{
|
||||
public const TWIG_TAG_NAME = 'ToolbarSpacer';
|
||||
public const TWIG_TAG_NAME = 'UIToolbarSpacer';
|
||||
public const UI_BLOCK_CLASS_NAME = ToolbarSpacer::class;
|
||||
|
||||
/**
|
||||
|
||||
@@ -12,7 +12,7 @@ use Combodo\iTop\Application\UI\Base\AbstractUIBlockFactory;
|
||||
|
||||
class ToolbarUIBlockFactory extends AbstractUIBlockFactory
|
||||
{
|
||||
public const TWIG_TAG_NAME = 'Toolbar';
|
||||
public const TWIG_TAG_NAME = 'UIToolbar';
|
||||
public const UI_BLOCK_CLASS_NAME = Toolbar::class;
|
||||
|
||||
public static function MakeForAction(string $sId = null): Toolbar
|
||||
|
||||
17
templates/base/components/input/file-select/layout.html.twig
Normal file
17
templates/base/components/input/file-select/layout.html.twig
Normal file
@@ -0,0 +1,17 @@
|
||||
{# @copyright Copyright (C) 2010-2021 Combodo SARL #}
|
||||
{# @license http://opensource.org/licenses/AGPL-3.0 #}
|
||||
{% apply spaceless %}
|
||||
<div id="{{ oUIBlock.GetId() }}-container"
|
||||
class="ibo-input-file-select--container {% if oUIBlock.GetAdditionalCSSClassesAsString() %}{{ oUIBlock.GetAdditionalCSSClassesAsString() }}{% endif %}
|
||||
{% if oUIBlock.IsHidden() %} ibo-is-hidden{% endif %}">
|
||||
<label class="ibo-input-file-select">
|
||||
<input id="{{ oUIBlock.GetId() }}" class="ibo-input-file-select--file-input" type="file" name="{{ oUIBlock.GetName() }}">
|
||||
<span class="ibo-button ibo-is-regular ibo-is-primary">
|
||||
{{ oUIBlock.GetButtonText() }}
|
||||
</span>
|
||||
<span id="{{ oUIBlock.GetId() }}-file-name" class="ibo-input-file-select--file-name">
|
||||
{{ oUIBlock.GetFileName() }}
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
{% endapply %}
|
||||
@@ -0,0 +1,7 @@
|
||||
{# @copyright Copyright (C) 2010-2021 Combodo SARL #}
|
||||
{# @license http://opensource.org/licenses/AGPL-3.0 #}
|
||||
|
||||
$('#{{ oUIBlock.GetId() }}').bind('change', function() {
|
||||
var fileName = $(this).val().replace(/^.*[\\\/]/, '');
|
||||
$('#{{ oUIBlock.GetId() }}-file-name').html(fileName);
|
||||
});
|
||||
Reference in New Issue
Block a user