Prototype.js 1.6 new element class and IE >= 9 - prototypejs

Then I'm trying to create a new element with, for example
new Element('div',{'class':'name'});
all browsers create a new element with class "name". But in Internet Explorer 9 and 10 I've got this
<div className="name"></div>
As you see it creates className attribute instead of class.
How can I fix this?

//This generates 'className':
var popoutControl = new Element('div', {'class':'mySuperCoolClassName'});
// Break the line up into two lines.
// The following will generate a 'class' attribute instead:
var popoutControl = new Element('div');
popoutControl.className = 'mySuperCoolClassName';

replace
new Element('div',{'class':'name'});
with
var mydiv = new Element('div');
mydiv.addClassName('name');
As suggested from http://prototypejs.org/api/element/classNames Element.ClassName('name');
is deprecated and you should use Element.addClassName().

Please see my answer here:
https://stackoverflow.com/a/20668126/1274995
Basically, Prototype 1.6 is buggy in those versions of IE. You should update Prototype. the problem is the translation list contained in Element._attributeTranslations.write
This is the list in Prototype 1.7 (And above, I suppose)
I guess that worked in older versions of IE (That were probably current before IE9).

Related

Deleting images in Google sheet via script error

I probably will get downvoted for this but I can't do anything else. I searched, read and tried SOOOO many things. I am new at both Javascript and Google platform.
I have this piece of code that keeps telling me
"Missing name after . operation".
Even though .delete and .getAltTextTitle are both shown in autocomplete suggestion
var images = sheet.getImages();
var img = images[0];
Logger.log(img.getAltTextTitle()); //This is fine
img.delete(); //This throw error
In the meanwhile, I have this piece of code working totally fine. I don't know what to do. They look the same to me.
var img = sheet.getImages()[0];
var imgH = img.getHeight();
var imgW = img.getWidth();
var maxW = 700;
var newImgH = Math.round(imgH*(maxW/imgW));
img.setWidth(maxW);
img.setHeight(newImgH);
Unrelated topic, where do I get the documentation for sheet.getImages() because I just couldn't find it here
You want to delete the image on Spreadsheet using Google Apps Script.
If my understand is correct, I think that delete() might be new method which will be added for Spreadsheet in the near future. So the document is not updated and it might not complete yet. But from the error message, if you want to use the current delete() method, how about this sample script?
Sample script:
var images = sheet.getImages();
var img = images[0];
img["delete"](); // this one
Note:
I think that the detail infomation might be added to this document.
In my environment, I could confirm that the image can be deleted by img["delete"](). I think that this is one of new methods.
If I misunderstand your question, I'm sorry.
Update at 2018 October 13:
Now in order to delete the image, the following method can be used. This was confirmed at 2018 October 13.
var images = sheet.getImages();
var img = images[0];
img.remove(); // Here
Update at 2018 October 31:
This was officially released at October 30, 2018.
You can see the document at Class OverGridImage.

General update pattern not working as expected with d3.selection

I am puzzling over why the following simple update pattern doesn't work. This follows the recommended General Update Pattern , as far as I can see.
<script src="https://d3js.org/d3-selection.v1.min.js"></script>
...
var dat = ["One","Two","Buckle my shoe"];
var sel = d3.selectAll("p.test").data(dat);
sel.enter().append("p").classed("test", true);
sel.exit().remove();
//update 1 ... doesn't work
sel.text(function(d) { return d;})
The paragraphs get created fine, but the text isn't set. However, if I do this:
//update 2 ... this works as expected
d3.selectAll("p.test").text(function(d) { return d;});
...everything works fine. The first version has always worked in the past.
Update: I tried using the full d3 library ...
<script src="https://d3js.org/d3.v4.min.js"></script>
... and the first version works again. Do I need more than d3.selection?
To clarify, my past practice has been to define a separate update function that takes the selection as a parameter. Eg, function doUpdate(sel) { sel.text(...);}This is for cases where I expect the data elements to have few changes in size, but many changes in content. Storing the selection as a variable and repeatedly running updates on it has worked well before.
So after studying the release notes, it seems this is not going to be backwardly compatible, for some good reasons. First, the short answer:
Replace this:
sel.enter().append("p").classed("test", true);
...
sel.text(function(d) { return d;}) //update block
with this:
var update = sel.enter().append("p").classed("test", true).merge(sel);
...
update.text(function(d) { return d;}) //update block
The reason for this is described in this article (thanks #mbostock) and is a fix for empty selector problems with v3. The point I missed at first was that the enter() block needs to run first so that the merge() block has a populated selection to work on. Which means that the merge() call must come off the end of the enter() block chain.
The format of the change documents sort of hid that, because many examples use chains of function calls. I'm used to splitting the enter/update blocks into separate variables. This aids readability (usually) and means I can farm out the enter/update actions to separate functions - more reusable code that way.
So with that in mind, this doesn't work:
var enter = sel.enter();
var update = enter.merge(sel); //Nope! Not populated at this point.
enter.append(...); //too late! Update block uses an empty selection.
But this works okay
var enter = sel.enter();
enter.append(...);
var update = enter.merge(sel); //defined after block is populated

Is there any way to set options in beautify extension for Ace Editor?

I've found the beautify extension in Ace editor but I don't see any examples of how to use it. Is there a way to set any options?
Example what I have so far:
var beautiful = ace.require("ace/ext/beautify"); // get extension
var editor = ace.edit("editor"); // reference to our editor
editor.setValue(someCode); // add some code to the editor
beautiful.beautify(editor.session); // beautify the code
When I call this method the code is formatted but it is all unindented / outdented all the way to the left and some spaces are removed. It doesn't look quite right. So I want to know if there are any options. I looked at the code but it is minified. Which is why I'm asking this question here.
Before call:
After call:
UPDATE:
I found an unminifed copy of the extension. It looks like there are no options and it looks like it only works for PHP:
exports.beautify = function(session) {
var iterator = new TokenIterator(session, 0, 0);
var token = iterator.getCurrentToken();
var context = session.$modeId.split("/").pop();
var code = phpTransform(iterator, context);
session.doc.setValue(code);
};
I did not find any options in the beautify.js code for the beautify() method. I found a comment saying that it is not being worked on or supported any more. I do not have the source but it said it was not working and was then abandoned.
It might work alright for JavaScript but is not working well for ActionScript.

How to delete dat.GUI element?

I found this function to remove a gui element but i think it is outdated. So far I haven't been able to find anyone else who knows how to remove any part of a gui, whether its an entire dat.GUI() or just an added element to a dat.GUI(). The first would probably be enough for what i need (just removing the dat.GUI() all together) but either one would be super helpful!
supposed to remove a dat.GUI()
gui = new dat.GUI();
...
removeGui(gui);
function removeGui(gui, parent)
{
if(!parent)
{
parent = dat.GUI.autoPlaceContainer;
}
parent.removeChild(gui.domElement);
}
But gives back the error: cannot call method 'removeChild' of undefined, so i am guessing that autoPlaceContainer is wrong.
The original author of this function left these notes:
where the parameters gui represents the DAT.GUI you want to remove and parent is the parent container where if you didn't specify a domElement when instantiating DAT.GUI then you don't need to pass a parent.
var gui = new dat.GUI();
item = gui.add(text, 'message');
To delete:
gui.remove(item);
If your item is inside a folder, you have to do:
folder.remove(item);
If you want to remove the entire dat.GUI element along with all of its listeners, you can use gui.destroy()
If you want to reset the dat.GUI's values, you can use datGUI.__controllers.forEach(controller => controller.setValue(controller.initialValue));
You can delete dat.GUI element like this:
gui.remove()
You can try hiding it using:
gui.hide()
Change the remove function in the dat.gui.js file: "slice" wants to be "splice".
The answer can be found here: https://github.com/ulyssesp/dat.gui/commit/86f43c0be5db08c9a6d7339aa8287620306fb0b5

ActionScript 2 loadClip depth

When I use:
loader = new MovieClipLoader();
_root.createEmptyMovieClip("level1",getNextHighestDepth());
_root.level1.createEmptyMovieClip("image",getNextHighestDepth());
loader.loadClip("http://someimage.jpg",_root.level1.image);
...it works and the image shows up.
But when I use:
loader = new MovieClipLoader();
_root.createEmptyMovieClip("level1",getNextHighestDepth());
_root.level1.createEmptyMovieClip("level2",getNextHighestDepth());
_root.level1.level2.createEmptyMovieClip("image",getNextHighestDepth());
loader.loadClip("http://someimage.jpg",_root.level1.level2.image);
...the image doesn't show up. Can anyone tell me why? How can I make this work?
the depth you are supplying is going to be '1'. is that what you are expecting?
each movie clip has it's own set of depths, so the nextHighestDepth() of the newly create 'image' mc, will be 1. it should not prevent loading the image though.
As gthmb says, you should call getNextHighestDepth() on the same MovieClip as you do the createEmptyMovieClip() on. So your code example should be more like:
loader = new MovieClipLoader();
_root.createEmptyMovieClip("level1",_root.getNextHighestDepth());
_root.level1.createEmptyMovieClip("level2",_root.level1.getNextHighestDepth());
_root.level1.level2.createEmptyMovieClip("image",_root.level1.level2.getNextHighestDepth());
loader.loadClip("http://someimage.jpg",_root.level1.level2.image);
Also, I would recommend storing references to the created MovieClips, so you won't have to use the full path in each occurrence in the code, something in the lines of this:
loader = new MovieClipLoader();
var level1:MovieClip = _root.createEmptyMovieClip("level1",_root.getNextHighestDepth());
var level2:MovieClip = level1.createEmptyMovieClip("level2",level1.getNextHighestDepth());
var image:MovieClip = level2.createEmptyMovieClip("image",level2.getNextHighestDepth());
loader.loadClip("http://someimage.jpg",image);

Resources