<html>
|
<head>
|
<meta http-equiv="X-UA-Compatible" content="IE=9" />
|
<title>Image Comparison Tool</title>
|
<link rel="StyleSheet" href="../Style.css" type="text/css">
|
<style>
|
.TintColorButton {border-color: black;border-width:1px; height:12px;width:15px;margin-right:5px;margin-left:1px;margin-bottom: 4px;}
|
</style>
|
</head>
|
<body style="border: 0px;overflow:hidden; margin:0;" id="Body" class="hideUntillTranslated" onload="Init()" onunload="exitTool();">
|
|
<table id="topPanel" cellpadding ="3px" style="background-color: #151515" cellspacing = "0" border="0" width="100%" class="s8w">
|
<tr valign="top">
|
<!-- <td rowspan=2>
|
<img src="ToolIcon.png" style="margin-left: 5px; margin-right: 10px; ">
|
</td> -->
|
<td style="width:60px;" align="center">
|
<span class="i18n s8w" style="margin-right: 0px;">Text_Layer</span>
|
</td>
|
<td style="width:calc(100%-60px);" align="left">
|
<select id="LayersListID" class="SelectDark" style="width:100%; " onchange="FindAttributes();">
|
</select>
|
</td>
|
<tr>
|
<td style="width:60px;" align="center">
|
<span class="i18n s8w" style="margin-right: 0px;">Text_Attribute</span>
|
</td>
|
<td style="width:calc(100%-60px);" align="left">
|
<select id="AttributesListID" class="SelectDark" style="width:100%; " onchange="ShowAttributeValues(false);">
|
</select>
|
</td>
|
</tr>
|
</table>
|
<!-- This is the header of the Display by Attribute result. Added dynamically when needed -->
|
<div id="visibilityHeader" style="display:none; visibility: hidden;">
|
<div class="s8" style="background-color:#DFDEDF; padding-bottom:3px;padding-top: 3px;margin-bottom: 3px;">
|
<input type="checkbox" checked="checked" value="All" onchange="CheckAll(this);" />
|
<span class="i18n">Text_All</span><br>
|
</div>
|
</div>
|
|
<!-- This is the header of the Colorize by Attribute result. Added dynamically when needed -->
|
<div id="colorizeHeader" class="s8" style="display:none; visibility: hidden;">
|
<div class="s8" style="background-color:#DFDEDF; padding-bottom:3px;padding-top: 3px;margin-bottom: 3px;">
|
<span class="i18n">Text_SetAll</span>
|
<input id="AllColors" class="jscolor s6 TintColorButton" value="ffffff" style="width:40px;text-align: center" />
|
<input type="button" class="MenuButtonSmall i18n" onclick="setAllColors();" value="Text_Set" />
|
<hr style="width:1px; height:20px; display: inline; margin-left: 3px; margin-right: 3px; ">
|
<input type="button" class="MenuButtonSmall i18n" onclick="reshuffleColors();" value="Text_Reshuffle" />
|
<hr style="width:1px; height:20px; display: inline; margin-left: 3px; margin-right: 3px; ">
|
<span class="i18n">Text_Opacity</span>
|
<input id="opacityID" value="50" style="width:25px;" onkeypress="if (event.keyCode == 13) {setOpacity($(this));}" onchange="setOpacity($(this));"/>%
|
</div>
|
</div>
|
|
<div id="AttributesDiv" style="width:100%; height:90%; overflow-y:auto" class="s8"></div>
|
|
<table id="bottomPanel" cellpadding ="3px" style="background-color: #151515" cellspacing = "0" border="0" width="100%" class="s9w">
|
<tr valign="top">
|
<td align="right">
|
<input type="button" id="SaveID" class="MenuButtonSmallWhite MenuButtonLast i18n" onclick="Save(true);" value="Text_Save" />
|
</td>
|
</tr>
|
</table>
|
|
<script src="../jquery/jquery-1.10.2.js" type="text/javascript"></script>
|
<script src="./jscolor.js" type="text/javascript" ></script>
|
<script language="javascript" src="../ToolsCommon71.js"></script>
|
<script language="jscript">
|
|
var SGWorld = new ActiveXObject("TerraExplorerX.SGWorld71");
|
|
var gDebug = false;
|
var gType=0;
|
var gSaved = false;
|
var g3DMLID;
|
var g3DMLObj;
|
var gFeatures;
|
var gQueryBulk = 50000;
|
var gOpacity = 128;
|
var gLayersProperties=[];
|
var gLayersColor=[];
|
var gColors = ["ff0000","00ff00","0000ff","ff00ff","ffff00","00ffff","800000","808000","000080","800080","008080","ccff66","ff66ff","00cc99","0099ff","333399","663300","b35900","999966","b3e6b3","19004d"];
|
|
$(window).resize(function(e) {
|
$("#AttributesDiv").height($( window ).height()-$("#topPanel").height()-$("#bottomPanel").height());
|
});
|
|
//--------------
|
// Init
|
function Init() {
|
try {
|
$("#AttributesDiv").height($( window ).height()-80);
|
gType = GetParamValue("Type", 0);
|
g3DMLID = GetParamValue("ID", "");
|
if (g3DMLID=="")
|
g3DMLID = SGWorld.ProjectTree.GetNextItem (SGWorld.ProjectTree.RootID,10);
|
|
g3DMLObj = SGWorld.Creator.GetObject(g3DMLID);
|
if (g3DMLObj.ObjectType == 39){ // feature layer under 3DML - get the parent 3DML
|
g3DMLID = SGWorld.ProjectTree.GetNextItem (g3DMLID,15);
|
g3DMLObj = SGWorld.Creator.GetObject(g3DMLID);
|
}
|
|
if (g3DMLObj.ObjectType != 38){
|
TEAlert (SGLang.i18n("Text_AlertCaption"), SGLang.i18n("Text_3DMLNotFound"));
|
return;
|
}
|
|
FindLayers();
|
FindAttributes();
|
}
|
catch (e) { TEAlert (SGLang.i18n("Text_AlertCaption"),SGLang.i18n("Text_3DMLNotFound") ); exitTool(); return;}
|
}
|
//--------------
|
// FindLayers
|
function FindLayers() {
|
|
try{
|
for (var i=0; i<g3DMLObj.FeatureLayers.Count; i++){
|
$('#LayersListID').append($('<option>', {
|
value: g3DMLObj.FeatureLayers.Item(i).ID,
|
text : g3DMLObj.FeatureLayers.Item(i).TreeItem.Name
|
}));
|
|
var FeatureLayerID = $('#LayersListID').val();
|
|
}
|
Save(false); // save initial visibility state for all layers
|
}
|
catch (e) {if (gDebug) alert(e.message);}
|
}
|
//--------------
|
// FindAttributes
|
function FindAttributes() {
|
try{
|
$('#AttributesListID').html("");
|
var FeatureLayerID = $('#LayersListID').val();
|
var featureLayer = SGWorld.Creator.GetObject(FeatureLayerID);
|
var firstFeature = featureLayer.ExecuteQuery ("",1,"",SGWorld.Creator.GeometryCreator.CreatePolygonGeometry(null));
|
for (var i=0; i<firstFeature.Item(0).FeatureAttributes.Count; i++) {
|
$('#AttributesListID').append($('<option>', {
|
value: i,
|
text : firstFeature.Item(0).FeatureAttributes.Item(i).Name
|
}));
|
}
|
ShowAttributeValues(true);
|
}
|
catch (e) {$("#AttributesDiv").html("");}
|
}
|
//--------------
|
// ShowAttributeValues
|
function ShowAttributeValues(fromInit) {
|
|
try {
|
var FeatureLayerID = $('#LayersListID').val();
|
var featureLayer = SGWorld.Creator.GetObject(FeatureLayerID);
|
var attributeIndex = $('#AttributesListID').val();
|
var attributeName = $('#AttributesListID').children("option").filter(":selected").text()
|
var serverPrefix = (checkUrl(g3DMLObj.path))?"SQL: ":"";
|
try{
|
gFeatures = featureLayer.ExecuteQuery (serverPrefix+attributeName+" Like '%%' or "+attributeName+" is null GROUP BY lower("+attributeName+")",gQueryBulk,"",SGWorld.Creator.GeometryCreator.CreatePolygonGeometry(null));
|
}
|
catch (e) { if (serverPrefix!="") TEAlert (SGLang.i18n("Text_AlertCaption"), SGLang.i18n("Text_SGSTooOld") ); else TEAlert (SGLang.i18n("Text_AlertCaption"),e.message); exitTool(); return;}
|
|
// Need a try-catch and a message telling that the SGS server is lower then 7.2
|
if (gFeatures.Count>=gQueryBulk) {
|
if (fromInit && !$('#AttributesListID').children("option").filter(":selected").is ($('#AttributesListID').children().last())){
|
$('#AttributesListID option:selected').next().attr('selected', 'selected');
|
ShowAttributeValues(fromInit);
|
return;
|
}
|
htmlText = "<br><label class='s9red' >"+SGLang.i18n("Text_TooManyAttributes")+"</label><br>";
|
$("#AttributesDiv").html(htmlText);
|
if (gType==0)
|
featureLayer.FeatureProperties.SetClassification ("Visibility", "");
|
else
|
featureLayer.FeatureProperties.Tint = SGWorld.Creator.CreateColor(255,255,255,0);
|
return;
|
}
|
|
var htmlText = "";
|
var attributes=[];
|
for (var i=0; i<gFeatures.Count; i++) {
|
if (gFeatures.Item(i).FeatureAttributes.Item(attributeIndex).Value == "")
|
attributes.push (SGLang.i18n("Text_Empty"));
|
else
|
attributes.push (gFeatures.Item(i).FeatureAttributes.Item(attributeIndex).Value);
|
}
|
attributes.sort();
|
|
if (gType==0) { // Visibility
|
htmlText += $("#visibilityHeader").html();
|
|
for (var i=0; i<gFeatures.Count; i++) {
|
var uniqueValue = attributes[i];
|
htmlText += '<input id="' + uniqueValue + '" type="checkbox" checked="checked" name="' + uniqueValue + '" value="' + uniqueValue + '" onchange="ChangeSelection();">';
|
htmlText += '<label for="' + uniqueValue + '">'+uniqueValue+'</label><br>';
|
}
|
$("#AttributesDiv").html(htmlText);
|
ChangeSelection();
|
}
|
else {
|
htmlText += $("#colorizeHeader").html();
|
|
for (var i=0; i<gFeatures.Count; i++) {
|
var uniqueValue = attributes[i];
|
htmlText += '<input id="' + uniqueValue + '" class="jscolor TintColorButton s6" onchange="ChangeTintColor();" value="'+getRandomColor(i)+'" style="width:40px;text-align: center;" />';
|
htmlText += '<label for="' + uniqueValue + '">'+uniqueValue+'</label><br>';
|
}
|
|
$("#AttributesDiv").html(htmlText);
|
setTimeout ("ChangeTintColor();",10);
|
jscolor.installByClassName("jscolor");
|
}
|
}
|
catch (e) {if (gDebug) alert(e.message);}
|
}
|
//--------------
|
// getRandomColor
|
function getRandomColor(index) {
|
var color;
|
if (index<20)
|
color = gColors[index];
|
else
|
color = componentToHex(Math.round(Math.random()*255)) + componentToHex(Math.round(Math.random()*255)) + componentToHex(Math.round(Math.random()*255));
|
|
return color;
|
}
|
//--------------
|
// componentToHex
|
function componentToHex(c) {
|
var hex = c.toString(16);
|
return hex.length == 1 ? "0" + hex : hex;
|
}
|
|
//--------------
|
// CheckAll
|
function CheckAll(t) {
|
var checkValue = $(t).is(":checked");// $(this).val();
|
$('#AttributesDiv').find(':checkbox').each(function() {
|
this.checked = checkValue;
|
});
|
ChangeSelection();
|
|
}
|
//--------------
|
// checkUrl
|
function checkUrl(s) {
|
var regexp = /^(?:http(s)?:\/\/)?[\w.-]+(?:\.[\w\.-]+)+[\w\-\._~:/?#[\]@!\$&'\(\)\*\+,;=.]+$/
|
return regexp.test(s);
|
}
|
//--------------
|
// ChangeSelection
|
function ChangeSelection() {
|
try{
|
var attName = $('#AttributesListID').children("option").filter(":selected").text();
|
var query="";
|
var first=true;
|
var checkAll=true;
|
$('#AttributesDiv').find(':checkbox').each(function(index) {
|
if (index!=0) { // ignore first checkbox (All)
|
if ($(this).prop("checked")){
|
if (!first)
|
query += " OR ";
|
var attValue = $(this).attr('name');
|
var find = "'";
|
var re = new RegExp(find, 'g');
|
attValue = attValue.replace(re, "''");
|
if (attValue==SGLang.i18n("Text_Empty"))
|
attValue="";
|
query += "\""+attName+"\" = '"+attValue+"'";
|
first=false;
|
}
|
else
|
checkAll=false;
|
}
|
});
|
if (checkAll)
|
query = "";
|
else if (query=="")
|
query = "\""+attName+"\" = '-9999'"; // in case of all checkboxes are off this fake query should hide all elements
|
var FeatureLayerID = $('#LayersListID').val();
|
var featureLayer = SGWorld.Creator.GetObject(FeatureLayerID);
|
featureLayer.FeatureProperties.SetClassification ("Visibility", query);
|
}
|
catch (e) {if (gDebug) alert(e.message);}
|
}
|
//--------------
|
// setAllColors
|
function setAllColors(){
|
var allColors;
|
$('#AttributesDiv').find('.jscolor').each(function(index) {
|
if (index==0)
|
allColors = $(this)[0].jscolor.toHEXString();
|
else
|
$(this)[0].jscolor.fromString(allColors);
|
});
|
setTimeout ("ChangeTintColor();",10);
|
}
|
//--------------
|
// reshuffleColors
|
function reshuffleColors(){
|
$('#AttributesDiv').find('.jscolor').each(function(index) {
|
if (index>0)
|
$(this)[0].jscolor.fromString(getRandomColor(index+100));
|
});
|
setTimeout ("ChangeTintColor();",10);
|
}
|
//--------------
|
// setOpacity
|
function setOpacity(t) {
|
var n = parseFloat(t.val());
|
if ( isNaN(n) || n < 0 || n > 100){
|
t.val("50");
|
}
|
gOpacity=t.val()*2.56;
|
ChangeTintColor();
|
}
|
//--------------
|
// ChangeTintColor
|
function ChangeTintColor() {
|
try{
|
var attName = $('#AttributesListID').children("option").filter(":selected").text();
|
var query="<Classification FuncType='0'>";
|
var first=true;
|
$('#AttributesDiv').find('.jscolor').each(function(index) {
|
var attValue = $(this).attr('id');
|
var find = "'";
|
var re = new RegExp(find, 'g');
|
attValue = attValue.replace(re, "''");
|
var HexColor = rgb2hex($(this).css("backgroundColor"));
|
var BGRcolor = HexColor.substr(4,2)+HexColor.substr(2,2)+HexColor.substr(0,2);
|
var color = parseInt(BGRcolor, 16);
|
attValue= htmlSpecialChars(attValue);
|
if (attValue==SGLang.i18n("Text_Empty"))
|
attValue="";
|
if (index==0) // default color
|
query+= '<DefaultValue>'+color+'</DefaultValue>';
|
else
|
query += '<Class><Condition><"['+attName+']"="'+attValue+'"></Condition><Value>'+color+'</Value></Class>';
|
});
|
query +="</Classification>";
|
var FeatureLayerID = $('#LayersListID').val();
|
var featureLayer = SGWorld.Creator.GetObject(FeatureLayerID);
|
featureLayer.FeatureProperties.Tint = SGWorld.Creator.CreateColor(255,255,255,gOpacity);
|
featureLayer.FeatureProperties.SetClassification ("Tint Color", query);
|
}
|
catch (e) {if (gDebug) alert(e.message);}
|
}
|
//--------------
|
// htmlSpecialChars
|
function htmlSpecialChars(unsafe) {
|
return unsafe
|
.replace(/&/g, "&")
|
.replace(/</g, "<")
|
.replace(/>/g, ">");
|
//.replace(/"/g, """);
|
}
|
//--------------
|
// rgb2hex
|
function rgb2hex(rgb) {
|
rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
function hex(x) {
|
return ("0" + parseInt(x).toString(16)).slice(-2);
|
}
|
return hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
|
}
|
|
//--------------
|
// Save
|
function Save(fromButton) {
|
|
try{
|
for (var i=0; i<g3DMLObj.FeatureLayers.Count; i++){
|
if (gType==0)
|
gLayersProperties[i] = g3DMLObj.FeatureLayers.Item(i).FeatureProperties.GetClassification("Visibility");
|
else{
|
gLayersProperties[i] = g3DMLObj.FeatureLayers.Item(i).FeatureProperties.GetClassification("Tint Color");
|
if (gLayersProperties[i]=="")
|
gLayersColor[i] = g3DMLObj.FeatureLayers.Item(i).FeatureProperties.Tint.ToABGRColor();
|
}
|
}
|
if (fromButton){
|
TEAlert (SGLang.i18n("Text_AlertCaption"),SGLang.i18n("Text_SaveMessage"),true);
|
gSaved = true;
|
}
|
}
|
catch (e) { if (gDebug) alert(e.message);}
|
}
|
//--------------
|
// exitTool
|
function exitTool() {
|
try {
|
for (var i=0; i<g3DMLObj.FeatureLayers.Count; i++){
|
if (gType==0) // Display by Attribute
|
g3DMLObj.FeatureLayers.Item(i).FeatureProperties.SetClassification("Visibility",gLayersProperties[i]);
|
else // Colorize
|
{
|
if (gLayersProperties[i]!=""){
|
g3DMLObj.FeatureLayers.Item(i).FeatureProperties.Tint = SGWorld.Creator.CreateColor(255,255,255,gOpacity);
|
g3DMLObj.FeatureLayers.Item(i).FeatureProperties.SetClassification("Tint Color",gLayersProperties[i]);
|
}
|
else
|
g3DMLObj.FeatureLayers.Item(i).FeatureProperties.Tint.FromABGRColor(gLayersColor[i]);
|
}
|
}
|
//SGWorld.Window.RemovePopupByCaption(SGLang.i18n("ToolName"));
|
|
}
|
catch (e) { if (gDebug) alert(SGLang.i18n("Text_ErrorWhileExit") +e.message); }
|
}
|
|
</script>
|
|
</body>
|
</html>
|
|
|
|
|
<!--Sig:00000040tBCwtQRZuIXgN24Lj4YU5Nf2MZ#8T7hT69FZiWKHZmovcNw7BskI03tkmCVWphsMcqiEZKR#.X4OjlCpiy8mXbJJ-->
|
