How set caret position in tinyMCE? - vue.js

I create TinyMCE based custom editor in Vue component.
After #input caret position sets to 0 (to left position)
so I get caret position
window.tinyMCE.activeEditor.selection.getRng().startOffset
but I can't set it
window.tinyMCE.activeEditor.selection.setRng(4)
window.tinyMCE.activeEditor.setContent('<p>test test</p>')
not working also
var ed = window.tinyMCE.activeEditor.selection
ed.setCursorLocation(ed.getContent(), 3)
Please help

TinyMCE selection.setRng() doesn't take a number, it takes a Range object.
Some good documentation on how this Range object works, can be found on javascript.info
Here's an example on how to set your cursor to the beginning of the TinyMCE editor:
//make it easier for yourself, we only get so many keystrokes in our lives
const editor = window.tinyMCE.activeEditor;
const selection = editor.selection;
//get the HTML element container
const container = editor.contentAreaContainer;
//get the first element of that container
const firstElementChild = container.firstElementChild;
//create a Range object
const range = new Range();
//set the start and end (start = end, as we want the selection to be collapsed; more info in the documentation above)
range.setStart(firstElementChild, 0);
range.setEnd(firstElementChild, 0);
//Set the editor's selection to our created range
selection.setRng(range, true); //true means it's selected forward; false for backwards selection

In my editor I used this:
let rng = tinymce.DOM.createRng(); // the range object
var newNode = editor.dom.select('#_mce_temp_rob')[0];
rng.setStart(newNode.firstChild, 0); // 0 is the offset, it will be at the beginning of the line.
rng.setEnd(newNode.firstChild, 0);
editor.selection.setRng(rng);
Now I guess implementation will vary in your case as I did this while back and can't remember much of it but hope this helps you in some way.
More here: https://exceptionshub.com/whats-the-best-way-to-set-cursorcaret-position.html

Related

Google Docs script, return text value in the middle of specified text

[current result][1]
[1]: https://i.stack.imgur.com/O8AGa.png
The problem is that they all apply to the same line
I want to get the values individually from the same line
Rule
▶random text◁
→ Change only values between ▶ and ◁
Script currently in use
var body = DocumentApp.getActiveDocument().getBody();
var foundElement = body.findText('▶([^\S]+)◁');
while (foundElement != null) {
// Get the text object from the element
var foundText = foundElement.getElement().asText();
// Where in the element is the found text?
var start = foundElement.getStartOffset();
var end = foundElement.getEndOffsetInclusive();
// Set Bold
foundText.setBold(start, end, true);
// Change the Foreground color
foundText.setForegroundColor(start, end, "#ff326d");
// Find the next match
foundElement = body.findText('▶([^\S]+)◁', foundElement);
}
Some regular expressions are not fully supported
As per the documentation A subset of the JavaScript regular expression features are not fully supported, such as capture groups and mode modifiers.
I'd recommend to open a feature request on Google Issue Tracker as recommended here

Using a loop within the menu UI script beginner

I am trying to create a dynamic menu that creates the names of the sheets in it. I dont often code and need some help. currently the code ON_Open creates a menu, creates its first item in the menu, then add a seperator and then goes into a loop. it checks how many sheets there are and starts at the first one. stores the name and makes a menu item with that name, then advances to the next sheet. gets its name and makes the next menu item. i can get the loop to work with the menu UI syntax.im not worried about the names. i will try to figure that out next,just want it to create the menus first
function onOpen() {
var spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
var numsheets = spreadsheet.getNumSheets();
SpreadsheetApp.getUi
.createMenu('SWMS CREATER')
.addItem('Create New SWMS', 'showPrompt')
.addSeparator()
for ( var i = 0; i < numsheets.length;i++ ) {
var ui = SpreadsheetApp.getUi();
var subMenu = ui.createMenu('Test Menu');
subMenu.addItem('Test script'i ,'showPrompt');
}
}
The OP is trying to create a dynamic menu that lists each of the sheets in the spreadsheet. The OP's code is very close to working - there are just a small, but significant, number of adjustments.
function onOpen() {
var ui = SpreadsheetApp.getUi();
var menu = ui.createMenu('OPSWMS CREATER')
.addItem('Create New SWMS', 'showPrompt')
.addSeparator();
var sheetList = SpreadsheetApp.getActiveSpreadsheet().getSheets();
var subMenu = ui.createMenu('OPTest Menu');
for (var i = 0; i < sheetList.length; i++) {
subMenu.addItem(sheetList[i].getName(), 'showPrompt');
}
menu.addSubMenu(subMenu).addToUi();
}
Summary of major differences:
1) variable ui moved out of the loop; and then re-used where possible.
2) variable menu established and also moved out of the loop. This is re-used to add the subMenu in the last line of code.
3) added a semi-colon after .addSeparator() (though optional)
4) used .getSheets() to get all the sheets. This is the first key element missing from the OP code.
5) dropped var numsheets line. You don't need this because you can get the same count on sheetList.
6) within the loop, two things to note
sheetList[i] the i in square brackets ([i]) returns the relevant item from "sheetList";
.getName() returns the name of the sheet. Combined, sheetList[i].getName() gives you the name of the sheet, and lets you add it as a menu item selection.
7) menu.addSubMenu(subMenu).addToUi(); This add the contents of the loop to the menu. This is the second key element missing from the OP code.
Credit:
Akshin Jalilov's answer to Google Apps Script: Dynamically creating spreadsheet menu items

Photoshop CC eye dropper tool script

I have a batch action to place a pure white background behind an image. I want to be able to select the color from a fixed pixel position on each photo. When I record the eye dropper in actions it only records the color i picked, not the action of picking the color. I have looked into scripting and tried various solutions on the web.
This is the script I have tried:
var docRef = app.activeDocument;
var pixelLoc = [32,42];
var colorSamplerRef = docRef.colorSamplers.add(pixelLoc);
app.foregroundColor = colorSamplerRef.color;
It doesn't perform the action I need though. Which is select - > color range -> eye dropper tool on fixed position
To achieve this you can create a custom function which invokes the Color Range generated selection, (named selectColorRange in the example gist below).
The selectColorRange function utilizes new ActionDescripter() to configure the properties, which are akin to the settings options shown in the dialog box when you manually choose Select -> Color Range from the Menu bar. This function is invoked after adding the colorSampler at a given x/y coordinate as follows:
selectColorRange(sampledColor, 80); // <-- Specify the fuzziness as required.
Note how we pass in the previous sampledColor value, and a fuzziness value of 80, (which is the default value used in Photoshop).
Example gist:
var docRef = app.activeDocument; // Assumes a document is active.
// Remove any Color Samplers that may already exist.
docRef.colorSamplers.removeAll();
// deselct any selection that may already exist.
docRef.selection.deselect();
// Get color sample from a given x,y coordinate.
var pixelLoc = [32,42];
var colorSampleRef = docRef.colorSamplers.add(pixelLoc);
var sampledColor = colorSampleRef.color;
// Set the foreground color to the sampled color.
app.foregroundColor = sampledColor;
/**
* Invokes and configures `Select > Color Range` from menu bar.
* #param {Object} color - The sampled color object.
* #param {Number} [fuzziness=80] - The Fuziness value (between 0-200).
*/
function selectColorRange(color, fuzziness) {
fuzziness = (typeof fuzziness !== 'undefined') ? fuzziness : 80;
var d1 = new ActionDescriptor();
// Set the amount of Fuzziness.
d1.putInteger(charIDToTypeID('Fzns'), fuzziness);
// Set invert option to false.
d1.putBoolean(charIDToTypeID('Invr'), false);
d1.putInteger(stringIDToTypeID('colorModel'), 0);
// Set the lAB value for Minimum.
var d2 = new ActionDescriptor();
d2.putDouble(charIDToTypeID('Lmnc'), color.lab.l);
d2.putDouble(charIDToTypeID('A '), color.lab.a);
d2.putDouble(charIDToTypeID('B '), color.lab.b);
d1.putObject(charIDToTypeID('Mnm '), charIDToTypeID('LbCl'), d2);
// Set the lAB value for Maximum.
var d3 = new ActionDescriptor();
d3.putDouble(charIDToTypeID('Lmnc'), color.lab.l);
d3.putDouble(charIDToTypeID('A '), color.lab.a);
d3.putDouble(charIDToTypeID('B '), color.lab.b);
d1.putObject(charIDToTypeID('Mxm '), charIDToTypeID('LbCl'), d3);
// Run the Color Range command without showing dialog.
executeAction(charIDToTypeID('ClrR'), d1, DialogModes.NO);
}
// Invoke the function passing in the sample
// color and default fuzziness value.
selectColorRange(sampledColor, 80);
//docRef.selection.clear();
//docRef.selection.fill(app.foregroundColor);
// Remove the Color Sampler.
colorSampleRef.remove();
Additional notes:
Photoshop allows a maximum of four color samplers to be added. If the document already included four color samplers then we'd get an error when attempting to add another one. To avoid the potential of this happening we invoke docRef.colorSamplers.removeAll(); to remove them all first.
Also, to ensure the resultant selection (i.e. the selection created after invoking the selectColorRange function), is not affected by any existing selection(s) we deselect them all first by invoking docRef.selection.deselect();
Finally, the color sampler that we initially added is removed by calling colorSampleRef.remove();
I'm unsure from your question what you intend to to with the selection once it's been created. As an example;
Lets say you wanted to clear the contents of the selection then you'd invoke docRef.selection.clear();.
If you wanted to fill the resultant selection with the previously sampled color then call docRef.selection.fill(app.foregroundColor);

Adobe Photoshop Scripting - How to Select Bounding Box Around Current Selection?

Does anyone know whether it's possible, in Photoshop extend script, to convert an irregular selection (e.g. magic wand tool selection) into a rectangular selection encompassing the top, left, bottom and right bounds of the selection?
Here it is, I have documented the code so you can modify it later if you need. Also, check page 166 and following of Photoshop's JS reference manual, you may read more about selections - you can set feather, extend/intersect/etc. the selection if you need to.
Made for CS6, should work with latter.
#target photoshop
if (documents.length == 0) {
alert("nothing opened");
} else {
// start
//setup
var file = app.activeDocument;
var selec = file.selection;
//run
var bnds = selec.bounds; // get the bounds of current selection
var // save the particular pixel values
xLeft = bnds[0],
yTop = bnds[1],
xRight = bnds[2],
yBottom = bnds[3];
var newRect = [ [xLeft,yTop], [xLeft,yBottom], [xRight,yBottom], [xRight,yTop] ]; // set coords for selection, counter-clockwise
selec.deselect;
selec.select(newRect);
// end
}

JSFL: selecting items returned by fl.findObjectInDocByType()

I can't seem to use the info returned by fl.findObjectInDocByType() with fl.getDocumentDOM().selection.
I want to use document.setTextRectangle to re-size some text fields from an array generated using fl.findObjectInDocByType().
I can easily access all the textObject properties but since document.setTextRectangle requires a current selection, I am at a loss.
The example in the documentaion for setting selection is:
fl.getDocumentDOM().selection = fl.getDocumentDOM().getTimeline().layers[0].frames[0].elements[0];
fl.findObjectInDocByType() returns an array of objects with the attributes: (object.timeline, object.layer, object.frame, object.parent)
But these are objects, and don't have a property for array index numbers required by fl.getDocumentDOM().selection=...
var doc = fl.getDocumentDOM();
var textFieldArray = fl.findObjectInDocByType("text", doc);
for (var i=0; i < textFieldArray.length; i ++){
fnResizeTheTextField(textFieldArray[i]);
}
function fnResizeTheTextField(theTextField){
//force current selection to be theTextField
//doc.selection MUST be an array, so assign theTextField to an array...
var selectArray = new Array();
selectArray[0] = theTextField.obj;
var theTimeline =theTextField.timeline;
var theLayer =theTextField.layer;
var theFrame =theTextField.frame;
doc.currentTimeline =theTextField.timeline;
doc.selection = doc.getTimeline().theLayer.theFrame.selectArray;//error
//resize the text rectangle
doc.setTextRectangle({left:0, top:0, right:1000, bottom:1000});
}
}
Result: Error:doc.getTimeline().theLayer has no properties
It turns out, the ObjectFindAndSelect.jsfl script already contains a function specifically for this: fl.selectElement(). Much more elegant:
var doc = fl.getDocumentDOM();
// generate an array of elements of type "text"
var textFieldArray = fl.findObjectInDocByType("text", doc);
for (var i=0; i < textFieldArray.length; i ++){
fnResizeTheTextField(textFieldArray[i]);
}
function fnResizeTheTextField(theTextField){
//force current selection to be theTextField
fl.selectElement(theTextField,false);//enter 'edit mode' =false...
//resize the text rectangle
doc.setTextRectangle({left:0, top:0, right:1000, bottom:1000});
}
}
I found the answer. In order to select anything for a document level operation, you have to also make flash focus on the keyframe of that object.
so, if I loop through an array of objects created by fl.findObjectInDocByType(), I use this code to make flash focus on the object correctly:
function fnMakeFlashLookAt(theObject){
doc.currentTimeline =theObject.timeline;
doc.getTimeline().currentLayer =theObject.layer;
doc.getTimeline().currentFrame =theObject.frame;
}
this may not work on objects nested inside a symbol however.
I had a similar issue recently, and apparently all google results about setTextRectangle() direct us here. It's unbelievable how poorly documented jsfl is :)
If you need to use setTextRectangle() inside an library item that is not on stage, you need to open for edit the item first.
Here's the code that solved my problem:
library.selectItem(libraryItemName);
doc.selection = [tf];//where tf is the reference to textfield we need to edit
doc.library.editItem(libraryItemName);
doc.setTextRectangle({left:l, top:t, right:r, bottom:b});
doc.selectNone();
If you have a better working solution, please post. I hope it saves somebody's time. Good luck!