* Html5Renderer úpravy.

* Bootstrap4Renderer
contributte · Sep 24, 2017 · ed4cdc8 · ed4cdc8
1 parent e6a899e
commit ed4cdc8
Show file tree

Hide file tree

Showing 4 changed files with 93 additions and 10 deletions.
diff --git a/src/FileUploadControl.php b/src/FileUploadControl.php
@@ -2,6 +2,8 @@
 
 namespace Zet\FileUpload;
 
+use Tracy\Debugger;
+
 /**
  * Class FileUploadControl
  * @author Zechy <[email protected]>
@@ -156,11 +158,11 @@ public function __construct($name, $maxFiles, $maxFileSize = NULL) {
 		parent::__construct($name);
 		$this->maxFiles = $maxFiles;
 		if(is_null($maxFileSize)) {
-			$this->maxFileSize = $this->parseIniSize(ini_get("upload_max_filesize"));
 			$this->fileSizeString = ini_get("upload_max_filesize") . "B";
+			$this->maxFileSize = $this->parseIniSize(ini_get("upload_max_filesize"));
 		} else {
-			$this->maxFileSize = $this->parseIniSize($maxFileSize);
 			$this->fileSizeString = $maxFileSize . "B";
+			$this->maxFileSize = $this->parseIniSize($maxFileSize);
 		}
 		$this->controller = new Model\UploadController($this);
 		$this->token = uniqid();

diff --git a/src/Template/Renderer/Bootstrap4Renderer.php b/src/Template/Renderer/Bootstrap4Renderer.php
@@ -2,6 +2,8 @@
 
 namespace Zet\FileUpload\Template\Renderer;
 
+use Nette\Utils\Html;
+
 /**
  * Class Bootstrap4Renderer
  *
@@ -10,13 +12,57 @@
  */
 class Bootstrap4Renderer extends BaseRenderer {
 
+	public function init() {
+		parent::init();
+
+		$this->elements["globalProgressValue"] = null;
+		$this->elements["fileProgressValue"] = null;
+	}
+
 	/**
 	 * Sestavení výchozí šablony uploaderu.
 	 *
 	 * @return \Nette\Utils\Html
 	 */
 	public function buildDefaultTemplate() {
-		// TODO: Implement buildDefaultTemplate() method.
+		$customContainer = Html::el("div");
+
+		$this->elements["input"]->setAttribute("style", "display: none");
+		$id = $this->elements["input"]->getAttribute("id");
+		$button = Html::el("button type='button' class='btn btn-primary mb-2'");
+		$button->setAttribute("onclick", "document.getElementById('$id').click(); return false;");
+		$button->setText("Nahrát soubor");
+
+		$customContainer->addHtml($this->elements["input"]);
+		$customContainer->addHtml($button);
+
+		$globalProgress = $this->elements["globalProgress"]
+			->setAttribute("class", "progress-bar")
+			->setAttribute("style", "height: 20px");
+		$progressContainer = Html::el("div class='progress mb-2'");
+		$progressContainer->addHtml($globalProgress);
+		$customContainer->addHtml($progressContainer);
+
+		$container = $this->elements["container"];
+		$container->setName("table");
+		$container->setAttribute("class", "table");
+
+		$thead = Html::el("thead class='thead-inverse'");
+		$tr = Html::el("tr");
+		$preview = Html::el("th style='width: 25%;'");
+		$tr->addHtml($preview);
+		$filename = Html::el("th")->setText("Soubor");
+		$tr->addHtml($filename);
+		$status = Html::el("th style='width: 20%'")->setText("Stav");
+		$tr->addHtml($status);
+		$actions = Html::el("th style='width: 50px'");
+		$tr->addHtml($actions);
+		$thead->addHtml($tr);
+
+		$container->addHtml($thead);
+		$customContainer->addHtml($container);
+
+		return $customContainer;
 	}
 
 	/**
@@ -25,7 +71,30 @@ public function buildDefaultTemplate() {
 	 * @return \Nette\Utils\Html
 	 */
 	public function buildFileContainerTemplate() {
-		// TODO: Implement buildFileContainerTemplate() method.
+		$tr = Html::el("tr");
+
+		$preview = Html::el("td class='align-middle'");
+		$preview->addHtml($this->elements["imagePreview"]->setAttribute("width", "100%"));
+		$preview->addHtml($this->elements["filePreview"]->setName("span")->setAttribute("class", "badge badge-pill badge-info"));
+		$tr->addHtml($preview);
+
+		$name = Html::el("td class='align-middle'");
+		$name->addHtml($this->elements["filename"]);
+		$tr->addHtml($name);
+
+		$progressTd = Html::el("td class='align-middle'");
+		$progressContainer = Html::el("div class='progress'");
+		$progress = $this->elements["fileProgress"]->setAttribute("class", "progress-bar")
+			->setAttribute("style", "height: 10px");
+		$progressContainer->addHtml($progress);
+		$progressTd->addHtml($progressContainer);
+		$tr->addHtml($progressTd);
+
+		$delete = Html::el("td class='align-middle text-center'");
+		$delete->addHtml($this->elements["delete"]->setAttribute("class", "btn btn-outline-danger")->setText("X"));
+		$tr->addHtml($delete);
+
+		return $tr;
 	}
 
 	/**
@@ -34,6 +103,11 @@ public function buildFileContainerTemplate() {
 	 * @return \Nette\Utils\Html
 	 */
 	public function buildFileError() {
-		// TODO: Implement buildFileError() method.
+		$tr = Html::el("tr class='bg-danger text-light'");
+		$tr->addHtml($this->elements["errorMessage"]->setName("td")->addAttributes([
+			"colspan" => 4
+		]));
+
+		return $tr;
 	}
 }
diff --git a/src/Template/Renderer/Html5Renderer.php b/src/Template/Renderer/Html5Renderer.php
@@ -56,14 +56,21 @@ public function init() {
 	 */
 	public function buildDefaultTemplate() {
 		$table = $this->elements["container"];
+		$table->setAttribute("cellpadding", "5px");
 
 		// Header
 		$tr = Html::el("tr");
-		$th = Html::el("th colspan='2'");
+		$th = Html::el("th colspan='2' style='border-right: none'");
 		$th->setText("Nahrávání souborů");
 		$tr->addHtml($th);
-		$th2 = Html::el("th colspan='2'");
-		$th2->addHtml($this->elements["input"]);
+		$th2 = Html::el("th colspan='2' style='text-align: right; border-left: none'");
+		$th2->addHtml($this->elements["input"]->setAttribute("style", "display: none"));
+		$button = Html::el("button type='button'");
+		$button->setText("Nahrát soubor");
+		$id = $this->elements["input"]->getAttribute("id");
+		$button->setAttribute("onclick", "document.getElementById('$id').click(); return false;");
+		$th2->addHtml($button);
+
 		$tr->addHtml($th2);
 		$table->addHtml($tr);
 
@@ -87,7 +94,7 @@ public function buildFileContainerTemplate() {
 		$preview = Html::el("td")->addAttributes([
 			"style" => "width: 20%"
 		]);
-		$preview->addHtml($this->elements["imagePreview"]);
+		$preview->addHtml($this->elements["imagePreview"]->setAttribute("width", "100%"));
 		$preview->addHtml($this->elements["filePreview"]);
 		$tr->addHtml($preview);
 

diff --git a/src/www/fileupload/controller.js b/src/www/fileupload/controller.js
@@ -325,7 +325,7 @@ FileUploadController.prototype = {
 			this.renderer.addError(file, this.fileId, message);
 			this.fileId++;
 		} else if (file["size"] > this.config.maxFileSize) {
-			message = this.messages.maxSize.replace("%maxSize%", this.config.maxFileSize.toString());
+			message = this.messages.maxSize.replace("%maxSize%", this.config.fileSizeString);
 			this.renderer.addError(file, this.fileId, message);
 			this.fileId++;
 		} else {