Event that triggers gui_addArea function

[Joel Azcuna]

Hi Adam,

I am implementing a validation, a user is required to feed href
everytime he entered a shape (rectable, circle, etc) to the image.

So I must prevent automatic addition of elements(row) in
form_container DIV, instead set focus to input box named img_ref. If
it lost focus without any value, an alert will pop out.

May I know what codes/function/event is being called after the user
entered a shape?

By the way, I am using the stand-alone imgmap_2.2_108.zip.

Thanks,

Joel A.

[Adam Maschek]

Hi Joel,

You are possibly interested in either onAddArea or onRelaxArea events.
- onAddArea happens whenever you see a new form_container line
appearing, in the example1 you see how default_interface.js does this,
- onRelaxArea happens after drawing/resizing/moving an area.

An example on how to assign functions to them:
myimgmap = new imgmap({
mode : "editor",
custom_callbacks : {
'onStatusMessage' : function(str) {gui_statusMessage(str);},//to
display status messages on gui
'onHtmlChanged' : function(str) {gui_htmlChanged(str);},//to
display updated html on gui
'onModeChanged' : function(mode) {gui_modeChanged(mode);},//to
switch normal and preview modes on gui
'onAddArea' : function(id) {gui_addArea(id);},//to add new
form element on gui
'onRemoveArea' : function(id) {gui_removeArea(id);},//to remove
form elements from gui
'onAreaChanged' : function(obj) {gui_areaChanged(obj);},
'onRelaxArea' : function(id) {console.log(id);},
'onSelectArea' : function(obj) {gui_selectArea(obj);}//to select
form element when an area is clicked
},
pic_container: document.getElementById('pic_container'),
bounding_box : false
});

I hope this helps,
Adam

> --
> You received this message because you are subscribed to the Google Groups "imgmap-discuss" group.
> To post to this group, send email to imgmap-...@googlegroups.com.
> To unsubscribe from this group, send email to imgmap-discus...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/imgmap-discuss?hl=en.
>
>

[Joel Azcuna]

Adam,

Thanks for that hints. I'll dig more on custom_callbacks to find out
how it would fit to my needs.

I am uploading a file imgmap_mini.zip so i could better explain the
tasks i'm trying to accomplish. I hope you have time checking this,
anyway it only contains html, js, and image files.

These are the changes I made to core files (default_interface.js,
imgmap.js), I'm really sorry for resorting to this but so far it's the
initial approach I know unless they could fully be implemented via
custom_callbacks.

List of changes

default_interface.js
--------------------
1. function gui_input_change(e)
if (obj.name == 'img_href') {myimgmap.areas[id].ahref = obj.value;
myimgmap.areas[id].atarget = '_blank'; }
- defaulted target to '_blank'.

2. function gui_addArea(id)
- minimize options for img_shape <select>
- add description like Href (target url), Alt (tooltip)
- hide <select> for img_target
- hide <input> for img_coords

imgmap.js
---------
1. imgmap.prototype.img_mousedown = function(e)
- commented a line so after a shape is drawn to the image, it won't
autmatically create a new area. at this point, may i ask how can i set
the focus to < input > img_href ?

somewhere in..
else if (this.is_drawing && this.is_drawing != this.DM_POLYGON_DRAW &&
this.is_drawing != this.DM_BEZIER_DRAW)
..is..
if (this.areas[this.currentid] == this._getLastArea()) {
... //if (this.config.mode != "editor2") this.addNewArea();
... //call a function that set the focus to img_href of the active
area
... //this function will also validate value, if empty it would prompt
the user.
... return;
}

On imgmap_mini.zip..

The end-user could recall previously set/define coordinates as he hop
from one image to another (sample1 to sample4).

I'm not really sure what's going on.. if I run the codes on PHP+Apache
environment, recalling defined maps has no probs at all but on RoR
environment the <canvas> seems to shift upward, a difference of 15px
from its original location. ex. top: 87px to 72px.

Again thanks.

- Joel A.