Hey all, I haven't been contributing on the forums much recently but I think that's just how life goes sometimes eh?
I need some help using the Javascript API because I just can't totally wrap my head around the Javascript language yet. I do not have much code AT ALL because I can't even run a "simple" operation via the api yet. Here's what my ultimate workflow should look like:
- User initiates the PhotoPreview (PP) command.
- Javascript API creates an empty Tool Palette.
- User is prompted with a selection set picker to select any objects they want, however the ONLY entities that are returned is my block called "HCL_Camera".
- Program loops through all of the HCL_Camera blocks checking for and retrieving the hyperlinks from each (hyperlinks are FULL paths, not Relative).
- For EACH hyperlink retrieved, if the hyperlink is an image format (.bmp/.jpg/.png/.tiff), then an "Img" element is created to display each photo and stacked vertically (scrolling necessary) in the tool palette.
Pseudocode would look something like:
PP command called
create empty tool palette
user prompted for selection set
if selection set exists w/ items then filter selection set for "HCL_Camera" blocks only
if selection set of blocks exists then
foreach block in block selection set
if hyperlink ends in (.bmp/.png/.jpg/.tiff) then
create Img element in tool palette displaying the image
I have 2 files currently.. The simple JS file which creates the palette and opens the HTML document:
// Create "PHOTOPREVIEW" palette and load html
Acad.Application.addPalette("Photo Preview", "c:/user/Desktop/PP.html");And the HTML document which I used a default AutoCAD Example as the baseline (this file needs all the work I believe):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="https://df-prod.autocad360.com/jsapi/v4/Autodesk.AutoCAD.js"></script>
<title>Photo Preview</title>
<script>
function photoPreview()
{
let pso = Acad.PromptSelectionOptions();
pso.allowDuplicates(false);
Acad.Editor.getSelection(pso).then(success,error);
}
function success(ss)
{
var container = document.getElementById('imageContainer');
ss.forEach(addImg);
//var img = document.createElement('img');
//var src="data:image/bmp;base64," + ss;
//img.setAttribute('src', src);
//img.setAttribute('id', 'previewImg');
//container.appendChild(img);
}
function addImg(e)
{
//alert("Test");
}
function error()
{
alert("error");
}
// photoPreview();
</script>
</head>
<body>
<div id='imageContainer'></div>
<p>Hello</p>
</body>
<script>
photoPreview();
</script>
</html>
Here's the Lisp command to call the JS file:
(defun c:PP nil (command "._webload" "_l" "c:\\user\\Desktop\\PP.js"))
Can anybody help please. I feel like if you're a Javascript pro, this would be crazy easy to accomplish.
Javascript API Documentation:
AutoCAD 2023 Developer and ObjectARX Help | About AutoCAD JavaScript APIs | Autodesk
Camera blocks to select:
Generic idea of what the final Tool Palette should look like:
Best,
~DD
