studio2.js

SugarCRM5.1 开源PHP客户关系管理系统

/**
 * SugarCRM is a customer relationship management program developed by
 * SugarCRM, Inc. Copyright (C) 2004 - 2007 SugarCRM Inc.
 * 
 * This program is free software; you can redistribute it and/or modify it under
 * the terms of the GNU General Public License version 3 as published by the
 * Free Software Foundation with the addition of the following permission added
 * to Section 15 as permitted in Section 7(a): FOR ANY PART OF THE COVERED WORK
 * IN WHICH THE COPYRIGHT IS OWNED BY SUGARCRM, SUGARCRM DISCLAIMS THE WARRANTY
 * OF NON INFRINGEMENT OF THIRD PARTY RIGHTS.
 * 
 * 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 General Public License for more
 * details.
 * 
 * You should have received a copy of the GNU General Public License along with
 * this program; if not, see http://www.gnu.org/licenses or write to the Free
 * Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA
 * 02110-1301 USA.
 * 
 * You can contact SugarCRM, Inc. headquarters at 10050 North Wolfe Road,
 * SW2-130, Cupertino, CA 95014, USA. or at email address [e-mail].
 * 
 * The interactive user interfaces in modified source and object code versions
 * of this program must display Appropriate Legal Notices, as required under
 * Section 5 of the GNU General Public License version 3.
 * 
 * In accordance with Section 7(b) of the GNU General Public License version 3,
 * these Appropriate Legal Notices must retain the display of the "Powered by
 * SugarCRM" logo. If the display of the logo is not reasonably feasible for
 * technical reasons, the Appropriate Legal Notices must display the words
 * "Powered by SugarCRM".
 */

if(typeof('console') == 'undefined'){
console = {
	log: function(message) {

	}
}
}
var Dom = Ext.DomHelper;
var DDM = Ext.dd.DragDropMgr;

Studio2 = {

	init: function() {

		Studio2.maxColumns = parseInt(document.getElementById('maxColumns').value);
		Studio2.setStartId(parseInt(document.getElementById('idCount').value));
		Studio2.setStartId(1000);
		Studio2.fieldwidth = parseInt(document.getElementById('fieldwidth').value);
		Studio2.panelNumber = parseInt(document.getElementById('nextPanelId').value);
		Studio2.isIE = Ext.isIE;
		Studio2.expandableFields = [];

		//	Activate the layout panels
		var panels = document.getElementById('panels');
		Ext.DomHelper.applyStyles(panels, "visibility:hidden");
//		new Studio2.PanelDD(panels.id,'studio2.panels'); // add the main layout area into PANELS to allow for panel drags to empty areas
		new Ext.dd.DDTarget(panels.id,'studio2.panels');
		for (var i=0;i<panels.childNodes.length;i++) {
			var panel = panels.childNodes[i];
			if (panel.nodeName == 'DIV') { // a valid panel

				// add the panel into the ROWS drag-and-drop group to allow for drags to empty areas of the panels
				new Ext.dd.DDTarget(panel.id,'studio2.rows');

				for (var j=0;j<panel.childNodes.length;j++) {
					var row = panel.childNodes[j];

					if (row.nodeName == 'DIV' && row.className == 'le_row' ) { // a valid row

						// Convert all (empty) fields into variable width fields
						var leftSibling = null;
						var foundEmpty = 0;

						for (var k=0;k<row.childNodes.length;k++) {
							var field = row.childNodes[k];
							if (field.nodeName == 'DIV') { // field

								for (var l=0;l<field.childNodes.length;l++) {
									var property = field.childNodes[l];

									if (property.className && (property.className.indexOf('field_name') != -1)) {
										if (property.firstChild.nodeValue.indexOf('(empty)') != -1) {
											//register field to be expandable

											var leftSibling = Studio2.prevField(field);
											if(null!== leftSibling){
												Studio2.registerExpandableField(leftSibling);
												Studio2.toggleFieldWidth(leftSibling); //expand in the beginning.
											}
											break;
										}
										if (property.firstChild.nodeValue.indexOf('(filler)') != -1) {
											Studio2.setSpecial(field);
										}
									}
								}
							}
						}

						Studio2.activateElement(row);
					}
				}
			}
		}
		Studio2.activateElement(panels);

		Ext.DomHelper.applyStyles(panels, {visibility:''});

		// Activate the fields in the availablefields list
		var availablefields = document.getElementById('availablefields');
		Studio2.activateElement(availablefields);

		// Setup Delete area in the toolbox (the Trash icon)
		var d = document.getElementById('delete');
		Studio2.setSpecial(d);
		new Ext.dd.DDTarget('delete','studio2.panels');
		new Ext.dd.DDTarget('delete','studio2.rows');
		new Ext.dd.DDTarget('delete','studio2.fields');

		var fillerProxy = Studio2.newField();
		Studio2.setSpecial(fillerProxy);
		var hanger = document.getElementById('fillerproxy');
		hanger.parentNode.insertBefore(fillerProxy,hanger.nextSibling);
		Studio2.activateElement(fillerProxy);

		rowProxy = Studio2.newRow(true);
		Studio2.setSpecial(rowProxy);
		var hanger = document.getElementById('rowproxy');
		hanger.parentNode.insertBefore(rowProxy,hanger.nextSibling);
		Studio2.activateElement(rowProxy);

		var hanger = document.getElementById('panelproxy');
		if (hanger != null) // if no panelproxy then don't display a new panel option: needed for portal layouts which have only one panel
		{
			panelProxy = Studio2.newPanel();
			Studio2.setSpecial(panelProxy);
			hanger.parentNode.insertBefore(panelProxy,hanger.nextSibling);
			Studio2.activateElement(panelProxy);
		}

		ModuleBuilder.helpRegisterByID('layoutEditor','div');
		ModuleBuilder.helpRegisterByID('layoutEditorButtons','input');
		ModuleBuilder.helpSetup('layoutEditor','default');

	},

	expandableFields:[],
	inArray:function(array, element){
		for(var i=0; i<array.length; i++){
			if (array[i]==element)
				return true;
		}
		return false;
	},
	/**
	* SIGNATURE
	* 	array = Studio2.expandableFields
	* 	element = id of the element to unregister.
	* RETURN
	* 	element is removed from Studio2.expandableFields if found.
	*/

	unregisterExpandableField:function(array, element){
		for(var i = 0; i<Studio2.expandableFields.length; i++){
			if(array[i] == element){
				array.splice(i,1);
				var field = document.getElementById(element);
				field.removeChild(field.childNodes[1]);
				return;
			}
		}
	},
	toggleFieldWidth:function(id){
		var field = Ext.getDom(id);
		var img = field.childNodes[1];
		////console.log("trying to toggle");
		if(img && img.src){
			var src = img.src.split("/");
			src = src[src.length-1];
			if(src == 'plus_inline.gif'){ //expand width
				var nextField = Studio2.nextField(field);
				if(null != nextField)
					field.parentNode.removeChild(nextField); //remove filler.
				Studio2.setColumnWidth(id,2);
				img.src = 'themes/Sugar/images/minus_inline.gif';
			}
			else if(src == 'minus_inline.gif'){ //reduce width
				Studio2.setColumnWidth(id,1);
				var newField = Studio2.newField();
				Studio2.setSpecial(newField);
				Studio2.activateElement(newField);
				field.parentNode.appendChild(newField);
				img.src='themes/Sugar/images/plus_inline.gif'
			}
		}
	},

	getImageElement:function(default_toggle){
		var img = document.createElement('img');
		if(!default_toggle)
			img.src = 'themes/Sugar/images/minus_inline.gif';
		else
			img.src = 'themes/Sugar/images/plus_inline.gif';
		img.className = 'le_edit';
		img.style.paddingRight = 2;
		img.style.cssFloat = 'left';

		return img;
	},

	registerExpandableField:function(field){ //field = HTML field element
	//console.log("registering for "+ field);
		if(!Studio2.inArray(Studio2.expandableFields,field.id)){
			Studio2.expandableFields.push(field.id);
			if(Studio2.nextField(field) == null && Studio2.prevField(field)==null)
				var img = Studio2.getImageElement(false);
			else
				var img = Studio2.getImageElement(true);
			img.onclick = function(){ //bind expandable behaviour
							Studio2.toggleFieldWidth(field.id);
						}
			////console.log("registering for "+ field.id);
			field.insertBefore(img , field.childNodes[1]); //insert the image tag
		}
	},
	setStartId: function(id) {
		Studio2.idStack = [id];
	},

	nextId: function() {
		if (Studio2.idStack.length == 1) { // if down to our last id, allocate another
			Studio2.idStack[0]++;
			Studio2.idStack.push(Studio2.idStack[0]);
		}
		return Studio2.idStack.pop();
	},

	setNextId: function(id) {
		Studio2.idStack.push(id);
	},

	isSpecial: function(element) {
		return Studio2.hasClass(element,'special');
	},

	setSpecial: function(element) {
		Studio2.addClass(element,'special');
	},

	unsetSpecial: function(element) {
		Studio2.removeClass(element,'special');
	},

	hasClass: function(element,c) {
		return (element.className && element.className.indexOf(c) != -1);
	},

	addClass: function(element,c) {
		if (! Studio2.hasClass(element,c)) {
			element.className = element.className + " " + c;
		}
		return element;
	},

	removeClass: function(element,c) {
		var className = element.className;
		var startSubstring = '';
		var endSubstring = '';
		var pos = element.className.indexOf(' '+c);
		if (pos != -1) {
			c = ' '+c;
		}
		pos = element.className.indexOf(c);
		if (pos != -1) {
			if (pos>0) {
				startSubstring = className.substring(0,pos);
			}
			if (pos+c.length<className.length) {
				endSubstring = className.substring(pos+c.length);
			}
			element.className = startSubstring + endSubstring;
		}
		return element;
	},

	count: function(element) {
		var count = 0;
		for (var j=0;j<element.childNodes.length;j++) {
			var child = element.childNodes[j];
			if (child.nodeName == 'DIV') { // a valid child
				count++;
			}
		}
		return count;
	},

	newField: function(){ // TODO: use properties to set field contents
		//This object must exists on the page
		var newField = document.createElement('div');
		newField.className ='le_field';
		newField.id = Studio2.nextId();
		newField.innerHTML = '<span>'+SUGAR.language.get('ModuleBuilder', 'LBL_FILLER')+'</span>' + // the displayed label
							 '<span class=\'field_name\'>(filler)</span>'; // the hidden field that identifies this as something to be saved by prepareForSave()
		return newField;
	},

	newRow: function(titleRequired) {
		var newRow = document.createElement('div');
		if (titleRequired) {
			var title = document.createElement('h3');
			title.appendChild(document.createTextNode(SUGAR.language.get('ModuleBuilder', 'LBL_NEW_ROW')));
			title.className = 'displayname';
			newRow.appendChild(title);
		}
		newRow.className='le_row';
		newRow.id = Studio2.nextId();
		for(var i=0;i<Studio2.maxColumns;i++) {
			var newField = Studio2.newField();
			Studio2.setSpecial(newField);
			newRow.appendChild(newField);
		}
		return newRow;
	},

	newPanel: function() {
		var newPanel = document.createElement('div');
		newPanel.className='le_panel';
		newPanel.id = Studio2.nextId();
		// get the panelid for this panel - must be unique in the layout, even across saves
		// our dynamically assigned DOM ids won't work as any panel given one of these DOM ids could find itself in conflict with a panel created in a later session
		var panelIdentifier = 'lbl_panel'+(Studio2.panelNumber ++) ;

		var div = document.createElement('div');
		div.id = 'le_panellabel_' + newPanel.id;
        var child = document.createElement('span');
        child.id = 'le_panelname_' + newPanel.id;
        child.className = 'panel_name';
        child.appendChild(document.createTextNode(SUGAR.language.get('ModuleBuilder', 'LBL_NEW_PANEL')));
        div.appendChild(child);
        var child = document.createElement('span');
        child.id = 'le_panelid_' + newPanel.id;
        child.className = 'panel_id';
        child.appendChild(document.createTextNode(panelIdentifier));
		div.appendChild(child);
		newPanel.appendChild(div);

		var img = document.createElement('img');
		img.src='themes/Sugar/images/edit_inline.gif';
		img.className = 'le_edit';
		img.style.cursor="pointer;";
		var editModule = document.getElementById('prepareForSave').view_module.value;
		var editString = 'module=ModuleBuilder&action=editProperty&view_module='+editModule+'&view='+view+'&id_label=le_panelname_'+newPanel.id+'&name_label=label_'+panelIdentifier.toUpperCase()+'&title_label='+SUGAR.language.get('ModuleBuilder', 'LBL_LABEL_TITLE') ;
		if (document.getElementById('prepareForSave').view_package)
		      editString += '&view_package='+document.getElementById('prepareForSave').view_package.value ;
		var view = document.prepareForSave.view.value;
		img.onclick = function() { var value_label = document.getElementById('le_panelname_'+newPanel.id).innerHTML;ModuleBuilder.getContent( editString + '&value_label=' + value_label ); }
		newPanel.appendChild(img);
		return newPanel;
	},

	establishLocation: function(element) {
		var location = null;
		while(element.parentNode != 'body') {
			location = element.id;
			if ((location == 'panels') || (location == 'toolbox') || (location == 'delete')){
				break;
			}
			element = element.parentNode;
		}
		if (location == null) {
			alert("Studio2:establishLocation: badly formed document");
			die();
		}
		return location;
	},

	reclaimIds: function(element) {
		// return the ids in this element to the available pool
		// do not reclaim field IDs as they never really disappear - they just move between toolbox and panel
		if (element.className.indexOf('le_field') == -1) {
			Studio2.setNextId(element.id);
			for (var i=0;i<element.childNodes.length;i++) {
				var child = element.childNodes[i];
				if (child.nodeName == 'DIV') { // a subelement
					Studio2.reclaimIds(child);
				}
			}
		}
	},

	reclaimFields: function(element) {
		if (element.className.indexOf('le_field') != -1) {
			if (! Studio2.isSpecial(element)) {
				var destination = document.getElementById('availablefields');