Set style for connector and endpoints on hover - jsplumb

I'm trying to create a css style for all connections and endpoints which are connected to a specific element. I have managed to color all source/targets but I'm not managing to color the connections (lines)
Here is my current code...
var endpoints = jsPlumb.getEndpoints(this);
for (var i = 0; i < endpoints.length; i++) {
if (endpoints[i].connections[0] != null) {
$(endpoints[i].connections[0].target).addClass('red_color');
$(endpoints[i].connections[0].source).addClass('red_color');
}
}

The connection class also has an addClass method. So you could call
endpoints[i].connections[0].addClass('red_color')
and then, as discussed at https://docs.jsplumbtoolkit.com/community/lib/styling-via-css#css-for-svg-elements, you can target the connector path like this:
svg.red_color path {
stroke:red;
stroke-width:3;
}

Related

Photoshop CC2019 auto-update all linked smart objects including nested ones

I have Photoshop CC2019 PSD document containing several smart objects that contains other smart objects that contains other smart objects. Some of these have linked layers. Normally, such images are not updated automatically (which is extremely annoying, Adobe!) but you have to manually update each of them once the linked image content has changed.
There is a .jsx script file named "Update All Modified Content.jsx" which auto-updates linked layers (PNG image in my case) but only if the smart object is in the top most document - that is no nested smart objects with linked layers are updated automatically.
My question is: does anyone know how to update the content of the above mentioned .jsx file so that it would auto-update all linked images across all the smart objects in PSD document including nested ones?
For those who care or would be willing to help updating the code here it is:
// Update all modified content
var idplacedLayerUpdateAllModified = stringIDToTypeID( "placedLayerUpdateAllModified" );
executeAction( idplacedLayerUpdateAllModified, undefined, DialogModes.NO );
So, after spending half a day with it I finally solved it myself. Here is the code:
#target photoshop
// SET INITIAL ACTIVE DOCUMENT
var mainDocument = app.activeDocument;
// SAVE THE DOCUMENT NAME FOR FUTURE USE
var mainDocName = mainDocument.name;
// RUN THE MAIN UPDATE FUNCTION
mainDocument.suspendHistory("processAllSmartObjects", "autoupdateAllSmartObjects(mainDocument, 0)");
// FINALLY SAVE THE MAIN DOCUMENT
mainDocument.save();
function autoupdateAllSmartObjects(theParent, prevVal) {
// FUNCTION TO TEST IF SMARTOBJECT IS LINKED
function isLinkedSO(obj) {
var localFilePath = "";
var ref = new ActionReference();
ref.putIdentifier(charIDToTypeID('Lyr '), obj.id);
var desc = executeActionGet(ref);
var smObj = desc.getObjectValue(stringIDToTypeID('smartObject'));
var isLinked = false;
// TEST IF IT HAS LINKED FILE
try {
var localFilePath = smObj.getPath(stringIDToTypeID('link'));
isLinked = true;
} catch(e) {
//
}
return isLinked;
}
// FUNCTION TO UPDATE LINKED SMART OBJECT
function doTheUpdate(LYR, stackNr) {
// SET ACTIVE LAYER TO ACTUALY ITERATED ONE
app.activeDocument.activeLayer = LYR;
// RUN IN "SILENT" MODE
app.displayDialogs = DialogModes.NO;
var layer = app.activeDocument.activeLayer;
// IF ACTIVE LAYER IS SMARTOBJECT
if (layer.kind == "LayerKind.SMARTOBJECT") {
//alert(layer);
// OPEN THE SMARTOBJECT
app.runMenuItem(stringIDToTypeID('placedLayerEditContents'));
// DO THE ACTUAL FILE UPDATE
var idplacedLayerUpdateAllModified = stringIDToTypeID( "placedLayerUpdateAllModified" );
executeAction( idplacedLayerUpdateAllModified, undefined, DialogModes.NO);
// IF IT IS NOT THE "CORE/MAIN" DOCUMENT
if(stackNr > 0) {
// SAVE CHANGES (UPDATE) AND CLOSE IT
app.activeDocument.close(SaveOptions.SAVECHANGES);
}
// CONTINUE INSIDE THIS ACTIVE SMARTOBJECT
autoupdateAllSmartObjects(app.activeDocument, stackNr);
}
return;
}
// FUNCTION TO PARSE GROUPS
function parseGroup(LYR) {
var groupLayers = LYR.layers;
// IF GROUP IS NOT EMPTY
if(groupLayers.length > 0) {
// PARSE ALL LAYERS IN THE GROUP
for (var i = groupLayers.length - 1; i >= 0; i--) {
var lyr = groupLayers[i];
// IF NOT LOCKED = NOT EDITABL:E
if(!lyr.allLocked) {
// YET ANOTHER GROUP?
if (lyr.typename == "LayerSet") {
// IF IT IS NOT EMPTY
if (lyr.layers.length > 0) {
// RE-RUN THE SCRIPT ANEW WITH THE SELECTED GROUP AS LAYERS SOURCE
autoupdateAllSmartObjects(lyr, 0);
}
// LAYERS
} else if (lyr.typename == "ArtLayer") {
// IF THE LAYER IS SMARTOBJECT
if (lyr.kind == LayerKind.SMARTOBJECT) {
// IF THE LAYER IS SET TO "visible" (THAT IS: NOT DISABLED)
if(lyr.visible){
// TEST IF THE SMARTOBJECT IS ACTUALLY LINKED
if(!isLinkedSO(lyr)) {
// RUN THE UPDATE SUB-FUNCTION
doTheUpdate(lyr, i);
}
}
}
}
}
}
}
}
// PARSE ALL THE LAYERS
for (var i = theParent.layers.length - 1 - prevVal; i >= 0; i--) {
var theLayer = theParent.layers[i];
// ONLY ArtLayers
if (theLayer.typename == "ArtLayer") {
// IF THE LAYER IS SMARTOBJECT
if (theLayer.kind == LayerKind.SMARTOBJECT) {
// IF THE LAYER IS SET TO "visible" (THAT IS: NOT DISABLED)
if(theLayer.visible){
// TEST IF THE SMARTOBJECT IS ACTUALLY LINKED
if(!isLinkedSO(theLayer)){
// RUN THE UPDATE SUB-FUNCTION
doTheUpdate(theLayer, i);
// IF WE ARE AT THE LAST LAYER IN THE STACK AND IT IS NOT OUR MAIN DOCUMENT
if(i == 0 && app.activeDocument.name !== mainDocName) {
// SAVE CHANGES (UPDATE) AND CLOSE IT
app.activeDocument.close(SaveOptions.SAVECHANGES);
}
}
}
}
// ONLY Groups
} else if (theLayer.typename == "LayerSet") {
// RUN SUB-FUNCTION FOR GROUP PARSING
parseGroup(theLayer);
// ANYTHING ELSE
} else {
autoupdateAllSmartObjects(theLayer, m);
}
}
return;
};
OP's script works!! It was going in loops for me too but after some trial and error, I realised that my smart objects (SO) that are linked across artboards ( - e.g. if you change one SO, it changes on various artboards) - were the issue. I hid all such SO and it works.
so basically, it only works for Smart Objects + copies made via 'New smart object via copy' NOT 'duplicate layer' / copypaste smart objects. If your work contains a 'duplicate layer' SO - it will break the script. You need to hide these objects ( or not work like that all together) before running the script

Remove repetitive fragments from fragment manager in Xamarin Android

I am working on android using Xamarin and MVVMCross framework. I want to update the remove the fragment from fragment manager to handle the back button, Because i have to navigate between screen which make a cross reference in Back Stack. So i want to remove the repetitive entries from stack. Its removing the repetitive entries from stack but it does not update the BackStackEntryCount with latest fragments.
I have written code
public override void OnFragmentChanged(IMvxCachedFragmentInfo fragmentInfo)
{
if (fragmentInfo != null)
{
var ifExists =
SupportFragmentManager.Fragments?.FirstOrDefault(x => x.Tag.ToLower() == fragmentInfo.Tag.ToLower());
if (ifExists != null)
{
var indexOf = SupportFragmentManager.Fragments.IndexOf(ifExists);
var total = SupportFragmentManager.BackStackEntryCount;
for (int i = indexOf + 1; i < total; i++)
{
SupportFragmentManager.Fragments.RemoveAt(i);
}
}
}
base.OnFragmentChanged(fragmentInfo);
}
SupportFragmentManager.Fragments is a read only property (It only has a get). Modifying the content of the list of fragment has no impact on the underline fragment backstack count.
What you can instead try is to pop the stack down to the existing fragment. This should remove all fragments above it.
var exisitngFragment = SupportFragmentManager.FindFragmentByTag(fragmentInfo.Tag);
SupportFragmentManager.PopBackStackImmediate(exisitngFragment.Id, 0);

Tree View not getting displayed

I was trying to create a treeview browser for my application but got stuck somewhere.
The treeview isn't getting displayed.
Code:
System::IO::DirectoryInfo^ info = gcnew System::IO::DirectoryInfo(path);
System::IO::Directory^ dir;
if (dir->Exists(path))
{
try
{
array<System::IO::DirectoryInfo^>^ dirs = info->GetDirectories();
if (dirs->Length > 0)
{
for (int i = 0; i < dirs->Length; i++)
{
TreeNode^ node = treeView1->Nodes[0]->Nodes->Add(dirs[i]->Name);
node->ImageIndex = 1;
for (int j = 0; j < dirs[i]->GetFiles()->Length; j++)
{
if (dirs[i]->GetFiles()[j]->Exists)
{
TreeNode^ nodes = treeView1->Nodes[0]->Nodes[node->Index]->Nodes->Add(dirs[i]->GetFiles()[j]->Name);
nodes->ImageIndex = 2;
}
}
}
}
}
catch (Exception^ e)
{
MessageBox::Show(e->Message);
}
}
Did you use splitcontainer and fill in the first section with your data first?
How did you initialize the new treeview class?
Example:
[ComVisibleAttribute(true)]
[ClassInterfaceAttribute(ClassInterfaceType::AutoDispatch)]
[DockingAttribute(DockingBehavior::Ask)]
public ref class TreeView : public Control
Then you can implement treeview and imageview.
For example, ShGetFolderLocation is one way to pull file locations, for windows OS.
Remember you have to populate the view and tell the system to display it for you to see it.
Or just go to: this earlier solution for the same issue
Follow up with the code for nodemouse click or whatever input response you are looking for such as expand or close, go to link and so on.

Flex 4.6 Optimizing View appearance ContentCache VS override data for Mobile App

I read in this article http://www.adobe.com/devnet/flex/articles/flex-mobile-performance-checklist.html that I should not initialize a View's appearance in a creationComplete handler. Instead, I should change view's appearance in an overridden data setter.
The section in the article is:
Override the data setter instead of using bindings or initializing a View's appearance in a creationComplete handler
1-First, I would like to know if I got this right by doing the following:
//My code is loading a set of images and adding them in a View.
//On creationComplete of the View I am adding the images in case this is the first time
//the view is shown. In case the view has been already accessed I use the data:
protected function view1_creationCompleteHandler(event:FlexEvent):void
{
if(!data) //On first creation of the view I create the data object
{
data = new Object();
data.imageArray = new Array(); //set an array that will cache my images.
for(var i:int = 0; i<36;i++)
{
var img:Image = new Image();
img.source = 'assets/0'+i.toString()+'.png';
container.addElement(img);
(data.imageArray as Array).push(img);//Override the data for next time!
}
}
else//Next time use the save images
{
for(var ix:int = 0; ix<(data.imageArray as Array).length;ix++)
{
container.addElement((data.imageArray as Array)[ix]);
}
}
}
If I am doing this correctly, I would like to know which approach is best. The above one, or the next one I am going to show which uses the images contentLoader with caching and queuing enabled with a ContentCache:
protected function view1_creationCompleteHandler(event:FlexEvent):void
{
{
for(var i:int = 0; i<36;i++)
{
var img:Image = new Image();
img.contentLoader = ldr;
img.contentLoaderGrouping = 'gr1';
img.source = 'assets/0'+i.toString()+'.png';
container.addElement(img);
}
}
<fx:Declarations>
<s:ContentCache id="ldr" enableQueueing="true"
maxActiveRequests="1" maxCacheEntries="36"/>
</fx:Declarations>
Also if someone could tell me what is the contentLoaderGrouping for. I would be very grateful.
Thanks a lot!!!
PS:By the way both approaches work. The first approach is instant while the second approach shows the images beeing added in a very smooth way which actually gives a cool effect.
Neither. The point of the suggestion was to NOT alter the displaylist after creationComplete, which requires an additional update cycle. Instead you should inject the data property when you push your view on the stack, and initiate your changes in the setter. Using the ContentCache has nothing to do with it (and can sometimes cause additional overhead if not used correctly).
override public function set data(value:Object):void
{
super.data = value;
//this was poorly optimized, so I made it
//a little better...
var imageArray:Array = (value == null || value.imageArray == null)?
null : value.imageArray as Array;
if(imageArray == null) //On first creation of the view I create the data object
{
imageArray = new Array(36); //set an array that will cache my images.
for(var i:int = 0; i<36;i++)
{
var img:Image = new Image();
img.source = 'assets/0'+i.toString()+'.png';
container.addElement(img);
imageArray[i] = img;
}
super.data = {imageArray:imageArray}
}
else//Next time use the save images
{
var n:int = imageArray.length;
for (var j:int = 0; j < n; j++)
{
container.addElement(IVisualElement(imageArray[j]));
}
}
}
EDIT
I was mistaken about when the data property is set during the view life-cycle.
Here is how it works:
So you are correct that container would be null at that point. I was going to write up an example for you, but I'm having trouble figuring out what your end goal is here. Is there a specific reason you are storing the images on the data property? I think what you might actually want to do is this:
private var _data:Object = {cache: new ContentCache()};
protected function show_clickHandler(event:MouseEvent):void
{
this.navigator.pushView(views.MyView, _data);
}
And in the view...
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" title="MyView">
<fx:Script>
<![CDATA[
import spark.components.Image;
import spark.core.ContentCache;
override protected function createChildren():void
{
super.createChildren();
//you might want to do a sanity first check to make sure the
//data was passed in correctly...
var cache:ContentCache = ContentCache(this.data.cache);
for(var i:int = 0; i < 36; i++)
{
var img:Image = new Image();
img.contentLoader = cache;
img.source = 'assets/0' + i.toString() + '.png';
container.addElement(img);
}
}
]]>
</fx:Script>
<s:VGroup id="container" />
</s:View>

Changing color of jqplot series based on label

I have a chart, and there is one series that in some cases I want to render in black. I generate the chart, and then I'm doing this:
for (i = 0; i < chart.series.length; ++i) {
if (chart.series[i].label == 'Failures') {
chart.series[i].color = '#000000';
}
}
But it is not changing the color. I verified in the debugger that the if is true and the assignment is getting executed and the color field of that series is #000000. What is the proper way to do something like this?
I ended up doing this before I create the chart:
for (i = 0; i < series.length; ++i) {
if (series[i][0][series[i][0].length-1].type == 'Failures') {
seriesColors[i] = '#000000';
}
}

Resources