00001 var iconTable_wrapper;
00002 var iconDropdown_wrapper;
00003 var save_wrapper;
00004 var currentSelectedValue_;
00005 var megaLibrary_;
00006 var changesMade_ = false;
00007 var saveClicked_ = false;
00008
00009 function init(){
00010 megaLibrary_ = new Array();
00011 makeServerRequest("");
00012 }
00013
00014 function finishInit(){
00015
00016 iconTable_wrapper = document.getElementById("iconTable");
00017 iconDropdown_wrapper = document.getElementById("iconDropdown");
00018 save_wrapper = document.getElementById("save");
00019 currentSelectedValue_ = "";
00020 chooseIcon();
00021
00022 }
00023
00024 function chooseIcon(){
00025 iconDropdown_wrapper.innerHTML = "";
00026 var icon_list = document.createElement("select");
00027 iconDropdown_wrapper.appendChild(icon_list);
00028
00029 checkForChanges();
00030
00031
00032 var iconOption = document.createElement("option");
00033 icon_list.appendChild(iconOption);
00034 iconOption.value="select";
00035 iconOption.innerHTML="Select";
00036
00037 iconOption = document.createElement("option");
00038 icon_list.appendChild(iconOption);
00039 iconOption.value="new";
00040 iconOption.innerHTML="Create New Icon";
00041 icon_list.setAttribute("onchange","iconSelected(this.value)");
00042
00043 for(a = 0; a < megaLibrary_.length; a++)
00044 {
00045 iconOption = document.createElement("option");
00046 icon_list.appendChild(iconOption);
00047 iconOption.value = a;
00048 iconOption.innerHTML = megaLibrary_[a][0];
00049 }
00050
00051
00052 }
00053
00054 function checkForChanges(){
00055
00056 save_wrapper.innerHTML = "";
00057 var submitButton = document.createElement("button");
00058 submitButton.setAttribute("onClick", "submitChangesToServer()");
00059 submitButton.innerHTML = "Submit Changes to Server";
00060
00061 if(!saveClicked_){
00062 submitButton.disabled = "true";
00063 }
00064
00065 save_wrapper.appendChild(submitButton);
00066
00067 }
00068
00069 function iconSelected(selectedValue){
00070
00071
00072 checkForChanges();
00073
00074
00075
00076
00077 if (selectedValue=="select"){
00078 var icon_list_options = document.getElementById("iconDropdown").childNodes[0].childNodes;
00079 for (var opt = 0; opt < icon_list_options.length; opt++){
00080 if (icon_list_options[opt].value == currentSelectedValue_){
00081 icon_list_options[opt].selected = true;
00082 break;
00083 }
00084 }
00085 return;
00086 }
00087
00088 if (selectedValue == currentSelectedValue_){
00089 return;
00090 }
00091
00092
00093
00094
00095 iconTable_wrapper.innerHTML = "";
00096
00097
00098 console.log("selectedIcon " + selectedValue);
00099
00100 var altLabel = document.createElement("td");
00101 var titleLabel = document.createElement("td");
00102 var uniqueLabel = document.createElement("td");
00103 var permissionNeededLabel = document.createElement("td");
00104 var imageLabel = document.createElement("td");
00105 var linkLabel = document.createElement("td");
00106
00107 altLabel.innerHTML = "Title";
00108 titleLabel.innerHTML = "Alt";
00109 uniqueLabel.innerHTML = "Unique";
00110 permissionNeededLabel.innerHTML = "Permission Needed";
00111 imageLabel.innerHTML = "Image";
00112 linkLabel.innerHTML = "Link";
00113
00114 var alt = document.createElement("td");
00115 var title = document.createElement("td");
00116 var unique = document.createElement("td");
00117 var permissionNeeded = document.createElement("td");
00118 var image = document.createElement("td");
00119 var link = document.createElement("td");
00120
00121
00122 var alt_tr = document.createElement("tr");
00123 var title_tr = document.createElement("tr");
00124 var unique_tr = document.createElement("tr");
00125 var permissionNeeded_tr = document.createElement("tr");
00126 var image_tr = document.createElement("tr");
00127 var link_tr = document.createElement("tr");
00128
00129
00130 var altField = document.createElement("input");
00131 var titleField = document.createElement("input");
00132 var uniqueField = document.createElement("input");
00133 var permissionNeededField = document.createElement("input");
00134 var imageField = document.createElement("input");
00135 var linkField = document.createElement("input");
00136
00137 if(selectedValue != "new")
00138 {
00139
00140 altField.value = megaLibrary_[selectedValue][0];
00141 titleField.value = megaLibrary_[selectedValue][1];
00142 uniqueField.value = megaLibrary_[selectedValue][2];
00143 permissionNeededField.value = megaLibrary_[selectedValue][3];
00144 imageField.value = megaLibrary_[selectedValue][4];
00145 linkField.value = megaLibrary_[selectedValue][5];
00146
00147
00148 }
00149
00150 altField.setAttribute("oninput", "activateSave()");
00151 titleField.setAttribute("oninput", "activateSave()");
00152 uniqueField.setAttribute("oninput", "activateSave()");
00153 permissionNeededField.setAttribute("oninput", "activateSave()");
00154 imageField.setAttribute("oninput", "activateSave()");
00155 linkField.setAttribute("oninput", "activateSave()");
00156
00157 alt.appendChild(altField);
00158 title.appendChild(titleField);
00159 unique.appendChild(uniqueField);
00160 permissionNeeded.appendChild(permissionNeededField);
00161 image.appendChild(imageField);
00162 link.appendChild(linkField);
00163
00164 alt_tr.appendChild(altLabel);
00165 title_tr.appendChild(titleLabel);
00166 unique_tr.appendChild(uniqueLabel);
00167 permissionNeeded_tr.appendChild(permissionNeededLabel);
00168 image_tr.appendChild(imageLabel);
00169 link_tr.appendChild(linkLabel);
00170
00171 alt_tr.appendChild(alt);
00172 title_tr.appendChild(title);
00173 unique_tr.appendChild(unique);
00174 permissionNeeded_tr.appendChild(permissionNeeded);
00175 image_tr.appendChild(image);
00176 link_tr.appendChild(link);
00177
00178 iconTable.appendChild(alt_tr);
00179 iconTable.appendChild(title_tr);
00180 iconTable.appendChild(unique_tr);
00181 iconTable.appendChild(permissionNeeded_tr);
00182 iconTable.appendChild(image_tr);
00183 iconTable.appendChild(link_tr);
00184
00185 var index;
00186
00187
00188
00189
00190
00191
00192
00193
00194
00195
00196
00197
00198
00199
00200
00201
00202
00203 var deleteButton = document.createElement("button");
00204 deleteButton.setAttribute("onClick", "deleteIcon(" + selectedValue + ")");
00205 deleteButton.innerHTML = "Delete";
00206 var submitRow = document.createElement("tr");
00207
00208 var button_td = document.createElement("td");
00209 button_td.appendChild(deleteButton);
00210
00211 if(selectedValue == "new"){
00212 var addButton = document.createElement("button");
00213 addButton.setAttribute("onClick", "addIcon()");
00214 addButton.innerHTML = "Add";
00215 addButton.setAttribute("id", "save");
00216 button_td.appendChild(addButton);
00217 }else{
00218 var saveButton = document.createElement("button");
00219 saveButton.setAttribute("onClick", "saveIcon()");
00220 saveButton.innerHTML = "Save";
00221 button_td.appendChild(saveButton);
00222 }
00223
00224
00225 submitRow.appendChild(document.createElement("td"));
00226 submitRow.appendChild(button_td);
00227
00228
00229 iconTable.appendChild(submitRow);
00230 currentSelectedValue_ = selectedValue;
00231
00232 }
00233
00234 function deleteIcon(index){
00235
00236 saveClicked_ = true;
00237
00238 console.log(index);
00239 console.log(megaLibrary_);
00240
00241 megaLibrary_.splice(index, 1);
00242 console.log(megaLibrary_);
00243 currentSelectedValue_ = "";
00244
00245 chooseIcon();
00246 iconTable_wrapper.innerHTML = "";
00247
00248 }
00249
00250 function addIcon(){
00251
00252 changesMade_ = true;
00253
00254
00255
00256 var currentIcon =[document.getElementsByTagName("input")[0].value,
00257 document.getElementsByTagName("input")[1].value,
00258 document.getElementsByTagName("input")[2].value,
00259 document.getElementsByTagName("input")[3].value,
00260 document.getElementsByTagName("input")[4].value,
00261 document.getElementsByTagName("input")[5].value];
00262
00263 megaLibrary_.push(currentIcon);
00264
00265
00266 chooseIcon();
00267
00268
00269
00270 iconSelected(megaLibrary_.length-1);
00271
00272
00273
00274 }
00275
00276 function saveIcon(){
00277
00278
00279 if(!changesMade_)
00280 {
00281 alert("No changes have been made!");
00282 return;
00283 }
00284
00285
00286 saveClicked_ = true;
00287 checkForChanges();
00288 var currentIcon =[document.getElementsByTagName("input")[0].value,
00289 document.getElementsByTagName("input")[1].value,
00290 document.getElementsByTagName("input")[2].value,
00291 document.getElementsByTagName("input")[3].value,
00292 document.getElementsByTagName("input")[4].value,
00293 document.getElementsByTagName("input")[5].value];
00294
00295 var icon_list_options = document.getElementById("iconDropdown").childNodes[0].childNodes;
00296 for (var opt = 0; opt < icon_list_options.length; opt++){
00297 if (icon_list_options[opt].value == currentSelectedValue_){
00298 icon_list_options[opt].selected = true;
00299 break;
00300 }
00301 }
00302
00303 megaLibrary_[opt-2] = currentIcon;
00304
00305
00306 }
00307
00308 function submitChangesToServer(){
00309
00310
00311 var iconList = "iconList=";
00312
00313
00314
00315
00316 for(var icon = 0; icon < (megaLibrary_.length); icon++)
00317 {
00318 for(var details=0; details < (megaLibrary_[icon].length); details++)
00319 {
00320
00321 iconList += (megaLibrary_[icon][details] + ",");
00322 }
00323 }
00324
00325
00326 iconList = iconList.substring(0, iconList.length - 1);
00327
00328 console.log(iconList);
00329 makeServerRequest(iconList);
00330 }
00331
00332 function activateSave(){
00333
00334
00335
00336 changesMade_ = true;
00337
00338 }
00339
00340
00341 function makeServerRequest(data){
00342
00343 DesktopContent.XMLHttpRequest("iconEditor", data, iconEditorHandler, undefined, undefined);
00344 }
00345
00346 var iconEditorHandler = function(req){
00347
00348 var iconArray = req.responseText.split(",");
00349 console.log(iconArray);
00350 var numberOfIconFields = 6;
00351 megaLibrary_.length = 0;
00352
00353 for(var i=0;i<(iconArray.length-1);i+=numberOfIconFields)
00354 megaLibrary_.push([iconArray[i], iconArray[i+1], iconArray[i+2], iconArray[i+3], iconArray[i+4], iconArray[i+5]]);
00355 console.log(megaLibrary_);
00356
00357 finishInit();
00358 return;
00359 }