Change color instead of background color of text in etherpad - etherpad

I am trying to find solution for "Authorship color" in etherpad. People who never used etherpad, please ignore this question as they will not understand.
So normally "Authorship Color" is the color provided as a background-color of the text and it can be given as parameter when initializing the pad. It helps recognizing who has written what in pad.
I want to have white background for all text and change the text-color instead of background color depending upon the user. So its like if I provided red color when initializing the pad, I want to have red writing in pad instead of red background and white writing in pad(as usual).
Please dont put this question on hold as I dont have any specific code to provide related to this problem. Ask in comment instead, i will clear whatever is not understandable.
Thanks,

First of all, Thanks to everyone for not blocking or making this question on Post as no piece of code was provided.
I was about to put bounty on this question when I decided to try myself one more time and well I have resolved the problem after going through a lot. Though, it helped me understand etherpad better.
I want to list two important links related to etherpad:
https://github.com/ether/etherpad-lite/wiki
About src - https://github.com/ether/etherpad-lite/wiki/Introduction-to-the-source
They can be very important if you are trying to understand etherpad or want to do some modification yourself.
So here is how you do it:
In src/static/js/ace2_inner.js , go to setAuthorStyle function and Replace:
// author color
authorStyle.backgroundColor = bgcolor;
parentAuthorStyle.backgroundColor = bgcolor;
// text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
{
authorStyle.color = '#ffffff';
parentAuthorStyle.color = '#ffffff';
}else{
authorStyle.color = null;
parentAuthorStyle.color = null;
}
// anchor text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
{
anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
}else{
anchorStyle.color = null;
}
With:
authorStyle.backgroundColor = '#ffffff';
parentAuthorStyle.backgroundColor = '#ffffff';
authorStyle.color = bgcolor;
parentAuthorStyle.color = bgcolor;
And comment Out:
if ((typeof info.fade) == "number")
{
bgcolor = fadeColor(bgcolor, info.fade);
}
Ofcource dont forget to restart process by bin/run.sh for changes to take place.
People, who are interested to understand how it works can keep reading.
So etherpad receives parameters with which etherpad has been initialized in src/static/js/pad.js so if you have defined: 'userColor' when you have initialized the pad, it will go in globalUserColor in mentioned file.
Then this variable globalUserColor populates pad.myUserInfo.colorId in same file.
Now in collab_client.js , this colorId gets stored in cssColor in function tellAceAuthorInfo and editor.setAuthorInfo is being called by giving parameter bgcolor: cssColor.
Now this function setAuthorInfo exists in src/static/js/ace2_inner.js which calls to other native function(same file) setAuthorStyle where we have made changes.
What I did is that instead of changing background color with provided variable bgcolor which actually holds userColor :
authorStyle.backgroundColor = bgcolor;
parentAuthorStyle.backgroundColor = bgcolor;
I changed backgroundColor to white(#ffffff) and color of text to bgcolor :
authorStyle.backgroundColor = '#ffffff';
parentAuthorStyle.backgroundColor = '#ffffff';
authorStyle.color = bgcolor;
parentAuthorStyle.color = bgcolor;
I also deleted:
// text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
{
authorStyle.color = '#ffffff';
parentAuthorStyle.color = '#ffffff';
}else{
authorStyle.color = null;
parentAuthorStyle.color = null;
}
// anchor text contrast
if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
{
anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
}else{
anchorStyle.color = null;
}
Because, these lines set the contrast of text color depending upon the background chosen color. But I have made background white and set text color to given userColor so I don't need the contrast functionality anymore.
Ultimately I also commented:
if ((typeof info.fade) == "number")
{
bgcolor = fadeColor(bgcolor, info.fade);
}
Because it makes the text fade when user is not online, at least for me it did.
So that's it. I hope it will help someone who wants same functionality as I did.

Related

How can I add data to an existing PowerPoint presentation using Node?

I have a PowerPoint template with placeholder data. I need to swap out the placeholder text with some numbers using Node, but I'm having trouble finding a package that supports this. Has anyone seen anything along these lines?
Have you looked into the PowerPoint JavaScript API?
For example:
Call the ShapeCollection.getItem(key) method to get your Shape object
Update the text value via Shape.textFrame.textRange.text
Related example from Microsoft's docs:
// This sample creates a light blue rectangle with braces ("{}") on the left and right ends
// and adds the purple text "Shape text" to the center.
await PowerPoint.run(async (context) => {
const shapes = context.presentation.slides.getItemAt(0).shapes;
const braces = shapes.addGeometricShape(PowerPoint.GeometricShapeType.bracePair);
braces.left = 100;
braces.top = 400;
braces.height = 50;
braces.width = 150;
braces.name = "Braces";
braces.fill.setSolidColor("lightblue");
braces.textFrame.textRange.text = "Shape text";
braces.textFrame.textRange.font.color = "purple";
braces.textFrame.verticalAlignment = PowerPoint.TextVerticalAlignment.middleCentered;
await context.sync();
});

Why does setting a color to a cell not work (Aspose Cells)?

I have this code to try to set the background color of a cell (among other things):
private static readonly Color CONTRACT_ITEM_COLOR = Color.FromArgb(255, 255, 204);
. . .
cell = pivotTableSheet.Cells[4, 0];
cell.PutValue(AnnualContractProductsLabel);
style = cell.GetStyle();
style.HorizontalAlignment = TextAlignmentType.Center;
style.VerticalAlignment = TextAlignmentType.Center;
style.Font.IsBold = true;
pivotTableSheet.Cells.SetRowHeight(4, 25);
style.BackgroundColor = CONTRACT_ITEM_COLOR;
pivotTableSheet.Cells[4, 0].SetStyle(style);
The setting of horizontal and vertical alignment works, as does bold and height - everything but color:
What is yet needed? I have even tried setting ForegroundColor as well as Background colors, to :
style.ForegroundColor = Color.Red;
style.BackgroundColor = Color.Blue;
...but neither does anything - the cell still looks exactly the same as the screenshot above.
Please change your code segment to (see the highlighted lines):
e.g
Sample code:
. . .
cell = pivotTableSheet.Cells[4, 0];
cell.PutValue(AnnualContractProductsLabel);
style = cell.GetStyle();
style.HorizontalAlignment = TextAlignmentType.Center;
style.VerticalAlignment = TextAlignmentType.Center;
style.Font.IsBold = true;
pivotTableSheet.Cells.SetRowHeight(4, 25);
**style.ForegroundColor = CONTRACT_ITEM_COLOR;
style.Pattern = BackgroundType.Solid;**
pivotTableSheet.Cells[4, 0].SetStyle(style);
..........
it should work fine.
I am working as Support developer/ Evangelist at Aspose.
Sometimes setting background works, sometimes it doesn't. Aspose is full of bugs -- ClosedXML is much more reliable but harder to use. Wish I would not have spent the money on a product that was developed by third party in third world county.
var cells = worksheet.Cells; //get cells collection from active worksheet <br>
var srcCells = workbook.Worksheets[1].Cells;<br>
for (int i = 0; i<rowCount; i++)<br>
{<br>
var srcStyle = srcCells[i, 0].GetStyle();<br>
var destStyle = cells[i, 0].GetStyle();<br>
destStyle.Pattern = BackgroundType.Solid;<br>
destStyle.ForegroundColor = Color.FromArgb(srcStyle.ForegroundArgbColor);<br>
cells[i, 0].SetStyle(destStyle);<br>
}<br>
Above Code does not work. srcStyle Foreground color argb is 170,215,255.
Debugging code destStyle ForegroundColor is set to 170,215,255 but when saved as xlsx all the cell backgrounds are white.
In ClosedXML code the following code works perfectly
worksheet.Row(i).Cell(0).Style.BackgroundColor = Color.FromArgb(argb)
Conclusion: Save $$$$$ and use ClosedXML
enter image description here
all is fine only ForegroundColor is not showing

(THREE.js) Material isn't working on my custom THREE.Geometry shape

I created a triangle and I am trying to make it red. However it remains black. The problem doesn't seem to be the material as it works on other Geometries I've made.
Here is my triangle:
var triangle = new THREE.Geometry();
triangle.vertices.push(
new THREE.Vector3(-10,10,0),
new THREE.Vector3(-10,-10,0),
new THREE.Vector3(10,-10,0)
);
triangle.faces.push(new THREE.Face3(0,1,2));
triangle.computeBoundingSphere();
this.redtriangle = new THREE.Mesh(triangle, this.redMat)
I tried some suggestions online to color it using:
triangle.faces.push(new THREE.Face3(0,1,2));
triangle.faces[0].vertexColors[0] = new THREE.Color(0xFF0000);
triangle.faces[0].vertexColors[1] = new THREE.Color(0xFF0000);
triangle.faces[0].vertexColors[2] = new THREE.Color(0xFF0000);
My material
this.redMat = new THREE.MeshLambertMaterial ({
color: 0xFF0000,
shading:THREE.FlatShading,
// I added this line for the suggestion above
// vertexColors:THREE.VertexColors,
side:THREE.DoubleSide
})
I've also tried to insert
triangle.colorsNeedUpdate = true;
or
geometry.colorsNeedsUpdate = true;
but no matter what variations/where I put it, it doesn't want to work. The triangle stays black.
Your vertices definition is in clockwise order when it should have been counter-clockwise. So if you change your new THREE.Face3(0,1,2) to new THREE.Face3(0,2,1) you should see something.

SVG - raphael: storing last path selected so element data can be changed

The current state
As from my link you can pick different regions on the map and everything seems to be working until you re-select a county you have selected before. Data values stored with each path decide if it isSelected or notSelected. I have no problem in changing the element data just clicked with this but I can't find a way of storing the last element selected in a way that I can change it's element data. Which means I first have to click on the previous county to set it's element data to notSelected
First I define var currentcountyselected = "";. This allows me to store the paths[arr[this.id]].name;. When I click on a new path I can make the last path fill change with $('#'+currentcountyselected).attr({fill: attributes.fill});
In Raphael's for loop I set obj.data('selected', 'notSelected'); so all path elements are set to notSeelected.
So what I need is some way to store the last path so I can change it's element data
This is the click function cleaned up from live example.
obj.click(function(){
if(this.data('selected') == 'notSelected')
{this.animate({fill: '#698B22' }, 300);
this.data('selected', 'isSelected');
$('#'+currentcountyselected).attr({fill: attributes.fill});
paths[arr[this.id]].value = "isSelected";
currentcountyselected = paths[arr[this.id]].name;
}
else
{this.animate({fill: '#32CD32'}, 300);
paths[arr[this.id]].value = "notSelected"; /* set path value*/
this.data('selected', 'notSelected');
}
});/* end mark selections */
I've been working on this project for a while and the client now wants the interface to work differently. This has really ate up my hourse.
EDIT:Although I have found a solution by simply taking out the if/else I would still like to know how to get at element data in a previous path (or any path for that matter).
Here is my solution, posted as it might help someone. The link in my question has problems with click happy users.
Globals
var previouscountyselected = "Mayo"; /* default start, can be any county(path) */
var start = true;
var past = null;
Changed code
obj.click(function(){
if(paths[arr[this.id]].value == 'notSelected')
{
this.animate({fill: '#698B22'}, 200);
paths[previouscountyselected].value = "notSelected";
paths[arr[this.id]].value = "isSelected";
previouscountyselected = paths[arr[this.id]].name;
if (!start && past != this)
{
past.animate({ fill: '#fff' }, 200);
}
past = this;
start = false;
}
else if(paths[arr[this.id]].value == 'isSelected')
{
this.animate({fill: '#32CD32'}, 200);
paths[arr[this.id]].value = "notSelected"; /* set path value */
}
});
Overview
if (!start && past != this) is a little unusual and is required or animated fades get messed up and choppy. The fade is not triggered if it is the first time a path is clicked and if you just hammer clicks on one path it doesn't fade to white. The main if/else handles the actual control value.
Until I get a jsfiddle up this link will demonstrate the desired behaviour.
Note! the drop menu in this link does not work.
Click happy friendly

Resize CATextLayer to fit text on iOS

All my research so far seems to indicate it is not possible to do this accurately. The only two options available to me at the outset were:
a) Using a Layout manager for the CATextLayer - not available on iOS as of 4.0
b) Use sizeWithFont:constrainedToSize:lineBreakMode: and adjust the frame of the CATextLayer according to the size returned here.
Option (b), being the simplest approach, should work. After all, it works perfectly with UILabels. But when I applied the same frame calculation to CATextLayer, the frame was always turning out to be a bit bigger than expected or needed.
As it turns out, the line-spacing in CATextLayers and UILabels (for the same font and size) is different. As a result, sizeWithFont (whose line-spacing calculations would match with that of UILabels) does not return the expected size for CATextLayers.
This is further proven by printing the same text using a UILabel, as against a CATextLayer and comparing the results. The text in the first line overlaps perfectly (it being the same font), but the line-spacing in CATextLayer is just a little shorter than in UILabel. (Sorry I can't upload a screenshot right now as the ones I already have contain confidential data, and I presently don't have the time to make a sample project to get clean screenshots. I'll upload them later for posterity, when I have the time)
This is a weird difference, but I thought it would be possible to adjust the spacing in the CATextLayer by specifying the appropriate attribute for the NSAttributedString I use there, but that does not seem to be the case. Looking into CFStringAttributes.h I can't find a single attribute that could be related to line-spacing.
Bottomline:
So it seems like it's not possible to use CATextLayer on iOS in a scenario where the layer is required to fit to its text. Am I right on this or am I missing something?
P.S:
The reason I wanted to use CATextLayer and NSAttributedString's is because the string to be displayed is to be colored differently at different points. I guess I'd just have to go back to drawing the strings by hand as always....of course there's always the option of hacking the results from sizeWithFont to get the proper line-height.
Abusing the 'code' tags a little to make the post more readable.
I'm not able to tag the post with 'CATextLayer' - surprisingly no such tags exist at the moment. If someone with enough reputation bumps into this post, please tag it accordingly.
Try this:
- (CGFloat)boundingHeightForWidth:(CGFloat)inWidth withAttributedString:(NSAttributedString *)attributedString {
CTFramesetterRef framesetter = CTFramesetterCreateWithAttributedString( (CFMutableAttributedStringRef) attributedString);
CGSize suggestedSize = CTFramesetterSuggestFrameSizeWithConstraints(framesetter, CFRangeMake(0, 0), NULL, CGSizeMake(inWidth, CGFLOAT_MAX), NULL);
CFRelease(framesetter);
return suggestedSize.height;
}
You'll have to convert your NSString to NSAttributedString. In-case of CATextLayer, you can use following CATextLayer subclass method:
- (NSAttributedString *)attributedString {
// If string is an attributed string
if ([self.string isKindOfClass:[NSAttributedString class]]) {
return self.string;
}
// Collect required parameters, and construct an attributed string
NSString *string = self.string;
CGColorRef color = self.foregroundColor;
CTFontRef theFont = self.font;
CTTextAlignment alignment;
if ([self.alignmentMode isEqualToString:kCAAlignmentLeft]) {
alignment = kCTLeftTextAlignment;
} else if ([self.alignmentMode isEqualToString:kCAAlignmentRight]) {
alignment = kCTRightTextAlignment;
} else if ([self.alignmentMode isEqualToString:kCAAlignmentCenter]) {
alignment = kCTCenterTextAlignment;
} else if ([self.alignmentMode isEqualToString:kCAAlignmentJustified]) {
alignment = kCTJustifiedTextAlignment;
} else if ([self.alignmentMode isEqualToString:kCAAlignmentNatural]) {
alignment = kCTNaturalTextAlignment;
}
// Process the information to get an attributed string
CFMutableAttributedStringRef attrString = CFAttributedStringCreateMutable(kCFAllocatorDefault, 0);
if (string != nil)
CFAttributedStringReplaceString (attrString, CFRangeMake(0, 0), (CFStringRef)string);
CFAttributedStringSetAttribute(attrString, CFRangeMake(0, CFAttributedStringGetLength(attrString)), kCTForegroundColorAttributeName, color);
CFAttributedStringSetAttribute(attrString, CFRangeMake(0, CFAttributedStringGetLength(attrString)), kCTFontAttributeName, theFont);
CTParagraphStyleSetting settings[] = {kCTParagraphStyleSpecifierAlignment, sizeof(alignment), &alignment};
CTParagraphStyleRef paragraphStyle = CTParagraphStyleCreate(settings, sizeof(settings) / sizeof(settings[0]));
CFAttributedStringSetAttribute(attrString, CFRangeMake(0, CFAttributedStringGetLength(attrString)), kCTParagraphStyleAttributeName, paragraphStyle);
CFRelease(paragraphStyle);
NSMutableAttributedString *ret = (NSMutableAttributedString *)attrString;
return [ret autorelease];
}
HTH.
I have a much easier solution, that may or may not work for you.
If you aren't doing anything special with the CATextLayer that you can't do a UILabel, instead make a CALayer and add the layer of the UILabel to the CALayer
UILabel*label = [[UILabel alloc]init];
//Do Stuff to label
CALayer *layer = [CALayer layer];
//Set Size/Position
[layer addSublayer:label.layer];
//Do more stuff to layer
With LabelKit you don't need CATextLayer anymore. No more wrong line spacing and wider characters, all is drawn in the same way as UILabel does, while still animated.
This page gave me enough to create a simple centered horizontally CATextLayer : http://lists.apple.com/archives/quartz-dev/2008/Aug/msg00016.html
- (void)drawInContext:(CGContextRef)ctx {
CGFloat height, fontSize;
height = self.bounds.size.height;
fontSize = self.fontSize;
CGContextSaveGState(ctx);
CGContextTranslateCTM(ctx, 0.0, (fontSize-height)/2.0 * -1.0);
[super drawInContext:ctx];
CGContextRestoreGState(ctx);
}

Resources