web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Prompt users to migrate base64 images to mediatags in the pad app

Browse Source
This commit is contained in:
yflory
2018-08-29 18:20:34 +02:00
parent b1f2d287b4
commit 90c96bfb70
5 changed files with 154 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
www/pad/mediatag-plugin-dialog.js
View File

@@ -13,12 +13,40 @@ CKEDITOR.dialog.add('mediatag', function (editor) {
type: 'text',
id: 'width',
label: Messages.width,
validate: function () {
if (isNaN(this.getValue())) { return false; }
}
},
{
type: 'text',
id: 'height',
label: Messages.height,
}
validate: function () {
if (isNaN(this.getValue())) { return false; }
}
},
{
type: 'checkbox',
id: 'lock',
'default': 'checked',
label: Messages.ratio,
},
{
type: 'text',
id: 'border',
label: Messages.border,
validate: function () {
if (isNaN(this.getValue())) { return false; }
}
},
{
type: 'html',
id: 'preview',
html: '<label>'+Messages.preview+'</label>'+
'<div id="ck-mediatag-preview"'+
'style="margin:auto;resize:both;max-width:300px;max-height:300px;overflow:auto"'+
'></div>'
},
]
},
],
@@ -37,6 +65,57 @@ CKEDITOR.dialog.add('mediatag', function (editor) {
var hInput = inputs[1];
wInput.value = Math.round(rect.width);
hInput.value = Math.round(rect.height);
var keepRatio = inputs[2];
var ratio = wInput.value/hInput.value;
var borderInput = inputs[3];
var bValue = el.getStyle('border-width').replace('px', '') || 0;
borderInput.value = bValue;
var $preview = $(dialog).find('#ck-mediatag-preview');
var $clone = $(el.$).clone();
$clone.css({
display: 'flex',
'border-style': 'solid',
'border-color': 'black'
});
$preview.html('').append($clone);
var update = function () {
var w = $(wInput).val() || Math.round(rect.width);
var h = $(hInput).val() || Math.round(rect.height);
var b = $(borderInput).val() || bValue;
$clone.css({
width: w+'px',
height: h+'px',
'border-width': b+'px'
});
};
$(wInput).on('keyup', function () {
if (!$(keepRatio).is(':checked')) { return; }
var w = $(wInput).val();
if (isNaN(w)) { return; }
var newVal = w/ratio;
$(hInput).val(Math.round(newVal));
update();
});
$(hInput).on('keyup', function () {
if (!$(keepRatio).is(':checked')) { return; }
var h = $(hInput).val();
if (isNaN(h)) { return; }
var newVal = h*ratio;
$(wInput).val(Math.round(newVal));
update();
});
$(keepRatio).on('change', function () {
ratio = $(wInput).val()/$(hInput).val();
});
$(borderInput).on('keyup', function () {
update();
});
},
onOk: function() {
var dialog = this;
@@ -52,6 +131,7 @@ CKEDITOR.dialog.add('mediatag', function (editor) {
var inputs = dialog.querySelectorAll('input');
var wInput = inputs[0];
var hInput = inputs[1];
var bInput = inputs[3];
window.setTimeout(function () {
if (wInput.value === "") {
@@ -66,6 +146,11 @@ CKEDITOR.dialog.add('mediatag', function (editor) {
} else {
el.setSize('height', parseInt(hInput.value));
}
if (bInput.value === "") {
el.removeStyle('border-width');
} else {
el.setStyle('border-width', parseInt(bInput.value)+'px');
}
editor.fire( 'change' );
});
}