I am working with the mxClient library.
I have the following problem, I need to change only the visual name of my node.
But I am not succeeding.
I have the following code:
var data = "Attributes';
var node = mxUtils.createXmlDocument (). createElement (data);
node.setAttribute ('label', data);
node.setAttribute ('idBD', 123);
/ * here I use some styles and then assign them (left) * /
var v2 = graph.insertVertex (parent, null, node, x, y, 250, 100, 'left');
Now I just want to change the visual name of my node, which would be 'Attributes'.
I have already tried several ways, example:
v2.setValue (cell,value) -> But then I lose the previously defined attributes.
Thank you
I suggest you to mimic what is advised in https://jgraph.github.io/mxgraph/docs/js-api/files/model/mxCell-js.html for the graph.cellLabelChanged function in that case:
check if the value is a node
in that case, update the 'label' node attribute
function setCellLabel(cell, label) {
if (mxUtils.isNode(cell.value)) {
cell.value.setAttribute('label', label);
} else {
cell.setValue(label);
}
}
// set the new label
setCellLabel(v2, 'my new label');
You should also be able to enrich the mxCell prototype with a new function like
mxCell.prototype.setLabel = function(label) {
if (mxUtils.isNode(this.value)) {
this.value.setAttribute('label', label);
} else {
this.value = label;
}
}
// set the new label
v2.setLabel('my new label');
Related
I have a big google doc file with over 100 pages(with tables etc) and there is some reference text in that document in multiple locations reference texts are highlighted with the color "grey", I want to have a function that can find those colors/style in the table or paragraph and delete it. So Step 1 is finding it, and then deleting(removing those texts from the document) it in one go.
How we did it in MS Word is, we created custom styles and assign those styles to those "Remarks Text"(in grey) and in VBA we look for text matching the style name, and if it returns true than we delete those texts. As much i know about doc, there is no option to create custom styles.
Here is the code I am trying:-
function removeText()
{
var doc = DocumentApp.getActiveDocument()
var body = doc.getBody()
body.getParagraphs().map(r=> {
if(r.getAttributes().BACKGROUND_COLOR === "#cccccc")
{
//Don't know what to do next, body.removeChild(r.getChild()) not working
}
})
}
Can you guide me on how I can achieve this effectively please.
Thanks
Try this
body.getParagraphs().forEach( r => {
if( r.getAttributes().BACKGROUND_COLOR === "#cccccc" ) {
r.removeFromParent();
}
}
Reference
Paragraph.removeFromParent()
Google Apps Script hasn't a method to find text based on their style attributes, instead we need to get each part and in order to be able to get their attributes. The following example, if the format is applied to the whole paragraph, it is deleted, if not, it uses the regular expression for finding any single character ..
function removeHighlightedText() {
// In case that we want to remove the hightlighting instead of deleting the content
const style = {};
style[DocumentApp.Attribute.BACKGROUND_COLOR] = null;
const backgroundColor = '#cccccc';
const doc = DocumentApp.getActiveDocument();
const searchPattern = '.';
let rangeElement = null;
const rangeElements = [];
doc.getParagraphs().forEach(paragraph => {
if (paragraph.getAttributes().BACKGROUND_COLOR === backgroundColor) {
paragraph.removeFromParent();
// Remove highlighting
// paragraph.setAttributes(style);
} else {
// Collect the rangeElements to be processed
while (rangeElement = paragraph.findText(searchPattern, rangeElement)) {
if (rangeElement != null && rangeElement.getStartOffset() != -1) {
const element = rangeElement.getElement();
if (element.getAttributes(rangeElement.getStartOffset()).BACKGROUND_COLOR === backgroundColor) {
rangeElements.push(rangeElement)
}
}
}
}
});
// Process the collected rangeElements in reverse order (makes things easier when deleting content)
rangeElements.reverse().forEach(r => {
if (r != null && r.getStartOffset() != -1) {
const element = r.getElement();
// Remove text
element.asText().deleteText(r.getStartOffset(), r.getEndOffsetInclusive())
// Remove highlighting
// element.setAttributes(textLocation.getStartOffset(), textLocation.getEndOffsetInclusive(), style);
}
});
}
In Polymer 1.*, I have a dom repeat. The obj.property is not updating in the DOM when I mutate array itemsCollection.
I tried 'this.notifyPath(itemCollection.${i}.value)' after 'this.set(itemCollection.${i}.value, existing.value);' but it did not update in the DOM.
Am I supposed to use this.notifySplices instead? And if so, how would I use it after this.set(itemCollection.${i}.value, existing.value);?
_populateAlerts: function(existingValues) {
this.itemCollection.forEach((question, i)=> {
const existing =
existingValues.find(value => value.name === question.name);
this.set(`itemCollection.${i}.picklist_value_id`,
existing.picklist_value_id);
this.set(`itemCollection.${i}.value`, existing.value);
});
},
this.notifyPath is never needed if you use this.set, and should probably only be used if another framework sets the variable.
It's weird code, with cubic looping, and setting subproperties in itemCollection, while looping through said array, through Polymer methods.
Anyway, I wonder if there is an Array reference problem. Where existingValues = itemCollection, so every time existingValues changes, itemCollection is changed as well but in a way that doesn't update the DOM. This means that itemCollection tries to set itself to an already existing value when being set through this.set, hence not updating the DOM through dirty checking.
A simple solution could be to just set itemCollection with a copy of itself.
_populateAlerts: function(existingValues) {
this.itemCollection.forEach((question, i)=> {
const existing =
existingValues.find(value => value.name === question.name);
this.set(`itemCollection.${i}.picklist_value_id`,
existing.picklist_value_id);
this.set(`itemCollection.${i}.value`, existing.value);
});
this.set('itemCollection', JSON.parse( JSON.stringify(this.itemCollection) );
// Alternatively
// const tempArr = JSON.parse( JSON.stringify(this.itemCollection) );
// this.set('itemCollection, []); // override dirty checking, as stated in the documentation
// this.set('itemCollection', tempArr);
},
Another solution could be to create a new array of existingValues, breaking the "reference chain" so existingValues != itemCollection. That is, if the issue is a reference problem.
_populateAlerts: function(existingValues) {
const copiedExistingValues = JSON.parse( JSON.stringify(existingValues) );
this.itemCollection.forEach((question, i)=> {
const existing =
copiedExistingValues.find(value => value.name === question.name);
this.set(`itemCollection.${i}.picklist_value_id`,
existing.picklist_value_id);
this.set(`itemCollection.${i}.value`, existing.value);
});
},
However, if you're only interested in the first occurance, I would create an object of existingArrays to avoid cubic looping while also breaking the reference chain.
_populateAlerts: function(existingValues) {
const existingValuesObj = this._createObjectFrom(existingValues, 'name');
this.itemCollection.forEach((question, i)=> {
this.set(`itemCollection.${i}.picklist_value_id`,
existingValuesObj[question.name].picklist_value_id);
this.set(`itemCollection.${i}.value`, existingValuesObj[question.name].value);
});
},
_createObjectFrom: function (arr, property, overwritePreviousObj) {
var obj = {};
var propertyName = '';
for (var i = 0; i < arr.length; i++) {
propertyName = arr[i][property];
if (overwritePreviousObj) {
obj[propertyName] = arr[i];
} else if (!obj.hasOwnProperty(propertyName) {
obj[propertyName] = arr[i];
}
}
return obj;
},
Since this is always false:
doc.getBody().getParagraphs()[0] == doc.getBody().getParagraphs()[0]
How do you test element equality in Apps-Script?
I'm not entirely sure if you are comparing the contents or the position. Let's assume you can compare the contents with getAsText().
To compare the position, it's fairly easy to create an element index (the path at which an element appears in a document).
/**
* create a path in document serial for an element
* #param {Document.Element} element an element
* #param {string} [path=''] the path so far
* #return {string} the path
*/
function pathInDocument (element,path) {
path = path || "" ;
var parent = element.getParent();
if (parent) {
path = pathInDocument( parent , Utilities.formatString ( '%04d.%s', parent.getChildIndex(element),path ));
}
return path;
};
which can be called like this
var path = pathInDocument(element);
and will return something like
0000.0001.0004....etc
If the paths of two elements are the same, they appear in the same position in the document and are therefore the same element.
For an example of using this (in this case to sort bookmarks) see https://ramblings.mcpher.com/google-docs/sorting-bookmarks-in-a-document/
Eventually I came up with a solution for comparing elements.
first of all let me point that this code works and returns true:
var paragraphs = doc.getBody().getParagraphs();
Logger.log(paragraphs[0] == paragraphs[0]);
that is because you are comparing the same element from an array. The way you did in the question, you had two different arrays of paragraphs.
However there are situations when you can not do that, because you may not be comparing paragraphs, or you don't even know what elements you have.
What I do is create a path to the elements all the way up to the body section of the Document. If the paths are equal, you have the same elements.
function bodyPath(el, path) {
path = path? path: [];
var parent = el.getParent();
var index = parent.getChildIndex(el);
path.push(index);
var parentType = parent.getType();
if (parentType !== DocumentApp.ElementType.BODY_SECTION) {
path = bodyPath(parent, path);
} else {
return path;
};
return path;
};
function isSameElement(element1, element2) {
var path1 = bodyPath(element1);
var path2 = bodyPath(element2);
if (path1.length == path2.length) {
for (var i=0; i<path1.length; i++) {
if (path1[i] !== path2[i]) {
return false;
};
};
} else {
return false;
};
return true;
};
This method has proved itself quite fast. Any additions are welcome!
I wrote a recursive solution to avoid string comparison and short-circuit the path walk. Note that you can always convert to loops if you're not happy with the stack dependency of recursion.
function isSameElement(elem1, elem2) {
if (!elem1 && !elem2) return true;
if (!elem1 || !elem2) return false;
var p1=elem1.getParent();
var p2=elem2.getParent();
if (!p1 && !p2) {
return true;
} else if (!p1 || !p2) {
return false;
} else if (p1.getChildIndex(elem1)==p2.getChildIndex(elem2)){
return isSameElement(p1,p2);
} else {
return false;
}
}
I tried it and its always false, for some reason the method returns different objects.
In this case you are comparing the objects and not the content of the objects which indeed are different. You could get the content of the object with .getText(), then this comparison would return true.
I have a Java object where the person object contains a displayName object. I have converted it to a JSON object for my JSP. The data looks like the following:
var people = [
{"id":52959,"displayName":{"firstName":"Jim","lastName":"Doe","middleName":"A"},"projectId":50003,"grade":"8","statusCode":"A","gradYear":2016,"buyer":false},
{"id":98765,"displayName":{"firstName":"Jane","lastName":"Doe","middleName":"Z"},"projectId":50003,"grade":"8","statusCode":"A","gradYear":2016,"buyer":true}
];
I want to bind my columns to the name properties that reside within the displayName object, but I am cannot get the column definition to recognize where the data resides. Here is an example of my firstName column definition:
{id: 'displayName.firstName', field: 'displayName.firstName', name: 'First Name',
width: 110, sortable: true, editor: TextCellEditor, formatter: SpaceFormatter,
cssClass: '', maxLength: 250, editable: true}
The view does not render the names although the data is there. Is it possible to bind a column to an object property that resides within another object? If so, what am I doing wrong?
Slickgrid doesn't support this capability by default, but you can workaround it by adding custom value extractor to your options object:
var options = {
dataItemColumnValueExtractor: function(item, columnDef) {
var names = columnDef.field.split('.'),
val = item[names[0]];
for (var i = 1; i < names.length; i++) {
if (val && typeof val == 'object' && names[i] in val) {
val = val[names[i]];
} else {
val = '';
}
}
return val;
}
}
var grid = new Slick.Grid($("#slickgrid"), data, columns, options);
The code is tested with slickgrid 2.0 and is working just fine. Unfortunately seems that slickgrid code is a bit inconsistent and editors don't take into account this option, so this solution is usable only if you will display the data without editing.
I know this is a bit old... but my work around is to do a pre-process on my items. Basically, flattening the model out:
var preProcessItems = function (items) {
var newItems = [];
for (var i = 0; i < items.length; i++) {
var item = items[i];
item['firstName'] = item['displayName']['firstName'];
newItems[i] = item;
}
return newItems;
};
/// when the value is updated on the flat structure, you can edit your deep value here
var fNameFormatter = function (row, cell, value, columnDef, dataContext) {
// datacontext.displayName.firstName = value;
return value ? value : "";
};
This problem seems to be more a of a data modeling issue though.
how to compare two arraycollection
collectionArray1 = ({first: 'Dave', last: 'Matthews'},...........n values
collectionArray = ({first: 'Dave', last: 'Matthews'},...........n values
how to compare..if equal just alert nochange if not alert chaged
If you just want to know if they are different from each other, meaning by length, order or individual items, you can do the following, which first checks to see if the lengths are different, then checks to see if the individual elements are different. This isn't terribly reusable, it's left as an exercise for the reader to split this apart into cleaner chunks :)
public function foo(coll1:ArrayCollection, coll2:ArrayCollection):void {
if (coll1.length == coll2.length) {
for (var i:int = 0; i < coll1.length; i++) {
if (coll1[i].first != coll2[i].first || coll1[i].last != coll2[i].last) {
Alert.show("Different");
return;
}
}
}
Alert.show("Same");
}
/* elements need to implement valueOf
public function valueOf():Object{}
*/
public static function equalsByValueOf(
first:ArrayCollection,
seconde:ArrayCollection):Boolean{
if((first==null) != (seconde==null) ){
return false;
}else if(!first && !seconde){
return false;
}
if(first.length!=seconde.length){
return false;
}
var commonLength:int = first.length;
var dictionary:Dictionary = new Dictionary();
for(var i:int=0;i<commonLength;i++){
var item1:Object = first.getItemAt(i);
var item2:Object = seconde.getItemAt(i);
dictionary[item1.valueOf()]=i;
dictionary[item2.valueOf()]=i;
}
var count:int = 0;
for (var key:Object in dictionary)
{
count++;
}
return count==commonLength;
}
/* valueOf sample
* something like javaObject.hashCode()
* use non changing fields(recommended)
*/
public function valueOf():Object{
return "_"+nonChangeField1+"_"+nonChangeField2+"...";
}
I was going to say this.
if(collectionArray === collectionArray1)
But that wont work (not triple = signs). As === is used to see classes.
I would write a function called check if object exists in array.
Create an array to hold elements that are not found. eg notFound
in Collection1 go through all the element and see if they exist in Collection2, if an element does not exist, add it to the notFound array. Use the function your created in step1
Now check Collection2, if an element is not found add it to the notFound array.
There is no 5.
Dude, use the mx.utils.ObjectUtil... the creators of actionscript have already thought about this.
ObjectUtil.compare(collection1, collection2) == 0;