mas01mj@640: /*
mas01mj@640:  * jOWL_UI, User Interface Elements for jOWL, semantic javascript library
mas01mj@640:  * Creator - David Decraene
mas01mj@640:  * Version 1.0
mas01mj@640:  * Website: http://Ontologyonline.org
mas01mj@640:  * Licensed under the MIT license
mas01mj@640:  * Verified with JSLint http://www.jslint.com/
mas01mj@640:  */
mas01mj@640: (function($){
mas01mj@640: 
mas01mj@640: jOWL.UI = {
mas01mj@640: 	broadcaster : function(){
mas01mj@640: 		var listeners = [];
mas01mj@640: 		this.addListener = function(obj){
mas01mj@640: 			function add(obj){if(obj.propertyChange) { listeners.push(obj); } }
mas01mj@640: 			if(obj.constructor == Array){for(var i=0;i<obj.length;i++){ add(obj[i]); } }
mas01mj@640: 			else { add(obj); }
mas01mj@640: 			return this; 
mas01mj@640: 		};
mas01mj@640: 		this.broadcast = function(item){ for(var i=0;i<listeners.length;i++){ listeners[i].propertyChange.call(item, item); } };
mas01mj@640: 		if(!this.propertyChange){ this.propertyChange = function(item){}; }
mas01mj@640: 	},
mas01mj@640: 	asBroadcaster : function(ui_elem){ ui_elem.broadcaster = jOWL.UI.broadcaster; ui_elem.broadcaster(); },
mas01mj@640: 	defaults : {
mas01mj@640: 		contentClass: "jowl-content",
mas01mj@640: 		focusClass: "ui-state-hover",
mas01mj@640: 		wrapperClass : "ui-widget-content"
mas01mj@640: 	}
mas01mj@640: };
mas01mj@640: 
mas01mj@640: /** 
mas01mj@640: WIDGETS 
mas01mj@640: all widgets: 
mas01mj@640: 	addListener : add an object with a propertyChange function, will be triggered on select
mas01mj@640: 	propertyChange: update the widget with a new jowl object
mas01mj@640: Events:
mas01mj@640: 	onSelect: (look into propertylens click), return false to suppress the event, this = jquery element, first argument = jOWL object
mas01mj@640: CSS:
mas01mj@640: 	wrapperClass: css class(es) for main element, the el itself
mas01mj@640: 	contentClass: css class(es) for main content element, accessible by el.content
mas01mj@640: 	focusClass: css class(es) for element in focus,
mas01mj@640: */
mas01mj@640: $.fn.extend({
mas01mj@640: /* 
mas01mj@640: owl_navbar
mas01mj@640: options:
mas01mj@640: 	onSelect : this element refers to jquery node, first argument = jOWL object
mas01mj@640: */
mas01mj@640: 	owl_navbar: function(options){
mas01mj@640: 		options = $.extend({
mas01mj@640: 			contentClass : jOWL.UI.defaults.contentClass,
mas01mj@640: 			focusClass : jOWL.UI.defaults.focusClass,
mas01mj@640: 			onSelect : function(item){},
mas01mj@640: 			onPropertyChange : function(item){}
mas01mj@640: 		}, options);
mas01mj@640: 		var self = this;
mas01mj@640: 		this.addClass("jowl-navbar");
mas01mj@640: 		this.content = $("."+options.contentClass, this).empty();
mas01mj@640: 			if(!this.content.length) { this.content = $("<div/>").addClass(options.contentClass).appendTo(this); }
mas01mj@640: 		this.parents =  $('<div/>').appendTo(this.content);
mas01mj@640: 		this.focus = $('<div/>').addClass(options.focusClass).appendTo(this.content);
mas01mj@640: 		this.children = $('<div/>').appendTo(this.content);
mas01mj@640: 		var listnode = $('<span/>').click(function(){
mas01mj@640: 			var node = $(this);
mas01mj@640: 			var res = jOWL(node.attr('title'));
mas01mj@640: 			if(options.onSelect.call(node, res) === false) { return; }
mas01mj@640: 			if(res && res.isClass) { self.propertyChange.call(res, res); self.broadcast(res); }
mas01mj@640: 		});
mas01mj@640: 
mas01mj@640: 		jOWL.UI.asBroadcaster(this);
mas01mj@640: 
mas01mj@640: 		this.propertyChange = function(item){
mas01mj@640: 			if(options.onPropertyChange.call(this, item) === false) { return; }
mas01mj@640: 			if(item.isClass){
mas01mj@640: 				item.bind(self.focus);
mas01mj@640: 				if(jOWL.options.reason) { item.hierarchy();}
mas01mj@640: 				self.parents.empty().append(item.parents().bind(listnode));
mas01mj@640: 				self.children.empty().append(item.children().bind(listnode));
mas01mj@640: 			}
mas01mj@640: 		};
mas01mj@640: 		return this;
mas01mj@640: 	},
mas01mj@640: /** 
mas01mj@640: autocomplete field.
mas01mj@640: */
mas01mj@640: 	owl_autocomplete : function(options){
mas01mj@640: 		options = $.extend({
mas01mj@640: 			time:500, //responsetime to check for new keystrokes, default 500
mas01mj@640: 			chars:3, //number of characters needed before autocomplete starts searching
mas01mj@640: 			focus:false, //put cursor on the input field when loading
mas01mj@640: 			limit:10, //limit size of result list to given amount
mas01mj@640: 			contentClass : "ui-widget-content",
mas01mj@640: 			focusClass : jOWL.UI.defaults.focusClass,
mas01mj@640: 			hintClass : "ui-autocomplete-hint",
mas01mj@640: 			hint: false, //Message (if any) to show when unfocused.
mas01mj@640: 			onSelect : function(item){}, //function that can be overridden
mas01mj@640: 			formatListItem : function(listitem, type, identifier, termarray){ //formatting of results, can be overridden
mas01mj@640: 				if(type){ listitem.append($('<div class="type"/>').text(type)); }
mas01mj@640: 				listitem.append($('<div class="name"/>').text(identifier));
mas01mj@640: 				if(termarray.length) { listitem.append($('<div class="terms"/>').text(termarray.join(', '))
mas01mj@640: 					.prepend($('<span/>').addClass('termlabel').text("Terms: ")));
mas01mj@640: 			}
mas01mj@640: 		}}, options);
mas01mj@640: 		jOWL.UI.asBroadcaster(this);
mas01mj@640: 
mas01mj@640: 		this.showHint = function(){
mas01mj@640: 			this.hinted = true;
mas01mj@640: 			if(options.hint){
mas01mj@640: 				this.addClass(options.hintClass).val(options.hint);
mas01mj@640: 			}
mas01mj@640: 			else {this.val(''); }
mas01mj@640: 		};
mas01mj@640: 		this.showHint();
mas01mj@640: 
mas01mj@640: 		var self = this; var old = ''; var open = false; self.val('');
mas01mj@640: 		var results = $('<ul/>').addClass(options.contentClass).addClass("jowl_autocomplete_results");
mas01mj@640: 		var div = $("<div/>").addClass(options.wrapperClass).append(results); this.after(div);
mas01mj@640: 		results.cache = {};
mas01mj@640: 		results.isEmpty = function(){ for(x in results.cache) { return false; } return true; };
mas01mj@640: 		results.close = function(){this.hide();};
mas01mj@640: 		results.open = function(q, cache){
mas01mj@640: 			this.show(); 
mas01mj@640: 			if(q){
mas01mj@640: 				if(!cache || results.isEmpty()) { results.cache = jOWL.query(q, options); }
mas01mj@640: 				else { 
mas01mj@640: 					var newcache = {};
mas01mj@640: 					for(x in results.cache){
mas01mj@640: 						var entry = results.cache[x]; 
mas01mj@640: 						var found = false;
mas01mj@640: 						var newentries = [];
mas01mj@640: 						if(x.searchMatch(q) > -1) { found = true; }
mas01mj@640: 						for(var i = 0;i<entry.length;i++){
mas01mj@640: 							if(entry[i].term.searchMatch(q) > -1) { found = true; newentries.push(entry[i]); }
mas01mj@640: 						}
mas01mj@640: 						if(found) { newcache[x] = newentries; }
mas01mj@640: 						}
mas01mj@640: 					results.cache = newcache;
mas01mj@640: 					}
mas01mj@640: 				this.populate(results.cache);
mas01mj@640: 				}
mas01mj@640: 		};
mas01mj@640: 
mas01mj@640: 		results.populate = function(data){
mas01mj@640: 			var res = this; this.empty(); var count =0;
mas01mj@640: 			var clickFunction = function(){
mas01mj@640: 				var node = $(this), res = jOWL(node.data("jowltype"));
mas01mj@640: 				if(options.onSelect.call(node, res) === false) { return; }
mas01mj@640: 				self.broadcast(res);
mas01mj@640: 			};
mas01mj@640: 
mas01mj@640: 			var onHover = function(){ $(this).addClass(options.focusClass); };
mas01mj@640: 			var offHover = function(){$(this).removeClass(options.focusClass);};
mas01mj@640: 
mas01mj@640: 			for(x in data){
mas01mj@640: 				if(count < options.limit){
mas01mj@640: 					var item = data[x];
mas01mj@640: 					var v = jOWL.isExternal(x);
mas01mj@640: 					v = v ? v[1] : x;
mas01mj@640: 					var list = $('<li/>').data("jowltype", x)
mas01mj@640: 					.click(clickFunction).hover(onHover, offHover)
mas01mj@640: 					.appendTo(res);
mas01mj@640: 					var terms = [];
mas01mj@640: 					for(var l = 0;l<item.length;l++){ 
mas01mj@640: 						var found = false; var newterm = item[l].term;
mas01mj@640: 						for(var y=0; y < terms.length;y++){ if(terms[y].toLowerCase() == newterm.toLowerCase()) { found = true; } }
mas01mj@640: 						if(!found) { terms.push(newterm); }
mas01mj@640: 						}
mas01mj@640: 					options.formatListItem.call(list, list, item[0].type, v, terms);
mas01mj@640: 
mas01mj@640: 				}
mas01mj@640: 				count++;
mas01mj@640: 			}
mas01mj@640: 		};
mas01mj@640: 
mas01mj@640: 		setInterval(function(){
mas01mj@640: 			var newvalue = self.val();
mas01mj@640: 			var cache = true;
mas01mj@640: 			if(old != newvalue){
mas01mj@640: 				var longervalue = newvalue.length > old.length && newvalue.indexOf(old) === 0;
mas01mj@640: 				if(!old) { cache = false; }
mas01mj@640: 				old = newvalue; 
mas01mj@640: 				if(newvalue.length < options.chars && open){ results.close();open = false;}
mas01mj@640: 				else if(newvalue.length >=options.chars && newvalue.length > 0){
mas01mj@640: 					if(cache) { cache = longervalue && newvalue.length > options.chars; }
mas01mj@640: 					results.open(newvalue, cache);
mas01mj@640: 					open = true;
mas01mj@640: 					}
mas01mj@640: 				
mas01mj@640: 			}
mas01mj@640: 		}, options.time);
mas01mj@640: 
mas01mj@640: 		self.bind('keyup', function(){ if(!this.value.length){ results.close(); open = false; } });
mas01mj@640: 		self.bind('blur', function(){
mas01mj@640: 			if(open){setTimeout(function(){results.close();}, 200);open = false;}
mas01mj@640: 			if(!self.val().length){self.showHint();}
mas01mj@640: 			});
mas01mj@640: 		//timeout for registering clicks on results.
mas01mj@640: 		self.bind('focus', function(){
mas01mj@640: 			if(self.hinted){
mas01mj@640: 				self.hinted = false;
mas01mj@640: 				$(this).removeClass(options.hintClass).val('');
mas01mj@640: 			}
mas01mj@640: 			if(self.val().length && !open){results.open('', open);open = true;}});
mas01mj@640: 		//reopen, but do not get results
mas01mj@640: 		return this;
mas01mj@640: 	},
mas01mj@640: /** 
mas01mj@640: Tree View
mas01mj@640: */
mas01mj@640: 	owl_treeview : function(options){
mas01mj@640: 		options = $.extend({
mas01mj@640: 			contentClass : jOWL.UI.defaults.contentClass,
mas01mj@640: 			focusClass: "focus",
mas01mj@640: 			nameClass: "name",
mas01mj@640: 			treeClass: "jowl-treeview",
mas01mj@640: 			rootClass: "root",
mas01mj@640: 			onSelect : function(item){}, //function that can be overwritten to specfy behavior when something is selected
mas01mj@640: 			rootThing : false, //if true then topnode is (owl) 'Thing'
mas01mj@640: 			isStatic : false, // if static then selections will refresh the entire tree
mas01mj@640: 			addChildren : false //add a given objects children to the treeview as well
mas01mj@640: 		}, options);
mas01mj@640: 
mas01mj@640: 		/** construct the hierarchy & make a tree of it */
mas01mj@640: 		function TreeModel(owlobject){
mas01mj@640: 			
mas01mj@640: 			function clear(el){ //reset invParents, for later use.
mas01mj@640: 				if(el.parents) { el.parents().each(function(){
mas01mj@640: 					this.invParents = null; clear(this);
mas01mj@640: 				}); }
mas01mj@640: 			}
mas01mj@640: 
mas01mj@640: 			function leaf(node){
mas01mj@640: 				node.jnode.addClass(options.focusClass);
mas01mj@640: 				if(options.addChildren){
mas01mj@640: 					var entry = jOWL(node.$name.attr('title'));
mas01mj@640: 					if(entry && entry.children){ entry.children().each(function(){ node.add(this); }); } }
mas01mj@640: 			}
mas01mj@640: 
mas01mj@640: 			function traverse(itemarray, appendto){
mas01mj@640: 				if(!itemarray) { return; }
mas01mj@640: 				itemarray.each(function(){
mas01mj@640: 					var node = appendto.add(this);
mas01mj@640: 					if(this.invParents){ traverse(this.invParents, node); }
mas01mj@640: 					else { leaf(node); }
mas01mj@640: 				});
mas01mj@640: 
mas01mj@640: 			}	
mas01mj@640: 
mas01mj@640: 			var h = owlobject.hierarchy(true);
mas01mj@640: 			if(options.rootThing) { traverse(h, tree.root(jOWL("Thing"))); }
mas01mj@640: 			else { 
mas01mj@640: 				var root = tree.root(h); 
mas01mj@640: 				for(var i=0;i<root.length;i++){ 
mas01mj@640: 						traverse(root[i].invParents, root[i]);
mas01mj@640: 						if(!root[i].invParents) { leaf(root[i]); }
mas01mj@640: 					}
mas01mj@640: 
mas01mj@640: 				}
mas01mj@640: 			clear(owlobject);
mas01mj@640: 
mas01mj@640: 		}
mas01mj@640: 
mas01mj@640: 		/**
mas01mj@640: 		var tree = $(selector).owl_treeview();
mas01mj@640: 		var root = tree.root("node");
mas01mj@640: 		root.add("node2").add("child");
mas01mj@640: 		*/
mas01mj@640: 		function Tree(node, treemodel, options){
mas01mj@640: 			var rack = $('<ul/>').addClass(options.treeClass).appendTo(node);
mas01mj@640: 			var tree = this;
mas01mj@640: 			/**item can be text, a jOWL object, or a jOWL array */
mas01mj@640: 			this.root = function(item){
mas01mj@640: 				var rt = null; //root
mas01mj@640: 				rack.empty();  
mas01mj@640: 				if(item && item.each) {
mas01mj@640: 					rt = [];
mas01mj@640: 					item.each(function(it){
mas01mj@640: 						var x =  new fn.node(it, true); 
mas01mj@640: 						x.wrapper.addClass("tv");
mas01mj@640: 						x.jnode.appendTo(rack);
mas01mj@640: 						x.invParents = it.invParents; it.invParents = null;	//reset for later use
mas01mj@640: 						rt.push(x);
mas01mj@640: 					}); 
mas01mj@640: 					return rt;
mas01mj@640: 				}
mas01mj@640: 				rt = new fn.node(item, true);
mas01mj@640: 				rt.wrapper.addClass("tv"); 
mas01mj@640: 				rt.jnode.appendTo(rack);
mas01mj@640: 				return rt;
mas01mj@640: 			};
mas01mj@640: 
mas01mj@640: 			var fn = {};
mas01mj@640: 			fn.node = function(text, isRoot){ //creates a new node
mas01mj@640: 				this.jnode = isRoot ? $('<li/>').addClass(options.rootClass) : $('<li class="tvi"/>');
mas01mj@640: 				this.$name = null;
mas01mj@640: 				if(text){
mas01mj@640: 					this.$name = $('<span/>').addClass(options.nameClass);
mas01mj@640: 					if(typeof text == "string") { this.$name.html(text); }
mas01mj@640: 					else if(text.bind) { text.bind(this.$name); }
mas01mj@640: 					var n = this.$name; 
mas01mj@640: 					this.$name.appendTo(this.jnode).click(function(){
mas01mj@640: 						var entry = jOWL(n.attr('title'));
mas01mj@640: 						if(entry && options.onSelect.call(n, entry) === false) { return; }
mas01mj@640: 						tree.broadcast(entry); 
mas01mj@640: 						if(options.isStatic) { tree.propertyChange(entry); }
mas01mj@640: 						return false;});
mas01mj@640: 				}
mas01mj@640: 				
mas01mj@640: 				this.wrapper = $('<ul/>').appendTo(this.jnode);
mas01mj@640: 				var self = this;
mas01mj@640: 					self.jnode.click(function(){toggle(); return false;});
mas01mj@640: 
mas01mj@640: 				this.add = function(text){
mas01mj@640: 					var nn = new fn.node(text);
mas01mj@640: 					if(!self.wrapper.children().length) { toNode();	}
mas01mj@640: 					else { 
mas01mj@640: 						var lastchild = self.wrapper.children(':last'); 
mas01mj@640: 						lastchild.swapClass("tvilc", "tvic");
mas01mj@640: 						lastchild.swapClass("tvile", "tvie");
mas01mj@640: 						lastchild.swapClass("tvil", "tvi");
mas01mj@640: 						
mas01mj@640: 						}//children - change end of list
mas01mj@640: 					self.wrapper.append(nn.jnode.swapClass('tvi', 'tvil'));
mas01mj@640: 					return nn;
mas01mj@640: 					};
mas01mj@640: 
mas01mj@640: 				function toggle(){ 
mas01mj@640: 					var t = self.jnode.hasClass("tvic") || self.jnode.hasClass("tvie") || self.jnode.hasClass("tvilc") || self.jnode.hasClass("tvile");
mas01mj@640: 					if(!t) { return; }
mas01mj@640: 					self.jnode.swapClass('tvic', 'tvie'); self.jnode.swapClass('tvilc', 'tvile');
mas01mj@640: 					self.wrapper.slideToggle();
mas01mj@640: 					}
mas01mj@640: 
mas01mj@640: 				function toNode(){ 
mas01mj@640: 					self.jnode.swapClass('tvil', 'tvilc');
mas01mj@640: 					self.jnode.swapClass('tvi', 'tvic');
mas01mj@640: 					}
mas01mj@640: 				};
mas01mj@640: 				return this;
mas01mj@640: 		}// end Tree
mas01mj@640: 
mas01mj@640: 		this.addClass("jowl-tree");
mas01mj@640: 		this.content = $("."+options.contentClass, this).empty();
mas01mj@640: 		if(!this.content.length){ this.content = $('<div/>').addClass(options.contentClass).appendTo(this); }
mas01mj@640: 		var tree = new Tree(this.content, null, options);
mas01mj@640: 		jOWL.UI.asBroadcaster(tree);
mas01mj@640: 		tree.propertyChange = function(item){ if(item.isClass) { var m = new TreeModel(item); } };
mas01mj@640: 		return tree;
mas01mj@640: 	},
mas01mj@640: /** Uses templating 	
mas01mj@640: options: 
mas01mj@640: onChange: owl:Class, owl:Thing, etc..., tell the widget what to do with the different kinds of Ontology Objects.
mas01mj@640: "data-jowl" : {split: ",  ", "somevariable" : function_triggered_for_each_result } 
mas01mj@640:    example: "rdfs:label" : {split: ",  ", "rdfs:label" : function(){ //'this' keyword refers to HTML element}} )
mas01mj@640:    example: "sparql-dl:PropertyValue(owl:Class, ?p, ?x)" : {"?p": function(){ //'this' keyword refers to HTML element }}
mas01mj@640:    //prefil: for sparql-dl queries
mas01mj@640:    //onComplete: function to trigger when the specific propertybox query is completed, this refers to the HTML element for propertybox
mas01mj@640:    //sort: sort results on specified parameter, for sparql-dl results.
mas01mj@640: onUpdate: called when the widget updates itself
mas01mj@640: */
mas01mj@640: 		owl_propertyLens : function(options){ 
mas01mj@640: 			var self = this;
mas01mj@640: 			self.options = $.extend({
mas01mj@640: 				backlinkClass : "backlink",
mas01mj@640: 				split: {},
mas01mj@640: 				disable : {},
mas01mj@640: 				click : {}},
mas01mj@640: 				options);
mas01mj@640: 			self.resourcetype = this.attr('data-jowl') || "owl:Class";
mas01mj@640: 			var propertyboxes = [];
mas01mj@640: 			$('.propertybox', this).each(function(){
mas01mj@640: 				var node = new jOWL.UI.PropertyBox($(this), self);
mas01mj@640: 				propertyboxes.push(node);
mas01mj@640: 				node.el.hide();
mas01mj@640: 			});
mas01mj@640: 			var backlink = $('.backlink', this).hide();
mas01mj@640: 			if(!backlink.length) { backlink = $('<div class="jowl_link"/>').addClass(self.options.backlinkClass).text("Back").hide().appendTo(this); }
mas01mj@640: 			jOWL.UI.asBroadcaster(this);
mas01mj@640: 
mas01mj@640: 			/** fn: optional function to execute*/
mas01mj@640: 			this.link = function(source, target, htmlel, fn){
mas01mj@640: 				htmlel.addClass("jowl_link").click(function(){
mas01mj@640: 				if(fn) { fn(); }
mas01mj@640: 				self.broadcast(target);
mas01mj@640: 				self.propertyChange(target);
mas01mj@640: 				backlink.source = source.name;
mas01mj@640: 				backlink.show().unbind('click').click(function(){
mas01mj@640: 					self.broadcast(source); self.propertyChange(source); backlink.hide();
mas01mj@640: 				});
mas01mj@640: 
mas01mj@640: 				});
mas01mj@640: 
mas01mj@640: 			};
mas01mj@640: 
mas01mj@640: 			var action = {
mas01mj@640: 				"rdfs:label": function(item){ return [{"rdfs:label": item.label() }]; },
mas01mj@640: 				"rdf:ID" : function(item){ return [{"rdf:ID": [item.name, item] }]; },
mas01mj@640: 				"rdfs:comment" : function(item){
mas01mj@640: 					return $.map(item.description(), function(n){return {"rdfs:comment":n }; });
mas01mj@640: 					},
mas01mj@640: 				"rdf:type" : function(item){
mas01mj@640: 					if(item.owlClass) { return [{"rdf:type": item.owlClass() }]; }
mas01mj@640: 					return [{"rdf:type": item.type }];
mas01mj@640: 				},
mas01mj@640: 				"term" : function(item){
mas01mj@640: 					return $.map(item.terms(), function(n, i){ return { "term" : n[0] }; });
mas01mj@640: 				},
mas01mj@640: 				"rdfs:range": function(item){if(item.range) { return [{"rdfs:range": item.range }]; } },
mas01mj@640: 				"rdfs:domain": function(item){if(item.domain) { return [{"rdfs:domain": item.domain }]; } },
mas01mj@640: 				"permalink": function(item){
mas01mj@640: 					var href = jOWL.permalink(item);
mas01mj@640: 					return [{"permalink": "<a href='"+href+"'>Permalink</a>" }];
mas01mj@640: 				},
mas01mj@640: 				"owl:disjointWith": function(item){
mas01mj@640: 					if(!(item.isClass)) { return; }
mas01mj@640: 					return $.map(
mas01mj@640: 							jOWL.Xpath('*', item.jnode)
mas01mj@640: 								.filter(function(){return this.nodeName == "owl:disjointWith"; }), 
mas01mj@640: 							function(n, i){ return {"owl:disjointWith": jOWL($(n).RDF_Resource())};
mas01mj@640: 							});	
mas01mj@640: 				},
mas01mj@640: 				"default" : function(item){
mas01mj@640: 					var type = this.attr("data-jowl");
mas01mj@640: 					return $.map(
mas01mj@640: 								jOWL.Xpath('*', item.jnode).filter(function(){return this.nodeName == type; }),
mas01mj@640: 								function(n, i){ var x = {}; x[type] = $(n).text(); return x; }
mas01mj@640: 								);	
mas01mj@640: 				}
mas01mj@640: 			};
mas01mj@640: 
mas01mj@640: 			this.propertyChange = function(item){ 
mas01mj@640: 				if(!item) { return; }
mas01mj@640: 				self.property = item;
mas01mj@640: 				if(backlink.source != item.name) { backlink.hide(); } else { backlink.source = false; }
mas01mj@640: 				
mas01mj@640: 				if(item.type != self.resourcetype){
mas01mj@640: 					if(item.isDatatypeProperty && self.resourcetype == "rdf:Property") {}
mas01mj@640: 					else if(item.isObjectProperty && self.resourcetype == "rdf:Property"){}
mas01mj@640: 					else { return; }
mas01mj@640: 				}
mas01mj@640: 
mas01mj@640: 				for(var i = 0;i<propertyboxes.length;i++){
mas01mj@640: 					var pbox = propertyboxes[i];
mas01mj@640: 					pbox.clear();
mas01mj@640: 					if(!pbox.actiontype){return; }
mas01mj@640: 					var actiontype = pbox.actiontype;
mas01mj@640: 					if(self.options.disable[actiontype]) { return; }
mas01mj@640: 
mas01mj@640: 					if(!self.options[actiontype]) { self.options[actiontype] = {}; }
mas01mj@640: 
mas01mj@640: 					if(actiontype.indexOf("sparql-dl:") === 0){ 
mas01mj@640: 						var query = actiontype.split("sparql-dl:", 2)[1];
mas01mj@640: 						var fill = {}; fill[self.resourcetype] = item;
mas01mj@640: 						if(self.options[actiontype].prefill) { $.extend(fill, self.options[actiontype].prefill); }
mas01mj@640: 						var qr = new jOWL.SPARQL_DL(query, fill).execute({onComplete : function(r){
mas01mj@640: 							if(self.options[actiontype].sort) { r.sort(self.options[actiontype].sort); }
mas01mj@640: 							pbox.setResults(r.results, item);
mas01mj@640: 							}});
mas01mj@640: 					}
mas01mj@640: 					else {
mas01mj@640: 						var choice = (action[actiontype]) ? actiontype : "default";
mas01mj@640: 						var results = action[choice].call(pbox.valuebox, item);
mas01mj@640: 						pbox.setResults(results, item);
mas01mj@640: 					}
mas01mj@640: 				}
mas01mj@640: 					
mas01mj@640: 					if(self.options.onUpdate) { self.options.onUpdate.call(this, item); }
mas01mj@640: 			}; //end property change
mas01mj@640: 		
mas01mj@640: 		if(self.options.tooltip){
mas01mj@640: 			var lens = this.remove();
mas01mj@640: 			this.display = function(element, htmlel){
mas01mj@640: 				htmlel.tooltip({
mas01mj@640: 					title: element.label(), 
mas01mj@640: 					html: function(){	lens.propertyChange(element); backlink.hide(); return lens.get(0); }
mas01mj@640: 				}); 
mas01mj@640: 			};
mas01mj@640: 		}
mas01mj@640: 		return this;
mas01mj@640: 		},
mas01mj@640: 
mas01mj@640: /**
mas01mj@640: Use propertyChange to set the class
mas01mj@640: Use addField to add property refinements
mas01mj@640: Use serialize to serialize input
mas01mj@640: */
mas01mj@640: 	owl_datafield: function(options){
mas01mj@640: 		options = $.extend({
mas01mj@640: 			selectorClass : "jowl-datafield-selector",
mas01mj@640: 			messageClass : "jowl-datafield-message",
mas01mj@640: 			labelClass : "jowl-datafield-property-label"
mas01mj@640: 		}, options);
mas01mj@640: 		var self = this;
mas01mj@640: 		var pArray = {}; //associative array for properties.
mas01mj@640: 		this.messages = {};
mas01mj@640: 		this.messages[jOWL.NS.xsd()+"positiveInteger"] = "Allowed values: positive numbers or comparisons like  '>5 && <15' ";
mas01mj@640: 
mas01mj@640: 		this.addClass("owl_UI");
mas01mj@640: 		jOWL.UI.asBroadcaster(this);
mas01mj@640: 
mas01mj@640: 		this.property = null;
mas01mj@640: 
mas01mj@640: 		this.propertyChange = function(item){
mas01mj@640: 			if(item.isClass){
mas01mj@640: 				this.property = item;
mas01mj@640: 					for(x in pArray){//reset all properties
mas01mj@640: 						if(pArray[x].remove){ pArray[x].remove(); delete pArray[x]; }
mas01mj@640: 					}
mas01mj@640: 			}
mas01mj@640: 		};
mas01mj@640: 
mas01mj@640: 		/** Sets up a new field */
mas01mj@640:         this.addField = function(property){
mas01mj@640:             if(pArray[property.URI]){
mas01mj@640:                 //allow for multiple fields?
mas01mj@640: 				return;
mas01mj@640:             }
mas01mj@640: 
mas01mj@640: 			var $content = $("<div/>");
mas01mj@640: 				 pArray[property.URI] = $content;
mas01mj@640: 
mas01mj@640: 			var $title = property.bind($("<div/>")).addClass(options.labelClass).appendTo($content).click(function(){ $content.remove(); delete pArray[property.URI]; });
mas01mj@640: 
mas01mj@640:             if(property.isObjectProperty){
mas01mj@640: 
mas01mj@640: 				var sp = new jOWL.SPARQL_DL("Type(?t, ?c),PropertyValue(concept, property, ?c)", {concept : self.property, property : property }).execute({ 
mas01mj@640: 					onComplete : function(obj){
mas01mj@640: 						if(!obj.results.length){ return; } //modify to deal with non value results
mas01mj@640: 						obj.sort("?t");
mas01mj@640: 						
mas01mj@640: 						$select = $("<select class='"+options.selectorClass+"'/>").appendTo($content);
mas01mj@640: 
mas01mj@640: 						for(var i=0;i<obj.results.length;i++){
mas01mj@640: 							obj.results[i]['?t'].bind($("<option/>")).appendTo($select);
mas01mj@640: 						}
mas01mj@640: 
mas01mj@640: 						$content.appendTo(self);
mas01mj@640: 					}});
mas01mj@640: 
mas01mj@640:             }
mas01mj@640:             else if(property.isDatatypeProperty){
mas01mj@640: 				var msg ="";
mas01mj@640: 				if(self.messages[property.range]){ msg = self.messages[property.range];	}
mas01mj@640: 
mas01mj@640: 				var $input = $('<div/>').addClass(options.selectorClass).attr("title", property.range).append($('<input type="text" style="font-size:11px;width:100px;"/>'));
mas01mj@640: 				var $message = $('<div/>').addClass(options.messageClass).text(msg).appendTo($input);
mas01mj@640: 
mas01mj@640: 				$content.append($input).appendTo(self);
mas01mj@640: 				$('input', $content).focus(function(){
mas01mj@640: 					$message.animate({opacity: 1.0}, 1500).fadeOut();
mas01mj@640: 				});
mas01mj@640: 
mas01mj@640: 				
mas01mj@640: 			}
mas01mj@640: 
mas01mj@640: 		};
mas01mj@640: 
mas01mj@640: 		this.serialize = function(){
mas01mj@640: 			var q = { "Type": self.property, "PropertyValue" : [] };
mas01mj@640: 
mas01mj@640: 			$('.'+options.selectorClass, self).each(function(){
mas01mj@640: 				var $this = $(this);
mas01mj@640: 				var $prop = $this.siblings('.'+options.labelClass);
mas01mj@640: 				var prop = $prop.attr('title');
mas01mj@640: 				if( $this.is("select")){
mas01mj@640: 						var s = $this.get(0);
mas01mj@640: 						var thing = $(s[s.selectedIndex]).attr('title');
mas01mj@640: 						q.PropertyValue.push([prop, thing]);
mas01mj@640: 					}
mas01mj@640: 				else {
mas01mj@640: 					var $input = $this.find("input");
mas01mj@640: 					var datatype = $this.attr('title');
mas01mj@640: 					var entry = $input.get(0).value;
mas01mj@640: 					if(entry) { q.PropertyValue.push([prop, '"'+entry+'"']); }
mas01mj@640: 				}
mas01mj@640: 			});
mas01mj@640: 			return q;
mas01mj@640: 		};
mas01mj@640: 
mas01mj@640: 		return this;
mas01mj@640: 	}
mas01mj@640: });
mas01mj@640: 
mas01mj@640: /** Used by owl_PropertyLens */
mas01mj@640: jOWL.UI.PropertyBox = function($el, resourcebox){
mas01mj@640: 	var v = $('[data-jowl]', $el);
mas01mj@640: 	if(v.length){	this.descendant = true;}
mas01mj@640: 
mas01mj@640: 	this.el = $el;
mas01mj@640: 	this.resourcebox = resourcebox;
mas01mj@640: 	this.valuebox = v.length ? v : $el;
mas01mj@640: 	this.actiontype = this.valuebox.attr('data-jowl'); 
mas01mj@640: };
mas01mj@640: 
mas01mj@640: jOWL.UI.PropertyBox.prototype = {
mas01mj@640: 	setResults : function(results, item){
mas01mj@640: 		var nodes = jOWL.UI.Template(results, this.valuebox, this.resourcebox.options[this.actiontype].split);
mas01mj@640: 		this.complete(nodes, item);
mas01mj@640: 		if(nodes && nodes.length && this.descendant) { this.el.show(); this.valuebox.hide(); } 
mas01mj@640: 		if(this.resourcebox.options[this.actiontype].onComplete) { this.resourcebox.options[this.actiontype].onComplete.call(this.el.get(0)); }	
mas01mj@640: 	},
mas01mj@640: 	complete : function(nodes, item){
mas01mj@640: 		var res = this.resourcebox;
mas01mj@640: 		if(!nodes || !nodes.length) { return; }
mas01mj@640: 		var v = $.data(nodes, "parameters"); 
mas01mj@640: 		for(x in v){ 
mas01mj@640: 			if(v[x].length && typeof res.options[this.actiontype][x] == "function") {
mas01mj@640: 				v[x].each(res.options[this.actiontype][x]);
mas01mj@640: 			}}
mas01mj@640: 		for(x in res.options.onChange){
mas01mj@640: 			var data = $('[typeof='+x+']', nodes).add(nodes.filter('[typeof='+x+']'));
mas01mj@640: 			if(x.charAt(0) == "." || x.charAt(0) == "#"){ data = data.add($(x, nodes));}
mas01mj@640: 			data.each(function(){
mas01mj@640: 				var node = $(this);
mas01mj@640: 				$.data(node, 'data-jowl', x);
mas01mj@640: 				var id = node.attr('title');
mas01mj@640: 				if(id != "anonymousOntologyObject") { res.options.onChange[$.data(node, 'data-jowl')].call(node, item, jOWL(id), res); }
mas01mj@640: 			});
mas01mj@640: 		}
mas01mj@640: 	},
mas01mj@640: 	clear : function(){
mas01mj@640: 		var prev = this.valuebox.prev('.jowl-template-result');
mas01mj@640: 		if(!prev.length){ prev = this.valuebox.prev('.jowl-template-splitter');}
mas01mj@640: 		if(prev.length) { prev.remove(); this.clear(this.valuebox); }
mas01mj@640: 	}
mas01mj@640: };
mas01mj@640: 
mas01mj@640: /**arr: associative array of variablrd, jqel: node for which variables need to be substituted,  */
mas01mj@640: jOWL.UI.Template = function(arr, jqel, splitter){
mas01mj@640: 	var options = {
mas01mj@640: 		resultClass : "jowl-template-result",
mas01mj@640: 		splitterClass : "jowl-template-splitter"
mas01mj@640: 	};
mas01mj@640: 	if(!arr) { return; }
mas01mj@640: 
mas01mj@640: 	function bindObject(value, jnode){
mas01mj@640: 		var bound = false;
mas01mj@640: 		if(!value) { return false; }
mas01mj@640: 		if(typeof value == 'string') { jnode.html(value); bound = true;}
mas01mj@640: 		else if(value.constructor == Array){ 
mas01mj@640: 			if(value.length == 2) { value[1].bind(jnode).text(value[0]); bound = true;	} 
mas01mj@640: 			}
mas01mj@640: 		else if(value.bind){ value.bind(jnode); bound = true; }
mas01mj@640: 		return bound;
mas01mj@640: 	}
mas01mj@640: 	var count = 0, a = [], b = {};
mas01mj@640: 	var remnantFn = function(){
mas01mj@640: 		var txt = $(this).text(); 
mas01mj@640: 		if(txt.indexOf('${') === 0 && txt.lastIndexOf('}') == txt.length-1 ) { $(this).hide(); }
mas01mj@640: 	};
mas01mj@640: 	for(var i=0;i<arr.length;i++){ 
mas01mj@640: 		var x = jqel.clone(true).wrapInner("<"+jqel.get(0).nodeName+" class='"+options.resultClass+"'/>").children();
mas01mj@640: 		/** copy style settings */
mas01mj@640: 			x.addClass(jqel.attr('class')).removeClass('propertybox');
mas01mj@640: 		/** accepted obj types= string, array["string", "jowlobject"], jowlobject*/
mas01mj@640: 		for(obj in arr[i]){
mas01mj@640: 			if(!b[obj]) { b[obj] = []; }
mas01mj@640: 			var occurrences = $(':contains(${'+obj+'})', x);
mas01mj@640: 			if(!occurrences.length){
mas01mj@640: 				if(x.text() == "${"+obj+"}") { if(bindObject(arr[i][obj], x)) {
mas01mj@640: 					count++; b[obj].push(x.get(0));
mas01mj@640: 				}}
mas01mj@640: 			}
mas01mj@640: 			else { 
mas01mj@640: 				occurrences.each(function(){	
mas01mj@640: 					if(this.innerHTML == "${"+obj+"}") { var node = $(this); if(bindObject(arr[i][obj], node)) { count++;  b[obj].push(this); }	}
mas01mj@640: 				});
mas01mj@640: 			}
mas01mj@640: 		}
mas01mj@640: 		var remnants = $(':contains(${)', x); //hide parameters that weren't substituted
mas01mj@640: 			remnants.each(remnantFn);
mas01mj@640: 		if(count){
mas01mj@640: 			x.insertBefore(jqel);
mas01mj@640: 			a.push(x.get(0));
mas01mj@640: 			if(count > 1 && splitter) { 
mas01mj@640: 				$splitter = (splitter.indexOf('<') === 0) ? $(splitter) : $("<span/>").text(splitter);
mas01mj@640: 				$splitter.addClass(options.splitterClass).insertBefore(x);
mas01mj@640: 				}
mas01mj@640: 		}
mas01mj@640: 	}
mas01mj@640: 	for(x in b){ if(b[x].length) { b[x] = $(b[x]); } }
mas01mj@640: 	var nodes = $(a);
mas01mj@640: 	$.data(nodes, "parameters", b);
mas01mj@640: 	return nodes;
mas01mj@640: };
mas01mj@640: 
mas01mj@640: /** 
mas01mj@640: Supporting functionality
mas01mj@640: */
mas01mj@640: 
mas01mj@640: $.fn.swapClass = function(c1,c2) {
mas01mj@640: 	return this.each(function() {
mas01mj@640: 		if ($(this).hasClass(c1)) { $(this).removeClass(c1); $(this).addClass(c2);} 
mas01mj@640: 		else if ($(this).hasClass(c2)) {$(this).removeClass(c2);$(this).addClass(c1);}
mas01mj@640: 		});
mas01mj@640: };
mas01mj@640: 
mas01mj@640: })(jQuery);