fix

htmlacademy-univer-javascript-1 · Dec 13, 2023 · 5736a46 · 5736a46
1 parent c99c9e6
commit 5736a46
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 14 deletions.
diff --git a/js/form.js b/js/form.js
@@ -6,7 +6,7 @@ const MAX_HASHTAG_LENGTH = 20;
 const MAX_COMMENT_LENGTH = 140;
 const MAX_HASHTAG_COUNT = 5;
 const VALID_IMAGE_TYPES = ['image/gif', 'image/jpeg', 'image/png'];
-const RIGHT_HASHTAG = /^#[А-яа-яA-za-zёЁ]{1,19}$/;
+const HASHTAG_RULE = /^#[А-яа-яA-za-zёЁ]{1,19}$/;
 const formErorrorsMessages = {
   hashTag: 'Уникальные хештеги, каждый не более 20 символов, должны быть разделены пробелом',
   comment: 'Комментарий не более 140 символов'
@@ -18,7 +18,7 @@ const overlay = document.querySelector('.img-upload__overlay');
 const cancelButton = document.querySelector('#upload-cancel');
 const hashtags = document.querySelector('.text__hashtags');
 const comments = document.querySelector('.text__description');
-const EffectsFilter = document.querySelector('.img-upload__effects');
+const effectsFilter = document.querySelector('.img-upload__effects');
 
 
 const isCorrectComment = (comment) => isRightString(comment, MAX_COMMENT_LENGTH);
@@ -27,7 +27,7 @@ const isCorrectHashtags = () =>{
   let isСorrectTag = true;
   const hashtagsArray = hashtags.value.split(' ').map((hashtag) => {
     hashtag = hashtag.toLowerCase();
-    if(!RIGHT_HASHTAG.test(hashtag) || String(hashtag).length > MAX_HASHTAG_LENGTH){
+    if(!HASHTAG_RULE.test(hashtag) || String(hashtag).length > MAX_HASHTAG_LENGTH){
       isСorrectTag = false;
     }
     return hashtag;
@@ -89,7 +89,7 @@ const onUploadButtonChange = () => {
   overlay.classList.remove('hidden');
   document.body.classList.add('modal-open');
   renderScaleButtons();
-  EffectsFilter.addEventListener('change', onEffectsFilterChange);
+  effectsFilter.addEventListener('change', onEffectsFilterChange);
   cancelButton.addEventListener('click', onCancelButtonClick);
   document.addEventListener('keydown', onEscapeKeydown);
   comments.addEventListener('keydown', onFocusPreventClose);

diff --git a/js/image-effects.js b/js/image-effects.js
@@ -1,4 +1,4 @@
-const EFFECTS = {
+const EFFECT = {
   'none': { name: 'none', filter: '', unit: '',
     options: {range: {min: 0, max: 100}, step: 1, start: 100},
   },
@@ -36,23 +36,23 @@ export const createEffectSlider = () =>{
 };
 
 export const resetFilters = () => {
-  image.style.filter = 'none';
+  image.style.filter = EFFECT['none'].name;
   sliderWrapper.classList.add('hidden');
 };
 
 export const onEffectsFilterChange = (evt) =>{
   const effect = evt.target.value;
-  if(effect === 'none'){
+  if(effect === EFFECT['none'].name){
     resetFilters();
   }
   else{
     sliderWrapper.classList.remove('hidden');
     image.removeAttribute('class');
     image.classList.add(`effects__preview--${effect}`);
-    slider.noUiSlider.updateOptions(EFFECTS[effect].options);
+    slider.noUiSlider.updateOptions(EFFECT[effect].options);
     slider.noUiSlider.on('update', () => {
       sliderValue.value = slider.noUiSlider.get();
-      image.style.filter = `${EFFECTS[effect].filter}(${sliderValue.value}${EFFECTS[effect].unit})`;
+      image.style.filter = `${EFFECT[effect].filter}(${sliderValue.value}${EFFECT[effect].unit})`;
     });
   }
 };
diff --git a/js/image-scale.js b/js/image-scale.js
@@ -14,22 +14,27 @@ const image = document.querySelector('.img-upload__preview').querySelector('img'
 const isValueInScaleInterval = (value) =>
   value >= ScaleInterval.MIN && value <= ScaleInterval.MAX;
 
-const onScaleButtonClick = (evt) => {
+const updateScale = (evt) => {
   const val = +scaleValue.value.replace('%', '') + STEP * +evt.target.dataset.value;
   if(isValueInScaleInterval(val)){
     image.style.transform = `scale(${val / MAX_PERCENT})`;
     scaleValue.value = `${val}%`;
   }
 };
 
+const onScaleBiggerClick = updateScale;
+
+const onScaleSmallerClick = updateScale;
+
+
 export const renderScaleButtons = () => {
-  scaleBigger.addEventListener('click', onScaleButtonClick);
-  scaleSmaller.addEventListener('click', onScaleButtonClick);
+  scaleBigger.addEventListener('click', onScaleBiggerClick);
+  scaleSmaller.addEventListener('click', onScaleSmallerClick);
 };
 
 export const destroyScaleButtons = () => {
   image.style.transform = DEFEALT_SCALE;
-  scaleBigger.removeEventListener('click', onScaleButtonClick);
-  scaleSmaller.removeEventListener('click', onScaleButtonClick);
+  scaleBigger.removeEventListener('click', onScaleBiggerClick);
+  scaleSmaller.removeEventListener('click', onScaleSmallerClick);
 };