Develop Reference

adobe illustrator script- printing custom size paper

we have at work an HP plotter and I'm trying to make a script that will print the job with the right paper size.
the width of the paper is 900mm and the height can be set as we want it to be but we have to do it manualy for every job.
I have written a script that prints the job on the HP plotter but I can't find a way to chek the artboard size to detrmain the printing orientation and print it at the size of the artboard + some space for the cutting.
here is what I have now:
var Doc = app.activeDocument;
var abActive = Doc.artboards[Doc.artboards.getActiveArtboardIndex()];
var bounds = abActive.artboardRect;
var left = bounds[0];
var top = bounds[1];
var right = bounds[2];
var bottom = bounds[3];
var Pheight = right - left;
//Lexmark 1
//HP 2
var Lexmark = app.printerList[1].name;
var HP = app.printerList[2].name;
var PaperA3 = printerList[2].printerInfo.paperSizes[1];
var printJobOptions = new PrintJobOptions();
var options = new PrintOptions();
var coordinateOptions = new PrintCoordinateOptions();
//coordinateOptions.fitToPage = true;
coordinateOptions.orientation = PrintOrientation.AUTOROTATE ;
options.coordinateOptions = coordinateOptions;
var printPaperOpts = new PrintPaperOptions();
printPaperOpts.name = PaperA3;
printPaperOpts.height = 600;
options.paperOptions = printPaperOpts;
options.printerName = HP;
options.printPreset = "HP";
Doc.print(options);

Not sure if understand the problem a whole. Probably it's need to clarify some details.
For example here is the snippet to get a size of the active artboard and its orientation:
var doc = app.activeDocument;
var artboard = doc.artboards[doc.artboards.getActiveArtboardIndex()];
const mm = 2.834645669;
var bounds = artboard.artboardRect;
var width = Math.round((bounds[2] - bounds[0]) / mm);
var height = Math.round((bounds[1] - bounds[3]) / mm);
var landscape = (width > height) ? true : false;
alert('height = ' + height + ' mm\nwidth = ' + width + ' mm\nlandscape: ' + landscape);
This way you can get the numbers. The code is quite simple and obvious.
Is it enough? Let me know if you need help.

I made a script that will set a preset depending on the artboard size but it's not working and not because of my script. For some reason illustrator sets the paper size to A4 even when I set a diffrent size in the preset.
From reading online it has to be a problem with the printer drivers.

Mapbox sidepanel and polygon interaction

I am attempting to make an interaction between images in a sidepanel and polygons on a map, so when the sidepanel is moved via mousescroll, the corresponding polygon with same name is brought into focus.
My current attempt is not responsive to mousescrolls as needed. Is there another approach than the one I have taken?
$('.sidebar').bind('mousewheel', function(e){
$("#help").html(' ');
var winTop = $(this).scrollTop();
var $imgs = $('.sidebar').find('img');
var $midElement;
var distance = null;
var currDistance = 0;
var minHeight = $(window).scrollTop();
var maxHeight = $(window).height();
var img_h=$('.sidebar').find('img');
var img_h1=img_h.height() / 2;
var middleHeightA = (maxHeight + minHeight) / 2;
var middleHeight = middleHeightA - img_h1;
$.each($imgs, function() {
currDistance = Math.abs(middleHeight - $(this).position().top);
if ( distance == null || currDistance < distance ) {
/*$midElement = $(element);*/
distance = currDistance;
for (j=0;j<polygons1.length;j++) {
polygons1[j].setStyle({color: '#fff',fillColor:'#000', weight:'1px'});
}
var scrid=$(this).attr('id');
for (j=0;j<help.length;j++) {
id=help[j];
if(id==scrid)
{
polygons1[j].openPopup(polygons1[j].getBounds().getCenter());
map.setView(polygons1[j].getBounds().getCenter(),10);
polygons1[j].setStyle({color: '#e72f2a',fillColor:'#e72f2a',weight:'7px'});
$('.thumbnail').removeClass('active');
$('.'+scrid).addClass('active');
}
}
}
var scrid=$(this).attr('id');
for (j=0;j<help.length;j++) {
id=help[j];
if(id==scrid)
{
polygons1[j].openPopup(polygons1[j].getBounds().getCenter());
map.setView(polygons1[j].getBounds().getCenter(),10);
polygons1[j].setStyle({color: '#e72f2a',fillColor:'#e72f2a',weight:'7px'});
}
}
}*/

I would recommend you to use a debounce function. Debounce function limits the rate at which a function can fire. The idea is to make polygons focus not every time a mouse-wheel event is triggered, but focus them with a kind of cooldown.
Debounce functions are already implemented in many libraries, for example in lodash. All you have to do is to wrap your mousewheel callback in it. Something like:
$('.sidebar').bind('mousewheel', _.debounce(function(e){
$("#help").html(' ');
...
), 100});
Pay attention to options param, in lodash implementation, most probably you would like to use one of them, for example maxWait.

Applying function to a div by class

I thought I was doing this right but its not working. I think I'm being stupid...
function expand(){
var wide = $(this).css('width');
var high = $(this).css('height');
var newwide = wide * 10;
var newhigh = high * 10;
$(this).animate({'width':newwide,'height':newhigh}, 2000);
}
$('.object1').expand();
I just want to run this 'expand' function on the div with the class 'object1', what am I doing wrong?
Thanks

In jQuery, to add a custom function, you do it like this:
(function($){
$.fn.myFunction = function() {
//Custom Function
}
})(jQuery);
So, your code should look like this:
(function($){
$.fn.expand = function() {
var wide = $(this).css('width');
var high = $(this).css('height');
var newwide = wide * 10;
var newhigh = high * 10;
$(this).animate({'width':newwide,'height':newhigh}, 2000);
}
})(jQuery);
Learn More

Try to rewrite your code like this,
function expand($this){
var wide = $this.css('width');
var high = $this.css('height');
var newwide = wide * 10;
var newhigh = high * 10;
$this.animate({'width':newwide,'height':newhigh}, 2000);
}
expand($('.object1'));

How should the $ object know it has a expand() method now?
If you really want a jQuery plugin here (that's what they call it when you attach something to the jQuery object), you have to attach it to $.fn:
$.fn.expand = expand // as you defined it earlier
You almost surely don't want this. What creates what you were trying to achieve is giving the $('.object1') as a parameter to expand():
function expand($element){
var wide = $element.css('width');
var high = $element.css('height');
var newwide = wide * 10;
var newhigh = high * 10;
$element.animate({'width':newwide,'height':newhigh}, 2000);
}
expand($('.object1'));

How to calculate distance between 2 elements , Like this?

How to calculate distance between 2 elements , Like this ?
i want to calculate distance between id="element_bottom" and id="ref_box"
and this is fiddle for calculate distance between mouse and id="element_bottom"
how can i apply this code for calculate distance between id="element_bottom" and id="ref_box" ?
thankyou
http://jsfiddle.net/t5Kts/808/
(function() {
var mY, distance_bottom,
$distance_bottom = $('#distance_bottom span'),
$element_bottom = $('#element_bottom');
function calculatedistance_bottom(elem , mouseY) {
return Math.floor(Math.sqrt(Math.pow(mouseY - (elem.offset().top+(elem.height()/2)), 2)));
}
$(document).mousemove(function(e) {
mY = e.pageY;
distance_bottom = calculatedistance_bottom($element_bottom , mY);
$distance_bottom.text(distance_bottom);
});
})();

Assuming that the your references for distance are the tops of each element, You may try this:
DEMO
(function() {
var btm = $('#element_bottom'),
ref = $('#ref_box'),
refTop = ref.position().top;
$(window).scroll(function(){
var btmTop = btm.position().top;
$('#distance_bottom span').text(Math.abs(refTop-btmTop));
});
})();

Something like this should probably do it:
$('.foo').offset().top - $('.bar').offset().top

FCKEditor, adding width and height to img elements

I'm trying to add width and height to images that I have in old WYSIWYG FCKEditor.
The problem is, when I'm trying to get naturalWidth/Height that way I got 0 values.
What am I doing wrong?
here is the code:
var zaj = FCKeditorAPI.GetInstance('hometext');
pz = zaj.GetXHTML();
dom_zaj = document.createElement('div');
dom_zaj.innerHTML = pz;
$(dom_zaj).find('img').each(function(i, element) {
//var w_set = $(element).attr('width');
//var h_set = $(element).attr('height');
var w_native = element.naturalWidth;
var h_native = element.naturalHeight;
$(element).attr('width', w_native);
$(element).attr('height', h_native);
});

I manage to fix the problem on my own. Since the pic's where in editor, I had to load them manualy by myself using jquery.onload(); (and changed from width/height to css styles)
var $images = $(dom_zaj).find('img');
var imagesLength = $images.length;
$images.load(function(){
var w_native = this.naturalWidth;
$(this).css('width', w_native+'px');
imagesLength = imagesLength-1;
if(imagesLength === 0){
pz = dom_zaj.innerHTML;
zaj.SetHTML(pz);
}
}).error(function(){
imagesLength = imagesLength-1;
});