add: possibility to show warning before detach image from picker

README.md

@@ -68,6 +68,7 @@ To load the image picker see below (make sure you have a field in you table wher
 echo $form->field($model, 'ImageManager_id_avatar')->widget(\noam148\imagemanager\components\ImageManagerInputWidget::className(), [
 	'aspectRatio' => (16/9), //set the aspect ratio
 	'showPreview' => true, //false to hide the preview
+	'showDeletePickedImageConfirm' => false, //on true show warning before detach image
 ]);
 ```
 ![Image widget](/docs/images/img_doc-image-widget.jpg)

assets/source/js/script.imagemanager.input.js

@@ -1,5 +1,7 @@
 var imageManagerInput = {
 	baseUrl: null,
+	//language
+	message: null,
 	//init imageManagerInput
 	init: function(){
 		//create modal
@@ -52,6 +54,13 @@ var imageManagerInput = {
 		var sFieldId = inputId;
 		var sFieldNameId = sFieldId+"_name";
 		var sImagePreviewId = sFieldId+"_image";
+		var bShowConfirm = JSON.parse($(".delete-selected-image[data-input-id='"+inputId+"']").data("show-delete-confirm"));
+		//show warning if bShowConfirm == true
+		if(bShowConfirm){
+			if(confirm(imageManagerInput.message.detachWarningMessage) == false){
+				return false;
+			}
+		}		
 		//set input data		
 		$('#'+sFieldId).val("");
 		$('#'+sFieldNameId).val("");
@@ -68,7 +77,6 @@ $(document).ready(function () {
 	//init Image manage
 	imageManagerInput.init();
 
-
 	//open media manager modal
 	$(document).on("click", ".open-modal-imagemanager", function () {
 		var aspectRatio = $(this).data("aspect-ratio");

components/ImageManagerInputWidget.php

@@ -1,8 +1,10 @@
 <?php
 namespace noam148\imagemanager\components;
 
+use Yii;
 use yii\widgets\InputWidget;
 use yii\helpers\Html;
+use yii\helpers\Json;
 use yii\helpers\Url;
 use noam148\imagemanager\models\ImageManager;
 use noam148\imagemanager\assets\ImageManagerInputAsset;
@@ -11,10 +13,19 @@ class ImageManagerInputWidget extends InputWidget{
 	//default ratio
 	public $aspectRatio = null; //option info: https://github.com/fengyuanchen/cropper/#aspectratio
 	public $cropViewMode = 1; //option info: https://github.com/fengyuanchen/cropper/#viewmode
-	public $showPreview = true; 
+	public $showPreview = true;
+	public $showDeletePickedImageConfirm = false;
 
 	public function init(){
-
+		parent::init();
+		//set language
+		if (!isset(Yii::$app->i18n->translations['imagemanager'])) {
+            Yii::$app->i18n->translations['imagemanager'] = [
+                'class' => 'yii\i18n\PhpMessageSource',
+                'sourceLanguage' => 'en',
+                'basePath' => '@noam148/imagemanager/messages'
+            ];
+        }
 	}
 
 	/**
@@ -50,7 +61,7 @@ public function run()
         }
 		//end input group
 		$sHideClass = $ImageManager_id === null ? 'hide' : '';
-		$field .= "<a href='#' class='input-group-addon btn btn-primary delete-selected-image ".$sHideClass."' data-input-id='".$sFieldId."'><i class='glyphicon glyphicon-remove' aria-hidden='true'></i></a>";
+		$field .= "<a href='#' class='input-group-addon btn btn-primary delete-selected-image ".$sHideClass."' data-input-id='".$sFieldId."' data-show-delete-confirm='".($this->showDeletePickedImageConfirm ? "true" : "false")."'><i class='glyphicon glyphicon-remove' aria-hidden='true'></i></a>";
 		$field .= "<a href='#' class='input-group-addon btn btn-primary open-modal-imagemanager' data-aspect-ratio='".$this->aspectRatio."' data-crop-view-mode='".$this->cropViewMode."' data-input-id='".$sFieldId."'>";
 		$field .= "<i class='glyphicon glyphicon-folder-open' aria-hidden='true'></i>";
 		$field .= "</a></div>";
@@ -85,5 +96,8 @@ public function registerClientScript()
 		$sBaseUrl =  Url::to(['imagemanager/manager']);
 		//set base url
 		$view->registerJs("imageManagerInput.baseUrl = '".$sBaseUrl."';");
+		$view->registerJs("imageManagerInput.message = ".Json::encode([
+			'detachWarningMessage' => Yii::t('imagemanager','Are you sure you want to detach the image?'),
+		]).";");
     }
 }

messages/en/imagemanager.php

@@ -1,6 +1,7 @@
 <?php
 return [
 	'Are you sure you want to delete this image?' => 'Are you sure you want to delete this image?',
+	'Are you sure you want to detach the image?' => 'Are you sure you want to detach the image?',
 	'Cancel' => 'Cancel',
 	'Created' => 'Created',
 	'Crop' => 'Crop',

messages/nl/imagemanager.php

@@ -1,6 +1,7 @@
 <?php
 return [
     'Are you sure you want to delete this image?' => 'Weet je zeker dat je de afbeelding wilt verwijderen?',
+	'Are you sure you want to detach the image?' => 'Weet je zeker dat je de afbeelding wilt losmaken?',
 	'Cancel' => 'Annuleer',
 	'Created' => 'Aangemaakt',
 	'Crop' => 'Bijsnijden',