Задать размер изображения по высоте

[Fantik 2]

Как задать размер изображения по высоте, с сохранением пропорций?

Поле не активное

А то сделали крайне не продумано, если вставить к примеру 3 разных фотографии имеющих разную высоту и выставить для них к примеру 300 пикселей ширину, то в итоге получается всё криво.

Если же выставить 300 высоту для всех, то всё будет ровно

[newbie 1723]

Вообще там все завязано на ширине. И в дб записывается style="width:123px;height:auto;"

[newbie 1723]

Можно в бд в таблице core_javascript найти ips.editor.image.js (SELECT * FROM `core_javascript` WHERE javascript_name='ips.editor.image.js') и отредактировать содержимое столбца javascript_content

Закомментировать

this.scope.find('[data-role="imageHeight"]').prop('disabled', true);

и

this.scope.find('[data-role="imageHeight"]').prop('disabled', sameRatio);

 

Далее сбросить кеш форума.

[Fantik 2]

что-то я накосячил кажется

/**
* Invision Community
* (c) Invision Power Services, Inc. - https://www.invisioncommunity.com
*
* ips.editor.image.js - Controller for image properties in editor
*
* Author: Mark Wade
*/
;( function($, _, undefined){
"use strict";

ips.controller.register('core.global.editor.image', {

	_typingTimer: null,
	_textTypingTimer: null,
	_ajaxObj: null,
	_imageWidth: null,
	_ratioWidth: 1,
	_ratioHeight: 1,

	initialize: function () {
		this.on( 'submit', 'form', this.formSubmit );
		this.on( 'change', '[data-role="imageHeight"]', this.changeHeight );
		this.on( 'change', '[data-role="imageWidth"]', this.changeWidth );
		this.on( 'click', 'label[for^="image_align"]', this.toggleAlign );
		this.on( 'change', 'input[name="image_aspect_ratio"]', this.toggleRatio );
		this.setup();
	},

	/**
	 * Setup
	 *
	 * @returns 	{void}
	 */
	setup: function () {
		this._ratioWidth = this.scope.attr('data-imageWidthRatio');
		this._ratioHeight = this.scope.attr('data-imageHeightRatio');

		if( this.scope.find('input[name="image_aspect_ratio"]').is(':checked') ){
/**
		*	this.scope.find('[data-role="imageHeight"]').prop('disabled', true);
*/
		}
	},

	/**
	 * Toggles between the alighment options, highlighting the one the user clicked
	 *
	 * @param 		{event} 	e 		Event object
	 * @returns 	{void}
	 */
	toggleAlign: function (e) {
		var thisLabel = $( e.currentTarget );
		this.scope.find('label[for^="image_align"]').removeClass('ipsButton_primary').addClass('ipsButton_light');
		thisLabel.removeClass('ipsButton_light').addClass('ipsButton_primary');
	},

	/**
	 * Event handler for toggling the 'preserve aspect ratio' option
	 *
	 * @param 		{event} 	e 		Event object
	 * @returns 	{void}
	 */
	toggleRatio: function (e) {
		var sameRatio = $( e.currentTarget ).is(':checked');

		if( sameRatio ){
			this.changeWidth();
		}
/**
		* this.scope.find('[data-role="imageHeight"]').prop('disabled', sameRatio);
*/
	},

	/**
	 * Event handler for changing the height
	 * Keeps the width in ratio if enabled
	 *
	 * @returns 	{void}
	 */
	changeHeight: function () {
		var sameRatio = this.scope.find('input[name="image_aspect_ratio"]').is(':checked');
		var thisVal = parseInt( this.scope.find('[data-role="imageHeight"]').val() );
		var width = this.scope.find('[data-role="imageWidth"]');
		var widthVal = parseInt( width.val() );

		if( sameRatio ){
			width.val( Math.ceil( thisVal * this._ratioWidth ) );
		}
	},

	/**
	 * Event handler for changing the width
	 * Keeps the height in ratio if enabled
	 *
	 * @returns 	{void}
	 */
	changeWidth: function () {
		var sameRatio = this.scope.find('input[name="image_aspect_ratio"]').is(':checked');
		var thisVal = parseInt( this.scope.find('[data-role="imageWidth"]').val() );
		var height = this.scope.find('[data-role="imageHeight"]');
		var heightVal = parseInt( height.val() );

		if( sameRatio ){
			height.val( Math.ceil( thisVal * this._ratioHeight ) );
		}
	},

	/**
	 * Event handler for submitting the form
	 *
	 * @param 		{event} 	e 		Event object
	 * @returns 	{void}
	 */
	formSubmit: function (e) {
		e.preventDefault();
		e.stopPropagation();
		this._updateImage(e);
	},

	/**
	 * Event handler for 'insert' url button
	 *
	 * @param 		{event} 	e 		Event object
	 * @returns 	{void}
	 */
	_updateImage: function (e) {

		var widthInput = this.scope.find('[data-role="imageWidth"]');
		var heightInput = this.scope.find('[data-role="imageHeight"]');
		var sameRatio = this.scope.find('input[name="image_aspect_ratio"]').is(':checked');
		var error = false;

		if ( parseInt( widthInput.val() ) > parseInt( widthInput.attr('max') ) ) {
			error = true;
			widthInput.closest('.ipsFieldRow').addClass('ipsFieldRow_error');
			this.scope.find('[data-role="imageSizeWarning"]').text( ips.getString( 'editorImageMaxWidth', { 'maxwidth': widthInput.attr('max') } ) );
		}
		if ( parseInt( heightInput.val() ) > parseInt( heightInput.attr('max') ) ) {
			error = true;
			widthInput.closest('.ipsFieldRow').addClass('ipsFieldRow_error');
			this.scope.find('[data-role="imageSizeWarning"]').text( ips.getString( 'editorImageMaxHeight', { 'maxheight': heightInput.attr('max') } ) );
		}

		if ( !error ) {								
			var editor = $( 'textarea[name="' + $( this.scope ).data('editorid') + '"]' ).closest('[data-ipsEditor]').data('_editor');				
			editor.updateImage( widthInput.val(), ( sameRatio ? 'auto' : heightInput.val() ), this.scope.find('[data-role="imageAlign"]:checked').val(), this.scope.find('[data-role="imageLink"]').val(), this.scope.find('[data-role="imageAlt"]').val() );

			this.trigger('closeDialog');
		}
	}
});
}(jQuery, _));

 

Поле стало активным, но если меняю высоту или ширину, то в соседнем поле ничего не изменяется пропорционально

Изменено 12 мая 2018 пользователем Fantik

[Fantik 2]

*

Изменено 12 мая 2018 пользователем Fantik

[newbie 1723]

Поле стало активным, но если меняю высоту или ширину, то в соседнем поле ничего не изменяется пропорционально

А галка установлена?

[DarthOld 3]

А как в 4.3. задать что бы автоматом ужимались фото и картинки в сообщениях до 650 допустим?

[newbie 1723]

А как в 4.3. задать что бы автоматом ужимались фото и картинки в сообщениях до 650 допустим?

 

В АЦ есть настройка "Maximum image dimensions to display"

[DarthOld 3]

А где примерно? уже все глаза сломал...

[newbie 1723]

В АЦ же есть поиск или ссылка на страницу с настройками admin/?adsess=utuqc12ll6mmrewda82i8ddh55&app=core&module=settings&controller=posting

[DarthOld 3]

Понял. Думал там только для загружаемых изображений. У меня загрузка отключена. А вот с внешних урл - вот это надо. Пробую.