dlupu / improve_visibility_of_project_management_informations

// ==UserScript==
// @name     improve_visibility_of_project_management_informations
// @description make stuff more visible (like status and availabilité)
// @version  2.9
// @require https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js
// @include /^https://.*-des\.f.v..d\.com//
// @license MIT
// ==/UserScript==
// ==OpenUserJS==
// @author dlupu
// @collaborator clambert
// @collaborator ford.lambert 
// ==/OpenUserJS==

// -----> This code is still in an ugly shape until I found every DOM specifications and everything work

(function(jQuery) {
    'use strict';
    jQuery.noConflict(); // do not use $ because it's also used by Prototype

	(function(){
		//General DOM elements
		var page = document.getElementById('page_content');
		var title = page.getElementsByClassName('title')[0];
		var appPath = window.location.pathname.split('/');
    	var currentMvcType = appPath[1];
		var versionMenuButton = document.getElementById('project_management_button');
		var sharedMenuButton = document.getElementById('sharing_button');
		var versionMenuButtonForTest = document.getElementById('project_management_cont_button');
        var sharedMenuButtonForTest = document.getElementById('sharing_cont_button');

        if (versionMenuButtonForTest && sharedMenuButtonForTest) {
            versionMenuButton = versionMenuButtonForTest;
            sharedMenuButton = sharedMenuButtonForTest;
        }
		
		setTimeout(function() {
			if (versionMenuButton && sharedMenuButton) {
				var versionMenuWrapper = versionMenuButton.parentNode;
				var sharedMenuWrapper = sharedMenuButton.parentNode;
				var modelPaths = ['model_logics', 'named_scopes', 'model_constants'];
				
				// Get status & specRef DOM elements
				if (modelPaths.includes(currentMvcType)) {
			        var originalSelect = versionMenuWrapper.childNodes[3].childNodes[1].childNodes[1];
			        var specRef = versionMenuWrapper.childNodes[3].childNodes[7];
			        var sharedList = sharedMenuWrapper.childNodes[3].childNodes[1].childNodes[1];
			        
			    } else if (currentMvcType == 'views') {
			        var originalSelect = versionMenuWrapper.childNodes[3].childNodes[1].childNodes[1];
			        var specRef = versionMenuWrapper.childNodes[3].childNodes[5];
			        var sharedList = sharedMenuWrapper.childNodes[3].childNodes[1].childNodes[1];
				        
				} else if (currentMvcType == 'actions') {
			        var originalSelect = versionMenuWrapper.childNodes[3].childNodes[1].childNodes[1];
			        var specRef = versionMenuWrapper.childNodes[3].childNodes[7];
			        var sharedList = sharedMenuWrapper.childNodes[3].childNodes[3].childNodes[1];
			        
				} else if (currentMvcType == 'model_tests') {
                    var originalSelect = versionMenuWrapper.childNodes[3].childNodes[1].childNodes[3].childNodes[1].childNodes[0];
			        var specRef = versionMenuWrapper.childNodes[3].childNodes[5];
			        var sharedList = sharedMenuWrapper.childNodes[3].childNodes[1].childNodes[1];
                }
				
				/* ----- Current code status and specRef visible ------ */
				if (versionMenuButton && originalSelect && specRef && sharedList) {
					//var versionMenuWrapper = versionMenuButton.parentNode;
					
					function cloneNodeInfos(originalNode, nodeReceivingData) {
						nodeReceivingData.value = originalNode.value;
						nodeReceivingData.className = originalNode.className;
					}
					
					function addEvents(eventType, eventNode, targetNode) {
						eventNode.addEventListener(eventType, () => {
							cloneNodeInfos(eventNode, targetNode)
						});
					}
					
					// Clone the select status node and add styles
					var newStatusSelect = originalSelect.cloneNode(true);
					cloneNodeInfos(originalSelect, newStatusSelect);
					newStatusSelect.id = 'newSelect';
					newStatusSelect.style.marginRight = '10px';
					newStatusSelect.style.borderRadius = '5px';
					
					// Clone the specRef input node and add styles
					var newspecRef = specRef.cloneNode(true);
					cloneNodeInfos(specRef, newspecRef);
					newspecRef.childNodes[1].placeholder = 'Spec reference';
					newspecRef.childNodes[1].style.textAlign = 'center';
					newspecRef.removeChild(newspecRef.firstChild);
					newspecRef.style.textAlign = 'center';
					newspecRef.style.marginLeft = '10px';
					newspecRef.style.borderRadius = '5px';
					newspecRef.style.display = 'inline-block';
	
					// Add new nodes in DOM
					title.prepend(newStatusSelect);
					title.appendChild(newspecRef);
					
					// Always ensure clone node value is equal to its origin
					addEvents('click', newStatusSelect, originalSelect);
					addEvents('click', originalSelect, newStatusSelect);
					addEvents('input', specRef.childNodes[1], newspecRef.childNodes[0]);
					addEvents('input', newspecRef.childNodes[0], specRef.childNodes[1]);
				}
			
				/* ----- Current code availability visible ----- */
				if (sharedMenuButton && originalSelect && specRef && sharedList) {
	    			//var sharedMenuWrapper = sharedMenuButton.parentNode;
	    			var sharedValue = sharedList.options[sharedList.selectedIndex].text;
	
	    			// Create a regeneration warning wording
	    			var sharedWording = document.createElement('p');
	    			
	    			if (sharedValue != 'All' && sharedValue != 'Tous') {
	    				sharedWording.innerHTML = '';
	    				title.appendChild(sharedWording);
	    			} else {
	    				sharedWording.innerHTML = 'This code need manual regeneration to be applied';
	    				var warningSign = document.createElement('i');
	    				warningSign.className = 'muted glyphicon glyphicon-exclamation-sign';
	    				warningSign.style.color = 'orange';
	    				warningSign.style.marginRight = '5px';
	    				title.appendChild(sharedWording);
	    				sharedWording.prepend(warningSign);
	    			}
	    
	    			// Create a visible availability
	    			var availability = 'Available for ' + sharedValue;
	    			var availabilityWording = document.createElement('span');
	    			availabilityWording.style.border = '1px solid black';
	    			availabilityWording.style.backgroundColor = 'grey';
	    			availabilityWording.style.color = 'white';
	    			availabilityWording.style.padding = '3px';
	    			availabilityWording.style.borderRadius = '5px';
	    			availabilityWording.style.marginLeft = '10px';
	    			availabilityWording.innerHTML = availability;
	    			
	    			sharedWording.appendChild(availabilityWording);
		    	}
			}
			
			/* ----- Always show lightened lightbulbs ----- */
			var pictures = document.getElementsByTagName('img');
			var wantedSrc = '/images/page_icons/lightbulb.png?1199643502';
			
			for (var i = 0; i < pictures.length; i++) {
				if (pictures[i].getAttribute('src') == wantedSrc) {
					pictures[i].parentNode.parentNode.style.opacity = '1';
				}
			}
		}, 1000);
	})();
})(jQuery);