Mercurial > hg > ChinaGisRestApi
annotate gis_gui/lib/blocks.js @ 263:3a10287447b1
Integration von Europeana4D UserInterface
| author | fknauft |
|---|---|
| date | Thu, 01 Dec 2011 13:48:56 +0100 |
| parents | d6c7bedf4370 |
| children | 52b1247140b7 |
| rev | line source |
|---|---|
| 63 | 1 /* |
| 2 * fallback for console.log calls | |
| 3 */ | |
| 4 if (typeof(console) == 'undefined') { | |
| 5 console = { | |
| 6 log : function(){}, | |
| 7 debug : function(){}, | |
| 65 | 8 error : function(){} |
| 9 }; | |
| 63 | 10 } |
| 11 | |
| 12 function defined(x) { | |
| 13 // returns if x is defined | |
| 68 | 14 return (typeof arguments[0] !== "undefined"); |
| 63 | 15 } |
| 16 | |
| 72 | 17 function randomString() { |
| 18 var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz"; | |
| 19 var string_length = 8; | |
| 20 var randomstring = ''; | |
| 21 for (var i=0; i<string_length; i++) { | |
| 22 var rnum = Math.floor(Math.random() * chars.length); | |
| 23 randomstring += chars.substring(rnum,rnum+1); | |
| 24 } | |
| 25 return randomstring; | |
| 26 } | |
| 27 | |
| 28 | |
| 263 | 29 |
| 63 | 30 /* |
| 31 * guiBlocks base | |
| 32 */ | |
| 33 function guiBlocks(container) { | |
| 34 // list of blocks | |
| 35 this.blocks = []; | |
| 36 this.containerElement = container; | |
| 37 return this; | |
| 38 } | |
| 39 //var guiBlocks = new Object(); | |
| 40 | |
| 41 /* | |
| 42 * Block base class | |
| 43 */ | |
| 44 guiBlocks.Block = function(id, element) { | |
| 45 this.id = id; // the blocks html id | |
| 46 this.element = element; // the html dom element | |
| 47 this.storeId = null; // the id in online storage | |
| 65 | 48 this.params = {}; // parameters to store |
| 63 | 49 return this; |
| 50 }; | |
| 51 | |
| 52 // create a new block and add it to the current workspaces stack | |
| 53 guiBlocks.prototype.addBlock = function(url, baseId, params, whenDone) { | |
| 54 // add title to url | |
| 55 var newblock = $("<div>Block loading...</div>"); | |
| 68 | 56 var newid = baseId+"_"+randomString(); |
| 63 | 57 var container = this.containerElement; |
| 58 console.debug("addblock newid="+newid); | |
| 59 newblock.hide(); | |
| 60 newblock.load(url, function() { | |
| 61 // after load function | |
| 62 console.debug("addblock after load block"); | |
| 63 console.debug(container); | |
| 64 $(this).find(".block").attr("id",newid); | |
| 65 $(this).appendTo(container); | |
|
253
d6c7bedf4370
New reload button active in upper right corner of block
fknauft
parents:
248
diff
changeset
|
66 |
| 63 | 67 // chain done function |
| 68 if (typeof(whenDone) == "function") { | |
| 72 | 69 // chain whenDone (should we add parameters?) |
| 70 whenDone.apply(this); | |
| 63 | 71 } else { |
| 72 // default after load function | |
| 73 $(this).fadeIn(); | |
| 65 | 74 } |
| 63 | 75 |
| 76 }); | |
| 77 // create new Block object | |
| 78 var block = new guiBlocks.Block(newid, newblock); | |
| 79 // add parameters | |
| 68 | 80 if (params == null) { |
| 63 | 81 // create new params |
| 82 params = {"id": newid}; | |
| 83 } | |
| 84 block.params = params; | |
| 85 // add to list of blocks | |
| 86 this.blocks.push(block); | |
| 87 return block; | |
| 65 | 88 }; |
| 63 | 89 |
| 90 guiBlocks.prototype.getBlock = function(id) { | |
| 91 for (b in this.blocks) { | |
| 92 if (b.id == id) { | |
| 93 return b; | |
| 94 } | |
| 95 } | |
| 96 return null; | |
| 65 | 97 }; |
| 63 | 98 |
| 99 /* | |
| 100 guiBlocks.prototype.getStoreItem = function(tag,type,item) { | |
| 101 // get item from online storage | |
| 102 jQuery.get(); | |
| 103 } | |
| 104 */ | |
| 105 | |
| 106 guiBlocks.prototype.loadListOfItems = function(storeTag,storeType,callback) { | |
| 107 // loads list of id and type objects and executes callback function | |
| 108 var url = "../db/RESTjson/db/public/gui_objects/"+escape(storeTag)+"/"+storeType+"?recursive=true"; | |
| 109 jQuery.getJSON(url,callback); | |
| 65 | 110 }; |
| 63 | 111 |
| 263 | 112 guiBlocks.prototype.e4DOpen = function(titel,table){ |
| 113 var e4D_URL="http://mappit.mpiwg-berlin.mpg.de:8080/e4D"; | |
| 114 var paramstr = "format=KML"; | |
| 115 // var layer_URL = "http://chinagis-develop.mpiwg-berlin.mpg.de:9080/db/RESTdb/db/public/" + escape(table) + "?" + paramstr; | |
| 116 var layer_URL = "http://mappit.mpiwg-berlin.mpg.de/db/RESTdb/db/public/" + escape(table) + "?" + paramstr; | |
| 117 var kml_URL = ""; | |
| 118 /* jQuery.get(layerurl, function (data, textStatus, XMLHttpRequest) { | |
| 119 // function after load kml url finished | |
| 120 console.debug("kml url loaded! this=", this ); | |
| 121 console.debug(" data=", data ); | |
| 122 console.debug(" data type=", typeof(data)); | |
| 123 if (typeof(data) == "string") { | |
| 124 kml_URL = data; | |
| 125 }*/ | |
| 126 e4D_URL=e4D_URL+"?kml1="+layer_URL+"&source1=1"; | |
| 127 console.debug(" e4D_URL=", e4D_URL ); | |
| 128 var newwindow=window.open(e4D_URL,"Mappit@Europeana4D","height=800,width=900"); | |
| 129 if (window.focus) {newwindow.focus();} | |
| 130 return false; | |
| 131 /* });*/ | |
| 132 }; | |
| 63 | 133 |
| 134 guiBlocks.Block.prototype.storeBlock = function(storeTag) { | |
| 135 var storeType = this.params.type; | |
| 136 var storeItem = this.params.id; | |
| 137 var url = "../db/RESTjson/db/public/gui_objects/"+escape(storeTag)+"/"+storeType+"/"+storeItem; | |
| 138 var ds = JSON.stringify(this.params); | |
| 139 jQuery.ajax({ | |
| 140 type: "PUT", | |
| 141 url: url, | |
| 142 data: ds, | |
| 143 success: function(msg){ | |
| 144 console.debug("PUT success msg=",msg); | |
| 145 this.storeId = storeItem; | |
| 146 } | |
| 147 }); | |
| 148 }; | |
| 149 | |
| 150 | |
| 151 | |
| 152 // collapse the block so that only its titlebar is visible | |
| 153 function foldBlock(segment){ | |
| 72 | 154 if (segment == null) { |
| 63 | 155 return; |
| 156 } | |
| 157 if(segment.hasClass("folded")){ | |
| 158 //if the segment is collapsed | |
| 159 segment.removeClass("folded"); | |
| 160 segment.find(".body").slideDown(); | |
| 161 } else{ | |
| 162 //if the segment is expanded | |
| 163 segment.addClass("folded"); | |
| 164 segment.find(".body").slideUp(); | |
| 165 } | |
| 166 } | |
| 167 | |
| 168 function switchSubscreens(container, id1, id2) { | |
| 169 var oldScreen = container.find("#"+id1); | |
| 170 var newScreen = container.find("#"+id2); | |
| 171 | |
| 172 oldScreen.fadeOut(); | |
| 173 newScreen.fadeIn(); | |
| 174 } | |
| 175 | |
| 176 function guiBlocks_init() { | |
| 177 // initialize collapsed windows | |
| 178 $("div.block.folded").each(function(e){ | |
| 179 $(this).find(".body").slideUp(); | |
| 180 }); | |
| 181 | |
| 182 // TitleBar Click | |
| 183 $("div.block div.titlebar h1").live("click", function(e) { | |
| 184 var segment = $(this).parents().filter("div.block"); | |
| 185 foldBlock(segment); | |
| 186 }); | |
| 187 | |
| 188 // TitleBar Close | |
| 189 $("div.block div.titlebar div.close_button").live("click", function(e){ | |
| 190 segment = $(this).parents().filter("div.block"); | |
| 65 | 191 segment.fadeOut(function(){ segment.remove();}); |
| 63 | 192 }); |
| 193 | |
| 248 | 194 // TitleBar Reload |
| 195 $("div.block div.titlebar div.reload_button").live("click", function(e){ | |
| 196 segment = $(this).parents().filter("div.block"); | |
| 197 console.debug("guiBlocks_init().live(reload) segment[0].id="+ segment[0].id); | |
| 198 //FJK: funktioniert leider noch nicht! | |
| 199 // var blockid=$(this).parents().firstElementChild.id; | |
| 200 // var mapblock=getBlock(blockid); | |
| 201 // var params=mapblock.readMapParams(); | |
| 202 // var be = mapblock.element; | |
| 203 //var mapblock = $(be).find(".map_box"); | |
| 204 // console.debug("guiBlocks_init().live(reload) params="+ new String(params)); | |
| 205 // mapblock.updateMap(be,params); | |
| 206 }); | |
| 207 | |
| 65 | 208 } |
| 248 | 209 |
| 210 function getBlock(id){ | |
| 211 for (b in this.blocks) { | |
| 212 if (b.id == id) { | |
| 213 return b; | |
| 214 } | |
| 215 } | |
| 216 return null; | |
| 217 } |