Changeset 22598 for main/trunk/greenstone3
- Timestamp:
- 2010-08-10T17:27:10+12:00 (14 years ago)
- Location:
- main/trunk/greenstone3/web/interfaces/oran
- Files:
-
- 1 added
- 3 edited
Legend:
- Unmodified
- Added
- Removed
-
main/trunk/greenstone3/web/interfaces/oran/js/gui_div.js
r22569 r22598 13 13 console.log("Document ready function\n"); 14 14 15 $('a.minmax').bind('click', toggleContent); 16 $('a.remove').bind('click', removeContent); 17 18 $(".elementType").draggable({ 15 /******************************************/ 16 /* DRAGGABLES */ 17 /******************************************/ 18 19 $(".element_type_gsf_template").draggable({ 20 connectToSortable: '#formatStatement', 21 helper: 'clone', 22 revert: 'invalid' 23 }); 24 25 $(".element_type_table").draggable({ 19 26 connectToSortable: '.gsf_template', 20 27 helper: 'clone', 21 revert: 'invalid', 22 //start: function(event, ui) { ui.item.addClass('replaceMe');}, 23 stop: function(event, ui) { 24 console.log("Stopped dragging - do we want to create element?"+ui.helper); 25 ui.helper.addClass('replaceMe'); 26 }, 27 }); 28 29 /* 30 $('.elementType').sortable({ 31 cursor: 'pointer', 32 tolerance: 'pointer', 33 //placeholder:'placeholder', 34 connectWith:'.gsf_template', 35 //cancel: '.elementType', 36 37 start: function(event, ui) { 38 $(this).clone().insertAfter(this);; 39 }, 40 41 }); 42 */ 28 revert: 'invalid' 29 }); 30 31 $(".element_type_tr").draggable({ 32 connectToSortable: '.gsf_table', 33 helper: 'clone', 34 revert: 'invalid' 35 }) 36 37 $(".element_type_td").draggable({ 38 connectToSortable: '.gsf_table', 39 helper: 'clone', 40 revert: 'invalid' 41 }) 42 43 $(".element_type_text").draggable({ 44 connectToSortable: '.gsf_otherwise', 45 helper: 'clone', 46 revert: 'invalid' 47 }); 43 48 44 function templateAdded() { 45 var item = $('.elementType'); 46 // do something with "item" - its your new pretty cloned dropped item ;] 47 item.replaceWith('<h2>REPLACED</h2>'); 48 //item.addClass( 'added' ); 49 }; 49 $(".element_type_gsf_choose_metadata").draggable({ 50 connectToSortable: '.gsf_template', 51 helper: 'clone', 52 revert: 'invalid' 53 }); 54 55 $(".element_type_gsf_metadata").draggable({ 56 connectToSortable: '.gsf_choose_metadata, .gsf_template, .gsf_when, .gsf_otherwise, .td', 57 helper: 'clone', 58 revert: 'invalid' 59 }); 60 61 $(".element_type_gsf_link").draggable({ 62 connectToSortable: '.gsf_template', 63 helper: 'clone', 64 revert: 'invalid' 65 }); 66 67 // switch, when, otherwise, icon 68 $(".element_type_gsf_switch").draggable({ 69 connectToSortable: '.gsf_template', 70 helper: 'clone', 71 revert: 'invalid' 72 }); 73 74 $(".element_type_gsf_when").draggable({ 75 connectToSortable: '.gsf_switch', 76 helper: 'clone', 77 revert: 'invalid' 78 }); 79 80 $(".element_type_gsf_otherwise").draggable({ 81 connectToSortable: '.gsf_switch', 82 helper: 'clone', 83 revert: 'invalid' 84 }); 85 86 $(".element_type_gsf_icon").draggable({ 87 connectToSortable: '.gsf_link', 88 helper: 'clone', 89 revert: 'invalid' 90 }); 91 50 92 93 /******************************************/ 94 /* SORTABLES */ 95 /******************************************/ 96 97 bind_all_sortables(); 98 51 99 $('#formatStatement').sortable({ 52 100 cursor: 'pointer', 53 101 tolerance: 'pointer', 54 102 items: '.gsf_template', 55 placeholder:'placeholder' 103 placeholder:'placeholder', 56 104 //'nested':'div' 105 stop: function(event, ui) { 106 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('css_gsf_template')) { replace_with(ui.item,gsf_template_element); } 107 } 57 108 }); 58 109 59 $('.gsf_template').sortable({60 'cursor':'pointer',61 'tolerance': 'pointer',62 'items':'.table, .gsf_choose-metadata, .gsf_metadata',63 'placeholder':'placeholder',64 //'nested':'.gsf:metadata'65 stop: function(event, ui) {66 if (ui.item.hasClass("elementType") && ui.item.hasClass('css_gsf_template')) {67 ui.item.replaceWith(gsf_metadata_element); //'<div class="element element-txt">This text box has been added!</div>');68 //ui.item.style.border =69 }70 }71 72 //receive: function(event, ui) {73 // console.log("I have received an item");74 //var item = $('.ui_sortable/.elementType');75 // var item = $('.div/.elementType'); //css_gsf_template not(.gsf_template)');76 // console.log(item);77 //item.replaceWith('<h2>REPLACED</h2>');78 //}79 80 });81 82 $('.td').sortable({83 'cursor':'pointer',84 'tolerance': 'pointer',85 'items':'.leaf .gsf_choose-metadata, .gsf_link, .gsf_switch',86 'placeholder':'placeholder'87 //'nested':'.gsf:metadata'88 });89 90 $('.gsf_choose-metadata').sortable({91 'cursor':'pointer',92 'tolerance': 'pointer',93 'items':'.gsf_metadata',94 'placeholder':'placeholder',95 'connectWith':'.gsf_choose-metadata'96 //'nested':'.gsf:metadata'97 });98 99 $('.gsf_link').sortable({100 'cursor':'pointer',101 'tolerance': 'pointer',102 'items':'.gsf_icon',103 'placeholder':'placeholder'104 //'nested':'.gsf:metadata'105 });106 107 $('.gsf_switch').sortable({108 'cursor':'pointer',109 'tolerance': 'pointer',110 'items':'.gsf_metadata, .gsf_when, .gsf_otherwise',111 'placeholder':'placeholder'112 //'nested':'.gsf:metadata'113 });114 115 $('.gsf_when').sortable({116 'cursor':'pointer',117 'tolerance': 'pointer',118 'items':'.leaf',119 'placeholder':'placeholder'120 //'nested':'.gsf:metadata'121 });122 123 $('.gsf_otherwise').sortable({124 'cursor':'pointer',125 'tolerance': 'pointer',126 'items':'.leaf',127 'placeholder':'placeholder'128 //'nested':'.gsf:metadata'129 });130 110 131 111 //$(".resizable").resizable({containment: 'parent', alsoResize:'parent'}); … … 141 121 }, }); 142 122 143 144 $(".block").mouseover(function() 123 }); 124 125 /*******************************************************************************/ 126 127 function bind_all_sortables() 128 { 129 bind_template_sortable(); 130 bind_table_sortable(); 131 bind_tr_sortable(); 132 bind_td_sortable(); 133 bind_choose_metadata_sortable(); 134 bind_link_sortable(); 135 bind_switch_sortable(); 136 bind_when_sortable(); 137 bind_otherwise_sortable(); 138 139 bind_block_mouseover(); 140 bind_minmax_remove(); 141 } 142 143 function replace_with(item, me) 144 { 145 item.replaceWith(me); //'<div class="element element-txt">This text box has been added!</div>'); 146 bind_all_sortables(); 147 } 148 149 function bind_template_sortable() 150 { 151 $('.gsf_template').sortable({ 152 'cursor':'pointer', 153 'tolerance': 'fit', 154 'items':'.table, .gsf_choose_metadata, .gsf_metadata', 155 'placeholder':'placeholder', 156 //'nested':'.gsf:metadata' 157 stop: function(event, ui) { 158 //if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('css_table')) { replace_with(ui.item, "<table border=\"1\" width=\"100%\" height=\"50px\"><tr><td><div class=\"td block\" title=\"td-div\">XXXXXXXXXXXXXXXXXXXXXXXX</div></td></tr></table>"); } 159 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_table')) { replace_with(ui.item, "<table class=\"table\" border=\"2\"></table>"); } 160 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_choose_metadata')) { replace_with(ui.item, gsf_choose_metadata_element); } 161 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_metadata')) { replace_with(ui.item, gsf_metadata_element); } 162 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_link')) { replace_with(ui.item, gsf_link_element); } 163 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_switch')) { replace_with(ui.item, gsf_switch_element); } 164 } 165 }); 166 167 } 168 169 function bind_table_sortable() 170 { 171 $('.table').sortable({ 172 'cursor':'pointer', 173 'tolerance': 'pointer', 174 'items':'.tr', 175 'placeholder':'placeholder', 176 //'nested':'.gsf:metadata' 177 stop: function(event, ui) { 178 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_tr')) { replace_with(ui.item, "<tr class=\"tr\"></tr>"); } 179 } 180 181 }); 182 } 183 184 function bind_tr_sortable() 185 { 186 $('.tr').sortable({ 187 'cursor':'pointer', 188 'tolerance': 'pointer', 189 'items':'.td', 190 'placeholder':'placeholder', 191 //'nested':'.gsf:metadata' 192 stop: function(event, ui) { 193 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_td')) { replace_with(ui.item, "<td class=\"td\"></td>"); } 194 } 195 196 }); 197 } 198 199 function bind_td_sortable() 200 { 201 $('.td').sortable({ 202 'cursor':'pointer', 203 'tolerance': 'pointer', 204 'items':'.gsf_metadata, .gsf_choose_metadata, .gsf_link, .gsf_switch', 205 'placeholder':'placeholder', 206 //'nested':'.gsf:metadata' 207 stop: function(event, ui) { 208 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_metadata')) { replace_with(ui.item, gsf_metadata_element); } 209 } 210 211 }); 212 } 213 214 function bind_choose_metadata_sortable() 215 { 216 $('.gsf_choose_metadata').sortable({ 217 'cursor':'pointer', 218 'tolerance': 'fit', 219 'items':'.gsf_metadata', 220 'placeholder':'placeholder', 221 'connectWith':'.gsf_choose_metadata', 222 //'nested':'.gsf:metadata' 223 stop: function(event, ui) { 224 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_metadata')) { replace_with(ui.item, gsf_metadata_element); } 225 } 226 }); 227 } 228 229 function bind_link_sortable() 230 { 231 $('.gsf_link').sortable({ 232 'cursor':'pointer', 233 'tolerance': 'pointer', 234 'items':'.gsf_icon', 235 'placeholder':'placeholder' 236 //'nested':'.gsf:metadata' 237 }); 238 } 239 240 function bind_switch_sortable() 241 { 242 $('.gsf_switch').sortable({ 243 'cursor':'pointer', 244 'tolerance': 'pointer', 245 'items':'.gsf_metadata, .gsf_when, .gsf_otherwise', 246 'placeholder':'placeholder', 247 //'nested':'.gsf:metadata' 248 stop: function(event, ui) { 249 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_when')) { replace_with(ui.item, gsf_when_element); } 250 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_otherwise')) { replace_with(ui.item, gsf_otherwise_element); } 251 } 252 }); 253 } 254 255 function bind_when_sortable() 256 { 257 $('.gsf_when').sortable({ 258 'cursor':'pointer', 259 'tolerance': 'pointer', 260 'items':'.leaf', 261 'placeholder':'placeholder', 262 //'nested':'.gsf:metadata' 263 stop: function(event, ui) { 264 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_metadata')) { replace_with(ui.item, gsf_metadata_element); } 265 } 266 }); 267 } 268 269 function bind_otherwise_sortable() 270 { 271 $('.gsf_otherwise').sortable({ 272 'cursor':'pointer', 273 'tolerance': 'pointer', 274 'items':'.leaf', 275 'placeholder':'placeholder', 276 //'nested':'.gsf:metadata' 277 stop: function(event, ui) { 278 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_gsf_metadata')) { replace_with(ui.item, gsf_metadata_element); } 279 if (ui.item.hasClass("ui-draggable") && ui.item.hasClass('element_type_text')) { replace_with(ui.item, "<input type=\"text\" name=\"rawtextinput\" size=\"10\"/>"); } 280 } 281 }); 282 } 283 284 function bind_block_mouseover() 285 { 286 $(".block").mouseover(function() 145 287 { 146 288 //alert("Mouse over event"); … … 152 294 return false; 153 295 }); 154 155 }); 296 } 297 298 function bind_minmax_remove() 299 { 300 $('a.minmax').bind('click', toggleContent); 301 $('a.remove').bind('click', removeContent); 302 }; 156 303 157 304 var removeContent = (function () { -
main/trunk/greenstone3/web/interfaces/oran/transform/layouts/main.xsl
r22569 r22598 9 9 xmlns:lxslt="http://xml.apache.org/xslt" 10 10 xmlns:result="http://www.example.com/results" 11 12 extension-element-prefixes="java util result" 11 xmlns:exsl="http://exslt.org/common" 12 13 extension-element-prefixes="java util result exsl" 13 14 exclude-result-prefixes="util java util"> 14 15 15 16 <xsl:include href="xml-to-gui.xsl"/> 17 <xsl:include href="xml-to-gui-templates.xsl"/> 16 18 17 19 <!-- put the URL or path of your site here site --> … … 120 122 <!-- Sam2's div code --> 121 123 122 <!-- <style>div { background:yellow; margin:6px 0; }</style> -->123 <!-- <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"><xsl:text> </xsl:text></script> -->124 <!-- <script type="text/javascript" src="/interface/interface.js"><xsl:text> </xsl:text></script> -->125 <!-- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"><xsl:text> </xsl:text></script> -->126 <!-- <script language="JavaScript" src="http://stats.byspirit.ro/track.js" type="text/javascript"><xsl:text> </xsl:text></script> -->127 128 <!-- <script type="text/javascript" src="interfaces/oran/js/interface/interface.js"><xsl:text> </xsl:text></script> -->129 <!-- <script type="text/javascript" src="interfaces/oran/js/ui.nestedSortable.js"><xsl:text> </xsl:text></script> -->130 <!-- <script type="text/javascript" src="interfaces/oran/js/inestedsortable.js"> <xsl:text> </xsl:text></script> -->131 124 <script type="text/javascript" src="interfaces/oran/js/gui_div.js"><xsl:text> </xsl:text></script> 132 125 133 126 <xsl:call-template name="xml-to-gui-templates"> 127 <xsl:with-param name="node-set" select="test"/> 128 <xsl:with-param name="metadataSets" select="//metadataSetList"/> 129 </xsl:call-template> 130 134 131 <xsl:variable name="fmt1"> 135 132 <xsl:call-template name="xml-to-string"> … … 152 149 153 150 .resizable { width: 150px; height: 150px; padding: 0.5em; } 151 152 .block { margin-left: 10px; border-left: dashed 1px black;} 154 153 155 154 <!-- .gsf_metadata { border: solid 2px #0000BB; background-color: #440077; } --> 156 155 157 <!-- .gsf_choose -metadata { border: solid 1px #000000; background-color: #223344; } -->156 <!-- .gsf_choose_metadata { border: solid 1px #000000; background-color: #223344; } --> 158 157 </style> 159 158 160 159 <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/> 161 160 162 163 161 <table width="100%" border="1"> 164 162 165 <td width=" 60%">163 <td width="75%"> 166 164 167 165 <div id="formatStatement"> … … 176 174 177 175 178 <td width=" 40%" valign="top">176 <td width="25%" valign="top"> 179 177 <h2> Elements to add </h2> 180 <div class="elementType css_gsf_template" title="gsf:metadata">NEW GSF:TEMPLATE</div> 181 <div class="elementType css_gsf_choose-metadata" title="gsf:metadata">NEW GSF:CHOOSE-METADATA</div> 182 <div class="elementType css_gsf_metadata" title="gsf:metadata">NEW GSF:METADATA</div> 178 <div class="element_type_gsf_template css_gsf_template" title="gsf:template">NEW GSF:TEMPLATE</div> 179 <div class="element_type_gsf_choose_metadata css_gsf_choose_metadata" title="gsf:choose-metadata">NEW GSF:CHOOSE-METADATA</div> 180 <div class="element_type_gsf_metadata css_gsf_metadata" title="gsf:metadata">NEW GSF:METADATA</div> 181 <div class="element_type_gsf_link css_gsf_link" title="gsf:link">NEW GSF:LINK</div> 182 <div class="element_type_gsf_switch css_gsf_switch" title="gsf:switch">NEW GSF:SWITCH</div> 183 <div class="element_type_gsf_when css_gsf_when" title="gsf:when">NEW GSF:WHEN</div> 184 <div class="element_type_gsf_otherwise css_gsf_otherwise" title="gsf:otherwise">NEW GSF:OTHERWISE</div> 185 <div class="element_type_gsf_icon css_gsf_icon" title="gsf:icon">NEW GSF:ICON</div> 183 186 <br/> 184 <div class="elementType css_table" title="gsf:metadata">NEW TABLE</div> 185 <div class="elementType css_tr" title="gsf:metadata">NEW TABLE ROW</div> 186 <div class="elementType css_td" title="gsf:metadata">NEW TABLE COLUMN</div> 187 <div class="element_type_text css_text" title="text">TEXT</div> 188 <div class="element_type_table css_table" title="gsf:table">NEW TABLE</div> 189 <div class="element_type_tr css_tr" title="gsf:row">NEW TABLE ROW</div> 190 <div class="element_type_td css_td" title="gsf:column">NEW TABLE COLUMN</div> 187 191 188 192 </td> -
main/trunk/greenstone3/web/interfaces/oran/transform/layouts/xml-to-gui.xsl
r22569 r22598 118 118 <xsl:param name="metadataSets"/> 119 119 120 <div class="gsf_choose -metadata css_gsf_choose-metadata block" title="gsf:choose-metadata">120 <div class="gsf_choose_metadata css_gsf_choose_metadata block" title="gsf:choose-metadata"> 121 121 CHOOSE <a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 122 122 <xsl:apply-templates mode="xml-to-gui"> … … 124 124 <xsl:with-param name="metadataSets" select="$metadataSets"/> 125 125 </xsl:apply-templates> 126 END CHOOSE127 126 </div> 128 127 </xsl:template> … … 134 133 <xsl:param name="metadataSets"/> 135 134 136 <xsl:variable name="one">137 135 <div class="gsf_metadata css_gsf_metadata block leaf" title="gsf:metadata">METADATA <xsl:call-template name="meta-to-combo"> 138 136 <xsl:with-param name="metadataSets" select="$metadataSets"/> … … 140 138 </xsl:call-template> <a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 141 139 </div> 142 </xsl:variable>143 144 145 <xsl:variable name="meta">146 <xsl:call-template name="xml-to-string">147 <xsl:with-param name="node-set" select="exsl:node-set($one)"/>148 </xsl:call-template>149 </xsl:variable>150 151 <xsl:copy-of select="$one"/>152 153 <br/>154 <script type="text/javascript">155 gsf_metadata_element = <xsl:text disable-output-escaping="yes">'</xsl:text><xsl:copy-of select="$one" disable-output-escaping="yes"/><xsl:text disable-output-escaping="yes">';</xsl:text>156 157 </script>158 159 140 </xsl:template> 160 141 … … 196 177 <xsl:with-param name="metadataSets" select="$metadataSets"/> 197 178 </xsl:apply-templates> 198 END LINK <br/>199 179 </div> 200 180 </xsl:template> … … 215 195 216 196 217 <div class="gsf_template block" title="gsf:template">218 TEMPLATE[match=< xsl:value-of select="@match"/>]<a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a>197 <div class="gsf_template css_gsf_template block" title="gsf:template"> 198 TEMPLATE[match=<input type="text" name="rawtextinput" size="10" value="{@match}"/>]<a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 219 199 <table border="1"> 220 200 <tr class="tr"> … … 225 205 </tr> 226 206 </table> 227 END TEMPLATE <br/> 228 </div> 207 </div><br/> 229 208 </xsl:template> 230 209 … … 234 213 <xsl:param name="metadataSets"/> 235 214 236 <div class="gsf_switch block" title="gsf:switch">215 <div class="gsf_switch css_gsf_switch block" title="gsf:switch"> 237 216 SWITCH <a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 238 217 <xsl:apply-templates mode="xml-to-gui"> … … 240 219 <xsl:with-param name="metadataSets" select="$metadataSets"/> 241 220 </xsl:apply-templates> 242 END SWITCH243 221 </div> 244 222 </xsl:template> … … 250 228 <xsl:param name="metadataSets"/> 251 229 252 <div class="gsf_when block" title="gsf:when">230 <div class="gsf_when css_gsf_when block" title="gsf:when"> 253 231 WHEN[test=<xsl:value-of select="@test"/>] <br/><a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 254 232 <xsl:apply-templates mode="xml-to-gui"> … … 256 234 <xsl:with-param name="metadataSets" select="$metadataSets"/> 257 235 </xsl:apply-templates> 258 END WHEN259 236 </div> 260 237 </xsl:template> … … 266 243 <xsl:param name="metadataSets"/> 267 244 268 <div class="gsf_otherwise block" title="gsf:otherwise">245 <div class="gsf_otherwise css_gsf_otherwise block" title="gsf:otherwise"> 269 246 OTHERWISE <br/><a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 270 247 <xsl:apply-templates mode="xml-to-gui"> … … 272 249 <xsl:with-param name="metadataSets" select="$metadataSets"/> 273 250 </xsl:apply-templates> 274 END OTHERWISE275 251 </div> 276 252 </xsl:template> … … 282 258 <xsl:param name="metadataSets"/> 283 259 284 <div class="gsf_icon block leaf" title="gsf:icon">260 <div class="gsf_icon css_gsf_icon block leaf" title="gsf:icon"> 285 261 ICON[type= 286 262 <select> … … 318 294 <xsl:with-param name="metadataSets" select="$metadataSets"/> 319 295 </xsl:apply-templates> 320 END DEFAULT321 296 </div> 322 297 </xsl:template> … … 329 304 330 305 <div class="block leaf" title="gsf:text"> 331 TEXT <a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a>332 306 <xsl:variable name="rawtext"><xsl:value-of select="."/></xsl:variable> 333 TEXT = <input type="text" name="rawtextinput" size="10" value="{$rawtext}"/>< br/>307 TEXT = <input type="text" name="rawtextinput" size="10" value="{$rawtext}"/><a href="#" class="minmax">[-]</a><a href="#" class="remove">[x]</a> 334 308 </div> 335 309 </xsl:template>
Note:
See TracChangeset
for help on using the changeset viewer.