Hey LCCS team -
I'm trying to figure out how to remove some the functionality from the LCCS SharedWB. There's a few things like the arrow tool, pencil, highlight rectangle, etc.. that I don't need in my application. Any tips on how to go about this?
Views
Replies
Total Likes
Hi,
Currently removing default shapes is a bit complicated and not documented, and we might add an API in the future release of our SDK.
But the good news is you can remove them,.
Here is code. I modified the WBTriangle.mxml file in WhiteBoardCustomShapes that you can find in SampleApps of the SDKNavigator.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="1024" minHeight="768" xmlns:rtc="http://ns.adobe.com/rtc" xmlns:authentication="com.adobe.rtc.authentication.*" xmlns:session="com.adobe.rtc.session.*" xmlns:pods="com.adobe.rtc.pods.*">
<mx:Script>
<![CDATA[
import com.adobe.coreUI.controls.EditorToolBar;
import com.adobe.coreUI.controls.whiteboardClasses.ToolBarDescriptors.WBShapeToolBarDescriptor;
import com.adobe.coreUI.controls.whiteboardClasses.ToolBarDescriptors.WBToolBarDescriptor;
import com.adobe.coreUI.controls.whiteboardClasses.WBShapesToolBar;
import com.adobe.coreUI.controls.whiteboardClasses.shapeDescriptors.WBMarkerShapeDescriptor;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBCustomShapeFactory;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBHighlightAreaShapeFactory;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBMarkerShape;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBMarkerShapeFactory;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBPropertiesToolBar;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBSimpleShape;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBSimpleShapeFactory;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBTextShape;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBTextShapeFactory;
import com.adobe.coreUI.controls.whiteboardClasses.shapes.WBTextToolBar;
import com.adobe.coreUI.events.WBCanvasEvent;
import com.adobe.rtc.events.CollectionNodeEvent;
import com.adobe.rtc.events.SessionEvent;
/**********************************************************
* ADOBE SYSTEMS INCORPORATED
* Copyright [2007-2010] Adobe Systems Incorporated
* All Rights Reserved.
* NOTICE: Adobe permits you to use, modify, and distribute this file in accordance with the
* terms of the Adobe license agreement accompanying it.If you have received this file from a
* source other than Adobe, then your use, modification, or distribution of it requires the prior
* written permission of Adobe.
* *********************************/
[Embed (source = '../assets/WBCustomMarker.png')]
public static var ICON_CUSTOM_MARKER:Class;
[Embed (source = '../assets/WBFileImage.png')]
public static var ICON_IMAGE:Class;
[Embed (source = '../assets/WBTriangle.png')]
public static var ICON_TRIANGLE:Class;
// NOTE : RUN AS OWNER FIRST TO SET ALL THE COLLECTIONNODES NEEDED
protected function roomConnector_synchronizationChangeHandler(event:SessionEvent):void
{
if (roomConnector.isSynchronized) {
//Modify the toolBar after the white board is synchronized
// sharedWB.shapesToolBar = toolBar;
sharedWB.addEventListener(CollectionNodeEvent.SYNCHRONIZATION_CHANGE, onToolBarAdd);
}
}
// Modify the toolbar. Demonstrating the WBCustomShapeFactory.
// So to add a custom shape we need the following
// 1.) The shape class that defines what should be drawn when the mouse is dragged
// 2.) Custom Cursor
// 3.) Icon on the toolBar for the shape
// 4.) The Property ToolBar for the shape
// So the toughest part is defining the shape and its property toolbar
protected function onToolBarAdd(p_evt:Event):void
{
if (sharedWB.isSynchronized) {
var toolBar:WBShapesToolBar = new WBShapesToolBar();
var data:WBToolBarDescriptor = new WBToolBarDescriptor(false);
//toolBar.validateNow();
// sharedWB.shapesToolBar = toolBar;
// toolBar.validateNow();
//Label Shape
var toolShape:WBShapeToolBarDescriptor = new WBShapeToolBarDescriptor(WBShapeToolBarDescriptor.LABEL);
toolShape.label = "CShape";
//var toolBar:WBShapesToolBar = sharedWB.shapesToolBar as WBShapesToolBar;
//toolBar.addCustomShapeToToolBar(toolShape);
data.addShapeToolBar(toolShape);
//Custom Marker or Wave Pen. Refer to WBCustomMarkerShape to check what the shape does
var wavePenToolShape:WBShapeToolBarDescriptor = new WBShapeToolBarDescriptor(WBShapeToolBarDescriptor.TOOL);
wavePenToolShape.toolTip ="Custom Highlighter Pen Tool";
var markerShape:WBMarkerShapeFactory = new WBMarkerShapeFactory();
wavePenToolShape.shapeFactory = new WBCustomShapeFactory(WBCustomMarkerShape, WBMarkerShapeFactory.CURSOR_HIGHLIGHTER_PEN, new WBCustomMarkerToolBar());
wavePenToolShape.icon = ICON_CUSTOM_MARKER;
data.addShapeToolBar(wavePenToolShape);
//Triangle Shape
var triangleShape:WBShapeToolBarDescriptor = new WBShapeToolBarDescriptor(WBShapeToolBarDescriptor.TOOL);
triangleShape.toolTip ="Triangle";
triangleShape.shapeFactory = new WBCustomShapeFactory(WBTriangleShape, WBMarkerShapeFactory.CURSOR_PEN, new WBPropertiesToolBar());
triangleShape.icon = ICON_TRIANGLE;
data.addShapeToolBar(triangleShape);
//A bit buggy or incomplete.. Adding Images to the WhiteBoard
//Modify WBFileImageShape or WBFileImageShapeToolBar for your custom Needs
var imageShape:WBShapeToolBarDescriptor = new WBShapeToolBarDescriptor(WBShapeToolBarDescriptor.TOOL);
imageShape.toolTip ="Image";
imageShape.shapeFactory = new WBCustomShapeFactory(WBFileImageShape, WBSimpleShapeFactory.CURSOR_RECTANGLE, new WBFileImageShapeToolBar());
imageShape.icon = ICON_IMAGE;
data.addShapeToolBar(imageShape);
toolBar.dataProvider = data;
sharedWB.removeChild(sharedWB.shapesToolBar);
sharedWB.shapesToolBar = toolBar;
}
}
]]>
</mx:Script>
<authentication:AdobeHSAuthenticator id="guestAuthenticator" userName="aponnusa@adobe.com" password="C0conut123"/>
<session:ConnectSessionContainer id="roomConnector" borderStyle="none" synchronizationChange="roomConnector_synchronizationChangeHandler(event)" authenticator="{guestAuthenticator}" roomURL="http://connectnow.acrobat.com/aponnusa/deleteafcs" width="100%" height="100%">
<pods:SharedWhiteBoard id="sharedWB" width="100%" height="100%" />
</session:ConnectSessionContainer>
</mx:Application>
So to summarize the code
Add the following lines in your code
var toolBar:WBShapesToolBar = new WBShapesToolBar();
var data:WBToolBarDescriptor = new WBToolBarDescriptor(false); // False indicates that you dont need default items
//Define your shapes and add it to data using the api WBToolBarDescriptor.addShapeToolBar
//And then
toolBar.dataProvider = data;
sharedWB.removeChild(sharedWB.shapesToolBar);
sharedWB.shapesToolBar = toolBar;
Thanks, hope this code help you.
Views
Replies
Total Likes
Views
Likes
Replies