Mega Code Archive

 
Categories / JavaScript DHTML / Smartclient
 

Drag snap to

<!-- Isomorphic SmartClient Copyright(c) 1998 and beyond Isomorphic Software, Inc. "SmartClient" is a trademark of Isomorphic Software, Inc. All rights reserved. Open Source License SmartClient source code, located under the source/ directory, and the resulting assembled modules  in isomorphic/system/modules/, as well as JavaScript and CSS files under the isomorphic/skins directory are  licensed under the terms of the GNU Lesser General Public License, version 3.  The text of the LGPLv3 license is available online at http://www.gnu.org/licenses/lgpl-3.0.html If your project precludes the use of this license, or if you'd like to support SmartClient LGPL,  we encourage you to buy a commercial license. Icon Experience Collection Selected 16x16 icons within the isomorphic/skins directory are part of the Icon Experience collection  (http://www.iconexperience.com) and may be freely used with any SmartClient components without charge,  but may not be used as part of screen designs separate from SmartClient components without a purchase  of a license from Icon Experience. We are working to replace these icons as soon as possible. All other media found under the isomorphic/skins directory may be used under the LGPLv3. Commercial Licenses A number of commercial licenses are available for purchase. Please see http://smartclient.com/license. Warranty Disclaimer This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even  the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Lesser General  Public License for more details. Copyright 2001 and beyond Isomorphic Software, Inc. Last revised July 20, 2008.  --> <!-- The following code is revised from SmartClient demo code(SmartClient_70rc2_LGPL.zip).--> <HTML><HEAD>   <SCRIPT>var isomorphicDir="isomorphic/";</SCRIPT>     <SCRIPT SRC=isomorphic/system/modules/ISC_Core.js></SCRIPT>     <SCRIPT SRC=isomorphic/system/modules/ISC_Foundation.js></SCRIPT>     <SCRIPT SRC=isomorphic/system/modules/ISC_Containers.js></SCRIPT>     <SCRIPT SRC=isomorphic/system/modules/ISC_Grids.js></SCRIPT>     <SCRIPT SRC=isomorphic/system/modules/ISC_Forms.js></SCRIPT>     <SCRIPT SRC=isomorphic/system/modules/ISC_DataBinding.js></SCRIPT>   <SCRIPT SRC=isomorphic/skins/standard/load_skin.js></SCRIPT> </HEAD><BODY BGCOLOR='silver'> <SCRIPT> isc.Canvas.create({     ID: "gridCanvas",     autoDraw: false,     backgroundImage: "[SKIN]grid.gif",     border: "1px solid blue",     width: 400,     height: 300,     childrenSnapToGrid: true,     childrenSnapResizeToGrid: true,     overflow: "hidden",     children: [         isc.Label.create({             width: 80, height: 40, align: "center",             contents: "Drag or Resize me",             backgroundColor: "white",             showEdges: true,             canDragReposition: true,             canDragResize: true,             dragAppearance: "target",             keepInParentRect: true         })     ] }); isc.DynamicForm.create({     ID: "gridForm",     width: 400,     values: {snapDrag: true, snapResize: true, hgap: 20, vgap: 20},     numCols: 4,     fields: [{         name: "snapDrag", title: "Enable Snap-To-Grid Move", type: "checkbox",          changed: "gridCanvas.setProperty('childrenSnapToGrid', !gridCanvas.childrenSnapToGrid)"         }, {         name: "snapResize", title: "Enable Snap To Grid Resize", type: "checkbox",          changed: "gridCanvas.setProperty('childrenSnapResizeToGrid', !gridCanvas.childrenSnapResizeToGrid)"         }, {         name: "hgap", title: "Horizontal snap-to gap", type: "radioGroup",         valueMap: {10: "10 pixels", 20: "20 pixels", 50: "50 pixels"},         changed: "gridCanvas.setProperty('snapHGap', Number(this.getValue()))"         }, {         name: "vgap", title: "Vertical snap-to gap", type: "radioGroup",         valueMap: {10: "10 pixels", 20: "20 pixels", 50: "50 pixels"},         changed: "gridCanvas.setProperty('snapVGap', Number(this.getValue()))"         }     ] }); isc.VLayout.create({     membersMargin: 10,     members: [         gridCanvas, gridForm     ] }) </SCRIPT> </BODY> </HTML>