simplelist.js

来自「SugarCRM5.1 开源PHP客户关系管理系统」· JavaScript 代码 · 共 339 行

/*********************************************************************************
 * 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(SimpleList) == 'undefined'){
	SimpleList = function(){
		var editImage;
		var deleteImage;
		var ul_list;
		var jstransaction;
		var lastEdit;
		var isIE = isSupportedIE();
		return {
			//jstransaction.register('addDropDownValue', SimpleList.undoAddDropDown, SimpleList.redoAddDropDown);
		init: function(editImage, deleteImage) {
			var ul = document.getElementById('ul1', 'drpdwn');

			SimpleList.lastEdit = null; // Bug 14662
			SimpleList.editImage = editImage;
			SimpleList.deleteImage = deleteImage;
			new Ext.dd.DDTarget("ul1");
			//new YAHOO.util.DDTarget("ul1");
            
			for (i=0;i<SimpleList.ul_list.length;i++){
				//new YAHOO.example.DDList(SimpleList.ul_list[i]);
				new Studio2.ListDD(SimpleList.ul_list[i], 'drpdwn', false);
            }
            Ext.EventManager.on("dropdownaddbtn", "click", this.addToList);
			SimpleList.jstransaction = new JSTransaction();
			SimpleList.jstransaction.register('deleteDropDown', SimpleList.undoDeleteDropDown, SimpleList.undoDeleteDropDown);
			SimpleList.jstransaction.register('changeDropDownValue', SimpleList.undoDropDownChange, SimpleList.redoDropDownChange);

    },
    saveDropDown: function() {
        var parseList = function(ul, title) {
            var items = ul.getElementsByTagName("li");
            var out = "";

            for (i=0;i<items.length;i=i+1) {
                out += "name="+items[i].id + "&value="+items[i].innerHTML;
            }
            return out;
        };

        var ul1=Dom.get("ul1");
        alert(parseList(ul1, "List 1"));

    },
    addToList : function(){
    	var drop_name = document.getElementById('drop_name');
    	var drop_value = document.getElementById('drop_value');

	    	var ul1=Dom.get("ul1");

	    	var items = ul1.getElementsByTagName("li");
	    	for (i=0;i<items.length;i=i+1) {
                if(items[i].id == drop_name.value){
                	alert("Key already exists in list");
                	return;
                }
            }

	    	liObj = document.createElement('li');
	    	liObj.className = "draggable";
	    	if(drop_name.value == ''){
	    		liObj.id = '__empty__';
	    	}else{
	    		liObj.id = drop_name.value;
	    	}
	    	liObj.value = 0;

	    	var text1 = document.createElement('input');
			text1.type = 'hidden';
			text1.id = 'value_' + liObj.id;
			text1.name = 'value_' + liObj.id;
			text1.value = drop_value.value;

	    	var html = "<table width='100%'><tr><td><b>"+drop_name.value+"</b><input id='value_"+liObj.id+"' value='"+drop_value.value+"' type = 'hidden'><span class='fieldValue' id='span_"+liObj.id+"'>";
	    	if(drop_value.value == ""){
	    		html += "[-blank-]";
	    	}else{
	    		html += "["+drop_value.value+"]";
	    	}
	    	html += "</span>";
	    	html += "<span class='fieldValue' id='span_edit_"+liObj.id+"' style='display:none'>";
	    	html += "<input type='text' id='input_"+liObj.id+"' value='"+drop_value.value+"' onchange='SimpleList.setDropDownValue(\""+liObj.id+"\", this.value, true)' >";
	    	html += "</span>";
	    	html += "</td><td align='right'><a href='javascript:void(0)' onclick='SimpleList.editDropDownValue(\""+liObj.id+"\", true)'>"+SimpleList.editImage+"</a>";
	    	html += "&nbsp;<a href='javascript:void(0)' onclick='SimpleList.deleteDropDownValue(\""+liObj.id+"\", true)'>"+SimpleList.deleteImage+"</a>";
	    	html += "</td></tr></table>";

	    	liObj.innerHTML = html;
	    	ul1.appendChild(liObj);
	    	//new YAHOO.example.DDList(liObj);
			new Studio2.ListDD(liObj, 'drpdwn', false);
	    	drop_value.value = "";
	    	drop_name.value = "";
	    	drop_name.focus();

    },
    handleSave:function(){
    	 var parseList = function(ul, title) {
            var items = ul.getElementsByTagName("li");
            var out = "{";

            var len = items.length;
            for (i=0;i<items.length;i=i+1) {
                var name = items[i].id;
                var textbox = document.getElementById('input_'+items[i].id);
                var value = textbox.value;
				out += '"'+encodeURIComponent(name)+'":"'+encodeURIComponent(value)+'"';
                if(i < len - 1)
                	out += ",";
            }
            out += "}";
            return out;
        };
        var ul1=Dom.get("ul1");
        for(j = 0; j < SimpleList.jstransaction.JSTransactions.length; j++){
        	//console.log(jstransaction.JSTransactions[j]);
        	if(SimpleList.jstransaction.JSTransactions[j]['transaction'] == 'deleteDropDown'){
	        	var liEl = document.getElementById(SimpleList.jstransaction.JSTransactions[j]['data']['id']);
	        	if(liEl && liEl.value == 1)
	        		ul1.removeChild(liEl);
        	}
        }
    	var list = document.getElementById('list_value');

        var out = parseList(ul1, "List 1");
    	list.value = out;
		ModuleBuilder.refreshDD_name = document.getElementById('dropdown_name').value;
		//jstransaction.record('addDropDownValue', {'new':li, 'old':document.getElementById('value_'+ rowCount).value});
		if (document.forms.popup_form)
		{
    		ModuleBuilder.handleSave("dropdown_form", ModuleBuilder.refreshDropDown);
    	}
    	else
    	{
    		ModuleBuilder.handleSave("dropdown_form", ModuleBuilder.refreshGlobalDropDown);
    	}
    },
    deleteDropDownValue : function(id, record){
    	var field = document.getElementById(id);

    	if(record != null){
			SimpleList.jstransaction.record('deleteDropDown',{'id': id });
		}
		if(field.value == '0'){
			field.value = '1';
			field.style.textDecoration = 'line-through';
		}else{
			 field.value = '0';
			 field.style.textDecoration = 'none';
		}

    	//var ul1=Dom.get("ul1");
    	//ul1.removeChild(li);
    },
    editDropDownValue : function(id, record){
    	if (SimpleList.lastEdit != null)
    	{
    		// Bug 14662 - we have a previous edit that we haven't saved...
    		var valueLastEdit = document.getElementById('input_'+SimpleList.lastEdit).value;
    		SimpleList.setDropDownValue(SimpleList.lastEdit,valueLastEdit,true);
    	}
    	var dispSpan = document.getElementById('span_'+id);
    	var editSpan = document.getElementById('span_edit_'+id);
    	dispSpan.style.display = 'none';

    	if(SimpleList.isIE){
    		editSpan.style.display = 'inline-block';
    	}else{
    		editSpan.style.display = 'inline';
    	}
    	var textbox = document.getElementById('input_'+id);
    	textbox.focus();
    	SimpleList.lastEdit = id;
    },
    setDropDownValue : function(id, val, record){

		if(record){
			SimpleList.jstransaction.record('changeDropDownValue', {'id':id, 'new':val, 'old':document.getElementById('value_'+ id).value});
		}
		var dispSpan = document.getElementById('span_'+id);
    	var editSpan = document.getElementById('span_edit_'+id);
    	var textbox = document.getElementById('input_'+id);

    	dispSpan.style.display = 'inline';
    	editSpan.style.display = 'none';
    	dispSpan.innerHTML = "["+val+"]";
    	document.getElementById('value_'+ id).value = val;
    	SimpleList.lastEdit = null; // Bug 14662 - clear the last edit point behind us
	},
    undoDeleteDropDown : function(transaction){

		SimpleList.deleteDropDownValue(transaction['id'], false);
	},
	undoDropDownChange : function(transaction){
		SimpleList.setDropDownValue(transaction['id'], transaction['old'], false);
	},
	redoDropDownChange : function(transaction){
		SimpleList.setDropDownValue(transaction['id'], transaction['new'], false);
	},
    undo : function(){
    	SimpleList.jstransaction.undo();
    },
    redo : function(){
    	SimpleList.jstransaction.redo();
    }
}//return
}();
}
var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
var DDM = YAHOO.util.DragDropMgr;
	YAHOO.example.DDList = function(id, sGroup, config) {

    YAHOO.example.DDList.superclass.constructor.call(this, id, sGroup, config);

    this.logger = this.logger || YAHOO;
    var el = this.getDragEl();
    Dom.setStyle(el, "opacity", 0.67); // The proxy is slightly transparent

    this.goingUp = false;
    this.lastY = 0;
};
YAHOO.extend(YAHOO.example.DDList, YAHOO.util.DDProxy, {

    startDrag: function(x, y) {

        this.logger.log(this.id + " startDrag");


        // make the proxy look like the source element
        var dragEl = this.getDragEl();
        var clickEl = this.getEl();
        Dom.setStyle(clickEl, "visibility", "hidden");

        dragEl.innerHTML = clickEl.innerHTML;

        Dom.setStyle(dragEl, "color", Dom.getStyle(clickEl, "color"));
        Dom.setStyle(dragEl, "backgroundColor", Dom.getStyle(clickEl, "backgroundColor"));
        Dom.setStyle(dragEl, "border", "2px solid gray");
    },

    endDrag: function(e) {
		ModuleBuilder.state.isDirty=true;
        var srcEl = this.getEl();
        var proxy = this.getDragEl();

        // Show the proxy element and animate it to the src element's location
        Dom.setStyle(proxy, "visibility", "");
        var a = new YAHOO.util.Motion(
            proxy, {
                points: {
                    to: Dom.getXY(srcEl)
                }
            },
            0.2,
            YAHOO.util.Easing.easeOut
        )
        var proxyid = proxy.id;
        var thisid = this.id;

        // Hide the proxy and show the source element when finished with the animation
        a.onComplete.subscribe(function() {
                Dom.setStyle(proxyid, "visibility", "hidden");
                Dom.setStyle(thisid, "visibility", "");
            });
        a.animate();
    },


    onDrag: function(e) {

        // Keep track of the direction of the drag for use during onDragOver
        var y = Event.getPageY(e);

        if (y < this.lastY) {
            this.goingUp = true;
        } else if (y > this.lastY) {
            this.goingUp = false;
        }

        this.lastY = y;
    },

    onDragOver: function(e, id) {

        var srcEl = this.getEl();
        var destEl = Dom.get(id);

        // We are only concerned with list items, we ignore the dragover
        // notifications for the list.
        if (destEl.nodeName.toLowerCase() == "li") {
            var orig_p = srcEl.parentNode;
            var p = destEl.parentNode;

            if (this.goingUp) {
                p.insertBefore(srcEl, destEl); // insert above
            } else {
                p.insertBefore(srcEl, destEl.nextSibling); // insert below
            }

            DDM.refreshCache();
        }
    }
});