Content deleted Content added
Ensure guidance text matches internal logic |
refactor some ifs |
||
| (5 intermediate revisions by the same user not shown) | |||
Line 47:
window.ime_translations
])
$('.ime_t_' + key).text(trans[key]);
},
Line 77:
makeDiv(id) {
const div = document.createElement('div');
return div;
},
Line 116:
};
const dblClick = event.detail > 1;
ime.store(dblClick);
}
Line 138 ⟶ 137:
areas.updateSelection = function () {
this.selection.children().remove();
for (
const
$('<option>', { value: i })
.text(title)
Line 170 ⟶ 169:
// Remove element from this array
this.splice(this.currentlyEditing, 1);
this.update();
if (this.currentlyEditing >= 0)
Line 179 ⟶ 177:
function markPoint(point, color) {
if (point) {
ime.context.beginPath();▼
const arm = 8 / ime.scale;
▲ ime.context.beginPath();
ime.context.moveTo(point.x + arm, point.y);
ime.context.lineTo(point.x - arm, point.y);
Line 202 ⟶ 200:
ime.context.canvas.width / ime.scale,
ime.context.canvas.height / ime.scale);
for (
const current = (ind == this.currentlyEditing);
ime.context.fillStyle =
const coords = area.coords;
ime.context.beginPath();
Line 270 ⟶ 267:
}
if (full) {
dx = d.left.x - d.right.x, dy = d.left.y - d.right.y;
area.coords[2] = parseInt(Math.hypot(dx, dy));
}
break;
Line 451 ⟶ 448:
function updateResult() {
const
arr = Array.from(document.ime.imageDescriptionPos break;▼
}▼
}▼
const results = Array().concat(
Line 475 ⟶ 468:
const preResult = document.getElementById('imeResult');
while
preResult.removeChild(preResult.lastChild);
Line 487 ⟶ 480:
function updateInputs(fromAreas) {
function updateShape(selectors, coords) {
for (
$(
}
Line 521 ⟶ 514:
function attachTemplate() {
{const
clicks = { '.ime_t_rect': () => areas.make('rect'),
'.ime_t_circle': () => areas.make('circle'),
'.ime_t_poly': () => areas.make('poly'),
'.ime_t_deletearea': areas.remove.bind(areas),
'#imeImportShow': ime.imports.show.bind(ime.imports),
'#imeImportHide': ime.imports.hide.bind(ime.imports),
'.ime_t_import': ime.imports.make.bind(ime.imports),
'.ime_t_deletecoordinates': () => {
areas.current().coords = [];
mouse.currentClicks = {};
ime.store();
}
}
for (const id of Object.keys(clicks))▼
areas.edit($(this).prop('selectedIndex'));▼
$(id).click(util.std_handler(clicks[id]));▼
'
'.ime-updateresultsonchange': updateResult,▼
▲ areas.edit($(this).prop('selectedIndex'));
'#ime_areaLink': function () {
},▼
▲ },
▲ '.ime-updateresultsonchange': updateResult,
'#
areas.current().
}
▲ };
▲ '#ime_areaTitle': function () {
▲ areas.current().title = $(this).val(); updateResult();
for (const [id, change] of Object.entries(changes))
▲ }
areas.selection = $('#ime_areaselector');
$('.ime-saveonchange').focusout(function () {
const
input = $(this) if (coords &&
typeof (ind) == 'number' &&
Line 567 ⟶ 563:
}
});
mw.loader.using(['mediawiki.api', 'jquery.ui']).done(
$('#ime_areaLink').autocomplete({
source(request, response) {
Line 588 ⟶ 584:
//mw linter does not allow use multiline delimiter (ascii 96), not even
//in the comment...formatted version in comment below.
ime.templateHtml = '<form name="ime" action=""><fieldset style="margin:0.5ex;padding:0 1ex 1ex"><legend>ImageMapEdit</legend><fieldset style="float:left;margin:0 0.5ex 0.5ex;padding:0 1ex 1ex"><legend style="padding:0 0.5ex" class="ime_t_newarea">Create new area</legend><a style="padding:1px;background:white;color:darkblue" class="ime_t_rect">rect(angle)</a><br /><a style="padding:1px;background:white;color:darkblue" class="ime_t_circle">circle</a><br /><a style="padding:1px;background:white;color:darkblue" class="ime_t_poly">poly(gon)</a></fieldset><fieldset style="float:left;margin:0 0.5ex 0.5ex;padding:0 1ex 1ex"><legend style="padding:0 0.5ex" class="ime_t_editarea">Edit area</legend><select id="ime_areaselector" size="10" style="float:left;height:10em;margin:0.5ex;width:auto;min-width:18em;" ></select><div id="imeProps" style="float:left;margin:0.5ex;padding:0 1ex 1ex;display:none"><div style="float:left;margin:0.5ex;padding:0 1ex 1ex"><label for="ime_areaLink" class="ime_t_linktarget">Link target</label><br /><input id="ime_areaLink" name="areaLink" style="width:10em" class="ime-saveonchange" /><br /><label for="ime_areaTitle"><span class="ime_t_linktitle">Link title</span> (<span class="ime_t_optional">optional</span>)</label><br /><input id="ime_areaTitle" name="areaTitle" style="width:10em" class="ime-saveonchange" /></div><div id="imePropsRect" class="ime-prop ime-prop-rect" style="float:left;margin:0.5ex;padding:0 1ex 1ex;display:none"><label for="ime_areaRectLeft" class="ime_t_rectleft">First corner</label><br /><input id="ime_areaRectLeft" name="areaRectLeft" data-coord=0 class="ime-saveonchange" style="width:4em" /><input id="ime_areaRectTop" name="areaRectTop" data-coord=1 style="width:4em" class="ime-saveonchange" /><span class="ime_t_rectchoose1">Select with double-click</span><br/><label for="ime_areaRectRight" class="ime_t_rectright">Second corner</label><br /><input id="ime_areaRectRight" name="areaRectRight" data-coord=2 style="width:4em" class="ime-saveonchange" /><input id="ime_areaRectBottom" name="areaRectBottom" data-coord=3 style="width:4em" class="ime-saveonchange" /><span class="ime_t_rectchoose2">Select with left mouse button</span></div><div id="imePropsCircle" class="ime-prop ime-prop-circle" style="float:left;margin:0.5ex;padding:0 1ex 1ex;display:none"><label class="ime_t_position">Position</label><br /><input name="areaCircleX" id="ime_areaCircleX" class="ime-saveonchange" data-coord=0 style="width:4em" /><input name="areaCircleY" id="ime_areaCircleY" style="width:4em" data-coord=1 class="ime-saveonchange" /><span class="ime_t_circlechoose1">Select with double-click</span><br /><label for="ime_areaCircleRadius" class="ime_t_radius">Radius</label><br /><input id="ime_areaCircleRadius" name="areaCircleRadius" data-coord=2 style="width:4em" class="ime-saveonchange" /><span class="ime_t_circlechoose2">Select with left mouse button</span></div><div id="imePropsPoly" class="ime-prop ime-prop-poly" style="float:left;margin:0.5ex;padding:0 1ex 1ex;display:none"><label class="ime_t_coordinates">Coordinates</label><br /><p id="imePropsPolyCoords" style="font-size:0.8em;max-width:20em;"></p><a style="padding:1px;background:white;color:darkblue" class="ime_t_deletecoordinates">Delete all coordinates</a><br /><span class="ime_t_polychoose">Add new corner with double-click</span></div><div style="clear:both"></div><a style="padding:1px;background:white;color:darkblue" class="ime_t_deletearea">Delete selected area</a></div><div style="clear:both"></div></fieldset><div style="clear:both"></div><fieldset style="margin:0 0.5ex 0.5ex;padding:0 1ex 1ex"><legend class="ime_t_preferences">General preferences</legend><div style="float:left;margin-right:1em;"><label for="ime_imageDescription" class="ime_t_imagedescription">Image description</label><br /><input id="ime_imageDescription" name="imageDescription" class="ime-updateresultsonchange" /></div><div style="float:left"><label style="display:block" class="ime_t_infolinkposition">Position of information link</label><div style="float:left"><input type="radio" name="imageDescriptionPos" value="bottom-left" class="ime-updateresultsonchange" checked="checked" id="ime_imageDescriptionPos_bottomleft" /><label for="ime_imageDescriptionPos_bottomleft"><span class="ime_t_bottomleft">Bottom left</span> (<span class="ime_t_default">default</span>)</label></div><div style="float:left"><input type="radio" name="imageDescriptionPos" value="bottom-right" class="ime-updateresultsonchange" id="ime_imageDescriptionPos_bottomright" /><label for="ime_imageDescriptionPos_bottomright" class="ime_t_bottomright">Bottom right</label></div><div style="float:left"><input type="radio" name="imageDescriptionPos" value="top-left" class="ime-updateresultsonchange" id="ime_imageDescriptionPos_topleft" /><label for="ime_imageDescriptionPos_topleft" class="ime_t_topleft">Top left</label></div><div style="float:left"><input type="radio" name="imageDescriptionPos" value="top-right" class="ime-updateresultsonchange" id="ime_imageDescriptionPos_topright" /><label for="ime_imageDescriptionPos_topright" class="ime_t_topright">Top right</label></div><div style="float:left"><input type="radio" name="imageDescriptionPos" value="none" class="ime-updateresultsonchange" id="ime_imageDescriptionPos_none" /><label for="ime_imageDescriptionPos_none" class="ime_t_nolink">No link</label></div></div><div style="clear:both"></div></fieldset><fieldset style="margin:0.5ex;padding:0 1ex 1ex"><legend class="ime_t_importareas">Import areas from wikicode</legend><a style="padding:1px;background:white;color:darkblue" id="imeImportShow"><span class="ime_t_showtextbox">Show text box</span> ></a><a style="padding:1px;background:white;color:darkblue;display:none" id="imeImportHide"><span class="ime_t_hidetextbox">Hide text box</span> <</a><div id="imeImport" style="display:none"><textarea name="importText" style="width:100%;margin:0;height:10em;display:block"></textarea><a style="padding:1px;background:white;color:darkblue" class="ime_t_import">Import</a></div></fieldset><fieldset style="margin:0.5ex;padding:0 1ex 1ex"><legend class="ime_t_generatedwikicode">Generated wikicode</legend><div><code id="imeResult" style="display:block;line-height:1.2em"></code></div></fieldset></fieldset></form>';
});
/*
| |||