2228 lines
738 KiB
JavaScript
2228 lines
738 KiB
JavaScript
|
/* OxJS 0.1.3905 (c) 2023 0x2620, dual-licensed GPL/MIT, see https://oxjs.org for details */'use strict';Ox.AnnotationFolder=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({clickLink:null,collapsed:false,editable:false,highlight:'',highlightAnnotations:'none',id:'','in':0,item:'',items:[],keyboard:'',languages:'all',out:0,position:0,range:'all',selected:'',separator:';',showInfo:false,showWidget:false,sort:'position',translate:false,title:'',type:'text',users:'all',widgetSize:256,width:0}).options(options||{}).update(function(key,value){if(key=='highlight'){self.$annotations.options({highlight:value});}
|
||
|
|
if(key=='highlightAnnotations'){self.$annotations.options({highlightGroup:value});updateAnnotations();}
|
||
|
|
if(['in','out'].indexOf(key)>-1&&self.editing){var item=Ox.getObjectById(self.options.items,self.options.selected);if(item){item[key]=value;item.duration=self.options.out-self.options['in'];}
|
||
|
|
self.points=getPoints();}
|
||
|
|
if(key=='in'){self.options.range=='selection'&&updateAnnotations();}else if(key=='out'){self.options.range=='selection'&&updateAnnotations();}else if(key=='position'){if(self.options.range=='position'){crossesPoint()&&updateAnnotations();self.position=self.options.position;}}else if(key=='collapsed'){self.options.collapsed=!self.options.collapsed;self.$panel.options({collapsed:!self.options.collapsed});self.options.type=='event'&&self.$calendar.resizeCalendar()
|
||
|
|
self.options.type=='map'&&self.$map.resizeMap()}else if(key=='languages'){updateAnnotations();}else if(key=='range'){updateAnnotations();self.$annotations.options({placeholder:getPlaceholder()});}else if(key=='selected'){if(value===''){self.editing=false;}
|
||
|
|
if(value&&self.options.collapsed){self.$panel.options({animate:false});self.$panel.options({collapsed:false});self.$panel.options({animate:true});}
|
||
|
|
self.$annotations.options({selected:value});}else if(key=='sort'){self.sort=getSort();self.$annotations.options({sort:self.sort});showWarnings();}else if(key=='users'){updateAnnotations();}else if(key=='width'){if(self.widget){self.$outer.options({width:self.options.width});self.$inner.options({width:self.options.width});self.$widget.options({width:self.options.width});}
|
||
|
|
self.$annotations.options({width:self.options.type=='text'?self.options.width+8:self.options.width});}});if(self.options.selected){self.options.collapsed=false;}
|
||
|
|
self.annotations=getAnnotations();self.points=getPoints();self.position=self.options.position;self.sort=getSort();self.widget=self.options.type=='event'?'Calendar':self.options.type=='place'?'Map':'';self.$addButton=Ox.Button({id:'add',style:'symbol',title:'add',tooltip:Ox._('Add {0}',[self.options.item])
|
||
|
|
+(self.options.keyboard?' ['+self.options.keyboard+']':''),type:'image'}).bindEvent({click:function(){that.triggerEvent('add',{value:''});}});self.$infoButton=Ox.Button({style:'symbol',title:'info',type:'image'}).bindEvent({click:function(){that.triggerEvent('info');}});self.$panel=Ox.CollapsePanel({collapsed:self.options.collapsed,extras:[self.options.editable?self.$addButton:self.$infoButton],size:16,title:self.options.title}).addClass('OxAnnotationFolder').bindEvent({toggle:toggleLayer});that.setElement(self.$panel);that.$content=self.$panel.$content;if(self.widget){self.widgetSize=self.options.showWidget*self.options.widgetSize;self.$outer=Ox.Element().css({display:'table-cell',width:self.options.width+'px'}).appendTo(that.$content);self.$inner=Ox.Element().css({height:self.widgetSize+'px',overflow:'hidden'}).appendTo(self.$outer);if(options.type=='event'){self.$widget=self.$calendar=Ox.Calendar({events:getEvents(),height:self.widgetSize,showZoombar:true,width:self.options.width,zoomOnlyWhenFocused:true}).css({width:self.options.width+'px',height:self.widgetSize+'px'}).bindEvent({select:function(data){if(!data.id&&self.options.selected&&isDefined(Ox.getObjectById(self.options.items,self.options.selected))){self.$annotations.options({selected:''});}else if(data.annotationIds&&data.annotationIds.indexOf(self.options.selected)==-1){self.$annotations.options({selected:data.annotationIds[0]});}}}).appendTo(self.$inner);}else{self.$widget=self.$map=Ox.Map({places:getPlaces(),showTypes:true,zoombar:true,zoomOnlyWhenFocused:true}).css({width:self.options.width+'px',height:self.widgetSize+'px'}).bindEvent({select:function(data){if((!data||!data.id)&&self.options.selected&&isDefined(Ox.getObjectById(self.options.items,self.options.selected))){self.$annotations.options({selected:''});}else if(data&&data.annotationIds&&data.annotationIds.indexOf(self.options.selected)==-1){self.$annotations.options({selected:data.annotationIds[0]});}}}).appendTo(self.$inner);}
|
||
|
|
self.$resizebar=Ox.Element({tooltip:Ox._('Drag to resize or click to toggle map')}).addClass('OxResizebar OxHorizontal').css({position:'absolute',top:self.widgetSize+'px',cursor:'ns-resize'}).append($('<div>').addClass('OxSpace')).append($('<div>').addClass('OxLine')).append($('<div>').addClass('OxSpace')).bindEvent({anyclick:toggleWidget,dragstart:dragstart,drag:drag,dragend:dragend}).appendTo(self.$outer);}
|
||
|
|
self.$annotations=Ox.ArrayEditable(Ox.extend({clickLink:self.options.clickLink,editable:self.options.editable,getSortValue:self.options.type=='text'?function(value){return Ox.stripTags(value);}:null,globalAttributes:['data','lang'],highlight:self.options.translate?Ox._(self.options.highlight):self.options.highlight,highlightGroup:self.options.highlightAnnotations,placeholder:Ox._('Loading...'),separator:self.options.separator,sort:self.sort,submitOnBlur:false,tooltipText:self.options.showInfo?function(item){return Ox.encodeHTMLEntities(item.user)+', '
|
||
|
|
+Ox.formatDate(item.modified.slice(0,10),'%B %e, %Y');}:'',width:self.options.width,maxHeight:self.options.type=='text'?Infinity:void 0,type:self.options.type=='text'?'textarea':'input'},self.options.autocomplete?{autocomplete:function(value,callback){self.options.autocomplete(self.options.id,value,callback);},autocompleteReplace:self.options.type=='entity',autocompleteSelect:true,autocompleteSelectHighlight:true,autocompleteSelectMaxWidth:256,autocompleteSelectOffset:{left:0,top:0},autocompleteSelectUpdate:true,format:self.options.translate?function(value){return Ox._(value);}:null,unformat:function(value){return Ox.decodeHTMLEntities(Ox.stripTags(value));}}:{})).bindEvent({add:function(data){if(self.editing){}
|
||
|
|
that.triggerEvent('add',{value:data.value||''});},blur:function(data){if(data&&data.id&&data.id[0]=='_'){changeAnnotation(data);that.triggerEvent('blur');}else{that.triggerEvent('blur');}},change:changeAnnotation,'delete':removeAnnotation,edit:function(){self.editing=true;that.triggerEvent('edit');},insert:function(data){that.triggerEvent('insert',data);},open:function(){that.triggerEvent('open');},select:selectAnnotation,selectnext:function(){that.triggerEvent('selectnext');},selectprevious:function(){that.triggerEvent('selectprevious');},selectnone:function(){that.triggerEvent('selectnone');},submit:submitAnnotation}).appendTo(['event','place'].indexOf(self.options.type)>-1?self.$outer:that.$content);['0','1','2','3','4','5','6','7','8','9','b','backslash','closebracket','comma','dot','equal','e','f','g','h','i','minus','n','o','openbracket','p','shift_0','shift_equal','shift_g','shift_i','shift_minus','shift_o','slash','space','control_c','control_v',].forEach(function(key){key='key.'+key;self.$annotations.bindEvent(key,function(){that.triggerEvent(key);});});self.loaded=false;setTimeout(function(){self.$annotations.options({items:self.annotations,placeholder:getPlaceholder(),selected:self.options.selected});self.loaded=true;if(self.options.selected){if(self.options.collapsed){self.$panel.options({collapsed:false});}
|
||
|
|
selectAnnotation({id:self.options.selected});};});['0','1','2','3','4','5','6','7','8','9','b','backslash','closebracket','comma','dot','equal','f','g','h','i','minus','n','o','openbracket','p','shift_0','shift_equal','shift_g','shift_i','shift_minus','shift_o','slash','space','control_c','control_v',].forEach(function(key){key='key_'+key;self.$annotations.bindEvent(key,function(){that.triggerEvent(key);});});showWarnings();function changeAnnotation(data){var item=Ox.getObjectById(self.options.items,data.id);if(item.value!=data.value){item.value=data.value;that.triggerEvent('change',item);}}
|
||
|
|
function crossesPoint(){var positions=Ox.sort([self.position,self.options.position]);return self.points.some(function(point){return point>=positions[0]&&point<=positions[1];});}
|
||
|
|
function dragstart(){if(self.options.showWidget){Ox.$body.addClass('OxDragging');self.drag={startSize:self.options.widgetSize};}}
|
||
|
|
function drag(e){if(self.options.showWidget){self.options.widgetSize=Ox.limit(self.drag.startSize+e.clientDY,128,384);if(self.options.widgetSize>=248&&self.options.widgetSize<=264){self.options.widgetSize=256;}
|
||
|
|
self.$resizebar.css({top:self.options.widgetSize+'px'});self.$inner.css({height:self.options.widgetSize+'px'});self.$widget.options({height:self.options.widgetSize});}}
|
||
|
|
function dragend(e){if(self.options.showWidget){Ox.$body.removeClass('OxDragging');self.options.type=='event'?self.$calendar.resizeCalendar():self.$map.resizeMap();that.triggerEvent('resizewidget',{size:self.options.widgetSize});}}
|
||
|
|
function getAnnotations(){var annotations=Ox.filter(self.options.items,function(item){return self.editing&&item.id==self.options.selected||((self.options.range=='all'||(self.options.range=='selection'&&item['in']<=self.options.out&&item.out>=self.options['in'])||(self.options.range=='position'&&item['in']<=self.options.position&&item.out>=self.options.position))&&(self.options.languages=='all'||self.options.languages.some(function(language){return item.languages&&item.languages.indexOf(language)>-1;}))&&(self.options.users=='all'||self.options.users.indexOf(item.user)>-1));}).map(function(item){return Ox.extend(item,{group:self.options.highlightAnnotations=='none'?'':self.options.highlightAnnotations=='value'?item.value:item['in']+'-'+item.out});});return annotations;}
|
||
|
|
function getEvents(){var events=[];self.annotations.filter(function(item){return isDefined(item);}).forEach(function(item){var index=Ox.getIndexById(events,item.event.id);if(index==-1){events.push(Ox.extend({annotationIds:[item.id]},item.event))}else{events[index].annotationIds.push(item.id);}});return events;}
|
||
|
|
function getPlaceholder(){return'No '+self.options.title.toLowerCase()+(self.options.range=='position'?' at current position':self.options.range=='selection'?' in current selection':'');}
|
||
|
|
function getPlaces(){var places=[];self.annotations.filter(function(item){return isDefined(item);}).forEach(function(item){var index=Ox.getIndexById(places,item.place.id);if(index==-1){places.push(Ox.extend({annotationIds:[item.id]},item.place));}else{places[index].annotationIds.push(item.id);}});return places;}
|
||
|
|
function getPoints(){return Ox.unique(Ox.flatten(self.options.items.map(function(item){return[item['in'],item.out];})));}
|
||
|
|
function getSort(){return({duration:['-duration','+in',self.options.type=='text'?'+created':'+value'],position:['+in','+duration',self.options.type=='text'?'+created':'+value'],text:['+value','+in','+duration'],created:['+created','+in','+duration','+value']})[self.options.sort];}
|
||
|
|
function isDefined(item){return!!item[self.options.type]&&!!item[self.options.type].type;}
|
||
|
|
function removeAnnotation(data){var item;self.editing=false;if(self.widget){item=Ox.getObjectById(self.options.items,data.id);if(isDefined(item)){if(self.options.type=='event'){self.$calendar.options({selected:''}).options({events:getEvents()});}else{self.$map.options({selected:''}).options({places:getPlaces()});}}}
|
||
|
|
showWarnings();that.triggerEvent('remove',{id:data.id});}
|
||
|
|
function selectAnnotation(data){if(self.loaded){var item=Ox.getObjectById(self.options.items,data.id);self.options.selected=item?data.id:'';if(self.widget){if(self.options.type=='event'){self.$calendar.options({selected:item&&isDefined(item)?item.event.id:''}).panToEvent();}else{self.$map.options({selected:item&&isDefined(item)?item.place.id:''}).panToPlace();}}
|
||
|
|
that.triggerEvent('select',Ox.extend(data,item?{'in':item['in'],out:item.out,layer:self.options.id}:{}));}}
|
||
|
|
function showWarnings(){if(self.widget&&self.options.items.length){self.$annotations.find('.OxEditableElement').each(function(){var $element=$(this);if($element.data('id')&&!isDefined(Ox.getObjectById(self.options.items,$element.data('id')))){$element.addClass('OxWarning');}else{$element.removeClass('OxWarning');}});}}
|
||
|
|
function submitAnnotation(data){var item=Ox.getObjectById(self.options.items,data.id);if(item){item.value=data.value;self.editing=false;self.options.sort=='text'&&self.$annotations.reloadItems();that.triggerEvent('submit',item);}}
|
||
|
|
function toggleLayer(){self.options.collapsed=!self.options.collapsed;if(!self.options.collapsed&&self.options.type=='place'&&self.options.showWidget){self.$map.resizeMap();}
|
||
|
|
if(self.options.collapsed){self.editing&&that.blurItem();self.$annotations.loseFocus();}
|
||
|
|
that.triggerEvent('togglelayer',{collapsed:self.options.collapsed});}
|
||
|
|
function toggleWidget(){self.options.showWidget=!self.options.showWidget;self.widgetSize=self.options.showWidget*self.options.widgetSize;self.$resizebar.animate({top:self.widgetSize+'px'},250);self.$inner.animate({height:self.widgetSize+'px'},250);self.$widget.animate({height:self.widgetSize+'px'},250,function(){self.$widget.options({height:self.widgetSize});});that.triggerEvent('togglewidget',{collapsed:!self.options.showWidget});}
|
||
|
|
function updateAnnotations(){self.annotations=getAnnotations();self.$annotations.options({highlightGroup:self.options.highlightAnnotations!='none'});self.$annotations.options({items:self.annotations});self.$annotations.updateItemGroup();showWarnings();if(self.widget){self.options.type=='event'?self.$calendar.options({events:getEvents()}):self.$map.options({places:getPlaces()});}}
|
||
|
|
that.addItem=function(item){var pos=0;self.options.items.splice(pos,0,item);self.$panel.options({collapsed:false});self.$annotations.addItem(pos,Ox.extend(item,{group:item['in']+'-'+item.out})).options({selected:item.id}).editItem();showWarnings();self.points=getPoints();return that;};that.blurItem=function(){self.editing=false;self.$annotations.blurItem();return that;};that.editItem=function(){self.editing=true;self.$panel.options({collapsed:false});self.$annotations.editItem();return that;};that.gainFocus=function(){self.$annotations.gainFocus();return that;};that.getCurrentAnnotations=function(){return getAnnotations();};that.removeItem=function(){self.$annotations.removeItem();};that.selectItem=function(position){if(self.annotations.length){that.options({selected:self.annotations[position==0?0:self.annotations.length-1].id});self.$annotations.gainFocus();}else{that.triggerEvent(position==0?'selectnext':'selectprevious');}};that.updateItem=function(id,data){Ox.Log('AF','updateItem',id,data)
|
||
|
|
var item=Ox.getObjectById(self.options.items,id);Ox.forEach(data,function(value,key){item[key]=value;});item.group=self.options.highlightAnnotations=='none'?'':self.options.highlightAnnotations=='value'?item.value:item['in']+'-'+item.out;self.$annotations.updateItemGroup();if(id!=item.id){self.$annotations.find('.OxEditableElement').each(function(){var $element=$(this);if($element.data('id')==id){$element.data({id:item.id});}});self.options.selected=item.id;}
|
||
|
|
if(self.options.type=='entity'){if(data.value){self.$annotations.updateItem(data.value);}else{that.removeItem();}}
|
||
|
|
if(self.$widget){if(isDefined(item)){self.$widget.options(self.options.type=='event'?{events:getEvents()}:{places:getPlaces()}).options({selected:item[self.options.type].id});self.$widget[self.options.type=='event'?'panToEvent':'panToPlace']();}else{self.$widget.options({selected:''}).options(self.options.type=='event'?{events:getEvents()}:{places:getPlaces()});}}
|
||
|
|
if(!self.editing&&id!=item.id){self.$annotations.options({selected:self.options.selected});}
|
||
|
|
showWarnings();return that;};return that;};'use strict';Ox.AnnotationPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({calendarSize:256,clickLink:null,editable:false,enableExport:false,enableImport:false,highlight:'',highlightAnnotations:'none',highlightLayer:'*',itemName:{singular:'video',plural:'videos'},layers:[],mapSize:256,range:'all',selected:'',separator:';',showCalendar:false,showFind:false,showLayers:{},showMap:false,showUsers:false,sort:'position',width:256}).options(options||{}).update(function(key,value){if(key=='highlight'||key=='highlightLayer'){self.$folder.forEach(function($folder){$folder.options({highlight:getHighlight($folder.options('id'))});});}else if(key=='highlightAnnotations'){self.$folder.forEach(function($folder){$folder.options({highlightAnnotations:self.options.highlightAnnotations});});}else if(['in','out','position'].indexOf(key)>-1){self.$folder.forEach(function($folder){$folder.options(key,value);});}else if(key=='layers'){renderFolders();}else if(key=='selected'){self.options.editable&&updateEditMenu();if(value){var folder=getFolder(value)
|
||
|
|
folder&&folder.options({selected:value});}else{self.$folder.forEach(function($folder){$folder.options({selected:''});});}}else if(key=='showLayers'){self.options.layers.forEach(function(layer,index){self.$folder[index].options({collapsed:!self.options.showLayers[layer.id]});});}else if(key=='width'){self.$folder.forEach(function($folder){$folder.options({width:self.options.width-Ox.UI.SCROLLBAR_SIZE});});}}).addClass('OxAnnotationPanel');self.editing=false;self.languages=getLanguages();self.enabledLanguages=self.languages.map(function(language){return language.code;});if(self.options.showUsers){self.users=getUsers();self.enabledUsers=self.users;}else{self.enabledUsers='all';}
|
||
|
|
self.$menubar=Ox.Bar({size:16}).addClass('OxVideoPlayer').bindEvent({doubleclick:function(e){if($(e.target).is('.OxBar')){self.$folders.animate({scrollTop:0},250);}}});self.$folders=Ox.Element().css({overflowY:'scroll'});self.$folder=[];renderFolders();renderOptionsMenu();self.options.editable&&renderEditMenu();that.setElement(self.$panel=Ox.SplitPanel({elements:[{element:self.$menubar,size:16},{element:self.$folders}],orientation:'vertical'}));function getAnnotation(annotationId){var found=false,annotation;Ox.forEach(self.options.layers,function(layer,i){Ox.forEach(layer.items,function(item){if(item.id==annotationId){annotation=item;found=true;return false;}});if(found){return false;}});return annotation;}
|
||
|
|
function getFolder(annotationId){var found=false,folder;Ox.forEach(self.options.layers,function(layer,i){Ox.forEach(layer.items,function(item){if(item.id==annotationId){folder=self.$folder[i];found=true;return false;}});if(found){return false;}});return folder;}
|
||
|
|
function getHighlight(layer){return Ox.contains(['*',layer],self.options.highlightLayer)?self.options.highlight:'';}
|
||
|
|
function getLanguages(){return Ox.sortBy(Ox.map(Ox.unique(Ox.flatten(self.options.layers.map(function(layer){return layer.items.map(function(item){return item.languages;});}))),function(language){return{code:language,name:Ox.getLanguageNameByCode(language)};}),'name');}
|
||
|
|
function getUsers(){return Ox.sort(Ox.unique(Ox.flatten(self.options.layers.map(function(layer){return layer.items.map(function(item){return item.user;});}))));}
|
||
|
|
function insert(data){var id=data.id;Ox.InsertHTMLDialog(Ox.extend({callback:function(data){Ox.$elements[id].value(data.value).focusInput(data.position).triggerEvent('change',data.value);}},data)).open();}
|
||
|
|
function renderEditMenu(){var annotation,annotationTitle,folder,hasManualCalendarOrMap,isDefined,isEditable,isEntity,isEvent,isEventOrPlace,isPlace,isString,key,manageTitle,type,value;if(self.options.selected){annotation=getAnnotation(self.options.selected);folder=getFolder(self.options.selected);if(annotation&&folder){key=folder.options('id');type=folder.options('type');value=annotation.entity?annotation.entity.name:annotation.value;isEditable=annotation.editable;isEntity=!!annotation.entity;isEvent=type=='event';isPlace=type=='place';isEventOrPlace=isEvent||isPlace;isString=type!='text';isDefined=isEventOrPlace&&!!annotation[type]&&!!annotation[type].type;annotationTitle=folder.options('item')+': "'+Ox.stripTags(value)+'"';}}
|
||
|
|
hasManualCalendarOrMap=self.options.layers.some(function(layer){return layer.type=='event'||layer.type=='place';});manageTitle=Ox._((isDefined?'Edit':'Define')+' '
|
||
|
|
+(isPlace?'Place':isEvent?'Event':'Place or Event')+'...');self.$editMenuButton&&self.$editMenuButton.remove();self.$editMenuButton=Ox.MenuButton({items:[].concat(self.options.layers.map(function(layer,i){return{id:'add'+layer.id,disabled:!layer.editable,title:Ox._('Add {0}',[layer.item]),keyboard:i<9?i+1+'':null}}),[{},{id:'deselect',title:Ox._('Deselect Annotation'),disabled:!self.options.selected||self.editing,keyboard:'escape'},{id:'edit',title:Ox._('Edit Annotation'),disabled:!self.options.selected||!isEditable||self.editing,keyboard:'return'},{id:'delete',title:Ox._('Delete Annotation'),disabled:!self.options.selected||!isEditable,keyboard:'delete'},{},{id:'insert',title:Ox._('Insert...'),disabled:isString||!self.editing,keyboard:'control i'},{id:'undo',title:Ox._('Undo Changes'),disabled:!self.editing,keyboard:'escape'},{id:'save',title:Ox._('Save Changes'),disabled:!self.editing,keyboard:isString?'return':'shift return'},],hasManualCalendarOrMap?[{},{id:'manage',title:manageTitle,disabled:!self.options.selected||!isEventOrPlace},]:[],isString?[{},{id:'annotation',title:annotationTitle,disabled:true}].concat(isEntity?[{id:'showentityinfo',title:Ox._('Show Entity Info'),keyboard:'e'}]:[],[{id:'findannotations',title:Ox._('Find in All {0}',[Ox.toTitleCase(self.options.itemName.plural)])},{id:'find',title:Ox._('Find in This {0}',[Ox.toTitleCase(self.options.itemName.singular)])}]):[],[{},{id:'import',title:Ox._('Import Annotations...'),disabled:!self.options.enableImport},{id:'export',title:Ox._('Export Annotations...'),disabled:!self.options.enableExport},]),maxWidth:256,style:'square',title:'edit',tooltip:Ox._('Editing Options'),type:'image'}).css({float:'right'}).bindEvent({click:function(data){if(Ox.startsWith(data.id,'add')){that.triggerEvent('add',{layer:data.id.slice(3),value:''});}else if(data.id=='delete'){getFolder(self.options.selected).removeItem();}else if(data.id=='deselect'){getFolder(self.options.selected).options({selected:''});}else if(data.id=='edit'){getFolder(self.options.selected).editItem();}else if(data.id=='export'){that.triggerEvent('exportannotations');}else if(data.id=='find'){that.triggerEvent('find',{value:value});}else if(data.id=='findannotations'){that.triggerEvent('findannotations',{key:key,value:value});}else if(data.id=='import'){that.triggerEvent('importannotations');}else if(data.id=='insert'){var id=$('.OxEditableElement div.OxInput').data('oxid'),element=$('.OxEditableElement textarea.OxInput')[0];insert({end:element.selectionEnd,id:id,selection:element.value.slice(element.selectionStart,element.selectionEnd),start:element.selectionStart,value:element.value});}else if(data.id=='manage'){that.triggerEvent('define',{id:getAnnotation(self.options.selected)[type].id,type:type});}else if(data.id=='save'){}else if(data.id=='showentityinfo'){that.triggerEvent('showentityinfo',annotation.entity);}else if(data.id=='undo'){}},hide:function(){var folder=self.options.selected?getFolder(self.options.selected):null;folder?folder.gainFocus():that.triggerEvent('focus');}}).appendTo(self.$menubar);}
|
||
|
|
function renderFolder(layer){var index=Ox.getIndexById(self.options.layers,layer.id),item=Ox.getObjectById(layer.items,self.options.selected),selected=item?item.id:'';self.$folder[index]=Ox.AnnotationFolder(Ox.extend({clickLink:self.options.clickLink,collapsed:!self.options.showLayers[layer.id],editable:self.options.editable,highlight:getHighlight(layer.id),highlightAnnotations:self.options.highlightAnnotations,id:layer.id,'in':self.options['in'],keyboard:index<9?index+1+'':'',out:self.options.out,position:self.options.position,range:self.options.range,selected:selected,separator:self.options.separator,sort:self.options.sort,width:self.options.width-Ox.UI.SCROLLBAR_SIZE},layer,layer.type=='event'?{showWidget:self.options.showCalendar,widgetSize:self.options.calendarSize}:layer.type=='place'?{showWidget:self.options.showMap,widgetSize:self.options.mapSize}:{})).bindEvent({add:function(data){that.triggerEvent('add',Ox.extend({layer:layer.id},data));},blur:function(){that.triggerEvent('blur');},change:function(data){that.triggerEvent('change',Ox.extend({layer:layer.id},data));},edit:function(){self.editing=true;renderEditMenu();that.triggerEvent('edit');},info:function(data){that.triggerEvent('info',{layer:layer.id});},insert:insert,key_e:function(data){var entity=getAnnotation(self.options.selected).entity;entity&&that.triggerEvent('showentityinfo',entity);},open:function(){that.triggerEvent('open');},remove:function(data){that.triggerEvent('remove',Ox.extend({layer:layer.id},data));},resizewidget:function(data){that.triggerEvent('resize'+(layer.type=='event'?'calendar':'map'),data);},select:function(data){selectAnnotation(data,index);},selectnext:function(){selectNext(layer.id,1);},selectprevious:function(){selectNext(layer.id,-1);},selectnone:selectNone,submit:function(data){that.triggerEvent('submit',Ox.extend({layer:layer.id},data));},togglelayer:function(data){self.options.showLayers[layer.id]=!data.collapsed;that.triggerEvent('togglelayer',Ox.extend({layer:layer.id},data));},togglewidget:function(data){that.triggerEvent('toggle'+(layer.type=='event'?'calendar':'map'),data);}}).appendTo(self.$folders);['0','1','2','3','4','5','6','7','8','9','b','backslash','closebracket','comma','dot','equal','f','g','h','i','minus','n','o','openbracket','p','shift_0','shift_equal','shift_g','shift_i','shift_minus','shift_o','slash','space','control_c','control_v',].forEach(function(key){key='key.'+key;self.$folder[index].bindEvent(key,function(){that.triggerEvent(key);});});}
|
||
|
|
function renderFolders(){self.$folders.empty();self.options.layers.forEach(function(layer,index){renderFolder(layer);});}
|
||
|
|
function renderOptionsMenu(){self.$optionsMenuButton&&self.$optionsMenuButton.remove();self.$optionsMenuButton=Ox.MenuButton({items:[].concat([{id:'showannotations',title:Ox._('Show Annotations'),disabled:true},{group:'range',min:1,max:1,items:[{id:'all',title:Ox._('All'),checked:self.options.range=='all'},{id:'selection',title:Ox._('In Current Selection'),checked:self.options.range=='selection'},{id:'position',title:Ox._('At Current Position'),checked:self.options.range=='position'}]},{},{id:'sortannotations',title:Ox._('Sort Annotations'),disabled:true},{group:'sort',min:1,max:1,items:[{id:'position',title:Ox._('By Position'),checked:self.options.sort=='position'},{id:'duration',title:Ox._('By Duration'),checked:self.options.sort=='duration'},{id:'text',title:Ox._('By Text'),checked:self.options.sort=='text'},{id:'created',title:Ox._('By Creation Time'),checked:self.options.sort=='created'}]}],self.options.showFind?[{},{id:'results',title:Ox._('Find Annotations'),disabled:true},{group:'results',max:1,items:[{id:'result_*',title:Ox._('All'),checked:self.options.highlightLayer=='*'}].concat(self.options.layers.map(function(result){return{id:'result_'+result.id,title:result.title,checked:result.id==self.options.highlightLayer};}))}]:[],self.options.editable?[{},{id:'highlightannotations',title:Ox._('Highlight Annotations'),disabled:true},{group:'highlight',max:1,items:[{id:'none',title:Ox._('None'),checked:self.options.highlightAnnotations=='none'},{id:'value',title:Ox._('Same Value'),checked:self.options.highlightAnnotations=='value'},{id:'selection',title:Ox._('Same Selection'),checked:self.options.highlightAnnotations=='selection'}]}]:[],self.languages.length>1?[{},{id:'languages',title:Ox._('Show Languages'),disabled:true},{group:'languages',min:1,max:-1,items:self.languages.map(function(language){return{id:language.code,title:Ox._(language.name),checked:Ox.contains(self.enabledLanguages,language.code)};})}]:[],self.options.showUsers&&self.users.length?[{},{id:'users',title:Ox._('Show Users'),disabled:true},{group:'users',min:0,max:-1,items:self.users.map(function(user){return{id:'user_'+user,title:Ox.encodeHTMLEntities(user),checked:self.enabledUsers=='all'||Ox.contains(self.enabledUsers,user)};})}]:[],self.options.showUsers&&self.users.length>1?[{},{id:'allusers',title:Ox._('Show All Users')},{id:'nousers',title:Ox._('Show No Users')}]:[]),style:'square',title:'set',tooltip:Ox._('Options'),type:'image'}).css({float:'left'}).bindEvent({change:function(data){var set={};if(data.id=='languages'){self.enabledLanguages=data.checked.map(function(checked){return checked.id;});self.$folder.forEach(function($folder){$folder.options({languages:self.enabledLanguages});});}else if(data.id=='users'){self.enabledUsers=data.checked.map(function(checked){return checked.id.slice(5);});self.$folder.forEach(function($folder){$folder.options({users:self.enabledUsers});});}else if(data.id=='results'){var layer=data.checked[0].id.split('_').pop()
|
||
|
|
that.options({highlightLayer:layer});that.triggerEvent('highlightlayer',self.options.highlightLayer);}else if(data.id=='highlight'){var value=data.checked[0].id
|
||
|
|
that.options({highlightAnnotations:value});that.triggerEvent('highlightannotations',self.options.highlightAnnotations);}else{self.options[data.id]=data.checked[0].id;set[data.id]=self.options[data.id];self.$folder.forEach(function($folder){$folder.options(set);});that.triggerEvent('annotations'+data.id,set);}},click:function(data){if(data.id=='allusers'){self.enabledUsers=Ox.clone(self.users);self.users.forEach(function(user){self.$optionsMenuButton.checkItem('user_'+user);});self.$folder.forEach(function($folder){$folder.options({users:self.enabledUsers});});}else if(data.id=='nousers'){self.enabledUsers=[];self.users.forEach(function(user){self.$optionsMenuButton.uncheckItem('user_'+user);});self.$folder.forEach(function($folder){$folder.options({users:self.enabledUsers});});}},hide:function(){var folder=self.options.selected?getFolder(self.options.selected):null;folder?folder.gainFocus():that.triggerEvent('focus');}}).appendTo(self.$menubar);}
|
||
|
|
function scrollToSelected(type){var $item=that.find('.OxEditableElement.OxSelected'),itemHeight=$item.height()+(type=='text'?8:0),itemTop=($item.offset()||{}).top,itemBottom=itemTop+itemHeight,height=self.$folders.height(),scrollTop=self.$folders.scrollTop(),top=self.$folders.offset().top;if(itemTop<top||itemBottom>top+height){if(itemTop<top){scrollTop+=itemTop-top;}else{scrollTop+=itemBottom-top-height;}
|
||
|
|
self.$folders.animate({scrollTop:scrollTop+'px'},0);}}
|
||
|
|
function selectAnnotation(data,index){if(data.id){Ox.forEach(self.$folder,function($folder,i){if(i!=index&&$folder.options('selected')){self.deselecting=true;$folder.options({selected:''});self.deselecting=false;return false;}});scrollToSelected(self.options.layers[index].type);}
|
||
|
|
if(!self.deselecting){self.options.selected=data.id;self.options.editable&&renderEditMenu();that.triggerEvent('select',data);}}
|
||
|
|
function selectNone(){if(self.options.selected){getFolder(self.options.selected).options({selected:''});}}
|
||
|
|
function selectNext(layer,direction){var index=Ox.mod(Ox.getIndexById(self.options.layers,layer)+direction,self.options.layers.length);self.$folder[index].selectItem(direction==1?0:-1);}
|
||
|
|
function updateEditMenu(){var action=self.options.selected?'enableItem':'disableItem';self.$editMenuButton[action]('edit');self.$editMenuButton[action]('delete');}
|
||
|
|
function updateLanguages(){var languages=self.languages,enabledLanguages=self.enabledLanguages;self.languages=getLanguages();self.enabledLanguages=self.languages.filter(function(language){return Ox.contains(enabledLanguages,language)||!Ox.contains(languages,language)||self.languages.length==1;}).map(function(language){return language.code;});if(self.languages.length==1&&!Ox.contains(enabledLanguages,self.languages[0].code)){self.$folder.forEach(function($folder){$folder.options({languages:self.enabledLanguages});});}}
|
||
|
|
that.addItem=function(layer,item){var i=Ox.getIndexById(self.options.layers,layer);self.$folder[i].addItem(item);updateLanguages();self.users=getUsers();if(self.enabledUsers!='all'&&self.enabledUsers.indexOf(item.user)==-1){self.enabledUsers.push(item.user);self.$folder[i].options({users:self.enabledUsers});}
|
||
|
|
renderOptionsMenu();renderEditMenu();return that;};that.addLayer=function(layer,index){index=index||self.options.layers.length;self.options.layers.splice(index,0,layer);renderFolders();return that;};that.blurItem=function(){self.editing=false;var $folder=getFolder(self.options.selected)
|
||
|
|
if($folder){$folder.blurItem();}
|
||
|
|
renderEditMenu();return that;};that.editItem=function(){self.editing=true;getFolder(self.options.selected).editItem();renderEditMenu();return that;};that.getCurrentAnnotations=function(){var annotations={};self.options.layers.forEach(function(layer){annotations[layer.id]=self.$folder[Ox.getIndexById(self.options.layers,layer.id)].getCurrentAnnotations();});return annotations;};that.removeItem=function(remove){if(remove){getFolder(self.options.selected).removeItem();}else{self.options.selected='';updateLanguages();self.users=getUsers();renderOptionsMenu();renderEditMenu();}
|
||
|
|
return that;};that.removeLayer=function(id){var $folder=getFolder(self.options.selected),index=Ox.getIndexById(self.options.layers,id);if(self.$folder[index]==$folder){$folder.blurItem();}
|
||
|
|
self.options.layers.splice(index,1);renderFolders();return that;};that.updateItem=function(id,item){self.options.selected=item.id;var $folder=getFolder(id);if($folder){$folder.updateItem(id,item);}
|
||
|
|
updateLanguages();renderOptionsMenu();renderEditMenu();return that;};that.updateLayer=function(id,items){var $folder=getFolder(self.options.selected),index=Ox.getIndexById(self.options.layers,id);if(self.$folder[index]==$folder){$folder.blurItem();}
|
||
|
|
self.options.layers[index].items=items;self.$folder[index].replaceWith(self.$folder[index]=renderFolder(self.options.layers[index]));return that;};return that;};'use strict';Ox.BlockVideoTimeline=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({duration:0,find:'',getImageURL:null,'in':0,out:0,position:0,results:[],showPointMarkers:false,state:'default',subtitles:[],type:'',width:0}).options(options||{}).update({'in':function(){self.options.showPointMarkers&&setPoint('in');},out:function(){self.options.showPointMarkers&&setPoint('out');},position:setPositionMarker,results:setResults,subtitles:setSubtitles,state:setState,type:setType,width:setWidth}).addClass('OxBlockVideoTimeline').css({position:'absolute'}).on({mousedown:mousedown,mouseleave:mouseleave,mousemove:mousemove}).bindEvent({doubleclick:doubleclick,drag:function(data){mousedown(data);},touchmove:mousedown,touchstart:mousedown});self.$images=[];self.$interfaces=[];self.$lines=[];self.$tooltip=Ox.Tooltip({animate:false}).css({textAlign:'center'});self.height=16;self.lines=getLines();self.margin=8;setCSS();self.$image=getImage();Ox.loop(self.lines,function(i){addLine(i);});self.$positionMarker=Ox.$('<img>').attr({src:Ox.UI.getImageURL('markerPosition')}).addClass('OxMarkerPosition').appendTo(that);setPositionMarker();if(self.options.showPointMarkers){self.$pointMarker={};['in','out'].forEach(function(point){var titlecase=Ox.toTitleCase(point);self.$pointMarker[point]=Ox.$('<img>').addClass('OxMarkerPoint'+titlecase).attr({src:Ox.UI.getImageURL('marker'+titlecase)}).appendTo(that);setPointMarker(point);});}
|
||
|
|
function addLine(i){self.$lines[i]=Ox.$('<div>').css({position:'absolute',left:self.margin/2+'px',top:i*(self.height+self.margin)+'px',width:self.options.width+'px',height:'24px',overflow:'hidden'}).appendTo(that);self.$images[i]=self.$image.clone().css({position:'absolute',marginLeft:-i*self.options.width+'px'}).appendTo(self.$lines[i]);self.$interfaces[i]=Ox.$('<div>').addClass('OxInterface OxTarget OxSpecialTarget').css({top:'2px',width:Math.round(self.options.duration)+'px',height:'20px',marginLeft:-i*self.options.width+'px'}).appendTo(self.$lines[i]);}
|
||
|
|
function doubleclick(e){var position;if($(e.target).is('.OxInterface')){position=getPosition(e);if(self.options.state=='selected'&&position>=self.options['in']&&position<=self.options.out){that.triggerEvent('edit');}else if(self.options.state!='editing'){that.triggerEvent('select');}}}
|
||
|
|
function getImage(){return Ox.SmallVideoTimelineImage({duration:self.options.duration,editing:self.options.editing,imageURL:self.options.getImageURL,'in':self.options['in'],mode:'editor',out:self.options.out,results:self.options.results,state:self.options.state,subtitles:Ox.clone(self.options.subtitles,true),type:self.options.type,width:Math.round(self.options.duration)}).bindEvent({loaded:updateTimelines});}
|
||
|
|
function getLines(){return Math.ceil(self.options.duration/self.options.width);}
|
||
|
|
function getPosition(e){return e.offsetX?e.offsetX:e.clientX-$(e.target).offset().left;}
|
||
|
|
function getSubtitle(position){var subtitle='';Ox.forEach(self.options.subtitles,function(v){if(v['in']<=position&&v.out>position){subtitle=v;return false;}});return subtitle;}
|
||
|
|
function getTooltip(e){}
|
||
|
|
function mousedown(e){if($(e.target).is('.OxInterface')){self.options.position=getPosition(e);setPositionMarker();if(!self.triggered){that.triggerEvent('position',{position:self.options.position});self.triggered=true;setTimeout(function(){self.triggered=false;},250);}}}
|
||
|
|
function mouseleave(){self.$tooltip.hide();}
|
||
|
|
function mousemove(e){var position,subtitle;if($(e.target).is('.OxInterface')){position=getPosition(e);subtitle=getSubtitle(position);self.$tooltip.options({title:subtitle?'<span class=\'OxBright\'>'+Ox.highlight(subtitle.text,self.options.find,'OxHighlight',true).replace(/\n/g,' ')+'</span><br/>'
|
||
|
|
+Ox.formatDuration(subtitle['in'],3)+' - '
|
||
|
|
+Ox.formatDuration(subtitle['out'],3):Ox.formatDuration(position)}).show(e.clientX,e.clientY);}else{self.$tooltip.hide();}}
|
||
|
|
function setCSS(){that.css({width:(self.options.width+self.margin)+'px',height:((self.height+self.margin)*self.lines)+4+'px'});}
|
||
|
|
function setPoint(point){setPointMarker(point);self.$image.options(point,self.options[point]);updateTimelines();}
|
||
|
|
function setPointMarker(point){var position=Math.round(self.options[point]);self.$pointMarker[point].css({left:(position%self.options.width)+'px',top:(Math.floor(position/self.options.width)*(self.height+self.margin)+15)+'px'});}
|
||
|
|
function setPositionMarker(){var position=Math.round(self.options.position);self.$positionMarker.css({left:(position%self.options.width)-1+'px',top:(Math.floor(position/self.options.width)*(self.height+self.margin)+2)+'px'});}
|
||
|
|
function setResults(){self.$image.options({results:self.options.results});updateTimelines();}
|
||
|
|
function setState(){self.$image.options({state:self.options.state});updateTimelines();}
|
||
|
|
function setSubtitles(){self.$image.options({subtitles:Ox.clone(self.options.subtitles,true)});updateTimelines();}
|
||
|
|
function setType(){self.$image=getImage();self.$images.forEach(function($image,i){self.$images[i].replaceWith(self.$images[i]=self.$image.clone().css({position:'absolute',marginLeft:-i*self.options.width+'px'}));});}
|
||
|
|
function setWidth(){self.lines=getLines();setCSS();Ox.loop(self.lines,function(i){if(self.$lines[i]){self.$lines[i].css({width:self.options.width+'px'});self.$images[i].css({marginLeft:(-i*self.options.width)+'px'});self.$interfaces[i].css({marginLeft:(-i*self.options.width)+'px'});}else{addLine(i);}});while(self.$lines.length>self.lines){self.$lines[self.$lines.length-1].remove();self.$lines.pop();self.$images.pop();}
|
||
|
|
setPositionMarker();if(self.options.showPointMarkers){setPointMarker('in');setPointMarker('out');}}
|
||
|
|
function updateTimelines(){self.$lines.forEach(function($line,i){$($line.children()[0]).replaceWith(self.$images[i]=self.$image.clone().css({position:'absolute',marginLeft:(-i*self.options.width)+'px'}));});}
|
||
|
|
return that;};'use strict';Ox.ClipPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({annotationsCalendarSize:256,annotationsMapSize:256,annotationsRange:'all',annotationsSort:'position',clipRatio:16/9,clips:[],clickLink:null,duration:0,editable:false,formatTitle:function(){return Ox.last(arguments);},getClipImageURL:null,'in':0,layers:[],out:0,position:0,selected:[],sort:[],sortOptions:[],showAnnotationsCalendar:false,showAnnotationsMap:false,showLayers:{},showUsers:false,view:'list',width:0}).options(options||{}).update({clips:function(){var action=self.options.clips.length&&self.options.view!='annotations'?'enableItem':'disableItem';self.$list.options({items:Ox.clone(self.options.clips),sort:getListSort(),sortable:isSortable()});self.$menu[action]('selectclip');self.$menu[action]('splitclip');updateStatus();},duration:updateStatus,height:function(){self.$list.size();},position:function(){if(self.options.view=='annotations'){self.$list.options({position:self.options.position});}},selected:selectClips,showLayers:function(){if(self.options.view=='annotations'){self.$list.options({showLayers:Ox.clone(self.options.showLayers)});}},sort:function(){updateSortElement();self.$list.options({sort:getListSort(),sortable:isSortable(),});},view:function(){updateView();self.$menu.checkItem(self.options.view);},width:function(){self.$list.options({width:self.options.width});}}).bindEvent({resize:function(data){self.$sortSelect.options({width:getSortSelectWidth(data.size)});self.$list.size();}});self.columns=[].concat([{align:'right',id:'index',format:function(value){return value+1;},operator:'+',title:Ox._('Index'),visible:false,width:60},{format:function(value,data){return data.annotation?data.annotation:data.item;},id:'id',operator:'+',sort:function(value,data){return data.sort;},title:Ox._('ID'),unique:true,width:60},{addable:false,id:'item',operator:'+',sort:function(value,data){return data.sort;}},{format:self.options.formatTitle,id:'title',operator:'+',sort:function(value,data){return data.sort;},title:Ox._('Title'),visible:true,width:120},{align:'right',editable:isEditable,format:function(value,data){return(isEditable(data)?['','']:['<span class="OxLight">','</span>']).join(Ox.formatDuration(value,3));},id:'in',operator:'+',sort:function(value,data){return data.sort;},title:Ox._('In'),visible:true,width:90},{align:'right',editable:isEditable,format:function(value,data){return(isEditable(data)?['','']:['<span class="OxLight">','</span>']).join(Ox.formatDuration(value,3));},id:'out',title:Ox._('Out'),visible:true,width:90},{align:'right',editable:isEditable,format:function(value,data){return(isEditable(data)?['','']:['<span class="OxLight">','</span>']).join(Ox.formatDuration(value,3));},id:'duration',operator:'+',sort:function(value,data){return data.sort;},title:Ox._('Duration'),visible:true,width:90},],hasVolume()?[{align:'right',editable:self.options.editable,format:function(value,data){return Ox.formatNumber(value,2);},id:'volume',operator:'+',sort:function(value,data){return data.sort;},title:Ox._('Volume'),visible:false,width:45},]:[],[{addable:false,id:'sort',operator:'+',visible:false}]);self.$menubar=Ox.Bar({size:24}).bindEvent({doubleclick:function(e){if($(e.target).is('.OxBar')){(self.options.view=='list'?self.$list.$body:self.$list).animate({scrollTop:0},250);}}});self.$menu=Ox.MenuButton({items:[{group:'view',min:1,max:1,items:[{id:'list',title:Ox._('View Clips as List'),checked:self.options.view=='list'},{id:'grid',title:Ox._('View Clips as Grid'),checked:self.options.view=='grid'},{id:'annotations',title:Ox._('View Annotations'),checked:self.options.view=='annotations'},]},{},{id:'selectclip',title:'Select Clip at Current Position',keyboard:'\\',disabled:self.options.clips.length==0||self.options.view=='annotations'},{id:'splitclip',title:'Split Clip at Current Position',keyboard:'shift \\',disabled:self.options.clips.length==0||self.options.view=='annotations'},{},{id:'split',title:Ox._('Split Selected Clips at Cuts'),disabled:!self.options.editable||self.options.selected.length==0
|
||
|
|
function getButtonTitle(){return self.options.sort[0].operator=='+'?'up':'down';}
|
||
|
|
function getButtonTooltip(){return Ox._(self.options.sort[0].operator=='+'?'Ascending':'Descending');}
|
||
|
|
function getEditable(ids){return ids.filter(function(id){return isEditable(Ox.getObjectById(self.options.clips,id));});}
|
||
|
|
function getList(){var $list;if(self.options.view=='list'){$list=Ox.TableList({columns:self.columns,columnsMovable:true,columnsRemovable:true,columnsResizable:true,columnsVisible:true,items:Ox.clone(self.options.clips),keys:['director','year','annotation'],pageLength:1000,scrollbarVisible:true,selected:self.options.selected,sort:getListSort(),sortable:isSortable(),unique:'id'});}else if(self.options.view=='grid'){$list=Ox.IconList({draggable:true,fixedRatio:self.options.clipRatio,item:function(data,sort,size){size=size||128;var ratio=data.videoRatio,fixedRatio=self.options.clipRatio,width=ratio>fixedRatio?size:Math.round(size*ratio/fixedRatio),height=Math.round(width/ratio),info,title=self.options.formatTitle(data),url=self.options.getClipImageURL(data.id,width,height);if(['text','position','duration','random'].indexOf(sort[0].key)>-1){info=Ox.formatDuration(data['in'])+' - '
|
||
|
|
+Ox.formatDuration(data.out);}else{info=Ox.formatDuration(data['in'])+' - '
|
||
|
|
+Ox.formatDuration(data.out);}
|
||
|
|
return{height:height,id:data.id,info:info,title:title,url:url,width:width};},items:self.options.clips,keys:['annotation','id','in','out'],orientation:'both',selected:self.options.selected,sort:getListSort(),unique:'id'});}else if(self.options.view=='annotations'){$list=Ox.AnnotationPanel({calendarSize:self.options.annotationsCalendarSize,clickLink:self.options.clickLink,editable:false,layers:self.options.layers,mapSize:self.options.annotationsMapSize,position:self.options.position,range:self.options.annotationsRange,showCalendar:self.options.showAnnotationsCalendar,showLayers:Ox.clone(self.options.showLayers),showMap:self.options.showAnnotationsMap,showUsers:self.options.showUsers,sort:self.options.annotationsSort,width:self.options.width}).bindEvent({select:function(data){that.triggerEvent('selectannotation',data);},open:function(data){}});$list.size=function(){$list.options({width:self.options.width});};return $list;}
|
||
|
|
$list.bindEvent({copy:function(data){that.triggerEvent('copy',data);},copyadd:function(data){that.triggerEvent('copyadd',data);},cut:function(data){if(self.options.editable){that.triggerEvent('cut',data);self.options.selected=[];selectClips();that.triggerEvent('select',{ids:[]});}},cutadd:function(data){if(self.options.editable){that.triggerEvent('cutadd',data);self.options.selected=[];selectClips();that.triggerEvent('select',{ids:[]});}},'delete':function(data){self.options.editable&&that.triggerEvent('delete',data);},key_backslash:function(data){that.selectClip();self.$list.gainFocus();},key_shift_backslash:function(data){splitClip();},move:function(data){data.ids.forEach(function(id,index){self.$list.value(id,'index',index);});that.triggerEvent('move',data);},open:function(data){that.triggerEvent('open',data);},paste:function(){self.options.editable&&that.triggerEvent('paste');},select:function(data){self.options.selected=data.ids;selectClips();that.triggerEvent('select',data);},sort:function(data){if(data.key=='in'){data.key='position';}
|
||
|
|
self.options.sort=[data];updateSortElement();self.$list.options({sortable:isSortable()});that.triggerEvent('sort',self.options.sort);},submit:function(data){var value=self.$list.value(data.id);if(data.key=='volume'){data.value=parseFloat(data.value);if(data.value>=1||Ox.isNaN(data.value)){data.value=1;}else if(data.value<0){data.value=0;}
|
||
|
|
self.$list.value(data.id,data.key,data.value);that.triggerEvent('edit',data);}else{data.value=Ox.parseDuration(data.value);if((data.key=='in'&&data.value<value.out)||(data.key=='out'&&data.value>value['in'])||(data.key=='duration'&&data.value>0)){self.$list.value(data.id,data.key,data.value);if(data.key=='in'){self.$list.value(data.id,'duration',value.out-data.value);}else if(data.key=='out'){self.$list.value(data.id,'duration',data.value-value['in']);}else if(data.key=='duration'){self.$list.value(data.id,'out',value['in']+data.value);}
|
||
|
|
that.triggerEvent('edit',data);}else{self.$list.value(data.id,data.key,value[data.key]);}}}});return $list;}
|
||
|
|
function getListSort(){var sort=[{key:'index',operator:'+'}];if(self.options.sort&&self.options.sort.length){sort[0].operator=self.options.sort[0].operator;sort[0].key=Ox.getObjectById(self.columns,self.options.sort[0].key)?self.options.sort[0].key:'sort';if(self.options.sort[0].key=='position'){sort[0].key='in';}}
|
||
|
|
return sort;}
|
||
|
|
function getSortSelectWidth(width){return Math.min(144,width-52+Ox.UI.SCROLLBAR_SIZE);}
|
||
|
|
function isEditable(data){return self.options.editable&&!data.annotation;}
|
||
|
|
function isSortable(){return self.options.editable&&self.options.sort&&self.options.sort.length&&self.options.sort[0].key=='index'&&self.options.sort[0].operator=='+';}
|
||
|
|
function hasVolume(){return self.options.editable&&self.options.sort&&self.options.sort.length&&self.options.sort[0].key=='index'}
|
||
|
|
function joinClips(){var clips=getEditable(self.options.selected).map(function(id){return Ox.clone(Ox.getObjectById(self.options.clips,id));}),ids=[],join=[],joined;do{joined=false;Ox.forEach(clips,function(outClip){var outPoint=outClip.item+'/'+outClip.out;Ox.forEach(clips,function(inClip,index){var inPoint=inClip.item+'/'+inClip['in'];if(inPoint==outPoint){ids=Ox.unique(ids.concat([outClip.id,inClip.id]));join=Ox.unique(join.concat([outClip.id]));outClip.out=inClip.out;if(Ox.contains(join,inClip.id)){join.splice(join.indexOf(inClip.id),1);}
|
||
|
|
clips.splice(index,1);joined=true;return false;}});if(joined){return false;}});}while(joined);join=join.map(function(id){var clip=Ox.getObjectById(clips,id);return{'in':clip['in'],item:clip.item,out:clip.out};});if(ids.length){that.triggerEvent('join',{ids:ids,join:join});}}
|
||
|
|
function makeClipsEditable(){if(!self.options.editable){return}
|
||
|
|
var clips=self.options.clips.filter(function(clip){return Ox.contains(self.options.selected,clip.id)&&clip.annotation;});clips.forEach(function(clip){self.$list.value(clip.id,{annotation:''});that.triggerEvent('edit',{id:clip.id,key:'annotation',value:''});})}
|
||
|
|
function selectClips(){if(self.options.editable){self.$menu[self.options.selected.length>0?'enableItem':'disableItem']('split');self.$menu[self.options.selected.length>1?'enableItem':'disableItem']('join');self.$menu[self.options.selected.length>0?'enableItem':'disableItem']('makeeditable');}
|
||
|
|
self.$list.options({selected:self.options.selected});}
|
||
|
|
function splitClip(){that.selectClip();var index;Ox.forEach(self.options.clips,function(clip,i){if(clip.position<=self.options.position){index=i}else{return false;}});var clip=self.options.clips[index];if(clip){var position=self.options.position-clip.position+clip['in'];if(position!=clip['in']&&position!=clip['out']){var ids=[clip.id];var split=[{'in':clip['in'],'out':position,'item':clip.item},{'in':position,'out':clip['out'],'item':clip.item}];that.triggerEvent('split',{ids:ids,split:split});}}}
|
||
|
|
function splitClips(){var ids=getEditable(self.options.selected).filter(function(id){var clip=Ox.getObjectById(self.options.clips,id);return clip.cuts.length;}),split=Ox.flatten(ids.map(function(id){var clip=Ox.getObjectById(self.options.clips,id),cuts=[clip['in']].concat(clip.cuts).concat([clip.out]);return Ox.range(0,cuts.length-1).map(function(i){return{'in':cuts[i],item:clip.item,out:cuts[i+1]};});}));if(split.length>ids.length){that.triggerEvent('split',{ids:ids,split:split});}}
|
||
|
|
function updateSortElement(){self.$sortSelect.options({value:self.options.sort[0].key,});self.$orderButton.options({title:getButtonTitle(),tooltip:getButtonTooltip(),});}
|
||
|
|
function updateStatus(){self.$status.html(Ox.toTitleCase(Ox.formatCount(self.options.clips.length,'Clip'))
|
||
|
|
+', '+Ox.formatDuration(self.options.duration,3));}
|
||
|
|
function updateView(){var action=self.options.editable&&self.options.selected.length&&self.options.view!='annotations'?'enableItem':'disableItem';self.$menu[action]('split');self.$menu[self.options.editable&&self.options.selected.length>1&&self.options.view!='annotations'?'enableItem':'disableItem']('join');self.$menu[action]('makeeditable');self.$panel.replaceElement(1,self.$list=getList());}
|
||
|
|
that.getPasteIndex=function(){return self.$list.getPasteIndex();};that.invertSelection=function(){self.$list.invertSelection();};that.selectAll=function(){self.$list.selectAll();};that.selectClip=function(){var index;Ox.forEach(self.options.clips,function(clip,i){Ox.print('CLIP',i,clip.position,clip.duration,self.options.position)
|
||
|
|
if(clip.position<=self.options.position){index=i}else{return false;}});self.options.selected=[self.options.clips[index].id];selectClips();that.triggerEvent('select',{ids:self.options.selected});return that;};that.updateItem=function(id,data){self.options.clips[Ox.getIndexById(self.options.clips,id)]=data;self.$list.value(id,{duration:data.duration,'in':data['in'],out:data.out,sort:data.sort});return that;};return that;};'use strict';Ox.LargeVideoTimeline=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({chapters:[],cuts:[],disabled:false,duration:0,find:'',getImageURL:null,'in':0,matches:[],out:0,position:0,showInToOut:false,subtitles:[],type:'',width:0}).options(options||{}).update({find:setSubtitles,'in':function(){setPointMarker('in');},out:function(){setPointMarker('out');},position:setPosition,subtitles:setSubtitles,type:setType,width:setWidth}).addClass('OxLargeVideoTimeline OxMedia').on({mouseleave:mouseleave,mousemove:mousemove});if(!self.options.disabled){that.bindEvent({anyclick:click,dragstart:dragstart,drag:drag,dragend:dragend,touchstart:dragstart,touchmove:drag,touchend:dragend});}
|
||
|
|
self.$cuts=[];self.$pointMarker={};self.$tiles={};self.$tooltip=Ox.Tooltip({animate:false});self.center=Math.floor(self.options.width/2);self.fps=25;self.height=64;self.isAsync=self.options.getImageURL.length==3;self.tileWidth=1500;self.tiles=self.options.duration*self.fps/self.tileWidth;self.$timeline=$('<div>').css({left:self.center+'px'}).appendTo(that);setTimeout(setSubtitles);if(self.options.showInToOut){if(self.options['in']){$('<div>').addClass('OxOverlay').css({left:0,width:self.options['in']*self.fps+'px',}).appendTo(self.$timeline);}
|
||
|
|
if(self.options.out){$('<div>').addClass('OxOverlay').css({left:self.options.out*self.fps+'px',width:(self.options.duration-self.options.out)*self.fps+'px',}).appendTo(self.$timeline);}}
|
||
|
|
setTimeout(function(){var $cut=$('<img>').addClass('OxCut').attr({src:Ox.UI.getImageURL('markerCut')}),$chapter=$('<img>').addClass('OxChapter').attr({src:Ox.UI.getImageURL('markerChapter')}),chapters=self.options.chapters.slice(1).map(function(chapter){return chapter.position;});Ox.unique(chapters.concat(self.options.cuts)).forEach(function(v,i){self.$cuts[i]=(Ox.contains(chapters,v)?$chapter:$cut).clone().css({left:(v*self.fps)+'px'}).appendTo(self.$timeline);});});self.$markerPosition=$('<img>').addClass('OxMarkerPosition').attr({src:Ox.UI.getImageURL('markerPosition')}).appendTo(that);setMarker();['in','out'].forEach(function(point){var titlecase=Ox.toTitleCase(point);self.$pointMarker[point]=$('<img>').addClass('OxMarkerPoint'+titlecase).attr({src:Ox.UI.getImageURL('marker'+titlecase)}).appendTo(self.$timeline);setPointMarker(point);});setWidth();setPosition();function click(data){self.options.position=Ox.round(Ox.limit(getPosition(data),0,self.options.duration),3);setPosition();that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function dragstart(data){Ox.$body.addClass('OxDragging');self.drag={x:data.clientX};}
|
||
|
|
function drag(data){self.options.position=Ox.round(Ox.limit(self.options.position+(self.drag.x-data.clientX)/self.fps,0,self.options.duration),3);self.drag.x=data.clientX;setPosition();that.triggerEvent('positioning',{position:self.options.position});}
|
||
|
|
function dragend(){Ox.$body.removeClass('OxDragging');that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function getImageURL(i,callback){if(!self.isAsync){callback(self.options.getImageURL(self.options.type,i));}else{self.options.getImageURL(self.options.type,i,callback);}}
|
||
|
|
function getPosition(e){return self.options.position+(e.clientX-that.offset().left-self.center-1)/self.fps;}
|
||
|
|
function mouseleave(e){self.clientX=0;self.clientY=0;self.$tooltip.hide();}
|
||
|
|
function mousemove(e){self.clientX=e.clientX;self.clientY=e.clientY;updateTooltip();}
|
||
|
|
function setMarker(){self.$markerPosition.css({left:self.center+'px'});}
|
||
|
|
function setPointMarker(point){self.$pointMarker[point].css({left:(self.options[point]*self.fps)+'px'});}
|
||
|
|
function setPosition(){self.tile=Math.floor(self.options.position*self.fps/self.tileWidth);self.$timeline.css({marginLeft:(-self.options.position*self.fps)+'px'});Ox.loop(Math.max(self.tile-1,0),Math.min(self.tile+2,self.tiles),function(i){if(!self.$tiles[i]){if(self.isAsync){self.$tiles[i]=true;}
|
||
|
|
getImageURL(i,function(url){self.$tiles[i]=$('<img>').attr({src:url}).css({left:(i*self.tileWidth)+'px'}).appendTo(self.$timeline);});}});if(self.clientX&&self.clientY){updateTooltip();}}
|
||
|
|
function setSubtitles(){that.find('.OxSubtitle').remove();self.$subtitles=[];self.options.subtitles.forEach(function(subtitle,i){var found=self.options.find&&subtitle.text.toLowerCase().indexOf(self.options.find.toLowerCase())>-1;self.$subtitles[i]=$('<div>').addClass('OxSubtitle'+(found?' OxHighlight':'')).css({left:Math.round(subtitle['in']*self.fps)+'px',width:Math.round(((subtitle.out-subtitle['in'])*self.fps)-2)+'px'}).html(Ox.highlight(subtitle.text,self.options.find,'OxHighlight',true)).appendTo(self.$timeline);});}
|
||
|
|
function setType(){Ox.forEach(self.$tiles,function($tile,i){getImageURL(i,function(url){$tile.attr({src:url});});});}
|
||
|
|
function setWidth(){self.center=Math.floor(self.options.width/2);that.css({width:self.options.width+'px'});self.$timeline.css({left:self.center+'px'});setMarker();}
|
||
|
|
function triggerPositionEvent(){that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function updateTooltip(){var position=getPosition(self);if(position>=0&&position<=self.options.duration){self.$tooltip.options({title:Ox.formatDuration(position,3)}).show(self.clientX,self.clientY);}else{self.$tooltip.hide();}}
|
||
|
|
return that;};'use strict';Ox.SmallVideoTimeline=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({_offset:0,disabled:false,duration:0,find:'',imageURL:'','in':0,invertHighlight:false,mode:'player',out:0,paused:false,results:[],showInToOut:false,showMilliseconds:0,state:'default',subtitles:[],width:256}).options(options||{}).update({duration:function(){self.$image.options({duration:self.options.duration});},imageURL:function(){self.$image.options({imageURL:self.options.imageURL});},'in':function(){self.$image.options({'in':self.options['in']});self.options.mode=='editor'&&setPointMarker('in');},out:function(){self.$image.options({out:self.options.out});self.options.mode=='editor'&&setPointMarker('out');},paused:function(){self.$positionMarker[self.options.paused?'addClass':'removeClass']('OxPaused');},position:function(){setPositionMarker();},results:function(){self.$image.options({results:self.options.results});},state:function(){self.$image.options({state:self.options.state});},subtitles:function(){self.$image.options({subtitles:self.options.subtitles});},width:function(){setWidth();}}).addClass('OxSmallVideoTimeline').css(Ox.extend({width:self.options.width+'px'},self.options.mode=='player'?{background:'rgb(0, 0, 0)',borderRadius:'8px'}:{}));self.height=self.options.mode=='player'?16:24;self.imageLeft=self.options.mode=='player'?8:4;self.imageWidth=self.options.width-(self.options.mode=='player'?16:8)
|
||
|
|
self.imageHeight=self.options.mode=='player'?16:18;self.interfaceLeft=self.options.mode=='player'?0:4;self.interfaceTop=self.options.mode=='player'?0:2;self.interfaceWidth=self.options.mode=='player'?self.options.width:self.imageWidth;that.css({height:self.height+'px'});self.$image=getTimelineImage().appendTo(that);self.$interface=Ox.Element({tooltip:getTooltip}).addClass('OxInterface').css({left:self.interfaceLeft+'px',top:self.interfaceTop+'px',width:self.interfaceWidth+'px',height:'20px'}).bindEvent({drag:function(data){mousedown(data);},dragend:function(data){self.triggered=false;mousedown(data);},mousedown:mousedown,touchend:function(data){self.triggered=false;mousedown(data);},touchmove:mousedown,touchstart:mousedown}).appendTo(that);self.$interface.$tooltip.css({textAlign:'center'});if(self.options.mode=='player'){self.$positionMarker=$('<div>').addClass('OxMarkerPlay'+(self.options.paused?' OxPaused':'')).append($('<div>').append($('<div>'))).appendTo(that);}else{self.$positionMarker=$('<img>').addClass('OxMarkerPosition').attr({src:Ox.UI.getImageURL('markerPosition')}).appendTo(that);}
|
||
|
|
setPositionMarker();if(self.options.mode=='editor'){self.$pointMarker={};['in','out'].forEach(function(point){var titlecase=Ox.toTitleCase(point);self.$pointMarker[point]=$('<img>').addClass('OxMarkerPoint'+titlecase).attr({src:Ox.UI.getImageURL('marker'+titlecase)}).appendTo(that);setPointMarker(point);});}
|
||
|
|
function getLeft(){return(self.options.showInToOut?self.options.position-self.options['in']:self.options.position)*self.imageWidth/self.options.duration;}
|
||
|
|
function getPosition(e){var position=((e.offsetX?e.offsetX:e.clientX-$(e.target).offset().left)
|
||
|
|
-(self.options.mode=='player'?8:0))*self.options.duration/self.imageWidth;position=Ox.limit(position,0,self.options.duration);if(self.options.showInToOut){position+=self.options['in'];}
|
||
|
|
return position;}
|
||
|
|
function getSubtitle(position){var subtitle='';Ox.forEach(self.options.subtitles,function(v){if(v['in']<=position&&v.out>position){subtitle=v;return false;}});return subtitle;}
|
||
|
|
function getTimelineImage(){return(self.options.imageURL?Ox.SmallVideoTimelineImage({duration:self.options.duration,imageURL:self.options.imageURL,'in':self.options['in'],invertHighlight:self.options.invertHighlight,mode:self.options.mode,out:self.options.out,results:self.options.results,showInToOut:self.options.showInToOut,subtitles:self.options.subtitles,state:self.options.state,type:self.options.type,width:self.imageWidth}):Ox.Element()).css({position:'absolute',left:self.imageLeft+'px',width:self.imageWidth+'px'});}
|
||
|
|
function getTooltip(e){var position=getPosition(e),subtitle=getSubtitle(position);return subtitle?'<span class=\'OxBright\'>'+Ox.highlight(subtitle.text,self.options.find,'OxHighlight').replace(/\n/g,'<br/>')+'</span><br/>'+Ox.formatDuration(subtitle['in'],self.options.showMilliseconds)+' - '+Ox.formatDuration(subtitle['out'],self.options.showMilliseconds):Ox.formatDuration(position,self.options.showMilliseconds);}
|
||
|
|
function mousedown(e){if(!self.options.disabled&&$(e.target).is('.OxInterface')){self.options.position=getPosition(e);setPositionMarker();if(!self.triggered){that.triggerEvent('position',{position:self.options.position});self.triggered=true;setTimeout(function(){self.triggered=false;},250);}}}
|
||
|
|
function setPointMarker(point){self.$pointMarker[point].css({left:self.imageLeft+Math.round(getLeft())+'px'});}
|
||
|
|
function setPositionMarker(){self.$positionMarker.css({left:self.interfaceLeft+Math.round(getLeft())
|
||
|
|
-(self.options.mode=='editor'?5:0)
|
||
|
|
+self.options._offset+'px'});}
|
||
|
|
function setWidth(){self.imageWidth=self.options.width-(self.options.mode=='player'?16:8);self.interfaceWidth=self.options.mode=='player'?self.options.width:self.imageWidth;that.css({width:self.options.width+'px'});self.$image.options({width:self.imageWidth}).css({width:self.imageWidth+'px'});self.$interface.css({width:self.interfaceWidth+'px'});setPositionMarker();if(self.options.mode=='editor'){setPointMarker('in');setPointMarker('out');}}
|
||
|
|
return that;};'use strict';Ox.SmallVideoTimelineImage=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({duration:0,imageURL:'',invertHighlight:false,'in':0,mode:'player',out:0,results:[],showInToOut:false,state:'default',subtitles:[],type:'',width:256}).options(options||{}).update({imageURL:function(){self.$timeline.attr({src:self.options.imageURL});},'in':function(){self.$selection.attr({src:getImageURL('selection')});},out:function(){self.$selection.attr({src:getImageURL('selection')});},results:function(){self.$results.attr({src:getImageURL('results')});},selection:function(){self.$selection.attr({src:getImageURL('selection')});},subtitles:function(){self.$subtitles.attr({src:getImageURL('subtitles')});},state:function(){self.$selection.attr({src:getImageURL('selection')});},width:function(){var width=self.options.width;that.css({width:width+'px'});self.$results.attr({src:getImageURL('results')}).css({width:width+'px'});self.$selection.attr({src:getImageURL('selection')}).css({width:width+'px'});self.$subtitles.css({width:width+'px'});self.$timeline.css({width:width+'px'});}}).css({position:'absolute',width:self.options.width+'px'});if(self.options.showInToOut){self.pixelsPerSecond=(screen.width<1024?1024:screen.width)/self.options.duration;}
|
||
|
|
self.images=Ox.isString(self.options.imageURL)?1:Math.ceil(self.options.duration/3600);self.imageWidth=Ox.isString(self.options.imageURL)?1920:self.options.showInToOut?(self.pixelsPerSecond<=1?Math.round(self.options.duration):Math.round(self.options.duration*25)):Math.round(self.options.duration);self.height=self.options.mode=='editor'?24:16;self.imageHeight=self.options.mode=='editor'?18:16;self.imageTop=self.options.mode=='editor'?3:0;self.timelineTop=self.options.mode=='editor'?4:0;self.themeData=Ox.Theme.getThemeData();that.css({height:self.height+'px'});if(Ox.isString(self.options.imageURL)){self.$timeline=$('<img>').attr({src:self.options.imageURL}).css({position:'absolute',top:self.timelineTop+'px',width:self.options.width+'px',height:'16px'}).appendTo(that);}else if(self.options.showInToOut){self.$timeline=getClipTimeline().css({position:'absolute',top:self.timelineTop+'px',width:self.options.width+'px',height:'16px'}).appendTo(that);}else{Ox.loop(self.images,function(i){$('<img>').attr({src:self.options.imageURL(self.options.type,i)}).css({position:'absolute',left:(i*3600)+'px',top:self.timelineTop+'px',width:(i==self.images-1?self.imageWidth%3600||3600:3600)+'px',height:'16px'}).appendTo(that);});}
|
||
|
|
self.$subtitles=$('<img>');self.$results=$('<img>');self.$selection=$('<img>');setTimeout(function(){self.$subtitles.attr({src:getImageURL('subtitles')}).css({position:'absolute',top:self.imageTop+'px',width:self.options.width+'px',height:self.imageHeight+'px'}).appendTo(that);self.$results.attr({src:getImageURL('results')}).css({position:'absolute',top:self.imageTop+'px',width:self.options.width+'px',height:self.imageHeight+'px'}).appendTo(that);self.$selection.attr({src:getImageURL('selection')}).css({position:'absolute',top:self.imageTop+'px',width:self.options.width+'px',height:self.imageHeight+'px'}).appendTo(that);that.triggerEvent('loaded');});function getClipTimeline(){var $canvas,context,image,firstTile,lastTile,tileHeight,tileOffset,tileWidth;if(self.pixelsPerSecond<=1){firstTile=Math.floor(self.options['in']/3600);lastTile=Math.floor(self.options.out/3600);tileHeight=16;tileOffset=-Math.round(self.options['in']%3600);tileWidth=3600;}else{firstTile=Math.floor(self.options['in']/60);lastTile=Math.floor(self.options.out/60);tileHeight=64;tileOffset=-Math.round(self.options['in']%60*25);tileWidth=1500;}
|
||
|
|
$canvas=$('<canvas>').attr({width:self.imageWidth,height:tileHeight});context=$canvas[0].getContext('2d');Ox.loop(firstTile,lastTile+1,function(tileIndex){var $image=$('<img>').one({load:function(){context.drawImage($image[0],tileOffset+(tileIndex-firstTile)*tileWidth,0);}}).attr({src:self.options.imageURL(tileHeight,tileIndex)});});return $canvas;}
|
||
|
|
function getImageURL(image,callback){var width=image=='results'||image=='selection'?self.options.width:self.imageWidth,height=self.imageHeight,canvas=$('<canvas>').attr({width:width,height:height})[0],context=canvas.getContext('2d'),imageData=context.createImageData(width,height),data=imageData.data;if(image=='results'){var top=0,bottom=height;self.options.results.forEach(function(result){var left=Math.round(result['in']/self.options.duration*width),right=Math.round(result.out/self.options.duration*width)+1,rgb=self.themeData.videoTimelineResultGradient;Ox.loop(left,right,function(x){Ox.loop(top,bottom,function(y){var alpha=self.options.mode=='editor'&&(y==top||y==bottom-1)?255:128,color=rgb[[2,3,6].indexOf(x%4+y%4)>-1?0:1],index=x*4+y*4*width;data[index]=color[0];data[index+1]=color[1];data[index+2]=color[2];data[index+3]=alpha;});});});}else if(image=='selection'&&self.options.out>self.options['in']&&!self.options.showInToOut){var left=Math.round(self.options['in']/self.options.duration*width),right=Math.round(self.options.out/self.options.duration*width)+1,spans=self.options.invertHighlight?[{left:0,right:left},{left:right,right:width}]:[{left:left,right:right}],top=0,bottom=height,rgb=self.themeData[self.options.state=='editable'?'videoTimelineEditableGradient':self.options.state=='editing'?'videoTimelineEditingGradient':self.options.state=='selected'?'videoTimelineSelectedGradient':'videoTimelineDefaultGradient'];spans.forEach(function(span){Ox.loop(span.left,span.right,function(x){Ox.loop(top,bottom,function(y){var alpha=self.options.mode=='editor'&&(y==top||y==bottom-1)?255:128,color=rgb[[2,3,6].indexOf(x%4+y%4)>-1?0:1],index=x*4+y*4*width;data[index]=color[0];data[index+1]=color[1];data[index+2]=color[2];data[index+3]=alpha;});});});}else if(image=='subtitles'){var bottom=self.options.mode=='editor'?15:14,offset=self.options.showInToOut?(self.pixelsPerSecond<=1?-self.options['in']:-self.options['in']*25):0,subtitles=self.options.showInToOut?self.options.subtitles.filter(function(subtitle){return(subtitle['in']>=self.options['in']&&subtitle['in']<=self.options.out)||(subtitle.out>=self.options['in']&&subtitle.out<=self.options.out)||(subtitle['in']<self.options['in']&&subtitle.out>self.options.out)}):self.options.subtitles;subtitles.forEach(function(subtitle){var left=Math.round(subtitle['in']/self.options.duration*self.imageWidth)+offset,right=Math.round(subtitle.out/self.options.duration*self.imageWidth)+offset+1,top=bottom-subtitle.text.split('\n').length-2;Ox.loop(left,right,function(x){Ox.loop(top,bottom,function(y){var alpha=128,color=(y==top||y==bottom-1)?[0,0,0]:[255,255,255],index=x*4+y*4*width;data[index]=color[0];data[index+1]=color[1];data[index+2]=color[2];data[index+3]=alpha;});});});}
|
||
|
|
context.putImageData(imageData,0,0);return canvas.toDataURL();}
|
||
|
|
return that;};'use strict';Ox.VideoAnnotationPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({annotationsCalendarSize:256,annotationsHighlight:'none',annotationsMapSize:256,annotationsRange:'all',annotationsSeparator:';',annotationsSize:256,annotationsSort:'position',annotationsTooltip:Ox._('annotations'),audioTrack:'',autocomplete:null,censored:[],censoredIcon:'',censoredTooltip:'',clickLink:null,cuts:[],duration:0,enableDownload:false,enableImport:false,enableExport:false,enableSetPosterFrame:false,enableSubtitles:false,find:'',findLayer:'*',fps:25,getFrameURL:null,getLargeTimelineURL:null,getSmallTimelineURL:null,'in':0,itemName:{singular:'video',plural:'videos'},height:0,layers:[],loop:false,muted:false,out:0,paused:true,playbackRate:1,position:0,posterFrame:0,resolution:0,selected:'',selectResult:false,showAnnotations:false,showAnnotationsCalendar:false,showAnnotationsMap:false,showLargeTimeline:true,showLayers:{},showUsers:false,subtitles:[],subtitlesDefaultTrack:'en',subtitlesLayer:null,subtitlesOffset:0,subtitlesTrack:'en',timeline:'',timelines:[],videoRatio:16/9,videoSize:'small',video:'',volume:1,width:0}).options(options||{}).update({enableSubtitles:function(){self.$player.forEach(function($player){$player.options('enableSubtitles',self.options.enableSubtitles);});},height:setSizes,'in':function(){setPoint('in',self.options['in']);},loop:function(){self.$video.options({loop:self.options.loop});},out:function(){setPoint('out',self.options.out);},paused:function(){self.$player[0].options({paused:self.options.paused});},playbackRate:function(){self.$player[0].options({playbackRate:self.options.playbackRate});},position:function(){setPosition(self.options.position);},selected:function(){selectAnnotation(self.options.selected?Ox.getObjectById(self.annotations,self.options.selected):{id:''});},showAnnotations:function(){self.$mainPanel.toggleElement(1);},showLayers:function(){self.$annotationPanel.options({showLayers:Ox.clone(self.options.showLayers)});},timeline:function(){self.$menuButton.checkItem('timelines_'+self.options.timeline);updateTimelines();},volume:function(){self.$player[0].options({volume:self.options.volume});},width:setSizes}).bindEvent({key_0:toggleMuted,key_alt_left:function(){},key_alt_right:function(){},key_alt_shift_left:function(){},key_alt_shift_right:function(){},key_b:function(){self.annotations.length&&selectAnnotation(getNextAnnotation('annotation',-1));},key_backslash:function(){self.annotations.length&&selectAnnotation();},key_closebracket:function(){self.annotations.length&&movePositionTo('annotation',1);},key_comma:function(){movePositionTo('cut',-1);},key_control_c:function(){that.triggerEvent('copy',[{annotation:self.options.selected,'in':self.options['in'],out:self.options.out}]);},key_control_shift_c:function(){that.triggerEvent('copyadd',[{annotation:self.options.selected,'in':self.options['in'],out:self.options.out}]);},key_delete:function(){self.$annotationPanel.removeItem(true);},key_dot:function(){movePositionTo('cut',1);},key_down:function(){movePositionBy(self.sizes.timeline[0].width);},key_enter:function(){if(self.editing){blurAnnotation();}else if(isEditable()){editAnnotation();}},key_equal:function(){self.$player[0].changeVolume(0.1);},key_escape:function(){if(self.editing){blurAnnotation();}else if(self.options.selected){selectAnnotation({id:''});}},key_f:function(){setTimeout(function(){self.$findInput.focusInput(true);});},key_g:function(){self.results.length&&selectAnnotation(getNextAnnotation('result',1));},key_h:showKeyboardShortcuts,key_i:function(){setPoint('in',self.options.position);},key_k:function togglePlaybackRate(){that.options({playbackRate:self.options.playbackRate==1?2:self.options.playbackRate==2?0.5:1});},key_l:toggleLoop,key_left:function(){movePositionBy(-1/self.options.fps);},key_minus:function(){self.$player[0].changeVolume(-0.1);},key_n:function(){self.annotations.length&&selectAnnotation(getNextAnnotation('annotation',1));},key_o:function(){setPoint('out',self.options.position);},key_openbracket:function(){self
|
||
|
|
self.options.layers.forEach(function(layer,i){that.bindEvent('key_'+(i+1),function(){layer.editable?addAnnotation(layer.id):that.triggerEvent('info',{layer:layer.id});});});self.$player=[];self.$timeline=[];self.annotations=getAnnotations();self.controlsHeight=16;self.editing=false;self.margin=8;self.positions=getPositions();self.results=[];self.words=getWords();self.$editor=Ox.Element().addClass('OxVideoAnnotationPanel OxMedia').on({mousedown:function(e){var $target=$(e.target);if(!$target.is('.OxPosition')&&!$target.is('input')){that.gainFocus();}
|
||
|
|
if($target.is('.OxKeyboardFocus')){return;}
|
||
|
|
if(self.editing){self.focused=true;setTimeout(function(){that.gainFocus();self.focused=false;},25);}}});self.sizes=getSizes();['play','in','out'].forEach(function(type,i){self.$player[i]=Ox.VideoPlayer({censored:self.options.censored,censoredIcon:self.options.censoredIcon,censoredTooltip:self.options.censoredTooltip,controlsBottom:type=='play'?['play','playInToOut','volume','size','space','position']:['goto','set','space','position'],duration:self.options.duration,enableMouse:true,enablePosition:true,enableSubtitles:self.options.enableSubtitles,externalControls:true,find:getSubtitlesFind(),height:self.sizes.player[i].height,id:'player'+Ox.toTitleCase(type),'in':self.options['in'],loop:self.options.loop,muted:self.options.muted,out:self.options.out,paused:self.options.paused,playbackRate:self.options.playbackRate,position:type=='play'?self.options.position:self.options[type],posterFrame:self.options.posterFrame,resolution:self.options.resolution,showMarkers:true,showMilliseconds:3,sizeIsLarge:self.options.videoSize=='large',subtitles:Ox.clone(self.options.subtitles,true),subtitlesDefaultTrack:self.options.subtitlesDefaultTrack,subtitlesOffset:self.options.subtitlesOffset,subtitlesTrack:self.options.subtitlesTrack,type:type,video:type=='play'?self.options.video:self.options.getFrameURL,volume:self.options.volume,width:self.sizes.player[i].width}).css({left:self.sizes.player[i].left+'px',top:self.sizes.player[i].top+'px'}).bindEvent(Ox.extend({censored:function(){that.triggerEvent('censored');}},type=='play'?{loop:function(data){that.triggerEvent('loop',data);},muted:function(data){that.triggerEvent('muted',data);},paused:function(data){self.options.paused=data.paused;that.triggerEvent('paused',data);},playing:function(data){setPosition(data.position,true);},position:function(data){setPosition(data.position);},positioning:function(data){setPosition(data.position,false,true);},resolution:function(data){that.triggerEvent('resolution',data);},size:function(){toggleSize();},submit:function(){that.gainFocus();},subtitles:function(data){that.triggerEvent('subtitles',data);},volume:function(data){that.triggerEvent('volume',data);}}:{gotopoint:function(){goToPoint(type);},position:function(data){setPoint(type,data.position);},setpoint:function(){setPoint(type,self.options.position);}})).appendTo(self.$editor);});self.$timeline[0]=Ox.LargeVideoTimeline({cuts:self.options.cuts,duration:self.options.duration,find:getSubtitlesFind(),getImageURL:self.options.getLargeTimelineURL,id:'timelineLarge','in':self.options['in'],out:self.options.out,position:self.options.position,subtitles:getSubtitles(),type:self.options.timeline,width:self.sizes.timeline[0].width}).css({left:self.sizes.timeline[0].left+'px',top:self.sizes.timeline[0].top+'px'}).bindEvent({position:function(data){setPosition(data.position);},positioning:function(data){setPosition(data.position,false,true);}}).appendTo(self.$editor);self.$timeline[1]=Ox.BlockVideoTimeline({cuts:self.options.cuts,duration:self.options.duration,find:getSubtitlesFind(),getImageURL:self.options.getSmallTimelineURL,id:'timelineSmall','in':self.options['in'],out:self.options.out,position:self.options.position,results:find(self.options.find),showPointMarkers:true,state:self.options.selected?'selected':'default',subtitles:getSubtitles(),type:self.options.timeline,videoId:self.options.videoId,width:self.sizes.timeline[1].width}).css({left:self.sizes.timeline[1].left+'px',top:self.sizes.timeline[1].top+'px'}).bindEvent({edit:function(){if(isEditable()&&!self.editing){editAnnotation();}},position:function(data){setPosition(data.position);},select:function(){selectAnnotation(void 0,true);}}).appendTo(self.$editor);self.$menubar=Ox.Bar({size:16}).addClass('OxVideoPlayer').bindEvent({doubleclick:function(e){if($(e.target).is('.OxBar')){self.$editor.animate({scrollTop:0},250);}}});self.$keyboardShortcuts=$('<div>').css({margin:'16px'});[{key:Ox.SYMBOLS.space,action:Ox._('Play/Pause')},{key:'P',action:Ox._('Play In to Out')},{key:'K',action:Ox._('Toggle Playback Speed')},{key:'L',action:Ox._('Loop')},{key:'0',
|
||
|
|
self.options.subtitlesTrack=data.checked[0].id;setSubtitlesTrack();}else if(id=='timeline'){self.options.timeline=data.checked[0].id;updateTimelines();that.triggerEvent('timeline',{timeline:self.options.timeline});}},hide:function(){that.gainFocus();}}).appendTo(self.$menubar);self.$clearButton=Ox.Button({disabled:self.options.find==='',style:'symbol',title:'close',tooltip:Ox._('Clear'),type:'image'}).css({float:'right'}).bindEvent({click:function(){self.$findInput.clearInput();submitFindInput('');}}).appendTo(self.$menubar);self.$findInput=Ox.Input({autocomplete:self.words.map(function(word){return word.value;}),autocompleteReplace:false,autocompleteSelect:true,autocompleteSelectHighlight:true,autocompleteSelectMax:10,autocompleteSelectSubmit:true,changeOnKeypress:true,placeholder:Ox._('Find...'),value:self.options.find,width:128}).css({float:'right',background:'transparent'}).bindEvent({change:function(data){submitFindInput(data.value,false);},submit:function(data){submitFindInput(data.value,true);}}).appendTo(self.$menubar);self.$nextButton=Ox.Button({disabled:true,style:'symbol',title:'arrowRight',tooltip:Ox._('Next Result'),type:'image'}).css({float:'right'}).bindEvent({click:function(){selectAnnotation(getNextAnnotation('result',1));}}).appendTo(self.$menubar);self.$previousButton=Ox.Button({disabled:true,style:'symbol',title:'arrowLeft',tooltip:Ox._('Previous Result'),type:'image'}).css({float:'right'}).bindEvent({click:function(){selectAnnotation(getNextAnnotation('result',-1));}}).appendTo(self.$menubar);self.$results=$('<div>').css({float:'right',width:'36px',padding:'2px 4px 0 0',fontSize:'9px',textAlign:'right',cursor:'default',opacity:0.25}).html('0').appendTo(self.$menubar.$element);self.$annotationPanel=Ox.AnnotationPanel({autocomplete:self.options.autocomplete,calendarSize:self.options.annotationsCalendarSize,clickLink:self.options.clickLink,editable:true,enableExport:self.options.enableExport,enableImport:self.options.enableImport,highlight:self.options.find,highlightAnnotations:self.options.annotationsHighlight,highlightLayer:self.options.findLayer,'in':self.options['in'],itemName:self.options.itemName,layers:self.options.layers,mapSize:self.options.annotationsMapSize,out:self.options.out,position:self.options.position,range:self.options.annotationsRange,selected:self.options.selected,separator:self.options.annotationsSeparator,showCalendar:self.options.showAnnotationsCalendar,showFind:true,showLayers:Ox.clone(self.options.showLayers),showMap:self.options.showAnnotationsMap,showUsers:self.options.showUsers,sort:self.options.annotationsSort,width:self.options.annotationsSize}).bindEvent({add:function(data){addAnnotation(data.layer);},annotationsrange:function(data){self.options.annotationsRange=data.range;that.triggerEvent('annotationsrange',data);},annotationssort:function(data){self.options.annotationsSort=data.sort;that.triggerEvent('annotationssort',data);},blur:function(data){if(!self.focused&&!$('.OxDialogLayer').length&&!$('.OxMenuLayer').length){blurAnnotation();}},change:function(data){if(data.layer==self.options.subtitlesLayer){updateSubtitles();}
|
||
|
|
that.triggerEvent('editannotation',data);},define:function(data){that.triggerEvent('define',data);},edit:function(data){updateWords('remove');self.editing=true;setTimelineState();},exportannotations:function(){that.triggerEvent('exportannotations');},find:function(data){self.$findInput.options({value:data.value});submitFindInput(data.value,true);},findannotations:function(data){that.triggerEvent('findannotations',data);},focus:that.gainFocus,highlightannotations:function(data){self.options.annotationsHighlight=data;that.triggerEvent('annotationshighlight',data);},highlightlayer:function(data){self.options.findLayer=data;submitFindInput(self.$findInput.value(),false);that.triggerEvent('findlayer',data);},importannotations:function(){that.triggerEvent('importannotations');},info:function(data){that.triggerEvent('info',data);},open:function(){setPosition(self.options['in']);},remove:removeAnnotation,resize:resizeAnnotations,resizeend:resizeendAnnotations,resizecalendar:function(data){that.triggerEvent('resizecalendar',data);},resizemap:function(data){that.triggerEvent('resizemap',data);},select:function(data){selectAnnotation(data,!self.updating);},showentityinfo:function(data){that.triggerEvent('showentityinfo',data);},submit:submitAnnotation,toggle:toggleAnnotations,togglecalendar:function(data){self.options.showAnnotationsCalendar=!data.collapsed;that.triggerEvent('togglecalendar',data);},togglelayer:function(data){that.triggerEvent('togglelayer',{collapsed:data.collapsed,layer:data.layer});},togglemap:function(data){self.options.showAnnotationsMap=!data.collapsed;that.triggerEvent('togglemap',data);}});['0','1','2','3','4','5','6','7','8','9','b','backslash','closebracket','comma','dot','equal','f','g','h','i','minus','n','o','openbracket','p','shift_0','shift_equal','shift_g','shift_i','shift_minus','shift_o','slash','space','control_c','control_v',].forEach(function(key){key='key.'+key;self.$annotationPanel.bindEvent(key,function(){that.triggerEvent(key);});});that.setElement(self.$mainPanel=Ox.SplitPanel({elements:[{element:Ox.SplitPanel({elements:[{element:self.$menubar,size:16},{element:self.$editor}],orientation:'vertical'})},{collapsed:!self.options.showAnnotations,collapsible:true,element:self.$annotationPanel,resizable:true,resize:[192,256,320,384,448,512],size:self.options.annotationsSize,tooltip:self.options.annotationsTooltip}],orientation:'horizontal'}));self.options.find&&self.options.selectResult&&setTimeout(function(){submitFindInput(self.options.find,!self.options.selected);});function addAnnotation(layer){if(self.editing){self.editing=false;setTimelineState();self.$annotationPanel.blurItem();}
|
||
|
|
that.triggerEvent('addannotation',{'in':self.options['in'],layer:layer,out:self.options.out,value:''});}
|
||
|
|
function blurAnnotation(){updateWords('add');self.editing=false;setTimelineState();if(self.options.annotationsRange=='position'&&(self.options.position<self.options['in']||self.options.position>self.options.out)){setPosition(self.options['in']);}
|
||
|
|
setTimeout(self.$annotationPanel.blurItem);}
|
||
|
|
function editAnnotation(){updateWords('remove');self.editing=true;setTimelineState();self.$annotationPanel.editItem();}
|
||
|
|
function find(query){var results=[];if(query.length){query=query.toLowerCase();results=self.annotations.filter(function(annotation){return Ox.contains(['*',annotation.layer],self.options.findLayer)&&Ox.decodeHTMLEntities(Ox.stripTags(annotation.value.toLowerCase())).indexOf(query)>-1;});}
|
||
|
|
return results;}
|
||
|
|
function getAnnotation(){var annotations=self.annotations.filter(function(annotation){return annotation['in']<=self.options.position&&annotation.out>=self.options.position}).sort(function(a,b){var aValue=self.options.position-a['in'],bValue=self.options.position-b['in'],ret=0;if(aValue<bValue){ret=-1;}else if(aValue>bValue){ret=1;}else if(a.duration<b.duration){ret=-1}else if(a.duration>b.duration){ret=1;}else if(a.value<b.value){ret=-1}else if(a.value>b.value){ret=1;}
|
||
|
|
return ret;});return annotations.length?annotations[0]:{id:''};}
|
||
|
|
function getAnnotations(){return Ox.flatten(self.options.layers.map(function(layer){return layer.items.map(function(item){return Ox.extend({layer:layer.id},item)});})).sort(sortAnnotations);}
|
||
|
|
function getAnnotationValue(annotationId){var found=false,value;Ox.forEach(self.options.layers,function(layer,i){Ox.forEach(layer.items,function(item){if(item.id==annotationId){value=item.value;found=true;return false;}});if(found){return false;}});return value;}
|
||
|
|
function getNextAnnotation(type,direction){var annotation,annotations=type=='annotation'?self.annotations:self.results,index,position;if(self.options.selected){index=Ox.getIndexById(annotations,self.options.selected);if(index>-1&&self.options.position==annotations[index]['in']){annotation=annotations[Ox.mod(index+direction,annotations.length)];}}
|
||
|
|
if(!annotation){position=getNextPosition(type,direction);annotations=annotations.filter(function(annotation){return annotation['in']==position;});annotation=annotations[direction==1?0:annotations.length-1];}
|
||
|
|
return annotation;}
|
||
|
|
function getNextPosition(type,direction){var positions;if(type=='annotation'){positions=self.positions;}else if(type=='cut'){positions=[0].concat(self.options.cuts,self.options.duration);}else if(type=='result'){positions=Ox.unique(self.results.map(function(result){return result['in'];}));}
|
||
|
|
return Ox.nextValue(positions,self.options.position,direction);}
|
||
|
|
function getPositions(){return Ox.unique(self.annotations.map(function(annotation){return annotation['in'];}));}
|
||
|
|
function getSelectedLayer(){var selectedLayer;Ox.forEach(self.options.layers,function(layer){Ox.forEach(layer.items,function(item){if(item.id==self.options.selected){selectedLayer=layer.id;return false;}});if(selectedLayer){return false;}});return selectedLayer;}
|
||
|
|
function getSizes(scrollbarIsVisible){var scrollbarWidth=Ox.UI.SCROLLBAR_SIZE,contentWidth=self.options.width
|
||
|
|
-(self.options.showAnnotations*self.options.annotationsSize)-1
|
||
|
|
-(scrollbarIsVisible?scrollbarWidth:0),height,lines,size={player:[],timeline:[]},width,widths;function getHeight(){return size.player[0].height+self.controlsHeight
|
||
|
|
+size.timeline[0].height+lines*16
|
||
|
|
+(lines+3)*self.margin;}
|
||
|
|
if(self.options.videoSize=='small'){width=0;widths=Ox.splitInt(contentWidth-4*self.margin,3);[1,0,2].forEach(function(v,i){size.player[v]={left:(i+0.5)*self.margin+width,top:self.margin/2,width:widths[i],height:Math.round(widths[1]/self.options.videoRatio)};width+=widths[i];});}else{size.player[0]={left:self.margin/2,top:self.margin/2,width:Math.round((contentWidth-3*self.margin+(self.controlsHeight+self.margin)/2*self.options.videoRatio)*2/3)};size.player[0].height=Math.round(size.player[0].width/self.options.videoRatio);size.player[1]={left:size.player[0].left+size.player[0].width+self.margin,top:size.player[0].top,width:contentWidth-3*self.margin-size.player[0].width};size.player[1].height=Math.ceil(size.player[1].width/self.options.videoRatio);size.player[2]={left:size.player[1].left,top:size.player[0].top+size.player[1].height+self.controlsHeight+self.margin,width:size.player[1].width,height:size.player[0].height-size.player[1].height-self.controlsHeight-self.margin};}
|
||
|
|
size.timeline[0]={left:self.margin/2,top:size.player[0].height+self.controlsHeight+1.5*self.margin,width:contentWidth-2*self.margin,height:64};size.timeline[1]={left:size.timeline[0].left,top:size.timeline[0].top+size.timeline[0].height+self.margin,width:size.timeline[0].width};lines=Math.ceil(self.options.duration/size.timeline[1].width);height=getHeight();self.$editor.css({overflowY:(scrollbarIsVisible&&height<=self.options.height-16)?'scroll':'auto'});return(!scrollbarIsVisible&&height>self.options.height-16)?getSizes(true):size;}
|
||
|
|
function getSubtitles(){return self.options.enableSubtitles?self.options.subtitles.filter(function(v){return Ox.contains(v.tracks,self.options.subtitlesTrack);}):[];}
|
||
|
|
function getSubtitlesFind(){return Ox.contains([self.options.subtitlesLayer,'*'],self.options.findLayer)?self.options.find:'';}
|
||
|
|
function getWords(){var words=[];Ox.forEach(Ox.count(Ox.words(self.annotations.map(function(annotation){return Ox.decodeHTMLEntities(Ox.stripTags(annotation.value.toLowerCase()));}).join(' '))),function(count,value){words.push({count:count,value:value});})
|
||
|
|
return words.sort(function(a,b){return b.count-a.count;});}
|
||
|
|
function goToPoint(point){setPosition(self.options[point]);}
|
||
|
|
function isEditable(){var annotation=Ox.getObjectById(self.annotations,self.options.selected);return annotation&&annotation.editable;}
|
||
|
|
function movePositionBy(sec){setPosition(Ox.limit(self.options.position+sec,0,self.options.duration));}
|
||
|
|
function movePositionTo(type,direction){setPosition(getNextPosition(type,direction));}
|
||
|
|
function parseSubtitles(){return self.options.subtitlesLayer?self.options.layers.filter(function(layer){return layer.id==self.options.subtitlesLayer;})[0].items.map(function(subtitle){return{id:subtitle.id,'in':subtitle['in'],out:subtitle.out,text:subtitle.value.replace(/\n/g,' ').replace(/<br\/?>/g,'\n'),tracks:subtitle.languages||[self.options.subtitlesDefaultTrack]};}):[];}
|
||
|
|
function playInToOut(){self.$player[0].playInToOut();}
|
||
|
|
function removeAnnotation(data){var layer=Ox.getObjectById(self.options.layers,data.layer),index=Ox.getIndexById(layer.items,data.id);self.options.selected=data.id;updateWords('remove');self.options.selected='';layer.items.splice(index,1);self.annotations=getAnnotations();self.positions=getPositions();self.options.find&&submitFindInput(self.options.find);self.editing=false;if(data.layer==self.options.subtitlesLayer){updateSubtitles();}
|
||
|
|
setTimelineState();self.$annotationPanel.removeItem();that.triggerEvent('removeannotation',data);}
|
||
|
|
function resizeAnnotations(data){self.options.annotationsSize=data.size;setSizes();self.$annotationPanel.options({width:data.size});}
|
||
|
|
function resizeendAnnotations(data){that.triggerEvent('annotationssize',{size:data.size});}
|
||
|
|
function selectAnnotation(data,moveToPosition){if(Ox.isUndefined(data)){data=getAnnotation();}else if(!data.id&&Ox.$elements[that.oxid]){that.gainFocus();}
|
||
|
|
if(data.id){var outOfRange=self.options.annotationsRange!='position'&&(self.options.position<data['in']||self.options.position>data.out)
|
||
|
|
if(moveToPosition&&outOfRange){setPosition(data['in']);}
|
||
|
|
if(!self.editing){setPoint('in',data['in'],true);setPoint('out',data.out,true);}}
|
||
|
|
if(!self.editing){self.options.selected=data.id;self.$annotationPanel.options({selected:self.options.selected});setTimelineState();that.triggerEvent('select',{id:self.options.selected});}}
|
||
|
|
function selectCut(){var points={'in':Ox.last(self.options.cuts),out:self.options.duration};Ox.forEach(self.options.cuts,function(cut,i){if(cut>self.options.position){points={'in':i==0?0:self.options.cuts[i-1],out:cut-1/self.options.fps};return false;}});setPoint('in',points['in']);setPoint('out',points.out);}
|
||
|
|
function setPoint(point,position,keepSelected){self.options[point]=position;if(self.options.selected&&!self.editing&&!keepSelected){selectAnnotation({id:''});}
|
||
|
|
self.$player.forEach(function($player){$player.options(point,self.options[point]);});self.$player[point=='in'?1:2].options({position:self.options[point]});self.$timeline.forEach(function($timeline){$timeline.options(point,self.options[point]);});if(self.options['in']>self.options.out){setPoint(point=='in'?'out':'in',position,keepSelected);}else{self.$annotationPanel.options({'in':self.options['in'],out:self.options.out});that.triggerEvent('points',{'in':self.options['in'],out:self.options.out,position:self.options.position});if(self.editing&&self.options.selected.length&&self.options.selected[0]!='_'){that.triggerEvent('editannotation',{id:self.options.selected,'in':self.options['in'],out:self.options.out,value:$('.OxEditableElement input:visible').val()});}}}
|
||
|
|
function setPosition(position,playing,dragging){var minute=Math.floor(position/60),previousMinute=Math.floor(self.options.position/60);self.options.position=position;!playing&&self.$player[0].options({position:self.options.position});self.$timeline.forEach(function($timeline){$timeline.options({position:self.options.position});});self.$annotationPanel.options({position:self.options.position});if((!playing||minute!=previousMinute)&&!dragging){that.triggerEvent(playing?'playing':'position',{position:!playing?self.options.position:minute*60});}}
|
||
|
|
function setSizes(){self.sizes=getSizes();self.$player.forEach(function($player,i){$player.options({height:self.sizes.player[i].height,width:self.sizes.player[i].width}).css({left:self.sizes.player[i].left+'px',top:self.sizes.player[i].top+'px'});});self.$timeline.forEach(function($timeline,i){$timeline.options({width:self.sizes.timeline[i].width}).css({left:self.sizes.timeline[i].left+'px',top:self.sizes.timeline[i].top+'px'});});}
|
||
|
|
function setSubtitlesTrack(){var enableSubtitles=self.options.subtitlesTrack!='',subtitles,toggleSubtitles=enableSubtitles!=self.options.enableSubtitles;self.options.enableSubtitles=enableSubtitles;if(toggleSubtitles){self.$player.forEach(function($player){$player.options({enableSubtitles:self.options.enableSubtitles});});that.triggerEvent('subtitles',{subtitles:self.options.enableSubtitles});}else{self.$player.forEach(function($player){$player.options({subtitlesTrack:self.options.subtitlesTrack});});}
|
||
|
|
self.$timeline.forEach(function($timeline){$timeline.options({subtitles:getSubtitles()});});}
|
||
|
|
function showKeyboardShortcuts(){var dialog=Ox.Dialog({buttons:[Ox.Button({id:'close',title:Ox._('Close')}).bindEvent({click:function(){dialog.close();}})],content:self.$keyboardShortcuts,height:384,keys:{enter:'close',escape:'close'},title:Ox._('Keyboard Shortcuts'),width:256}).open();}
|
||
|
|
function setTimelineState(){self.$timeline[1].options({state:self.editing?'editing':isEditable()?'editable':self.options.selected?'selected':'default'});}
|
||
|
|
function sortAnnotations(a,b){var ret=0;if(a['in']<b['in']){ret=-1;}else if(a['in']>b['in']){ret=1;}else if(a.out<b.out){ret=-1;}else if(a.out>b.out){ret=1;}else if(a.value<b.value){ret=-1;}else if(a.value>b.value){ret=1;}
|
||
|
|
return ret;}
|
||
|
|
function submitAnnotation(data){self.annotations=getAnnotations();self.positions=getPositions();updateWords('add');self.options.find&&submitFindInput(self.options.find);self.editing=false;if(data.layer==self.options.subtitlesLayer){updateSubtitles();}
|
||
|
|
setTimelineState();if(self.options.annotationsRange=='position'&&(self.options.position<self.options['in']||self.options.position>self.options.out)){setPosition(self.options['in']);}
|
||
|
|
data['in']=self.options['in'];data.out=self.options.out;that.triggerEvent('editannotation',data);}
|
||
|
|
function submitFindInput(value,hasPressedEnter){self.options.find=value;self.results=find(self.options.find);self.$results.css({opacity:self.results.length?1:0.25}).html(self.results.length);self.$previousButton.options({disabled:!self.results.length});self.$nextButton.options({disabled:!self.results.length});self.$clearButton.options({disabled:!self.options.find});self.$player.forEach(function($player){$player.options({find:getSubtitlesFind()});});self.$timeline.forEach(function($timeline){$timeline.options({find:getSubtitlesFind()});});self.$timeline[1].options({results:self.results});if(hasPressedEnter){that.triggerEvent('find',{find:self.options.find});if(self.results.length){selectAnnotation(getNextAnnotation('result',1));that.gainFocus();}else{self.$findInput.focusInput(true);}}
|
||
|
|
self.$annotationPanel.options({highlight:self.options.find,highlightLayer:self.options.findLayer,});}
|
||
|
|
function toggleAnnotations(data){self.options.showAnnotations=!data.collapsed;setSizes();that.triggerEvent('toggleannotations',{showAnnotations:self.options.showAnnotations});}
|
||
|
|
function toggleLoop(){self.options.loop=!self.options.loop;self.$menuButton[self.options.loop?'checkItem':'uncheckItem']('loop');self.$player[0].toggleLoop();}
|
||
|
|
function toggleMuted(){self.$player[0].toggleMuted();}
|
||
|
|
function togglePaused(){self.$player[0].togglePaused();self.$player[0].options('paused')&&that.triggerEvent('position',{position:self.$player[0].options('position')});}
|
||
|
|
function toggleSize(){self.options.videoSize=self.options.videoSize=='small'?'large':'small';setSizes();self.$menuButton[self.options.videoSize=='small'?'uncheckItem':'checkItem']('size');self.$player[0].options({sizeIsLarge:self.options.videoSize=='large'});that.triggerEvent('togglesize',{size:self.options.videoSize});}
|
||
|
|
function updateSubtitles(){self.options.subtitles=parseSubtitles();self.$player.forEach(function($player){$player.options({subtitles:Ox.clone(self.options.subtitles,true)});});if(self.options.enableSubtitles){self.$timeline.forEach(function($timeline){$timeline.options({subtitles:getSubtitles()});});}}
|
||
|
|
function updateTimelines(){self.$timeline.forEach(function($timeline){$timeline.options({type:self.options.timeline});});}
|
||
|
|
function updateWords(action){var words=[];Ox.forEach(Ox.count(Ox.words(getAnnotationValue(self.options.selected)||'')),function(count,value){words.push({count:count,value:value});});words.forEach(function(word){var index=Ox.indexOf(self.words,function(w){return w.value===word.value;});if(action=='add'){if(index==-1){self.words.push({count:1,value:word.value});}else{self.words[index].count++;}}else if(index>-1){if(self.words[index].count==1){self.words.splice(index,1);}else{self.words[index].count--;}}});self.words.sort(function(a,b){return b.count-a.count;});self.$findInput.options({autocomplete:self.words.map(function(word){return word.value;})});}
|
||
|
|
that.addAnnotation=function(layer,annotation){self.$annotationPanel.addItem(layer,annotation);};that.getCurrentAnnotations=function(){return self.$annotationPanel.getCurrentAnnotations();};that.updateAnnotation=function(id,annotation){self.updating=true
|
||
|
|
if(annotation.id){self.options.selected=annotation.id;}
|
||
|
|
if(getSelectedLayer()==self.options.subtitlesLayer){updateSubtitles();}
|
||
|
|
self.$annotationPanel.updateItem(id,annotation);if(id!=annotation.id){self.annotations=getAnnotations();setTimelineState();}
|
||
|
|
self.updating=false};that.playInToOut=function(){self.$player[0].playInToOut();}
|
||
|
|
return that;};'use strict';Ox.VideoEditPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({annotationsCalendarSize:256,annotationsMapSize:256,annotationsRange:'all',annotationsSort:'position',clipRatio:16/9,clips:[],clipSize:256,clipTooltip:'clips',clipView:'list',clickLink:null,controlsTooltips:{},duration:0,editable:false,enableSubtitles:false,formatTitle:function(){return Ox.last(arguments);},fps:25,fullscreen:false,getClipImageURL:null,getLargeTimelineURL:null,height:0,'in':0,loop:false,layers:[],muted:false,out:0,paused:true,playbackRate:1,playInToOut:false,position:0,resolution:0,scaleToFill:false,selected:[],showAnnotationsCalendar:false,showAnnotationsMap:false,showClips:false,showLayers:{},showTimeline:false,showUsers:false,smallTimelineURL:'',sort:[],sortOptions:[],subtitles:[],subtitlesOffset:0,timeline:'',timelineTooltip:'timeline',type:'static',video:[],volume:1,width:0}).options(options||{}).update({clips:function(){self.$clipPanel.options({clips:Ox.clone(self.options.clips),sort:Ox.clone(self.options.sort)});},clipSize:function(){self.$mainPanel.resizeElement(1,self.options.clipSize);resizeClips({size:self.options.clipSize});},clipView:function(){self.$clipPanel.options({view:self.options.clipView});},duration:function(){self.$timeline&&self.$timeline.replaceWith(self.$timeline=getTimeline());},fullscreen:function(){self.$video.options({fullscreen:self.options.fullscreen});},height:function(){self.$video.options({height:getPlayerHeight()});self.$clipPanel.options({height:self.options.height});},'in':function(){setPoint('in',self.options['in']);},out:function(){setPoint('out',self.options.out);},paused:function(){self.$video.options({paused:self.options.paused});},playbackRate:function(){self.$video.options({playbackRate:self.options.playbackRate});},position:function(){self.$video.options({position:self.options.position});self.$timeline.options({position:self.options.position});self.$clipPanel.options({position:self.options.position});},selected:function(){self.$clipPanel.options({selected:self.options.selected});},showClips:function(){self.$mainPanel.toggleElement(1);},showLayers:function(){self.$clipPanel.options({showLayers:self.options.showLayers});},showTimeline:function(){self.$videoPanel.toggleElement(2);},smallTimelineURL:function(){self.$video.options({timeline:self.options.smallTimelineURL});},subtitles:function(){self.$video.options({subtitles:self.options.subtitles});self.$timeline.options({subtitles:self.options.enableSubtitles?self.options.subtitles:[]});},timeline:function(){self.$timeline.options({type:self.options.timeline});},video:function(){self.chapters=getChapters();self.cuts=getCuts();self.$video.options({chapters:self.chapters,video:self.options.video});self.$timeline.options({cuts:self.cuts});},volume:function(){self.$video.options({volume:self.options.volume});},width:function(){self.$video.options({width:getPlayerWidth()});self.$timeline.options({width:getTimelineWidth()});}}).bindEvent({key_0:toggleMuted,key_backslash:function(){if(self.options.view!='annotations'){self.$clipPanel.selectClip();}},key_closebracket:function(){movePositionTo('chapter',1);},key_comma:function(){movePositionTo('cut',-1);},key_control_c:function(){that.triggerEvent('copy',[{annotation:self.options.selected,'in':self.options['in'],out:self.options.out}]);},key_control_v:function(){that.triggerEvent('paste');},key_dot:function(){movePositionTo('cut',1);},key_equal:function(){self.$video.changeVolume(0.1);},key_i:function(){setPoint('in',self.options.position,true);},key_left:function(){movePositionBy(-0.04);},key_minus:function(){self.$video.changeVolume(-0.1);},key_o:function(){setPoint('out',self.options.position,true);},key_openbracket:function(){movePositionTo('chapter',-1);},key_right:function(){movePositionBy(0.04);},key_shift_i:function(){goToPoint('in');},key_shift_left:function(){movePositionBy(-1);},key_shift_o:function(){goToPoint('out');},key_slash:function(){},key_shift_right:function(){movePositionBy(1);},key_space:togglePaused});self.chapters=getChapters();s
|
||
|
|
self.$timeline.options({subtitles:enableSubtitles?self.options.subtitles:[]});},volume:function(data){that.triggerEvent('volume',data);}}).appendTo(self.$player);self.$controls=Ox.Element().addClass('OxMedia').bindEvent({toggle:toggleControls});self.$timeline=getTimeline().appendTo(self.$controls);self.$videoPanel=Ox.SplitPanel({elements:[{element:self.$menubar,size:24},{element:self.$player},{collapsed:!self.options.showTimeline,collapsible:true,element:self.$controls,size:80,tooltip:self.options.timelineTooltip}],orientation:'vertical'});self.$clipPanel=Ox.ClipPanel({annotationsCalendarSize:self.options.annotationsCalendarSize,annotationsMapSize:self.options.annotationsMapSize,annotationsRange:self.options.annotationsRange,annotationsSort:self.options.annotationsSort,clipRatio:self.options.clipRatio,clips:Ox.clone(self.options.clips),clickLink:self.options.clickLink,duration:self.options.duration,editable:self.options.editable,formatTitle:self.options.formatTitle,getClipImageURL:self.options.getClipImageURL,'in':self.options['in'],layers:Ox.clone(self.options.layers),out:self.options.out,position:self.options.position,selected:self.options.selected,showAnnotationsCalendar:self.options.showAnnotationsCalendar,showAnnotationsMap:self.options.showAnnotationsMap,showLayers:self.options.showLayers,showUsers:self.options.showUsers,sort:Ox.clone(self.options.sort),sortOptions:self.options.sortOptions,view:self.options.clipView,width:self.options.clipSize}).bindEvent({copy:function(data){that.triggerEvent('copy',data);},copyadd:function(data){that.triggerEvent('copyadd',data);},cut:function(data){that.triggerEvent('cut',data);},cutadd:function(data){that.triggerEvent('cutadd',data);},'delete':function(data){that.triggerEvent('delete',data);},edit:function(data){that.triggerEvent('edit',data);},join:function(data){that.triggerEvent('join',data);},move:function(data){that.triggerEvent('move',data);},open:function(data){setPosition(getClipById(data.ids[0])['position']);that.triggerEvent('open',data);},paste:function(){that.triggerEvent('paste');},resize:resizeClips,resizeend:resizeendClips,select:function(data){self.options.selected=data.ids;that.triggerEvent('select',data);},selectannotation:function(data){that.triggerEvent('selectannotation',data);},sort:function(data){self.options.sort=data;that.triggerEvent('sort',data);},split:function(data){that.triggerEvent('split',data);},toggle:toggleClips,view:function(data){that.triggerEvent('view',data);}});that.setElement(self.$mainPanel=Ox.SplitPanel({elements:[{element:self.$videoPanel},{collapsed:!self.options.showClips,collapsible:true,element:self.$clipPanel,resizable:true,resize:self.listSizes,size:self.options.clipSize,tooltip:self.options.clipTooltip}],orientation:'horizontal'}));function dragTimeline(data){self.options.position=data.position;self.$video.options({position:self.options.position});self.$clipPanel.options({position:self.options.position});}
|
||
|
|
function dragendTimeline(data){dragTimeline(data);that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function getChapters(){return self.options.clips.map(function(clip){return{position:clip.position,title:self.options.formatTitle(clip)};});}
|
||
|
|
function getClipById(id){return Ox.getObjectById(self.options.clips,id);}
|
||
|
|
function getClipsInSelection(){var clips=self.options.clips.filter(function(clip){var endPosition=clip.position+clip.duration;return(clip.position>=self.options['in']&&endPosition<self.options.out)||(clip.position<=self.options['in']&&endPosition>self.options['in'])||(clip.position<self.options.out&&endPosition>=self.options.out)});return clips.map(function(clip,index){var dereference=false,endPosition=clip.position+clip.duration,inPoint=clip['in'],outPoint=clip.out;if(index==0&&clip.position<self.options['in']){dereference=true;inPoint=Ox.round(clip['in']+self.options['in']-clip.position,3);}
|
||
|
|
if(index==clips.length-1&&endPosition>self.options.out){dereference=true;outPoint=Ox.round(clip.out+self.options.out-endPosition,3);}
|
||
|
|
return clip.annotation&&!dereference?clip.annotation:clip.item+'/'+inPoint+'-'+outPoint;});}
|
||
|
|
function getCuts(){var cuts=[];self.options.clips.forEach(function(clip,i){if(i>0){cuts.push(clip.position);}
|
||
|
|
clip.cuts.forEach(function(cut){cuts.push(clip.position+cut-clip['in']);});});return cuts;}
|
||
|
|
function getNextPosition(type,direction){var positions;if(type=='chapter'){positions=self.chapters.map(function(chapter){return chapter.position;});}else if(type=='cut'){positions=[0].concat(self.cuts,self.options.duration);}
|
||
|
|
return Ox.nextValue(positions,self.options.position,direction);}
|
||
|
|
function getPlayerHeight(){return self.options.height-24-32
|
||
|
|
-self.options.showTimeline*80-1;}
|
||
|
|
function getPlayerWidth(){return self.options.width
|
||
|
|
-(self.options.showClips&&!self.fullscreen)*self.options.clipSize-1;}
|
||
|
|
function getTimeline(){return Ox.LargeVideoTimeline({chapters:self.chapters,cuts:self.cuts,duration:self.options.duration,getImageURL:self.options.getLargeTimelineURL,'in':self.options['in'],out:self.options.out,position:self.options.position,subtitles:self.options.enableSubtitles?self.options.subtitles:[],type:self.options.timeline,width:getTimelineWidth()}).css({left:'4px',top:'4px'}).bindEvent({key_left:function(){self.options.paused&&movePositionBy(-1/self.options.fps);},key_right:function(){self.options.paused&&movePositionBy(1/self.options.fps);},key_space:togglePaused,mousedown:that.gainFocus,position:dragendTimeline,positioning:dragTimeline,});}
|
||
|
|
function getTimelineWidth(){return self.options.width
|
||
|
|
-(self.options.showClips&&!self.fullscreen)*self.options.clipSize-16-1;}
|
||
|
|
function goToPoint(point){setPosition(self.options[point]);}
|
||
|
|
function movePositionBy(sec){setPosition(Ox.limit(self.options.position+sec,0,self.options.duration));}
|
||
|
|
function movePositionTo(type,direction){setPosition(getNextPosition(type,direction));}
|
||
|
|
function resizeClips(data){self.options.clipSize=data.size;self.$video.options({width:getPlayerWidth()});self.$timeline.options({width:getTimelineWidth()});self.$clipPanel.options({width:data.size});}
|
||
|
|
function resizeendClips(data){that.triggerEvent('clipSize',data);}
|
||
|
|
function setPoint(point,position,triggerEvent){self.options[point]=position;self.$video.options(point,position);self.$timeline.options(point,position);self.$clipPanel.options(point,position);if(self.options['in']>self.options.out){setPoint(point=='in'?'out':'in',position);}
|
||
|
|
if(triggerEvent){that.triggerEvent('points',{'in':self.options['in'],out:self.options.out,position:self.options.position});}}
|
||
|
|
function setPosition(position,playing,dragging){var minute=Math.floor(position/60),previousMinute=Math.floor(self.options.position/60);self.options.position=position;!playing&&self.$video.options({position:self.options.position});self.$timeline.options({position:self.options.position});self.$clipPanel.options({position:self.options.position});if((!playing||minute!=previousMinute)&&!dragging){that.triggerEvent('position',{position:!playing?self.options.position:minute*60});}}
|
||
|
|
function toggleClips(data){self.options.showClips=!data.collapsed;self.$video.options({width:getPlayerWidth()});self.$timeline.options({width:getTimelineWidth()});that.triggerEvent('toggleclips',{showClips:self.options.showClips});}
|
||
|
|
function toggleControls(data){self.options.showTimeline=!data.collapsed;self.$video.options({height:getPlayerHeight()});that.triggerEvent('toggletimeline',{showTimeline:self.options.showTimeline});}
|
||
|
|
function toggleMuted(){self.$video.toggleMuted();}
|
||
|
|
function togglePaused(){self.$video.togglePaused();self.$video.options('paused')&&that.triggerEvent('position',{position:self.$video.options('position')});}
|
||
|
|
that.getPasteIndex=function(){return self.$clipPanel.getPasteIndex();};that.getSelectedClips=function(){return self.options.selected.length?self.options.selected.map(function(id){var clip=getClipById(id);return(clip.annotation||clip.item+'/'+clip['in']+'-'+clip.out)+'/'+id;}):getClipsInSelection();};that.invertSelection=function(){self.$clipPanel.invertSelection();};that.selectAll=function(){self.$clipPanel.selectAll();};that.updateClip=function(id,data){self.options.clips[Ox.getIndexById(self.options.clips,id)]=data;self.$clipPanel.updateItem(id,data);};return that;};'use strict';(function(){var queue=[],queueSize=100,restrictedElements=[],requiresUserGesture=mediaPlaybackRequiresUserGesture(),unblock=[];Ox.VideoElement=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({autoplay:false,loop:false,muted:false,playbackRate:1,items:[],volume:1}).options(options||{}).update({items:function(){self.loadedMetadata=false;loadItems(function(){self.loadedMetadata=true;var update=true;if(self.currentItem>=self.numberOfItems){self.currentItem=0;}
|
||
|
|
if(!self.numberOfItems){self.video.src='';that.triggerEvent('durationchange',{duration:that.duration()});}else{if(self.currentItemId!=self.items[self.currentItem].id){self.items.some(function(item,i){if(item.id==self.currentItemId){self.currentItem=i;loadNextVideo();update=false;return true;}});if(update){self.currentItem=0;self.currentItemId=self.items[self.currentItem].id;}}
|
||
|
|
if(!update){that.triggerEvent('seeked');that.triggerEvent('durationchange',{duration:that.duration()});}else{setCurrentVideo(function(){that.triggerEvent('seeked');that.triggerEvent('durationchange',{duration:that.duration()});});}}});},playbackRate:function(){self.video.playbackRate=self.options.playbackRate;}}).css({width:'100%',height:'100%'});Ox.Log('Video','VIDEO ELEMENT OPTIONS',self.options);self.currentItem=0;self.currentTime=0;self.currentVideo=0;self.items=[];self.loadedMetadata=false;self.paused=true;self.seeking=false;self.loading=true;self.buffering=true;self.$videos=[getVideo(),getVideo()];self.$video=self.$videos[self.currentVideo];self.video=self.$video[0];self.volume=self.options.volume;self.muted=self.options.muted;self.$brightness=$('<div>').css({width:'100%',height:'100%',background:'rgb(0, 0, 0)',opacity:0}).appendTo(that);self.timeupdate=setInterval(function(){if(!self.paused&&!self.loading&&self.loadedMetadata&&self.items[self.currentItem]&&self.items[self.currentItem].out&&self.video.currentTime>=self.items[self.currentItem].out){setCurrentItem(self.currentItem+1);}},30);if(restrictedElements.length>0){unblock.push(setSource);setTimeout(function(){that.triggerEvent('requiresusergesture');})}else{setSource();}
|
||
|
|
function getCurrentTime(){var item=self.items[self.currentItem];return self.seeking||self.loading?self.currentTime:item?item.position+self.video.currentTime-item['in']:0;}
|
||
|
|
function getset(key,value){var ret;if(Ox.isUndefined(value)){ret=self.video[key];}else{self.video[key]=value;ret=that;}
|
||
|
|
return ret;}
|
||
|
|
function getVideo(){return getVideoElement().css({position:'absolute'}).on({ended:function(){if(self.video==this){setCurrentItem(self.currentItem+1);}},loadedmetadata:function(){},progress:function(){var video=this,item=self.items[self.currentItem],nextItem=Ox.mod(self.currentItem+1,self.numberOfItems),next=self.items[nextItem],nextVideo=self.$videos[Ox.mod(self.currentVideo+1,self.$videos.length)][0];if(self.video==video&&(video.preload!='none'||self.buffering)){if(clipCached(video,item)){self.video.preload='none';self.buffering=false;if(nextVideo!=self.video){nextVideo.preload='auto';}}}else if(!self.buffering&&nextVideo==video&&video.preload!='none'){if(clipCached(video,next)){video.preload='none';}}
|
||
|
|
function clipCached(video,item){var cached=false
|
||
|
|
Ox.range(video.buffered.length).forEach(function(i){if(video.buffered.start(i)<=item['in']&&self.video.buffered.end(i)>=item.out){cached=true}});return cached}},seeking:function(){},stop:function(){if(self.video==this){self.video.pause();that.triggerEvent('ended');}}}).attr({preload:'auto'}).hide().appendTo(that);}
|
||
|
|
function getVideoElement(){var video;if(requiresUserGesture){if(queue.length){video=queue.pop();}else{video=document.createElement('video');restrictedElements.push(video);}}else{video=document.createElement('video');}
|
||
|
|
video.playsinline=true
|
||
|
|
video.setAttribute('playsinline','playsinline')
|
||
|
|
video.setAttribute('webkit-playsinline','webkit-playsinline')
|
||
|
|
video.WebKitPlaysInline=true
|
||
|
|
return $(video);};function getVolume(){var volume=1;if(self.items[self.currentItem]&&Ox.isNumber(self.items[self.currentItem].volume)){volume=self.items[self.currentItem].volume;}
|
||
|
|
return self.volume*volume;}
|
||
|
|
function isReady($video,callback){if($video[0].seeking&&!self.paused&&!self.seeking){that.triggerEvent('seeking');Ox.Log('Video','isReady','seeking');$video.one('seeked',function(event){Ox.Log('Video','isReady','seeked');that.triggerEvent('seeked');callback($video[0]);});}else if($video[0].readyState){callback($video[0]);}else{that.triggerEvent('seeking');$video.one('loadedmetadata',function(event){callback($video[0]);});$video.one('seeked',function(event){that.triggerEvent('seeked');});}}
|
||
|
|
function loadItems(callback){var currentTime=0,items=self.options.items.map(function(item){return Ox.isObject(item)?Ox.clone(item,true):{src:item};});Ox.serialForEach(items,function(item){var callback=Ox.last(arguments);item['in']=item['in']||0;item.position=currentTime;if(item.out){item.duration=item.out-item['in'];}
|
||
|
|
if(item.duration){if(!item.out){item.out=item.duration;}
|
||
|
|
currentTime+=item.duration;item.id=getId(item);callback()}else{Ox.getVideoInfo(item.src,function(info){item.duration=info.duration;if(!item.out){item.out=item.duration;}
|
||
|
|
currentTime+=item.duration;item.id=getId(item);callback();});}},function(){self.items=items;self.numberOfItems=self.items.length;callback&&callback();});function getId(item){return item.id||item.src+'/'+item['in']+'-'+item.out;}}
|
||
|
|
function loadNextVideo(){if(self.numberOfItems<=1){return;}
|
||
|
|
var item=self.items[self.currentItem],nextItem=Ox.mod(self.currentItem+1,self.numberOfItems),next=self.items[nextItem],$nextVideo=self.$videos[Ox.mod(self.currentVideo+1,self.$videos.length)],nextVideo=$nextVideo[0];$nextVideo.one('loadedmetadata',function(){if(self.video!=nextVideo){nextVideo.currentTime=next['in']||0;}});nextVideo.src=next.src;nextVideo.preload='auto';}
|
||
|
|
function setCurrentItem(item){Ox.Log('Video','sCI',item,self.numberOfItems);var interval;if(item>=self.numberOfItems||item<0){if(self.options.loop){item=Ox.mod(item,self.numberOfItems);}else{self.seeking=false;self.ended=true;self.paused=true;self.video&&self.video.pause();that.triggerEvent('ended');return;}}
|
||
|
|
self.video&&self.video.pause();self.currentItem=item;self.currentItemId=self.items[self.currentItem].id;setCurrentVideo(function(){if(!self.loadedMetadata){self.loadedMetadata=true;that.triggerEvent('loadedmetadata');}
|
||
|
|
Ox.Log('Video','sCI','trigger itemchange',self.items[self.currentItem]['in'],self.video.currentTime,self.video.seeking);that.triggerEvent('sizechange');that.triggerEvent('itemchange',{item:self.currentItem});});}
|
||
|
|
function setCurrentVideo(callback){var css={},muted=self.muted,item=self.items[self.currentItem],next;Ox.Log('Video','sCV',item);['left','top','width','height'].forEach(function(key){css[key]=self.$videos[self.currentVideo].css(key);});self.currentTime=item.position;self.loading=true;if(self.video){self.$videos[self.currentVideo].hide();self.video.pause();}
|
||
|
|
self.currentVideo=Ox.mod(self.currentVideo+1,self.$videos.length);self.$video=self.$videos[self.currentVideo];self.video=self.$video[0];self.video.muted=true;if(self.$video.attr('src')!=item.src){self.loadedMetadata&&Ox.Log('Video','caching next item failed, reset src');self.video.src=item.src;}
|
||
|
|
self.video.preload='auto';self.video.volume=getVolume();self.video.playbackRate=self.options.playbackRate;self.$video.css(css);self.buffering=true;Ox.Log('Video','sCV',self.video.src,item['in'],self.video.currentTime,self.video.seeking);isReady(self.$video,function(video){var in_=item['in']||0;function ready(){Ox.Log('Video','sCV','ready');self.seeking=false;self.loading=false;self.video.muted=muted;!self.paused&&self.video.play();self.$video.show();callback&&callback();loadNextVideo();}
|
||
|
|
if(video.currentTime==in_){Ox.Log('Video','sCV','already at position');ready();}else{self.$video.one('seeked',function(){Ox.Log('Video','sCV','seeked callback');ready();});if(!self.seeking){Ox.Log('Video','sCV set in',video.src,in_,video.currentTime,video.seeking);self.seeking=true;video.currentTime=in_;if(self.paused){var promise=self.video.play();if(promise!==undefined){promise.then(function(){self.video.pause();self.video.muted=muted;}).catch(function(){self.video.pause();self.video.muted=muted;});}else{self.video.pause();self.video.muted=muted;}}}}});}
|
||
|
|
function setCurrentItemTime(currentTime){Ox.Log('Video','sCIT',currentTime,self.video.currentTime,'delta',currentTime-self.video.currentTime);isReady(self.$video,function(video){if(self.video==video){if(self.video.seeking){self.$video.one('seeked',function(){that.triggerEvent('seeked');self.seeking=false;});}else if(self.seeking){that.triggerEvent('seeked');self.seeking=false;}
|
||
|
|
video.currentTime=currentTime;}});}
|
||
|
|
function setCurrentTime(time){Ox.Log('Video','sCT',time);var currentTime,currentItem;self.items.forEach(function(item,i){if(time>=item.position&&time<item.position+item.duration){currentItem=i;currentTime=time-item.position+item['in'];return false;}});if(self.items.length){if(Ox.isUndefined(currentItem)&&Ox.isUndefined(currentTime)){currentItem=self.items.length-1;currentTime=self.items[currentItem].duration+self.items[currentItem]['in'];}
|
||
|
|
Ox.Log('Video','sCT',time,'=>',currentItem,currentTime);if(currentItem!=self.currentItem){setCurrentItem(currentItem);}
|
||
|
|
self.seeking=true;self.currentTime=time;that.triggerEvent('seeking');setCurrentItemTime(currentTime);}else{self.currentTime=0;}}
|
||
|
|
function setSource(){Ox.Log('Video','self.loadedMetadata',self.loadedMetadata);self.loadedMetadata=false;loadItems(function(){setCurrentItem(0);self.options.autoplay&&setTimeout(function(){that.play();});});}
|
||
|
|
that.animate=function(){self.$video.animate.apply(self.$video,arguments);return that;};that.brightness=function(){var ret;if(arguments.length==0){ret=1-parseFloat(self.$brightness.css('opacity'));}else{self.$brightness.css({opacity:1-arguments[0]});ret=that;}
|
||
|
|
return ret;};that.buffered=function(){return self.video.buffered;};that.currentTime=function(){var ret;if(arguments.length==0){ret=getCurrentTime();}else{self.ended=false;setCurrentTime(arguments[0]);ret=that;}
|
||
|
|
return ret;};that.css=function(){self.$video.css.apply(self.$video,arguments);return that;};that.duration=function(){return self.items?Ox.sum(self.items.map(function(item){return item.duration;})):NaN;};that.muted=function(value){if(!Ox.isUndefined(value)){self.muted=value;}
|
||
|
|
return getset('muted',value);};that.pause=function(){self.paused=true;self.video.pause();return that;};that.play=function(){if(self.ended){that.currentTime(0);}
|
||
|
|
isReady(self.$video,function(video){self.ended=false;self.paused=false;self.seeking=false;video.play();});return that;};that.removeElement=function(){self.currentTime=getCurrentTime();self.loading=true;clearInterval(self.timeupdate);self.$videos.forEach(function($video){$video.attr({src:''});});return Ox.Element.prototype.removeElement.apply(that,arguments);};that.videoHeight=function(){return self.video.videoHeight;};that.videoWidth=function(){return self.video.videoWidth;};that.volume=function(value){if(Ox.isUndefined(value)){value=self.volume}else{self.volume=value;self.video.volume=getVolume();}
|
||
|
|
return value;};return that;};function mediaPlaybackRequiresUserGesture(){var video=document.createElement('video');video.play();return video.paused;}
|
||
|
|
function removeBehaviorsRestrictions(){if(restrictedElements.length>0){var rElements=restrictedElements;restrictedElements=[];rElements.forEach(function(video){video.load();});setTimeout(function(){var u=unblock;unblock=[];u.forEach(function(callback){callback();});},1000);}
|
||
|
|
while(queue.length<queueSize){var video=document.createElement('video');video.load();queue.push(video);}}
|
||
|
|
if(requiresUserGesture){window.addEventListener('keydown',removeBehaviorsRestrictions);window.addEventListener('mousedown',removeBehaviorsRestrictions);window.addEventListener('touchstart',removeBehaviorsRestrictions);}})();'use strict';Ox.VideoPlayer=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({annotations:[],audioTrack:'',brightness:1,censored:[],censoredIcon:'',censoredTooltip:'',controlsBottom:[],controlsTooltips:{},controlsTop:[],duration:0,enableDownload:false,enableFind:false,enableFullscreen:false,enableKeyboard:false,enableMouse:false,enablePosition:false,enableSubtitles:false,enableTimeline:false,externalControls:false,find:'',focus:'click',format:'',fps:25,fullscreen:false,height:144,'in':0,logo:'',logoLink:'',logoTitle:'',loop:false,muted:false,paused:false,playbackRate:1,playInToOut:false,position:0,poster:'',posterFrame:-1,out:0,resolution:0,rewind:false,scaleToFill:false,showControlsOnLoad:false,showFind:false,showHours:false,showIcon:false,showIconOnLoad:false,showLargeTimeline:false,showMarkers:false,showMilliseconds:0,showProgress:false,sizeIsLarge:false,subtitles:[],subtitlesDefaultTrack:'English',subtitlesOffset:0,subtitlesTrack:'English',timeline:'',timelineType:'',timelineTypes:[],title:'',type:'play',video:'',volume:1,width:256}).options(options||{}).update({audioTrack:setAudioTrack,enableSubtitles:setSubtitlesTrack,find:setSubtitleText,fullscreen:function(){self.options.fullscreen=!self.options.fullscreen;toggleFullscreen();},height:function(){setSizes();},'in':function(){self.options.paused&&setMarkers();self.$timeline&&self.$timeline.options('in',self.options['in']);},out:function(){self.options.paused&&setMarkers();self.$timeline&&self.$timeline.options({out:self.options.out});},muted:function(){self.options.muted=!self.options.muted;toggleMuted();},paused:function(){self.options.paused=!self.options.paused;togglePaused();},playbackRate:function(){self.$video.options({playbackRate:self.options.playbackRate});},position:function(){setPosition(self.options.position);},posterFrame:function(){self.options.paused&&setMarkers();},resolution:setResolution,scaleToFill:function(){self.options.scaleToFill=!self.options.scaleToFill;toggleScale();},sizeIsLarge:function(){self.$sizeButton.toggle();},subtitles:function(){loadSubtitles();self.$settings&&self.$settings.replaceWith(self.$settings=renderSettings());},subtitlesTrack:setSubtitlesTrack,timeline:function(){self.$timeline.options({imageURL:self.options.timeline});},video:function(){setVideo();self.$video.options({items:self.video});},volume:function(){setVolume(self.options.volume);},width:function(){setSizes();}}).addClass('OxVideoPlayer');Ox.$window.on({resize:function(){self.options.fullscreen&&setSizes();}});Ox.Fullscreen.bind('change',function(){setTimeout(function(){setSizes(self.options.fullscreen);},250);});if(Ox.isEmpty(self.options.annotations)){self.options.annotations=self.options.subtitles;}
|
||
|
|
if(Ox.isObject(self.options.video[0])&&'index'in self.options.video[0]){self.options.video=Ox.sortBy(self.options.video,'index');}
|
||
|
|
setVideo();if(self.options.playInToOut){self['in']=self.options['in'];self.out=self.options.out;self.options.duration=self.out-self['in'];}else{self['in']=0;self.out=self.options.duration||86399;}
|
||
|
|
self.options.position=Ox.limit(self.options.position,self['in'],self.out);if(!self.options.paused){self.options.showIconOnLoad=false;}
|
||
|
|
self.hasVolumeControl=self.options.controlsTop.indexOf('volume')>-1||self.options.controlsBottom.indexOf('volume')>-1;self.millisecondsPerFrame=1000/self.options.fps;self.secondsPerFrame=1/self.options.fps;self.barHeight=16;self.width=self.options.fullscreen?window.innerWidth:self.options.width;self.height=self.options.fullscreen?window.innerHeight:self.options.height;self.videoWidth=self.options.width;self.videoHeight=self.options.height;self.results=[];loadSubtitles();if(self.options.enableKeyboard){that.bindEvent({key_0:toggleMuted,key_1:toggleScale,key_down:function(){goToNext('chapter',1);},key_equal:function(){changeVolume(0.1);},key_escape:hideControlMenus,key_f:focusFind,key_g:function(){goToNext('result',1);},key_k:function togglePlaybackRate(){that.options({playbackRate:self.options.playbackRate==1?2:self.options.playbackRate==2?0.5:1});},key_l:toggleLoop,key_left:function(){setPosition(self.options.position-self.secondsPerFrame);that.triggerEvent('position',{position:self.options.position});},key_minus:function(){changeVolume(-0.1);},key_p:playInToOut,key_right:function(){setPosition(self.options.position+self.secondsPerFrame);that.triggerEvent('position',{position:self.options.position});},key_shift_f:function(){self.options.enableFullscreen&&toggleFullscreen();},key_shift_g:function(){goToNext('result',-1);},key_shift_left:function(){setPosition(self.options.position-1);that.triggerEvent('position',{position:self.options.position});},key_shift_right:function(){setPosition(self.options.position+1);that.triggerEvent('position',{position:self.options.position});},key_space:togglePaused,key_up:function(){goToNext('chapter',-1);}});if(self.options.focus=='mouseenter'){that.on({mouseenter:function(){if(!self.inputHasFocus){that.gainFocus();}},mouseleave:function(){that.loseFocus();}});}else{that.on({click:function(){if(!Ox.Focus.focusedElementIsInput()){that.gainFocus();}}});}}
|
||
|
|
if((!self.options.externalControls&&(self.options.controlsTop.length||self.options.controlsBottom.length))){that.on({mouseenter:function(){showControls();self.mouseHasLeft=false;},mouseleave:function(){hideControls();self.mouseHasLeft=true;}});}
|
||
|
|
self.$videoContainer=Ox.Element().addClass('OxVideoContainer').css({top:self.options.externalControls&&self.options.controlsTop.length?'16px':0}).appendTo(that)
|
||
|
|
if(self.options.type=='play'){self.options.enableMouse&&self.$videoContainer.bindEvent({anyclick:function(e){var $target=$(e.target);if(!$target.is('.OxLogo')&&!$target.is('.OxCensoredIcon')){togglePaused();}},dragstart:dragstart,drag:drag,dragend:dragend});self.$video=Ox.VideoElement({items:self.video,loop:self.options.loop,muted:self.options.muted,playbackRate:self.options.playbackRate,volume:self.options.volume}).bindEvent(Ox.extend({durationchange:durationchange,ended:ended,itemchange:itemchange,loadedmetadata:loadedmetadata,requiresusergesture:requiresusergesture,seeked:seeked,seeking:seeking,sizechange:sizechange},self.options.progress?{progress:progress}:{})).appendTo(self.$videoContainer);self.$video.$element.css({position:'absolute'});self.$video.hide();}else{self.options.enableMouse&&self.$videoContainer.on({click:function(e){if(!$(e.target).is('.OxLogo')){goToPoint();}}});self.$video=$('<div>').appendTo(self.$videoContainer);self.$image=$('<img>').attr({src:Ox.UI.PATH+'png/transparent.png'}).css({position:'absolute',width:'100%',height:'100%'}).appendTo(self.$video)
|
||
|
|
self.$brightness=$('<div>').css({position:'absolute',width:'100%',height:'100%',background:'rgb(0, 0, 0)',opacity:1-self.options.brightness}).appendTo(self.$video);}
|
||
|
|
if(self.options.poster){self.$poster=$('<img>').addClass('OxPoster').attr({src:self.options.poster}).hide().one({load:function(){self.$poster.css(getVideoCSS(self.$poster[0].width,self.$poster[0].height)).show();self.posterIsVisible=true;}}).appendTo(self.$videoContainer);}
|
||
|
|
if(self.options.logo){self.$logo=$('<img>').addClass('OxLogo').attr({src:self.options.logo}).css({cursor:self.options.logoLink?'pointer':'default'}).appendTo(self.$videoContainer);if(self.options.logoTitle){self.$logoTooltip=Ox.Tooltip({title:self.options.logoTitle});}}
|
||
|
|
self.$loadingIcon=Ox.LoadingIcon({video:true}).hide().appendTo(self.$videoContainer);if(!Ox.isEmpty(Ox.isObject(self.options.video[0])?getVideo():self.options.video)){showLoadingIcon();}
|
||
|
|
if(self.options.showIcon||self.options.showIconOnLoad){self.$playIcon=$('<img>').addClass('OxPlayIcon OxVideo').attr({src:Ox.UI.getImageURL('symbol'+(self.options.paused?'Play':'Pause'),'videoIcon')}).appendTo(self.$videoContainer);if(self.options.showIcon){self.$playIcon.addClass('OxInterface');}
|
||
|
|
if(self.options.showIconOnLoad){self.iconIsVisible=true;}}
|
||
|
|
if(self.options.censored.length){self.$copyrightIcon=Ox.Element({element:'<img>',tooltip:self.options.censoredTooltip}).addClass('OxCensoredIcon OxVideo').attr({src:Ox.UI.getImageURL('symbol'+self.options.censoredIcon,'videoIcon')}).hide().bindEvent({singleclick:function(){that.triggerEvent('censored');}}).appendTo(self.$videoContainer);}
|
||
|
|
if(self.options.showMarkers){self.$posterMarker={};['left','center','right'].forEach(function(position){var titleCase=Ox.toTitleCase(position);self.$posterMarker[position]=$('<div>').addClass('OxPosterMarker OxPosterMarker'+titleCase).appendTo(self.$videoContainer);});self.$pointMarker={};['in','out'].forEach(function(point){self.$pointMarker[point]={};['top','bottom'].forEach(function(edge){var titleCase=Ox.toTitleCase(point)+Ox.toTitleCase(edge);self.$pointMarker[point][edge]=$('<img>').addClass('OxPointMarker OxPointMarker'+titleCase).attr({src:Ox.UI.getImageURL('marker'+titleCase)}).appendTo(self.$videoContainer);});});}
|
||
|
|
if(self.options.subtitles.length||true){self.$subtitle=$('<div>').addClass('OxSubtitle').appendTo(self.$videoContainer);}
|
||
|
|
['top','bottom'].forEach(function(edge){var titleCase=Ox.toTitleCase(edge);if(self.options['controls'+titleCase].length){self['$controls'+titleCase]=Ox.Bar({size:self.barHeight}).addClass('OxControls'+(self.options.externalControls?'':' OxOnScreen')).css({opacity:self.options.externalControls?1:0}).css(edge,0).appendTo(that);self.options['controls'+titleCase].forEach(function(control){if(control=='chapterTitle'){self.$chapterTitle=$('<div>').addClass('OxTitle').html(getChapterTitle()).appendTo(self['$controls'+titleCase].$element);}else if(control=='close'){self.$closeButton=Ox.Button({style:'video',title:'close',tooltip:Ox._('Close'),type:'image'}).bindEvent({click:function(){that.triggerEvent('close');}}).appendTo(self['$controls'+titleCase]);}else if(control=='find'){self.$findButton=Ox.Button({style:'video',title:'find',tooltip:Ox._('Find'),type:'image'}).bindEvent({click:toggleFind}).appendTo(self['$controls'+titleCase]);}else if(control=='fullscreen'){self.$fullscreenButton=Ox.Button({style:'video',tooltip:[Ox._('Enter Fullscreen'),Ox._('Exit Fullscreen')],type:'image',value:self.options.fullscreen?'shrink':'grow',values:['grow','shrink']}).bindEvent({click:function(){toggleFullscreen('button');}}).appendTo(self['$controls'+titleCase]);}else if(control=='goto'){self.$setButton=Ox.Button({style:'video',title:'goTo'+Ox.toTitleCase(self.options.type),tooltip:Ox._('Go to '+Ox.toTitleCase(self.options.type)
|
||
|
|
+' Point'),type:'image'}).bindEvent({click:goToPoint}).appendTo(self['$controls'+titleCase]);}else if(control=='loop'){self.$loopButton=Ox.Button({style:'video',tooltip:[Ox._('Don\'t Loop'),Ox._('Loop')],type:'image',value:self.options.loop?'RepeatAll':'RepeatNone',values:['RepeatAll','RepeatNone']}).bindEvent({click:function(){toggleLoop('button');}}).appendTo(self['$controls'+titleCase]);}else if(control=='mute'){self.$muteButton=Ox.Button({style:'video',tooltip:[Ox._('Mute'),Ox._('Unmute')],type:'image',value:self.options.muted?'unmute':'mute',values:['mute','unmute']}).bindEvent({click:function(){toggleMuted('button');}}).appendTo(self['$controls'+titleCase]);}else if(control=='next'){self.$nextChapterButton=Ox.Button({style:'video',title:'playNext',tooltip:Ox._('Next'),type:'image'}).bindEvent({click:function(){goToNext('chapter',1);}}).appendTo(self['$controls'+titleCase]);}else if(control=='open'){self.$openButton=Ox.Button({style:'video',title:'arrowRight',tooltip:self.options.controlsTooltips.open||'',type:'image'}).bindEvent({click:function(){that.triggerEvent('open');}}).appendTo(self['$controls'+titleCase]);}else if(control=='play'){self.$playButton=Ox.Button({style:'video',tooltip:[Ox._('Play'),Ox._('Pause')],type:'image',value:self.options.paused?'play':'pause',values:['play','pause']}).bindEvent({click:function(){togglePaused('button');}}).appendTo(self['$controls'+titleCase]);}else if(control=='playInToOut'){self.$playInToOutButton=Ox.Button({style:'video',title:'playInToOut',tooltip:Ox._('Play In to Out'),type:'image'}).bindEvent({click:playInToOut}).appendTo(self['$controls'+titleCase]);}else if(control=='position'){self.positionWidth=getPositionWidth();self.$position=Ox.Element({tooltip:Ox._(self.options.type=='play'?'Position':self.options.type=='in'?'In Point':'Out Point')}).addClass('OxPosition').css({width:self.positionWidth-4+'px'}).html(formatPosition()).on({click:function(){if(self.options.enablePosition){if(self.options.type=='play'){if(!self.options.paused){self.playOnSubmit=true;togglePaused();}else if(self.playOnLoad){self.playOnLoad=false;self.playOnSubmit=true;}}
|
||
|
|
self.$position.hide();self.$positionInput.value(formatPosition()).show().focusInput(false);}}}).appendTo(self['$controls'+titleCase]);self.$positionInput=Ox.Input({value:formatPosition(),width:self.positionWidth}).addClass('OxPositionInput').bindEvent({focus:function(){self.inputHasFocus=true;},blur:function(){self.inputHasFocus=false;submitPositionInput();},submit:function(){self.inputHasFocus=false;submitPositionInput();}}).appendTo(self['$controls'+titleCase].$element);self.$positionInput.children('input').css({width:(self.positionWidth-6)+'px',fontSize:'9px'});}else if(control=='previous'){self.$previousChapterButton=Ox.Button({style:'video',title:'playPrevious',tooltip:Ox._('Previous'),type:'image'}).bindEvent({click:function(){goToNext('chapter',-1);}}).appendTo(self['$controls'+titleCase]);}else if(control=='scale'){self.$scaleButton=Ox.Button({style:'video',tooltip:[Ox._('Scale to Fill'),Ox._('Scale to Fit')],type:'image',value:self.options.scaleToFill?'fit':'fill',values:['fill','fit']}).bindEvent('change',function(){toggleScale('button');}).appendTo(self['$controls'+titleCase]);}else if(control=='set'){self.$setButton=Ox.Button({style:'video',title:'set'+Ox.toTitleCase(self.options.type),tooltip:Ox._('Set '+Ox.toTitleCase(self.options.type)
|
||
|
|
+' Point'),type:'image'}).bindEvent({click:setPoint}).appendTo(self['$controls'+titleCase]);}else if(control=='settings'){self.$settingsButton=Ox.Button({style:'video',title:'set',tooltip:Ox._('Settings'),type:'image'}).bindEvent({click:function(){self.$settings.toggle();}}).appendTo(self['$controls'+titleCase]);self.$settings=renderSettings().appendTo(that);}else if(control=='size'){self.$sizeButton=Ox.Button({style:'video',tooltip:[Ox._('Larger'),Ox._('Smaller')],type:'image',value:self.options.sizeIsLarge?'shrink':'grow',values:['grow','shrink']}).bindEvent('change',toggleSize).appendTo(self['$controls'+titleCase]);}else if(control=='space'){self['$space'+titleCase]=$('<div>').html(' ').appendTo(self['$controls'+titleCase].$element);}else if(Ox.startsWith(control,'space')){$('<div>').css({width:parseInt(control.substr(5))+'px',height:'16px'}).appendTo(self['$controls'+titleCase].$element);}else if(control=='timeline'){if(self.options.duration){self.$timeline=getTimeline()}else{self.$timeline=Ox.Element().html(' ');}
|
||
|
|
self.$timeline.appendTo(self['$controls'+titleCase]);}else if(control=='title'){self.$title=$('<div>').addClass('OxTitle').html(self.options.title).appendTo(self['$controls'+titleCase].$element);}else if(control=='volume'){self.$volumeButton=Ox.Button({style:'video',title:getVolumeImage(),tooltip:Ox._('Volume'),type:'image'}).bindEvent({click:toggleVolume}).appendTo(self['$controls'+titleCase]);}else if(control=='zapHome'){self.$zapHomeButton=Ox.Button({style:'video',title:'up',tooltip:Ox._('Home Channel'),type:'image'}).bindEvent({click:function(){that.triggerEvent('zap',{direction:0});}}).appendTo(self['$controls'+titleCase]);}else if(control=='zapNext'){self.$zapNextButton=Ox.Button({style:'video',title:'right',tooltip:Ox._('Next Channel'),type:'image'}).bindEvent({click:function(){that.triggerEvent('zap',{direction:1});}}).appendTo(self['$controls'+titleCase]);}else if(control=='zapPrevious'){self.$zapPreviousButton=Ox.Button({style:'video',title:'left',tooltip:Ox._('Previous Channel'),type:'image'}).bindEvent({click:function(){that.triggerEvent('zap',{direction:-1});}}).appendTo(self['$controls'+titleCase]);}});}});if(self.options.enableFind){self.$find=$('<div>').addClass('OxControls OxFind').css({top:self.options.controlsTop.length?'16px':0}).appendTo(that);self.$results=Ox.Element({tooltip:Ox._('Results')}).addClass('OxResults').html('0').appendTo(self.$find);self.$previousResultButton=Ox.Button({disabled:true,style:'symbol',title:'arrowLeft',tooltip:Ox._('Previous'),type:'image'}).bindEvent({click:function(){goToNext('result',-1);}}).appendTo(self.$find);self.$nextResultButton=Ox.Button({disabled:true,style:'symbol',title:'arrowRight',tooltip:Ox._('Next'),type:'image'}).bindEvent({click:function(){goToNext('result',1);}}).appendTo(self.$find);self.$findInput=Ox.Input({changeOnKeypress:true,value:self.options.find}).bindEvent({blur:function(){self.inputHasFocus=false;},focus:function(){self.inputHasFocus=true;},change:function(data){submitFindInput(data.value,false);},submit:function(data){self.inputHasFocus=false;submitFindInput(data.value,true);}}).appendTo(self.$find);self.$clearButton=Ox.Button({disabled:!self.options.find,style:'symbol',title:'delete',tooltip:Ox._('Clear'),type:'image'}).bindEvent({click:function(){self.options.find='';self.results=[];self.$results.html('0');self.$findInput.clearInput();self.subtitle&&setSubtitleText();self.$timeline&&self.$timeline.options({find:self.options.find,results:self.results});}}).appendTo(self.$find);self.$hideFindButton=Ox.Button({style:'symbol',title:'close',tooltip:Ox._('Hide'),type:'image'}).bindEvent({click:toggleFind}).appendTo(self.$find);}
|
||
|
|
if(self.hasVolumeControl){self.$volume=$('<div>').addClass('OxControls OxVolume').css({bottom:self.options.controlsBottom.length?'16px':0}).appendTo(that);self.$hideVolumeButton=Ox.Button({style:'symbol',title:'close',tooltip:Ox._('Hide'),type:'image'}).bindEvent({click:toggleVolume}).appendTo(self.$volume);self.$muteButton=Ox.Button({style:'symbol',tooltip:[Ox._('Mute'),Ox._('Unmute')],type:'image',value:self.options.muted?'unmute':'mute',values:['mute','unmute']}).bindEvent({click:function(){toggleMuted('button');}}).appendTo(self.$volume);self.$volumeInput=Ox.Range({changeOnDrag:true,max:1,min:0,step:0.001,value:self.options.muted?0:self.options.volume}).bindEvent({change:function(data){setVolume(data.value);}}).appendTo(self.$volume);self.$volumeValue=$('<div>').addClass('OxVolumeValue').html(self.options.muted?0:Math.round(self.options.volume*100)).appendTo(self.$volume);}
|
||
|
|
self.options.type!='play'&&setPosition(self.options.position);self.results=[];setSizes(false,function(){self.options.fullscreen&&enterFullscreen();});function censor(){if(self.options.type=='play'){self.$video.brightness(self.censored?0.05:self.options.brightness).volume(self.censored?0.01:self.options.volume);}else{self.$brightness.css({opacity:1-(self.censored?0.05:self.options.brightness)});}
|
||
|
|
self.$copyrightIcon[self.censored?'show':'hide']();}
|
||
|
|
function changeVolume(num){self.hasVolumeControl&&showVolume();self.options.volume=Ox.limit(self.options.volume+num,0,1);setVolume(self.options.volume);self.$volumeInput&&self.$volumeInput.value(self.options.volume);}
|
||
|
|
function clearInterfaceTimeout(){clearTimeout(self.interfaceTimeout);self.interfaceTimeout=0;}
|
||
|
|
function dragstart(){Ox.$body.addClass('OxDragging');self.drag={position:self.options.position,paused:self.options.paused}
|
||
|
|
!self.options.paused&&togglePaused();}
|
||
|
|
function drag(e){setPosition(self.drag.position-e.clientDX/25);that.triggerEvent('positioning',{position:self.options.position});}
|
||
|
|
function dragend(){Ox.$body.removeClass('OxDragging');!self.drag.paused&&togglePaused();that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function durationchange(){self.videoWidth=self.$video.videoWidth();self.videoHeight=self.$video.videoHeight();self.videoCSS=getVideoCSS();self.posterMarkerCSS=getPosterMarkerCSS();self.$video.css(self.videoCSS);self.$poster&&self.$poster.css(self.videoCSS);self.$posterMarker&&Ox.forEach(self.$posterMarker,function(marker,position){marker.css(self.posterMarkerCSS[position]);});self.out=self.options.playInToOut&&self.out<self.$video.duration()?self.out:self.$video.duration();self.options.duration=self.out-self['in'];self.$timeline&&self.$timeline.replaceWith(self.$timeline=getTimeline());if(self.loadedMetadata){setPosition(self.$video.currentTime());}else{self.loadedMetadata=true;setPosition(self.options.position);if(self.options.paused&&self.playOnLoad){self.playOnLoad=false;togglePaused('button');}}
|
||
|
|
self.$subtitle&&self.$subtitle.animate({bottom:getCSS('subtitle').bottom},250);that.triggerEvent('durationchange',{duration:self.options.duration});}
|
||
|
|
function ended(){!self.options.paused&&togglePaused();if(self.options.poster){self.$poster.animate({opacity:1},250);self.posterIsVisible=true;}
|
||
|
|
if(self.options.showIconOnLoad){self.$playIcon.animate({opacity:1},250);self.iconIsVisible=true;}
|
||
|
|
self.options.rewind&&setTimeout(rewind,250);that.triggerEvent('ended');}
|
||
|
|
function enterFullscreen(){that.on({mousemove:function(){showControls();hideControls();}});showControls();hideControls();that.find('.OxControls').on({mouseenter:function(){self.mouseIsInControls=true;},mouseleave:function(){self.mouseIsInControls=false;}});that.gainFocus();}
|
||
|
|
function find(query){var results=[];if(query.length){query=query.toLowerCase();results=Ox.filter(self.options.annotations,function(annotation){return Ox.decodeHTMLEntities(Ox.stripTags(annotation.text.toLowerCase())).indexOf(query)>-1;}).map(function(annotation){return{id:annotation.id,'in':annotation['in'],out:annotation.out};})
|
||
|
|
results=Ox.filter(self.options.annotations,function(annotation){return Ox.decodeHTMLEntities(Ox.stripTags(annotation.text.toLowerCase())).indexOf(query)>-1;}).map(function(annotation){return{id:annotation.id,'in':annotation['in'],out:annotation.out};});}
|
||
|
|
return results;}
|
||
|
|
function focusFind(){!self.interfaceIsVisible&&showControls();setTimeout(function(){if(self.$find.is(':hidden')){toggleFind();}else{self.$findInput.focusInput(true);}},0);}
|
||
|
|
function formatPosition(position){position=Ox.isUndefined(position)?self.options.position:position;return Ox.formatDuration(position,self.options.showMilliseconds);}
|
||
|
|
function getCensored(){var censored=false;Ox.forEach(self.options.censored,function(v){if(v['in']<self.options.position&&v.out>self.options.position){censored=true;return false;}});return censored;}
|
||
|
|
function getChapterTitle(){var chapterTitle='';self.options.chapters&&Ox.forEach(self.options.chapters,function(v,i){if(v.position<=self.options.position&&(i==self.options.chapters.length-1||self.options.chapters[i+1].position>self.options.position)){chapterTitle=v.title;return false;}});return chapterTitle;}
|
||
|
|
function getCSS(element){var css;if(element=='copyrightIcon'){css={width:self.iconSize+'px',height:self.iconSize+'px'};}else if(element=='controlsTop'||element=='controlsBottom'){css={width:self.width+'px'};}else if(element=='find'){css={width:Math.min(216,self.width)+'px'};}else if(element=='loadingIcon'){css={width:self.iconSize+'px',height:self.iconSize+'px'};}else if(element=='logo'){var logoHeight=Math.round(self.height/10),logoMargin=Math.round(self.height/20);css={left:logoMargin+'px',top:logoMargin+(self.controlsTopAreVisible?16:0)+'px',height:logoHeight+'px'};}else if(element=='player'){var height=self.options.fullscreen?window.innerHeight:self.height;if(self.options.externalControls){height+=(!!self.options.controlsTop.length+!!self.options.controlsBottom.length)*self.barHeight;}
|
||
|
|
css=Ox.extend({width:self.width+'px',height:height+'px'},self.options.fullscreen?{left:0,top:0}:{},self.exitFullscreen?{left:self.absoluteOffset.left,top:self.absoluteOffset.top}:{});}else if(element=='playIcon'){var playIconPadding=Math.round(self.iconSize*1/8),playIconSize=self.iconSize-2*playIconPadding-4;css={width:playIconSize+'px',height:playIconSize+'px',padding:playIconPadding+'px',borderRadius:Math.round(self.iconSize/2)+'px'};}else if(element=='progress'){css={width:self.timelineImageWidth+'px',marginLeft:-self.timelineImageWidth+'px'};}else if(element=='subtitle'){var offset=0,videoCSS;if(self.options.subtitlesOffset){videoCSS=getVideoCSS();offset=Math.floor((self.options.subtitlesOffset/100)*videoCSS.height)+videoCSS.top;offset=Math.max(offset,0);}
|
||
|
|
css={bottom:(Math.floor(self.height/16)
|
||
|
|
+offset
|
||
|
|
+(!!self.controlsBottomAreVisible*16))+'px',width:self.width+'px',fontSize:Math.floor(self.height/20)+'px',WebkitTextStroke:(self.height/1000)+'px rgb(0, 0, 0)'};}else if(element=='spaceBottom'||element=='timeline'){css={width:self.timelineWidth+'px'};}else if(element=='spaceTop'||element=='title'){css={width:getTitleWidth()+'px'};}else if(element=='videoContainer'){css={width:self.width+'px',height:self.height+'px'};}else if(element=='volume'){css={width:Math.min(184,self.width)};}
|
||
|
|
return css;}
|
||
|
|
function getPosition(e){if($.browser.mozilla){return Ox.limit((e.layerX-48-self.barHeight/2)/self.timelineImageWidth*self.$video.duration(),0,self.$video.duration());}else{return Ox.limit((e.offsetX-self.barHeight/2)/self.timelineImageWidth*self.$video.duration(),0,self.$video.duration());}}function getPositionWidth(){return 48+!!self.options.showMilliseconds*2
|
||
|
|
+self.options.showMilliseconds*6;}
|
||
|
|
function getPosterMarkerCSS(){self.videoCSS=getVideoCSS();var left=Math.floor((self.videoCSS.width-self.videoCSS.height)/2),right=Math.ceil((self.videoCSS.width-self.videoCSS.height)/2);return{center:{left:self.videoCSS.left+left+'px',top:self.videoCSS.top+'px',width:(self.videoCSS.height-2)+'px',height:(self.videoCSS.height-2)+'px'},left:{left:self.videoCSS.left+'px',top:self.videoCSS.top+'px',width:left+'px',height:self.videoCSS.height+'px'},right:{left:self.videoCSS.left+left+self.videoCSS.height+'px',top:self.videoCSS.top+'px',width:right+'px',height:self.videoCSS.height+'px'}};}
|
||
|
|
function getProgressImageURL(){if(!self.timelineImageWidth)return;var width=self.timelineImageWidth,height=self.barHeight,canvas=$('<canvas>').attr({width:width,height:height})[0],context=canvas.getContext('2d'),imageData,data;context.fillStyle='rgba(255, 0, 0, 0.5)';context.fillRect(0,0,width,height);imageData=context.getImageData(0,0,width,height),data=imageData.data;self.buffered.forEach(function(range){var left=Math.round(range[0]*width/self.$video.duration()),right=Math.round(range[1]*width/self.$video.duration());Ox.loop(left,right,function(x){Ox.loop(height,function(y){index=x*4+y*4*width;data[index+3]=0;});});});context.putImageData(imageData,0,0);return canvas.toDataURL();}
|
||
|
|
function getSubtitle(){var subtitle='';if(self.options.enableSubtitles){Ox.forEach(self.options.subtitles,function(v){if(v['in']<=self.options.position&&v.out>=self.options.position&&(!v.tracks||Ox.contains(v.tracks,self.options.subtitlesTrack))){subtitle=v.text;return false;}});}
|
||
|
|
return subtitle;}
|
||
|
|
function getSubtitles(){return self.options.enableSubtitles?self.options.subtitles.filter(function(v){return!v.tracks||Ox.contains(v.tracks,self.options.subtitlesTrack);}):[];}
|
||
|
|
function getTimeline(){var $timeline=Ox.SmallVideoTimeline({disabled:!self.options.enableTimeline,duration:self.options.duration,find:self.options.find,imageURL:self.options.timeline,'in':self.options['in'],invertHighlight:self.options.invertHighlight,mode:'player',out:self.options.out,paused:self.options.paused,position:self.options.position,results:self.results,showInToOut:self.options.playInToOut,showMilliseconds:self.options.showMilliseconds,subtitles:self.options.enableSubtitles?self.options.subtitles:[],width:getTimelineWidth()}).css({float:'left'}).css({background:'-moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'}).css({background:'-o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'}).css({background:'-webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'}).bindEvent({position:function(data){setPosition(data.position,'timeline');that.triggerEvent('position',{position:self.options.position});}});$timeline.children().css({marginLeft:getTimelineLeft()+'px'});$timeline.find('.OxInterface').css({marginLeft:getTimelineLeft()+'px'});return $timeline;}
|
||
|
|
function getTimelineLeft(){var left=0;Ox.forEach(self.options.controlsBottom,function(control){if(control=='timeline'){return false;}
|
||
|
|
left+=control=='position'?self.positionWidth:16});return left;}
|
||
|
|
function getTimelineWidth(){return(self.options.fullscreen?window.innerWidth:self.options.width)-self.options.controlsBottom.reduce(function(prev,curr){return prev+(curr=='timeline'||curr=='space'?0:Ox.startsWith(curr,'space')?parseInt(curr.substr(5)):curr=='position'?getPositionWidth():16);},0);}
|
||
|
|
function getTitleWidth(){return(self.options.fullscreen?window.innerWidth:self.options.width)
|
||
|
|
-self.options.controlsTop.reduce(function(prev,curr){return prev+(curr=='title'||curr=='chapterTitle'||curr=='space'?0:Ox.startsWith(curr,'space')?parseInt(curr.substr(5)):16);},0);}
|
||
|
|
function getVideo(){return self.options.video.filter(function(video){return(!self.options.audioTrack||video.track==self.options.audioTrack)&&(!self.options.resolution||video.resolution==self.options.resolution);});}
|
||
|
|
function getVideoCSS(videoWidth,videoHeight){var playerWidth=self.width,playerHeight=self.height,playerRatio=playerWidth/playerHeight,videoWidth=videoWidth||self.videoWidth,videoHeight=videoHeight||self.videoHeight,videoRatio=videoWidth/videoHeight,videoIsWider=videoRatio>playerRatio,width,height;if(self.options.scaleToFill){width=videoIsWider?playerHeight*videoRatio:playerWidth;height=videoIsWider?playerHeight:playerWidth/videoRatio;}else{width=videoIsWider?playerWidth:playerHeight*videoRatio;height=videoIsWider?playerWidth/videoRatio:playerHeight;}
|
||
|
|
width=Math.round(width);height=Math.round(height);return{left:Math.floor((playerWidth-width)/2),top:Math.floor((playerHeight-height)/2),width:width,height:height};}
|
||
|
|
function getVolumeImage(){var symbol;if(self.options.muted||self.options.volume==0){symbol='Unmute';}else if(self.options.volume<1/3){symbol='VolumeUp';}else if(self.options.volume<2/3){symbol='VolumeDown';}else{symbol='Mute';}
|
||
|
|
return symbol;}
|
||
|
|
function goToNext(type,direction){var position,positions;if(type=='chapter'&&self.options.chapters){positions=self.options.chapters.map(function(chapter){return chapter.position;});}else if(type=='result'&&self.results){positions=Ox.unique(self.results.map(function(result){return result['in'];}));}
|
||
|
|
if(positions){position=Ox.nextValue(positions,self.options.position,direction);setPosition(position);that.triggerEvent('position',{position:self.options.position});}}
|
||
|
|
function goToPoint(){that.triggerEvent('gotopoint');}
|
||
|
|
function hideControlMenus(){['find','settings','volume'].forEach(function(element){var $element=self['$'+element];$element&&$element.is(':visible')&&$element.animate({opacity:0},250,function(){$element.hide().css({opacity:1});});});}
|
||
|
|
function hideControls(){clearTimeout(self.interfaceTimeout);self.interfaceTimeout=setTimeout(function(){if(!self.exitFullscreen&&!self.inputHasFocus&&!self.mouseIsInControls){self.interfaceIsVisible=false;self.controlsTopAreVisible=false;self.controlsBottomAreVisible=false;self.$controlsTop&&self.$controlsTop.animate({opacity:0},250);self.$controlsBottom&&self.$controlsBottom.animate({opacity:0},250);hideControlMenus();self.$logo&&self.$logo.animate({top:getCSS('logo').top,opacity:0.25},250,function(){self.options.logoLink&&self.$logo.off('click');self.options.logoTitle&&self.$logo.off('mouseenter mouseleave');});self.$subtitle&&self.$subtitle.animate({bottom:getCSS('subtitle').bottom},250);}},self.options.fullscreen?2500:1000);}
|
||
|
|
function hideLoadingIcon(){self.$loadingIcon.hide().stop();}
|
||
|
|
function hideMarkers(){self.$posterMarker&&Ox.forEach(self.$posterMarker,function(marker){marker.hide();});self.$pointMarker&&Ox.forEach(self.$pointMarker,function(markers){Ox.forEach(markers,function(marker){marker.hide();});});}
|
||
|
|
function hidePoster(){if(self.loadedMetadata&&self.posterIsVisible){self.$poster.animate({opacity:0},250);self.posterIsVisible=false;}}
|
||
|
|
function isEqual(a,b){return Math.abs(a-b)<0.001;}
|
||
|
|
function itemchange(data){var item=self.$video.options('items')[data.item];Ox.Log('Video','ITEMCHANGE',item);}
|
||
|
|
function requiresusergesture(){Ox.Log('Video','requires user gesture');var $playIcon;function removeBehaviorsRestrictions(){window.removeEventListener('keydown',removeBehaviorsRestrictions);window.removeEventListener('mousedown',removeBehaviorsRestrictions);window.removeEventListener('touchstart',removeBehaviorsRestrictions);$playIcon.remove();showLoadingIcon();self.options.showIconOnLoad=false;}
|
||
|
|
window.addEventListener('keydown',removeBehaviorsRestrictions);window.addEventListener('mousedown',removeBehaviorsRestrictions);window.addEventListener('touchstart',removeBehaviorsRestrictions);hideLoadingIcon();$playIcon=$('<img>').addClass('OxPlayIcon OxVideo OxInterface').attr({src:Ox.UI.getImageURL('symbolPlay','videoIcon')}).css(getCSS('playIcon')).css({opacity:1}).appendTo(self.$videoContainer);}
|
||
|
|
function loadImage(){self.$image.one({load:function(){hideLoadingIcon();}}).attr({src:self.options.video(Math.min(self.options.position,Math.floor(self.options.duration*self.options.fps)/self.options.fps),self.options.width)});}
|
||
|
|
function loadedmetadata(){Ox.Log('Video','LOADEDMETADATA')
|
||
|
|
var hadDuration=!!self.options.duration;self.loadedMetadata=true;self.videoWidth=self.$video.videoWidth();self.videoHeight=self.$video.videoHeight();self.videoCSS=getVideoCSS();self.posterMarkerCSS=getPosterMarkerCSS();self.$video.css(self.videoCSS);self.$poster&&self.$poster.css(self.videoCSS);self.$posterMarker&&Ox.forEach(self.$posterMarker,function(marker,position){marker.css(self.posterMarkerCSS[position]);});self.out=self.options.playInToOut&&self.out<self.$video.duration()?self.out:self.$video.duration();self.options.duration=self.out-self['in'];Ox.Log('Video','---------------------------------------- POS',self.options.position)
|
||
|
|
Ox.Log('Video','----------------------------------- DURATION',self.options.duration)
|
||
|
|
setPosition(self.options.position);self.$video.muted(self.options.muted).volume(self.options.volume);if(!self.options.paused){self.options.paused=true;togglePaused('loadedmetadata');}else if(self.options.paused&&self.playOnLoad){togglePaused('loadedmetadata');}
|
||
|
|
self.$playButton&&self.$playButton.options({disabled:false});if(self.options.showIcon||self.options.showIconOnLoad){self.$playIcon.animate({opacity:1},250);}
|
||
|
|
if(self.options.showControlsOnLoad){showControls();}
|
||
|
|
!hadDuration&&self.$timeline&&self.$timeline.replaceWith(self.$timeline=getTimeline());if(self.options.enableKeyboard&&self.options.focus=='load'){that.gainFocus();}
|
||
|
|
self.$subtitle&&self.$subtitle.animate({bottom:getCSS('subtitle').bottom},250);that.triggerEvent('loadedmetadata');}
|
||
|
|
function loadedsubtitles(){if(!self.subtitlesTracks||Ox.isEmpty(self.subtitlesTracks)){self.subtitlesTracks=[self.options.subtitlesDefaultTrack];}
|
||
|
|
self.subtitlesTracks.push('None');if(self.options.find){submitFindInput(self.options.find);if(self.options.duration){self.$timeline&&self.$timeline.options({results:self.results,subtitles:self.options.subtitles});}}else{self.options.enableSubtitles&&self.$subtitle&&setSubtitle();}}
|
||
|
|
function loadSubtitles(){if(self.options.subtitles.length){if(Ox.isArray(self.options.subtitles)){self.subtitlesTracks=Ox.sort(Ox.unique(Ox.flatten(self.options.subtitles.map(function(subtitle){return subtitle.tracks;})))).filter(function(track){return!!track;});loadedsubtitles();}else{if(self.options.subtitles.indexOf('\n')>-1){self.options.subtitles=Ox.parseSRT(self.options.subtitles);loadedsubtitles();}else{Ox.get(self.options.subtitles,function(data){self.options.subtitles=Ox.parseSRT(data);loadedsubtitles();});self.options.subtitles=[];}}}}
|
||
|
|
function playing(){self.options.position=self.$video.currentTime();if((self.playInToOut&&self.options.position>=self.options.out)||(self.options.playInToOut&&self.options.position>=self.out)){if(self.options.loop){setPosition(self.options['in']);self.$video.play();}else{togglePaused();if(self.options.rewind){setTimeout(rewind,250);}else{setPosition(self.options.out?self.options.out:self.out);}
|
||
|
|
that.triggerEvent('ended');}}else{setPosition(self.options.position,'video');}
|
||
|
|
that.triggerEvent('playing',{position:self.options.position});}
|
||
|
|
function playInToOut(){if(self.options.out>self.options['in']){self.playInToOut=true;setPosition(self.options['in']);self.options.paused&&togglePaused();}}
|
||
|
|
function progress(){var buffered=self.$video.buffered();for(var i=0;i<buffered.length;i++){self.buffered[i]=[buffered.start(i),buffered.end(i)];if(self.buffered[i][0]>self.buffered[i][1]){self.buffered[i][0]=0;}}
|
||
|
|
self.$progress.attr({src:getProgressImageURL()});}
|
||
|
|
function renderSettings(){return Ox.VideoPlayerMenu({items:[{disabled:true,title:Ox._('Resolution')}].concat(self.resolutions.map(function(resolution){return{group:'resolution',id:resolution,checked:resolution==self.options.resolution,title:resolution+'p'};}),self.audioTracks.length>1?[{},{disabled:true,title:Ox._('Audio')}].concat(self.audioTracks.map(function(track){return{group:'audioTrack',id:track,checked:track==self.options.audioTrack,title:Ox._(track)};})):[],self.options.subtitles.length?[{},{disabled:true,title:Ox._('Subtitles')}].concat(self.subtitlesTracks.map(function(track){return{group:'subtitlesTrack',id:track,checked:self.options.enableSubtitles?track==self.options.subtitlesTrack:track=='',title:Ox._(track)};})):[],self.options.timelineTypes.length?[{},{disabled:true,title:Ox._('Timeline')}].concat(self.options.timelineTypes.map(function(type){return{group:'timeline',id:type.id,checked:type.id==self.options.timelineType,title:type.title};})):[],self.options.enableDownload?[{},{id:'download',title:Ox._('Download')}]:[])}).addClass('OxControls OxSettings').bindEvent({click:function(data){var resolution,type;if(data.group=='resolution'){resolution=parseInt(data.id,10);if(resolution!=self.options.resolution){self.options.resolution=resolution;setResolution();}}else if(data.group=='audioTrack'){self.options.audioTrack=data.id;setAudioTrack();}else if(data.group=='subtitlesTrack'){self.options.subtitlesTrack=data.id=='None'?'':data.id;self.options.enableSubtitles=!!self.options.subtitlesTrack;setSubtitlesTrack();}else if(data.group=='timeline'){type=self.options.timelineTypes[Ox.indexOf(self.options.timelineTypes,function(type){return type.title==title;})].id;if(type!=self.options.timelineType){self.options.timelineType=type;setTimelineType();}}else if(data.id=='download'){that.triggerEvent('download');}}});}
|
||
|
|
function rewind(){setPosition(self.options.playInToOut?self.options['in']:0);}
|
||
|
|
function seeked(){Ox.Log('Video','seeked')
|
||
|
|
clearTimeout(self.seekTimeout);self.seekTimeout=0;Ox.Log('Video','hide loading icon')
|
||
|
|
hideLoadingIcon();self.$video.show();self.$playIcon&&self.$playIcon.show();hidePoster();}
|
||
|
|
function seeking(){Ox.Log('Video','XX seeking')
|
||
|
|
if(!self.seekTimeout){self.seekTimeout=setTimeout(function(){self.$playIcon&&self.$playIcon.hide();Ox.Log('Video','XX show')
|
||
|
|
showLoadingIcon();},250);}}
|
||
|
|
function setAudioTrack(){updateVideo();}
|
||
|
|
function setCensored(){var censored=getCensored();if(censored!=self.censored){self.censored=censored;censor();}}
|
||
|
|
function setChapterTitle(){var chapterTitle=getChapterTitle();if(chapterTitle!=self.chapterTitle){self.chapterTitle=chapterTitle;self.$chapterTitle.html(self.chapterTitle)}}
|
||
|
|
function setMarkers(){self.$posterMarker&&Ox.forEach(self.$posterMarker,function(marker){isEqual(self.options.position,self.options.posterFrame)?marker.show():marker.hide();});self.$pointMarker&&Ox.forEach(self.$pointMarker,function(markers,point){Ox.forEach(markers,function(marker){isEqual(self.options.position,self.options[point])?marker.css({display:'block'}):marker.hide();});});}
|
||
|
|
function setPoint(){that.triggerEvent('setpoint');}
|
||
|
|
function setPosition(position,from){self.options.position=Ox.limit(position,self['in'],self.out);self.options.paused&&self.options.showMarkers&&setMarkers();self.options.censored.length&&setCensored();self.options.enableSubtitles&&self.$subtitle&&setSubtitle();self.$chapterTitle&&setChapterTitle();self.$position&&self.$position.html(formatPosition());if(self.options.type=='play'){if(self.loadedMetadata&&from!='video'){self.$video.currentTime(self.options.position);}
|
||
|
|
if(self.iconIsVisible){self.$playIcon.animate({opacity:0},250);self.iconIsVisible=false;}
|
||
|
|
self.$timeline&&self.$timeline.options({position:self.options.position});}else{loadImage();}}
|
||
|
|
function setResolution(){updateVideo();that.triggerEvent('resolution',{resolution:self.options.resolution});}
|
||
|
|
function setSize($element,css,animate,callback){if($element){if(animate){$element.animate(css,250,function(){callback&&callback();});}else{$element.css(css);callback&&callback();}}}
|
||
|
|
function setSizes(animate,callback){self.width=self.options.fullscreen?window.innerWidth:self.options.width;self.height=self.options.fullscreen?window.innerHeight:self.options.height;self.videoCSS=getVideoCSS();self.iconSize=Ox.limit(Math.round(self.height/10),16,32);if(self.$timeline||self.$spaceBottom){self.timelineWidth=getTimelineWidth();if(self.$timeline){self.timelineImageWidth=self.timelineWidth-self.barHeight;}}
|
||
|
|
setSize(that,getCSS('player'),animate,callback);setSize(self.$videoContainer,getCSS('videoContainer'),animate);setSize(self.$video,self.videoCSS,animate);setSize(self.$poster,self.videoCSS,animate);setSize(self.$logo,getCSS('logo'),animate);setSize(self.$loadingIcon,getCSS('loadingIcon'),animate);setSize(self.$playIcon,getCSS('playIcon'),animate);setSize(self.$copyrightIcon,getCSS('copyrightIcon'),animate);setSize(self.$subtitle,getCSS('subtitle'),animate);setSize(self.$controlsTop,getCSS('controlsTop'),animate);setSize(self.$title,getCSS('title'),animate);setSize(self.$chapterTitle,getCSS('title'),animate);setSize(self.$spaceTop,getCSS('spaceTop'),animate);setSize(self.$controlsBottom,getCSS('controlsBottom'),animate);setSize(self.$timeline,getCSS('timeline'),animate,function(){self.$timeline&&self.$timeline.options({width:self.timelineWidth});});setSize(self.$spaceBottom,getCSS('spaceBottom'),animate);setSize(self.$find,getCSS('find'),animate,function(){var width=Math.min(128,self.width-88);self.$findInput.options({width:width});self.$findInput.children('input').css({width:(width-12)+'px'});});setSize(self.$volume,getCSS('volume'),animate,function(){self.$volumeInput.options({size:Math.min(128,self.width-56)});});if(self.$posterMarker){self.posterMarkerCSS=getPosterMarkerCSS();Ox.forEach(self.$posterMarker,function(marker,position){setSize(marker,self.posterMarkerCSS[position],animate);});}}
|
||
|
|
function setSubtitle(){var subtitle=getSubtitle();if(subtitle!=self.subtitle){self.subtitle=subtitle;setSubtitleText();}}
|
||
|
|
function setSubtitleText(){self.$subtitle.html(self.subtitle?Ox.highlight(self.subtitle,self.options.find,'OxHighlight',true).replace(/\n/g,'<br/>'):' <br/> ');}
|
||
|
|
function setSubtitlesTrack(){var enableSubtitles=self.options.enableSubtitles&&!!self.options.subtitlesTrack;self.options.enableSubtitles=enableSubtitles;setSubtitle();self.$timeline&&self.$timeline.options({subtitles:getSubtitles()});if(enableSubtitles&&!!self.options.subtitlesTrack){that.triggerEvent('subtitlestrack',{track:self.options.subtitlesTrack});}else{that.triggerEvent('subtitles',{subtitles:self.options.enableSubtitles});}}
|
||
|
|
function setTimelineType(){that.triggerEvent('timeline',{timeline:self.options.timelineType});}
|
||
|
|
function setVideo(){if(Ox.isObject(self.options.video[0])){self.audioTracks=Ox.sort(Ox.unique(self.options.video.map(function(video){return video.track;})));if(!Ox.contains(self.audioTracks,self.options.audioTrack)){self.options.audioTrack=self.audioTracks[0];}
|
||
|
|
self.resolutions=Ox.sort(Ox.unique(self.options.video.map(function(video){return video.resolution;})));if(!Ox.contains(self.resolutions,self.options.resolution)){self.options.resolution=self.resolutions[0];}
|
||
|
|
self.video=getVideo();}else{self.video=[{src:self.options.video}];self.resolutions=[];self.audioTracks=[];}}
|
||
|
|
function setVolume(volume){self.options.volume=volume;if(!!self.options.volume==self.options.muted){toggleMuted();}else{self.$volumeButton&&self.$volumeButton.options({title:getVolumeImage()});self.$volumeValue&&self.$volumeValue.html(self.options.muted?0:Math.round(self.options.volume*100));}
|
||
|
|
!self.censored&&self.$video.volume(self.options.volume);that.triggerEvent('volume',{volume:self.options.volume});}
|
||
|
|
function showControls(){clearTimeout(self.interfaceTimeout);if(!self.interfaceIsVisible){self.interfaceIsVisible=true;if(self.$controlsTop){self.controlsTopAreVisible=true;}
|
||
|
|
if(self.$controlsBottom){self.controlsBottomAreVisible=true;}
|
||
|
|
self.$controlsTop&&self.$controlsTop.animate({opacity:1},250);self.$controlsBottom&&self.$controlsBottom.animate({opacity:1},250);['find','settings','volume'].forEach(function(element){var $element=self['$'+element];$element&&$element.is(':visible')&&$element.animate({opacity:1},250);});self.$logo&&self.$logo.animate({top:getCSS('logo').top,opacity:0.5},250,function(){self.options.logoLink&&self.$logo.on({click:function(){document.location.href=self.options.logoLink;}});self.options.logoTitle&&self.$logo.on({mouseenter:function(e){self.$logoTooltip.show(e);},mouseleave:self.$logoTooltip.hide});});self.$subtitle&&self.$subtitle.animate({bottom:getCSS('subtitle').bottom},250);}}
|
||
|
|
function showLoadingIcon(){self.$loadingIcon.start().show();}
|
||
|
|
function showVolume(){if(self.$volume){!self.interfaceIsVisible&&showControls();self.$volume.is(':hidden')&&toggleVolume();}}
|
||
|
|
function sizechange(){self.videoWidth=self.$video.videoWidth();self.videoHeight=self.$video.videoHeight();self.videoCSS=getVideoCSS();self.$video.css(self.videoCSS);};function submitFindInput(value,hasPressedEnter){self.options.find=value;self.results=find(self.options.find);if(self.$find){self.$results.html(self.results.length);self.$previousResultButton.options({disabled:!self.results.length});self.$nextResultButton.options({disabled:!self.results.length});self.$clearButton.options({disabled:!self.options.find});}
|
||
|
|
self.subtitle&&setSubtitleText();self.$timeline&&self.$timeline.options({find:self.options.find,results:self.results});if(hasPressedEnter){if(self.results.length){goToNext('result',1);that.gainFocus();}else{self.$findInput.focusInput(true);}}
|
||
|
|
that.triggerEvent('find',{find:self.options.find});}
|
||
|
|
function submitPositionInput(){self.$positionInput.hide();self.$position.html('').show();setPosition(Ox.parseDuration(self.$positionInput.value()));if(self.playOnSubmit){togglePaused();self.$video.play();self.playOnSubmit=false;}
|
||
|
|
if(self.focus=='mouseenter'&&!self.mouseHasLeft){that.gainFocus();}
|
||
|
|
self.mouseHasLeft&&hideControls();that.triggerEvent('position',{position:self.options.position});that.triggerEvent('submit');}
|
||
|
|
function toggleFind(){var show=self.$find.is(':hidden');!show&&self.$findInput.blurInput();self.$find.toggle();show&&self.$findInput.focusInput(false);}
|
||
|
|
function toggleFullscreen(from){var parentOffset,playOnFullscreen;self.options.fullscreen=!self.options.fullscreen;if(!self.options.paused){self.$video.pause();playOnFullscreen=true;}
|
||
|
|
if(self.options.fullscreen){self.$parent=that.parent();parentOffset=self.$parent.offset();self.absoluteOffset=that.offset();self.relativeOffset={left:self.absoluteOffset.left-parentOffset.left,top:self.absoluteOffset.top-parentOffset.top};that.detach().addClass('OxFullscreen').css({left:self.absoluteOffset.left+'px',top:self.absoluteOffset.top+'px',zIndex:1000}).appendTo(Ox.$body);if(self.options.externalControls){self.externalControls=true;self.options.externalControls=false;self.$videoContainer.css({top:0});}
|
||
|
|
setSizes(true,function(){playOnFullscreen&&self.$video.play();enterFullscreen();});}else{self.exitFullscreen=true;that.off('mousemove');that.find('.OxControls').trigger('mouseleave').off('mouseenter mouseleave');clearTimeout(self.interfaceTimeout);if(self.externalControls){self.options.externalControls=true;self.$videoContainer.css({top:'16px'});}
|
||
|
|
setSizes(true,function(){self.exitFullscreen=false;that.detach().removeClass('OxFullscreen').css({left:self.relativeOffset.left+'px',top:self.relativeOffset.top+'px',zIndex:1}).appendTo(self.$parent);playOnFullscreen&&self.$video.play();self.options.enableKeyboard&&that.gainFocus();});}
|
||
|
|
if(self.$fullscreenButton&&from!='button'){self.$fullscreenButton.toggle();}
|
||
|
|
that.triggerEvent('fullscreen',{fullscreen:self.options.fullscreen});}
|
||
|
|
function toggleLoop(from){self.options.loop=!self.options.loop;self.$video.options('loop',self.options.loop);if(self.$loopButton&&from!='button'){self.$loopButton.toggle();}
|
||
|
|
that.triggerEvent('loop',{loop:self.options.loop});}
|
||
|
|
function toggleMuted(from){self.hasVolumeControl&&showVolume();self.options.muted=!self.options.muted;self.$video.muted(self.options.muted);if(!self.options.muted&&!self.options.volume){self.options.volume=1;self.$video.volume(1);}
|
||
|
|
if(self.$muteButton&&from!='button'){self.$muteButton.toggle();}
|
||
|
|
self.$volumeButton&&self.$volumeButton.options({title:getVolumeImage()});self.$volumeInput&&self.$volumeInput.value(self.options.muted?0:self.options.volume);self.$volumeValue&&self.$volumeValue.html(self.options.muted?0:Math.round(self.options.volume*100));that.triggerEvent('muted',{muted:self.options.muted});}
|
||
|
|
function togglePaused(from){self.options.paused=!self.options.paused;self.$timeline&&self.$timeline.options({paused:self.options.paused});if(!self.loadedMetadata){return;}
|
||
|
|
if(self.options.paused){self.$video.pause();clearInterval(self.playInterval);if(self.options.showIcon){togglePlayIcon();self.$playIcon.animate({opacity:1},250);}
|
||
|
|
self.playInToOut=false;}else{hidePoster();if(self.options.playInToOut&&self.options.position>self.options.out-self.secondsPerFrame){setPosition(self.options['in']);}
|
||
|
|
self.$video.play();self.playInterval=setInterval(playing,self.millisecondsPerFrame);if(self.options.showIcon){self.$playIcon.animate({opacity:0},250,togglePlayIcon);}else if(self.options.showIconOnLoad){self.$playIcon.animate({opacity:0},250);}
|
||
|
|
self.options.showMarkers&&hideMarkers();}
|
||
|
|
if(self.$playButton&&from!='button'){self.$playButton.toggle();}
|
||
|
|
that.triggerEvent('paused',{paused:self.options.paused});self.options.paused&&that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function togglePlayIcon(){self.$playIcon.attr({src:Ox.UI.getImageURL('symbol'+(self.options.paused?'Play':'Pause'),'videoIcon')});}
|
||
|
|
function toggleScale(from){self.options.scaleToFill=!self.options.scaleToFill;self.videoCSS=getVideoCSS();self.$video.animate(self.videoCSS,250);self.$poster&&self.$poster.animate(self.videoCSS,250);self.$subtitle&&self.$subtitle.animate({bottom:getCSS('subtitle').bottom},250);if(self.$scaleButton&&from!='button'){self.$scaleButton.toggle();}
|
||
|
|
if(self.$posterMarker){self.posterMarkerCSS=getPosterMarkerCSS();Ox.forEach(self.$posterMarker,function(marker,position){marker.animate(self.posterMarkerCSS[position],250);});}
|
||
|
|
that.triggerEvent('scale',{scale:self.options.scaleToFill?'fill':'fit'});}
|
||
|
|
function toggleSize(){self.options.sizeIsLarge=!self.options.sizeIsLarge;that.triggerEvent('size',{size:self.options.sizeIsLarge?'large':'small'});}
|
||
|
|
function toggleVolume(){self.$volume.toggle();}
|
||
|
|
function updateVideo(){if(!self.options.paused){self.playOnLoad=true;togglePaused('button');}
|
||
|
|
self.loadedMetadata=false;showLoadingIcon();self.video=getVideo();self.$video.options({items:self.video});self.$playButton&&self.$playButton.options({disabled:true});}
|
||
|
|
that.changeVolume=function(num){changeVolume(num);return that;};that.playInToOut=function(){playInToOut();return that;};that.toggleLoop=function(){toggleLoop();return that;};that.togglePaused=function(){togglePaused();return that;};that.toggleMuted=function(){toggleMuted();return that;};return that;};Ox.VideoPlayerMenu=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({items:[]}).options(options||{}).update({}).on({click:function(e){var $target=$(e.target),group,id;that.hide();if(!$target.is('.OxLine')&&!$target.is('.OxSpace')&&!$target.is('.OxDisabled')){group=$target.parent().data().group;id=$target.parent().data().id;self.$items.filter(function($item){return $item.data().group==group;}).forEach(function($item){$($item.children()[1]).attr({src:Ox.UI.getImageURL('symbol'+($item.data().id==id?'Check':'None'))});});that.triggerEvent('click',{group:group,id:id});}}});self.$items=[];self.height=2;self.options.items.forEach(function(item){var $item;if(!Ox.isEmpty(item)){$item=$('<div>').addClass('OxItem'+(item.disabled?' OxDisabled':'')).data({group:item.group,id:item.id}).appendTo(that);if(!item.disabled){$item.on({mouseenter:function(){$(this).addClass('OxSelected');},mouseleave:function(){$(this).removeClass('OxSelected');}});}
|
||
|
|
$('<div>').html(item.title).appendTo($item);$('<img>').attr({src:Ox.UI.getImageURL('symbol'+(item.checked?'Check':'None'))}).appendTo($item);self.$items.push($item);self.height+=14;}else{$('<div>').addClass('OxSpace').appendTo(that);$('<div>').addClass('OxLine').appendTo(that);$('<div>').addClass('OxSpace').appendTo(that);self.height+=5;}});that.css({height:self.height+'px'});return that;};'use strict';Ox.VideoPlayerPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({annotationsCalendarSize:256,annotationsMapSize:256,annotationsRange:'all',annotationsSize:256,annotationsSort:'position',annotationsTooltip:'annotations',audioTrack:'',censored:[],censoredIcon:'',censoredTooltip:'',clickLink:null,cuts:[],duration:0,enableDownload:false,enableSubtitles:false,find:'',fps:25,fullscreen:false,getLargeTimelineURL:null,height:0,'in':0,itemName:{singular:'video',plural:'videos'},layers:[],loop:false,muted:false,out:0,paused:true,playbackRate:1,playInToOut:false,position:0,poster:'',resolution:0,scaleToFill:false,selected:'',showAnnotations:false,showAnnotationsCalendar:false,showAnnotationsMap:false,showLayers:{},showTimeline:false,showUsers:false,smallTimelineURL:'',subtitles:[],subtitlesDefaultTrack:'English',subtitlesLayer:null,subtitlesOffset:0,subtitlesTrack:'English',timeline:'',timelineTooltip:'timeline',video:'',volume:1,width:0}).options(options||{}).update({fullscreen:function(){self.$video.options({fullscreen:self.options.fullscreen});},height:function(){self.$video.options({height:getPlayerHeight()});},'in':function(){setPoint('in',self.options['in']);},loop:function(){self.$video.options({loop:self.options.loop});},out:function(){setPoint('out',self.options.out);},paused:function(){self.$video.options({paused:self.options.paused});},playbackRate:function(){self.$video.options({playbackRate:self.options.playbackRate});},position:function(){self.$video.options({position:self.options.position});self.$timeline.options({position:self.options.position});self.$annotationPanel.options({position:self.options.position});},selected:function(){self.$annotationPanel.options({selected:self.options.selected});},showAnnotations:function(){self.$mainPanel.toggleElement(1);},showTimeline:function(){self.$videoPanel.toggleElement(1);},timeline:function(){self.$timeline.options({type:self.options.timeline});},volume:function(){self.$video.options({volume:self.options.volume});},width:function(){self.$video.options({width:getPlayerWidth()});self.$timeline.options({width:getTimelineWidth()});}}).css({height:self.options.height+'px',width:self.options.width+'px'}).bindEvent({resize:resizeElement,key_0:toggleMuted,key_comma:function(){movePositionTo('cut',-1);},key_control_c:function(){that.triggerEvent('copy',[{annotation:self.options.selected,'in':self.options['in'],out:self.options.out}]);},key_control_shift_c:function(){that.triggerEvent('copyadd',[{annotation:self.options.selected,'in':self.options['in'],out:self.options.out}]);},key_dot:function(){movePositionTo('cut',1);},key_equal:function(){self.$video.changeVolume(0.1);},key_i:function(){self.$annotationPanel.options({selected:''});setPoint('in',self.options.position,false,true);},key_k:function togglePlaybackRate(){that.options({playbackRate:self.options.playbackRate==1?2:self.options.playbackRate==2?0.5:1});},key_l:toggleLoop,key_left:function(){movePositionBy(-1/self.options.fps);},key_minus:function(){self.$video.changeVolume(-0.1);},key_o:function(){self.$annotationPanel.options({selected:''});setPoint('out',self.options.position,false,true);},key_p:playInToOut,key_right:function(){movePositionBy(1/self.options.fps);},key_shift_down:function(){movePositionBy(self.options.duration);},key_shift_i:function(){goToPoint('in');},key_shift_left:function(){movePositionBy(-1);},key_shift_o:function(){goToPoint('out');},key_shift_right:function(){movePositionBy(1);},key_shift_up:function(){movePositionBy(-self.options.position);},key_slash:selectCut,key_space:togglePaused});self.options.subtitles=options.subtitles!==void 0?self.options.subtitles:parseSubtit
|
||
|
|
self.options.subtitlesTrack=data.track;self.$timeline.options({subtitles:getSubtitles()});},volume:function(data){that.triggerEvent('volume',data);}}).appendTo(self.$player);self.$controls=Ox.Element().addClass('OxMedia').bindEvent({toggle:toggleControls});self.$timeline=Ox.LargeVideoTimeline({cuts:self.options.cuts,duration:self.options.duration,find:self.options.find,getImageURL:self.options.getLargeTimelineURL,'in':self.options['in'],out:self.options.out,position:self.options.position,subtitles:getSubtitles(),videoId:self.options.videoId,type:self.options.timeline,width:getTimelineWidth()}).css({left:'4px',top:'4px'}).bindEvent({key_left:function(){self.options.paused&&movePositionBy(-1/self.options.fps);},key_right:function(){self.options.paused&&movePositionBy(1/self.options.fps);},key_space:togglePaused,mousedown:that.gainFocus,position:dragendTimeline,positioning:dragTimeline}).appendTo(self.$controls);self.$videoPanel=Ox.SplitPanel({elements:[{element:self.$player},{collapsed:!self.options.showTimeline,collapsible:true,element:self.$controls,size:80,tooltip:self.options.timelineTooltip}],orientation:'vertical'});self.$annotationPanel=Ox.AnnotationPanel({calendarSize:self.options.annotationsCalendarSize,clickLink:self.options.clickLink,editable:false,highlight:self.options.find,'in':self.options['in'],itemName:self.options.itemName,layers:self.options.layers,mapSize:self.options.annotationsMapSize,out:self.options.out,position:self.options.position,range:self.options.annotationsRange,selected:self.options.selected,showCalendar:self.options.showAnnotationsCalendar,showLayers:Ox.clone(self.options.showLayers),showMap:self.options.showAnnotationsMap,showUsers:self.options.showUsers,sort:self.options.annotationsSort,width:self.options.annotationsSize}).bindEvent({annotationsrange:function(data){self.options.annotationsRange=data.range;that.triggerEvent('annotationsrange',data);},annotationssort:function(data){self.options.annotationsSort=data.sort;that.triggerEvent('annotationssort',data);},info:function(data){that.triggerEvent('info',data);},open:function(){setPosition(self.options['in']);},resize:resizeAnnotations,resizeend:resizeendAnnotations,resizecalendar:function(data){that.triggerEvent('resizecalendar',data);},resizemap:function(data){that.triggerEvent('resizemap',data);},select:selectAnnotation,toggle:toggleAnnotations,togglecalendar:function(data){self.options.showAnnotationsCalendar=!data.collapsed;that.triggerEvent('togglecalendar',data);},togglelayer:function(data){that.triggerEvent('togglelayer',{collapsed:data.collapsed,layer:data.layer});},togglemap:function(data){self.options.showAnnotationsMap=!data.collapsed;that.triggerEvent('togglemap',data);}});['0','b','backslash','closebracket','comma','dot','equal','f','g','i','minus','n','o','openbracket','p','shift_0','shift_g','shift_i','shift_o','slash','space'].forEach(function(key){key='key_'+key;self.$annotationPanel.bindEvent(key,function(){that.triggerEvent(key);});});that.setElement(self.$mainPanel=Ox.SplitPanel({elements:[{element:self.$videoPanel},{collapsed:!self.options.showAnnotations,collapsible:true,element:self.$annotationPanel,resizable:true,resize:[192,256,320,384],size:self.options.annotationsSize,tooltip:self.options.annotationsTooltip}],orientation:'horizontal'}));function dragTimeline(data){self.options.position=data.position;self.$video.options({position:self.options.position});self.$annotationPanel.options({position:self.options.position});}
|
||
|
|
function dragendTimeline(data){dragTimeline(data);that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function getAnnotations(){return!self.options.layers?[]:Ox.flatten(self.options.layers.map(function(layer){return layer.items.map(function(item){return{id:item.id,'in':item['in'],out:item.out,text:item.value};});})).sort(sortAnnotations);}
|
||
|
|
function getNextPosition(type,direction){var positions;if(type=='cut'){positions=[0].concat(self.options.cuts,self.options.duration);}
|
||
|
|
return Ox.nextValue(positions,self.options.position,direction);}
|
||
|
|
function getPlayerHeight(){return self.options.height
|
||
|
|
-self.options.showTimeline*80-1;}
|
||
|
|
function getPlayerWidth(){return self.options.width
|
||
|
|
-(self.options.showAnnotations&&!self.fullscreen)*self.options.annotationsSize-1;}
|
||
|
|
function getSubtitles(){return self.options.enableSubtitles?self.options.subtitles.filter(function(v){return Ox.contains(v.tracks,self.options.subtitlesTrack);}):[];}
|
||
|
|
function getTimelineWidth(){return self.options.width
|
||
|
|
-(self.options.showAnnotations&&!self.fullscreen)*self.options.annotationsSize-16-1;}
|
||
|
|
function goToPoint(point){setPosition(self.options[point]);}
|
||
|
|
function playInToOut(){self.$video.playInToOut();}
|
||
|
|
function movePositionBy(sec){setPosition(Ox.limit(self.options.position+sec,0,self.options.duration));}
|
||
|
|
function movePositionTo(type,direction){setPosition(getNextPosition(type,direction));}
|
||
|
|
function parseSubtitles(){return self.options.subtitlesLayer?self.options.layers.filter(function(layer){return layer.id==self.options.subtitlesLayer;})[0].items.map(function(subtitle){return{id:subtitle.id,'in':subtitle['in'],out:subtitle.out,text:subtitle.value.replace(/\n/g,' ').replace(/<br\/?>/g,'\n'),tracks:subtitle.languages||[self.options.subtitlesDefaultTrack]};}):[];}
|
||
|
|
function resizeAnnotations(data){self.options.annotationsSize=data.size;self.$video.options({width:getPlayerWidth()});self.$timeline.options({width:getTimelineWidth()});self.$annotationPanel.options({width:data.size});}
|
||
|
|
function resizeendAnnotations(data){that.triggerEvent('annotationssize',data.size);}
|
||
|
|
function resizeElement(data){self.options.height=data.size;self.$video.options({height:getPlayerHeight()});}
|
||
|
|
function selectAnnotation(data){self.options.selected=data.id;if(self.options.selected){setPosition(data['in']);setPoint('in',data['in'],true);setPoint('out',data.out,true);}
|
||
|
|
self.$annotationPanel.options({selected:self.options.selected});that.triggerEvent('select',{id:self.options.selected});}
|
||
|
|
function selectCut(){var points={'in':Ox.last(self.options.cuts),out:self.options.duration};Ox.forEach(self.options.cuts,function(cut,i){if(cut>self.options.position){points={'in':i==0?0:self.options.cuts[i-1],out:cut-1/self.options.fps};return false;}});setPoint('in',points['in']);setPoint('out',points.out);}
|
||
|
|
function setPoint(point,position,keepSelected,triggerEvent){self.options[point]=position;if(self.options.selected&&!keepSelected){selectAnnotation({id:''});}
|
||
|
|
self.$video.options(point,position);self.$timeline.options(point,position);self.$annotationPanel.options(point,position);if(self.options['in']>self.options.out){setPoint(point=='in'?'out':'in',position,keepSelected);}else if(triggerEvent){that.triggerEvent('points',{'in':self.options['in'],out:self.options.out,position:self.options.position});}}
|
||
|
|
function setPosition(position,playing,dragging){var minute=Math.floor(position/60),previousMinute=Math.floor(self.options.position/60);self.options.position=position;!playing&&self.$video.options({position:self.options.position});self.$timeline.options({position:self.options.position});self.$annotationPanel.options({position:self.options.position});if((!playing||minute!=previousMinute)&&!dragging){that.triggerEvent('position',{position:!playing?self.options.position:minute*60});}}
|
||
|
|
function sortAnnotations(a,b){var ret=0;if(a['in']<b['in']){ret=-1;}else if(a['in']>b['in']){ret=1;}else if(a.out<b.out){ret=-1;}else if(a.out>b.out){ret=1;}else if(a.value<b.value){ret=-1;}else if(a.value>b.value){ret=1;}
|
||
|
|
return ret;}
|
||
|
|
function toggleAnnotations(data){self.options.showAnnotations=!data.collapsed;self.$video.options({width:getPlayerWidth()});self.$timeline.options({width:getTimelineWidth()});that.triggerEvent('toggleannotations',{showAnnotations:self.options.showAnnotations});}
|
||
|
|
function toggleControls(data){self.options.showTimeline=!data.collapsed;self.$video.options({height:getPlayerHeight()});that.triggerEvent('toggletimeline',{showTimeline:self.options.showTimeline});}
|
||
|
|
function toggleLoop(){self.$video.toggleLoop();}
|
||
|
|
function toggleMuted(){self.$video.toggleMuted();}
|
||
|
|
function togglePaused(){self.$video.togglePaused();self.$video.options('paused')&&that.triggerEvent('position',{position:self.$video.options('position')});}
|
||
|
|
that.toggleAnnotations=function(){self.$mainPanel.toggleElement(1);};that.toggleTimeline=function(){self.$videoPanel.toggleElement(1);};that.playInToOut=function(){self.$video.playInToOut();};return that;}
|
||
|
|
'use strict';Ox.VideoPreview=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({duration:0,getFrame:null,fps:25,frameRatio:16/9,height:256,position:void 0,scaleToFill:false,timeline:'',videoTooltip:null,width:256}).options(options||{}).update({height:function(){that.css({height:self.options.height+'px'});self.$frame.css(getFrameCSS());},position:function(){self.$frame.attr({src:self.options.getFrame(self.options.position)});},width:function(){that.css({width:self.options.width+'px'});stopLoading();self.$frame.attr({src:self.options.getFrame()}).css(getFrameCSS());self.$timeline&&self.$timeline.css({width:self.options.width+'px'});}}).addClass('OxVideoPreview').css({width:self.options.width+'px',height:self.options.height+'px'});self.loaded=[];self.queue=[];self.$frameElement=Ox.$('<div>').addClass('OxFrame').appendTo(that);self.$frame=Ox.$('<img>').attr({src:self.options.getFrame(self.options.position)}).css(getFrameCSS()).appendTo(self.$frameElement);if(self.options.timeline){self.$timeline=$('<img>').addClass('OxTimeline').attr({src:self.options.timeline}).css({width:self.options.width+'px'}).appendTo(that);}
|
||
|
|
self.$interface=Ox.Element({tooltip:function(event){var position=getPosition(event.clientX-that.offset().left),tooltip=Ox.isFunction(self.options.videoTooltip)?self.options.videoTooltip():self.options.videoTooltip;self.$frame.attr({src:getClosestFrame(position)});self.timeout&&clearTimeout(self.timeout);self.timeout=setTimeout(function(){self.$frame.attr({src:self.options.getFrame(position)});},250);return'<div style="text-align: center">'
|
||
|
|
+(tooltip?tooltip+'<br>':'')
|
||
|
|
+'<span class="OxLight">'+Ox.formatDuration(position,2)+'</span>'
|
||
|
|
+'</div>';}}).addClass('OxInterface').on({click:click,mouseenter:startLoading,mouseleave:function(){stopLoading();self.$frame.attr({src:self.options.getFrame(self.options.position)});}}).bindEvent({touchend:touchend,touchmove:touchmove,touchstart:startLoading}).appendTo(that);function click(e){that.triggerEvent('click',{position:getPosition(e.clientX-that.offset().left)});}
|
||
|
|
function getClosestFrame(position){return self.loaded.length==0?self.options.getFrame(self.options.position):self.loaded.sort(function(a,b){return Math.abs(a.position-position)-Math.abs(b.position-position);})[0].frame;}
|
||
|
|
function getFrameCSS(){var css={},elementWidth=self.options.width,elementHeight=self.options.height-(self.options.timeline?16:0),elementRatio=elementWidth/elementHeight,frameRatio=self.options.frameRatio,frameIsWider=frameRatio>elementRatio;if(self.options.scaleToFill){css.width=frameIsWider?elementHeight*frameRatio:elementWidth;css.height=frameIsWider?elementHeight:elementWidth/frameRatio;css.marginLeft=frameIsWider?(elementWidth-css.width)/2:0;css.marginTop=frameIsWider?0:(elementHeight-css.height)/2;}else{css.width=frameIsWider?elementWidth:elementHeight*frameRatio;css.height=frameIsWider?elementWidth/frameRatio:elementHeight;css.marginLeft=frameIsWider?0:(elementWidth-css.width)/2;css.marginTop=frameIsWider?(elementHeight-css.height)/2:0;}
|
||
|
|
return Ox.map(css,function(value){return Math.round(value)+'px';});}
|
||
|
|
function getPosition(x){return Math.round(self.options.duration*x/self.options.width*self.options.fps)/self.options.fps;}
|
||
|
|
function startLoading(){var last,steps=[Math.round(self.options.width/2)];while((last=steps[steps.length-1])>1){steps.push(Math.round(last/2));}
|
||
|
|
steps.forEach(function(step){Ox.loop(0,self.options.width,step,function(x){var position=getPosition(x),frame=self.options.getFrame(position);if(!self.loaded.some(function(image){return image.frame==frame;})&&!self.queue.some(function(image){return image.frame==frame;})){self.queue.push({frame:frame,position:position});}});});self.queue.length&&loadFrame();function loadFrame(){var image=self.queue.shift();$('<img>').load(function(){self.loaded.push(image);self.queue.length&&loadFrame();}).attr({src:image.frame})}}
|
||
|
|
function stopLoading(){self.queue=[];self.timeout&&clearTimeout(self.timeout);}
|
||
|
|
function touchend(e){var position=getPosition(e.clientX-that.offset().left);stopLoading();self.$frame.attr({src:getClosestFrame(position)});that.triggerEvent('click',{position:position});}
|
||
|
|
function touchmove(e){var position=getPosition(e.clientX-that.offset().left);self.$frame.attr({src:getClosestFrame(position)});}
|
||
|
|
return that;};'use strict';Ox.VideoTimelinePanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({annotationsCalendarSize:256,annotationsMapSize:256,annotationsRange:'all',annotationsSize:256,annotationsSort:'position',annotationsTooltip:'annotations',audioTrack:'',censored:[],censoredIcon:'',censoredTooltip:'',clickLink:null,cuts:[],duration:0,followPlayer:false,getFrameURL:null,getLargeTimelineURL:null,height:0,'in':0,itemName:{singular:'video',plural:'videos'},layers:[],loop:false,muted:false,out:0,paused:true,playbackRate:1,position:0,resolution:0,selected:'',showAnnotations:false,showAnnotationsCalendar:false,showAnnotationsMap:false,showLayers:{},showUsers:false,smallTimelineURL:'',subtitles:[],timeline:'',timelines:[],video:'',volume:1,width:0}).options(options||{}).update({height:function(){self.$player.options({height:self.options.height});},paused:function(){self.$player.options({paused:self.options.paused});},playbackRate:function(){self.$player.options({playbackRate:self.options.playbackRate});},position:function(){setPosition(self.options.position);},showAnnotations:function(){self.$panel.toggleElement(1);},timeline:function(){self.$player.options({timeline:self.options.timeline});},width:function(){self.$player.options({width:getPlayerWidth()});}}).css({height:self.options.height+'px',width:self.options.width+'px'}).bindEvent({resize:resizeElement,key_0:toggleMuted,key_equal:function(){self.$video.changeVolume(0.1);},key_k:function togglePlaybackRate(){that.options({playbackRate:self.options.playbackRate==1?2:self.options.playbackRate==2?0.5:1});},key_minus:function(){self.$video.changeVolume(-0.1);},key_space:togglePaused});self.$player=Ox.VideoTimelinePlayer({audioTrack:self.options.audioTrack,censored:self.options.censored,censoredIcon:self.options.censoredIcon,censoredTooltip:self.options.censoredTooltip,cuts:self.options.cuts,duration:self.options.duration,followPlayer:self.options.followPlayer,getFrameURL:self.options.getFrameURL,getLargeTimelineURL:self.options.getLargeTimelineURL,height:self.options.height,muted:self.options.muted,paused:self.options.paused,playbackRate:self.options.playbackRate,position:self.options.position,resolution:self.options.resolution,smallTimelineURL:self.options.smallTimelineURL,subtitles:self.options.subtitles,timeline:self.options.timeline,timelines:self.options.timelines,video:self.options.video,videoRatio:self.options.videoRatio,volume:self.options.volume,width:getPlayerWidth()}).bindEvent({censored:function(){that.triggerEvent('censored');},follow:function(data){that.triggerEvent('follow',data);},muted:function(data){that.triggerEvent('muted',data);},paused:function(data){self.options.paused=data.paused;that.triggerEvent('paused',data);},playing:function(data){setPosition(data.position,true);},position:function(data){setPosition(data.position);},timeline:function(data){that.triggerEvent('timeline',data);},volume:function(data){that.triggerEvent('volume',data);}});self.$annotationPanel=Ox.AnnotationPanel({calendarSize:self.options.annotationsCalendarSize,clickLink:self.options.clickLink,editable:false,highlight:self.options.find,'in':self.options['in'],itemName:self.options.itemName,layers:self.options.layers,mapSize:self.options.annotationsMapSize,out:self.options.out,position:self.options.position,range:self.options.annotationsRange,selected:self.options.selected,showCalendar:self.options.showAnnotationsCalendar,showLayers:Ox.clone(self.options.showLayers),showMap:self.options.showAnnotationsMap,showUsers:self.options.showUsers,sort:self.options.annotationsSort,width:self.options.annotationsSize}).bindEvent({annotationsrange:function(data){self.options.annotationsRange=data.range;that.triggerEvent('annotationsrange',data);},annotationssort:function(data){self.options.annotationsSort=data.sort;that.triggerEvent('annotationssort',data);},info:function(data){that.triggerEvent('info',data);},open:function(){setPosition(self.options['in']);},resize:resizeAnnotations,resizeend:resizeendAnnotations,resizecalendar:function(data){that.triggerEvent
|
||
|
|
function resizeAnnotations(data){self.options.annotationsSize=data.size;self.$player.options({width:getPlayerWidth()});self.$annotationPanel.options({width:data.size});}
|
||
|
|
function resizeendAnnotations(data){that.triggerEvent('annotationssize',data.size);}
|
||
|
|
function resizeElement(data){self.options.height=data.size;self.$player.options({height:self.options.height});}
|
||
|
|
function selectAnnotation(data){self.options.selected=data.id;if(self.options.selected){setPosition(data['in']);}
|
||
|
|
self.$annotationPanel.options({selected:self.options.selected});that.triggerEvent('select',{id:self.options.selected});}
|
||
|
|
function setPosition(position,playing){var minute=Math.floor(position/60),previousMinute=Math.floor(self.options.position/60);self.options.position=position;!playing&&self.$player.options({position:self.options.position});self.$annotationPanel.options({position:self.options.position});if(!playing||minute!=previousMinute){that.triggerEvent('position',{position:!playing?self.options.position:minute*60});}}
|
||
|
|
function toggleAnnotations(data){self.options.showAnnotations=!data.collapsed;self.$player.options({width:getPlayerWidth()});that.triggerEvent('toggleannotations',{showAnnotations:self.options.showAnnotations});}
|
||
|
|
function toggleMuted(){self.$player.toggleMuted();}
|
||
|
|
function togglePaused(){self.$player.togglePaused();self.$player.options('paused')&&that.triggerEvent('position',{position:self.$player.options('position')});}
|
||
|
|
that.toggleAnnotations=function(){self.$panel.toggleElement(1);};return that;};'use strict';Ox.VideoTimelinePlayer=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({audioTrack:'',censored:[],censoredIcon:'',censoredTooltip:'',cuts:[],duration:0,find:'',followPlayer:false,getFrameURL:null,getLargeTimelineURL:null,height:0,'in':0,matches:[],muted:false,out:0,paused:false,playbackRate:1,position:0,showMilliseconds:false,smallTimelineURL:'',subtitles:[],timeline:'',timelines:[],video:'',videoRatio:1,volume:1,width:0}).options(options||{}).update({height:setHeight,paused:function(){self.options.paused=!self.options.paused;togglePaused();},playbackRate:function(){self.$video.options({playbackRate:self.options.playbackRate});},position:setPosition,timeline:function(){self.$menuButton.checkItem('timelines_'+self.options.timeline);updateTimeline();},volume:function(){self.$video.options({volume:self.options.volume});},width:setWidth});self.fps=25;self.frame=self.options.position*self.fps;self.frames=self.options.duration*self.fps;self.tileWidth=1500;self.tileHeight=64;self.margin=8;self.contentWidth=self.options.width-2*self.margin;self.contentHeight=self.options.height-32;self.positionWidth=48
|
||
|
|
+!!self.options.showMilliseconds*2
|
||
|
|
+self.options.showMilliseconds*6;self.tiles=Math.ceil(self.frames/self.tileWidth);self.videoWidth=Math.round(self.tileHeight*self.options.videoRatio);self.lines=getLines();self.videoLines=getVideoLines();if(Ox.isObject(self.options.video[0])){self.audioTracks=Ox.sort(Ox.unique(self.options.video.map(function(video){return video.track;}))).map(function(track){return{id:track,title:Ox._(track),checked:self.options.audioTrack==track};});}
|
||
|
|
self.$menubar=Ox.Bar({size:16});self.$menuButton=Ox.MenuButton({items:[].concat(self.audioTracks.length>1?[{id:'audioTracks',title:Ox._('Audio'),items:[{group:'audioTrack',min:1,max:1,items:self.audioTracks}]}]:[],[{id:'timelines',title:Ox._('Timeline'),items:[{group:'timeline',min:1,max:1,items:Ox.map(self.options.timelines,function(timeline){return Ox.extend({checked:timeline.id==self.options.timeline},timeline);})}]},{},{id:'followPlayer',title:'Follow Player While Playing',checked:self.options.followPlayer}]),style:'square',title:'set',tooltip:Ox._('Options'),type:'image'}).css({float:'left'}).bindEvent({change:function(data){var id=data.id;if(id=='audioTrack'){self.options.audioTrack=data.checked[0].id;self.$video.options({audioTrack:self.options.audioTrack});}else if(id=='timeline'){self.options.timeline=data.checked[0].id;updateTimeline();that.triggerEvent('timeline',{timeline:self.options.timeline});}else if(id=='followPlayer'){self.options.followPlayer=data.checked;if(!self.options.paused&&self.options.followPlayer){self.scrollTimeout&&clearTimeout(self.scrollTimeout);scrollToPosition();}
|
||
|
|
that.triggerEvent('follow',{follow:self.options.followPlayer});}}}).appendTo(self.$menubar);self.$scrollButton=Ox.Button({style:'symbol',title:'arrowDown',tooltip:Ox._('Scroll to Player'),type:'image'}).css({float:'right'}).hide().bindEvent({click:function(){self.scrollTimeout&&clearTimeout(self.scrollTimeout);scrollToPosition();}}).appendTo(self.$menubar);self.$timelinePlayer=Ox.Element().addClass('OxMedia').css({overflowX:'hidden',overflowY:'auto'}).on({mousedown:mousedown,mouseleave:mouseleave,mousemove:mousemove,scroll:scroll}).bindEvent({mousedown:function(){this.gainFocus();},key_0:toggleMuted,key_down:function(){self.options.position+=self.contentWidth/self.fps;setPosition();},key_equal:function(){changeVolume(0.1);},key_enter:function(){scrollToPosition();},key_k:function togglePlaybackRate(){that.options({playbackRate:self.options.playbackRate==1?2:self.options.playbackRate==2?0.5:1});},key_left:function(){self.options.position-=self.videoWidth/self.fps;setPosition();},key_minus:function(){changeVolume(-0.1);},key_right:function(){self.options.position+=self.videoWidth/self.fps;setPosition();},key_shift_left:function(){self.options.position-=1/self.fps;setPosition();},key_shift_right:function(){self.options.position+=1/self.fps;setPosition();},key_space:function(){togglePaused()},key_up:function(){self.options.position-=self.contentWidth/self.fps;setPosition();},touchend:function(e){mousedown(e);mouseleave();},touchmove:mousedown,touchstart:mousedown});self.$playerbar=Ox.Bar({size:16});self.$playButton=Ox.Button({style:'symbol',title:'play',tooltip:Ox._('Play'),type:'image'}).css({float:'left'}).bindEvent({click:function(){togglePaused();}}).appendTo(self.$playerbar);self.$muteButton=Ox.Button({style:'symbol',title:self.options.muted?'unmute':'mute',tooltip:self.options.muted?Ox._('Unmute'):Ox._('Mute'),type:'image'}).css({float:'left'}).bindEvent({click:toggleMuted}).appendTo(self.$playerbar);self.$smallTimeline=getSmallTimeline().appendTo(self.$playerbar);self.$position=Ox.Element().addClass('OxPosition').css({width:self.positionWidth-4+'px'}).html(formatPosition()).on({click:function(){if(!self.options.paused){self.playOnSubmit=true;togglePaused();}
|
||
|
|
self.$position.hide();self.$positionInput.value(formatPosition()).show().focusInput(false);}}).appendTo(self.$playerbar);self.$positionInput=Ox.Input({value:formatPosition(),width:self.positionWidth}).addClass('OxPositionInput').bindEvent({blur:submitPositionInput,submit:submitPositionInput}).appendTo(self.$playerbar);self.$positionInput.children('input').css({width:(self.positionWidth-6)+'px',fontSize:'9px'});self.$panel=Ox.SplitPanel({elements:[{element:self.$menubar,size:16},{element:self.$timelinePlayer},{element:self.$playerbar,size:16}],orientation:'vertical'}).addClass('OxVideoTimelinePlayer');that.setElement(self.$panel);self.$lines=[];self.$timelines=[];self.$timeline=renderTimeline();Ox.loop(self.lines,function(i){addLine(i);});Ox.last(self.$lines).css({height:self.tileHeight+1.5*self.margin+'px'});self.$frameBox=$('<div>').addClass('OxVideoBox').css({position:'absolute',right:0,top:self.margin/2-1+'px',width:self.videoWidth+'px',height:self.tileHeight+'px'}).appendTo(self.$timelines[self.videoLines[1]][0]);self.$frame=Ox.VideoPlayer({audioTrack:self.options.audioTrack,censored:self.options.censored,censoredIcon:self.options.censoredIcon,censoredTooltip:self.options.censoredTooltip,duration:self.options.duration,height:self.tileHeight,position:self.options.position,scaleToFill:true,type:'in',video:self.options.getFrameURL,width:self.videoWidth}).bindEvent({censored:function(){that.triggerEvent('censored');}}).appendTo(self.$frameBox);$('<div>').addClass('OxFrameInterface').css({position:'absolute',left:0,top:0,width:self.videoWidth+'px',height:self.tileHeight+'px'}).appendTo(self.$frameBox);self.$videoBox=$('<div>').addClass('OxVideoBox').css({position:'absolute',right:0,top:self.margin/2-1+'px',width:self.videoWidth+'px',height:self.tileHeight+'px',zIndex:5}).appendTo(self.$timelines[self.videoLines[0]][0]);self.$video=Ox.VideoPlayer({audioTrack:self.options.audioTrack,censored:self.options.censored,censoredIcon:self.options.censoredIcon,censoredTooltip:self.options.censoredTooltip,duration:self.options.duration,height:self.tileHeight,muted:self.options.muted,paused:self.options.paused,playbackRate:self.options.playbackRate,position:self.options.position,scaleToFill:true,video:self.options.video,width:self.videoWidth}).bindEvent({censored:function(){that.triggerEvent('censored');},ended:function(){togglePaused(true);},playing:function(data){self.options.position=data.position;setPosition(true);}}).appendTo(self.$videoBox);$('<div>').addClass('OxFrameInterface OxVideoInterface').css({position:'absolute',left:0,top:0,width:self.videoWidth+'px',height:self.tileHeight+'px'}).appendTo(self.$videoBox);self.$tooltip=Ox.Tooltip({animate:false}).css({textAlign:'center'});setTimeout(function(){scrollToPosition();});function addLine(i){self.$lines[i]=$('<div>').css({position:'absolute',left:self.margin+'px',top:self.margin/2+i*(self.tileHeight+self.margin)+'px',width:self.contentWidth+'px',height:self.tileHeight+self.margin+'px',overflowX:'hidden'}).appendTo(self.$timelinePlayer);self.$timelines[i]=[self.$timeline.clone(true).css({width:self.frame+self.videoWidth+'px',marginLeft:-i*self.contentWidth+'px'}),self.$timeline.clone(true).css({marginLeft:-i*self.contentWidth+self.videoWidth-1+'px'})];self.$lines[i].append(self.$timelines[i][1]).append(self.$timelines[i][0]);}
|
||
|
|
function changeVolume(num){self.options.volume=Ox.limit(self.options.volume+num,0,1);setVolume();}
|
||
|
|
function formatPosition(position){position=Ox.isUndefined(position)?self.options.position:position;return Ox.formatDuration(position,self.options.showMilliseconds);}
|
||
|
|
function getLines(scrollbarIsVisible){var lines;if(scrollbarIsVisible){self.contentWidth-=Ox.UI.SCROLLBAR_SIZE;}
|
||
|
|
lines=Math.ceil((self.frames-1+self.videoWidth)/self.contentWidth);return!scrollbarIsVisible&&lines*(self.tileHeight+self.margin)+self.margin>self.contentHeight?getLines(true):lines;}
|
||
|
|
function getPosition(e){return(e.offsetX?e.offsetX:e.clientX-$(e.target).offset().left)/self.fps;}
|
||
|
|
function getPositionScrollTop(){var scrollTop=self.$timelinePlayer.scrollTop(),videoTop=[self.margin+Ox.min(self.videoLines)*(self.tileHeight+self.margin),self.margin+Ox.max(self.videoLines)*(self.tileHeight+self.margin)],offset=self.contentHeight-self.tileHeight-self.margin;return videoTop[0]<scrollTop+self.margin?videoTop[0]-self.margin:videoTop[1]>scrollTop+offset?videoTop[1]-offset:null;}
|
||
|
|
function getSmallTimeline(){var $timeline=Ox.SmallVideoTimeline({duration:self.options.duration,imageURL:self.options.smallTimelineURL,mode:'player',paused:self.options.paused,position:self.options.position,showMilliseconds:self.options.showMilliseconds,width:getSmallTimelineWidth()}).css({float:'left'}).css({background:'-moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'}).css({background:'-o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'}).css({background:'-webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5))'}).bindEvent({position:function(data){self.options.position=data.position;setPosition();that.triggerEvent('position',{position:self.options.position});}});$timeline.children().css({marginLeft:'32px'});$timeline.find('.OxInterface').css({marginLeft:'32px'});return $timeline;}
|
||
|
|
function getSmallTimelineWidth(){return self.options.width-32-self.positionWidth;}
|
||
|
|
function getSubtitle(position){var subtitle='';Ox.forEach(self.options.subtitles,function(v){if(v['in']<=position&&v.out>position){subtitle=v;return false;}});return subtitle;}
|
||
|
|
function getVideoLine(){self.videoLine=Math.floor(getVideoFrame()/self.contentWidth);}
|
||
|
|
function getVideoLines(){var videoFrame=getVideoFrame(),videoLeft=videoFrame%self.contentWidth,lines=[];lines[0]=Math.floor(videoFrame/self.contentWidth);lines[1]=lines[0]+(videoLeft+self.videoWidth>self.contentWidth?1:0)
|
||
|
|
if(videoLeft+Math.floor(self.videoWidth/2)>self.contentWidth){lines.reverse();}
|
||
|
|
return lines;}
|
||
|
|
function getVideoFrame(){return Math.floor(self.options.position*self.fps);}
|
||
|
|
function mousedown(e){var $target=$(e.target),isTimeline=$target.is('.OxTimelineInterface'),isVideo=$target.is('.OxFrameInterface');if(isTimeline){self.options.position=getPosition(e);setPosition();if(!self.triggered){that.triggerEvent('position',{position:self.options.position});self.triggered=true;setTimeout(function(){self.triggered=false;},250);}}else if(isVideo){togglePaused();}}
|
||
|
|
function mouseleave(){self.$tooltip.hide();}
|
||
|
|
function mousemove(e){var $target=$(e.target),isTimeline=$target.is('.OxTimelineInterface'),isVideo=$target.is('.OxFrameInterface'),position,subtitle;if(isTimeline||isVideo){position=isTimeline?getPosition(e):self.options.position;subtitle=getSubtitle(position);self.$tooltip.options({title:(subtitle?'<span class=\'OxBright\'>'+Ox.highlight(subtitle.text,self.options.find,'OxHighlight').replace(/\n/g,'<br/>')+'</span><br/>':'')+Ox.formatDuration(position,3)}).show(e.clientX,e.clientY);}else{self.$tooltip.hide();}}
|
||
|
|
function renderTimeline(){var $timeline=$('<div>').css({position:'absolute',width:self.frames+'px',height:self.tileHeight+self.margin+'px',overflow:'hidden'});Ox.loop(self.tiles,function(i){$('<img>').attr({src:self.options.getLargeTimelineURL(self.options.timeline,i)}).css({position:'absolute',left:i*self.tileWidth+'px',top:self.margin/2+'px'}).data({index:i}).appendTo($timeline);});$('<div>').addClass('OxTimelineInterface').css({position:'absolute',left:0,top:self.margin/2+'px',width:self.frames+'px',height:self.tileHeight+'px'}).appendTo($timeline);return $timeline;}
|
||
|
|
function scroll(){updateScrollButton();if(!self.options.paused&&self.options.followPlayer){self.scrollTimeout&&clearTimeout(self.scrollTimeout);self.scrollTimeout=setTimeout(function(){scrollToPosition();self.scrollTimeout=0;},2500);}}
|
||
|
|
function scrollToPosition(){var positionScrollTop=getPositionScrollTop();positionScrollTop&&self.$timelinePlayer.stop().animate({scrollTop:positionScrollTop},250,function(){self.$scrollButton.hide();});}
|
||
|
|
function setHeight(){self.contentHeight=self.options.height-32;if(!self.options.paused&&self.options.followPlayer){self.scrollTimeout&&clearTimeout(self.scrollTimeout);scrollToPosition();}}
|
||
|
|
function setPosition(fromVideo){var isPlaying=!self.options.paused,max,min,videoLines,videoLines_;self.options.position=Ox.limit(self.options.position,0,self.options.duration);self.frame=Math.floor(self.options.position*self.fps);videoLines=getVideoLines();videoLines_=Ox.flatten([self.videoLines,videoLines]);min=Ox.min(videoLines_);max=Ox.max(videoLines_);Ox.loop(min,max+1,function(i){self.$timelines[i][0].css({width:self.frame+self.videoWidth+'px'});});if(videoLines[1]!=self.videoLines[1]){self.$frameBox.detach().appendTo(self.$timelines[videoLines[1]][0]);}
|
||
|
|
if(videoLines[0]!=self.videoLines[0]){isPlaying&&self.$video.togglePaused();self.$videoBox.detach().appendTo(self.$timelines[videoLines[0]][0]);isPlaying&&self.$video.togglePaused();}
|
||
|
|
if(videoLines[0]!=videoLines[1]){self.$frame.options({position:self.paused?self.options.position:Math.floor(self.options.position)});}
|
||
|
|
if(fromVideo&&!self.scrollTimeout&&videoLines[1]!=self.videoLines[1]&&videoLines[1]>videoLines[0]){self.videoLines=videoLines;self.options.followPlayer?scrollToPosition():updateScrollButton();}else{self.videoLines=videoLines;}
|
||
|
|
if(!fromVideo){self.$video.options({position:self.options.position});self.$frame.options({position:self.options.position});scrollToPosition();}
|
||
|
|
self.$smallTimeline.options({position:self.options.position});self.$position.html(formatPosition());that.triggerEvent(fromVideo?'playing':'position',{position:self.options.position});}
|
||
|
|
function setSubtitles(){self.$timeline.find('.OxSubtitle').remove();self.$subtitles=[];self.options.subtitles.forEach(function(subtitle,i){var found=self.options.find&&subtitle.text.toLowerCase().indexOf(self.options.find.toLowerCase())>-1;self.$subtitles[i]=$('<div>').addClass('OxSubtitle'+(found?' OxHighlight':'')).css({position:'absolute',left:(subtitle['in']*self.fps)+'px',width:(((subtitle.out-subtitle['in'])*self.fps)-2)+'px'}).html(Ox.highlight(subtitle.text,self.options.find,'OxHighlight')).appendTo(self.$timeline);});}
|
||
|
|
function setTimeline(){self.$timelinePlayer.empty();}
|
||
|
|
function setVolume(){self.$video.options({volume:self.options.volume});that.triggerEvent('volume',{volume:self.options.volume});}
|
||
|
|
function setWidth(){self.contentWidth=self.options.width-2*self.margin;self.lines=getLines();Ox.loop(self.lines,function(i){if(self.$lines[i]){self.$lines[i].css({width:self.contentWidth+'px'});self.$timelines[i][0].css({marginLeft:-i*self.contentWidth+'px'});self.$timelines[i][1].css({marginLeft:-i*self.contentWidth+self.videoWidth-1+'px'});}else{addLine(i);}});while(self.$lines.length>self.lines){self.$lines[self.$lines.length-1].remove();self.$lines.pop();self.$timelines.pop();}
|
||
|
|
Ox.last(self.$lines).css({height:self.tileHeight+1.5*self.margin+'px'});if(!self.options.paused&&self.options.followPlayer){self.scrollTimeout&&clearTimeout(self.scrollTimeout);scrollToPosition();}
|
||
|
|
self.$smallTimeline.options({width:getSmallTimelineWidth()})}
|
||
|
|
function submitPositionInput(){self.$positionInput.hide();self.$position.html('').show();self.options.position=Ox.parseDuration(self.$positionInput.value());setPosition();if(self.playOnSubmit){togglePaused();self.playOnSubmit=false;}
|
||
|
|
that.triggerEvent('position',{position:self.options.position});}
|
||
|
|
function toggleMuted(){self.options.muted=!self.options.muted;self.$video.options({muted:self.options.muted});self.$muteButton.options({title:self.options.muted?'unmute':'mute',tooltip:self.options.muted?Ox._('Unmute'):Ox._('Mute')});that.triggerEvent('muted',{muted:self.options.muted});}
|
||
|
|
function togglePaused(fromVideo){self.options.paused=!self.options.paused;if(!self.options.paused&&self.options.followPlayer){self.scrollTimeout&&clearTimeout(self.scrollTimeout);scrollToPosition();}
|
||
|
|
!fromVideo&&self.$video.options({paused:self.options.paused});self.$playButton.options({title:self.options.paused?'play':'pause'});}
|
||
|
|
function updateScrollButton(){var scrollTop=self.$timelinePlayer.scrollTop(),positionScrollTop=getPositionScrollTop();if(positionScrollTop===null){self.$scrollButton.hide();}else{self.$scrollButton.options({title:positionScrollTop<scrollTop?'arrowUp':'arrowDown'}).show();}}
|
||
|
|
function updateTimeline(){self.$timelinePlayer.find('img').each(function(){var $this=$(this);$this.data('index')&&$this.attr({src:self.options.getLargeTimelineURL(self.options.timeline,$this.data('index'))});});}
|
||
|
|
that.togglePaused=function(){togglePaused();return that;};return that;};'use strict';Ox.ArrayEditable=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({clickLink:null,editable:true,format:null,getSortValue:null,globalAttributes:[],highlight:'',highlightGroup:false,itemName:'item',items:[],maxHeight:void 0,placeholder:'',position:-1,selected:'',separator:',',sort:[],submitOnBlur:true,tooltipText:'',type:'input',unformat:null,width:256}).options(options||{}).options({tooltip:tooltip}).update({highlight:function(){self.$items.forEach(function($item){$item.options({highlight:self.options.highlight})});},items:function(){if(self.options.selected&&getSelectedPosition()==-1){selectNone();}
|
||
|
|
renderItems(true);},placeholder:function(){if(self.options.items.length==0){self.$items[0].options({placeholder:self.options.placeholder,value:''});}},selected:function(){selectItem(self.options.selected);},sort:renderItems,width:function(){var width=self.options.width;that.css({width:width-8+'px'});self.options.type=='textarea'&&self.$items.forEach(function($item){$item.options({width:width})});}}).addClass('OxArrayEditable OxArrayEditable'+Ox.toTitleCase(self.options.type)).css({width:self.options.width-(self.options.type=='input'?8:0)+'px'}).bindEvent({key_delete:function(){deleteItem();},key_enter:function(){setTimeout(function(){that.editItem();},0);},key_escape:selectNone,key_down:self.options.type=='input'&&!Ox.contains(self.options.separator,'<br')?selectLast:selectNext,key_left:self.options.type=='input'&&!Ox.contains(self.options.separator,'<br')?selectPrevious:selectFirst,key_right:self.options.type=='input'&&!Ox.contains(self.options.separator,'<br')?selectNext:selectLast,key_up:self.options.type=='input'&&!Ox.contains(self.options.separator,'<br')?selectFirst:selectPrevious,singleclick:singleclick,touchstart:singleclick});self.$items=[];self.editing=false;renderItems();self.selected=getSelectedPosition();function deleteItem(id){id=id||self.options.selected;var position=Ox.getIndexById(self.options.items,id)
|
||
|
|
if(self.options.editable){self.options.items.splice(position,1);renderItems();that.triggerEvent('delete',{id:id});self.editing=false;if(self.options.selected==id){self.selected=-1;self.options.selected='';}else if(self.options.selected){self.selected=Ox.getIndexById(self.options.item,self.options.selected)}}}
|
||
|
|
function doubleclick(e){var $target=$(e.target),$parent=$target.parent();if($parent.is('.OxEditableElement')){that.editItem();}else if(!$target.is('.OxInput')){that.triggerEvent('add');}}
|
||
|
|
function getSelectedId(){return self.selected>-1?self.options.items[self.selected].id:'';}
|
||
|
|
function getSelectedPosition(){return Ox.getIndexById(self.options.items,self.options.selected);}
|
||
|
|
function renderItems(blur){if(self.editing){self.options.items[getSelectedPosition()].value=that.find(self.options.type+':visible').val();}
|
||
|
|
that.empty();if(self.options.items.length==0){self.$items=[Ox.Editable({editable:false,placeholder:self.options.placeholder,type:self.options.type,value:''}).appendTo(that)];}else{sortItems();if(self.options.highlightGroup){var selectedItem=Ox.getObjectById(self.options.items,self.options.selected)||{};}
|
||
|
|
self.$items=self.options.items.map(function appendItem(item,i){if(i&&self.options.type=='input'){$('<span>').addClass('OxSeparator').html(self.options.separator+' ').appendTo(that);}
|
||
|
|
return Ox.Editable({autocomplete:self.options.autocomplete,autocompleteReplace:self.options.autocompleteReplace,autocompleteReplaceCorrect:self.options.autocompleteReplaceCorrect,autocompleteSelect:self.options.autocompleteSelect,autocompleteSelectHighlight:self.options.autocompleteSelectHighlight,autocompleteSelectMaxWidth:self.options.autocompleteSelectMaxWidth,autocompleteSelectOffset:self.options.autocompleteSelectOffset,autocompleteSelectSubmit:self.options.autocompleteSelectSubmit,autocompleteSelectUpdate:self.options.autocompleteSelectUpdate,blurred:self.editing&&i==self.selected?blur:false,clickLink:self.options.clickLink,editable:self.options.editable&&item.editable,editing:self.editing&&i==self.selected,format:self.options.format,globalAttributes:self.options.globalAttributes,highlight:self.options.highlight,maxHeight:self.options.maxHeight,submitOnBlur:self.options.submitOnBlur,type:self.options.type,unformat:self.options.unformat,value:item.value,width:self.options.type=='input'?0:self.options.width-9}).addClass(item.id==self.options.selected?'OxSelected':'').addClass(self.options.highlightGroup&&item.group==selectedItem.group?'OxGroup':'').data({id:item.id,position:i}).bindEvent({blur:function(data){that.gainFocus();that.triggerEvent('blur',{id:item.id,value:data.value});self.blurred=true;setTimeout(function(){self.blurred=false;},250);},cancel:function(data){var id=$(this).data('id');self.editing=false;that.gainFocus();data.value===''?submitItem(id,''):that.triggerEvent('blur',data);},change:function(data){that.triggerEvent('change',{id:item.id,value:data.value});},edit:function(){if(item.id!=self.options.selected){selectItem(item.id);}
|
||
|
|
self.editing=true;that.$tooltip&&that.$tooltip.options({title:''});that.triggerEvent('edit');},insert:function(data){that.triggerEvent('insert',data);},open:function(data){that.triggerEvent('open');},submit:function(data){var id=$(this).data('id');self.editing=false;that.gainFocus();submitItem(id,data.value);}}).appendTo(that);});}}
|
||
|
|
function selectFirst(){if(self.selected>-1){self.selected>0?selectItem(0):that.triggerEvent('selectprevious');}}
|
||
|
|
function selectItem(idOrPosition){if(Ox.isString(idOrPosition)){self.options.selected=idOrPosition;self.selected=getSelectedPosition();}else{self.selected=idOrPosition;self.options.selected=getSelectedId();}
|
||
|
|
if(self.editing){self.editing=false;that.blurItem();}
|
||
|
|
that.find('.OxSelected').removeClass('OxSelected');that.find('.OxGroup').removeClass('OxGroup')
|
||
|
|
if(self.selected>-1){self.$items[self.selected].addClass('OxSelected');self.options.highlightGroup&&that.updateItemGroup()}
|
||
|
|
triggerSelectEvent();}
|
||
|
|
function selectLast(){if(self.selected>-1){self.selected<self.options.items.length-1?selectItem(self.options.items.length-1):that.triggerEvent('selectnext');}}
|
||
|
|
function selectNext(){if(self.selected>-1){self.selected<self.options.items.length-1?selectItem(self.selected+1):that.triggerEvent('selectnext');}}
|
||
|
|
function selectNone(){selectItem(-1);}
|
||
|
|
function selectPrevious(){if(self.selected>-1){self.selected>0?selectItem(self.selected-1):that.triggerEvent('selectprevious');}}
|
||
|
|
function singleclick(e){var $target=$(e.target),$element=$target.is('.OxEditableElement')?$target:$target.parents('.OxEditableElement'),position;if(!$target.is('.OxInput')){if($element.length){position=$element.data('position');if(position!=self.selected){selectItem(position);}else if(e.metaKey){selectNone();}}else if(!self.blurred){if(self.editing){that.blurItem();}else{if(self.selected>-1){selectNone();}else{that.triggerEvent('selectnone');}}}
|
||
|
|
that.gainFocus();}}
|
||
|
|
function sortItems(){if(!Ox.isEmpty(self.options.sort)){self.options.items=Ox.sortBy(self.options.items,self.options.sort,self.options.getSortValue?{value:self.options.getSortValue}:{});self.selected=getSelectedPosition();}}
|
||
|
|
function submitItem(id,value){var item=Ox.getObjectById(self.options.items,id);Ox.Log('AE','submitItem',id,item)
|
||
|
|
if(value===''){deleteItem(item.id);}else{that.triggerEvent(item.value===value?'blur':'submit',{id:item.id,value:value});item.value=value;}}
|
||
|
|
function tooltip(e){var $target=$(e.target),$element=$target.closest('.OxEditableElement'),position=$element.data('position'),item=self.options.items[position],isLink=$target.closest('a').length,click=isLink?'Shift-click':'Click',doubleclick=isLink?'shift-doubleclick':'doubleclick';return item===undefined||self.editing?'':(self.options.tooltipText?self.options.tooltipText(item)+'<br>':'')+(self.options.editable?Ox._(click+' to select')+(item.editable?Ox._(', '+doubleclick+' to edit'):''):'');}
|
||
|
|
var triggerSelectEvent=Ox.debounce(function(){that.triggerEvent('select',{id:self.options.selected});},true);that.addItem=function(position,item){if(self.options.editable){self.options.items.splice(position,0,item);renderItems();}
|
||
|
|
return that;};that.blurItem=function(){self.editing=false;self.$items.forEach(function($item){$item.options({editing:false});});return that;};that.editItem=function(){Ox.Log('AE','EDIT ITEM',self.options.editable,self.options.selected);if(self.options.editable&&self.options.selected){self.editing=true;self.$items[self.selected].options({editing:true});that.$tooltip&&that.$tooltip.options({title:''});}else if(!self.options.editable){that.triggerEvent('open');}
|
||
|
|
return that;};that.reloadItems=function(){renderItems();return that;};that.removeItem=function(){if(self.options.editable&&self.options.selected){deleteItem();}
|
||
|
|
return that;};that.updateItem=function(value){if(self.options.selected){self.$items[self.selected].options({value:value});}};that.updateItemGroup=function(){var group=self.selected>-1?self.options.items[self.selected].group:'';self.$items.forEach(function($item,index){$item[self.options.highlightGroup&&group&&self.options.items[index].group==group?'addClass':'removeClass']('OxGroup');});}
|
||
|
|
return that;};'use strict';Ox.ArrayInput=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({input:{get:Ox.Input,getEmpty:function(){return'';},isEmpty:function(value){return value==='';},setWidth:function($input,width){$input.options({width:width});}},label:'',max:0,sort:false,value:[],width:256}).options(options||{}).update({value:setValue,width:setWidths});self.options.value=self.options.value||[];if(self.options.label){self.$label=Ox.Label({title:self.options.label,width:self.options.width}).appendTo(that);}
|
||
|
|
self.$element=[];self.$input=[];self.$removeButton=[];self.$addButton=[];(self.options.value.length?self.options.value:[self.options.input.getEmpty()]).forEach(function(value,i){addInput(i,value);});self.options.value=getValue();function addInput(index,value,focus){self.$element.splice(index,0,Ox.Element().css({height:'16px',marginTop:self.options.label||index>0?'8px':0}).data({index:index}));if(index==0){self.$element[index].appendTo(that);}else{self.$element[index].insertAfter(self.$element[index-1]);}
|
||
|
|
self.$input.splice(index,0,self.options.input.get({width:self.options.width-48}).css({float:'left'}).bindEvent({change:function(data){if(self.options.sort&&!self.options.input.isEmpty(data.value)){sortInputs();}
|
||
|
|
self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}}).appendTo(self.$element[index]));if(value){self.$input[index].options({value:value})}
|
||
|
|
if(focus&&self.$input[index].focusInput){self.$input[index].focusInput(true);}
|
||
|
|
self.$removeButton.splice(index,0,Ox.Button({title:self.$input.length==1?'close':'remove',type:'image'}).css({float:'left',marginLeft:'8px'}).on({click:function(){var index=$(this).parent().data('index');if(!self.options.input.isEmpty(self.$input[index])){self.$input[index].value(self.options.input.getEmpty());self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
if(self.$input.length==1){if(self.$input[0].focusInput){self.$input[0].focusInput(true);}}else{removeInput(index);that.triggerEvent('remove');}}}).appendTo(self.$element[index]));self.$addButton.splice(index,0,Ox.Button({disabled:index==self.options.max-1,title:'add',type:'image'}).css({float:'left',marginLeft:'8px'}).on({click:function(){var index=$(this).parent().data('index');addInput(index+1,self.options.input.getEmpty(),true);that.triggerEvent('add');}}).appendTo(self.$element[index]));updateInputs();}
|
||
|
|
function getValue(){return Ox.map(self.$input,function($input){return $input.value();}).filter(function(value){return!self.options.input.isEmpty(value);});};function removeInput(index){Ox.Log('Form','remove',index);['input','removeButton','addButton','element'].forEach(function(element){var key='$'+element;self[key][index].remove();self[key].splice(index,1);});updateInputs();}
|
||
|
|
function setValue(){while(self.$input.length){removeInput(0);}
|
||
|
|
(self.options.value.length?self.options.value:[self.options.input.getEmpty()]).forEach(function(value,i){addInput(i,value);});}
|
||
|
|
function setWidths(){self.$label&&self.$label.options({width:self.options.width});self.$element.forEach(function($element,i){$element.css({width:self.options.width+'px'});self.options.input.setWidth(self.$input[i],self.options.width-48);});}
|
||
|
|
function sortInputs(){Ox.sort(self.$element,function($element){return self.$input[$element.data('index')].value();}).forEach(function($element){$element.detach();});self.$element.forEach(function($element,i){$element.data({index:i}).appendTo(that);});}
|
||
|
|
function updateInputs(){self.$element.forEach(function($element,i){$element.data({index:i});self.$removeButton[i].options({title:self.$element.length==1?'close':'remove'});self.$addButton[i].options({disabled:self.$element.length==self.options.max});});}
|
||
|
|
that.setErrors=function(values){self.$input.forEach(function($input){$input[values.indexOf($input.value())>-1?'addClass':'removeClass']('OxError');});};return that;};'use strict';Ox.Button=function(options,self){self=self||{};var that=Ox.Element('<input>',self).defaults({disabled:false,group:false,id:'',overlap:'none',selectable:false,size:'medium',style:'default',title:'',tooltip:'',type:'text',value:void 0,values:[],width:'auto'}).options(Ox.isArray(options.tooltip)?Ox.extend(Ox.clone(options),{tooltip:options.tooltip[0]}):options||{}).update({disabled:setDisabled,tooltip:function(){if(Ox.isArray(self.options.tooltip)&&that.$tooltip){that.$tooltip.options({title:self.options.tooltip[self.value]});}},title:setTitle,value:function(){setValue();setTitle();self.options.selectable&&setSelected();},values:function(){setValue();setTitle();},width:function(){that.css({width:(self.options.width-14)+'px'});}}).addClass('OxButton Ox'+Ox.toTitleCase(self.options.size)
|
||
|
|
+(self.options.disabled?' OxDisabled':'')
|
||
|
|
+(self.options.selectable&&self.options.value?' OxSelected':'')
|
||
|
|
+(self.options.style!='default'?' Ox'+Ox.toTitleCase(self.options.style):'')
|
||
|
|
+(self.options.overlap!='none'?' OxOverlap'+Ox.toTitleCase(self.options.overlap):'')).attr({disabled:self.options.disabled,type:self.options.type=='text'?'button':'image'}).css(self.options.width=='auto'?{}:{width:(self.options.width-14)+'px'}).on({click:click,mousedown:mousedown});if(self.options.values.length){self.options.values=self.options.values.map(function(value){return{id:value.id||value,title:value.title||value};});self.value=Ox.getIndexById(self.options.values,self.options.value);if(self.value==-1){self.value=0;self.options.value=self.options.values[0].id;}
|
||
|
|
self.options.title=self.options.values[self.value].title;}else if(self.options.selectable){self.options.value=self.options.value||false;}
|
||
|
|
setValue();setTitle();if(Ox.isArray(options.tooltip)){self.options.tooltip=options.tooltip;if(!that.$tooltip){that.$tooltip=Ox.Tooltip();}
|
||
|
|
that.$tooltip.options({title:self.options.tooltip[self.value]});}
|
||
|
|
function click(){if(!self.options.disabled){that.$tooltip&&that.$tooltip.hide();that.triggerEvent('click');if(self.options.values.length||self.options.selectable){that.toggle();that.triggerEvent('change',{value:self.options.value});}}}
|
||
|
|
function mousedown(e){if(self.options.type=='image'&&$.browser.safari){e.preventDefault();}}
|
||
|
|
function setDisabled(){that.attr({disabled:self.options.disabled});that[self.options.disabled?'addClass':'removeClass']('OxDisabled');self.options.disabled&&that.$tooltip&&that.$tooltip.hide();self.options.type=='image'&&setTitle();}
|
||
|
|
function setSelected(){that[self.options.value?'addClass':'removeClass']('OxSelected');self.options.type=='image'&&setTitle();}
|
||
|
|
function setTitle(){if(self.options.type=='image'){that.attr({src:Ox.UI.getImageURL('symbol'+self.options.title[0].toUpperCase()
|
||
|
|
+self.options.title.slice(1),self.options.style=='overlay'?'overlay'+(self.options.disabled?'Disabled':self.options.selectable&&self.options.value?'Selected':''):self.options.style=='video'?'video':self.options.disabled?'disabled':self.options.selectable&&self.options.value?'selected':'')});}else{that.val(self.options.title);}}
|
||
|
|
function setValue(){if(self.options.values.length){self.options.values=self.options.values.map(function(value){return{id:value.id||value,title:value.title||value};});self.value=Ox.getIndexById(self.options.values,self.options.value);if(self.value==-1){self.value=0;self.options.value=self.options.values[0].id;}
|
||
|
|
self.options.title=self.options.values[self.value].title;}else if(self.options.selectable){self.options.value=self.options.value||false;}}
|
||
|
|
that.toggle=function(){if(self.options.values.length>1){self.value=1-Ox.getIndexById(self.options.values,self.options.value);self.options.title=self.options.values[self.value].title;self.options.value=self.options.values[self.value].id;setTitle();that.$tooltip&&that.$tooltip.options({title:self.options.tooltip[self.value]});}else{self.options.value=!self.options.value;}
|
||
|
|
self.options.selectable&&setSelected();return that;}
|
||
|
|
return that;};'use strict';Ox.ButtonGroup=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({buttons:[],max:1,min:1,overlap:'none',selectable:false,size:'medium',style:'default',type:'text',value:options.max!=1?[]:''}).options(options||{}).update({value:function(){var position=Ox.getIndexById(self.options.buttons,self.options.value);if(position>-1){self.$buttons[position].trigger('click');}else if(self.options.min==0){self.$buttons.forEach(function($button,i){$button.options('value')&&$button.trigger('click');});}}}).addClass('OxButtonGroup'
|
||
|
|
+(self.options.style!='default'?' Ox'+Ox.toTitleCase(self.options.style):'')
|
||
|
|
+(self.options.overlap!='none'?' OxOverlap'+Ox.toTitleCase(self.options.overlap):''));self.options.buttons=self.options.buttons.map(function(button,i){return Ox.extend({disabled:button.disabled,id:button.id||button,overlap:self.options.overlap=='left'&&i==0?'left':self.options.overlap=='right'&&i==self.options.buttons.length-1?'right':'none',style:self.options.style,title:button.title||button,tooltip:button.tooltip,width:button.width},self.options.selectable?{selected:Ox.makeArray(self.options.value).indexOf(button.id||button)>-1}:{});});if(self.options.selectable){self.optionGroup=new Ox.OptionGroup(self.options.buttons,self.options.min,self.options.max,'selected');self.options.buttons=self.optionGroup.init();self.options.value=self.optionGroup.value();}
|
||
|
|
self.$buttons=[];self.options.buttons.forEach(function(button,pos){self.$buttons[pos]=Ox.Button({disabled:button.disabled||false,group:true,id:button.id,overlap:button.overlap,selectable:self.options.selectable,size:self.options.size,style:self.options.style=='squared'?'default':self.options.style,title:button.title,tooltip:button.tooltip,type:self.options.type,value:button.selected||false,width:button.width}).bindEvent(self.options.selectable?{change:function(){toggleButton(pos);}}:{click:function(){that.triggerEvent('click',{id:button.id});}}).appendTo(that);});function getButtonById(id){return self.$buttons[Ox.getIndexById(self.options.buttons,id)];}
|
||
|
|
function toggleButton(pos){var toggled=self.optionGroup.toggle(pos);if(!toggled.length){self.$buttons[pos].value(!self.$buttons[pos].value());}else{toggled.forEach(function(i){i!=pos&&self.$buttons[i].value(!self.$buttons[i].value());});self.options.value=self.optionGroup.value();that.triggerEvent('change',{title:self.options.value===''?'':Ox.isString(self.options.value)?Ox.getObjectById(self.options.buttons,self.options.value).title:self.options.value.map(function(value){return Ox.getObjectById(self.options.buttons,value).title;}),value:self.options.value});}}
|
||
|
|
that.disableButton=function(id){getButtonById(id).options({disabled:true});};that.enableButton=function(id){getButtonById(id).options({disabled:false});};that.buttonOptions=function(id,options){return getButtonById(id).options(options);};return that;};'use strict';Ox.Checkbox=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({disabled:false,group:false,indeterminate:false,label:'',labelWidth:64,overlap:'none',style:'rounded',title:'',value:false,width:options&&(options.label||options.title)?'auto':16}).options(options||{}).update({disabled:function(){var disabled=self.options.disabled;that.attr({disabled:disabled});self.$button.options({disabled:disabled});self.$title&&self.$title.options({disabled:disabled});},indeterminate:function(){if(self.options.indeterminate){self.$button.options({values:['remove']});self.$button.options({value:'remove'});}else{self.$button.options({values:['none','check']});self.$button.options({value:self.options.value?'check':'none'});}},label:function(){self.$label.options({title:self.options.label});},title:function(){self.$title.options({title:self.options.title});},value:function(){self.$button.toggle();},width:function(){that.css({width:self.options.width+'px'});self.$title&&self.$title.options({width:getTitleWidth()});}}).addClass('OxCheckbox'+(self.options.overlap=='none'?'':' OxOverlap'+Ox.toTitleCase(self.options.overlap))).attr({disabled:self.options.disabled}).css(self.options.width!='auto'?{width:self.options.width}:{});if(self.options.title){self.options.width!='auto'&&that.css({width:self.options.width+'px'});self.$title=Ox.Label({disabled:self.options.disabled,id:self.options.id+'Label',overlap:'left',style:self.options.style,title:self.options.title,width:getTitleWidth()}).css({float:'right'}).on({click:clickTitle}).appendTo(that);}
|
||
|
|
if(self.options.label){self.$label=Ox.Label({overlap:'right',textAlign:'right',title:self.options.label,width:self.options.labelWidth}).css({float:'left'}).appendTo(that);}
|
||
|
|
self.$button=Ox.Button({disabled:self.options.disabled,id:self.options.id+'Button',style:self.options.style!='rounded'?self.options.style:'',type:'image',value:self.options.indeterminate?'remove':self.options.value?'check':'none',values:self.options.indeterminate?['remove']:['none','check']}).addClass('OxCheckbox').bindEvent({change:clickButton}).appendTo(that);function clickButton(){self.options.value=!self.options.value;if(self.options.indeterminate){self.options.indeterminate=false;self.$button.options({values:['none','check']});self.$button.options({value:self.options.value?'check':'none'});}
|
||
|
|
that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function clickTitle(){!self.options.disabled&&self.$button.trigger('click');}
|
||
|
|
function getTitleWidth(){return self.options.width-16
|
||
|
|
-!!self.options.label*self.options.labelWidth;}
|
||
|
|
return that;};'use strict';Ox.CheckboxGroup=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({checkboxes:[],max:1,min:1,type:'group',value:options.max!=1?[]:'',width:256}).options(options||{}).update({value:function(){var value=Ox.clone(self.options.value);self.$checkboxes.forEach(function($checkbox,index){var checked=Ox.contains(value,$checkbox.options('id'));if(checked!=$checkbox.value()){$checkbox.value(!$checkbox.value());toggleCheckbox(index);}});},width:function(){self.$checkboxes.forEach(function($checkbox){$checkbox.options({width:self.options.width});});}}).addClass('OxCheckboxGroup Ox'+Ox.toTitleCase(self.options.type));self.options.checkboxes=self.options.checkboxes.map(function(checkbox){return{checked:Ox.makeArray(self.options.value).indexOf(checkbox.id||checkbox)>-1,id:checkbox.id||checkbox,title:checkbox.title||checkbox};});self.optionGroup=new Ox.OptionGroup(self.options.checkboxes,self.options.min,self.options.max,'checked');self.options.checkboxes=self.optionGroup.init();self.options.value=self.optionGroup.value();self.$checkboxes=[];if(self.options.type=='group'){self.checkboxWidth=Ox.splitInt(self.options.width+(self.options.checkboxes.length-1)*6,self.options.checkboxes.length).map(function(v,i){return v+(i<self.options.checkboxes.length-1?10:0);});};self.options.checkboxes.forEach(function(checkbox,pos){self.$checkboxes[pos]=Ox.Checkbox(Ox.extend(checkbox,{group:true,id:checkbox.id,width:self.options.type=='group'?self.checkboxWidth[pos]:self.options.width,value:checkbox.checked})).bindEvent('change',function(){toggleCheckbox(pos);}).appendTo(that);});function toggleCheckbox(pos){var toggled=self.optionGroup.toggle(pos);Ox.Log('Form','change',pos,'toggled',toggled)
|
||
|
|
if(!toggled.length){self.$checkboxes[pos].value(!self.$checkboxes[pos].value());}else{toggled.forEach(function(i){i!=pos&&self.$checkboxes[i].value(!self.$checkboxes[i].value());});self.options.value=self.optionGroup.value();that.triggerEvent('change',{title:Ox.isString(self.options.value)?(self.options.value?Ox.getObjectById(self.options.checkboxes,self.options.value).title:''):self.options.value.map(function(value){return Ox.getObjectById(self.options.checkboxes,value).title;}),value:self.options.value});}}
|
||
|
|
return that;};'use strict';Ox.ColorInput=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({mode:'rgb',value:options.mode=='hsl'?[0,1,0.5]:[0,0,0]}).options(options||{});self.$inputs=[];Ox.loop(3,function(i){self.$inputs[i]=Ox.Input({max:self.options.mode=='rgb'?255:i==0?360:1,type:self.options.mode=='rgb'||i==0?'int':'float',value:self.options.value[i],width:40}).bindEvent('autovalidate',change);});self.$inputs[3]=Ox.Label({width:40}).css({background:'rgb('+getRGB().join(', ')+')'});self.$inputs[4]=Ox.ColorPicker({mode:self.options.mode,width:16}).bindEvent({change:function(data){self.options.value=data.value;Ox.loop(3,function(i){self.$inputs[i].options({value:self.options.value[i]});});self.$inputs[3].css({background:'rgb('+getRGB().join(', ')+')'});}}).options({width:16});that.setElement(Ox.InputGroup({inputs:self.$inputs,separators:[{title:',',width:8},{title:',',width:8},{title:'',width:8},{title:'',width:8}],value:Ox.clone(self.options.value)}).bindEvent('change',change));function change(){self.options.value=Ox.range(3).map(function(i){return self.$inputs[i].options('value');})
|
||
|
|
self.$inputs[3].css({background:'rgb('+getRGB().join(', ')+')'});that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function getRGB(){return self.options.mode=='rgb'?self.options.value:Ox.rgb(self.options.value);}
|
||
|
|
return that;};'use strict';Ox.ColorPicker=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({mode:'rgb',value:options&&options.mode=='hsl'?[0,1,0.5]:[0,0,0]}).options(options||{});self.$ranges=[];Ox.loop(3,function(i){self.$ranges[i]=Ox.Range({arrows:true,changeOnDrag:true,id:self.options.id+i,max:self.options.mode=='rgb'?255:i==0?359:1,size:self.options.mode=='rgb'?328:432,step:self.options.mode=='rgb'||i==0?1:0.01,thumbSize:40,thumbValue:true,trackColors:getColors(i),trackGradient:true,value:self.options.value[i]}).css({position:'absolute',top:(i*15)+'px'}).bindEvent({change:function(data){change(i,data.value);}}).appendTo(that);if(i==0){self.$ranges[i].children('input.OxOverlapRight').css({borderRadius:0});self.$ranges[i].children('input.OxOverlapLeft').css({borderRadius:'0 8px 0 0'});}else{self.$ranges[i].children('input').css({borderRadius:0});}});that=Ox.Picker({element:that,elementHeight:46,elementWidth:self.options.mode=='rgb'?328:432});function change(index,value){self.options.value[index]=value;that.$label.css({background:'rgb('+getRGB(self.options.value).join(', ')+')'});Ox.loop(3,function(i){if(i!=index){self.$ranges[i].options({trackColors:getColors(i)});}});that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function getColors(index){return(self.options.mode=='rgb'?[Ox.range(3).map(function(i){return i==index?0:self.options.value[i];}),Ox.range(3).map(function(i){return i==index?255:self.options.value[i];})]:index==0?Ox.range(7).map(function(i){return[i*60,self.options.value[1],self.options.value[2]];}):Ox.range(3).map(function(i){return[self.options.value[0],index==1?i/2:self.options.value[1],index==2?i/2:self.options.value[2]];})).map(function(values){return'rgb('+getRGB(values).join(', ')+')';});}
|
||
|
|
function getRGB(values){return self.options.mode=='rgb'?values:Ox.rgb(values);}
|
||
|
|
return that;};'use strict';Ox.DateInput=function(options,self){var that;self=Ox.extend(self||{},{options:Ox.extend({format:'short',value:Ox.formatDate(new Date(),'%F'),weekday:false,width:{day:32,month:options&&options.format=='long'?80:options&&options.format=='medium'?40:32,weekday:options&&options.format=='long'?80:40,year:48}},options||{})});self.formats={day:'%d',month:self.options.format=='short'?'%m':(self.options.format=='medium'?'%b':'%B'),weekday:self.options.format=='long'?'%A':'%a',year:'%Y'};self.months=self.options.format=='long'?Ox.MONTHS:Ox.SHORT_MONTHS;self.weekdays=self.options.format=='long'?Ox.WEEKDAYS:Ox.SHORT_WEEKDAYS;self.$input=Ox.extend(self.options.weekday?{weekday:Ox.Input({autocomplete:self.weekdays,autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'weekday',width:self.options.width.weekday}).bindEvent('autocomplete',changeWeekday)}:{},{day:Ox.Input({autocomplete:Ox.range(1,Ox.getDaysInMonth(parseInt(Ox.formatDate(self.date,'%Y'),10),parseInt(Ox.formatDate(self.date,'%m'),10))+1).map(function(i){return self.options.format=='short'?Ox.pad(i,2):i.toString();}),autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'day',textAlign:'right',width:self.options.width.day}).bindEvent('autocomplete',changeDay),month:Ox.Input({autocomplete:self.options.format=='short'?Ox.range(1,13).map(function(i){return Ox.pad(i,2);}):self.months,autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'month',textAlign:self.options.format=='short'?'right':'left',width:self.options.width.month}).bindEvent('autocomplete',changeMonthOrYear),year:Ox.Input({autocomplete:Ox.range(1900,3000).concat(Ox.range(1000,1900)).map(function(i){return i.toString();}),autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'year',textAlign:'right',width:self.options.width.year}).bindEvent('autocomplete',changeMonthOrYear)});that=Ox.InputGroup(Ox.extend(self.options,{id:self.options.id,inputs:[].concat(self.options.weekday?[self.$input.weekday]:[],self.options.format=='short'?[self.$input.year,self.$input.month,self.$input.day]:[self.$input.month,self.$input.day,self.$input.year]),join:join,separators:[].concat(self.options.weekday?[{title:self.options.format=='short'?'':',',width:8},]:[],self.options.format=='short'?[{title:'-',width:8},{title:'-',width:8}]:[{title:'',width:8},{title:',',width:8}]),split:split,width:0}),self);function changeDay(){self.options.weekday&&self.$input.weekday.value(Ox.formatDate(new Date([self.$input.month.value(),self.$input.day.value(),self.$input.year.value()].join(' ')),self.formats.weekday));self.options.value=join();}
|
||
|
|
function changeMonthOrYear(){var day=self.$input.day.value(),month=self.$input.month.value(),year=self.$input.year.value(),days=Ox.getDaysInMonth(year,self.options.format=='short'?parseInt(month,10):month);day=day<=days?day:days;self.options.weekday&&self.$input.weekday.value(Ox.formatDate(new Date([month,day,year].join(' ')),self.formats.weekday));self.$input.day.options({autocomplete:Ox.range(1,days+1).map(function(i){return self.options.format=='short'?Ox.pad(i,2):i.toString();}),value:self.options.format=='short'?Ox.pad(parseInt(day,10),2):day.toString()});self.options.value=join();}
|
||
|
|
function changeWeekday(){var date=getDateInWeek(self.$input.weekday.value(),self.$input.month.value(),self.$input.day.value(),self.$input.year.value());self.$input.month.value(date.month);self.$input.day.options({autocomplete:Ox.range(1,Ox.getDaysInMonth(date.year,date.month)+1).map(function(i){return self.options.format=='short'?Ox.pad(i,2):i.toString();}),value:date.day});self.$input.year.value(date.year);self.options.value=join();}
|
||
|
|
function getDate(value){return new Date(self.options.value.replace(/-/g,'/'));}
|
||
|
|
function getDateInWeek(weekday,month,day,year){var date=new Date([month,day,year].join(' '));date=Ox.getDateInWeek(date,weekday);return{day:Ox.formatDate(date,self.formats.day),month:Ox.formatDate(date,self.formats.month),year:Ox.formatDate(date,self.formats.year)};}
|
||
|
|
function getValues(){var date=getDate();return{day:Ox.formatDate(date,self.formats.day),month:Ox.formatDate(date,self.formats.month),weekday:Ox.formatDate(date,self.formats.weekday),year:Ox.formatDate(date,self.formats.year)};}
|
||
|
|
function join(){return Ox.formatDate(new Date(self.options.format=='short'?[self.$input.year.value(),self.$input.month.value(),self.$input.day.value()].join('/'):[self.$input.month.value(),self.$input.day.value(),self.$input.year.value()].join(' ')),'%F');}
|
||
|
|
function split(){var values=getValues();return[].concat(self.options.weekday?[values.weekday]:[],self.options.format=='short'?[values.year,values.month,values.day]:[values.month,values.day,values.year]);}
|
||
|
|
return that;};'use strict';Ox.DateTimeInput=function(options,self){var that;self=Ox.extend(self||{},{options:Ox.extend({ampm:false,format:'short',milliseconds:false,seconds:false,value:(function(){var date=new Date();return Ox.formatDate(date,'%F '+(options&&(options.seconds||options.milliseconds)?'%T':'%H:%M'))+(options&&options.milliseconds?'.'+Ox.pad(date%1000,3):'');}()),weekday:false},options||{})});self.options.seconds=self.options.seconds||self.options.milliseconds;that=Ox.InputGroup(Ox.extend(self.options,{inputs:[Ox.DateInput({format:self.options.format,id:'date',weekday:self.options.weekday}),Ox.TimeInput({ampm:self.options.ampm,id:'time',seconds:self.options.seconds})],join:join,separators:[{title:'',width:8}],split:split}),self);function join(){return that.options('inputs').map(function($input){return $input.value();}).join(' ');}
|
||
|
|
function split(){return self.options.value.split(' ');}
|
||
|
|
return that;};'use strict';Ox.Editable=function(options,self){self=self||{};var that=Ox.Element({element:options.type=='textarea'?'<div>':'<span>',tooltip:options.tooltip},self).defaults({blurred:false,clickLink:null,editable:true,editing:false,format:null,globalAttributes:[],height:0,highlight:null,maxHeight:void 0,placeholder:'',submitOnBlur:true,tags:null,tooltip:'',type:'input',unformat:null,value:'',width:0}).options(options||{}).update({editing:function(){if(self.options.editing){self.options.editing=false;edit();}else{submit();}},height:function(){setCSS({height:self.options.height+'px'});},width:function(){setCSS({width:self.options.width+'px'});},highlight:function(){formatValue();},placeholder:function(){formatValue();},value:function(){formatValue();self.$input&&self.$input.options({value:formatInputValue()});}}).addClass('OxEditableElement OxKeyboardFocus'
|
||
|
|
+(self.options.editable?' OxEditable':'')).on({click:function(e){var $target=$(e.target);if(!e.shiftKey&&($target.is('a')||($target=$target.parents('a')).length)){e.preventDefault();if(self.options.clickLink){e.target=$target[0];self.options.clickLink(e);}else{document.location.href=$target.attr('href');}}
|
||
|
|
return false;}}).bindEvent({doubleclick:edit,singleclick:function(e){}});self.options.value=self.options.value.toString();self.css={};self.$value=Ox.Element(self.options.type=='input'?'<span>':'<div>').addClass('OxValue').appendTo(that);formatValue();if(self.options.editing){setTimeout(function(){self.options.editing=false;edit();});}
|
||
|
|
function blur(data){self.options.value=parseValue();if(self.options.value!==self.originalValue){self.originalValue=self.options.value;that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
that.triggerEvent('blur',data);}
|
||
|
|
function cancel(){self.options.editing=false;that.removeClass('OxEditing');self.options.value=self.originalValue;self.$input.value(formatInputValue()).hide();self.$test.html(formatTestValue());formatValue();self.$value.show();that.triggerEvent('cancel',{value:self.options.value});}
|
||
|
|
function change(data){self.options.value=parseValue(data.value);formatValue();self.$test.html(formatTestValue());setSizes();}
|
||
|
|
function edit(){var height,width;if(self.options.editable&&!self.options.editing){self.options.editing=true;that.addClass('OxEditing');self.originalValue=self.options.value;if(!self.$input){self.$input=Ox.Input({autocomplete:self.options.autocomplete,autocompleteReplace:self.options.autocompleteReplace,autocompleteReplaceCorrect:self.options.autocompleteReplaceCorrect,autocompleteSelect:self.options.autocompleteSelect,autocompleteSelectHighlight:self.options.autocompleteSelectHighlight,autocompleteSelectMaxWidth:self.options.autocompleteSelectMaxWidth,autocompleteSelectOffset:self.options.autocompleteSelectOffset,autocompleteSelectSubmit:self.options.autocompleteSelectSubmit,autocompleteSelectUpdate:self.options.autocompleteSelectUpdate,changeOnKeypress:true,element:self.options.type=='input'?'<span>':'<div>',style:'square',type:self.options.type,value:formatInputValue()}).css(self.css).bindEvent({blur:self.options.submitOnBlur?submit:blur,cancel:cancel,change:change,insert:function(data){that.triggerEvent('insert',data);},submit:submit}).appendTo(that);self.$input.find('input').css(self.css);self.$test=self.$value.clone().css(Ox.extend({display:'inline-block'},self.css)).html(formatTestValue()).css({background:'rgb(192, 192, 192)'}).appendTo(that);}
|
||
|
|
self.minWidth=8;self.maxWidth=that.parent().width();self.minHeight=13;self.maxHeight=self.options.type=='input'?self.minHeight:self.options.maxHeight||that.parent().height();setSizes();self.$value.hide();self.$input.show();if(!self.options.blurred){setTimeout(function(){self.$input.focusInput(self.options.type=='input');},0);that.$tooltip&&that.$tooltip.options({title:''});that.triggerEvent('edit');}}else if(!self.options.editable){that.triggerEvent('open');}
|
||
|
|
self.options.blurred=false;}
|
||
|
|
function formatInputValue(){return self.options.type=='input'?(self.options.unformat||Ox.decodeHTMLEntities)(self.options.value):self.options.value.replace(/<br\/?><br\/?>/g,'\n\n');}
|
||
|
|
function formatTestValue(){var value=Ox.encodeHTMLEntities((self.options.unformat||Ox.identity)(self.$input.options('value')));return!value?' ':self.options.type=='input'?value.replace(/ /g,' '):value.replace(/\n$/,'\n ').replace(/ /g,' ').replace(/(^ | $)/,' ').replace(/\n/g,'<br/>')}
|
||
|
|
function formatValue(){var value=self.options.value;that.removeClass('OxPlaceholder');if(self.options.value===''&&self.options.placeholder){value=self.options.placeholder;that.addClass('OxPlaceholder');}else if(self.options.format){value=self.options.format(self.options.value);}
|
||
|
|
if(self.options.highlight){value=Ox.highlight(value,self.options.highlight,'OxHighlight',true);}
|
||
|
|
self.$value.html(value);self.$value[self.options.value===''?'removeClass':'addClass']('OxSelectable');}
|
||
|
|
function parseValue(){var value=Ox.clean(self.$input.value().replace(/\n\n+/g,'\0')).replace(/\0/g,'\n\n').trim();return(self.options.type=='input'?Ox.encodeHTMLEntities(value):Ox.sanitizeHTML(value,self.options.tags,self.options.globalAttributes));}
|
||
|
|
function setCSS(css){self.$test&&self.$test.css(css);self.$input&&self.$input.css(css);self.$input&&self.$input.find(self.options.type).css(css);}
|
||
|
|
function setSizes(){var height,width;self.$test.css({display:'inline-block'});height=self.options.height||Ox.limit(self.$test.height(),self.minHeight,self.maxHeight);width=self.$test.width();if(self.options.type=='textarea'){width+=Ox.UI.SCROLLBAR_SIZE;}
|
||
|
|
width=self.options.width||Ox.limit(width,self.minWidth,self.maxWidth);self.$test.css({display:'none'});self.$input.options({width:width,height:height});self.$input.find(self.options.type).css({width:width+'px',height:height+'px'});}
|
||
|
|
function submit(){self.options.editing=false;that.removeClass('OxEditing');self.$input.value(formatInputValue()).hide();self.$test.html(formatTestValue());formatValue();self.$value.show();that.$tooltip&&that.$tooltip.options({title:self.options.tooltip});that.triggerEvent('submit',{value:self.options.value});}
|
||
|
|
that.css=function(css){self.css=css;that.$element.css(css);self.$value.css(css);self.$test&&self.$test.css(css);self.$input&&self.$input.css(css);return that;};return that;};Ox.EditableContent=function(options,self){self=self||{};if(options.tooltip){self.tooltip=options.tooltip;options.tooltip=function(e){return that.hasClass('OxEditing')?'':Ox.isString(self.tooltip)?self.tooltip:self.tooltip(e);}}
|
||
|
|
var that=Ox.Element(options.type=='textarea'?'<div>':'<span>',self).defaults({clickLink:null,collapseToEnd:true,editable:true,editing:false,format:null,globalAttributes:[],highlight:null,placeholder:'',submitOnBlur:true,tags:null,tooltip:'',type:'input',value:''}).options(options||{}).update({editing:function(){if(self.options.editing){self.options.editing=false;edit();}else{submit();}},placeholder:function(){!self.options.editing&&that.html(formatValue());},highlight:function(){!self.options.editing&&that.html(formatValue());},value:function(){!self.options.editing&&that.html(formatValue());}}).addClass('OxEditableContent OxKeyboardFocus').on({blur:self.options.submitOnBlur?submit:blur,click:function(e){var $target=$(e.target);if(!e.shiftKey&&($target.is('a')||($target=$target.parents('a')).length)){e.preventDefault();if(self.options.clickLink){e.target=$target[0];self.options.clickLink(e);}else{document.location.href=$target.attr('href');}}
|
||
|
|
return false;},keydown:function(e){if(e.keyCode==13){if(e.shiftKey||self.options.type=='input'){submit();}else{var selection=window.getSelection(),node=selection.anchorNode,offset=selection.anchorOffset,range=document.createRange(),text=node.textContent;e.preventDefault();node.textContent=text.substr(0,offset)
|
||
|
|
+'\n'+(text.substr(offset)||' ');range.setStart(node,offset+1);range.setEnd(node,offset+1);selection.removeAllRanges();selection.addRange(range);}
|
||
|
|
return false;}else if(e.keyCode==27){cancel();return false;}
|
||
|
|
setTimeout(function(){that.css({padding:that.text()?0:'0 2px'});});},paste:function(e){if(e.originalEvent.clipboardData&&e.originalEvent.clipboardData.getData){var value=e.originalEvent.clipboardData.getData('text/plain');value=Ox.encodeHTMLEntities(value).replace(/\n\n\n/g,'<br/><br/>\n');document.execCommand('insertHTML',false,value);e.originalEvent.stopPropagation();e.originalEvent.preventDefault();return false;}}}).bindEvent({doubleclick:edit});self.options.value=self.options.value.toString();that.html(formatValue());if(self.options.editing){setTimeout(function(){self.options.editing=false;edit();});}
|
||
|
|
function blur(){}
|
||
|
|
function cancel(){if(self.options.editing){that.loseFocus();self.options.editing=false;that.removeClass('OxEditing').attr({contenteditable:false}).html(formatValue());if(self.options.type=='input'){that.css({padding:0});}
|
||
|
|
that.triggerEvent('cancel',{value:self.options.value});}}
|
||
|
|
function edit(){if(self.options.editable&&!self.options.editing){var value=formatInputValue();that.$tooltip&&that.$tooltip.remove();that.addClass('OxEditing').removeClass('OxPlaceholder').attr({contenteditable:true});if(value){that.text(value);}else{that.text('');if(self.options.type=='input'){that.css({padding:'0 2px'});}}
|
||
|
|
self.options.editing=true;that.gainFocus();setTimeout(updateSelection);that.triggerEvent('edit');}else if(!self.options.editable){that.triggerEvent('open');}}
|
||
|
|
function formatInputValue(){return self.options.type=='input'?Ox.decodeHTMLEntities(self.options.value):self.options.value.replace(/<br\/?><br\/?>/g,'\n\n');}
|
||
|
|
function formatValue(){var value=self.options.value;that.removeClass('OxPlaceholder');if(self.options.value===''&&self.options.placeholder){value=self.options.placeholder;that.addClass('OxPlaceholder');}else if(self.options.format){value=self.options.format(self.options.value);}
|
||
|
|
if(self.options.highlight){value=Ox.highlight(value,self.options.highlight,'OxHighlight',true);}
|
||
|
|
that[self.options.value===''?'removeClass':'addClass']('OxSelectable');return value;}
|
||
|
|
function parseValue(){var value=Ox.clean(that.text().replace(/\n\n+/g,'\0')).replace(/\0/g,'\n\n').trim();return(self.options.type=='input'?Ox.encodeHTMLEntities(value):Ox.sanitizeHTML(value,self.options.tags,self.options.globalAttributes));}
|
||
|
|
function submit(){if(self.options.editing){that.loseFocus();self.options.editing=false;self.options.value=parseValue();that.removeClass('OxEditing').attr({contenteditable:false}).html(formatValue());if(self.options.type=='input'){that.css({padding:0});}
|
||
|
|
that.triggerEvent('submit',{value:self.options.value});}}
|
||
|
|
function updateSelection(){var range=document.createRange(),selection=window.getSelection();that[0].focus();if(self.options.collapseToEnd){selection.removeAllRanges();range.selectNodeContents(that[0]);selection.addRange(range);}
|
||
|
|
setTimeout(function(){selection.collapseToEnd();});}
|
||
|
|
return that;};'use strict';Ox.FileButton=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({disabled:false,image:options&&options.maxFiles==1?'file':'files',maxFiles:-1,maxSize:-1,style:'default',title:'',type:'text',width:options.type=='image'?16:256}).options(options||{}).update({disabled:function(){self.$button.options({disabled:self.options.disabled});self.$input[self.options.disabled?'hide':'show']();},title:function(){self.$button.options({title:self.options.title});}}).addClass('OxFileButton').css({overflow:'hidden'});self.files=[];self.multiple=self.options.maxFiles!=1;self.$button=Ox.Button({disabled:self.options.disabled,style:self.options.style,title:self.options.type=='image'?self.options.image:self.options.title,type:self.options.type,width:self.options.type=='image'?'auto':self.options.width}).css({float:'left'}).appendTo(that);self.$input=renderInput();self.options.disabled&&self.$input.hide();function selectFiles(e){var filelist=e.target.files,files=[];self.files=[];Ox.loop(filelist.length,function(i){files.push(filelist.item(i));});files.sort(self.options.maxSize==-1?function(a,b){a=a.name.toLowerCase();b=b.name.toLowerCase();return a<b?-1:a>b?1:0;}:function(a,b){return a.size-b.size;}).forEach(function(file){if((self.options.maxFiles==-1||self.files.length<self.options.maxFiles)&&(self.options.maxSize==-1||self.size+file.size<self.options.maxSize)){self.files.push(file);self.size+=file.size;}});self.$input=renderInput();if(self.files.length){that.triggerEvent('click',{files:self.files});}}
|
||
|
|
function renderInput(){self.$input&&self.$input.remove();return $('<input>').attr(Ox.extend({title:self.options.title,type:'file'},self.multiple?{multiple:true}:{})).css({float:'left',width:self.options.width+'px',height:'16px',marginLeft:-self.options.width+'px',opacity:0}).on({change:selectFiles}).appendTo(that);}
|
||
|
|
that.blurButton=function(){self.$input.blur();};that.focusButton=function(){self.$input.focus();};return that;}
|
||
|
|
'use strict';Ox.FileInput=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({disabled:false,label:'',labelWidth:128,maxFiles:-1,maxLines:-1,maxSize:-1,value:[],width:256}).options(options||{}).update({disabled:function(){that[self.options.disabled?'addClass':'removeClass']('OxDisabled');self.$button.options({disabled:self.options.disabled});self.$input&&self.$input[self.options.disabled?'hide':'show']();},label:function(){self.$label&&self.$label.options({title:self.options.label});}}).addClass('OxFileInput'+(self.options.disabled?' OxDisabled':'')).css({width:self.options.width+'px'});self.multiple=self.options.maxFiles!=1;self.size=getSize();if(self.options.label){self.$label=Ox.Label({overlap:'right',textAlign:'right',title:self.options.label,width:self.options.labelWidth}).appendTo(that);}
|
||
|
|
self.$bar=Ox.Bar({size:14}).css(Ox.extend({width:getWidth()-2+'px'},self.multiple&&self.options.value.length?{borderBottomLeftRadius:0,borderBottomRightRadius:0}:{})).appendTo(that);self.$title=$('<div>').css({float:'left',width:getWidth()-104+'px',paddingLeft:'6px',overflow:'hidden',textOverflow:'ellipsis'}).html(getTitleText()).appendTo(self.$bar);self.$size=$('<div>').css({float:'left',width:'64px',height:'14px',paddingRight:'16px',textAlign:'right'}).html(getSizeText()).appendTo(self.$bar);self.$button=Ox.Button({disabled:self.options.disabled,style:'symbol',title:self.multiple||self.options.value.length==0?'add':'close',type:'image'}).attr({title:self.multiple||self.options.value.length==0?'':'Clear'}).css({float:'left',marginTop:'-1px'}).bindEvent({click:clearFile}).appendTo(self.$bar);if(self.multiple||self.options.value.length==0){self.$input=renderInput();self.options.disabled&&self.$input.hide();}
|
||
|
|
if(self.multiple){self.$files=$('<div>').addClass('OxFiles').css({width:getWidth()-2+'px',height:getHeight()}).appendTo(that);self.options.value.length==0&&self.$files.hide();self.$list=Ox.TableList({columns:[{id:'name',visible:true,width:getWidth()-94},{align:'right',format:function(value){return Ox.formatValue(value,'B');},id:'size',visible:true,width:64},{align:'right',format:function(value,data){return Ox.Button({style:'symbol',title:'close',type:'image'}).attr({title:Ox._('Remove File')}).css({margin:'-1px -4px 0 0'}).bindEvent({click:function(){self.$list.options({selected:[value]});removeFiles([value]);}});},id:'id',visible:true,width:28}],items:getItems(),sort:[{key:'name',operator:'+'}],unique:'id'}).css({left:0,top:0,width:getWidth()-2+'px',height:'64px'}).bindEvent({'delete':function(data){removeFiles(data.ids);}}).appendTo(self.$files);}
|
||
|
|
function addFiles(e){var filelist=e.target.files,files=[];Ox.loop(filelist.length,function(i){files.push(filelist.item(i));});files.sort(self.options.maxSize==-1?function(a,b){a=a.name.toLowerCase();b=b.name.toLowerCase();return a<b?-1:a>b?1:0;}:function(a,b){return a.size-b.size;}).forEach(function(file){if(!exists(file)&&(self.options.maxFiles==-1||self.options.value.length<self.options.maxFiles)&&(self.options.maxSize==-1||self.size+file.size<self.options.maxSize)){self.options.value.push(file);self.size+=file.size;}});self.$title.html(getTitleText());self.$size.html(getSizeText());if(self.multiple){self.$bar.css({borderBottomLeftRadius:0,borderBottomRightRadius:1});self.$files.css({height:getHeight()}).show();self.$list.options({items:getItems()});if(self.options.value.length==self.options.maxFiles||self.size==self.options.maxSize){self.$button.options({disabled:true});}
|
||
|
|
self.$input=renderInput();}else{self.$button.options({title:'close'}).attr({title:Ox._('Clear')});self.$input.remove();}
|
||
|
|
that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function clearFile(){self.options.value=[];self.size=0;self.$title.html(getTitleText());self.$size.html(getSizeText());self.$button.options({title:'add'}).attr({title:''});self.$input=renderInput();that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function exists(file){return self.options.value.some(function(f){return f.name==file.name&&f.size==file.size&&Ox.isEqual(f.lastModifiedDate,file.lastModifiedDate);});}
|
||
|
|
function getHeight(){return(self.options.maxLines==-1?self.options.value.length:Math.min(self.options.value.length,self.options.maxLines))*16+'px';}
|
||
|
|
function getItems(){return self.options.value.map(function(file,i){return{name:file.name,size:file.size,id:i};});}
|
||
|
|
function getSize(){return self.options.value.reduce(function(prev,curr){return prev+curr.size;},0);}
|
||
|
|
function getSizeText(){return self.size?Ox.formatValue(self.size,'B'):'';}
|
||
|
|
function getTitleText(){var length=self.options.value.length
|
||
|
|
return length==0?Ox._('No file'+(self.multiple?'s':'')+' selected'):self.multiple?Ox.formatCount(length,'file'):self.options.value[0].name;}
|
||
|
|
function getWidth(){return self.options.width-(self.options.label?self.options.labelWidth:0);}
|
||
|
|
function removeFiles(ids){self.options.value=self.options.value.filter(function(v,i){return ids.indexOf(i)==-1;});self.size=getSize();if(self.options.value.length==0){self.$bar.css({borderBottomLeftRadius:'8px',borderBottomRightRadius:'8px'});self.$files.hide();}
|
||
|
|
self.$title.html(getTitleText());self.$size.html(getSizeText());self.$list.options({items:getItems(),selected:[]});self.$files.css({height:getHeight()});that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function renderInput(){self.$input&&self.$input.remove();return $('<input>').attr(Ox.extend({title:self.multiple?Ox._('Add Files'):Ox._('Select File'),type:'file'},self.multiple?{multiple:true}:{})).css({float:'left',width:'16px',height:'14px',margin:'-1px -7px 0 -16px',opacity:0}).on({change:addFiles}).appendTo(self.$bar);}
|
||
|
|
that.clear=function(){clearFile();return that;};return that;};'use strict';Ox.Filter=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({findKeys:[],list:null,listName:Ox._('Smart List'),sortKeys:[],value:{conditions:[],operator:'&'},viewKeys:[]}).options(options||{}).update({value:function(){setValue();renderConditions();}});self.conditionOperators={boolean:[{id:'=',title:Ox._('is')},{id:'!=',title:Ox._('is not')}],date:[{id:'=',title:Ox._('is')},{id:'!=',title:Ox._('is not')},{id:'<',title:Ox._('is before')},{id:'!<',title:Ox._('is not before')},{id:'>',title:Ox._('is after')},{id:'!>',title:Ox._('is not after')},{id:'=,',title:Ox._('is between')},{id:'!=,',title:Ox._('is not between')}],'enum':[{id:'=',title:Ox._('is')},{id:'!=',title:Ox._('is not')},{id:'<',title:Ox._('is less than')},{id:'!<',title:Ox._('is not less than')},{id:'>',title:Ox._('is greater than')},{id:'!>',title:Ox._('is not greater than')},{id:'=,',title:Ox._('is between')},{id:'!=,',title:Ox._('is not between')}],item:[{id:'==',title:Ox._('is')},{id:'!==',title:Ox._('is not')}],list:[{id:'==',title:Ox._('is')},{id:'!==',title:Ox._('is not')}],number:[{id:'=',title:Ox._('is')},{id:'!=',title:Ox._('is not')},{id:'<',title:Ox._('is less than')},{id:'!<',title:Ox._('is not less than')},{id:'>',title:Ox._('is greater than')},{id:'!>',title:Ox._('is not greater than')},{id:'=,',title:Ox._('is between')},{id:'!=,',title:Ox._('is not between')}],place:[{id:'==',title:Ox._('is')},{id:'!==',title:Ox._('is not')},{id:'=',title:Ox._('contains')},{id:'!=',title:Ox._('does not contain')},{id:'^',title:Ox._('starts with')},{id:'!^',title:Ox._('does not start with')},{id:'$',title:Ox._('ends with')},{id:'!$',title:Ox._('does not end with')}],string:[{id:'==',title:Ox._('is')},{id:'!==',title:Ox._('is not')},{id:'=',title:Ox._('contains')},{id:'!=',title:Ox._('does not contain')},{id:'^',title:Ox._('starts with')},{id:'!^',title:Ox._('does not start with')},{id:'$',title:Ox._('ends with')},{id:'!$',title:Ox._('does not end with')}],text:[{id:'=',title:Ox._('contains')},{id:'!=',title:Ox._('does not contain')}],year:[{id:'==',title:Ox._('is')},{id:'!==',title:Ox._('is not')},{id:'<',title:Ox._('is before')},{id:'!<',title:Ox._('is not before')},{id:'>',title:Ox._('is after')},{id:'!>',title:Ox._('is not after')},{id:'=,',title:Ox._('is between')},{id:'!=,',title:Ox._('is not between')}]};self.defaultValue={boolean:'true',date:Ox.formatDate(new Date(),'%F'),'enum':0,float:0,hue:0,integer:0,item:void 0,list:'',place:'',string:'',text:'',time:'00:00:00',year:new Date().getFullYear().toString()};self.operators=[{id:'&',title:Ox._('all')},{id:'|',title:Ox._('any')}];setValue();self.$operator=Ox.FormElementGroup({elements:[Ox.Label({title:Ox._('Match'),overlap:'right',width:48}),Ox.FormElementGroup({elements:[Ox.Select({items:self.operators,value:self.options.value.operator,width:48}).bindEvent({change:changeOperator}),Ox.Label({overlap:'left',title:Ox._('of the following conditions'),width:160})],float:'right',width:208})],float:'left'});self.$save=Ox.InputGroup({inputs:[Ox.Checkbox({width:16}),Ox.Input({id:'list',placeholder:Ox._('Untitled'),width:128})],separators:[{title:Ox._('Save as {0}',[self.options.listName]),width:112}]});self.$limit=Ox.InputGroup({inputs:[Ox.Checkbox({width:16}),Ox.FormElementGroup({elements:[Ox.Input({type:'int',width:56}),Ox.Select({items:[{id:'items',title:Ox._('items')},{},{id:'hours',title:Ox._('hours')},{id:'days',title:Ox._('days')},{},{id:'GB',title:'GB'}],overlap:'left',width:64})],float:'right',width:120}),Ox.Select({items:self.options.sortKeys,width:128}),Ox.FormElementGroup({elements:[Ox.Select({items:[{id:'ascending',title:Ox._('ascending')},{id:'descending',title:Ox._('descending')}],width:128}),Ox.Label({overlap:'left',title:Ox._('order'),width:72})],float:'right',width:200})],separators:[{title:Ox._('Limit to'),width:56},{title:Ox._('sorted by'),width:60},{title:Ox._('in'),width:32}]});self.$view=Ox.InputGroup({inputs:[Ox.Checkbox({width:16}),Ox.Select({items:self.options.viewKeys,width:128}),Ox.Select({i
|
||
|
|
key=Ox.getObjectById(self.options.findKeys,condition.key);condition={key:key.id,operator:condition.operator,value:self.defaultValue[key.type]||''};if(isGroup){Ox.Log('Form','isGroup',self.options.value.operator)
|
||
|
|
condition={conditions:[condition],operator:self.options.value.operator=='&'?'|':'&'};}
|
||
|
|
if(subpos==-1){self.options.value.conditions.splice(pos,0,condition);}else{self.options.value.conditions[pos].conditions.splice(subpos,0,condition);}
|
||
|
|
renderConditions(pos,subpos);if(!isUselessCondition(pos,subpos)){triggerChangeEvent();}}
|
||
|
|
function changeConditionKey(pos,subpos,key){subpos=Ox.isUndefined(subpos)?-1:subpos;Ox.Log('Form','changeConditionKey',pos,subpos,key);var condition=subpos==-1?self.options.value.conditions[pos]:self.options.value.conditions[pos].conditions[subpos],oldFindKey=Ox.getObjectById(self.options.findKeys,condition.key),newFindKey=Ox.getObjectById(self.options.findKeys,key),oldConditionType=getConditionType(oldFindKey.type),newConditionType=getConditionType(newFindKey.type),changeConditionType=oldConditionType!=newConditionType,changeConditionFormat=!Ox.isEqual(oldFindKey.format,newFindKey.format),changeConditionAutocomplete=!Ox.isEqual(oldFindKey.autocomplete,newFindKey.autocomplete),wasUselessCondition=isUselessCondition(pos,subpos);Ox.Log('Form','old new',oldConditionType,newConditionType)
|
||
|
|
condition.key=key;if(changeConditionType||changeConditionFormat||changeConditionAutocomplete){if(Ox.getIndexById(self.conditionOperators[newConditionType],condition.operator)==-1){condition.operator=self.conditionOperators[newConditionType][0].id;}
|
||
|
|
if(['string','text'].indexOf(oldConditionType)==-1||['string','text'].indexOf(newConditionType)==-1){condition.value=newFindKey.type=='item'?newFindKey.values[0].id:(self.defaultValue[newFindKey.type]||'');}
|
||
|
|
renderConditions();}
|
||
|
|
if(!(wasUselessCondition&&isUselessCondition(pos,subpos))){triggerChangeEvent();}}
|
||
|
|
function isBetweenCondition(condition){if(condition.key=="resolution"){return Ox.isArray(condition.value)&&Ox.isArray(condition.value[0])}
|
||
|
|
return Ox.isArray(condition.value)}
|
||
|
|
function changeConditionOperator(pos,subpos,operator){subpos=Ox.isUndefined(subpos)?-1:subpos;Ox.Log('FILTER','chCoOp','query',self.options.value)
|
||
|
|
var condition=subpos==-1?self.options.value.conditions[pos]:self.options.value.conditions[pos].conditions[subpos],isBetween=operator.indexOf(',')>-1,wasBetween=isBetweenCondition(condition),wasUselessCondition=isUselessCondition(pos,subpos);Ox.Log('FILTER','chCoOp','iB/wB',isBetween,wasBetween)
|
||
|
|
condition.operator=operator;if(isBetween&&!wasBetween){condition.operator=condition.operator.replace(',','');condition.value=[condition.value,condition.value]
|
||
|
|
renderConditions();}else if(!isBetween&&wasBetween){condition.value=condition.value[0]
|
||
|
|
renderConditions();}
|
||
|
|
if(!(wasUselessCondition&&isUselessCondition(pos,subpos))){triggerChangeEvent();}}
|
||
|
|
function changeConditionValue(pos,subpos,value){Ox.Log('FILTER','cCV',pos,subpos,value);var condition=subpos==-1?self.options.value.conditions[pos]:self.options.value.conditions[pos].conditions[subpos];condition.value=value;triggerChangeEvent();}
|
||
|
|
function changeGroupOperator(pos,value){self.options.value.conditions[pos].operator=value;triggerChangeEvent();}
|
||
|
|
function changeOperator(data){var hasGroups=false;self.options.value.operator=data.value;Ox.forEach(self.options.value.conditions,function(condition){if(condition.conditions){hasGroups=true;return false;}});hasGroups&&renderConditions();self.options.value.conditions.length>1&&triggerChangeEvent();}
|
||
|
|
function getConditionType(type){type=Ox.isArray(type)?type[0]:type;if(['float','hue','integer','time'].indexOf(type)>-1){type='number';}
|
||
|
|
return type;}
|
||
|
|
function isUselessCondition(pos,subpos){subpos=Ox.isUndefined(subpos)?-1:subpos;var conditions=subpos==-1?self.options.value.conditions[pos].conditions||[self.options.value.conditions[pos]]:[self.options.value.conditions[pos].conditions[subpos]],isUseless=false;Ox.forEach(conditions,function(condition){isUseless=['string','text'].indexOf(getConditionType(Ox.getObjectById(self.options.findKeys,condition.key).type))>-1&&(self.options.value.operator=='&'?['','^','$']:['!','!^','!$']).indexOf(condition.operator)>-1&&condition.value==='';if(!isUseless){return false;}});return isUseless;}
|
||
|
|
function removeCondition(pos,subpos){subpos=Ox.isUndefined(subpos)?-1:subpos;var wasUselessCondition=isUselessCondition(pos,subpos);if(subpos==-1||self.options.value.conditions[pos].conditions.length==1){self.options.value.conditions.splice(pos,1);}else{self.options.value.conditions[pos].conditions.splice(subpos,1);}
|
||
|
|
renderConditions();if(!wasUselessCondition){triggerChangeEvent();}}
|
||
|
|
function renderButtons(pos,subpos){subpos=Ox.isUndefined(subpos)?-1:subpos;var isGroup=subpos==-1&&self.options.value.conditions[pos].conditions;return[].concat([Ox.Button({id:'remove',title:self.options.value.conditions.length==1?'close':'remove',tooltip:self.options.value.conditions.length==1?Ox._('Reset this condition'):isGroup?Ox._('Remove this group of conditions'):Ox._('Remove this condition'),type:'image'}).css({margin:'0 4px 0 '+(isGroup?'292px':'8px')}).bindEvent({click:function(data){var key,that=this;that.focus();setTimeout(function(){if(self.options.value.conditions.length==1){key=self.options.findKeys[0];self.options.value.conditions=[{key:key.id,value:'',operator:self.conditionOperators[key.type][0].id}];renderConditions();triggerChangeEvent();}else if(that.parent().data('subposition')==-1){removeCondition(that.parent().data('position'));}else{removeCondition(that.parent().data('position'),that.parent().data('subposition'));}});}}),Ox.Button({id:'add',title:'add',tooltip:Ox._('Add a condition'),type:'image'}).css({margin:'0 '+(subpos==-1?'4px':'0')+' 0 4px'}).bindEvent({click:function(data){var that=this;that.focus();setTimeout(function(){if(that.parent().data('subposition')==-1){addCondition(that.parent().data('position')+1);}else{addCondition(that.parent().data('position'),that.parent().data('subposition')+1);}});}})],subpos==-1?[Ox.Button({id:'addgroup',title:'bracket',tooltip:Ox._('Add a group of conditions'),type:'image'}).css({margin:'0 0 0 4px'}).bindEvent({click:function(data){var that=this;that.focus();setTimeout(function(){addCondition(that.parent().data('position')+1,-1,true);});}})]:[]);}
|
||
|
|
function renderCondition(condition,pos,subpos){subpos=Ox.isUndefined(subpos)?-1:subpos;var condition=subpos==-1?self.options.value.conditions[pos]:self.options.value.conditions[pos].conditions[subpos];Ox.Log('Form','renderCondition',condition,pos,subpos)
|
||
|
|
return Ox.FormElementGroup({elements:[renderConditionKey(condition),renderConditionOperator(condition),renderConditionValue(condition)].concat(renderButtons(pos,subpos))}).css({marginLeft:subpos==-1?0:'24px'}).data({position:pos,subposition:subpos});}
|
||
|
|
function renderConditionKey(condition){return Ox.Select({items:self.options.findKeys,overlap:'right',value:condition.key,width:128}).bindEvent({change:function(data){var $element=this.parent();changeConditionKey($element.data('position'),$element.data('subposition'),data.value);}});}
|
||
|
|
function renderConditionOperator(condition){var key=Ox.getObjectById(self.options.findKeys,condition.key),conditionType=getConditionType(key.type),conditionOperators=self.conditionOperators[conditionType]||self.conditionOperators["string"];Ox.Log('FILTER','rCO',condition,conditionType,conditionOperators)
|
||
|
|
return Ox.Select({items:conditionOperators,overlap:'right',value:condition.operator+(isBetweenCondition(condition)?',':''),width:128}).bindEvent({change:function(data){var $element=this.parent();changeConditionOperator($element.data('position'),$element.data('subposition'),data.value);}});}
|
||
|
|
function renderConditionValue(condition){return(!isBetweenCondition(condition)?renderInput(condition):Ox.InputGroup({inputs:[renderInput(condition,0).options({id:'start'}),renderInput(condition,1).options({id:'end'})],separators:[{title:Ox._('and'),width:32}]})).bindEvent({change:change,submit:change});function change(data){var $element=this.parent();changeConditionValue($element.data('position'),$element.data('subposition'),data.value);}}
|
||
|
|
function renderConditions(focusPos,focusSubpos){Ox.Log('Form','renderConditions',self.options.value)
|
||
|
|
var $conditions=[],focusIndex;while(self.$form.options('items').length>self.numberOfAdditionalFormItems){self.$form.removeItem(1);}
|
||
|
|
self.options.value.conditions.forEach(function(condition,pos){if(!condition.conditions){$conditions.push(renderCondition(condition,pos));if(pos==focusPos&&focusSubpos==-1){focusIndex=$conditions.length-1;}}else{$conditions.push(renderGroup(condition,pos));condition.conditions.forEach(function(subcondition,subpos){$conditions.push(renderCondition(subcondition,pos,subpos));if(pos==focusPos&&subpos==focusSubpos){focusIndex=$conditions.length-1;}});}});$conditions.forEach(function($condition,pos){var $input;self.$form.addItem(1+pos,$condition);if(focusIndex==pos){$input=$condition.options('elements')[2];if($input.focusInput){$input.focusInput();}}});}
|
||
|
|
function renderGroup(condition,pos){var subpos=-1;var $condition=Ox.FormElementGroup({elements:[Ox.Label({title:self.options.value.operator=='&'?(pos==0?'Both':'and'):(pos==0?'Either':'or'),overlap:'right',width:48}).addClass('OxGroupLabel'),Ox.FormElementGroup({elements:[Ox.Select({items:self.operators,value:self.options.value.operator=='&'?'|':'&',width:48}).bindEvent({change:function(data){var $element=this.parent().parent();changeGroupOperator($element.data('position'),data.value);}}),Ox.Label({overlap:'left',title:Ox._('of the following conditions'),width:160})],float:'right',width:208}),].concat(renderButtons(pos,subpos,true)),float:'left'}).data({position:pos});return $condition;}
|
||
|
|
function renderInput(condition,index){Ox.Log('Form','renderInput',condition)
|
||
|
|
var $input,findKey=Ox.getObjectById(self.options.findKeys,condition.key),isBetween=isBetweenCondition(condition),isHue,type=findKey.type=='integer'?'int':findKey.type,value=!isBetween?condition.value:condition.value[index],formatArgs,formatType,title;if(type=='boolean'){$input=Ox.Select({items:['true','false'],max:1,min:1,value:value?'true':'false',width:288});}else if(type=='enum'){Ox.Log('FILTER',findKey,condition)
|
||
|
|
$input=Ox.Select({items:findKey.values.map(function(v,i){return{id:i,title:v}}),value:value,width:!isBetween?288:128});}else if(type=='item'){$input=Ox.Select({items:findKey.values,max:1,min:1,value:value,width:288});}else if(type=='list'){Ox.Log('FILTER',findKey)
|
||
|
|
$input=Ox.Input({autocomplete:findKey.values,autocompleteSelect:true,autocompleteSelectSubmit:true,value:value,width:288});}else if(findKey.format){formatArgs=findKey.format.args;formatType=findKey.format.type;if(formatType=='color'){isHue=formatArgs[0]=='hue';$input=Ox.Range({max:isHue?360:1,min:0,size:!isBetween?288:128,width:!isBetween?288:128,step:isHue?1:0.01,thumbSize:48,thumbValue:true,trackColors:isHue?['rgb(255, 0, 0)','rgb(255, 255, 0)','rgb(0, 255, 0)','rgb(0, 255, 255)','rgb(0, 0, 255)','rgb(255, 0, 255)','rgb(255, 0, 0)']:['rgb(0, 0, 0)','rgb(255, 255, 255)'],value:value});}else if(formatType=='date'){$input=Ox.DateInput(!isBetween?{value:value,width:{day:66,month:66,year:140}}:{value:value,width:{day:32,month:32,year:48}});}else if(formatType=='duration'){$input=Ox.TimeInput(!isBetween?{seconds:true,value:value,width:{hours:91,minutes:91,seconds:90}}:{seconds:true,value:value,width:{hours:38,minutes:37,seconds:37}});}else if(formatType=='ISBN'){$input=Ox.Input({type:type,value:Ox.formatISBN.apply(null,[value].concat(formatArgs)),width:288});}else if(formatType=='number'){$input=Ox.Input({type:type,value:value,width:288});}else if(formatType=='resolution'){$input=Ox.InputGroup({inputs:[Ox.Input({id:'width',type:'int',value:value[0]}),Ox.Input({id:'height',type:'int',value:value[1]})],separators:[{title:'x',width:16}],width:!isBetween?288:128})}else if(['currency','percent','unit','value'].indexOf(formatType)>-1){title=formatType=='percent'?'%':formatArgs[0];$input=Ox.FormElementGroup({elements:[Ox.Input({type:type,value:value,width:!isBetween?242:80}),formatType=='value'?Ox.Select({overlap:'left',items:['K','M','G','T'].map(function(prefix,i){return{id:Math.pow(1000,i+1),title:prefix+title};}),width:48}):Ox.Label({overlap:'left',textAlign:'center',title:title,width:48})],float:'right',join:function(value){return formatType=='value'?value[0]*value[1]:value[0];},split:function(value){},width:!isBetween?288:128})}}else{$input=Ox.Input({type:type,value:value,autocomplete:findKey.autocomplete,autocompleteSelect:true,autocompleteSelectSubmit:true,width:!isBetween?288:128});}
|
||
|
|
return $input;}
|
||
|
|
function setValue(){if(Ox.isEmpty(self.options.value)){self.options.value={conditions:[],operator:'&'};}else if(self.options.value.operator==''){self.options.value.operator='&';}
|
||
|
|
Ox.Log('Form','Ox.Filter self.options',self.options);if(!self.options.value.conditions.length){self.options.value.conditions=[{key:self.options.findKeys[0].id,value:'',operator:self.conditionOperators[getConditionType(self.options.findKeys[0].type)][0].id}];}}
|
||
|
|
function triggerChangeEvent(){var value=Ox.clone(self.options.value,true);that.triggerEvent('change',{value:value});}
|
||
|
|
that.getList=function(){if(self.$save){var value=self.$save.value();return{save:value[0],name:value[1],query:self.options.value};}};that.value=function(){if(arguments.length==0){return self.options.value;}else{return that.options({value:arguments[0]});}};return that;};'use strict';Ox.Form=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({error:'',id:'',items:[],validate:function(valid){return Ox.every(valid);}}).options(options||{}).addClass('OxForm');Ox.extend(self,{$items:[],$messages:[],itemIds:[],itemIsValid:[]});self.options.items.forEach(function(item,i){validateItem(i,function(valid){self.itemIsValid[i]=valid;});self.itemIds[i]=item.options('id')||item.id;self.$items[i]=Ox.FormItem({element:item}).appendTo(that);item.bindEvent({autovalidate:function(data){validateForm(i,data.valid);data.valid&&self.$items[i].setMessage('');},change:function(data){that.triggerEvent('change',{id:self.itemIds[i],data:data});validateItem(i,function(valid){validateForm(i,valid);});},submit:function(data){self.formIsValid&&that.submit();},validate:function(data){validateForm(i,data.valid);setTimeout(function(){self.$items[i].setMessage(data.valid?'':data.message);},0);}});});self.formIsValid=self.options.validate(self.itemIsValid);function getItemIndexById(id){return self.itemIds.indexOf(id);}
|
||
|
|
function validateForm(pos,valid){self.itemIsValid[pos]=valid;if(self.options.validate(self.itemIsValid)!=self.formIsValid){self.formIsValid=!self.formIsValid;that.triggerEvent('validate',{valid:self.formIsValid});}}
|
||
|
|
function validateItem(pos,callback){var item=self.options.items[pos],validate=item.options('validate');if(validate){validate(item.value(),function(data){callback(data.valid);});}else{callback(item.value&&!Ox.isEmpty(item.value));}}
|
||
|
|
that.addItem=function(pos,item){Ox.Log('Form','addItem',pos)
|
||
|
|
self.options.items.splice(pos,0,item);self.$items.splice(pos,0,Ox.FormItem({element:item}));pos==0?self.$items[pos].insertBefore(self.$items[0]):self.$items[pos].insertAfter(self.$items[pos-1]);}
|
||
|
|
that.removeItem=function(pos){Ox.Log('Form','removeItem',pos);self.$items[pos].remove();self.options.items.splice(pos,1);self.$items.splice(pos,1);}
|
||
|
|
that.setMessages=function(messages){Ox.forEach(messages,function(v){self.$items[getItemIndexById(v.id)].setMessage(v.message);});};that.submit=function(){that.triggerEvent('submit',{values:that.values()});};that.valid=function(){return self.formIsValid;};that.values=function(){var values={};if(arguments.length==0){self.$items.forEach(function($item,i){values[self.itemIds[i]]=self.$items[i].value();});return values;}else{Ox.Log('Form','SET FORM VALUES',arguments[0])
|
||
|
|
Ox.forEach(arguments[0],function(value,key){var index=getItemIndexById(key);index>-1&&self.options.items[index].value(value);});return that;}};return that;};'use strict';Ox.FormElementGroup=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({id:'',elements:[],float:'left',join:null,separators:[],split:null,value:options.split?'':[],width:0}).options(options||{}).update({value:setValue}).addClass('OxInputGroup');if(Ox.isEmpty(self.options.value)){self.options.value=getValue();}else{setValue();}
|
||
|
|
(self.options.float=='left'?self.options.elements:Ox.clone(self.options.elements).reverse()).forEach(function($element){$element.css({float:self.options.float}).bindEvent({autovalidate:function(data){that.triggerEvent({autovalidate:data});},change:change,validate:function(data){that.triggerEvent({validate:data});}}).appendTo(that);});function change(data){self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function getValue(){var value=self.options.elements.map(function($element){return $element.value?$element.value():void 0;});return self.options.join?self.options.join(value):value;}
|
||
|
|
function getWidth(){}
|
||
|
|
function setValue(){var values=self.options.split?self.options.split(self.options.value):self.options.value;values.forEach(function(value,i){self.options.elements[i].value&&self.options.elements[i].value(value);});}
|
||
|
|
function setWidth(){}
|
||
|
|
that.replaceElement=function(pos,element){Ox.Log('Form','Ox.FormElementGroup replaceElement',pos,element)
|
||
|
|
self.options.elements[pos].replaceWith(element.$element);self.options.elements[pos]=element;};that.value=function(){var values;if(arguments.length==0){values=self.options.elements.map(function(element){return element.value?element.value():void 0;});return self.options.join?self.options.join(values):values;}else{return that.options({value:arguments[0]});}};return that;};'use strict';Ox.FormItem=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({element:null,error:''}).options(options||{}).addClass('OxFormItem');self.description=self.options.element.options('description');if(self.description){$('<div>').addClass('OxFormDescription OxSelectable').html(self.description).appendTo(that);}
|
||
|
|
that.append(self.options.element);self.$message=Ox.Element().addClass('OxFormMessage OxSelectable').appendTo(that);that.setMessage=function(message){self.$message.html(message)[message!==''?'show':'hide']();};that.value=function(){return self.options.element.value();};return that;};'use strict';Ox.FormPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({form:[],listSize:256}).options(options||{});self.section=0;self.sectionTitle=self.options.form[self.section].title;self.$list=Ox.TableList({columns:[{id:'id',visible:false},{format:function(value){return $('<img>').attr({src:Ox.UI.getImageURL('symbolCheck')}).css({width:'10px',height:'10px',margin:'2px 2px 2px 0',opacity:value?1:0.1})},id:'valid',title:Ox._('Valid'),visible:true,width:16},{format:function(value){return(Ox.indexOf(self.options.form,function(section){return section.title==value;})+1)+'. '+value;},id:'title',title:Ox._('Title'),visible:true,width:self.options.listSize-16}],items:self.options.form.map(function(section){return{id:section.id,title:section.title,valid:false};}),max:1,min:1,selected:[self.options.form[0].id],sort:[{key:'id',operator:'+'}],unique:'id',width:self.options.listSize}).bindEvent({select:function(data){self.$sections[self.section].hide();self.section=Ox.getIndexById(self.options.form,data.ids[0]);self.$sections[self.section].show();that.triggerEvent('select',{section:data.ids[0]});}});self.$section=$('<div>').css({overflowY:'auto'});self.$forms=[];self.$sections=self.options.form.map(function(section,i){return $('<div>').css({width:(section.descriptionWidth||section.items[0].options('width'))+'px',margin:'16px'}).append($('<div>').addClass('OxSelectable').css({marginBottom:'8px',fontWeight:'bold'}).html((i+1)+'. '+section.title)).append($('<div>').addClass('OxSelectable').css({marginBottom:'16px'}).html(section.description)).append(self.$forms[i]=Ox.Form({items:section.items,validate:section.validate}).bindEvent({change:function(data){self.$list.value(section.id,'valid',self.$forms[i].valid());that.triggerEvent('change',{section:section.id,data:data});},validate:function(data){self.$list.value(section.id,'valid',data.valid);that.triggerEvent('validate',{section:section.id,data:data});}})).hide().appendTo(self.$section);});self.$list.bindEvent('load',function(){self.$forms.forEach(function($form,i){self.$list.value(self.options.form[i].id,'valid',$form.valid());});});self.$sections[0].show();that.setElement(Ox.SplitPanel({elements:[{element:self.$list,size:self.options.listSize},{element:self.$section}],orientation:'horizontal'}));that.renderPrintVersion=function(title){var $printVersion=$('<div>').css({overflowY:'auto'});$printVersion.append($('<div>').addClass('OxFormSectionTitle').css({height:'16px',padding:'16px 16px 8px 16px',fontWeight:'bold'}).html(title));self.$sections.forEach(function($section,i){var $clone=$section.clone(true),textareas={section:$section.find('textarea'),clone:$clone.find('textarea')};textareas.section.each(function(i){$(textareas.clone[i]).val($(this).val());});$printVersion.append($('<div>').css({height:'1px',margin:'8px 0 8px 0',background:'rgb(128, 128, 128)'})).append($clone.show());});return $printVersion;};that.values=function(){var values={};self.options.form.forEach(function(section,i){values[section.id]=self.$forms[i].values();});return values;};return that;};'use strict';Ox.Input=function(options,self){self=self||{};var that=Ox.Element({element:(options||{}).element||'<div>'},self).defaults({arrows:false,arrowStep:1,autocomplete:null,autocompleteReplace:false,autocompleteReplaceCorrect:false,autocompleteSelect:false,autocompleteSelectHighlight:false,autocompleteSelectMax:0,autocompleteSelectMaxWidth:0,autocompleteSelectOffset:{left:4,top:0},autocompleteSelectSubmit:false,autocompleteSelectUpdate:false,autovalidate:null,changeOnKeypress:false,clear:false,clearTooltip:'',decimals:0,disabled:false,height:16,key:'',min:-Infinity,max:Infinity,label:'',labelWidth:64,overlap:'none',placeholder:'',readonly:false,serialize:null,style:'rounded',textAlign:'left',type:'text',valida
|
||
|
|
self.bindKeyboard=self.options.autocomplete||self.options.autovalidate;}else if(key=='disabled'){self.$input.attr({disabled:value});}else if(key=='height'){that.css({height:value+'px'});self.$input.css({height:value-6+'px'});}else if(key=='label'){self.$label.options({title:value});}else if(key=='labelWidth'){self.$label.options({width:value});inputWidth=getInputWidth();self.$input.css({width:inputWidth+'px'});self.hasPasswordPlaceholder&&self.$placeholder.css({width:inputWidth+'px'});}else if(key=='placeholder'){setPlaceholder();}else if(key=='readonly'){self.$input.attr({readonly:value});}else if(key=='type'){self.$input[0].type=value}else if(key=='value'){if(self.options.type=='float'&&self.options.decimals){self.options.value=self.options.value.toFixed(self.options.decimals);}
|
||
|
|
self.$input.val(self.options.value);that.is('.OxError')&&that.removeClass('OxError');setPlaceholder();}else if(key=='width'){that.css({width:self.options.width+'px'});inputWidth=getInputWidth();self.$input.css({width:inputWidth+'px'});self.hasPasswordPlaceholder&&self.$placeholder.css({width:inputWidth+'px'});}}).addClass('OxInput OxKeyboardFocus OxMedium Ox'+Ox.toTitleCase(self.options.style)
|
||
|
|
+(self.options.type=='textarea'?' OxTextarea':'')).css(Ox.extend({width:self.options.width+'px'},self.options.type=='textarea'?{height:self.options.height+'px'}:{})).bindEvent(Ox.extend(self.options.type!='textarea'?{key_enter:submit}:{},{key_control_i:insert,key_escape:cancel,key_shift_enter:submit}));if(Ox.isArray(self.options.autocomplete)&&self.options.autocompleteReplace&&self.options.autocompleteReplaceCorrect&&self.options.value===''){self.options.value=self.options.autocomplete[0]}
|
||
|
|
if(self.options.type=='float'){self.decimals=Ox.repeat('0',self.options.decimals||1)
|
||
|
|
Ox.extend(self.options,{autovalidate:'float',textAlign:'right',value:self.options.value||'0.'+self.decimals});}else if(self.options.type=='int'){Ox.extend(self.options,{autovalidate:'int',textAlign:'right',value:self.options.value||'0'});}
|
||
|
|
if(self.options.label){self.$label=Ox.Label({overlap:'right',style:self.options.style,textAlign:'right',title:self.options.label,width:self.options.labelWidth}).css({float:'left'}).on({click:function(){}}).appendTo(that);}
|
||
|
|
if(self.options.arrows){self.arrows=[];self.arrows[0]=[Ox.Button({overlap:'right',title:'left',type:'image'}).css({float:'left'}).on({click:function(){clickArrow(-1);}}).appendTo(that),Ox.Button({overlap:'left',title:'right',type:'image'}).css({float:'right'}).on({click:function(){clickArrow(1);}}).appendTo(that)]}
|
||
|
|
self.bindKeyboard=self.options.autocomplete||self.options.autovalidate||self.options.changeOnKeypress;self.hasPasswordPlaceholder=self.options.type=='password'&&self.options.placeholder;self.inputWidth=getInputWidth();if(self.options.clear){self.$button=Ox.Button({overlap:'left',style:self.options.style=='squared'?'squared':'',title:'close',tooltip:self.options.clearTooltip,type:'image'}).css({float:'right'}).bindEvent({click:clear,doubleclick:submit}).appendTo(that);}
|
||
|
|
self.$input=$(self.options.type=='textarea'?'<textarea>':'<input>').addClass('OxInput OxKeyboardFocus OxMedium Ox'+Ox.toTitleCase(self.options.style)).attr({disabled:self.options.disabled,readonly:self.options.readonly,type:self.options.type=='password'?'password':'text'}).css(Ox.extend({width:self.inputWidth+'px',textAlign:self.options.textAlign},self.options.type=='textarea'?{height:self.options.height-6+'px'}:{})).val(self.options.value).on({click:function(){self.options.disabled&&that.gainFocus();},input:event=>{},blur:blur,change:change,focus:focus}).appendTo(that);if(self.bindKeyboard){self.$input.on({paste:keydown});}
|
||
|
|
if(self.options.type=='textarea'){Ox.Log('Form','TEXTAREA',self.options.width,self.options.height,'...',that.css('width'),that.css('height'),'...',self.$input.css('width'),self.$input.css('height'),'...',self.$input.css('border'))}
|
||
|
|
if(self.hasPasswordPlaceholder){self.$input.hide();self.$placeholder=$('<input>').addClass('OxInput OxKeyboardFocus OxMedium Ox'+Ox.toTitleCase(self.options.style)+' OxPlaceholder').attr({type:'text'}).css({width:self.inputWidth+'px'}).val(self.options.placeholder).on({focus:focus}).appendTo(that);}
|
||
|
|
if(self.options.autocomplete&&self.options.autocompleteSelect){self.$autocompleteMenu=constructAutocompleteMenu();}
|
||
|
|
self.options.placeholder&&setPlaceholder();function autocomplete(oldValue,oldCursor){oldValue=Ox.isUndefined(oldValue)?self.options.value:oldValue;oldCursor=Ox.isUndefined(oldCursor)?cursor():oldCursor;Ox.Log('AUTO','autocomplete',oldValue,oldCursor)
|
||
|
|
if(self.options.value||self.options.autocompleteReplaceCorrect){var id=Ox.uid();self.autocompleteId=id;if(Ox.isFunction(self.options.autocomplete)){if(self.options.key){self.options.autocomplete(self.options.key,self.options.value,autocompleteCallback);}else{self.options.autocomplete(self.options.value,autocompleteCallback);}}else{autocompleteCallback(autocompleteFunction());}}
|
||
|
|
if(!self.options.value){if(self.options.autocompleteSelect){self.$autocompleteMenu.unbindEvent('select').hideMenu();that.gainFocus();self.selectEventBound=false;}}
|
||
|
|
function autocompleteFunction(){return Ox.find(self.options.autocomplete,self.options.value,self.options.autocompleteReplace);}
|
||
|
|
function autocompleteCallback(values){if(self.autocompleteId!=id){return;}
|
||
|
|
var length=self.options.value.length,newValue,newLength,pos=cursor(),selected=-1,selectEnd=length==0||(values[0]&&values[0].length),value;if(values[0]){if(self.options.autocompleteReplace&&Ox.startsWith(values[0].toLowerCase(),self.options.value.toLowerCase())){newValue=values[0];selected=0;}else{newValue=self.options.value;}}else{if(self.options.autocompleteReplaceCorrect){newValue=oldValue;}else{newValue=self.options.value}}
|
||
|
|
newLength=newValue.length;if(self.options.autocompleteReplace){value=self.options.value;self.options.value=newValue;self.$input.val(self.options.value);if(selectEnd){cursor(length,newLength);}else if(self.options.autocompleteReplaceCorrect){cursor(oldCursor);}else{cursor(pos);}}
|
||
|
|
if(self.options.autocompleteSelect){value=(self.options.autocompleteReplace?value:self.options.value).toLowerCase();if(values.length){self.oldCursor=cursor();self.oldValue=self.options.value;self.$autocompleteMenu.options({items:Ox.filter(values,function(v,i){var ret=false;if(!self.options.autocompleteSelectMax||i<self.options.autocompleteSelectMax){if(v.toLowerCase()===value){selected=i;}
|
||
|
|
ret=true;}
|
||
|
|
return ret;}).map(function(v){return{id:v.toLowerCase().replace(/ /g,'_'),title:self.options.autocompleteSelectHighlight?Ox.highlight(v,value,'OxHighlight'):v};})});if(!self.selectEventBound){self.$autocompleteMenu.bindEvent({select:selectMenu});self.selectEventBound=true;}
|
||
|
|
self.$autocompleteMenu.options({selected:selected}).showMenu();if(self.options.autocompleteSelectUpdate){self.$autocompleteMenu.updatePosition();}}else{self.$autocompleteMenu.unbindEvent('select').hideMenu();that.gainFocus();self.selectEventBound=false;}}
|
||
|
|
that.triggerEvent('autocomplete',{value:newValue});}}
|
||
|
|
function autovalidate(){var blur,oldCursor,oldValue;if(arguments.length==1){blur=arguments[0];}else{blur=false;oldValue=arguments[0];oldCursor=arguments[1];}
|
||
|
|
if(Ox.isFunction(self.options.autovalidate)){if(self.options.key){self.options.autovalidate(self.options.key,self.options.value,blur,autovalidateCallback);}else{self.options.autovalidate(self.options.value,blur,autovalidateCallback);}}else if(Ox.isRegExp(self.options.autovalidate)){autovalidateCallback(autovalidateFunction(self.options.value));}else{autovalidateTypeFunction(self.options.type,self.options.value);}
|
||
|
|
function autovalidateFunction(value){value=value.split('').map(function(v){return self.options.autovalidate.test(v)?v:null;}).join('');return{valid:!!value.length,value:value};}
|
||
|
|
function autovalidateTypeFunction(type,value){var cursor,length,regexp=type=='float'?new RegExp('(^'+(self.options.min<0?'\\-?':'')+'\\d+\\.?\\d'
|
||
|
|
+(self.options.decimals?'{0,'+self.options.decimals+'}':'*')
|
||
|
|
+'$)'):new RegExp('(^'+(self.options.min<0?'\\-?':'')+'\\d+$)');if(type=='float'){if(value===''){value='0.'+self.decimals;cursor=[0,value.length];}else if(value=='-'){value='-0.'+self.decimals;cursor=[1,value.length];}else if(value=='.'){value='0.'+self.decimals;cursor=[2,value.length];}else if(!/\./.test(value)){value+='.'+self.decimals;cursor=[value.indexOf('.'),value.length];}else if(/^\./.test(value)){value='0'+value;cursor=[2,value.length];}else if(/\.$/.test(value)){value+=self.decimals;cursor=[value.indexOf('.')+1,value.length];}else if(/\./.test(value)&&self.options.decimals){length=value.split('.')[1].length;if(length>self.options.decimals){value=value.slice(0,value.indexOf('.')+1+self.options.decimals);cursor=[oldCursor[0]+1,oldCursor[1]+1];}else if(length<self.options.decimals){value+=Ox.repeat('0',self.options.decimals-length);cursor=[value.indexOf('.')+1+length,value.length];}}}else{if(value===''){value='0';cursor=[0,1];}}
|
||
|
|
while(/^0\d/.test(value)){value=value.slice(1);}
|
||
|
|
if(!regexp.test(value)||value<self.options.min||value>self.options.max){value=oldValue;cursor=oldCursor;}
|
||
|
|
autovalidateCallback({cursor:cursor,valid:true,value:value});}
|
||
|
|
function autovalidateCallback(data){self.options.value=data.value;self.$input.val(self.options.value);!blur&&cursor(data.cursor||(oldCursor[1]+data.value.length-oldValue.length));that.triggerEvent('autovalidate',{valid:data.valid,value:data.value});}}
|
||
|
|
function blur(){that.loseFocus();self.options.value=self.$input.val();self.options.autovalidate&&autovalidate(true);self.options.placeholder&&setPlaceholder();self.options.validate&&validate();self.bindKeyboard&&Ox.$document.off('keydown',keydown);if(!self.cancelled&&!self.submitted){that.triggerEvent('blur',{value:self.options.value});self.options.value!==self.originalValue&&that.triggerEvent('change',{value:self.options.value});}}
|
||
|
|
function cancel(){self.cancelled=true;self.$input.val(self.originalValue).blur();self.cancelled=false;that.triggerEvent('cancel');}
|
||
|
|
function cancelAutocomplete(){self.autocompleteId=null;}
|
||
|
|
function change(){self.options.value=self.$input.val();self.originalValue=self.options.value;!self.options.changeOnKeypress&&that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function clear(){if(!self.clearTimeout){that.triggerEvent('clear');self.options.value='';self.options.value=self.options.type=='float'?'0.0':self.options.type=='int'?'0':'';self.$input.val(self.options.value);cursor(0,self.options.value.length);self.options.changeOnKeypress&&that.triggerEvent({change:{value:self.options.value}});self.clearTimeout=setTimeout(function(){self.clearTimeout=0;},500);}}
|
||
|
|
function clickArrow(i){var originalValue=self.options.value;self.options.value=Ox.limit(parseFloat(self.options.value)+i*self.options.arrowStep,self.options.min,self.options.max).toString();if(self.options.value!=originalValue){self.$input.val(self.options.value);that.triggerEvent('change',{value:self.options.value});}}
|
||
|
|
function clickMenu(data){self.options.value=data.title;self.$input.val(self.options.value).focus();that.gainFocus();self.options.autocompleteSelectSubmit&&submit();}
|
||
|
|
function constructAutocompleteMenu(){return Ox.Menu({element:self.$input,id:self.options.id+'Menu',maxWidth:self.options.autocompleteSelectMaxWidth,offset:self.options.autocompleteSelectOffset}).addClass('OxAutocompleteMenu OxKeyboardFocus').bindEvent({click:clickMenu,key_enter:function(){if(self.$autocompleteMenu.is(':visible')){self.$autocompleteMenu.hideMenu();that.gainFocus();submit();}}});}
|
||
|
|
function cursor(start,end){var isArray=Ox.isArray(start);if(arguments.length==0){return[self.$input[0].selectionStart,self.$input[0].selectionEnd];}else{end=isArray?start[1]:(end?end:start);start=isArray?start[0]:start;self.$input[0].setSelectionRange&&self.$input[0].setSelectionRange(start,end);}}
|
||
|
|
function deselectMenu(){return;}
|
||
|
|
function focus(){if((self.$autocompleteMenu&&self.$autocompleteMenu.is(':visible'))||(self.hasPasswordPlaceholder&&self.$input.is(':visible'))){return;}
|
||
|
|
self.originalValue=self.options.value;that.gainFocus();that.is('.OxError')&&that.removeClass('OxError');self.options.placeholder&&setPlaceholder();if(self.bindKeyboard){Ox.$document.keydown(keydown);}
|
||
|
|
that.triggerEvent('focus');}
|
||
|
|
function getInputWidth(){return self.options.width
|
||
|
|
-(self.options.arrows?32:0)
|
||
|
|
-(self.options.clear?16:0)
|
||
|
|
-(self.options.label?self.options.labelWidth:0)
|
||
|
|
-(Ox.contains(['rounded','squared'],self.options.style)?14:6);}
|
||
|
|
function insert(){var input=self.$input[0];that.triggerEvent('insert',{end:input.selectionEnd,id:that.oxid,selection:input.value.slice(input.selectionStart,input.selectionEnd),start:input.selectionStart,value:input.value});}
|
||
|
|
function keydown(event){var oldCursor=cursor(),oldValue=self.options.value,newValue=oldValue.toString().slice(0,oldCursor[0]-1),hasDeletedSelectedEnd=(event.keyCode==8||event.keyCode==46)&&oldCursor[0]<oldCursor[1]&&oldCursor[1]==oldValue.length;if(event.keyCode!=9&&(self.options.type=='textarea'||event.keyCode!=13)&&event.keyCode!=27){setTimeout(function(){var value=self.$input.val();if((self.options.autocompleteReplace||self.options.decimals)&&hasDeletedSelectedEnd){value=newValue;self.$input.val(value);}
|
||
|
|
if(value!=self.options.value){self.options.value=value;Ox.Log('AUTO','call autocomplete from keydown')
|
||
|
|
self.options.autocomplete&&autocomplete(oldValue,oldCursor);self.options.autovalidate&&autovalidate(oldValue,oldCursor);self.options.changeOnKeypress&&that.triggerEvent({change:{value:self.options.value}});}});}
|
||
|
|
if((event.keyCode==38||event.keyCode==40)&&self.options.autocompleteSelect&&self.$autocompleteMenu.is(':visible')){}}
|
||
|
|
function paste(){var data=Ox.Clipboard.paste();data.text&&self.$input.val(data.text);}
|
||
|
|
function selectMenu(data){var pos=cursor();self.options.value=Ox.decodeHTMLEntities(data.title);self.$input.val(self.options.value);cursor(pos[0],self.options.value.length);self.options.changeOnKeypress&&that.triggerEvent({change:{value:self.options.value}});if(self.options.autocompleteSelectUpdate){self.$autocompleteMenu.updatePosition();}}
|
||
|
|
function setPlaceholder(){if(self.options.placeholder){if(that.hasClass('OxFocus')){if(self.options.value===''){if(self.options.type=='password'){self.$placeholder.hide();self.$input.show().focus();}else{self.$input.removeClass('OxPlaceholder').val('');}}}else{if(self.options.value===''){if(self.options.type=='password'){self.$input.hide();self.$placeholder.show();}else{self.$input.addClass('OxPlaceholder').val(self.options.placeholder)}}else{self.$input.removeClass('OxPlaceholder').val(self.options.value)}}}else{self.$input.removeClass('OxPlaceholder').val(self.options.value);}}
|
||
|
|
function setWidth(){}
|
||
|
|
function submit(){cancelAutocomplete();self.submitted=true;self.$input.blur();self.submitted=false;that.triggerEvent('submit',{value:self.options.value});}
|
||
|
|
function validate(){self.options.validate(self.options.value,function(data){that.triggerEvent('validate',data);});}
|
||
|
|
that.blurInput=function(){self.$input.blur();return that;};that.clearInput=function(){clear();return that;};that.focusInput=function(){var length=self.$input.val().length,start=Ox.isNumber(arguments[0])?(arguments[0]<0?length+arguments[0]:arguments[0]):arguments[0]?0:length,stop=Ox.isNumber(arguments[1])?(arguments[1]<0?length+arguments[1]:arguments[1]):Ox.isNumber(arguments[0])?arguments[0]:arguments[0]?length:0;self.$input.focus();cursor(start,stop);return that;};that.value=function(){if(arguments.length==0){var value=self.$input.hasClass('OxPlaceholder')?'':self.$input.val();if(self.options.type=='float'){value=parseFloat(value);}else if(self.options.type=='int'){value=parseInt(value);}
|
||
|
|
return value;}else{return that.options({value:arguments[0]});}};return that;};'use strict';Ox.InputGroup=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({id:'',inputs:[],join:null,separators:[],split:null,value:options.split?'':[],width:0}).options(options||{}).update({value:setValue}).addClass('OxInputGroup').on({click:click});if(Ox.isEmpty(self.options.value)){self.options.value=getValue();}else{setValue();}
|
||
|
|
if(self.options.width){setWidths();}else{self.options.width=getWidth();}
|
||
|
|
that.css({width:self.options.width+'px'});self.$separator=[];self.options.separators.forEach(function(v,i){self.$separator[i]=Ox.Label({textAlign:'center',title:v.title,width:v.width+32}).addClass('OxSeparator').css({marginLeft:(self.options.inputs[i].options('width')-(i==0?16:32))+'px'}).appendTo(that);});self.options.inputs.forEach(function($input,i){$input.options({id:self.options.id+Ox.toTitleCase($input.options('id')||'')}).css({marginLeft:-Ox.sum(self.options.inputs.map(function($input,i_){return i_>i?self.options.inputs[i_-1].options('width')
|
||
|
|
+self.options.separators[i_-1].width:i_==i?16:0;}))+'px'}).bindEvent({change:change,submit:change,validate:validate}).appendTo(that);});function change(data){self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
function click(event){if($(event.target).hasClass('OxSeparator')){Ox.forEach(self.options.inputs,function($input){if($input.focusInput){$input.focusInput(true);return false;}});}}
|
||
|
|
function getValue(){var value=self.options.inputs.map(function($input){return $input.value();});return self.options.join?self.options.join(value):value;}
|
||
|
|
function getWidth(){return Ox.sum(self.options.inputs.map(function(v){return v.options('width');}))+Ox.sum(self.options.separators.map(function(v){return v.width;}));}
|
||
|
|
function setValue(){var values=self.options.split?self.options.split(self.options.value):self.options.value;values.forEach(function(value,i){self.options.inputs[i].value(value);});}
|
||
|
|
function setWidths(){var length=self.options.inputs.length,inputWidths=Ox.splitInt(self.options.width-Ox.sum(self.options.separators.map(function(v){return v.width;})),length);self.options.inputs.forEach(function(v){v.options({width:inputWidths[1]});});}
|
||
|
|
function validate(data){that.triggerEvent('validate',data);}
|
||
|
|
that.getInputById=function(id){var input=null;Ox.forEach(self.options.inputs,function(v,i){if(v.options('id')==self.options.id+Ox.toTitleCase(id)){input=v;return false;}});return input;};return that;};'use strict';Ox.InsertHTMLDialog=function(options,self){var that;self=self||{};self.options=Ox.extend({callback:void 0,end:0,selection:'',start:0},options||{});self.type=self.options.selection.indexOf('\n')>-1?'textarea':'input';self.items=[{id:'img',title:Ox._('Image')},{id:'a',title:Ox._('Link')},{id:'li',title:Ox._('List')},{},{id:'blockquote',title:Ox._('Blockquote')},{id:'h1',title:Ox._('Headline')},{id:'p',title:Ox._('Paragraph')},{id:'div',title:Ox._('Right-to-Left')},{},{id:'b',title:Ox._('Bold')},{id:'i',title:Ox._('Italic')},{id:'code',title:Ox._('Monospace')},{id:'s',title:Ox._('Strike')},{id:'sub',title:Ox._('Subscript')},{id:'sup',title:Ox._('Superscript')},{id:'u',title:Ox._('Underline')},{},{id:'br',title:Ox._('Linebreak')}].map(function(item,i){var form,format;if(item.id=='img'){form=[Ox.Input({id:'url',label:'URL',labelWidth:128,width:384})];format=function(values){return'<img src="'+values.url+'"/>';};}else if(item.id=='a'){form=[Ox.Input({height:104,id:'text',label:'Text',labelWidth:128,type:self.type,width:384,value:self.options.selection}).css({background:'transparent'}),Ox.Input({id:'url',label:'URL',labelWidth:128,width:384})];format=function(values){return'<a href="'+values.url+'">'+values.text+'</a>';};}else if(item.id=='li'){form=[Ox.Select({id:'style',items:[{id:'ul',title:Ox._('Bullets')},{id:'ol',title:Ox._('Numbers')}],label:'Style',labelWidth:128,width:384}),Ox.ArrayInput({id:'items',label:'Items',max:10,value:self.options.selection.split('\n'),width:384})];format=function(values){return'<'+values.style+'>\n'+values.items.map(function(value){return'<li>'+value+'</li>\n';}).join('')+'</'+values.style+'>';};}else if(['p','blockquote','div'].indexOf(item.id)>-1){form=[Ox.Input({height:128,id:'text',label:'Text',labelWidth:128,type:'textarea',value:self.options.selection,width:384}).css({background:'transparent'})];format=function(values){return'<'+item.id+(item.id=='div'?' style="direction: rtl"':'')+'>'+values.text+'</'+item.id+'>';};}else if(['h1','b','i','code','s','sub','sup','u'].indexOf(item.id)>-1){form=[Ox.Input({height:128,id:'text',label:'Text',labelWidth:128,type:self.type,value:self.options.selection,width:384}).css({background:'transparent'})];format=function(values){return'<'+item.id+'>'+values.text+'</'+item.id+'>';};}else if(item.id=='br'){form=[];format=function(){return'<br/>';};}
|
||
|
|
return item.id?Ox.extend(item,{form:form,format:format}):item;});self.$content=$('<div>').css({padding:'16px'});self.$select=Ox.Select({items:self.items,label:Ox._('Insert'),labelWidth:128,value:'img',width:384}).bindEvent({change:renderForm}).appendTo(self.$content);renderForm();that=Ox.Dialog({buttons:[Ox.Button({id:'cancel',title:Ox._('Cancel'),width:64}).bindEvent({click:function(){that.close();}}),Ox.Button({id:'insert',title:Ox._('Insert'),width:64}).bindEvent({click:function(){var item=Ox.getObjectById(self.items,self.$select.value()),value=item.format(item.form.length?self.$form.values():void 0);self.options.callback({position:self.options.start+value.length,value:self.options.value.slice(0,self.options.start)
|
||
|
|
+value
|
||
|
|
+self.options.value.slice(self.options.end)});that.close();}})],closeButton:true,content:self.$content,height:184,keys:{enter:'insert',escape:'cancel'},title:Ox._('Insert HTML'),width:416+Ox.UI.SCROLLBAR_SIZE});function renderForm(){var items=Ox.getObjectById(self.items,self.$select.value()).form;self.$form&&self.$form.remove();if(items.length){self.$form=Ox.Form({items:items}).css({paddingTop:'8px'}).appendTo(self.$content);}}
|
||
|
|
return that;};'use strict';Ox.Label=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({disabled:false,id:'',overlap:'none',textAlign:'left',style:'rounded',title:'',width:'auto'}).options(options||{}).update({disabled:function(){that[self.options.disabled?'addClass':'removeClass']('OxDisabled');},title:function(){that.html(self.options.title);},width:function(){that.css({width:self.options.width-(Ox.contains(['rounded','squared'],self.options.style)?14:8)+'px'});}}).addClass('OxLabel'
|
||
|
|
+(self.options.style!='rounded'?' Ox'+Ox.toTitleCase(self.options.style):'')
|
||
|
|
+(self.options.disabled?' OxDisabled':'')
|
||
|
|
+(self.options.overlap!='none'?' OxOverlap'+Ox.toTitleCase(self.options.overlap):'')).css(Ox.extend(self.options.width=='auto'?{}:{width:self.options.width-(Ox.contains(['rounded','squared'],self.options.style)?14:8)+'px'},{textAlign:self.options.textAlign})).html(Ox.isUndefined(self.options.title)?'':self.options.title);return that;};'use strict';Ox.ObjectArrayInput=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({buttonTitles:{add:Ox._('Add'),remove:Ox._('Remove')},inputs:[],labelWidth:128,max:0,value:[],width:256}).options(options||{}).update({value:function(){setValue(self.options.value);}}).addClass('OxObjectArrayInput');if(Ox.isEmpty(self.options.value)){self.options.value=[getDefaultValue()];}
|
||
|
|
self.$element=[];self.$input=[];self.$removeButton=[];self.$addButton=[];self.buttonWidth=self.options.width/2-4;setValue(self.options.value);function addInput(index,value){self.$element.splice(index,0,Ox.Element().css({width:self.options.width+'px',}));if(index==0){self.$element[index].appendTo(that);}else{self.$element[index].insertAfter(self.$element[index-1]);}
|
||
|
|
self.$input.splice(index,0,Ox.ObjectInput({elements:self.options.inputs.map(function(input){return Ox[input.element](input.options||{}).bindEvent(input.events||{});}),labelWidth:self.options.labelWidth,value:value,width:self.options.width}).bindEvent({change:function(data){var index=$(this).parent().data('index');self.options.value[index]=self.$input[index].value();that.triggerEvent('change',{value:self.options.value});}}).appendTo(self.$element[index]));self.$removeButton.splice(index,0,Ox.Button({disabled:self.$input.length==1,title:self.options.buttonTitles.remove,width:self.buttonWidth}).css({margin:'8px 4px 0 0'}).on({click:function(){var index=$(this).parent().data('index');if(self.$input.length>1){removeInput(index);self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}}}).appendTo(self.$element[index]));self.$addButton.splice(index,0,Ox.Button({disabled:index==self.options.max-1,title:self.options.buttonTitles.add,width:self.buttonWidth}).css({margin:'8px 0 0 4px'}).on({click:function(){var index=$(this).parent().data('index');addInput(index+1,getDefaultValue());self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}}).appendTo(self.$element[index]));updateInputs();}
|
||
|
|
function getDefaultValue(){var value={};self.options.inputs.forEach(function(input){value[input.options.id]='';});return value;}
|
||
|
|
function getValue(){return self.$input.map(function($input){return $input.value();});}
|
||
|
|
function removeInput(index){['input','removeButton','addButton','element'].forEach(function(element){var key='$'+element;self[key][index].remove();self[key].splice(index,1);});updateInputs();}
|
||
|
|
function setValue(value){while(self.$element.length){removeInput(0);}
|
||
|
|
value.forEach(function(value,i){addInput(i,value);});}
|
||
|
|
function updateInputs(){var length=self.$element.length;self.$element.forEach(function($element,i){$element
|
||
|
|
[i==0?'addClass':'removeClass']('OxFirst')
|
||
|
|
[i==length-1?'addClass':'removeClass']('OxLast').data({index:i});self.$removeButton[i].options({disabled:length==1});self.$addButton[i].options({disabled:length==self.options.max});});}
|
||
|
|
return that;};'use strict';Ox.ObjectInput=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({elements:[],labelWidth:128,value:{},width:256}).options(options||{}).update({value:function(){setValue(self.options.value);}}).addClass('OxObjectInput').css({width:self.options.width+'px',});if(Ox.isEmpty(self.options.value)){self.options.value=getValue();}else{setValue(self.options.value);}
|
||
|
|
self.options.elements.forEach(function($element){$element.options({labelWidth:self.options.labelWidth,width:self.options.width}).bindEvent({change:function(data){self.options.value=getValue();that.triggerEvent('change',{value:self.options.value});}}).appendTo(that);});function getValue(){var value={};self.options.elements.forEach(function(element){value[element.options('id')]=element.value();});return value;}
|
||
|
|
function setValue(value){self.options.elements.forEach(function(element){element.value(value[element.options('id')]);});}
|
||
|
|
return that;};'use strict';Ox.OptionGroup=function(items,min,max,property){var length=items.length;property=property||'checked';max=max==-1?length:max;function getLastBefore(pos){var last=-1;Ox.forEach([].concat(pos>0?Ox.range(pos-1,-1,-1):[],pos<items.length-1?Ox.range(items.length-1,pos,-1):[]),function(v){if(items[v][property]){last=v;return false;}});return last;}
|
||
|
|
function getNumber(){return items.reduce(function(prev,curr){return prev+!!curr[property];},0);}
|
||
|
|
this[property]=function(){return Ox.indicesOf(items,function(item){return item[property];});};this.init=function(){var num=getNumber(),count=0;items.forEach(function(item){if(Ox.isUndefined(item[property])){item[property]=false;}
|
||
|
|
if(item[property]){count++;if(count>max){item[property]=false;}}else{if(num<min){item[property]=true;num++;}}});return items;};this.toggle=function(pos){var last,num=getNumber(),toggled=[];if(!items[pos][property]){if(num>=max){last=getLastBefore(pos);items[last][property]=false;toggled.push(last);}
|
||
|
|
if(!items[pos][property]){items[pos][property]=true;toggled.push(pos);}}else{if(num>min){items[pos][property]=false;toggled.push(pos);}}
|
||
|
|
return toggled;};this.value=function(){var value=items.filter(function(item){return item[property];}).map(function(item){return item.id;});return max==1?(value.length?value[0]:''):value;};return this;}
|
||
|
|
'use strict';Ox.Picker=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({element:null,elementHeight:128,elementWidth:256,overlap:'right',}).options(options||{});self.$selectButton=Ox.Button({overlap:self.options.overlap,title:'select',type:'image'}).bindEvent({click:showMenu}).appendTo(that);self.$menu=Ox.Element().addClass('OxPicker').css({width:self.options.elementWidth+'px',height:(self.options.elementHeight+24)+'px'});self.options.element.css({width:self.options.elementWidth+'px',height:self.options.elementHeight+'px'}).appendTo(self.$menu);self.$bar=Ox.Bar({orientation:'horizontal',size:24}).appendTo(self.$menu);that.$label=Ox.Label({width:self.options.elementWidth-60}).appendTo(self.$bar);self.$doneButton=Ox.Button({title:Ox._('Done'),width:48}).bindEvent({click:hideMenu}).appendTo(self.$bar);self.$layer=Ox.$('<div>').addClass('OxLayer').on({click:hideMenu});function hideMenu(){self.$menu.detach();self.$layer.detach();self.$selectButton.removeClass('OxSelected').css({borderRadius:'8px'});that.triggerEvent('hide');}
|
||
|
|
function showMenu(){var offset=that.offset(),left=offset.left,top=offset.top+15;self.$selectButton.addClass('OxSelected').css({borderRadius:'8px 8px 0 0'});self.$layer.appendTo(Ox.Fullscreen.element?Ox.Fullscreen.element:Ox.$body);self.$menu.css({left:left+'px',top:top+'px'}).appendTo(Ox.$body);that.triggerEvent('show');}
|
||
|
|
return that;};'use strict';Ox.PlaceInput=function(options,self){var that;self=Ox.extend(self||{},{options:Ox.extend({id:'',value:'United States'},options)});that=Ox.FormElementGroup({id:self.options.id,elements:[Ox.Input({id:'input',value:self.options.value}),Ox.PlacePicker({id:'picker',overlap:'left',value:self.options.value})],float:'right'},self).bindEvent('change',change);function change(){}
|
||
|
|
return that;};'use strict';Ox.PlacePicker=function(options,self){var that;self=Ox.extend(self||{},{options:Ox.extend({id:'',value:'United States'},options)});self.$element=Ox.Element().css({width:'256px',height:'192px'}).append(self.$topBar=Ox.Bar({size:16}).css({MozBorderRadius:'0 8px 0 0',WebkitBorderRadius:'0 8px 0 0'}).append(self.$input=Ox.Input({clear:true,id:self.options.id+'Input',placeholder:Ox._('Find'),width:256}).bindEvent('submit',findPlace))).append(self.$container=Ox.Element().css({width:'256px',height:'160px'})).append(self.$bottomBar=Ox.Bar({size:16}).append(self.$range=Ox.Range({arrows:true,changeOnDrag:true,id:self.options.id+'Range',max:22,size:256,thumbSize:32,thumbValue:true}).bindEvent('change',changeZoom)));self.$input.children('input[type=text]').css({width:'230px',paddingLeft:'2px',MozBorderRadius:'0 8px 8px 0',WebkitBorderRadius:'0 8px 8px 0'});self.$input.children('input[type=image]').css({MozBorderRadius:'0 8px 0 0',WebkitBorderRadius:'0 8px 0 0'});self.$range.children('input').css({MozBorderRadius:0,WebkitBorderRadius:0});that=Ox.Picker({element:self.$element,elementHeight:192,elementWidth:256,id:self.options.id,overlap:self.options.overlap,value:self.options.value},self).bindEvent('show',showPicker);that.$label.on('click',clickLabel);self.map=false;function changeZoom(data){self.$map.zoom(data.value);}
|
||
|
|
function clickLabel(){var name=that.$label.html();if(name){self.$input.value(name).triggerEvent('submit',{value:name});}}
|
||
|
|
function findPlace(data){self.$map.find(data.value,function(place){place&&that.$label.html(place.geoname);});}
|
||
|
|
function onSelect(data){that.$label.html(data.geoname);}
|
||
|
|
function onZoom(data){self.$range.value(data.value);}
|
||
|
|
function showPicker(){if(!self.map){self.$map=Ox.Map({clickable:true,id:self.options.id+'Map',places:[{south:-85,west:-179,north:-85,east:179}]}).css({top:'16px',width:'256px',height:'160px'}).bindEvent({select:onSelect,zoom:onZoom}).appendTo(self.$container);self.map=true;}}
|
||
|
|
return that;};'use strict';Ox.Range=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({arrows:false,arrowStep:1,arrowSymbols:['left','right'],arrowTooltips:['',''],changeOnDrag:false,disabled:false,max:100,min:0,orientation:'horizontal',step:1,size:128,thumbSize:16,thumbStyle:'default',thumbValue:false,trackColors:[],trackGradient:false,trackImages:[],trackStep:0,value:0,values:[]}).options(options||{}).update({disabled:setDisabled,max:setSizes,min:setSizes,step:setSizes,size:setSizes,trackColors:setTrackColors,value:setThumb}).addClass('OxRange').css({width:self.options.size+'px'});self.hasValues=!Ox.isEmpty(self.options.values);if(self.hasValues){self.options.max=self.options.values.length-1;self.options.min=0;self.options.step=1;self.options.thumbValue=true;self.options.value=Ox.isNumber(self.options.value)?self.options.values[self.options.value]:self.options.value;}
|
||
|
|
self.options.arrowStep=options.arrowStep||self.options.step;self.options.trackImages=Ox.makeArray(self.options.trackImages);self.trackColors=self.options.trackColors.length;self.trackImages=self.options.trackImages.length;setSizes();if(self.options.arrows){self.$arrows=[];Ox.range(2).forEach(function(i){self.$arrows[i]=Ox.Button({disabled:self.options.disabled,overlap:i==0?'right':'left',title:self.options.arrowSymbols[i],tooltip:self.options.arrowTooltips[i],type:'image'}).addClass('OxArrow').bindEvent({mousedown:function(data){clickArrow(data,i,true);},mouserepeat:function(data){clickArrow(data,i,false);}}).appendTo(that);});}
|
||
|
|
self.$track=Ox.Element().addClass('OxTrack').css(Ox.extend({width:(self.trackSize-2)+'px'},self.trackImages==1?{background:'rgb(0, 0, 0)'}:{})).bindEvent(Ox.extend({mousedown:clickTrack,drag:dragTrack},self.options.changeOnDrag?{}:{dragend:dragendTrack})).appendTo(that);self.trackColors&&setTrackColors();if(self.trackImages){self.$trackImages=$('<div>').css({width:self.trackSize+'px',marginRight:(-self.trackSize-1)+'px'}).appendTo(self.$track.$element);self.options.trackImages.forEach(function(v,i){$('<img>').attr({src:v}).addClass(i==0?'OxFirstChild':'').addClass(i==self.trackImages-1?'OxLastChild':'').css({width:self.trackImageWidths[i]+'px'}).on({mousedown:function(e){e.preventDefault();}}).appendTo(self.$trackImages);});}
|
||
|
|
self.$thumb=Ox.Button({disabled:self.options.disabled,id:self.options.id+'Thumb',width:self.thumbSize}).addClass('OxThumb'+(self.options.thumbStyle=='transparent'?' OxTransparent':'')).appendTo(self.$track);setThumb();function clickArrow(data,i,animate){setValue(self.options.value
|
||
|
|
+self.options.arrowStep*(i==0?-1:1)*(data.shiftKey?2:1),animate,true);}
|
||
|
|
function clickTrack(data){if(self.options.disabled){return;}
|
||
|
|
var isThumb=$(data.target).hasClass('OxThumb');self.drag={left:self.$track.offset().left,offset:isThumb?data.clientX-self.$thumb.offset().left-8:0};setValue(getValue(data.clientX-self.drag.left-self.drag.offset),!isThumb,true);}
|
||
|
|
function dragTrack(data){if(self.options.disabled){return;}
|
||
|
|
setValue(getValue(data.clientX-self.drag.left-self.drag.offset),false,self.options.changeOnDrag);}
|
||
|
|
function dragendTrack(data){if(self.options.disabled){return;}
|
||
|
|
self.options.value=void 0;setValue(getValue(data.clientX-self.drag.left-self.drag.offset),false,true);}
|
||
|
|
function getPx(value){var pxPerValue=(self.trackSize-self.thumbSize)/(self.options.max-self.options.min);value=self.hasValues?self.options.values.indexOf(value):value;return Math.ceil((value-self.options.min)*pxPerValue);}
|
||
|
|
function getValue(px){var px=self.trackSize/self.values>=16?px:px-8,valuePerPx=(self.options.max-self.options.min)/(self.trackSize-self.thumbSize),value=Ox.limit(self.options.min
|
||
|
|
+Math.floor(px*valuePerPx/self.options.step)*self.options.step,self.options.min,self.options.max);return self.hasValues?self.options.values[value]:value;}
|
||
|
|
function setDisabled(){if(self.options.arrows){self.$arrows[0].options({disabled:self.options.disabled});self.$arrows[1].options({disabled:self.options.disabled});}
|
||
|
|
self.$thumb.options({disabled:self.options.disabled});}
|
||
|
|
function setSizes(){self.values=(self.options.max-self.options.min+self.options.step)/self.options.step;self.trackSize=self.options.size-self.options.arrows*32;self.thumbSize=Math.max(self.trackSize/self.values,self.options.thumbSize);self.trackImageWidths=self.trackImages==1?[self.trackSize-16]:Ox.splitInt(self.trackSize-2,self.trackImages);self.trackColorStart=self.options.trackGradient?self.thumbSize/2/self.options.size:0;self.trackColorStep=self.options.trackGradient?(self.options.size-self.thumbSize)/(self.trackColors-1)/self.options.size:1/self.trackColors;that.css({width:self.options.size+'px'});self.$track&&self.$track.css({width:(self.trackSize-2)+'px'});if(self.$thumb){self.$thumb.options({width:self.thumbSize});setThumb();}}
|
||
|
|
function setThumb(animate){self.$thumb.stop().animate({marginLeft:getPx(self.options.value)-1+'px'},animate?250:0,function(){self.options.thumbValue&&self.$thumb.options({title:self.options.value});});}
|
||
|
|
function setTrackColors(){['moz','o','webkit'].forEach(function(browser){self.$track.css({background:'-'+browser+'-linear-gradient(left, '
|
||
|
|
+self.options.trackColors[0]+' 0%, '
|
||
|
|
+self.options.trackColors.map(function(v,i){var ret=v+' '+(self.trackColorStart+self.trackColorStep*i)*100+'%';if(!self.options.trackGradient){ret+=', '+v+' '+(self.trackColorStart+self.trackColorStep*(i+1))*100+'%';}
|
||
|
|
return ret;}).join(', ')+', '
|
||
|
|
+self.options.trackColors[self.trackColors-1]+' 100%)'});});}
|
||
|
|
function setValue(value,animate,trigger){value=Ox.limit(self.hasValues?self.options.values.indexOf(value):value.toPrecision(10),self.options.min,self.options.max);value=self.hasValues?self.options.values[value]:value;if(value!=self.options.value){self.options.value=value;setThumb(animate);trigger&&that.triggerEvent('change',{value:self.options.value});}}
|
||
|
|
return that;};'use strict';Ox.Select=function(options,self){self=self||{};var that=Ox.Element({tooltip:options.tooltip||''},self).defaults({id:'',items:[],label:'',labelWidth:64,max:1,maxWidth:0,min:1,overlap:'none',size:'medium',style:'rounded',title:'',type:'text',value:options.max!=1?[]:'',width:'auto'}).options(options).update({label:function(){self.$label.options({title:self.options.label});},labelWidth:function(){self.$label.options({width:self.options.labelWidth});self.$title.css({width:getTitleWidth()+'px'});},title:function(){var title=self.options.title?self.options.title:getItem(self.options.value).title;if(self.options.type=='text'){self.$title.html(title);}else{self.$button.options({title:title});}},width:function(){that.css({width:self.options.width-2+'px'});self.$title.css({width:getTitleWidth()+'px'});},value:function(){var value=self.options.value;if(self.options.type=='text'&&!self.options.title){self.$title.html(getItem(value).title);}
|
||
|
|
value!==''&&Ox.makeArray(value).forEach(function(value){self.$menu.checkItem(value);});self.options.value=self.optionGroup.value();}}).addClass('OxSelect Ox'+Ox.toTitleCase(self.options.size)
|
||
|
|
+' Ox'+Ox.toTitleCase(self.options.style)+(self.options.overlap=='none'?'':' OxOverlap'+Ox.toTitleCase(self.options.overlap))+(self.options.label?' OxLabelSelect':'')).css(self.options.width=='auto'?{}:{width:self.options.width-2+'px'}).bindEvent({anyclick:function(e){showMenu($(e.target).is('.OxButton')?'button':null);},key_escape:loseFocus,key_down:showMenu});self.options.items=self.options.items.map(function(item){var isObject=Ox.isObject(item);return Ox.isEmpty(item)?item:{id:isObject?item.id:item,title:isObject?item.title:item,checked:Ox.makeArray(self.options.value).indexOf(isObject?item.id:item)>-1,disabled:isObject?item.disabled:false};});self.optionGroup=new Ox.OptionGroup(self.options.items,self.options.min,self.options.max,'checked');self.options.items=self.optionGroup.init();self.options.value=self.optionGroup.value();if(self.options.label){self.$label=Ox.Label({overlap:'right',style:self.options.style,textAlign:'right',title:self.options.label,width:self.options.labelWidth}).appendTo(that);}
|
||
|
|
if(self.options.type=='text'){self.$title=$('<div>').addClass('OxTitle').css({width:getTitleWidth()+'px'}).html(self.options.title||getItem(self.options.value).title).appendTo(that);}
|
||
|
|
self.$button=Ox.Button({id:self.options.id+'Button',selectable:true,style:'symbol',title:self.options.type=='text'||!self.options.title?'select':self.options.title,type:'image'}).appendTo(that);self.$menu=Ox.Menu({edge:'bottom',element:self.$title||self.$button,id:self.options.id+'Menu',items:[{group:self.options.id+'Group',items:self.options.items,max:self.options.max,min:self.options.min}],maxWidth:self.options.maxWidth,size:self.options.size}).bindEvent({change:changeMenu,click:clickMenu,hide:hideMenu});self.options.type=='image'&&self.$menu.addClass('OxRight');function clickMenu(data){that.triggerEvent('click',data);}
|
||
|
|
function changeMenu(data){self.options.value=self.optionGroup.value();self.$title&&self.$title.html(self.options.title||getItem(self.options.value).title);that.triggerEvent('change',{title:Ox.isEmpty(self.options.value)?'':Ox.isArray(self.options.value)?self.options.value.map(function(value){return getItem(value).title;}):getItem(self.options.value).title,value:self.options.value});}
|
||
|
|
function getItem(id){return Ox.getObjectById(self.options.items,id);}
|
||
|
|
function getTitleWidth(){return self.options.width-24-(self.options.label?self.options.labelWidth:0);}
|
||
|
|
function hideMenu(){that.loseFocus();that.removeClass('OxSelected');self.$button.options({value:false});}
|
||
|
|
function loseFocus(){that.loseFocus();}
|
||
|
|
function selectItem(){}
|
||
|
|
function showMenu(from){that.gainFocus();that.addClass('OxSelected');from!='button'&&self.$button.options({value:true});self.options.tooltip&&that.$tooltip.hide();self.$menu.showMenu();}
|
||
|
|
that.disableItem=function(id){self.$menu.getItem(id).options({disabled:true});return that;};that.enableItem=function(id){self.$menu.getItem(id).options({disabled:false});return that;};that.removeElement=function(){self.$menu.remove();return Ox.Element.prototype.removeElement.apply(that,arguments);};that.selected=function(){return Ox.makeArray(self.optionGroup.value()).map(function(id){return{id:id,title:getItem(id).title};});};return that;};'use strict';Ox.SelectInput=function(options,self){var that;self=Ox.extend(self||{},{options:Ox.extend({inputValue:'',inputWidth:128,items:[],label:'',labelWidth:128,max:1,min:0,placeholder:'',style:'rounded',title:'',value:options.max==1||options.max==void 0?'':[],width:384},options||{})});self.other=self.options.items[self.options.items.length-1].id;self.otherWidth=self.options.width-self.options.inputWidth;self.$select=Ox.Select({items:self.options.items,label:self.options.label,labelWidth:self.options.labelWidth,max:self.options.max,min:self.options.min,style:self.options.style,title:getTitle(),value:self.options.value,width:self.options.width}).bindEvent({change:function(data){self.options.value=getValue();setValue(self.isOther);}});self.$input=Ox.Input({placeholder:self.options.placeholder,style:self.options.style,width:self.options.inputWidth,value:self.options.inputValue}).bindEvent({change:function(data){self.options.value=data.value;}}).hide();setValue();that=Ox.FormElementGroup({elements:[self.$select,self.$input],id:self.options.id,join:function(value){return value[value[0]==self.other?1:0]},split:function(value){return Ox.filter(self.options.items,function(item,i){return i<item.length-1;}).map(function(item){return item.id;}).indexOf(value)>-1?[value,'']:[self.other,value];},width:self.options.width}).update({label:function(){self.$select.options({label:self.options.label});},value:function(){self.options.value=that.options('value');setValue();}});function getTitle(){var value=self.$select?self.$select.value():self.options.value;return Ox.isEmpty(value)?self.options.title:Ox.getObjectById(self.options.items,value).title;}
|
||
|
|
function getValue(){self.isOther=self.$select.value()==self.other;return!self.isOther?self.$select.value():self.$input.value();}
|
||
|
|
function setValue(isOther){if((!self.options.value&&isOther!==true)||Ox.filter(self.options.items,function(item){return item.id!=self.other;}).map(function(item){return item.id;}).indexOf(self.options.value)>-1){self.$select.options({title:!self.options.value?self.options.title:Ox.getObjectById(self.options.items,self.options.value).title,value:self.options.value,width:self.options.width}).removeClass('OxOverlapRight');self.$input.hide();}else{self.$select.options({title:Ox.getObjectById(self.options.items,self.other).title,value:self.other,width:self.otherWidth}).addClass('OxOverlapRight');self.$input.show().focusInput(true);}
|
||
|
|
self.$select.options({title:getTitle()});}
|
||
|
|
that.value=function(){if(arguments.length==0){return getValue();}else{self.options.value=arguments[0];setValue();return that;}};return that;};'use strict';Ox.Spreadsheet=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({columnPlaceholder:'',columns:[],columnTitleType:'str',columnWidth:64,rowPlaceholder:'',rows:[],rowTitleType:'str',rowTitleWidth:128,title:'',value:{}}).options(options||{}).addClass('OxSpreadsheet');if(Ox.isEmpty(self.options.value)){self.options.value={columns:[],rows:[],values:[]}
|
||
|
|
Ox.loop(4,function(i){self.options.value.columns.push('');self.options.value.rows.push('');self.options.value.values.push([0,0,0,0]);});}else{self.options.value.values=self.options.value.values||[];if(Ox.isEmpty(self.options.value.values)){self.options.value.values=[];self.options.value.rows.forEach(function(row,r){self.options.value.values.push([]);self.options.value.columns.forEach(function(column,c){self.options.value.values[r].push(0);});});}}
|
||
|
|
renderSpreadsheet();function addColumn(index){self.options.value.columns.splice(index,0,'');self.options.value.values.forEach(function(columns){columns.splice(index,0,0);});renderSpreadsheet();}
|
||
|
|
function addRow(index){self.options.value.rows.splice(index,0,'');self.options.value.values.splice(index,0,Ox.repeat([0],self.columns));renderSpreadsheet();}
|
||
|
|
function getSums(){var sums={column:Ox.repeat([0],self.columns),row:Ox.repeat([0],self.rows),sheet:0};self.options.value.values.forEach(function(columns,r){columns.forEach(function(value,c){sums.column[c]+=value;sums.row[r]+=value;sums.sheet+=value;});});return sums;}
|
||
|
|
function removeColumn(index){self.options.value.columns.splice(index,1);self.options.value.values.forEach(function(columns){columns.splice(index,1);});renderSpreadsheet();}
|
||
|
|
function removeRow(index){self.options.value.rows.splice(index,1);self.options.value.values.splice(index,1);renderSpreadsheet();}
|
||
|
|
function renderSpreadsheet(){self.columns=self.options.value.columns.length;self.rows=self.options.value.rows.length;self.sums=getSums();self.$input={};that.empty().css({width:self.options.rowTitleWidth
|
||
|
|
+self.options.columnWidth*(self.columns+1)+'px',height:16*(self.rows+2)+'px'});[self.options.title].concat(Ox.clone(self.options.value.rows),['Total']).forEach(function(row,r){r--;[''].concat(Ox.clone(self.options.value.columns),['Total']).forEach(function(column,c){c--;if(r==-1){if(c==-1||c==self.columns){Ox.Label({style:'square',textAlign:c==-1?'left':'right',title:c==-1?self.options.title:'Total',width:c==-1?self.options.rowTitleWidth:self.options.columnWidth}).appendTo(that);}else{Ox.MenuButton({style:'square',type:'image',items:[{id:'before',title:Ox._('Add column before')},{id:'after',title:Ox._('Add column after')},{id:'remove',title:Ox._('Remove this column'),disabled:self.columns==1}]}).bindEvent({click:function(data){if(data.id=='remove'){removeColumn(c);}else{addColumn(c+(data.id=='after'));}
|
||
|
|
triggerChangeEvent();}}).appendTo(that);Ox.Input({placeholder:self.options.columnPlaceholder,style:'square',type:self.options.columnTitleType,value:column,width:self.options.columnWidth-16}).bindEvent({change:function(data){self.options.value.columns[c]=data.value;triggerChangeEvent();}}).appendTo(that);}}else{if(c==-1){if(r<self.rows){Ox.MenuButton({style:'square',type:'image',items:[{id:'before',title:Ox._('Add row above')},{id:'after',title:Ox._('Add row below')},{id:'remove',title:Ox._('Remove this row'),disabled:self.rows==1}]}).bindEvent({click:function(data){if(data.id=='remove'){removeRow(r);}else{addRow(r+(data.id=='after'));}
|
||
|
|
triggerChangeEvent();}}).appendTo(that);Ox.Input({placeholder:self.options.rowPlaceholder,style:'square',type:self.options.rowTitleType,value:row,width:self.options.rowTitleWidth-16}).bindEvent({change:function(data){self.options.value.rows[r]=data.value;triggerChangeEvent();}}).appendTo(that);}else{Ox.Label({style:'square',textAlign:'right',title:row,width:self.options.rowTitleWidth}).appendTo(that);}}else{var id=c+','+r,isColumnSum=r==self.rows,isRowSum=c==self.columns,isSheetSum=isColumnSum&&isRowSum,isSum=isColumnSum||isRowSum;self.$input[id]=Ox.Input({disabled:isSum,style:'square',type:'int',value:isSheetSum?self.sums.sheet:isColumnSum?self.sums.column[c]:isRowSum?self.sums.row[r]:self.options.value.values[r][c],width:self.options.columnWidth}).appendTo(that);!isSum&&self.$input[id].bindEvent({change:function(data){self.options.value.values[r][c]=parseInt(data.value,10);self.sums=getSums();self.$input[c+','+self.rows].value(self.sums.column[c]);self.$input[self.columns+','+r].value(self.sums.row[r]);self.$input[self.columns+','+self.rows].value(self.sums.sheet);triggerChangeEvent();}});}}});});}
|
||
|
|
function triggerChangeEvent(){that.triggerEvent('change',{value:self.options.value});}
|
||
|
|
return that;};'use strict';Ox.TimeInput=function(options,self){var that;self=Ox.extend(self||{},{options:Ox.extend({ampm:false,seconds:false,milliseconds:false,value:(function(){var date=new Date();return Ox.formatDate(date,options&&(options.seconds||options.milliseconds)?'%T':'%H:%M')+(options&&options.milliseconds?'.'+Ox.pad(date%1000,3):'');}()),width:{hours:32,minutes:32,seconds:32,milliseconds:40,ampm:32}},options||{})});self.options.seconds=self.options.seconds||self.options.milliseconds;self.$input={hours:Ox.Input({autocomplete:(self.options.ampm?Ox.range(1,13):Ox.range(0,24)).map(function(i){return Ox.pad(i,2);}),autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'hours',textAlign:'right',width:self.options.width.hours}),minutes:Ox.Input({autocomplete:Ox.range(0,60).map(function(i){return Ox.pad(i,2);}),autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'minutes',textAlign:'right',width:self.options.width.minutes}),seconds:Ox.Input({autocomplete:Ox.range(0,60).map(function(i){return Ox.pad(i,2);}),autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'seconds',textAlign:'right',width:self.options.width.seconds}),milliseconds:Ox.Input({autocomplete:Ox.range(0,1000).map(function(i){return Ox.pad(i,3);}),autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'milliseconds',textAlign:'right',width:self.options.width.milliseconds}),ampm:Ox.Input({autocomplete:['AM','PM'],autocompleteReplace:true,autocompleteReplaceCorrect:true,id:'ampm',width:self.options.width.ampm})};that=Ox.InputGroup(Ox.extend(self.options,{id:self.options.id,inputs:[].concat([self.$input.hours,self.$input.minutes,],self.options.seconds?[self.$input.seconds]:[],self.options.milliseconds?[self.$input.milliseconds]:[],self.options.ampm?[self.$input.ampm]:[]),join:join,separators:[].concat([{title:':',width:8},],self.options.seconds?[{title:':',width:8}]:[],self.options.milliseconds?[{title:'.',width:8}]:[],self.options.ampm?[{title:'',width:8}]:[]),split:split,value:self.options.value,width:0}),self);function getDate(){return new Date('1970/01/01 '+(self.options.milliseconds?self.options.value.slice(0,-4):self.options.value));}
|
||
|
|
function getValues(){var date=getDate();return{ampm:Ox.formatDate(date,'%p'),hours:Ox.formatDate(date,self.options.ampm?'%I':'%H'),milliseconds:self.options.milliseconds?self.options.value.slice(-3):'000',minutes:Ox.formatDate(date,'%M'),seconds:Ox.formatDate(date,'%S')};}
|
||
|
|
function join(){return Ox.formatDate(new Date('1970/01/01 '+[self.$input.hours.value(),self.$input.minutes.value(),self.options.seconds?self.$input.seconds.value():'00'].join(':')+(self.options.ampm?' '+self.$input.ampm.value():'')),(self.options.seconds?'%T':'%H:%M')+(self.options.milliseconds?'.'+self.$input.milliseconds.value():''));}
|
||
|
|
function split(value){var values=getValues();return[].concat([values.hours,values.minutes,],self.options.seconds?[values.seconds]:[],self.options.milliseconds?[values.milliseconds]:[],self.options.ampm?[values.ampm]:[]);}
|
||
|
|
return that;};'use strict';Ox.Calendar=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({date:new Date(),events:[],height:256,range:[1000,3000],selected:'',showControls:false,showToolbar:false,showTypes:['date','place','person','other'],showZoombar:false,width:256,zoom:8,zoomOnlyWhenFocused:false}).options(options||{}).update({date:function(){},events:function(){self.options.events.forEach(function(event){event=getEventData(event);});self.$lines=[];getLines();renderCalendar();if(self.options.selected){selectEvent(getSelectedEvent()?self.options.selected:'');}},height:function(){that.css({height:self.options.height+'px'});},selected:function(){var selected=self.options.selected;self.options.selected='FIXME: THIS IS A VERY UGLY HACK';selectEvent(selected);},width:function(){that.css({width:self.options.width+'px'});self.options.showZoombar&&self.$zoomInput.options({size:self.options.width});renderOverlay();},zoom:function(){}}).addClass('OxCalendar').bindEvent({key_0:function(){panToSelected();},key_down:function(){scrollBy(1);},key_equal:function(){zoomBy(1);},key_escape:function(){selectEvent('');},key_left:function(){panBy(-self.$content.width()/2*getSecondsPerPixel()*1000);},key_minus:function(){zoomBy(-1);},key_right:function(){panBy(self.$content.width()/2*getSecondsPerPixel()*1000);},key_shift_0:function(){zoomToSelected();},key_shift_down:function(){scrollTo(1000000,true);},key_shift_up:function(){scrollTo(0,true);},key_up:function(){scrollBy(-1);},mousedown:function(e){!$(e.target).is('.OxInput')&&that.gainFocus();}});self.options.events.forEach(function(event){event=getEventData(event);});self.maxZoom=32;self.minLabelWidth=80;self.units=[{id:'millennium',seconds:365242.5*86400,date:function(i){return Ox.parseDate((i+1)*1000,true);},name:function(i){return i>-2?Ox._('{0} Millennium',[Ox.formatOrdinal(i+2)]):Ox._('{0} Millennium BC',[Ox.formatOrdinal(-i-1)])},value:function(date){return Math.floor(date.getUTCFullYear()/1000)-1;}},{id:'century',seconds:36524.25*86400,date:function(i){return Ox.parseDate((i+19)*100,true);},name:function(i){return i>-20?Ox._('{0} Century',[Ox.formatOrdinal(i+20)]):Ox._('{0} Century BC',[Ox.formatOrdinal(-i-19)])},value:function(date){return Math.floor(date.getUTCFullYear()/100)-19;}},{id:'decade',seconds:3652.425*86400,date:function(i){return Ox.parseDate((i+197)*10,true);},name:function(i){return i>-198?(i+197)+'0s':(-i-198)+'0s BC';},value:function(date){return Math.floor(date.getUTCFullYear()/10)-197;}},{id:'year',seconds:365.2425*86400,date:function(i){return Ox.parseDate(i+1970,true);},name:function(i){return Ox.formatDate(Ox.parseDate(i+1970,true),'%x',true);},value:function(date){return date.getUTCFullYear()-1970;}},{id:'month',seconds:365.2425/12*86400,date:function(i){return Ox.parseDate((Math.floor(i/12)+1970)+'-'+(Ox.mod(i,12)+1),true);},name:function(i){return Ox.formatDate(Ox.parseDate((Math.floor(i/12+1970))+'-'+(Ox.mod(i,12)+1),true),'%b %x',true);},value:function(date){return(date.getUTCFullYear()-1970)*12+date.getUTCMonth();}},{id:'week',seconds:7*86400,date:function(i){return new Date((i*7-3)*86400000);},name:function(i){return Ox.formatDate(new Date((i*7-3)*86400000),'%a, %b %e',true);},value:function(date){return Math.floor((date/86400000+4)/7);}},{id:'day',seconds:86400,date:function(i){return new Date(i*86400000);},name:function(i){return Ox.formatDate(new Date(i*86400000),'%b %e, %x',true);},value:function(date){return Math.floor(date/86400000);}},{id:'six_hours',seconds:21600,date:function(i){return new Date(i*21600000);},name:function(i){return Ox.formatDate(new Date(i*21600000),'%b %e, %H:00',true);},value:function(date){return Math.floor(date/21600000);}},{id:'hour',seconds:3600,date:function(i){return new Date(i*3600000);},name:function(i){return Ox.formatDate(new Date(i*3600000),'%b %e, %H:00',true);},value:function(date){return Math.floor(date/3600000);}},{id:'five_minutes',seconds:300,date:function(i){return new Date(i*300000);},name:function(i){return Ox.formatDate(new Date(i*300000),'%b %e, %H:%M',true);},value:function(date)
|
||
|
|
self.$scalebar=Ox.Element().addClass('OxTimeline').css({posision:'absolute',top:(self.options.showToolbar*24)+'px'}).bindEvent({dragstart:dragstart,drag:drag,dragpause:dragpause,dragend:dragend,singleclick:singleclick}).appendTo(that);self.$container=Ox.Element().addClass('OxCalendarContainer').css({top:(self.options.showToolbar*24)+16+'px',bottom:(self.options.showZoombar*16)+16+'px'}).on({mouseleave:mouseleave,mousemove:mousemove,mousewheel:mousewheel}).bindEvent({doubleclick:doubleclick,dragstart:dragstart,drag:drag,dragpause:dragpause,dragend:dragend,singleclick:singleclick}).appendTo(that);self.$content=Ox.Element().addClass('OxCalendarContent').appendTo(self.$container);self.$background=Ox.Element().addClass('OxBackground').appendTo(self.$content);self.$scrollbar=Ox.Element().addClass('OxTimeline').css({posision:'absolute',bottom:(self.options.showZoombar*16)+'px'}).appendTo(that);if(self.options.showZoombar){self.$zoombar=Ox.Element().css({position:'absolute',bottom:0,height:'16px'}).appendTo(that);self.$zoomInput=Ox.Range({arrows:true,changeOnDrag:true,max:self.maxZoom,min:0,size:self.options.width,thumbSize:32,thumbValue:true,value:self.options.zoom}).bindEvent({change:changeZoom}).appendTo(self.$zoombar);}
|
||
|
|
self.$controls={center:Ox.Button({title:'center',type:'image'}).addClass('OxCalendarControl OxCalendarButtonCenter').css({bottom:40+(self.options.showZoombar*16)+'px'}).bindEvent({singleclick:function(){},doubleclick:function(){}}).appendTo(that),down:Ox.Button({title:'down',type:'image'}).addClass('OxCalendarControl OxCalendarButtonDown').css({bottom:20+(self.options.showZoombar*16)+'px'}).bindEvent({singleclick:function(){scrollBy(1);},doubleclick:function(){scrollTo(1000000,true);}}).appendTo(that),left:Ox.Button({title:'left',type:'image'}).addClass('OxCalendarControl OxCalendarButtonLeft').css({bottom:40+(self.options.showZoombar*16)+'px'}).bindEvent({singleclick:function(){panBy(-self.$content.width()/2*getSecondsPerPixel()*1000);},doubleclick:function(){panBy(-self.$content.width()*getSecondsPerPixel()*1000);}}).appendTo(that),right:Ox.Button({title:'right',type:'image'}).addClass('OxCalendarControl OxCalendarButtonRight').css({bottom:40+(self.options.showZoombar*16)+'px'}).bindEvent({singleclick:function(){panBy(self.$content.width()/2*getSecondsPerPixel()*1000);},doubleclick:function(){panBy(self.$content.width()*getSecondsPerPixel()*1000);}}).appendTo(that),up:Ox.Button({title:'up',type:'image'}).css({bottom:60+(self.options.showZoombar*16)+'px'}).addClass('OxCalendarControl OxCalendarButtonUp').bindEvent({singleclick:function(){scrollBy(-1);},doubleclick:function(){scrollTo(0,true)}}).appendTo(that)};!self.options.showControls&&Ox.forEach(self.$controls,function($control){$control.css({opacity:0}).hide();});self.$eventControls={name:Ox.Label({textAlign:'center',tooltip:Ox._('Click to pan, doubleclick to zoom')}).addClass('OxEventControl OxEventName').css({bottom:20+(self.options.showZoombar*16)+'px'}).bindEvent({singleclick:function(){panToSelected();},doubleclick:function(){zoomToSelected();}}).appendTo(that),deselectButton:Ox.Button({title:'close',tooltip:Ox._('Deselect'),type:'image'}).addClass('OxEventControl OxEventDeselectButton').css({bottom:20+(self.options.showZoombar*16)+'px'}).bindEvent({click:function(){selectEvent('');}}).appendTo(that)};Ox.forEach(self.$eventControls,function($eventControl){$eventControl.css({opacity:0}).hide();});self.$tooltip=Ox.Tooltip({animate:false}).css({textAlign:'center'});self.$lines=[];getLines();renderCalendar();function changeDate(){}
|
||
|
|
function changeZoom(data){self.options.zoom=data.value;renderCalendar();}
|
||
|
|
function doubleclick(data){var $target=$(data.target),id=$target.data('id');if($target.is('.OxLine > .OxEvent')){selectEvent(id,$target);zoomToSelected();}else{if(self.options.zoom<self.maxZoom){self.options.date=new Date((+self.options.date+ +getMouseDate(data))/2);self.options.zoom++;}
|
||
|
|
renderCalendar();}}
|
||
|
|
function dragstart(data){Ox.$body.addClass('OxDragging');self.drag={top:self.$container[0].scrollTop,x:data.clientX};}
|
||
|
|
function drag(data){if(self.drag){var marginLeft=data.clientX-self.drag.x,scrollbarFactor=getScrollbarFactor();self.$scalebar.css({marginLeft:marginLeft+'px'});self.$content.css({marginLeft:marginLeft+'px'});self.$scrollbar.css({marginLeft:Math.round(marginLeft/scrollbarFactor)+'px'});scrollTo(self.drag.top-data.clientDY);}}
|
||
|
|
function dragpause(data){if(self.drag){dragafter(data);self.drag.x=data.clientX;}}
|
||
|
|
function dragend(data){if(self.drag){Ox.$body.removeClass('OxDragging');dragafter(data);self.drag=null;}}
|
||
|
|
function dragafter(data){self.$scalebar.css({marginLeft:0});self.$content.css({marginLeft:0});self.$scrollbar.css({marginLeft:0});self.options.date=new Date(+self.options.date
|
||
|
|
-(data.clientX-self.drag.x)*getSecondsPerPixel()*1000);renderCalendar();}
|
||
|
|
function dragstartScrollbar(data){Ox.$body.addClass('OxDragging');self.drag={x:data.clientX};}
|
||
|
|
function dragScrollbar(data){var marginLeft=data.clientX-self.drag.x,scrollbarFactor=getScrollbarFactor();self.$scalebar.css({marginLeft:(marginLeft*scrollbarFactor)+'px'});self.$content.css({marginLeft:(marginLeft*scrollbarFactor)+'px'});self.$scrollbar.css({marginLeft:marginLeft+'px'});}
|
||
|
|
function dragpauseScrollbar(data){dragafterScrollbar(data);self.drag={x:data.clientX};}
|
||
|
|
function dragendScrollbar(data){Ox.$body.removeClass('OxDragging');dragafterScrollbar(data);self.drag=null;}
|
||
|
|
function dragafterScrollbar(data){self.$scalebar.css({marginLeft:0});self.$content.css({marginLeft:0});self.$scrollbar.css({marginLeft:0});self.options.date=new Date(+self.options.date
|
||
|
|
+(self.drag.x-data.clientX)*getSecondsPerPixel()*1000*getScrollbarFactor());renderCalendar();}
|
||
|
|
function getBackgroundElements(zoom){var $elements=[],units=getUnits(zoom),n,value,width;[1,0].forEach(function(u){var unit=units[u],value=unit.value(self.options.date),width=Math.round(unit.seconds*getPixelsPerSecond(zoom)),n=Math.ceil(self.options.width*1.5/width);Ox.loop(-n,n+1,function(i){if(u==0||Ox.mod(value+i,2)){$elements.push(Ox.Element().addClass(u==0?'line':'').css({left:getPosition(unit.date(value+i),zoom)+'px',width:(u==0?1:width)+'px',height:self.contentHeight+'px'}));}});});return $elements;}
|
||
|
|
function getCalendarEvent(zoom){var ms=self.options.width*getSecondsPerPixel(zoom)*1000;return{startTime:new Date(+self.options.date-ms/2),endTime:new Date(+self.options.date+ms/2)};}
|
||
|
|
function getEventById(id){var event=null;Ox.forEach(self.options.events,function(v){if(v.id==id){event=v;return false;}});return event;}
|
||
|
|
function getEventCenter(event){return new Date(+event.startTime+getEventDuration(event)/2);}
|
||
|
|
function getEventData(event){if(!event.end){event.end=Ox.formatDate(new Date(),'%Y-%m-%d');event.current=true;}
|
||
|
|
event.id=Ox.isUndefined(event.id)?Ox.uid():event.id;event.startTime=Ox.parseDate(event.start,true);event.endTime=Ox.parseDate(event.end,true);event.durationTime=event.endTime-event.startTime;event.rangeText=Ox.formatDateRange(event.start,event.end,true);event.durationText=Ox.formatDateRangeDuration(event.start,event.end,true);if(event.current){event.rangeText=event.rangeText.split(' - ').shift()+' - today';}
|
||
|
|
return event;}
|
||
|
|
function getEventDuration(event){return event.endTime-event.startTime;}
|
||
|
|
function getEventElement(event,zoom){var left=Math.max(getPosition(event.startTime,zoom),-10000),paddingLeft=(event.type&&left<0?-left:0),width=Ox.limit(getPosition(event.endTime,zoom)-left,1,20000)-paddingLeft;if(width<0){paddingLeft=0;width=getPosition(event.endTime,zoom)-left;}
|
||
|
|
return Ox.Element().addClass('OxEvent'
|
||
|
|
+(event.type?' Ox'+Ox.toTitleCase(event.type):'')
|
||
|
|
+(event.current?' OxCurrent':'')
|
||
|
|
+(event.id==self.options.selected?' OxSelected':'')).css({left:left+'px',width:width+'px',paddingLeft:paddingLeft+'px'}).data({id:event.id}).html(' '+event.name+' ')}
|
||
|
|
function getEventElementById(id){var $element;$('.OxLine > .OxEvent').each(function(){var $this=$(this);if($this.data('id')==id){$element=$this;return false;}});return $element;}
|
||
|
|
function getEventLine(id){var line=-1;Ox.forEach(self.lineEvents,function(events,line_){if(Ox.getIndexById(events,id)>-1){line=line_;return false;}});return line;}
|
||
|
|
function getLines(){self.lineEvents=[];self.$content.find('.OxLine').remove();self.options.events.filter(function(event){return self.options.showTypes.indexOf(event.type)>-1;}).sort(function(a,b){if(a.type=='date'&&b.type!='date'){return-1;}else if(a.type!='date'&&b.type=='date'){return 1;}else if(a.type=='person'&&b.type!='person'){return 1;}else if(a.type!='person'&&b.type=='person'){return-1;}else if(a.durationTime!=b.durationTime){return b.durationTime-a.durationTime;}else if(+a.startTime!=+b.startTime){return a.startTime-b.startTime;}else{return a.name<b.name?-1:1;}}).forEach(function(event,i){var line=self.lineEvents.length;Ox.forEach(self.lineEvents,function(events,line_){var fits=true;Ox.forEach(events,function(event_){if(overlaps(event,event_)){fits=false;return false;}});if(fits){line=line_;return false;}});if(line==self.lineEvents.length){self.lineEvents[line]=[];self.$lines[line]=Ox.Element().addClass('OxLine').css({top:(line*16)+'px'}).appendTo(self.$content);}
|
||
|
|
self.lineEvents[line].push(event);});}
|
||
|
|
function getMouseDate(e){return new Date(+self.options.date+(e.clientX-that.offset().left-self.options.width/2-1)*getSecondsPerPixel()*1000);}
|
||
|
|
function getOverlayWidths(){var width=Math.round(self.options.width/getScrollbarFactor());return[Math.floor((self.options.width-width)/2),width,Math.ceil((self.options.width-width)/2),];}
|
||
|
|
function getPixelsPerSecond(zoom){return Math.pow(2,(!Ox.isUndefined(zoom)?zoom:self.options.zoom)-(self.maxZoom-4));}
|
||
|
|
function getPosition(date,zoom){return Math.round(self.options.width/2
|
||
|
|
+(date-self.options.date)/1000*getPixelsPerSecond(zoom));}
|
||
|
|
function getScrollbarFactor(){return Math.pow(2,Math.min(self.options.zoom,4));}
|
||
|
|
function getSecondsPerPixel(zoom){return 1/getPixelsPerSecond(zoom);}
|
||
|
|
function getSelectedEvent(){var event=null;if(self.options.selected!==''){event=getEventById(self.options.selected);}
|
||
|
|
return event;}
|
||
|
|
function getSelectedEventElement(){var $element=null;if(self.options.selected!==''){$element=getEventElementById(self.options.selected);}
|
||
|
|
return $element;}
|
||
|
|
function getTimelineElements(zoom){var $elements=[],unit=getUnits(zoom)[0],value=unit.value(self.options.date),width=unit.seconds*getPixelsPerSecond(zoom),n=Math.ceil(self.options.width*1.5/width);Ox.loop(-n,n+1,function(i){$elements.push(getEventElement({name:unit.name(value+i),startTime:unit.date(value+i),endTime:unit.date(value+i+1)},zoom).addClass(Ox.mod(value+i,2)==0?'even':'odd'));});return $elements;}
|
||
|
|
function getUnits(zoom){var pixelsPerSecond=getPixelsPerSecond(zoom),units;self.units.reverse();Ox.forEach(self.units,function(v,i){var width=Math.round(v.seconds*pixelsPerSecond);if(width>=self.minLabelWidth){units=[self.units[i],self.units[i-1]];return false;}});self.units.reverse();return units;}
|
||
|
|
function mouseleave(){self.$tooltip.hide();}
|
||
|
|
function mousemove(e){var $target=$(e.target),event,title;if($target.is('.OxLine > .OxEvent')){event=getEventById($target.data('id'));title='<span class="OxBright">'+event.name+'</span><br/>'
|
||
|
|
+(event.rangeText!=event.name?event.rangeText+'<br>':'')
|
||
|
|
+event.durationText;}else{title=Ox.formatDate(getMouseDate(e),'%a, %b %e, %x, %H:%M:%S',true);}
|
||
|
|
self.$tooltip.options({title:title}).show(e.clientX,e.clientY);}
|
||
|
|
function mousewheel(e,delta,deltaX,deltaY){var deltaZ=0;if((!self.options.zoomOnlyWhenFocused||that.hasFocus())&&!self.mousewheel&&Math.abs(deltaY)>Math.abs(deltaX)){if(deltaY<0&&self.options.zoom>0){deltaZ=-1;}else if(deltaY>0&&self.options.zoom<self.maxZoom){deltaZ=1;}
|
||
|
|
if(deltaZ){self.options.date=deltaZ==-1?new Date(2*+self.options.date- +getMouseDate(e)):new Date((+self.options.date+ +getMouseDate(e))/2);zoomBy(deltaZ);}
|
||
|
|
self.mousewheel=true;setTimeout(function(){self.mousewheel=false;},250);}
|
||
|
|
that.hasFocus()&&e.preventDefault();}
|
||
|
|
function overlaps(eventA,eventB){return(eventA.startTime>=eventB.startTime&&eventA.startTime<eventB.endTime)||(eventB.startTime>=eventA.startTime&&eventB.startTime<eventA.endTime);}
|
||
|
|
function panBy(ms){panTo(new Date(+self.options.date+ms));}
|
||
|
|
function panTo(date,line){var delta=Math.round((date-self.options.date)/1000*getPixelsPerSecond()),ms=250*Math.min(Math.abs(delta)/(self.$content.width()/2),1);self.$scalebar.stop().animate({marginLeft:-delta+'px'},ms);self.$content.stop().animate({marginLeft:-delta+'px'},ms,function(){self.$scalebar.stop().css({marginLeft:0});self.$content.css({marginLeft:0});self.$scrollbar.stop().css({marginLeft:0});self.options.date=date;renderCalendar();});self.$scrollbar.stop().animate({marginLeft:-delta/getScrollbarFactor()+'px'},ms);if(!Ox.isUndefined(line)){scrollTo(line*16+8-self.$container.height()/2,true);}}
|
||
|
|
function panToSelected(){var event=getSelectedEvent();self.options.selected!==''&&panTo(getEventCenter(event),getEventLine(event.id));}
|
||
|
|
function renderBackground(){getBackgroundElements(self.options.zoom).forEach(function($element){$element.appendTo(self.$background);});}
|
||
|
|
function renderCalendar(){self.contentHeight=Math.max(self.lineEvents.length*16,self.options.height-32
|
||
|
|
-self.options.showZoombar*16
|
||
|
|
-self.options.showToolbar*24);self.$content.css({height:self.contentHeight+'px'});that.find('.OxBackground').empty();that.find('.OxEvent').remove();renderBackground();renderTimelines();renderOverlay();renderEvents();self.options.showToolbar&&self.$dateInput.value(Ox.formatDate(self.options.date,'%Y-%m-%d %H:%M:%S',true));}
|
||
|
|
function renderEvents(){var calendarEvent=getCalendarEvent(),height;self.lineEvents.forEach(function(events,line){events.forEach(function(event){if(event.id==self.options.selected||overlaps(event,calendarEvent)){getEventElement(event).appendTo(self.$lines[line]);}});});}
|
||
|
|
function renderOverlay(){var widths=getOverlayWidths();that.find('.OxOverlay').remove();Ox.Element().addClass('OxOverlay').css({bottom:(self.options.showZoombar*16)+'px'}).append($('<div>').css({width:widths[0]+'px'})).append($('<div>').css({left:widths[0]+'px',width:widths[1]+'px'})).append($('<div>').css({left:(widths[0]+widths[1])+'px',width:widths[2]+'px'})).bindEvent({dragstart:dragstartScrollbar,drag:dragScrollbar,dragpause:dragpauseScrollbar,dragend:dragendScrollbar}).appendTo(that);}
|
||
|
|
function renderTimelines(){Ox.Log('Calendar',self.options.zoom,Math.max(self.options.zoom-4,0))
|
||
|
|
getTimelineElements(self.options.zoom).forEach(function($element){$element.appendTo(self.$scalebar.$element);});getTimelineElements(Math.max(self.options.zoom-4,0)).forEach(function($element){$element.appendTo(self.$scrollbar.$element);});}
|
||
|
|
function scrollBy(delta){scrollTo(self.$container[0].scrollTop
|
||
|
|
+delta*Math.round(self.$container.height()/2),true);}
|
||
|
|
function scrollTo(top,animate){var containerHeight=self.$container.height(),scrollTop=self.$container[0].scrollTop,min=0,max=self.contentHeight-containerHeight,top=Ox.limit(top,min,max),delta=top-scrollTop,ms=250*Math.min(Math.abs(delta)/(containerHeight/2),1);if(animate){self.$container.stop().animate({scrollTop:top},ms);}else{self.$container[0].scrollTop=top;}}
|
||
|
|
function selectEvent(id,$element){var event;self.$content.find('.OxSelected').removeClass('OxSelected');if(id){self.options.selected=id;$element=$element||getEventElementById(id);$element&&$element.addClass('OxSelected');panToSelected();event=Ox.getObjectById(self.options.events,id);setEventControls(event);that.triggerEvent('select',event);}else{if(self.options.selected!==''){self.options.selected='';setEventControls(null);that.triggerEvent('select',{id:''});}}}
|
||
|
|
function setEventControls(event){var $eventControls=that.find('.OxEventControl'),isVisible=self.$eventControls.name.is(':visible');if(event){self.$eventControls.name.options({title:event.name});!isVisible&&$eventControls.show().animate({opacity:1},250);}else{isVisible&&$eventControls.animate({opacity:0},250,function(){$eventControls.hide();});}}
|
||
|
|
function singleclick(data){var $target=$(data.target),id=$target.data('id');if($target.is('.OxLine > .OxEvent')){if(id==self.options.selected){if(data.metaKey){selectEvent('');}else{panToSelected();}}else{selectEvent(id,$target);}}else{selectEvent('');panTo(getMouseDate(data));}}
|
||
|
|
function toggleControls(){}
|
||
|
|
function zoomBy(delta){zoomTo(self.options.zoom+delta);}
|
||
|
|
function zoomTo(zoom){self.options.zoom=Ox.limit(zoom,0,self.maxZoom);self.options.showZoombar&&self.$zoomInput.value(self.options.zoom);renderCalendar();}
|
||
|
|
function zoomToSelected(){if(self.options.selected!==''){var event=getSelectedEvent(),eventDuration=getEventDuration(event),zoom=getZoom();zoom!=self.options.zoom&&zoomTo(zoom);panToSelected();}
|
||
|
|
function getZoom(){var zoom;Ox.loop(self.maxZoom,0,function(z){var calendarDuration=getEventDuration(getCalendarEvent(z));if(calendarDuration>eventDuration){zoom=z;return false;}});return zoom;}}
|
||
|
|
that.addEvent=function(event){event=getEventData(event);self.options.events.push(event);getLines();renderCalendar();selectEvent(event.id);return that;};that.editEvent=function(){var args=Ox.slice(arguments),id=args.shift(),data=Ox.makeObject(args),event=Ox.getObjectById(self.options.events,id),$element=getEventElementById(id);Ox.forEach(data,function(value,key){if($element){Ox.Log('Calendar','ELEMENT',$element,id)
|
||
|
|
if(key=='name'){$element&&$element.html(' '+value+' ');}else if(key=='type'){$element.removeClass('Ox'+Ox.toTitleCase(event[key])).addClass('Ox'+Ox.toTitleCase(value))}else if(key=='end'){$element[value===''?'addClass':'removeClass']('OxCurrent');}}
|
||
|
|
event[key]=value;event=getEventData(event);if($element){getLines();renderCalendar();panToSelected();setEventControls(event);}});return that;};that.getBounds=function(){return getCalendarEvent();};that.panToEvent=function(){panToSelected();return that;};that.removeEvent=function(){Ox.Log('Calendar','REMOVE ... SELF.OPTIONS',self.options)
|
||
|
|
var index=Ox.getIndexById(self.options.events,self.options.selected);self.options.events.splice(index,1);self.options.selected='';getLines();renderCalendar();setEventControls('');return that;};that.resizeCalendar=function(){self.options.width=that.width();self.options.height=that.height();self.options.showZoombar&&self.$zoomInput.options({size:self.options.width});renderCalendar();return that;};that.zoomToEvent=function(){zoomToSelected();return that;};return that;};'use strict';Ox.CalendarEditor=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({addEvent:null,collapsible:false,editEvent:null,events:[],hasMatches:false,height:256,mode:'add',pageLength:100,removeEvent:null,selected:'',showControls:false,sort:[{key:'name',operator:'+'}],width:256}).options(options||{}).update({height:function(){self.$list.size();self.$calendar.resizeCalendar();},width:function(){self.$calendar.resizeCalendar();}}).css({width:self.options.width+'px',height:self.options.height+'px'});self.durationCache={};self.durationSize={86400:10,31622400:12};self.columns=[{format:function(value,data){var eventDuration=(Ox.parseDate(data.end)-Ox.parseDate(data.start))/1000,iconSize=8;Ox.forEach(self.durationSize,function(size,duration){if(eventDuration>duration){iconSize=size;}else{return false;}});return data.type?$('<div>').addClass('OxEvent Ox'+Ox.toTitleCase(data.type)).css({width:iconSize+'px',height:iconSize+'px',margin:[0,0,0,-3].map(function(v){return v+(14-iconSize)/2+'px';}).join(' '),borderRadius:'2px'}):'';},id:'type',operator:'+',title:Ox._('Type'),titleImage:'icon',visible:true,width:16},{format:function(value,data){return data.type?value:$('<span>').addClass('OxWarning').html(value);},id:'name',operator:'+',removable:false,title:Ox._('Name'),visible:true,width:144},{editable:false,format:function(value){return value.join('; ');},id:'alternativeNames',operator:'+',title:Ox._('Alternative Names'),visible:true,width:144},{id:'start',operator:'-',sort:function(value){return Ox.parseDate(value);},title:Ox._('Start'),visible:true,width:144},{id:'end',operator:'-',sort:function(value){return Ox.parseDate(value);},title:Ox._('End'),visible:true,width:144},{format:function(value,data){var key=data.start+' - '+data.end;if(!self.durationCache[key]){self.durationCache[key]=data.start?Ox.formatDateRangeDuration(data.start,data.end,true):'';}
|
||
|
|
return self.durationCache[key];},id:'id',operator:'-',sort:function(value,data){return Ox.parseDate(data.end)-Ox.parseDate(data.start);},title:Ox._('Duration'),visible:true,width:256},{format:function(value){return Ox.encodeHTMLEntities(value);},id:'user',operator:'+',title:Ox._('User'),visible:false,width:96},{format:function(value){return value.replace('T',' ').replace('Z','');},id:'created',operator:'-',title:Ox._('Date Created'),visible:false,width:128},{format:function(value){return value.replace('T',' ').replace('Z','');},id:'modified',operator:'-',title:Ox._('Date Modified'),visible:false,width:128}];self.options.hasMatches&&self.columns.push({align:'right',id:'matches',operator:'-',title:Ox._('Matches'),visible:true,width:64});self.$listToolbar=Ox.Bar({size:24});self.$findElement=Ox.FormElementGroup({elements:[self.$findSelect=Ox.Select({items:[{id:'all',title:Ox._('Find: All')},{id:'name',title:Ox._('Find: Name')},{id:'alternativeNames',title:Ox._('Find: Alternative Names')},],overlap:'right',type:'image'}).bindEvent({change:function(data){var key=data.value,value=self.$findInput.value();value&&updateList(key,value);}}),self.$findInput=Ox.Input({clear:true,placeholder:Ox._('Find in List'),width:234}).bindEvent({submit:function(data){var key=self.$findSelect.value(),value=data.value;updateList(key,value);}})]}).css({float:'right',margin:'4px'}).appendTo(self.$listToolbar);self.$list=Ox.TableList({columns:self.columns,columnsRemovable:true,columnsVisible:true,items:Ox.clone(self.options.events,true),max:1,min:0,pageLength:self.options.pageLength,scrollbarVisible:true,selected:self.options.selected?[self.options.selected]:[],sort:self.options.sort,unique:'id'}).bindEvent({'delete':removeEvent,init:initList,key_0:function(){self.$calendar.panToEvent();},key_equal:function(){self.$calendar.zoom(1);},key_minus:function(){self.$calendar.zoom(-1);},key_shift_0:function(){self.$calendar.zoomToEvent();},load:function(){that.triggerEvent('loadlist');},open:openItem,select:function(data){selectItem(data);}});self.$listStatusbar=Ox.Bar({size:16});self.$status=Ox.Element().css({paddingTop:'2px',margin:'auto',fontSize:'9px',textAlign:'center'}).html(Ox.formatCount(self.options.events,Ox._('Event'),Ox._('Events'))).appendTo(self.$listStatusbar);self.$calendar=Ox.Calendar({date:new Date(0),events:self.options.events.filter(function(event){return!!event.type;}),height:self.options.height,showControls:self.options.showControls,showToolbar:true,showZoombar:true,width:self.options.width-514,zoom:4}).bindEvent({resize:function(data){self.$calendar.resizeCalendar();},select:selectEvent});self.$eventTitlebar=Ox.Bar({size:24});self.$eventTitle=$('<div>').hide().appendTo(self.$eventTitlebar);self.$eventName=Ox.Label({title:'',width:228}).css({float:'left',margin:'4px'}).bindEvent({singleclick:function(){self.$calendar.panToEvent();},doubleclick:function(){self.$calendar.zoomToEvent();}}).appendTo(self.$eventTitle);self.$deselectEventButton=Ox.Button({title:'close',tooltip:Ox._('Done'),type:'image'}).css({float:'left',margin:'4px 4px 4px 0'}).bindEvent({click:function(){self.$list.options({selected:[]});selectItem({ids:[]});}}).appendTo(self.$eventTitle);self.$eventData=Ox.Element();self.$eventForm=Ox.Form({items:[self.$nameInput=Ox.Input({id:'name',label:Ox._('Name'),labelWidth:64,width:240}),self.$alternativeNamesInput=Ox.ArrayInput({id:'alternativeNames',label:Ox._('Alternative Names'),max:10,values:[],width:240}),Ox.Select({id:'type',items:[{id:'date',title:Ox._('Date')},{id:'place',title:Ox._('Place')},{id:'person',title:Ox._('Person')},{id:'other',title:Ox._('Other')}],label:Ox._('Type'),labelWidth:64,width:240}),self.$startInput=Ox.Input({id:'start',label:Ox._('Start'),labelWidth:64,width:240}),self.$endInput=Ox.Input({id:'end',label:Ox._('End'),labelWidth:64,width:240}),self.$durationInput=Ox.Input({disabled:true,id:'durationText',label:Ox._('Duration'),labelWidth:64,width:240})],width:240}).css({margin:'8px'}).hide().bindEvent({change:function(data){var exists=false,values;if(['name','alternativeNames'].indexOf(data.id)>-1){exis
|
||
|
|
if(data.id=='name'){if(!exists){editEvent('name',data.data.value);}else{self.$nameInput.addClass('OxError');}}else if(data.id=='alternativeNames'){if(!exists){editEvent('alternativeNames',data.data.value);}else{self.$alternativeNamesInput.setErrors([exists]);}}else if(data.id=='type'){editEvent('type',data.data.value);}else if(data.id=='start'){editEvent('start',data.data.value);}else if(data.id=='end'){editEvent('end',data.data.value);}}}).appendTo(self.$eventData);if(self.options.hasMatches){self.$matchesInput=Ox.Input({disabled:true,id:'matches',label:Ox._('Matches'),labelWidth:64,type:'int',width:240}).css({margin:'8px'}).hide().appendTo(self.$eventData);}
|
||
|
|
self.$eventStatusbar=Ox.Bar({size:24});self.$removeEventButton=Ox.Button({title:Ox._('Remove Event'),width:90}).css({float:'left',margin:'4px'}).bindEvent({click:removeEvent}).hide().appendTo(self.$eventStatusbar);self.$newEventButton=Ox.Button({title:Ox._('New Event'),width:70}).css({float:'right',margin:'4px'}).bindEvent({click:addEvent}).appendTo(self.$eventStatusbar);if(self.options.mode=='define'){self.$defineEventButton=Ox.Button({title:Ox._('Define Event'),width:80}).css({float:'right',margin:'4px 0 4px 0'}).bindEvent({click:function(){if(this.options('title')==Ox._('Define Event')){defineEvent();}else{clearEvent();}}}).hide().appendTo(self.$eventStatusbar);}
|
||
|
|
that.setElement(Ox.SplitPanel({elements:[{collapsible:self.options.collapsible,element:Ox.SplitPanel({elements:[{element:self.$listToolbar,size:24},{element:self.$list},{element:self.$listStatusbar,size:16}],orientation:'vertical'}),resizable:true,resize:[256,384,512],size:256},{element:self.$calendar},{collapsible:self.options.collapsible,element:Ox.SplitPanel({elements:[{element:self.$eventTitlebar,size:24},{element:self.$eventData},{element:self.$eventStatusbar,size:24}],orientation:'vertical'}).bindEvent({resize:function(data){self.$eventName.options({width:data.size-28});self.$eventForm.options('items').forEach(function($item){$item.options({width:data.size-16});});self.$matchesInput.options({width:data.size-16});}}),resizable:true,resize:[256,384],size:256}],orientation:'horizontal'}).addClass('OxCalendarEditor'));self.options.selected&&self.$list.triggerEvent({select:{ids:[self.options.selected]}});function addEvent(){Ox.Log('Calendar','ADD',self.$calendar.getBounds())
|
||
|
|
var bounds=self.$calendar.getBounds(),middle=+self.$calendar.options('date'),startTime=+new Date((+bounds.startTime+middle)/2),endTime=+new Date((+bounds.endTime+middle)/2),event={},i=1;event.name=Ox._('Untitled');while(nameExists(event.name)){event.name=Ox._('Untitled')+' ['+(++i)+']';};event.alternativeNames=[];event.type='other';event.start=Ox.formatDate(startTime,'%Y-%m-%d %H:%M:%S',true);event.end=Ox.formatDate(endTime,'%Y-%m-%d %H:%M:%S',true);Ox.Log('Calendar',event);self.$newEventButton.options({disabled:true});self.$removeEventButton.options({disabled:true});self.options.addEvent(encodeValues(event),function(result){if(result.status.code=='200'){event.id=result.data.id;event.created=result.data.created;event.modified=result.data.modified;if(self.options.hasMatches){event.matches=result.data.matches;}
|
||
|
|
self.options.events.push(event);self.$list.options({items:Ox.clone(self.options.events,true)});self.$calendar.addEvent(event);selectEvent(event);self.$nameInput.focusInput(true);self.$newEventButton.options({disabled:false});self.$removeEventButton.options({disabled:false});}else{}});}
|
||
|
|
function clearEvent(){var event=Ox.getObjectById(self.options.events,self.options.selected),values={id:self.options.selected,alternativeNames:[],type:'',start:'',end:''};self.$defineEventButton.options({disabled:true,title:Ox._('Clear Event')});self.options.editEvent(encodeValues(values),function(){Ox.forEach(values,function(value,key){self.$list.value(self.options.selected,key,value);});self.$list.reloadList();self.$calendar.removeEvent();self.$eventForm.hide();self.$defineEventButton.options({disabled:false,title:Ox._('Define Event')});});}
|
||
|
|
function decodeValues(place){return Ox.map(place,function(value){var type=Ox.typeOf(value);return type=='string'?Ox.decodeHTMLEntities(value):type=='array'?Ox.map(value,function(value){return decodeValues(value);}):value;});}
|
||
|
|
function defineEvent(){var bounds=self.$calendar.getBounds(),middle=+self.$calendar.options('date'),startTime=+new Date((+bounds.startTime+middle)/2),endTime=+new Date((+bounds.endTime+middle)/2),event=Ox.getObjectById(self.options.events,self.options.selected);event.name=self.$list.value(self.options.selected,'name');event.alternativeNames=[];event.type='other';event.start=Ox.formatDate(startTime,'%Y-%m-%d %H:%M:%S',true);event.end=Ox.formatDate(endTime,'%Y-%m-%d %H:%M:%S',true);self.$list.options({items:Ox.clone(self.options.events,true)});self.$calendar.addEvent(event);self.$defineEventButton.options({title:Ox._('Clear Event')});}
|
||
|
|
function editEvent(key,value){var id=self.selectedEvent,index=Ox.getIndexById(self.options.events,id),data={id:id};data[key]=value;self.options.editEvent(encodeValues(data),function(result){if(result.status.code==200){self.options.events[index][key]=value;if(self.options.hasMatches){self.options.events[index].matches=result.data.matches;}
|
||
|
|
self.$list.options({items:Ox.clone(self.options.events,true)});self.$calendar.editEvent(id,key,value);if(key=='name'){self.$eventName.options({title:value});}else if(['start','end'].indexOf(key)>-1){self.$durationInput.value(Ox.formatDateRangeDuration(self.$startInput.value(),self.$endInput.value()||Ox.formatDate(new Date(),'%Y-%m-%d %H%:%M:%S'),true));}
|
||
|
|
self.options.hasMatches&&self.$matchesInput.value(result.data.matches);self.options.mode=='define'&&self.$removeEventButton.options({disabled:!!result.data.matches});}else{}});}
|
||
|
|
function encodeValues(place){return Ox.map(place,function(value){var type=Ox.typeOf(value);return type=='string'?Ox.encodeHTMLEntities(value):type=='array'?Ox.map(value,function(value){return encodeValues(value);}):value;});}
|
||
|
|
function initList(data){self.$status.html(Ox.formatCount(data.items,Ox._('Event'),Ox._('Events')));}
|
||
|
|
function nameExists(name){var exists=false;Ox.forEach(self.options.events,function(event){if(event.name==name||event.alternativeNames.indexOf(name)>-1){exists=true;return false;}});return exists;}
|
||
|
|
function openItem(data){selectItem(data);self.$calendar.zoomToEvent(data.ids[0]);}
|
||
|
|
function removeEvent(){var id=self.selectedEvent,index=Ox.getIndexById(self.options.events,id);self.$newEventButton.options({disabled:true});self.$removeEventButton.options({disabled:true});self.options.removeEvent({id:id},function(result){if(result.status.code=='200'){selectEvent({});self.options.events.splice(index,1);var time0=+new Date();self.$list.options({items:Ox.clone(self.options.events,true)});Ox.Log('Calendar','TIME TO SET LIST OPTIONS:',+new Date()-time0);self.$calendar.removeEvent();self.$newEventButton.options({disabled:false});self.$removeEventButton.options({disabled:false});}else{}});}
|
||
|
|
function selectEvent(event){var isUndefined=!!self.options.selected&&!self.$list.value(self.options.selected,'type');self.selectedEvent=event.id||'';if(!self.selectedEvent&&isUndefined){}else{self.options.selected=self.selectedEvent;self.$list.options({selected:self.options.selected?[self.options.selected]:[]});selectItem({ids:self.$list.options('selected')},event);}}
|
||
|
|
function selectItem(data,event){var fromCalendar=!!event,isUndefined,selectedEvent;self.options.selected=data.ids.length?data.ids[0]:'';event=event||(self.options.selected?Ox.getObjectById(self.options.events,self.options.selected):{});isUndefined=!fromCalendar&&!!self.options.selected&&!event.type;if(!fromCalendar){selectedEvent=self.options.selected&&!isUndefined?self.options.selected:'';self.$calendar.options({selected:selectedEvent});selectedEvent&&self.$calendar.panToEvent();}
|
||
|
|
if(self.options.selected){self.$eventName.options({title:event.name||''});self.$eventTitle.show();if(!isUndefined){self.$eventForm.values(decodeValues(Ox.extend({},event,{end:event.current?'':event.end,durationText:Ox.formatDateRangeDuration(event.start,event.end,true)}))).show();}else{self.$eventForm.hide();}
|
||
|
|
self.options.hasMatches&&self.$matchesInput.value(event.matches||0).show();self.options.mode=='define'&&self.$defineEventButton.options({disabled:!event.matches,title:isUndefined?'Define Event':'Clear Event'}).show();self.$removeEventButton.options({disabled:self.options.mode=='define'&&!!event.matches}).show();}else{self.$eventTitle.hide();self.$eventForm.hide();self.options.hasMatches&&self.$matchesInput.hide();self.options.mode=='define'&&self.$defineEventButton.hide();self.$removeEventButton.hide();}}
|
||
|
|
function updateList(key,value){var events;if(value===''){events=Ox.clone(self.options.events);}else{events=[];self.options.events.forEach(function(event){if((['all','name'].indexOf(key)>-1&&event.name.toLowerCase().indexOf(value)>-1)||(['all','alternativeNames'].indexOf(key)>-1&&event.alternativeNames.join('\n').toLowerCase().indexOf(value)>-1)){events.push(event)}});}
|
||
|
|
self.$list.options({items:events});}
|
||
|
|
return that;};'use strict';Ox.API=function(options,callback){var self={options:Ox.extend({timeout:60000,type:'POST',url:'/api/'},options||{}),time:new Date()},that={api:function(callback){return Ox.Request.send({url:self.options.url,data:{action:'api'},callback:callback});},cancel:function(id){Ox.Request.cancel(id);}};$.ajaxSetup({timeout:self.options.timeout,type:self.options.type,url:self.options.url});that.api(function(result){Ox.forEach(result.data.actions,function(val,key){that[key]=function(){var data={},age=-1,callback=null;Ox.forEach(arguments,function(argument){var type=Ox.typeOf(argument);if(type=='object'){data=argument;}else if(type=='number'){age=argument;}else if(type=='function'){callback=argument;}});return Ox.Request.send(Ox.extend({age:age,callback:callback,data:{action:key,data:JSON.stringify(data)},url:self.options.url},!val.cache?{age:0}:{}));};});callback&&callback(that);});return that;};'use strict';Ox.App=function(options){var self={options:Ox.extend({name:'App',socket:'',timeout:60000,type:'POST',url:'/api/'},options||{}),time:new Date()},that=Ox.Element({},Ox.extend({},self));that.api=Ox.API({type:self.options.type,timeout:self.options.timeout,url:self.options.url},function(){that.api.init(getUserData(),function(result){that.triggerEvent({load:result.data});});});self.options.socket&&connectSocket();that.localStorage=Ox.localStorage(self.options.name);function connectSocket(){that.socket=new WebSocket(self.options.socket);that.socket.onopen=function(event){that.triggerEvent('open',event);};that.socket.onmessage=function(event){var data=JSON.parse(event.data);that.triggerEvent(data[0],data[1]);};that.socket.onerror=function(event){that.triggerEvent('error',event);that.socket.close();};that.socket.onclose=function(event){that.triggerEvent('close',event);setTimeout(connectSocket,1000);};}
|
||
|
|
function getUserData(){return{document:{referrer:document.referrer},history:{length:history.length},location:{href:location.href},navigator:{cookieEnabled:navigator.cookieEnabled,plugins:Ox.slice(navigator.plugins).map(function(plugin){return plugin.name;}),userAgent:navigator.userAgent},screen:screen,time:(+new Date()-self.time)/1000,window:{innerHeight:window.innerHeight,innerWidth:window.innerWidth,outerHeight:window.outerHeight,outerWidth:window.outerWidth,screenLeft:window.screenLeft,screenTop:window.screenTop}};}
|
||
|
|
function update(){}
|
||
|
|
that.options=function(){return Ox.getset(self.options,arguments,update,that);};return that;};'use strict';Ox.Clipboard=function(){var clipboard={items:[],type:void 0},$element;return{_print:function(){Ox.print(JSON.stringify(clipboard));},add:function(items,type){items=Ox.makeArray(items);if(items.length){if(type!=clipboard.type){Ox.Clipboard.clear();}
|
||
|
|
clipboard={items:Ox.unique(clipboard.items.concat(items)),type:type};$element&&$element.triggerEvent('add');}
|
||
|
|
return clipboard.items.length;},bindEvent:function(){if(!$element){$element=Ox.Element();}
|
||
|
|
$element.bindEvent.apply($element,arguments);},clear:function(){clipboard={items:[],type:void 0};$element&&$element.triggerEvent('clear');return clipboard.items.length;},copy:function(items,type){items=Ox.makeArray(items);if(items.length){clipboard={items:items,type:type};$element&&$element.triggerEvent('copy');}
|
||
|
|
return clipboard.items.length;},items:function(type){return!type||type==clipboard.type?clipboard.items.length:0;},paste:function(type){$element&&$element.triggerEvent('paste');return!type||type==clipboard.type?clipboard.items:[];},type:function(){return clipboard.type;},unbindEvent:function(){$element&&$element.unbindEvent.apply($element,arguments);}};};'use strict';Ox.Container=function(options,self){var that=Ox.Element({},self).options(options||{}).addClass('OxContainer');that.$content=Ox.Element({}).options(options||{}).addClass('OxContent').appendTo(that);return that;};Ox.Cookies=function(){var name,value,cookies;if(arguments.length==1){name=arguments[0];return Ox.Cookies()[name];}else if(arguments.length==2){name=arguments[0];value=arguments[1];document.cookie=name+'='+encodeURIComponent(value);}else{value={}
|
||
|
|
if(document.cookie&&document.cookie!=''){document.cookie.split('; ').forEach(function(cookie){name=cookie.split('=')[0];value[name]=Ox.decodeURIComponent(cookie.substring(name.length+1));});}
|
||
|
|
return value;}}
|
||
|
|
'use strict';(function(_){var noTooltipEvents={};var supportsPassive=false;try{var opts=Object.defineProperty({},'passive',{get:function(){supportsPassive=true;}});window.addEventListener("test",null,opts);}catch(e){}
|
||
|
|
Ox.Element=function Element(options,self){self=self||{};self.boundTooltipEvents=noTooltipEvents;self.defaults={};self.eventCallbacks=self.eventCallbacks||{};self.options=Ox.isString(options)?{element:options}:options||{};self.unbindKeyboard=function unbindKeyboard(){Object.keys(self.eventCallbacks).filter(function(event){return/^key([\._][\w\.]+)?$/.test(event);}).forEach(function(event){that.unbindEvent(event);});};self.update=function update(key,value){Ox.loop(self.updateCallbacks.length-1,-1,-1,function(index){return self.updateCallbacks[index](key,value)!==false;});};self.updateCallbacks=self.updateCallbacks||[];var that=Object.create(Ox.Element.prototype);that.oxid=Ox.uid();that.$element=$(self.options.element||'<div>').addClass('OxElement').data({oxid:that.oxid}).on({mousedown:onMousedown,mousewheel:onMousewheel,});that.$element[0].addEventListener('touchend',onTouchend,supportsPassive?{passive:true}:false);that.$element[0].addEventListener('touchmove',onTouchmove,supportsPassive?{passive:true}:false);that.$element[0].addEventListener('touchstart',onTouchstart,supportsPassive?{passive:true}:false);that[0]=that.$element[0];that.length=1;that.self=function _self(){return arguments[0]===_?self:{};};Ox.$elements[that.oxid]=that;if(self.options.element=='<iframe>'){self.messageCallbacks=self.messageCallbacks||{};that.on({load:function init(){if(that.attr('src')){that.postMessage({init:{oxid:that.oxid}});self.initTime=self.initTime||+new Date();if(+new Date()<self.initTime+60000){self.initTimeout=setTimeout(init,250);}}}}).bindEvent({init:function(){clearTimeout(self.initTimeout);}});}
|
||
|
|
var constantTooltipEvents={mouseenter:onMouseenter,mouseleave:onMouseleave},dynamicTooltipEvents={mousemove:onMousemove,mouseleave:onMouseleave};setTooltip();function bindTooltipEvents(events){if(self.boundTooltipEvents!==events){that.off(self.boundTooltipEvents).on(events);self.boundTooltipEvents=events;}}
|
||
|
|
function getTouchData(e){var data={};if(e&&e.changedTouches&&e.changedTouches.length){data.clientX=e.changedTouches[0].clientX;data.clientY=e.changedTouches[0].clientY;}else{data.clientX=e.pageX;data.clientY=e.pageY;}
|
||
|
|
return data;}
|
||
|
|
function onMousedown(e){var clientX,clientY,dragTimeout=0,mouseInterval=0;that.triggerEvent('mousedown',e);if(!self._mouseTimeout){self._drag=false;self._mouseup=false;self._mouseTimeout=setTimeout(function(){self._mouseTimeout=0;if(self._mouseup){that.triggerEvent('singleclick',e);}else{mouserepeat();mouseInterval=setInterval(mouserepeat,50);that.one('mouseleave',function(){clearInterval(mouseInterval);});that.triggerEvent('dragstart',e);$('.OxElement').live({mouseenter:dragenter,mouseleave:dragleave});clientX=e.clientX;clientY=e.clientY;Ox.$window.off('mouseup',mouseup).on({mousemove:mousemove}).one('mouseup',function(e){clearInterval(mouseInterval);clearTimeout(dragTimeout);Ox.$window.off({mousemove:mousemove});$('.OxElement').off({mouseenter:dragenter,mouseleave:dragleave});that.triggerEvent('dragend',extend(e));});self._drag=true;}},250);}else{clearTimeout(self._mouseTimeout);self._mouseTimeout=0;that.triggerEvent('doubleclick',e);}
|
||
|
|
Ox.$window.one({mouseup:mouseup});function dragenter(e){that.triggerEvent('dragenter',extend(e));}
|
||
|
|
function dragleave(e){that.triggerEvent('dragleave',extend(e));}
|
||
|
|
function extend(e){return Ox.extend({clientDX:e.clientX-clientX,clientDY:e.clientY-clientY},e);}
|
||
|
|
function mousemove(e){e=extend(e);clearTimeout(dragTimeout);dragTimeout=setTimeout(function(){that.triggerEvent('dragpause',e);},250);that.triggerEvent('drag',e);}
|
||
|
|
function mouserepeat(e){that.triggerEvent('mouserepeat',e);}
|
||
|
|
function mouseup(e){if(!self._mouseup&&!self._drag){that.triggerEvent('anyclick',e);self._mouseup=true;}}}
|
||
|
|
function onMouseenter(e){if(!that.$tooltip){that.$tooltip=Ox.Tooltip({title:self.options.tooltip});}
|
||
|
|
that.$tooltip.show(e);}
|
||
|
|
function onMouseleave(e){that.$tooltip&&that.$tooltip.hide();}
|
||
|
|
function onMousemove(e){that.$tooltip.options({title:self.options.tooltip(e)}).show(e);}
|
||
|
|
function onMousewheel(e){e=e.originalEvent;var absDelta,deltaX='deltaX'in e?e.deltaX:'wheelDeltaX'in e?-e.wheelDeltaX:0,deltaY='deltaY'in e?-e.deltaY:'wheelDeltaY'in e?e.wheelDeltaY:'wheelDelta'in e?e.wheelDelta:0;if('axis'in e&&e.axis===e.HORIZONTAL_AXIS){deltaX=-deltaY;deltaY=0;}
|
||
|
|
if(deltaX||deltaY){absDelta=Math.max(Math.abs(deltaY),Math.abs(deltaX));if(!self._deltaFactor||self._deltaFactor>absDelta){self._deltaFactor=absDelta;}
|
||
|
|
that.triggerEvent('mousewheel',Ox.extend($.event.fix(e),{deltaFactor:self._deltaFactor,deltaX:Ox.trunc(deltaX/self._deltaFactor),deltaY:Ox.trunc(deltaY/self._deltaFactor)}));clearTimeout(self._deltaTimeout)
|
||
|
|
self._deltaTimeout=setTimeout(function(){self._deltaFactor=null;},200);}}
|
||
|
|
function onTouchend(e){var data=getTouchData(e);that.triggerEvent('touchend',Ox.extend(e,data));}
|
||
|
|
function onTouchmove(e){var data=getTouchData(e);that.triggerEvent('touchmove',Ox.extend(e,data));}
|
||
|
|
function onTouchstart(e){var data=getTouchData(e);that.triggerEvent('touchstart',Ox.extend(e,data));}
|
||
|
|
function setTooltip(){if(self.options.tooltip){if(Ox.isString(self.options.tooltip)){bindTooltipEvents(constantTooltipEvents);that.$tooltip&&that.$tooltip.options({title:self.options.tooltip,animate:true});}else{that.$tooltip=Ox.Tooltip({animate:false});bindTooltipEvents(dynamicTooltipEvents);}}else{if(that.$tooltip){that.$tooltip.remove();}
|
||
|
|
bindTooltipEvents(noTooltipEvents);}}
|
||
|
|
that.update({tooltip:setTooltip});return that;};Ox.methods($('<div>'),true).forEach(function(method){Ox.Element.prototype[method]=function(){var ret=this.$element[method].apply(this.$element,arguments),oxid;return ret&&ret.jquery&&ret.length==1&&Ox.$elements[oxid=ret.data('oxid')]?Ox.$elements[oxid]:ret;};});Ox.Element.prototype.bindEvent=function bindEvent(){Ox.Event.bind.apply(this,[this.self(_)].concat(Ox.slice(arguments)));return this;};Ox.Element.prototype.bindEventOnce=function bindEventOnce(){Ox.Event.bindOnce.apply(this,[this.self(_)].concat(Ox.slice(arguments)));return this;};Ox.Element.prototype.bindMessage=Ox.Element.prototype.onMessage=function bindMessage(){var self=this.self(_);if(self.options.element=='<iframe>'){Ox.Message.bind.apply(this,[self].concat(Ox.slice(arguments)));}
|
||
|
|
return this;};Ox.Element.prototype.bindMessageOnce=Ox.Element.prototype.onMessageOnce=function bindMessageOnce(){var self=this.self(_);if(self.options.element=='<iframe>'){Ox.Message.bindOnce.apply(this,[self].concat(Ox.slice(arguments)));}
|
||
|
|
return this;};Ox.Element.prototype.childrenElements=function childrenElements(){return Ox.compact(Ox.slice(this.children()).filter(Ox.UI.isElement).map(Ox.UI.getElement));};Ox.Element.prototype.defaults=function defaults(){var self=this.self(_);var ret;if(arguments.length==0){ret=self.defaults;}else if(Ox.isString(arguments[0])){ret=self.defaults[arguments[0]];}else{self.defaults=Ox.makeObject(arguments);self.options=Ox.clone(self.defaults);ret=this;}
|
||
|
|
return ret;};Ox.Element.prototype.empty=function empty(){this.childrenElements().forEach(function($element){$element.removeElement();});this.$element.empty.apply(this,arguments);return this;};Ox.Element.prototype.findElements=function findElements(){return Ox.compact(Ox.slice(this.find('.OxElement')).map(Ox.UI.getElement));};Ox.Element.prototype.gainFocus=function gainFocus(){Ox.Focus.gainFocus(this);return this;};Ox.Element.prototype.hasFocus=function hasFocus(){return Ox.Focus.focusedElement()===this;};Ox.Element.prototype.html=function html(){var ret;this.childrenElements().forEach(function($element){$element.removeElement();});ret=this.$element.html.apply(this,arguments);return arguments.length==0?ret:this;};Ox.Element.prototype.loseFocus=function loseFocus(){Ox.Focus.loseFocus(this);return this;};Ox.Element.prototype.nextElement=function nextElement(){return this.nextElements()[0];};Ox.Element.prototype.nextElements=function nextElements(){return Ox.compact(this.nextAll().filter(Ox.UI.isElement).map(Ox.UI.getElement));};Ox.Element.prototype.options=function options(){var self=this.self(_);return Ox.getset(self.options,arguments,self.update,this);};Ox.Element.prototype.parentElement=function parentElement(){return Ox.last(this.parentElements());};Ox.Element.prototype.parentElements=function parentElements(){return Ox.compact(Ox.slice(this.parents()).filter(Ox.UI.isElement).map(Ox.UI.getElement));};Ox.Element.prototype.postMessage=function postMessage(event,data){if(this.self(_).options.element=='<iframe>'){Ox.Message.post.apply(this,Ox.slice(arguments));}
|
||
|
|
return this;};Ox.Element.prototype.prevElement=function prevElement(){return Ox.last(this.prevElements());};Ox.Element.prototype.prevElements=function prevElements(){return Ox.compact(this.prevAll().filter(Ox.UI.isElement).map(Ox.UI.getElement));};Ox.Element.prototype.remove=function remove(){var parent=this[0].parentNode;this.removeElement();parent&&parent.removeChild(this[0]);return this;};Ox.Element.prototype.removeElement=function removeElement(includeChildren){if(includeChildren!==false){this.findElements().forEach(function($element){if(!$element){Ox.print('*** Found undefined descendant element,'
|
||
|
|
+' this should never happen. ***');return;}
|
||
|
|
$element.removeElement(false);});}
|
||
|
|
Ox.Focus.removeElement(this.oxid);this.self(_).unbindKeyboard();this.$tooltip&&this.$tooltip.remove();delete Ox.$elements[this.oxid];delete Ox.$elements[this.$element.oxid];return this;};Ox.Element.prototype.replace=function replace(){arguments[0].removeElement();this.$element.replace.apply(this.$element,arguments);return this;};Ox.Element.prototype.replaceWith=function replaceWith(){this.removeElement();this.$element.replaceWith.apply(this.$element,arguments);return this;};Ox.Element.prototype.setElement=function setElement($element){this.findElements().forEach(function($element){$element.removeElement(false);});this.$element.replaceWith($element);if($element.$element){this.$element=$element.$element;this.$element.oxid=$element.oxid;this.$newElement=$element;}else{this.$element=$element;}
|
||
|
|
this.$element.addClass('OxElement').data({oxid:this.oxid});this[0]=$element[0];return this;};Ox.Element.prototype.siblingElements=function siblingElements(){return Ox.compact(Ox.slice(this.siblings()).filter(Ox.UI.isElement).map(Ox.UI.getElement));};Ox.Element.prototype.text=function text(){var ret;this.childrenElements().forEach(function($element){$element.removeElement();});ret=this.$element.text.apply(this,arguments);return arguments.length==0?ret:this;};Ox.Element.prototype.toggleOption=function toggleOption(){var options={},self=this.self(_);Ox.slice(arguments).forEach(function(key){options[key]==!self.options[key];});return this.options(options);};Ox.Element.prototype.triggerEvent=function triggerEvent(){Ox.Event.trigger.apply(this,[this.self(_)].concat(Ox.slice(arguments)));return this;};Ox.Element.prototype.triggerMessage=function triggerMessage(){var self=this.self(_);if(self.options.element=='<iframe>'){Ox.Message.trigger.apply(this,[self].concat(Ox.slice(arguments)));}
|
||
|
|
return this;};Ox.Element.prototype.unbindEvent=function unbindEvent(){Ox.Event.unbind.apply(this,[this.self(_)].concat(Ox.slice(arguments)));return this;};Ox.Element.prototype.unbindMessage=function unbindMessage(){var self=this.self(_);if(self.options.element=='<iframe>'){Ox.Message.unbind.apply(this,[self].concat(Ox.slice(arguments)));}
|
||
|
|
return this;};Ox.Element.prototype.update=function update(){var callbacks,self=this.self(_);if(Ox.isFunction(arguments[0])){self.updateCallbacks.push(arguments[0]);}else{callbacks=Ox.makeObject(arguments);self.updateCallbacks.push(function(key,value){if(callbacks[key]){return callbacks[key](value);}});}
|
||
|
|
return this;};Ox.Element.prototype.value=function value(){return this.options(arguments.length==0?'value':{value:arguments[0]});};}({}));(function(){var chars={comma:',',dot:'.',minus:'-',quote:'\'',semicolon:';',slash:'/',space:' '},keyboardCallbacks={},keyboardEventRegExp=/^key(\.[\w\d.]+)?$/,keys='',keysEventRegExp=new RegExp('^[\\w\\d](\\.numpad)?$|^('+Object.keys(chars).join('|')+')$'),resetTimeout,triggerTimeout;function bind(options){var args=Ox.slice(arguments,1),callbacks=options.callbacks,that=this,oxid=that.oxid||0;Ox.forEach(Ox.isFunction(args[0])?{'*':args[0]}:Ox.makeObject(args),function(originalCallback,event){event=event.replace(/^key_/,'key.');callbacks[event]=(callbacks[event]||[]).concat(options.once?function callback(){unbind.call(that,{callbacks:callbacks},event,callback);return originalCallback.apply(null,arguments);}:originalCallback);if(isKeyboardEvent(event)){keyboardCallbacks[oxid]=(keyboardCallbacks[oxid]||[]).concat(event);}});return this;}
|
||
|
|
function isKeyboardEvent(event){return keyboardEventRegExp.test(event);}
|
||
|
|
function isKeysEventKey(key){return keysEventRegExp.test(key);}
|
||
|
|
function onMessage(e){var element,message={};try{message=Ox.extend({data:{}},JSON.parse(e.data));}catch(e){}
|
||
|
|
if(message.event=='init'){if(message.data.oxid){Ox.oxid=message.data.oxid;Ox.$parent.postMessage('init',{})}else if(message.target){Ox.$elements[message.target].triggerEvent('init');}}else{(message.target?Ox.$elements[message.target]:Ox.$parent).triggerMessage(message.event,message.data);}}
|
||
|
|
function onKeydown(e){var $element=Ox.Focus.focusedElement(),isInput=Ox.Focus.focusedElementIsInput(),keyName=Ox.KEYS[e.keyCode]||('keyCode'+e.keyCode),keyBasename=keyName.split('.')[0],key=Object.keys(Ox.MODIFIER_KEYS).filter(function(key){return e[key]&&Ox.MODIFIER_KEYS[key]!=keyBasename;}).map(function(key){return Ox.MODIFIER_KEYS[key];}).concat(keyName).join('_'),event='key.'+key,triggerEvent=function(){if($element){$element.triggerEvent.apply($element,arguments);}else if(!isInput){Ox.Event.trigger.apply(Ox.$body,[{}].concat(Ox.slice(arguments)));}};triggerEvent(event,e);if(!isInput){if(isKeysEventKey(key)){if(keyName!='space'||(keys!=''&&!Ox.endsWith(keys,' '))){keys+=chars[keyName]||keyBasename;clearTimeout(triggerTimeout);triggerTimeout=setTimeout(function(){triggerEvent('keys',Ox.extend(e,{keys:keys}));},250);}}
|
||
|
|
clearTimeout(resetTimeout);resetTimeout=setTimeout(function(){keys='';},1000);if((keyboardCallbacks[0]&&Ox.contains(keyboardCallbacks[0],event))||($element&&keyboardCallbacks[$element.oxid]&&Ox.contains(keyboardCallbacks[$element.oxid],event))){e.preventDefault();}}}
|
||
|
|
function trigger(options){var args=Ox.slice(arguments,1),callbacks=options.callbacks,that=this;Ox.forEach(Ox.makeObject(args),function(data,originalEvent){var events=originalEvent.split('.'),triggerGlobally=!isKeyboardEvent(originalEvent)||!Ox.Focus.focusedElementIsInput();['*'].concat(events.map(function(event,index){return events.slice(0,index+1).join('.');})).forEach(function(event){(triggerGlobally?callbacks[0][event]||[]:[]).concat(callbacks[1][event]||[]).forEach(function(callback){callback.call(that,data,originalEvent,that);});});});return this;}
|
||
|
|
function unbind(options){var args=Ox.slice(arguments,1),callbacks=options.callbacks,oxid=this.oxid||0;if(args.length==0){callbacks=[];}else{Ox.forEach(Ox.isFunction(args[0])?{'*':args[0]}:Ox.makeObject(args),function(callback,event){if(!callback){delete callbacks[event];}else if(callbacks[event]){callbacks[event]=callbacks[event].filter(function(eventCallback){return eventCallback!==callback;});if(callbacks[event].length==0){delete callbacks[event];}}
|
||
|
|
if(isKeyboardEvent(event)){var index=keyboardCallbacks[oxid].indexOf(event);keyboardCallbacks[oxid].splice(keyboardCallbacks[oxid].indexOf(event),1)
|
||
|
|
if(keyboardCallbacks[oxid].length==0){delete keyboardCallbacks[oxid];}}});}
|
||
|
|
return this;}
|
||
|
|
Ox.$parent=(function(){var self={messageCallbacks:{}},that={oxid:Ox.uid()};that.bindMessage=function(){return Ox.Message.bind.apply(this,[self].concat(Ox.slice(arguments)));};that.bindMessageOnce=function(){return Ox.Message.bindOnce.apply(this,[self].concat(Ox.slice(arguments)));};that.postMessage=function(){if(window!==window.top){if(!Ox.oxid){self.initTime=self.initTime||new Date();if(new Date()<self.initTime+60000){setTimeout(function(){that.postMessage.apply(that,arguments);},250);}}else{return Ox.Message.post.apply(this,arguments);}}};that.triggerMessage=function(){return Ox.Message.trigger.apply(this,[self].concat(Ox.slice(arguments)));};that.unbindMessage=function(){return Ox.Message.unbind.apply(this,[self].concat(Ox.slice(arguments)));};return that;}());Ox.Event=(function(){var callbacks={},that={};that.bind=function(){var isElement=this!==that;return bind.apply(this,[{callbacks:isElement?arguments[0].eventCallbacks:callbacks}].concat(Ox.slice(arguments,isElement?1:0)));};that.bindOnce=function(){var isElement=this!==that;return bind.apply(this,[{callbacks:isElement?arguments[0].eventCallbacks:callbacks,once:true}].concat(Ox.slice(arguments,isElement?1:0)));};that.trigger=function(){var isElement=this!==that;return trigger.apply(this,[{callbacks:[callbacks,isElement?arguments[0].eventCallbacks||{}:{}]}].concat(Ox.slice(arguments,isElement?1:0)));};that.unbind=function(){var isElement=this!==that;return unbind.apply(this,[{callbacks:isElement?arguments[0].eventCallbacks:callbacks}].concat(Ox.slice(arguments,isElement?1:0)));};return that;}());Ox.Message=(function(){var callbacks={},that={};that.bind=function(){var isElement=this!==that;return bind.apply(this,[{callbacks:isElement?arguments[0].messageCallbacks:callbacks}].concat(Ox.slice(arguments,isElement?1:0)));};that.bindOnce=function(){var isElement=this!==that;return bind.apply(this,[{callbacks:isElement?arguments[0].messageCallbacks:callbacks,once:true}].concat(Ox.slice(arguments,isElement?1:0)));};that.post=function(){var isParent=this==Ox.$parent,target=isParent?window.parent:this[0].contentWindow;Ox.forEach(Ox.makeObject(Ox.slice(arguments)),function(data,event){target.postMessage(JSON.stringify({data:data,event:event,target:isParent?Ox.oxid:null}),'*');});return this;};that.trigger=function(){var isElement=this!==that;return trigger.apply(this,[{callbacks:[callbacks,isElement?arguments[0].messageCallbacks||{}:{}]}].concat(Ox.slice(arguments,isElement?1:0)));};that.unbind=function(){var isElement=this!==that;return unbind.apply(this,[{callbacks:isElement?arguments[0].messageCallbacks:callbacks}].concat(Ox.slice(arguments,isElement?1:0)));};return that;}());document.addEventListener('keydown',onKeydown);window.addEventListener('message',onMessage);}());'use strict';Ox.Focus=(function(){var stack=[],that={cleanup:function(){stack=stack.filter(function(item){try{return!!Ox.$elements[item]}catch(e){return false;}});},debug:function(){return stack.map(function(item){try{return Ox.$elements[item][0];}catch(e){return item;}});},focusedElement:function(){return Ox.$elements[Ox.last(stack)];},focusedElementIsInput:function(){var $element=that.focusedElement();return $element&&$element.hasClass('OxKeyboardFocus');},gainFocus:function($element){var $focusedElement=that.focusedElement(),oxid=$element.oxid,index=stack.indexOf(oxid);if(index==-1||index<stack.length-1){stack=$element.parentElements().map(function($element){return $element.oxid;}).concat(oxid);if($focusedElement){try{$focusedElement.removeClass('OxFocus').triggerEvent('losefocus');}catch(e){that.cleanup();}}
|
||
|
|
try{$element.addClass('OxFocus').triggerEvent('gainfocus');}catch(e){that.cleanup();}}},hasFocus:function($element){return Ox.last(stack)==$element.oxid;},loseFocus:function($element){var $focusedElement,index=stack.indexOf($element.oxid);if(index>-1&&index==stack.length-1){stack.pop();try{$element.removeClass('OxFocus').triggerEvent('losefocus');}catch(e){that.cleanup();}
|
||
|
|
$focusedElement=that.focusedElement();if(stack.length){if($focusedElement){try{$focusedElement.addClass('OxFocus').triggerEvent('gainfocus');}catch(e){that.cleanup();}}}}},removeElement:function($element){var index=stack.indexOf($element.oxid);if(index==stack.length-1){that.loseFocus($element);}else if(index>-1){stack.splice(index,1);}}};return that;}());'use strict';Ox.Fullscreen=(function(){var documentElement=document.body,enter=document.body.requestFullscreen||document.body.mozRequestFullScreen||document.body.webkitRequestFullscreen,exit=document.exitFullscreen||document.mozCancelFullScreen||document.webkitExitFullscreen,state='fullscreen'in document?'fullscreen':'mozFullScreen'in document?'mozFullScreen':'webkitIsFullScreen'in document?'webkitIsFullScreen':void 0,handlers={'':{'change':[],'enter':[],'exit':[]},'once':{'change':[],'enter':[],'exit':[]}},types=Object.keys(handlers),that={};['fullscreenchange','mozfullscreenchange','webkitfullscreenchange'].forEach(function(originalEvent){document.addEventListener(originalEvent,change);});function bind(event,handler,once){var type=once?'once':'';if(handlers[type][event]&&handlers[type][event].indexOf(handler)==-1){handlers[type][event].push(handler);}}
|
||
|
|
function change(){var state=that.getState(),events=['change'].concat(state?'enter':'exit'),unbind=[];types.forEach(function(type){events.forEach(function(event){handlers[type][event].forEach(function(handler){event=='change'?handler(state):handler();type=='once'&&unbind.push({event:event,handler:handler});});});});unbind.forEach(function(value){that.unbind(value.event,value.handler,true);});};function unbind(event,handler,once){var index;[once?['once']:types].forEach(function(type){if(handlers[type][event]){while((index=handlers[type][event].indexOf(handler))>-1){handlers[type][event].splice(index,1);}}});}
|
||
|
|
that.available=document.fullscreenEnabled||document.webkitFullscreenEnabled||document.mozFullScreenEnabled||false;that.bind=function(event,handler){bind(event,handler);};that.bindOnce=function(event,handler){bind(event,handler,true);};that.enter=function(element){var element=element||document.body;if(element.requestFullscreen){element.requestFullscreen();}else if(element.mozRequestFullScreen){element.mozRequestFullScreen();}else if(element.webkitRequestFullscreen){element.webkitRequestFullscreen();}
|
||
|
|
that.element=element};that.exit=function(){if(document.exitFullscreen){document.exitFullscreen();}else if(document.mozCancelFullScreen){document.mozCancelFullScreen();}else if(document.webkitExitFullscreen){document.webkitExitFullscreen()}
|
||
|
|
delete that.element};that.getState=function(){return document[state];};that.toggle=function(){var state=that.getState();if(state===false){that.enter();}else if(state===true){that.exit();}};that.unbind=function(event,handler){unbind(event,handler);};return that;}());'use strict';Ox.GarbageCollection=(function(){var that={},timeout;that.collect=function(){var len=Ox.len(Ox.$elements);Object.keys(Ox.$elements).forEach(function(id){var $element=Ox.$elements[id];if($element&&Ox.isUndefined($element.data('oxid'))){$element.remove();delete Ox.$elements[id];}});timeout&&clearTimeout(timeout);timeout=setTimeout(that.collect,60000);Ox.Log('GC',len,'-->',Ox.len(Ox.$elements));};that.debug=function(){var classNames={},sorted=[];Ox.forEach(Ox.$elements,function($element,id){var className=$element[0].className;classNames[className]=(classNames[className]||0)+1;});Ox.forEach(classNames,function(count,className){sorted.push({className:className,count:count});});return sorted.sort(function(a,b){return a.count-b.count;}).map(function(v){return v.count+' '+v.className}).join('\n');};setTimeout(that.collect,60000);return that;}());'use strict';Ox.History=function(options){options=Ox.extend({text:function(item){return item.text;}},options||{});var history=[],position=0,$element;return{_print:function(){Ox.print(JSON.stringify({history:history,position:position}));},add:function(items){items=Ox.makeArray(items);history=history.slice(0,position).concat(items);position+=items.length;$element&&$element.triggerEvent('add');return history.length;},bindEvent:function(){if(!$element){$element=Ox.Element();}
|
||
|
|
$element.bindEvent.apply($element,arguments);},clear:function(){history=[];position=0;$element&&$element.triggerEvent('clear');return history.length;},items:function(){return history.length;},redo:function(){if(position<history.length){position++;$element&&$element.triggerEvent('redo');return history[position-1];}},redoText:function(){if(position<history.length){return options.text(history[position]);}},remove:function(test){},unbindEvent:function(){$element&&$element.unbindEvent.apply($element,arguments);},undo:function(){if(position>0){position--;$element&&$element.triggerEvent('undo');return history[position];}},undoText:function(){if(position>0){return options.text(history[position-1]);}}};};'use strict';Ox.LoadingIcon=function(options,self){self=self||{};var that=Ox.Element('<img>',self).defaults({size:16,video:false}).options(options||{}).addClass('OxLoadingIcon').attr({src:Ox.UI.getImageURL('symbolLoading',self.options.video?'videoIcon':null)});Ox.isNumber(self.options.size)?that.css({width:self.options.size,height:self.options.size}):that.addClass('Ox'+Ox.toTitleCase(self.options.size));that.start=function(callback){var css,deg=0,previousTime=+new Date();function step(){var currentTime=+new Date(),delta=(currentTime-previousTime)/1000,next=Math.round((deg+delta*360)%360/30)*30;if(deg!=next){previousTime=currentTime;deg=next;css='rotate('+deg+'deg)';that.css({MozTransform:css,MsTransform:css,OTransform:css,WebkitTransform:css,transform:css});}
|
||
|
|
if(!self.stopping&&!Ox.isUndefined(window.requestAnimationFrame)){self.loadingInterval=window.requestAnimationFrame(step);}}
|
||
|
|
if(!self.loadingInterval){if(Ox.isUndefined(window.requestAnimationFrame)){self.loadingInterval=setInterval(step,83);}else{self.loadingInterval=window.requestAnimationFrame(step);}
|
||
|
|
that.animate({opacity:1},250,function(){callback&&callback();});}
|
||
|
|
return that;};that.stop=function(callback){if(self.loadingInterval&&!self.stopping){self.stopping=true;that.animate({opacity:0},250,function(){var css='rotate(0deg)';if(Ox.isUndefined(window.cancelAnimationFrame)){clearInterval(self.loadingInterval);}else{window.cancelAnimationFrame(self.loadingInterval);}
|
||
|
|
self.loadingInterval=null;self.stopping=false;that.css({MozTransform:css,MsTransform:css,OTransform:css,WebkitTransform:css,transform:css});callback&&callback();});}
|
||
|
|
return that;};return that;};'use strict';Ox.LoadingScreen=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({height:0,size:32,text:'',width:0}).options(options||{}).update({height:function(){!self.isAuto&&setSizes();},text:function(){self.$text&&self.$text.html(self.options.text);},width:function(){!self.isAuto&&setSizes();}}).addClass('OxLoadingScreen');self.isAuto=!self.options.width&&!self.options.height;self.isAuto&&that.addClass('OxAuto')
|
||
|
|
self.$box=$('<div>').appendTo(that);setSizes();self.$loadingIcon=Ox.LoadingIcon({size:self.options.size}).appendTo(self.$box);if(self.options.text){self.$text=$('<div>').html(self.options.text).appendTo(self.$box);}
|
||
|
|
function setSizes(){var css={width:(self.options.text?256:self.options.size),height:self.options.size+(self.options.text?24:0)};if(!self.isAuto){css.left=Math.floor((self.options.width-css.width)/2);css.top=Math.floor((self.options.height-css.height)/2);that.css({width:self.options.width+'px',height:self.options.height+'px'});}
|
||
|
|
css=Ox.map(css,function(value){return value+'px';});self.$box.css(css);}
|
||
|
|
that.start=function(callback){self.$loadingIcon.start(callback);self.$text&&self.$text.stop().animate({opacity:1},250);return that;};that.stop=function(callback){self.$loadingIcon.stop(callback);self.$text&&self.$text.stop().animate({opacity:0},250);return that;};return that;};'use strict';Ox.Request=(function(){var cache={},pending={},requests={},self={options:{cache:true,timeout:60000,type:'POST',url:'/api/'}},$element;return{bindEvent:function(){if(!$element){$element=Ox.Element();}
|
||
|
|
$element.bindEvent.apply($element,arguments);},cancel:function(){if(arguments.length==0){requests={};}else if(Ox.isFunction(arguments[0])){var fn=arguments[0];Ox.forEach(requests,function(req,id){if(fn(req)){delete requests[id];}});}else{delete requests[arguments[0]];}
|
||
|
|
$element&&$element.triggerEvent('request',{requests:Ox.len(requests)});},clearCache:function(query){if(!query){cache={};}else{cache=Ox.filter(cache,function(val,key){return key.indexOf(query)==-1;});}},options:function(){return Ox.getset(self.options,arguments,function(){},this);},requests:function(){return Ox.len(requests);},send:function(options){var data,options=Ox.extend({age:-1,callback:null,id:Ox.uid(),timeout:self.options.timeout,type:self.options.type,url:self.options.url},options),req=JSON.stringify({url:options.url,data:options.data});if(pending[req]){wait();}else{requests[options.id]={url:options.url,data:options.data};if(cache[req]&&(options.age==-1||options.age>+new Date()-cache[req].time)){data=cache[req].data;setTimeout(function(){callback(data,true);});}else{pending[req]=true;$.ajax({beforeSend:function(request){var csrftoken=Ox.Cookies('csrftoken');if(csrftoken){request.setRequestHeader('X-CSRFToken',csrftoken);}},complete:complete,data:options.data,timeout:options.timeout,type:options.type,url:options.url});}
|
||
|
|
$element&&$element.triggerEvent('request',{requests:Ox.len(requests)});}
|
||
|
|
function callback(data,success){if(requests[options.id]){delete requests[options.id];$element&&$element.triggerEvent('request',{requests:Ox.len(requests)});if(success){options.callback&&options.callback(data);}else{$element&&$element.triggerEvent('error',data);}}}
|
||
|
|
function complete(request){var $dialog,data;try{data=JSON.parse(request.responseText);}catch(error){try{data={status:{code:request.status,text:request.statusText}};}catch(error){data={status:{code:'500',text:'Unknown Error'}};}}
|
||
|
|
if(Ox.contains([200,404,409],data.status.code)){if(self.options.cache){cache[req]={data:data,time:Ox.getTime()};}
|
||
|
|
callback(data,true);}else{callback(data,false);}
|
||
|
|
delete pending[req];}
|
||
|
|
function wait(){setTimeout(function(){if(pending[req]){wait();}else{Ox.Request.send(options);}});}
|
||
|
|
return options.id;},unbindEvent:function(){$element&&$element.unbindEvent.apply($element,arguments);}};}());'use strict';Ox.Theme=(function(){var localStorage=Ox.localStorage('Ox'),that=function(theme){return theme?setTheme(theme):getTheme();};function getTheme(){var classNames=Ox.$body.attr('class'),theme='';classNames&&Ox.forEach(classNames.split(' '),function(className){if(Ox.startsWith(className,'OxTheme')){theme=className.replace('OxTheme','');theme=theme[0].toLowerCase()+theme.slice(1);return false;}});return theme;}
|
||
|
|
function renderElement(value,type){var $element,background,color,data=that.getThemeData(),saturation;if(type=='hue'){background=Ox.rgb(value,1,data.themeBackgroundLightness);color=Ox.rgb(value,1,data.themeColorLightness);}else if(type=='saturation'){background=Ox.range(7).map(function(i){return Ox.rgb(i*60,value,data.themeBackgroundLightness);});color=Ox.rgb(0,0,data.themeColorLightness);}else if(type=='lightness'){background=Ox.range(3).map(function(){return Math.round(value*255);});color=Ox.range(3).map(function(){return Math.round(value*255)+(value<0.5?128:-128);});}else if(type=='gradient'){saturation=value===null?0:1;background=Ox.range(2).map(function(i){return Ox.rgb(value||0,saturation,data.themeBackgroundLightness).map(function(value){return(value||0)+(i==0?16:-16);});});color=Ox.rgb(value||0,saturation,data.themeColorLightness);}
|
||
|
|
$element=$('<div>').addClass('OxColor'
|
||
|
|
+(type=='lightness'?'':' OxColor'+Ox.toTitleCase(type))).css({color:'rgb('+color.join(', ')+')'}).data(type=='lightness'?{}:{OxColor:value});if(Ox.isNumber(background[0])){$element.css({background:'rgb('+background.join(', ')+')'});}else{['moz','o','webkit'].forEach(function(browser){$element.css({background:'-'+browser+'-linear-gradient('
|
||
|
|
+(background.length==2?'top':'left')+', '
|
||
|
|
+background.map(function(rgb,i){return'rgb('+rgb.join(', ')+') '
|
||
|
|
+Math.round(i*100/(background.length-1))+'%';}).join(', ')
|
||
|
|
+')'});});}
|
||
|
|
return $element;};function setTheme(theme){var currentTheme=getTheme();if(theme!=currentTheme&&Ox.contains(that.getThemes(),theme)){Ox.$body.addClass('OxTheme'
|
||
|
|
+theme[0].toUpperCase()
|
||
|
|
+theme.substr(1)).removeClass('OxTheme'
|
||
|
|
+currentTheme[0].toUpperCase()
|
||
|
|
+currentTheme.substr(1));$('.OxColor').each(function(){var $element=$(this);if($element.hasClass('OxColorName')){$element.attr({src:Ox.UI.getImageURL($element.data('OxImage'),$element.data('OxColor'),theme)});}else{Ox.forEach(['hue','saturation','gradient'],function(type){if($element.hasClass('OxColor'+Ox.toTitleCase(type))){var value=$element.data('OxColor'),$element_=renderElement(value,type);$element.css({background:$element_.css('background'),color:$element_.css('color')});return false;}});}});$('img').add('input[type="image"]').not('.OxColor').each(function(element){var $element=$(this),data=Ox.UI.getImageData($element.attr('src'));data&&$element.attr({src:Ox.UI.getImageURL(data.name,data.color,theme)});});}
|
||
|
|
localStorage({theme:theme});return that;}
|
||
|
|
that.getThemes=function(){return Object.keys(Ox.UI.THEMES);};that.getThemeData=function(theme){return Ox.UI.THEMES[theme||Ox.Theme()];};that.formatColor=function(value,type){return renderElement(value,type).css({textAlign:'center'}).html(value===null?'':Ox.formatNumber(value,3));};that.formatColorLevel=function(index,values,hueRange){hueRange=hueRange||(Ox.isBoolean(index)?[0,120]:[120,0]);var step=(hueRange[1]-hueRange[0])/(values.length-1),hue=hueRange[0]+index*step;return renderElement(hue,'gradient').css({textAlign:'center'}).html(values[+index]);};that.formatColorPercent=function(value,decimals,sqrt){var hue=(sqrt?Math.sqrt(value)*10:value)*1.2;return renderElement(hue,'gradient').css({textAlign:'center'}).html(Ox.formatNumber(value,decimals)+'%')};that.getColorImage=function(name,value,tooltip){return(tooltip?Ox.Element({element:'<img>',tooltip:tooltip}):$('<img>')).addClass('OxColor OxColorName').attr({src:Ox.UI.getImageURL(name,value)}).data({OxColor:value,OxImage:name});};return that;}());'use strict';Ox.documentReady(function(){Ox.$body=$('body');Ox.$document=$(document);Ox.$head=$('head');Ox.$window=$(window);});Ox.$elements={};Ox.DIMENSIONS=Ox.UI.DIMENSIONS={horizontal:['width','height'],vertical:['height','width']};Ox.EDGES=Ox.UI.EDGES={horizontal:['left','right','top','bottom'],vertical:['top','bottom','left','right']};Ox.SCROLLBAR_SIZE=Ox.UI.SCROLLBAR_SIZE=$.browser.webkit?8:(function(){var inner=Ox.$('<p>').css({height:'200px',width:'100%'}),outer=Ox.$('<div>').css({height:'150px',left:0,overflow:'hidden',position:'absolute',top:0,visibility:'hidden',width:'200px'}).append(inner).appendTo($('body')),width=inner[0].offsetWidth;outer.css({overflow:'scroll'});width=1+width-(inner[0].offsetWidth==width?outer[0].clientWidth:inner[0].offsetWidth);outer.remove();return Math.max(width+width%2,8);})();Ox.UI.PATH=Ox.PATH+'UI/';Ox.UI.getImageData=Ox.cache(function(url){var str='data:image/svg+xml;base64,';return Ox.startsWith(url,str)?JSON.parse(atob(url.split(',')[1]).match(/<!--(.+?)-->/)[1]):null;});Ox.UI.getImageURL=Ox.cache(function(name,color,theme){var colorName,colors={marker:{'#000000':'videoMarkerBorder','#FFFFFF':'videoMarkerBackground'},symbol:{'#FF0000':'symbolWarningColor'}},image=Ox.UI.IMAGES[name],themeData,type=Ox.toDashes(name).split('-')[0];color=color||'default';theme=theme||Ox.Theme();themeData=Ox.Theme.getThemeData(theme);image=image||Ox.UI.IMAGES['symbolHelp']
|
||
|
|
if(type=='symbol'){if(Ox.isString(color)){colorName=color;color=themeData['symbol'+color[0].toUpperCase()+color.slice(1)+'Color'];}
|
||
|
|
image=image.replace(/#808080/g,'#'+Ox.toHex(color));}
|
||
|
|
Ox.forEach(colors[type],function(name,hex){image=image.replace(new RegExp(hex,'g'),'$'+Ox.toHex(themeData[name]));});image=image.replace(/\$/g,'#');return'data:image/svg+xml;base64,'+btoa(image+'<!--'+JSON.stringify(Ox.extend(color?{color:colorName}:{},{name:name,theme:theme}))+'-->');},{key:function(args){args[1]=args[1]||'default';args[2]=args[2]||Ox.Theme();return JSON.stringify(args);}});Ox.UI.getElement=function(element){return Ox.$elements[$(element).data('oxid')];};Ox.UI.hideScreen=function(){Ox.UI.LoadingScreen.hide();};Ox.UI.isElement=function(element){return!!$(element).data('oxid');};'use strict';Ox.URL=function(options){var self={},that={};self.options=Ox.extend({findKeys:{},getHash:Ox.noop,getItem:Ox.noop,getPart:Ox.noop,getSort:Ox.noop,getSpan:Ox.noop,pages:[],spanType:{},sortKeys:{},types:[],views:{}},options);Ox.forEach(self.options.findKeys,function(findKeys){if(Ox.every(findKeys,function(findKey){return findKey.id!='*';})){findKeys.push({id:'*',type:'string'});}});self.previousTitle='';self.previousURL='';window.addEventListener('popstate',function(){self.previousTitle=document.title;self.previousURL=document.location.pathname
|
||
|
|
+document.location.search
|
||
|
|
+document.location.hash;});function constructCondition(condition,state){var key=condition.key=='*'?'':condition.key,operator=condition.operator,value=(Ox.isArray(condition.value)?condition.value:[condition.value]).map(function(value){return encodeValue(constructValue(value,condition.key,state));}).join(',');if(!key){operator=operator.replace('=','');}else if(operator.indexOf('^')>-1){operator=operator.replace('^','=');value+='*';}else if(operator.indexOf('$')>-1){operator=operator.replace('$','=');value='*'+value;}
|
||
|
|
return[key,operator,value].join('');}
|
||
|
|
function constructDate(date){return Ox.formatDate(date,'%Y-%m-%d',true);}
|
||
|
|
function constructDuration(duration){return Ox.formatDuration(duration,3).replace(/\.000$/,'');}
|
||
|
|
function constructFind(find,state){return find.conditions.map(function(condition){return condition.conditions?'('+constructFind(condition,state)+')':constructCondition(condition,state);}).join(find.operator);}
|
||
|
|
function constructHash(hash){var obj={};if(hash.query){hash.query.forEach(function(condition){obj[encodeValue(condition.key)]=Ox.isString(condition.value)?encodeValue(condition.value):condition.value;});}
|
||
|
|
return hash.anchor||hash.query?'#'+(hash.anchor||'')+(hash.query?'?'+Ox.serialize(obj,true):''):'';}
|
||
|
|
function constructLocation(location){return location.join(',');}
|
||
|
|
function constructSort(sort,state){var sortKeys=self.options.sortKeys[state.type][!state.item?'list':'item'][state.view];return sortKeys?sort.map(function(sort){return(Ox.getObjectById(sortKeys,sort.key).operator==sort.operator?'':sort.operator)+sort.key;}).join(','):'';}
|
||
|
|
function constructSpan(span,state){var view=state.view||self.options.views[state.type][!state.item?'list':'item'][0],spanType=self.options.spanType[state.type][!state.item?'list':'item'][view],points=Ox.contains(['date','duration'],spanType)&&Ox.isArray(span)&&span.length==3&&span[0]==span[1]?span.slice(1):span;return Ox.makeArray(points).map(function(point){return Ox.isNumber(point)?(spanType=='date'?constructDate(point):spanType=='duration'?constructDuration(point):spanType=='location'?constructLocation(point):point):encodeValue(point,true);}).join(',');}
|
||
|
|
function constructURL(state){var parts=[];if(state.page){parts.push(state.page);if(state.part){parts.push(encodeValue(state.part));if(state.span){parts.push(encodeValue(state.span));}}}else{if(self.options.types.indexOf(state.type)>0){parts.push(state.type);}
|
||
|
|
if(state.item){parts.push(encodeValue(state.item,true));}
|
||
|
|
if(state.type&&self.options.views[state.type][state.item?'item':'list'].indexOf(state.view)>-1){parts.push(state.view);}
|
||
|
|
if(state.sort&&state.sort.length){parts.push(constructSort(state.sort,state));}
|
||
|
|
if(state.span&&state.span.length){parts.push(constructSpan(state.span,state));}
|
||
|
|
if(state.find){parts.push(constructFind(state.find,state));}}
|
||
|
|
return'/'+Ox.filter(parts).join('/')+(state.hash?constructHash(state.hash):'');}
|
||
|
|
function constructValue(str,key,state){var findKey=Ox.getObjectById(self.options.findKeys[state.type],key),type=Ox.isArray(findKey.type)?findKey.type[0]:findKey.type,value=str,values=findKey.values;return type=='enum'?values[value]:value;}
|
||
|
|
function decodeValue(value){return Ox.decodeURIComponent(value).replace(/_/g,' ').replace(/\t/g,'_').replace(/\x0E/g,'<').replace(/\x0F/g,'>');}
|
||
|
|
function encodeValue(value,isItem){var chars=isItem?'/?#%':'*=&|()?#%',ret='';value.toString().split('').forEach(function(char){var index=chars.indexOf(char);ret+=index>-1?'%'+char.charCodeAt(0).toString(16).toUpperCase():char;});ret=ret.replace(/_/g,'%09').replace(/\s/g,'_');if(!isItem){ret=ret.replace(/</g,'%0E').replace(/>/g,'%0F');}
|
||
|
|
return ret;}
|
||
|
|
function hasOnlyStringType(spanTypes){var types=Ox.unique(Ox.values(spanTypes));return types.length==1&&types[0]=='string';}
|
||
|
|
function isNumericalSpan(str){return str.split(',').every(function(str){return/^[0-9-\.:]+$/.test(str);});}
|
||
|
|
function isDate(str){var values=/^(-?\d+)-?(\d+)?-?(\d+)? ?(\d+)?:?(\d+)?:?(\d+)?\.?(\d+)?$/.exec(str);return Boolean(values&&parseInt(values[1])<=9999&&(!values[2]||parseInt(values[2])<=12)&&(!values[3]||parseInt(values[3])<=31))}
|
||
|
|
function getSpanType(str,types){Ox.Log('Core','getSpanType',str,types)
|
||
|
|
var canBeDate=types.indexOf('date')>-1,canBeDuration=types.indexOf('duration')>-1,canBeLocation=types.indexOf('location')>-1,canBeNumber=types.indexOf('number')>-1,canBeString=types.indexOf('string')>-1,length=str.split(',').length;return canBeDate&&/\d-/.test(str)?'date':canBeDuration&&/:/.test(str)?'duration':canBeLocation&&length==4?'location':canBeDuration?'duration':canBeDate&&isDate(str)?'date':canBeLocation&&length==2?'location':canBeNumber&&/^\d+$/.test(str)?'number':canBeString&&str.length?'string':'';}
|
||
|
|
function parseCondition(str,state){Ox.Log('Core','PARSE COND',str)
|
||
|
|
var condition={},operators=['!==','==','!=','=','!<','<','!>','>'],split;str=str.replace(/%3C/g,'<').replace(/%3E/g,'>');Ox.forEach(operators,function(operator){if(str.indexOf(operator)>-1){split=str.split(operator);condition={key:split.shift(),value:split.join(operator),operator:operator};return false;}});if(!condition.operator||Ox.getIndexById(self.options.findKeys[state.type],condition.key)==-1){condition={key:'*',value:str,operator:'='};}
|
||
|
|
if(['=','!='].indexOf(condition.operator)>-1){if(Ox.startsWith(condition.value,'*')&&!Ox.endsWith(condition.value,'*')){condition.value=condition.value.slice(1);condition.operator=condition.operator.replace('=','$')}else if(Ox.endsWith(condition.value,'*')&&!Ox.startsWith(condition.value,'*')){condition.value=condition.value.slice(0,-1);condition.operator=condition.operator.replace('=','^')}}
|
||
|
|
var key=Ox.getObjectById(self.options.findKeys[state.type],condition.key)
|
||
|
|
if(['date','enum','float','integer','time','year'].indexOf(key.type)>-1&&condition.value.indexOf(',')>-1){condition.value=condition.value.split(',').map(function(value){return parseValue(decodeValue(value),condition.key,state);});}else if(Ox.isArray(key.type)&&key.type[0]=="integer"&&condition.value.indexOf(',')>-1){condition.value=condition.value.split(',').map(function(value){return parseValue(decodeValue(value),condition.key,state);});if(condition.value.length==4){condition.value=[condition.value.slice(0,2),condition.value.slice(2)]}}else{condition.value=parseValue(decodeValue(condition.value),condition.key,state);}
|
||
|
|
Ox.Log('Core','PARSE COND',str,condition);return condition;}
|
||
|
|
function parseDate(str){return Ox.formatDate(Ox.parseDate(str,true),'%Y-%m-%d');}
|
||
|
|
function parseDuration(str){return Ox.parseDuration(str);}
|
||
|
|
function parseFind(str,state){str=(str||'').replace(/%7C/g,'|');var counter=0,find={conditions:[],operator:'&'},salt=Ox.range(16).map(function(){return Ox.char(65+Ox.random(26));}).join(''),regexp=new RegExp(salt+'(\\d+)'),subconditions=[];if(str.length){Ox.forEach(str,function(c,i){if(c==')'){counter--;}
|
||
|
|
if(counter>=1){subconditions[subconditions.length-1]+=c;}
|
||
|
|
if(c=='('){(++counter==1)&&subconditions.push('');}});subconditions=subconditions.filter(function(subcondition){return!!subcondition;});subconditions.forEach(function(subcondition,i){str=str.replace(subcondition,salt+i);});find.operator=str.indexOf('|')>-1?'|':'&'
|
||
|
|
find.conditions=str.split(find.operator).map(function(condition,i){condition=condition.replace(regexp,function(match){return subconditions[parseInt(arguments[1])];});return condition[0]=='('?parseFind(condition.slice(1,-1),state):parseCondition(condition,state);});}
|
||
|
|
return find;}
|
||
|
|
function parseHash(str){var hash={},split=str.split('?');if(split[0]){hash.anchor=decodeValue(split[0]);}
|
||
|
|
if(split[1]){Ox.forEach(Ox.unserialize(Ox.decodeURIComponent(split[1]),true),function(value,key){hash.query=hash.query||[];hash.query.push({key:decodeValue(key),value:Ox.isString(value)?decodeValue(value):value});});}
|
||
|
|
return hash;}
|
||
|
|
function parseLocation(str){return str.split(',').map(function(str,i){return Ox.limit(parseInt(str,10),-90*(i+1),90*(i+1));});}
|
||
|
|
function parseNumber(str){return parseInt(str);}
|
||
|
|
function parseSort(str,state){return str.split(',').map(function(str){var hasOperator=/^[\+-]/.test(str);return{key:hasOperator?str.slice(1):str,operator:hasOperator?str[0]:Ox.getObjectById(self.options.sortKeys[state.type][!state.item?'list':'item'][state.view],str).operator};});}
|
||
|
|
function parseSpan(str,type){var split=str.split(',');if(type=='string'){return str;}
|
||
|
|
if(split.length==4){split=[split[0]+','+split[1],split[2]+','+split[3]];}
|
||
|
|
return split.map(type=='date'?parseDate:type=='duration'?parseDuration:type=='location'?parseLocation:parseNumber);}
|
||
|
|
function parseURL(str,callback){str=str.replace(/\?fbclid=.*/,'')
|
||
|
|
var split=str.split('#'),parts=split.shift().replace(/(^\/|\/$)/g,'').split('/'),state=split.length&&split[0].length?{hash:parseHash(split.join('#'))}:{};if(parts[0]==''){getHash();}else if(self.options.pages.indexOf(parts[0])>-1){state.page=parts[0];parts.shift();if(parts.length){self.options.getPart(state,decodeValue(parts[0]),function(){if(state.part){parts.shift();if(parts.length){parsePartSpan();}else{getHash();}}else{getHash();}});}else{getHash();}}else{if(self.options.types.indexOf(parts[0])>-1){state.type=parts[0];parts.shift();}else{state.type=self.options.types[0];}
|
||
|
|
if(parts.length){Ox.Log('Core','ST',state.type,self.options.views)
|
||
|
|
if(self.options.views[state.type].list.indexOf(parts[0])>-1){state.item='';state.view=parts[0];parts.shift();parseBeyondItem();}else{self.options.getItem(state,decodeValue(parts[0]),function(){if(state.item){parts.shift();}
|
||
|
|
parseBeyondItem();});}}else{state.item='';state.view=self.options.views[state.type].list[0];getHash();}}
|
||
|
|
function parseBeyondItem(){Ox.Log('Core','pBI',state,parts.join('/'));var sortKeyIds,sortParts;if(parts.length&&state.item&&self.options.views[state.type].item.indexOf(parts[0])>-1){state.view=parts[0];parts.shift();}else if(state.item&&self.options.views[state.type].item.length==1){state.view=self.options.views[state.type].item[0];}
|
||
|
|
if(parts.length){sortParts=parts[0].split(',');sortKeyIds=Ox.map(self.options.sortKeys[state.type][!state.item?'list':'item'],function(sortKeys){return sortKeys.map(function(sortKey){return sortKey.id;});});Ox.forEach(state.view?[state.view]:self.options.views[state.type][!state.item?'list':'item'],function(view){if(sortKeyIds[view]&&sortParts.every(function(part){return sortKeyIds[view].indexOf(part.replace(/^[\+-]/,''))>-1;})){if(!state.view){state.view=view;}
|
||
|
|
state.sort=parseSort(parts[0],state);parts.shift();return false;}});if(state.sort){self.options.getSort(state,state.sort,parseBeyondSort);}else{parseBeyondSort();}}else{if(!state.view){state.view=self.options.views[state.type][!state.item?'list':'item'][0];}
|
||
|
|
getHash();}}
|
||
|
|
function parseBeyondSort(){Ox.Log('Core','pBSo',state,parts.join('/'))
|
||
|
|
var span,spanType,spanTypes;if(parts.length){spanTypes=self.options.spanType[state.type][!state.item?'list':'item'];if(isNumericalSpan(parts[0])||hasOnlyStringType(spanTypes)){spanType=state.view?spanTypes[state.view]:getSpanType(parts[0],Ox.unique(Ox.values(spanTypes)));Ox.Log('URL','SPAN TYPE',spanType)
|
||
|
|
if(spanType){span=parseSpan(parts[0],spanType);if(span){if(state.view){state.span=span;parts.shift();}else{Ox.forEach(self.options.views[state.type][!state.item?'list':'item'],function(view){if(spanTypes[view]==spanType){state.view=view;state.span=span;parts.shift();return false;}});}}}}
|
||
|
|
if(state.span&&(spanType=='duration'||spanType=='string')){self.options.getSpan(state,state.span,parseBeyondSpan);}else if(!state.span&&(spanTypes[state.view]=='string'||/^[A-Z@]/.test(parts[0]))){self.options.getSpan(state,decodeValue(parts[0]),function(){if(state.span){parts.shift();}
|
||
|
|
parseBeyondSpan();});}else{parseBeyondSpan();}}else{if(!state.view){state.view=self.options.views[state.type][!state.item?'list':'item'][0];}
|
||
|
|
getHash();}}
|
||
|
|
function parseBeyondSpan(){Ox.Log('Core','pBSp',state,parts.join('/'))
|
||
|
|
if(!state.view){state.view=self.options.views[state.type][!state.item?'list':'item'][0];}
|
||
|
|
if(parts.length){state.find=parseFind(parts.join('/'),state);}
|
||
|
|
getHash();}
|
||
|
|
function parsePartSpan(){options.getSpan(state,decodeValue(parts.join('/')),getHash);}
|
||
|
|
function getHash(){self.options.getHash(state,function(){callback(state);});}}
|
||
|
|
function parseValue(str,key,state){var findKey=Ox.getObjectById(self.options.findKeys[state.type],key),type=Ox.isArray(findKey.type)?findKey.type[0]:findKey.type,value=str,values=findKey.values;if(type=='boolean'){value=['','false'].indexOf(str)==-1;}else if(type=='date'){value=Ox.formatDate(Ox.parseDate(str,true),'%F',true);}else if(type=='enum'){value=Math.max(values.map(function(value){return value.toLowerCase();}).indexOf(str.toLowerCase()),0);}else if(type=='float'){value=parseFloat(str)||0;}else if(type=='integer'){value=Math.round(str)||0;}else if(type=='time'){value=Ox.formatDuration(Ox.parseDuration(value));}else if(type=='year'){value=Math.round(str)||1970;}
|
||
|
|
return value.toString();}
|
||
|
|
function saveURL(){}
|
||
|
|
that.options=function(){return Ox.getset(self.options,arguments,null,that);};that.parse=function(){var str=arguments.length==2?arguments[0]:document.location.pathname
|
||
|
|
+document.location.search
|
||
|
|
+document.location.hash,callback=arguments[arguments.length-1];parseURL(str,callback);return that;};that.pop=function(){if(self.previousURL){history.pushState&&!Ox.Fullscreen.getState()&&history.pushState({},self.previousTitle,self.previousURL);document.title=self.previousTitle;}
|
||
|
|
return!!self.previousURL;};that.push=function(state,title,url,callback){if(!state){parseURL(url,function(state){pushState(state,title,url);});}else{url=url||constructURL(state);pushState(state,title,url);}
|
||
|
|
function pushState(state,title,url){self.previousTitle=document.title;self.previousURL=document.location.pathname
|
||
|
|
+document.location.search
|
||
|
|
+document.location.hash;if(url!=self.previousURL){history.pushState&&!Ox.Fullscreen.getState()&&history.pushState(Ox.extend(state,{title:title}),'',url);document.title=title;callback&&callback(state);}}}
|
||
|
|
that.replace=function(state,title,url,callback){if(!state){parseURL(url,function(state){replaceState(state,title,url);});}else{url=url||constructURL(state);replaceState(state,title,url);}
|
||
|
|
function replaceState(state,title,url){history.replaceState&&!Ox.Fullscreen.getState()&&history.replaceState(Ox.extend(state,{title:title}),'',url);document.title=title;callback&&callback(state);}}
|
||
|
|
return that;};'use strict';Ox.CollapsePanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({animate:true,collapsed:false,extras:[],size:16,title:''}).options(options).update({collapsed:function(){self.options.collapsed=!self.options.collapsed;toggleCollapsed();},title:function(){self.$title.html(self.options.title);}}).addClass('OxPanel OxCollapsePanel').bindEvent({key_left:function(){!self.options.collapsed&&toggleCollapsed();},key_right:function(){self.options.collapsed&&toggleCollapsed();}});var index=Ox.indexOf(self.options.extras,Ox.isEmpty);self.extras=index>-1?[self.options.extras.slice(0,index),self.options.extras.slice(index+1)]:[[],self.options.extras];self.$titlebar=Ox.Bar({orientation:'horizontal',size:self.options.size}).bindEvent({anyclick:clickTitlebar,doubleclick:doubleclickTitlebar}).appendTo(that);self.$button=Ox.Button({style:'symbol',type:'image',value:self.options.collapsed?'expand':'collapse',values:[{id:'expand',title:'right'},{id:'collapse',title:'down'}]}).bindEvent({click:function(){that.gainFocus();toggleCollapsed(true);}}).appendTo(self.$titlebar);self.$extras=[];if(self.extras[0].length){self.$extras[0]=Ox.Element().addClass('OxExtras').css({width:self.extras[0].length*16+'px'}).appendTo(self.$titlebar);self.extras[0].forEach(function($extra){$extra.appendTo(self.$extras[0]);});}
|
||
|
|
self.$title=Ox.Element().addClass('OxTitle').css({left:16+self.extras[0].length*16+'px',right:self.extras[1].length*16+'px'}).html(self.options.title).appendTo(self.$titlebar);if(self.extras[1].length){self.$extras[1]=Ox.Element().addClass('OxExtras').css({width:self.extras[1].length*16+'px'}).appendTo(self.$titlebar);self.extras[1].forEach(function($extra){$extra.appendTo(self.$extras[1]);});}
|
||
|
|
that.$content=Ox.Element().addClass('OxContent').appendTo(that);if(self.options.collapsed){that.$content.css({marginTop:-that.$content.height()+'px'}).hide();}
|
||
|
|
function clickTitlebar(e){if(!$(e.target).hasClass('OxButton')){that.gainFocus();}}
|
||
|
|
function doubleclickTitlebar(e){if(!$(e.target).hasClass('OxButton')){self.$button.trigger('click');}}
|
||
|
|
function toggleCollapsed(fromButton){var marginTop;self.options.collapsed=!self.options.collapsed;marginTop=self.options.collapsed?-that.$content.height():0;!fromButton&&self.$button.toggle();!self.options.collapsed&&that.$content.css({marginTop:-that.$content.height()+'px'}).show();if(self.options.animate){that.$content.animate({marginTop:marginTop+'px'},250,function(){self.options.collapsed&&that.$content.hide();});}else{that.$content.css({marginTop:marginTop+'px'});self.options.collapsed&&that.$content.hide();}
|
||
|
|
that.triggerEvent('toggle',{collapsed:self.options.collapsed});}
|
||
|
|
that.updatePanel=function(){self.options.collapsed&&that.$content.css({marginTop:-that.$content.height()});};return that;};'use strict';Ox.SlidePanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({animate:250,elements:[],orientation:'horizontal',selected:''}).options(options||{}).update({selected:function(){selectElement(self.options.selected);},size:updateElements}).addClass('OxSlidePanel');if(!self.options.selected){self.options.selected=self.options.elements[0].id}
|
||
|
|
self.elements=self.options.elements.length;self.$content=Ox.Element().css(getContentCSS()).appendTo(that);updateElements();self.options.elements.forEach(function(element,index){element.element.appendTo(self.$content);});function getContentCSS(){return{left:-Ox.getIndexById(self.options.elements,self.options.selected)*self.options.size+'px',width:self.elements*self.options.size+'px'};}
|
||
|
|
function getElementCSS(index){return{left:index*self.options.size+'px',width:self.options.size+'px'};}
|
||
|
|
function selectElement(id){self.$content.animate({left:getContentCSS().left,},self.options.animate);}
|
||
|
|
function updateElements(){self.$content.css(getContentCSS());self.options.elements.forEach(function(element,index){element.element.css(getElementCSS(index));});}
|
||
|
|
that.replaceElement=function(idOrIndex,element){var index=Ox.isNumber(idOrIndex)?idOrIndex:Ox.getIndexById(self.options.elements,idOrIndex);self.options.elements[index].element.replaceWith(self.options.elements[index].element=element.css(getElementCSS(index)));return that;};return that;};'use strict';Ox.SplitPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({elements:[],orientation:'horizontal'}).options(options||{}).addClass('OxSplitPanel');self.defaultSize=self.options.elements.map(function(element){return!Ox.isUndefined(element.defaultSize)?element.defaultSize:element.size;});self.dimensions=Ox.UI.DIMENSIONS[self.options.orientation];self.edges=Ox.UI.EDGES[self.options.orientation];self.initialized=false;self.length=self.options.elements.length;self.$elements=[];self.$resizebars=[];self.options.elements.forEach(function(element,index){var elementIndices=index==0?[0,1]:index==1?[1,0]:[2,1],resizebarIndex=self.$resizebars.length;self.options.elements[index]=Ox.extend({collapsible:false,collapsed:false,defaultSize:'auto',resettable:false,resizable:false,resize:[],size:'auto',tooltip:false},element);self.edges.slice(2).forEach(function(edge){element.element.css(edge,(parseInt(element.element.css(edge))||0)+'px');});if(element.collapsed){that.css(self.edges[index==0?0:1],-element.size+'px');}
|
||
|
|
self.$elements[index]=element.element.appendTo(that);if(element.collapsible||element.resizable){self.$resizebars[resizebarIndex]=Ox.Resizebar({collapsed:element.collapsed,collapsible:element.collapsible,edge:self.edges[index==0?0:1],orientation:self.options.orientation=='horizontal'?'vertical':'horizontal',resettable:element.resettable,resizable:element.resizable,resize:element.resize,size:element.size,tooltip:element.tooltip===true?'':element.tooltip}).bindEvent({reset:function(){that.resetElement(index);},resize:function(data){onResize(elementIndices,data.size);triggerEvents(elementIndices,'resize',data);},resizepause:function(data){triggerEvents(elementIndices,'resizepause',data);},resizeend:function(data){triggerEvents(elementIndices,'resizeend',data);},toggle:function(data){that.toggleElement(index);}})
|
||
|
|
[index==0?'insertAfter':'insertBefore'](self.$elements[index]);}});setSizes();function getSize(index){var element=self.options.elements[index];return element.size+(element.collapsible||element.resizable);}
|
||
|
|
function getVisibleSize(index){var element=self.options.elements[index];return getSize(index)*!element.collapsed;}
|
||
|
|
function onResize(elementIndices,size){var dimension=self.dimensions[0],edge=self.edges[elementIndices[0]==0?0:1];self.options.elements[elementIndices[0]].size=size;elementIndices.forEach(function(elementIndex,index){self.$elements[elementIndex].css(index==0?dimension:edge,(index==0?size:size+1)+'px');});}
|
||
|
|
function setSizes(animate){self.options.elements.forEach(function(element,index){var $resizebar,css={},edges=self.edges.slice(0,2).map(function(edge){var value=parseInt(self.$elements[index].css(edge));return!self.initialized&&value||0;});if(element.size!='auto'){css[self.dimensions[0]]=element.size+'px';}
|
||
|
|
if(index==0){css[self.edges[0]]=edges[0]+'px';if(element.size=='auto'){css[self.edges[1]]=getSize(1)+(self.length==3?getVisibleSize(2):0)+'px';}}else if(index==1){if(self.options.elements[0].size!='auto'){css[self.edges[0]]=edges[0]+getSize(0)+'px';}else{css[self.edges[0]]='auto';}
|
||
|
|
css[self.edges[1]]=(self.length==3?getSize(2):0)+'px';}else{if(element.size=='auto'){css[self.edges[0]]=getVisibleSize(0)+getSize(1)+'px';}else{css[self.edges[0]]='auto';}
|
||
|
|
css[self.edges[1]]=edges[1]+'px';}
|
||
|
|
if(animate){self.$elements[index].animate(css,250,function(){index==0&&Ox.isFunction(animate)&&animate();});}else{self.$elements[index].css(css);}
|
||
|
|
if(element.collapsible||element.resizable){$resizebar=self.$resizebars[index<2?0:self.$resizebars.length-1];css=Ox.extend({},self.edges[index==0?0:1],element.size+'px');if(animate){$resizebar.animate(css,250);}else{$resizebar.css(css);}
|
||
|
|
$resizebar.options({size:element.size});}});self.initialized=true;}
|
||
|
|
function triggerEvents(elementIndices,event,data){elementIndices.forEach(function(elementIndex,index){var $element=self.$elements[elementIndex],size=index==0?data.size:$element[self.dimensions[0]]();$element.triggerEvent(event,{size:size});});}
|
||
|
|
that.isCollapsed=function(index){return self.options.elements[index].collapsed;};that.replaceElement=function(index,element){self.edges.slice(2).forEach(function(edge){element.css(edge,(parseInt(element.css(edge))||0)+'px');});self.$elements[index]=element;self.options.elements[index].element.replaceWith(self.options.elements[index].element=element);setSizes();return that;};that.resetElement=function(index){var element=self.options.elements[index];element.size=self.defaultSize[index];setSizes(function(){element.element.triggerEvent('resize',{size:element.size});element=self.options.elements[index==0?1:index-1];element.element.triggerEvent('resize',{size:element.element[self.dimensions[0]]()});});return that;};that.resizeElement=that.size=function(index,size,callback){var element=self.options.elements[index];if(arguments.length==1){return element.element[self.dimensions[0]]()*!that.isCollapsed(index);}else{element.size=size;setSizes(callback);return that;}};that.toggleElement=function(index){if(self.toggling){return that;}
|
||
|
|
var element=self.options.elements[index],value=parseInt(that.css(self.edges[index==0?0:1]))
|
||
|
|
+element.element[self.dimensions[0]]()*(element.collapsed?1:-1),animate=Ox.extend({},self.edges[index==0?0:1],value);self.toggling=true;that.animate(animate,250,function(){element.collapsed=!element.collapsed;element.element.triggerEvent('toggle',{collapsed:element.collapsed});self.$resizebars[index<2?0:self.$resizebars.length-1].options({collapsed:element.collapsed});element=self.options.elements[index==0?1:index-1];element.element.triggerEvent('resize',{size:element.element[self.dimensions[0]]()});self.toggling=false;});return that;};return that;};'use strict';Ox.TabPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({content:null,size:24,style:'default',tabs:[]}).options(options||{}).update({content:function(){self.$panel.replaceElement(1,getContent());}});self.isObject=Ox.isObject(self.options.content);self.selected=getSelected();self.$bar=Ox.Bar({size:24});self.$tabs=Ox.ButtonGroup({buttons:self.options.tabs,id:'tabs',selectable:true,style:self.options.style,value:self.selected}).css({top:(self.options.size-16)/2+'px'}).bindEvent({change:function(data){self.selected=data.value;self.$panel.replaceElement(1,getContent());that.triggerEvent('change',{selected:self.selected});}}).appendTo(self.$bar);self.$panel=Ox.SplitPanel({elements:[{element:self.$bar,size:self.options.size},{element:getContent()}],orientation:'vertical'}).addClass('OxTabPanel');that.setElement(self.$panel);function getContent(){return self.isObject?self.options.content[self.selected]:self.options.content(self.selected);}
|
||
|
|
function getSelected(){var selected=self.options.tabs.filter(function(tab){return tab.selected;});return(selected.length?selected:self.options.tabs)[0].id;}
|
||
|
|
that.reloadPanel=function(){self.$panel.replaceElement(1,getContent());return that;};that.select=that.selectTab=function(id){if(Ox.getIndexById(self.options.tabs,id)>-1){self.$tabs.options({value:id});}
|
||
|
|
return that;};that.selected=function(){return self.selected;};return that;};'use strict';Ox.DocPage=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({item:{},replace:[]}).options(options||{}).css({overflow:'auto'});self.$toolbar=Ox.Bar({size:24});self.$homeButton=Ox.Button({title:'home',tooltip:Ox._('Home'),type:'image'}).css({float:'left',margin:'4px 2px 4px 4px'}).bindEvent({click:function(){that.triggerEvent('close');}}).appendTo(self.$toolbar);self.$title=Ox.Label({style:'square',title:self.options.item.name}).addClass('OxMonospace').css({float:'left',height:'13px',paddingTop:'1px',borderRadius:'4px',margin:'4px 2px 4px 2px'}).appendTo(self.$toolbar)
|
||
|
|
if(self.options.item.examples){self.$examplesMenu=Ox.MenuButton({items:self.options.item.examples,title:Ox._('Examples...'),}).css({float:'right',margin:'4px 4px 4px 2px'}).bindEvent({click:function(data){that.triggerEvent('example',{id:data.id});}}).appendTo(self.$toolbar);}
|
||
|
|
self.$page=Ox.Container().addClass('OxDocPage OxDocument OxSelectable');that.setElement(Ox.SplitPanel({elements:[{element:self.$toolbar,size:24},{element:self.$page}],orientation:'vertical'}).addClass('OxDocPage'));getItem(self.options.item,0).forEach(function($element){self.$page.append($element);});function getItem(item,level,name){Ox.Log('Core','getItem',item,level,name);var $elements=[Ox.$('<div>').css({paddingLeft:(level?level*32-16:0)+'px'}).html('<code><b>'+(name||item.name)+'</b> '
|
||
|
|
+'<'+item.types.join('></code> or <code><')+'> </code>'
|
||
|
|
+(item['class']?'(class: <code>'+item['class']+'</code>) ':'')
|
||
|
|
+(item['default']?'(default: <code>'+item['default']+'</code>) ':'')
|
||
|
|
+Ox.sanitizeHTML(item.summary))],sections=['description'].concat(item.order||['returns','arguments','properties']).concat(['events','tests','source']),index={events:sections.indexOf('events')+1+(item.inheritedproperties?item.inheritedproperties.length:0),properties:sections.indexOf('properties')+1||1};['properties','events'].forEach(function(key){var key_='inherited'+key;if(item[key_]){Array.prototype.splice.apply(sections,[index[key],0].concat(item[key_].map(function(v,i){var section=key+' inherited from <code>'
|
||
|
|
+v.name+'</code>';item[section]=v[key];return section;})));}});sections.forEach(function(section){var className='OxLine'+Ox.uid(),isExpanded=!Ox.contains(section,'inherited');if(item[section]){if(section=='description'){$elements.push(Ox.$('<div>').css({paddingTop:(level?0:8)+'px',borderTopWidth:level?0:'1px',marginTop:(level?0:8)+'px',marginLeft:(level*32)+'px'}).html(Ox.sanitizeHTML(item.description)));}else{$elements.push(Ox.$('<div>').css({paddingTop:(level?0:8)+'px',borderTopWidth:level?0:'1px',marginTop:(level?0:8)+'px',marginLeft:(level*32)+'px'}).append(Ox.$('<img>').attr({src:isExpanded?Ox.UI.getImageURL('symbolDown'):Ox.UI.getImageURL('symbolRight')}).css({width:'12px',height:'12px',margin:'0 4px -1px 0'}).on({click:function(){var $this=$(this),isExpanded=$this.attr('src')==Ox.UI.getImageURL('symbolRight');$this.attr({src:isExpanded?Ox.UI.getImageURL('symbolDown'):Ox.UI.getImageURL('symbolRight')});$('.'+className).each(function(){var $this=$(this),isHidden=false;$this[isExpanded?'removeClass':'addClass'](className+'Hidden');if(isExpanded){Ox.forEach(this.className.split(' '),function(v){if(/Hidden$/.test(v)){isHidden=true;return false;}});!isHidden&&$this.show();}else{$this.hide();}});}})).append(Ox.$('<span>').addClass('OxSection').html(Ox.contains(section,'inherited')?section[0].toUpperCase()+section.slice(1):Ox.toTitleCase(section=='returns'?'usage':section))));if(section=='tests'){item.tests.forEach(function(test){var isAsync=test.expected&&/(.+Ox\.test\()/.test(test.statement);$elements.push(Ox.$('<div>').addClass(className).css({marginLeft:(level*32+16)+'px'}).html('<code><b>> '
|
||
|
|
+Ox.encodeHTMLEntities(test.statement).replace(/ /g,' ').replace(/\n/g,'<br>\n ')
|
||
|
|
+'</b>'
|
||
|
|
+(test.passed===false&&isAsync?' <span class="OxFailed"> // actual: '
|
||
|
|
+Ox.encodeHTMLEntities(test.actual)
|
||
|
|
+'</span>':'')
|
||
|
|
+'</code>'));if(test.expected){$elements.push(Ox.$('<div>').addClass(className).css({marginLeft:(level*32+16)+'px'}).html('<code>'
|
||
|
|
+Ox.encodeHTMLEntities(test.passed===false&&!isAsync?test.actual:test.expected)
|
||
|
|
+(test.passed===false&&!isAsync?' <span class="OxFailed"> // expected: '
|
||
|
|
+Ox.encodeHTMLEntities(test.expected)
|
||
|
|
+'</span>':'')
|
||
|
|
+'</code>'));}});}else if(section=='source'){$elements.push(Ox.$('<div>').addClass(className).css({marginLeft:16+'px'}).html('<code><b>'
|
||
|
|
+self.options.item.file.replace(Ox.PATH,'')
|
||
|
|
+'</b>:'+self.options.item.line+'</code>'));$elements.push(Ox.SyntaxHighlighter({replace:self.options.replace,showLineNumbers:!self.options.stripComments,source:item.source,stripComments:self.options.stripComments,offset:self.options.item.line}).addClass(className).css({borderWidth:'1px',marginTop:'8px'}));}else{item[section].forEach(function(v){var name=section=='returns'?item.name+v.signature
|
||
|
|
+' </b></code>returns<code> <b>'
|
||
|
|
+(v.name||''):null;$elements=$elements.concat(Ox.map(getItem(v,level+1,name),function($element){$element.addClass(className);if(!isExpanded){$element.addClass(className+'Hidden').hide();}
|
||
|
|
return $element;}));});}}}});return $elements;}
|
||
|
|
return that;};'use strict';Ox.DocPanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({collapsible:false,element:null,examples:[],examplesPath:'',expanded:false,files:[],getModule:function(item){return item.file.replace(self.options.path,'');},getSection:function(item){return item.section;},items:[],path:'',references:null,replace:[],resizable:false,resize:[128,256,384],results:null,runTests:false,selected:'',showLoading:false,showTests:false,showTooltips:false,size:256,stripComments:false}).options(options||{}).update({selected:function(){selectItem(self.options.selected);}});self.$list=Ox.Element();self.$toolbar=Ox.Bar({size:24}).css({textAlign:'center'});self.$sidebar=Ox.SplitPanel({elements:[{element:Ox.Element()},{element:Ox.Element(),size:24}],orientation:'vertical'});self.$page=Ox.Element();self.$testsStatus=$('<div>').css({marginTop:'5px',textAlign:'center'}).appendTo(self.$toolbar);if(!self.options.results){self.options.results={};self.$testsButton=Ox.Button({title:Ox._('Run Tests')}).css({margin:'4px auto'}).bindEvent({click:runTests}).appendTo(self.$toolbar);self.$testsStatus.hide();}else{self.$testsStatus.html(formatResults());}
|
||
|
|
that.setElement(self.$panel=Ox.SplitPanel({elements:[{collapsible:self.options.collapsible,element:self.$sidebar,resizable:self.options.resizable,resize:self.options.resize,size:self.options.size},{element:self.$page}],orientation:'horizontal'}));if(self.options.files&&self.options.files.length){setTimeout(function(){self.options.showLoading&&showLoadingScreen();self.options.files=Ox.makeArray(self.options.files);self.options.items=Ox.doc(self.options.files.map(function(file){return self.options.path+file;}),function(docItems){self.options.items=docItems;getExamples(function(){self.options.showLoading&&hideLoadingScreen();self.$sidebar.replaceElement(1,self.$toolbar);renderList();self.options.runTests&&runTests();that.triggerEvent('load',{items:self.options.items});});});},250);}else{getExamples(function(){self.$sidebar.replaceElement(1,self.$toolbar);renderList();self.options.runTests&&runTests();});}
|
||
|
|
function formatResults(){var results=self.options.results[''],tests=results.passed+results.failed;return tests+' test'+(tests==1?'':'s')+', '
|
||
|
|
+results.passed+' passed, '+results.failed+' failed';}
|
||
|
|
function getExamples(callback){var i=0;if(self.options.examples&&self.options.examples.length){self.options.examples.forEach(function(example){var path=self.options.examplesPath+example;Ox.get(path+'/index.html',function(html){var match=html.match(/<title>(.+)<\/title>/),title=match?match[1]:Ox._('Untitled');Ox.get(path+'/js/example.js',function(js){var references=js.match(self.options.references);if(references){Ox.unique(references).forEach(function(reference){var item=getItemByName(reference);if(item){item.examples=(item.examples||[]).concat({id:example.split('/').pop(),title:title});}});}
|
||
|
|
if(++i==self.options.examples.length){self.options.items.forEach(function(item){if(item.examples){item.examples.sort(function(a,b){a=a.title.toLowerCase();b=b.title.toLowerCase();return a<b?-1:a>b?1:0;});}});callback();}});});});}else{callback();}}
|
||
|
|
function getIcon(id,expanded){var $icon=null,results=self.options.results[id];if(!Ox.isEmpty(self.options.results)){$icon=Ox.Theme.getColorImage('symbol'+(expanded===true?'Down':expanded===false?'Right':'Center'),!results?'':results.failed===0?'passed':'failed',self.options.showTooltips?getTooltip(results):null);}else if(!Ox.endsWith(id,'/')){$icon=$('<img>').attr({src:Ox.UI.getImageURL('symbolCenter')});}
|
||
|
|
return $icon;}
|
||
|
|
function getItemByName(name){var item=null;Ox.forEach(self.options.items,function(v){if(v.name==name){item=v;return false;}});return item;}
|
||
|
|
function getTooltip(results){return results?results.passed+' test'
|
||
|
|
+(results.passed==1?'':'s')+' passed'
|
||
|
|
+(results.failed?', '+results.failed+' test'
|
||
|
|
+(results.failed==1?'':'s')+' failed':''):'No tests';}
|
||
|
|
function hideLoadingScreen(){self.$loadingIcon.stop().remove();self.$loadingText.remove();}
|
||
|
|
function parseFiles(callback){var counter=0,docItems=[],length=self.options.files.length;self.options.files.forEach(function(file){Ox.doc(self.options.path+file,function(fileItems){docItems=docItems.concat(fileItems);++counter==length&&callback(docItems);});});}
|
||
|
|
function renderList(){var treeItems=[];self.options.items.forEach(function(docItem){var moduleIndex,results,sectionIndex;docItem.module=self.options.getModule(docItem);moduleIndex=Ox.getIndexById(treeItems,docItem.module+'/');if(moduleIndex==-1){treeItems.push({id:docItem.module+'/',items:[],title:docItem.module});moduleIndex=treeItems.length-1;}
|
||
|
|
docItem.section=self.options.getSection(docItem);if(docItem.section){sectionIndex=Ox.getIndexById(treeItems[moduleIndex].items,docItem.module+'/'+docItem.section+'/');if(sectionIndex==-1){treeItems[moduleIndex].items.push({id:docItem.module+'/'+docItem.section+'/',items:[],title:docItem.section});sectionIndex=treeItems[moduleIndex].items.length-1;}}
|
||
|
|
(docItem.section?treeItems[moduleIndex].items[sectionIndex]:treeItems[moduleIndex]).items.push({id:docItem.module+'/'+(docItem.section?docItem.section+'/':'')+docItem.name,title:docItem.name});});treeItems.sort(sortByTitle);treeItems.forEach(function(item){item.items.sort(sortByTitle);item.items.forEach(function(subitem){subitem.items.sort(sortByTitle);});});self.$list=Ox.TreeList({expanded:self.options.expanded,icon:self.options.showTests?getIcon:Ox.UI.getImageURL('symbolCenter'),items:treeItems,selected:self.options.selected?[self.options.selected]:'',width:self.options.size}).bindEvent({select:function(data){if(!data.ids[0]||!Ox.endsWith(data.ids[0],'/')){selectItem(data.ids[0]?data.ids[0].split('/').pop():'');}}});self.$sidebar.replaceElement(0,self.$list);selectItem(self.options.selected);}
|
||
|
|
function runTests(){self.$testsButton.remove();self.$testsStatus.html('Running Tests...').show();Ox.load({Geo:{},Image:{},Unicode:{}},function(){Ox.test(self.options.items,function(results){results.forEach(function(result){var item=getItemByName(result.name),passed=result.passed?'passed':'failed';item.tests[Ox.indexOf(item.tests,function(test){return test.statement==result.statement;})]=result;['',item.module+'/'].concat(item.section?item.module+'/'+item.section+'/':[],item.module+'/'+(item.section?item.section+'/':'')+item.name).forEach(function(key){self.options.results[key]=self.options.results[key]||{passed:0,failed:0};self.options.results[key][passed]++;});});self.$testsStatus.html(formatResults());renderList();that.triggerEvent('tests',{results:self.options.results});});});}
|
||
|
|
function selectItem(id){var item=id?getItemByName(id):null;if(item){self.options.selected=id;self.$list.options({selected:[item.module+'/'+(item.section?item.section+'/':'')+item.name]});self.$page=Ox.DocPage({item:item,replace:self.options.replace,stripComments:self.options.stripComments}).bindEvent({close:function(){selectItem();},example:function(data){that.triggerEvent('example',data);}});self.$panel.replaceElement(1,self.$page);}else{self.options.selected='';self.$list.options({selected:[]});self.$page.empty().append(self.options.element||$('<div>'));}
|
||
|
|
that.triggerEvent('select',{id:self.options.selected});}
|
||
|
|
function showLoadingScreen(){self.$loadingIcon=Ox.LoadingIcon({size:16}).css({position:'absolute',left:(self.$page.width()-self.options.size)/2-8,top:self.$page.height()/2-20}).appendTo(self.$page).start();self.$loadingText=$('<div>').addClass('OxLight').css({position:'absolute',left:(self.$page.width()-self.options.size)/2-128,top:self.$page.height()/2+4,width:256,textAlign:'center'}).html(Ox._('Generating Documentation...')).appendTo(self.$page);}
|
||
|
|
function sortByTitle(a,b){var a=Ox.stripTags(a.title).toLowerCase(),b=Ox.stripTags(b.title).toLowerCase();return a<b?-1:a>b?1:0;}
|
||
|
|
return that;};'use strict'
|
||
|
|
Ox.ExamplePage=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({html:'',js:'',references:[],replaceCode:[],replaceComment:[],selected:'source',title:''}).options(options||{}).update({selected:function(){self.$tabs.options({value:self.options.selected});}});self.$toolbar=Ox.Bar({size:24});self.$homeButton=Ox.Button({title:'home',tooltip:Ox._('Home'),type:'image'}).css({float:'left',margin:'4px 2px 4px 4px'}).bindEvent({click:function(){that.triggerEvent('close');}}).appendTo(self.$toolbar)
|
||
|
|
self.$title=Ox.Label({style:'square',title:self.options.title}).css({float:'left',borderRadius:'4px',margin:'4px 2px 4px 2px'}).appendTo(self.$toolbar);self.$openButton=Ox.Button({disabled:self.options.selected=='source',title:'open',tooltip:Ox._('Open in New Tab'),type:'image'}).css({float:'right',margin:'4px 4px 4px 2px'}).bindEvent({click:function(){window.open(self.options.html);}}).appendTo(self.$toolbar);self.$reloadButton=Ox.Button({disabled:self.options.selected=='source',title:'redo',tooltip:Ox._('Reload'),type:'image'}).css({float:'right',margin:'4px 2px 4px 2px'}).bindEvent({click:function(){self.$frame.attr({src:self.options.html});}}).appendTo(self.$toolbar);self.$switchButton=Ox.Button({disabled:self.options.selected=='source',title:'switch',tooltip:Ox._('Switch Theme'),type:'image'}).css({float:'right',margin:'4px 2px 4px 2px'}).bindEvent({click:function(){self.$frame[0].contentWindow.postMessage('Ox && Ox.Theme && Ox.Theme('
|
||
|
|
+'Ox.Theme() == "oxlight" ? "oxmedium"'
|
||
|
|
+' : Ox.Theme() == "oxmedium" ? "oxdark"'
|
||
|
|
+' : "oxlight"'
|
||
|
|
+')','*');}}).appendTo(self.$toolbar);self.$tabs=Ox.ButtonGroup({buttons:[{id:'source',title:Ox._('View Source'),width:80},{id:'live',title:Ox._('View Live'),width:80}],selectable:true,value:self.options.selected}).css({float:'right',margin:'4px 2px 4px 2px'}).bindEvent({change:function(data){var disabled=data.value=='source';self.options.selected=data.value;self.hasUI&&self.$switchButton.options({disabled:disabled});self.$reloadButton.options({disabled:disabled});self.$openButton.options({disabled:disabled});self.$content.animate({marginLeft:self.options.selected=='source'?0:-self.options.width+'px'},250,function(){if(self.options.selected=='live'&&!self.$frame.attr('src')){self.$frame.attr({src:self.options.html});}});that.triggerEvent('change',data);}}).appendTo(self.$toolbar);self.$viewer=Ox.SourceViewer({file:self.options.js,replaceCode:self.options.replaceCode,replaceComment:self.options.replaceComment}).css({position:'absolute',left:0,top:0,width:self.options.width+'px',height:self.options.height-24+'px'});self.$frame=Ox.Element('<iframe>').css({position:'absolute',left:self.options.width+'px',top:0,border:0}).attr({width:self.options.width,height:self.options.height});self.$content=Ox.Element().css({position:'absolute',width:self.options.width*2+'px',marginLeft:self.options.selected=='source'?0:-self.options.width+'px'}).append(self.$viewer).append(self.$frame);self.$container=Ox.Element().append(self.$content);that.setElement(Ox.SplitPanel({elements:[{element:self.$toolbar,size:24},{element:self.$container}],orientation:'vertical'}).addClass('OxExamplePage'));Ox.get(self.options.js,function(js){self.hasUI=/Ox\.load\(.+UI.+,/.test(js);!self.hasUI&&self.$switchButton.options({disabled:true});});Ox.$window.on({resize:function(){setSize();}});setTimeout(function(){setSize();if(self.options.selected=='live'){self.$frame.attr({src:self.options.html});}},100);function setSize(){self.options.width=that.width();self.options.height=that.height();self.$content.css({width:self.options.width*2+'px'})
|
||
|
|
self.$viewer.css({width:self.options.width+'px',height:self.options.height-24+'px'})
|
||
|
|
self.$frame.attr({width:self.options.width,height:self.options.height-24});}
|
||
|
|
return that;};'use strict';Ox.ExamplePanel=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({element:'',examples:[],mode:'source',path:'',references:null,replaceCode:[],replaceComment:[],selected:'',size:256}).options(options||{}).update({mode:function(){if(self.options.selected){self.$page.options({selected:self.options.mode});}},selected:function(){self.options.mode='source';selectItem(self.options.selected);}});self.$list=Ox.Element();self.$page=Ox.Element();that.setElement(self.$panel=Ox.SplitPanel({elements:[{element:self.$list,size:self.options.size},{element:self.$page}],orientation:'horizontal'}));loadItems(function(items){var treeItems=[];self.items=items;items.forEach(function(item){var sectionIndex=Ox.getIndexById(treeItems,item.section+'/');if(sectionIndex==-1){treeItems.push({id:item.section+'/',items:[],title:item.sectionTitle});sectionIndex=treeItems.length-1;}
|
||
|
|
treeItems[sectionIndex].items.push(item);});self.$list=Ox.TreeList({expanded:true,icon:Ox.UI.getImageURL('symbolCenter'),items:treeItems,selected:self.options.selected?[self.options.selected]:[],width:self.options.size}).bindEvent({select:function(data){if(!data.ids[0]||!Ox.endsWith(data.ids[0],'/')){self.options.mode='source';selectItem(data.ids[0]?data.ids[0].split('/').pop():'');}}});self.$panel.replaceElement(0,self.$list);selectItem(self.options.selected);that.triggerEvent('load',{items:self.items});});function getItemByName(name){var item=null;Ox.forEach(self.items,function(v){if(v.id.split('/').pop()==name){item=v;return false;}});return item;}
|
||
|
|
function loadItems(callback){var items=[];self.options.examples.forEach(function(example){var item={html:self.options.path+example+'/index.html',id:example,js:self.options.path+example+'/js/example.js',section:example.split('/').shift()};Ox.get(item.html,function(html){var match=html.match(/<title>(.+)<\/title>/);item.title=match?match[1]:'Untitled';match=html.match(/<meta http-equiv="Keywords" content="(.+)"\/>/);item.sectionTitle=match?match[1]:Ox._('Untitled');Ox.get(item.js,function(js){var references=js.match(self.options.references);item.references=references?Ox.unique(references).sort(function(a,b){a=a.toLowerCase();b=b.toLowerCase();return a<b?-1:a>b?1:0;}):[];items.push(item);if(items.length==self.options.examples.length){callback(items.sort(sortById));}});});});}
|
||
|
|
function selectItem(id){var item=id?getItemByName(id):null,selected=self.options.selected;if(item){self.options.selected=id;self.$list.options({selected:[item.section+'/'+id]});self.$page=Ox.ExamplePage({height:window.innerHeight,html:item.html,js:item.js,references:item.references,replaceCode:self.options.replaceCode,replaceComment:self.options.replaceComment,selected:self.options.mode,title:item.title,width:window.innerWidth-self.options.size}).bindEvent({change:function(data){that.triggerEvent('change',data);},close:function(){selectItem();}});self.$panel.replaceElement(1,self.$page);}else{self.options.selected='';self.$list.options({selected:[]});self.$page.empty().append(self.options.element);}
|
||
|
|
if(self.options.selected!=selected){that.triggerEvent('select',{id:self.options.selected});}}
|
||
|
|
function sortById(a,b){return a.id<b.id?-1:a.id>b.id?1:0;}
|
||
|
|
return that;};'use strict';Ox.SourceViewer=function(options,self){self=self||{};var that=Ox.Container({},self).defaults({file:'',replaceCode:[],replaceComment:[]}).options(options).addClass('OxSourceViewer');self.options.replaceComment.unshift([/<pre>([\s\S]+)<\/pre>/g,function(pre,text){var lines=trim(text).split('\n'),indent=Ox.min(lines.map(function(line){var match=line.match(/^\s+/);return match?match[0].length:0;}));return'<pre>'+lines.map(function(line){return line.slice(indent);}).join('\n')+'</pre>';}]);self.$table=$('<table>').appendTo(that.$content);Ox.get(self.options.file,function(source){var sections=[{comment:'',code:''}];Ox.tokenize(source).forEach(function(token,i){var type=token.type=='comment'&&token.value[2]!='@'?'comment':'code';if(!/^\/\/[^@]/.test(token.value)){if(type=='comment'){i&§ions.push({comment:'',code:''});token.value=Ox.parseMarkdown(trim(token.value.slice(2,-2)));self.options.replaceComment.forEach(function(replace){token.value=token.value.replace(replace[0],replace[1]);});}
|
||
|
|
Ox.last(sections)[type]+=token.value;}});sections.forEach(function(section){var $section=$('<tr>').appendTo(self.$table),$comment=$('<td>').addClass('OxComment OxSerif OxSelectable').html(Ox.addLinks(section.comment,true)).appendTo($section),$code=$('<td>').addClass('OxCode').append(Ox.SyntaxHighlighter({replace:self.options.replaceCode,source:trim(section.code)})).appendTo($section);});setTimeout(function(){var height=that.height();if(self.$table.height()<height){self.$table.css({height:height+'px'});}},100);});function trim(str){return str.replace(/^\s*\n/,'').replace(/\n\s*$/,'');}
|
||
|
|
return that;};'use strict';Ox.SyntaxHighlighter=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({file:'',lineLength:0,offset:1,replace:[],showLinebreaks:false,showLineNumbers:false,showTabs:false,showWhitespace:false,source:'',stripComments:false,tabSize:4}).options(options||{}).update(renderSource).addClass('OxSyntaxHighlighter');if(self.options.file){Ox.get(self.options.file,function(source){self.options.source=source;renderSource();});}else{renderSource();}
|
||
|
|
function renderSource(){var $lineNumbers,$line,$source,width,lines,source='',tokens,linebreak=(self.options.showLinebreaks?'<span class="OxLinebreak">\u21A9</span>':'')+'<br/>',tab=(self.options.showTabs?'<span class="OxTab">\u2192</span>':'')+Ox.repeat(' ',self.options.tabSize-self.options.showTabs),whitespace=self.options.showWhitespace?'\u00B7':' ';tokens=Ox.isArray(self.options.source)?self.options.source:Ox.tokenize(self.options.source);tokens.forEach(function(token,i){var classNames,type=token.type=='identifier'?Ox.identify(token.value):token.type;if(!(self.options.stripComments&&type=='comment')){classNames='Ox'+Ox.toTitleCase(type);if(self.options.showWhitespace&&type=='whitespace'){if(isAfterLinebreak()&&hasIrregularSpaces()){classNames+=' OxLeading';}else if(isBeforeLinebreak()){classNames+=' OxTrailing';}}
|
||
|
|
source+='<span class="'+classNames+'">'+Ox.encodeHTMLEntities(token.value).replace(/ /g,whitespace).replace(/\t/g,tab).replace(/\n/g,linebreak)+'</span>';}
|
||
|
|
function isAfterLinebreak(){return i==0||tokens[i-1].type=='linebreak';}
|
||
|
|
function isBeforeLinebreak(){return i==tokens.length-1||tokens[i+1].type=='linebreak';}
|
||
|
|
function hasIrregularSpaces(){return token.value.split('').reduce(function(prev,curr){return prev+(curr==' '?1:0);},0)%self.options.tabSize;}});lines=source.split('<br/>');that.empty();if(self.options.showLineNumbers){$lineNumbers=Ox.Element().addClass('OxLineNumbers').html(Ox.range(lines.length).map(function(line){return(line+self.options.offset);}).join('<br/>')).appendTo(that);}
|
||
|
|
self.options.replace.forEach(function(replace){source=source.replace(replace[0],replace[1])});$source=Ox.Element().addClass('OxSourceCode OxSelectable').html(source).appendTo(that);if(self.options.lineLength){$line=Ox.Element().css({position:'absolute',top:'-1000px'}).html(Ox.repeat(' ',self.options.lineLength)).appendTo(that);width=$line.width()+4;$line.remove();['moz','webkit'].forEach(function(browser){$source.css({background:'-'+browser+'-linear-gradient(left, rgb(255, 255, 255) '+width+'px, rgb(192, 192, 192) '+width+'px, rgb(255, 255, 255) '+(width+1)+'px)'});});}}
|
||
|
|
return that;};'use strict';Ox.ImageElement=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({height:0,src:'',width:0}).options(options||{}).update({height:function(){!self.isAuto&&setSizes();},src:loadImage,width:function(){!self.isAuto&&setSizes();}}).addClass('OxImageElement');self.isAuto=!self.options.width&&!self.options.height;self.$screen=Ox.LoadingScreen({height:self.options.height,size:16,width:self.options.width}).start().appendTo(that);loadImage();!self.isAuto&&setSizes();function loadImage(){if(self.$image){self.$image.off({load:showImage}).remove();}
|
||
|
|
self.$image=$('<img>').one({error:stopLoading,load:showImage}).attr({src:self.options.src});}
|
||
|
|
function setSizes(){var css={width:self.options.width,height:self.options.height};self.$screen&&self.$screen.options(css);css=Ox.map(css,function(value){return value+'px';});that.css(css);self.$image.css(css);}
|
||
|
|
function showImage(){self.$screen.stop().remove();self.$image.appendTo(that);that.triggerEvent('load');}
|
||
|
|
function stopLoading(){self.$screen.stop();}
|
||
|
|
that.css=function(css){that.$element.css(css);self.$screen&&self.$screen.css(css);self.$image.css(css);return that;};return that;};'use strict';Ox.ImageViewer=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({area:[],center:'auto',elasticity:0,height:384,imageHeight:0,imagePreviewURL:'',imageURL:'',imageWidth:0,maxZoom:16,overviewSize:128,width:512,zoom:'fit'}).options(options||{}).update({area:function(){if(self.options.area&&self.options.area.length==4){var centerAndZoom=getCenterAndZoom(self.options.area);self.options.center=centerAndZoom.center;self.options.zoom=centerAndZoom.zoom;setCenterAndZoom(true,true);}},center:function(){setCenterAndZoom(true,true);},height:updateSize,width:updateSize,zoom:function(){setCenterAndZoom(true,true);}}).addClass('OxImageViewer OxGrid').on({mousedown:function(){that.gainFocus();},mouseenter:function(){showInterface();},mouseleave:function(){hideInterface();},mousemove:function(){showInterface();hideInterface();}}).bindEvent({doubleclick:onDoubleclick,dragstart:onDragstart,drag:onDrag,dragend:onDragend,key_0:function(){that.options({zoom:1});},key_1:function(){that.options({center:'auto',zoom:'fit'});},key_2:function(){that.options({center:'auto',zoom:'fill'});},key_down:function(){that.options({center:[self.center[0],self.center[1]+self.options.height/2/self.zoom]});},key_equal:function(){that.options({zoom:self.zoom*2});},key_left:function(){that.options({center:[self.center[0]-self.options.width/2/self.zoom,self.center[1]]});},key_minus:function(){that.options({zoom:self.zoom/2});},key_right:function(){that.options({center:[self.center[0]+self.options.width/2/self.zoom,self.center[1]]});},key_up:function(){that.options({center:[self.center[0],self.center[1]-self.options.height/2/self.zoom]});},mousewheel:onMousewheel,singleclick:onSingleclick});if(self.options.area&&self.options.area.length==4){var centerAndZoom=getCenterAndZoom(self.options.area);self.options.center=centerAndZoom.center;self.options.zoom=centerAndZoom.zoom;}self.imageRatio=self.options.imageWidth/self.options.imageHeight;self.overviewHeight=Math.round(self.options.overviewSize/(self.imageRatio>1?self.imageRatio:1));self.overviewWidth=Math.round(self.options.overviewSize*(self.imageRatio>1?1:self.imageRatio));self.overviewZoom=self.overviewWidth/self.options.imageWidth;self.$image=Ox.Element('<img>').addClass('OxImage').attr({src:self.options.imagePreviewURL}).appendTo(that);Ox.$('<img>').one({load:function(){self.$image.attr({src:self.options.imageURL});}}).attr({src:self.options.imageURL});self.$scaleButton=Ox.ButtonGroup({buttons:[{id:'fit',title:'fit',tooltip:Ox._('Zoom to Fit')+' <span class="OxBright">[1]</span>'},{id:'fill',title:'fill',tooltip:Ox._('Zoom to Fill')+' <span class="OxBright">[2]</span>'}],style:'overlay',type:'image'}).addClass('OxInterface OxScaleButton').on({mouseenter:function(){self.mouseIsInInterface=true;},mouseleave:function(){self.mouseIsInInterface=false;}}).bindEvent({click:function(data){that.options({center:'auto',zoom:data.id});}}).appendTo(that);self.$zoomButton=Ox.ButtonGroup({buttons:[{id:'out',title:'remove',tooltip:Ox._('Zoom Out')+' <span class="OxBright">[-]</span>'},{id:'original',title:'equal',tooltip:Ox._('Original Size')+' <span class="OxBright">[0]</span>'},{id:'in',title:'add',tooltip:Ox._('Zoom In')+' <span class="OxBright">[=]</span>'}],style:'overlay',type:'image'}).addClass('OxInterface OxZoomButton').on({mouseenter:function(){self.mouseIsInInterface=true;},mouseleave:function(){self.mouseIsInInterface=false;}}).bindEvent({click:function(data){if(data.id=='out'){that.options({zoom:self.zoom/2});}else if(data.id=='original'){that.options({zoom:1});}else{that.options({zoom:self.zoom*2});}}}).appendTo(that);self.$overview=Ox.Element().addClass('OxInterface OxImageOverview').css({height:self.overviewHeight+'px',width:self.overviewWidth+'px'}).hide().on({mouseenter:function(){self.mouseIsInInterface=true;},mouseleave:function(){self.mouseIsInInterface=false;}}).appendTo(that);self.$overviewImage=Ox.Element('<img>').attr({src:self.options.im
|
||
|
|
function getArea(center,zoom){center=Ox.clone(center);zoom=Ox.clone(zoom);self.viewerRatio=self.options.width/self.options.height;self.imageIsWider=self.imageRatio>self.viewerRatio;if(center=='auto'){center=[Math.round(self.options.imageWidth/2),Math.round(self.options.imageHeight/2)];}
|
||
|
|
if(zoom=='fit'){zoom=self.imageIsWider?self.options.width/self.options.imageWidth:self.options.height/self.options.imageHeight;}else if(zoom=='fill'){zoom=self.imageIsWider?self.options.height/self.options.imageHeight:self.options.width/self.options.imageWidth;}
|
||
|
|
return[Math.max(center[0]-self.options.width/2/zoom,0),Math.max(center[1]-self.options.height/2/zoom,0),Math.min(center[0]+self.options.width/2/zoom,self.options.imageWidth),Math.min(center[1]+self.options.height/2/zoom,self.options.imageHeight)];}
|
||
|
|
function getCenter(e){var $target=$(e.target),center,offset,offsetX,offsetY;if($target.is('.OxImage')){center=[e.offsetX/self.zoom,e.offsetY/self.zoom];}else if($target.is('.OxImageOverlayArea')){offset=that.offset();offsetX=e.clientX-offset.left-self.options.width
|
||
|
|
+self.overviewWidth+6;offsetY=e.clientY-offset.top-self.options.height
|
||
|
|
+self.overviewHeight+6;center=[offsetX/self.overviewZoom,offsetY/self.overviewZoom];}
|
||
|
|
return center;}
|
||
|
|
function getCenterAndZoom(area){if(!area||!area.length){return{center:'auto',zoom:'fit'};}
|
||
|
|
var areaWidth=area[2]-area[0],areaHeight=area[3]-area[1],areaRatio=areaWidth/areaHeight;self.viewerRatio=self.options.width/self.options.height;return{center:[(area[0]+area[2])/2,(area[1]+area[3])/2],zoom:self.viewerRatio<areaRatio?self.options.width/areaWidth:self.options.height/areaHeight};}
|
||
|
|
function getImageCSS(){return{left:Math.round(self.options.width/2-self.center[0]*self.zoom)+'px',top:Math.round(self.options.height/2-self.center[1]*self.zoom)+'px',width:Math.round(self.options.imageWidth*self.zoom)+'px',height:Math.round(self.options.imageHeight*self.zoom)+'px'};}
|
||
|
|
function getOverlayCSS(){var centerLeft=self.center[0]/self.options.imageWidth*self.overviewWidth,centerTop=self.center[1]/self.options.imageHeight*self.overviewHeight,centerWidth=self.options.width/self.zoom*self.overviewZoom+4,centerHeight=self.options.height/self.zoom*self.overviewZoom+4;return{left:Math.round(centerLeft-centerWidth/2-self.overviewWidth)+'px',top:Math.round(centerTop-centerHeight/2-self.overviewHeight)+'px',width:Math.round(2*self.overviewWidth+centerWidth)+'px',height:Math.round(2*self.overviewHeight+centerHeight)+'px'};}
|
||
|
|
function getZoomCenter(e,factor){var center=getCenter(e),delta=[center[0]-self.center[0],center[1]-self.center[1]];if(factor==0.5){factor=-1;}
|
||
|
|
return[self.center[0]+delta[0]/factor,self.center[1]+delta[1]/factor];}
|
||
|
|
function hideInterface(){clearTimeout(self.interfaceTimeout);self.interfaceTimeout=setTimeout(function(){if(!self.mouseIsInInterface){self.interfaceIsVisible=false;self.$scaleButton.animate({opacity:0},250);self.$zoomButton.animate({opacity:0},250);self.$overview.animate({opacity:0},250);}},2500);}
|
||
|
|
function limitCenter(elastic){var center,imageHeight,imageWidth,maxCenter,minCenter;if(self.options.zoom=='fill'){imageWidth=self.imageIsWider?self.options.height*self.imageRatio:self.options.width;imageHeight=self.imageIsWider?self.options.height:self.options.width/self.imageRatio;}else if(self.options.zoom=='fit'){imageWidth=self.imageIsWider?self.options.width:self.options.height*self.imageRatio;imageHeight=self.imageIsWider?self.options.width/self.imageRatio:self.options.height;}else{imageWidth=self.options.imageWidth*self.options.zoom;imageHeight=self.options.imageHeight*self.options.zoom;}
|
||
|
|
minCenter=[imageWidth>self.options.width?self.options.width/2/self.zoom:self.options.imageWidth/2,imageHeight>self.options.height?self.options.height/2/self.zoom:self.options.imageHeight/2].map(function(value){return elastic?value-self.options.elasticity/self.zoom:value;});maxCenter=[self.options.imageWidth-minCenter[0],self.options.imageHeight-minCenter[1]];center=self.options.center=='auto'?[self.options.imageWidth/2,self.options.imageHeight/2]:[Ox.limit(self.options.center[0],minCenter[0],maxCenter[0]),Ox.limit(self.options.center[1],minCenter[1],maxCenter[1])];if(Ox.isArray(self.options.center)){self.options.center=center;}
|
||
|
|
return center;}
|
||
|
|
function limitZoom(elastic){var imageSize=self.imageIsWider?self.options.imageWidth:self.options.imageHeight,minZoom=elastic?(self.fitZoom*imageSize-2*self.options.elasticity)/imageSize:self.fitZoom,maxZoom=elastic?(self.maxZoom*imageSize+2*self.options.elasticity)/imageSize:self.maxZoom,zoom=self.options.zoom=='fill'?self.fillZoom:self.options.zoom=='fit'?self.fitZoom:Ox.limit(self.options.zoom,minZoom,maxZoom);if(Ox.isNumber(self.options.zoom)){self.options.zoom=zoom;}
|
||
|
|
return zoom;}
|
||
|
|
function onDoubleclick(e){var $target=$(e.target),factor=e.shiftKey?0.5:2;if(($target.is('.OxImage')||$target.is('.OxImageOverlayArea'))&&((!e.shiftKey&&self.zoom<self.maxZoom)||(e.shiftKey&&self.zoom>self.fitZoom))){that.options({center:getZoomCenter(e,factor),zoom:self.zoom*factor});}}
|
||
|
|
function onDragstart(e){var $target=$(e.target);if($target.is('.OxImage')||$target.is('#OxImageOverlayCenter')){self.drag={center:self.center,zoom:$target.is('.OxImage')?self.zoom:-self.overviewZoom};}}
|
||
|
|
function onDrag(e){if(self.drag){self.options.center=[self.drag.center[0]-e.clientDX/self.drag.zoom,self.drag.center[1]-e.clientDY/self.drag.zoom];setCenterAndZoom(false,true);}}
|
||
|
|
function onDragend(){if(self.drag){self.drag=null;setCenterAndZoom(true);}}
|
||
|
|
function onMousewheel(e){var $target=$(e.target),factor=e.deltaY>0?2:0.5;if(e.deltaX==0&&Math.abs(e.deltaY)&&!self.mousewheelTimeout){if($target.is('.OxImage')||$target.is('.OxImageOverlayArea')){self.options.center=getZoomCenter(e,factor);self.options.zoom=self.zoom*factor;setCenterAndZoom(true,true);self.mousewheelTimeout=setTimeout(function(){self.mousewheelTimeout=null;},250);}}}
|
||
|
|
function onSingleclick(e){var $target=$(e.target),offset,offsetX,offsetY;if($target.is('.OxImage')||$target.is('.OxImageOverlayArea')){that.options({center:getCenter(e)});}}
|
||
|
|
function setCenterAndZoom(animate,elastic){self.zoom=limitZoom(elastic);self.center=limitCenter(elastic);if(animate){self.$image.stop().animate(getImageCSS(),250,function(){var center=limitCenter(),zoom=limitZoom(),setCenter=center[0]!=self.center[0]||center[1]!=self.center[1],setZoom=zoom!=self.zoom;if(setCenter||setZoom){self.options.center=center;self.options.zoom=zoom;setCenterAndZoom();}
|
||
|
|
that.triggerEvent({center:{center:self.options.center},zoom:{zoom:self.options.zoom}});});self.$overlay.stop().animate(getOverlayCSS(),250);}else{self.$image.css(getImageCSS());self.$overlay.css(getOverlayCSS());}
|
||
|
|
updateInterface();showInterface();hideInterface();}
|
||
|
|
function setSize(){self.viewerRatio=self.options.width/self.options.height;self.imageIsWider=self.imageRatio>self.viewerRatio;self.fillZoom=(self.imageIsWider?self.options.height*self.imageRatio:self.options.width)/self.options.imageWidth;self.fitZoom=(self.imageIsWider?self.options.width:self.options.height*self.imageRatio)/self.options.imageWidth;self.maxZoom=Math.max(self.fillZoom,self.options.maxZoom);that.css({width:self.options.width+'px',height:self.options.height+'px'});setCenterAndZoom();}
|
||
|
|
function showInterface(){clearTimeout(self.interfaceTimeout);if(!self.interfaceIsVisible){self.interfaceIsVisible=true;self.$scaleButton.animate({opacity:1},250);self.$zoomButton.animate({opacity:1},250);self.$overview.animate({opacity:1},250);}}
|
||
|
|
function updateInterface(){var isFitZoom=self.zoom==self.fitZoom;self.$scaleButton[isFitZoom?'disableButton':'enableButton']('fit');self.$scaleButton[self.zoom==self.fillZoom&&self.center[0]==self.options.imageWidth/2&&self.center[1]==self.options.imageHeight/2?'disableButton':'enableButton']('fill');self.$zoomButton[isFitZoom?'disableButton':'enableButton']('out');self.$zoomButton[self.zoom==1?'disableButton':'enableButton']('original');self.$zoomButton[self.zoom==self.maxZoom?'disableButton':'enableButton']('in');!isFitZoom&&self.$overview.show();self.$overview.stop().animate({opacity:isFitZoom?0:1},250,function(){isFitZoom&&self.$overview.hide();});}
|
||
|
|
function updateSize(){if(!self.updateTimeout){self.updateTimeout=setTimeout(function(){self.updateTimeout=null;setSize();});}}
|
||
|
|
that.getArea=function(){return getArea(self.options.center,self.options.zoom);};that.setArea=function(area){var centerAndZoom=getCenterAndZoom(area);that.options({center:centerAndZoom.center,zoom:centerAndZoom.zoom});return that;};return that;};'use strict';Ox.AudioElement=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({autoplay:false,preload:'none',src:''}).options(options||{}).update({src:function(){self.audio.src=self.options.src;}});self.loadedMetadata=false;self.paused=true;self.$audio=$('<audio>').attr({src:self.options.src}).on({ended:function(){that.triggerEvent('ended');},loadedmetadata:function(){that.triggerEvent('loadedmetadata',{duration:self.audio.duration});},seeked:function(){that.triggerEvent('seeked');},seeking:function(){that.triggerEvent('seeking');}}).appendTo(that);self.audio=self.$audio[0];function getset(key,value){var ret;if(Ox.isUndefined(value)){ret=self.audio[key];}else{self.audio[key]=value;ret=that;}
|
||
|
|
return ret;}
|
||
|
|
that.currentTime=function(){var ret;self.ended=false;if(arguments.length==0){ret=self.audio.currentTime;}else{self.audio.currentTime=arguments[0];ret=that;}
|
||
|
|
return ret;};that.pause=function(){self.paused=true;self.audio.pause();return that;};that.play=function(){if(self.ended){that.currentTime(0);self.ended=false;}
|
||
|
|
self.paused=false;self.audio.play();return that;};that.src=function(){var ret;if(arguments.length==0){ret=self.audio.src;}else{self.options.src=arguments[0];self.audio.src=self.options.src;ret=that;}
|
||
|
|
return ret;};that.volume=function(value){return getset('volume',arguments[0]);};return that;};'use strict';Ox.AudioPlayer=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({audio:[],muted:false,paused:false,position:0,repeat:0,shuffle:false,time:'elapsed',track:0,volume:1,width:512}).options(options||{}).update({audio:function(){self.options.position=-1;self.options.track=-1;that.options({paused:true,position:0,track:0});},muted:function(){self.options.muted=!self.options.muted;toggleMuted();},paused:function(){self.options.paused=!self.options.paused;togglePaused();},position:function(){setPosition(self.options.position);},repeat:function(){setRepeat(self.options.repeat);},shuffle:function(){self.options.shuffle=!self.options.shuffle;toggleShuffle();},time:function(){self.options.time=self.options.time=='elapsed'?'remaining':'elapsed';toggleTime();},track:function(){setTrack(self.options.track);},volume:function(){setVolume(self.options.volume);},width:setSizes}).addClass('OxAudioPlayer').css({width:self.options.width+'px'}).bindEvent({key_0:toggleMuted,key_equal:function(){setVolume(Ox.min(self.options.volume+0.1,1));},key_minus:function(){setVolume(Ox.max(self.options.volume-0.1,0));},key_space:togglePaused});self.tracks=self.options.audio.length;self.volume=self.options.muted?1:self.options.volume;self.$listButton=Ox.MenuButton({items:self.options.audio.slice(Math.max(self.options.track-10,0),Math.min(self.options.track+11,self.tracks)).map(function(track,index){index+=Math.max(self.options.track-10,0);return{id:index.toString(),title:formatTrack(track),checked:index==self.options.track};}),maxWidth:256,overlap:'left',title:'select',type:'image'}).addClass('OxListButton').appendTo(that);self.$shuffleButton=Ox.Button(Ox.extend({overlap:'left',type:'image'},getButtonOptions('shuffle'))).addClass('OxShuffleButton').bindEvent({click:toggleShuffle}).appendTo(that);self.$repeatButton=Ox.Button(Ox.extend({overlap:'left',type:'image'},getButtonOptions('repeat'))).addClass('OxRepeatButton').bindEvent({click:function(){setRepeat(self.options.repeat==0?-1:self.options.repeat==-1?1:0);}}).appendTo(that);self.$trackLabel=Ox.Label({textAlign:'center',title:'',}).addClass('OxTrackLabel').appendTo(that);self.$playButtons=Ox.ButtonGroup({buttons:[{id:'current',title:'playPrevious',tooltip:Ox._('Play Current Track')},Ox.extend({id:'play'},getButtonOptions('play')),{id:'next',title:'playNext',tooltip:Ox._('Play Next Track')}],overlap:'right',type:'image',}).addClass('OxPlayButtons').bindEvent({click:function(data){if(data.id=='current'){setPosition(0);}else if(data.id=='play'){togglePaused();}else if(data.id=='next'){playNext();}}}).appendTo(that);self.$positionLabel=Ox.Label({textAlign:'center',title:'00:00:00',tooltip:Ox._('Show Remaining Time'),width:80}).addClass('OxPositionLabel').bindEvent({anyclick:toggleTime}).appendTo(that);self.$positionSlider=Ox.Range({changeOnDrag:true,max:1,min:0,step:0.0000001,}).addClass('OxPositionSlider').bindEvent({change:function(data){setPosition(data.value*self.duration);}}).appendTo(that);self.$muteButton=Ox.Button({overlap:'right',title:'mute',tooltip:Ox._('Mute'),type:'image'}).addClass('OxMuteButton').bindEvent({click:toggleMuted}).appendTo(that);self.$volumeLabel=Ox.Label({textAlign:'center',title:' 100%',width:46}).addClass('OxVolumeLabel').bindEvent({anyclick:function(){setVolume(1);}}).appendTo(that);self.$volumeSlider=Ox.Range({changeOnDrag:true,max:1,min:0,size:116,step:0.01,value:self.options.volume,}).addClass('OxVolumeSlider').bindEvent({change:function(data){setVolume(data.value);}}).appendTo(that);self.$audio=Ox.AudioElement({src:self.options.audio[self.options.track].file}).bindEvent({ended:function(){playNext();},loadedmetadata:function(data){self.duration=data.duration;}}).appendTo(that);setTrack(self.options.track);function formatTrack(data){return[data.name,data.artist,data.album,data.year].join(' · ');}
|
||
|
|
function getButtonOptions(id){var options;if(id=='mute'){options=self.options.muted||self.options.volume==0?{title:'unmute',tooltip:Ox._('Unmute')}:self.options.volume<1/3?{title:'volumeUp',tooltip:Ox._('Mute')}:self.options.volume<2/3?{title:'volumeDown',tooltip:Ox._('Mute')}:{title:'mute',tooltip:Ox._('Mute')};}else if(id=='play'){options=self.options.paused?{title:'play',tooltip:Ox._('Play')}:{title:'pause',tooltip:Ox._('Pause')};}else if(id=='repeat'){options=self.options.repeat==0?{title:'repeatNone',tooltip:Ox._('Repeat All')}:self.options.repeat==-1?{title:'repeatAll',tooltip:Ox._('Repeat One')}:{title:'repeatOne',tooltip:Ox._('Repeat None')};}else if(id=='shuffle'){options=self.options.shuffle?{title:'shuffleAll',tooltip:Ox._('Don\'t Shuffle')}:{title:'shuffleNone',tooltip:Ox._('Shuffle')};}
|
||
|
|
return options;}
|
||
|
|
function getNextTrack(){return self.options.repeat==1?self.options.track:self.options.track<self.tracks-1?self.options.track+1:self.options.repeat==-1?0:null;}
|
||
|
|
function playing(){self.options.position=self.$audio.currentTime();setPosition(self.options.position,'audio')
|
||
|
|
that.triggerEvent('playing',{position:self.options.position});}
|
||
|
|
function playNext(){var track=getNextTrack();if(track===null){}else{setTrack(track);}}
|
||
|
|
function setPosition(position,from){self.options.position=position;if(from!='audio'){self.$audio.currentTime(position);}
|
||
|
|
self.$positionSlider.options({value:position/self.duration});setTime();}
|
||
|
|
function setRepeat(repeat){self.options.repeat=repeat;self.$repeatButton.options(getButtonOptions('repeat'));}
|
||
|
|
function setSizes(){that.css({width:self.options.width+'px'});self.$trackLabel.options({width:self.options.width-46});self.$positionSlider.options({size:self.options.width-262});self.$positionLabel.css({left:self.options.width-232+'px'});self.$volumeLabel.css({left:self.options.width-46+'px'})}
|
||
|
|
function setTime(){self.$positionLabel.options({title:Ox.formatDuration(self.options.time=='elapsed'?self.options.position:self.options.audio[self.options.track].duration
|
||
|
|
-self.options.position)});}
|
||
|
|
function setTrack(track){self.options.track=track;self.$trackLabel.options({title:formatTrack(self.options.audio[track])});self.$audio.options({src:self.options.audio[self.options.track].file});!self.options.paused&&self.$audio.play();that.triggerEvent('track',{track:self.options.track});}
|
||
|
|
function setVolume(volume){self.options.volume=volume;if(volume>0){self.volume=volume;}
|
||
|
|
self.$audio.volume(volume);self.$muteButton.options(getButtonOptions('mute'));self.$volumeSlider.options({value:volume});self.$volumeLabel.options({title:' '+Math.round(volume*100)+'%'});}
|
||
|
|
function toggleMuted(){self.options.muted=!self.options.muted;setVolume(self.options.muted?0:self.volume);}
|
||
|
|
function togglePaused(){self.options.paused=!self.options.paused;self.$playButtons.buttonOptions('play',getButtonOptions('play'));if(self.options.paused){self.$audio.pause();clearInterval(self.playInterval);}else{self.$audio.play();self.playInterval=setInterval(playing,100);}
|
||
|
|
that.triggerEvent('paused',{paused:self.options.paused});}
|
||
|
|
function toggleShuffle(){self.options.shuffle=!self.options.shuffle;self.$shuffleButton.options(getButtonOptions('shuffle'))}
|
||
|
|
function toggleTime(){self.options.time=self.options.time=='remaining'?'elapsed':'remaining';setTime();}
|
||
|
|
return that;};'use strict';Ox.LeafletMap=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({clickable:false,editable:false,find:'',findPlaceholder:'Find',keys:[],markerColor:'auto',markerSize:'auto',markerTooltip:function(place){return place.name||'<span class="OxLight">Unnamed</span>';},maxMarkers:100,places:null,selected:'',showControls:false,showLabels:false,showStatusbar:false,showToolbar:false,showZoombar:false,zoomOnlyWhenFocused:false}).options(options||{}).update({find:function(){self.$findInput.value(self.options.find).triggerEvent('submit',{value:self.options.find});},height:function(){that.css({height:self.options.height+'px'});that.resizeMap();},places:function(){if(Ox.isArray(self.options.places)){self.options.places.forEach(function(place){if(Ox.isUndefined(place.id)){place.id=Ox.encodeBase32(Ox.uid());}});if(self.options.selected&&!Ox.getObjectById(self.options.places,self.options.selected)){self.options.selected='';selectPlace(null);}
|
||
|
|
self.options.places=Ox.api(self.options.places,{geo:true,sort:'-area'});}
|
||
|
|
self.loaded&&getMapBounds(function(mapBounds){if(mapBounds){self.map.fitBounds(mapBounds);}else{self.map.setZoom(self.minZoom);self.map.setCenter([0,0]);}
|
||
|
|
self.boundsChanged=true;mapChanged();self.options.selected&&selectPlace(self.options.selected);});},selected:function(){selectPlace(self.options.selected||null);},type:function(){},width:function(){that.css({width:self.options.width+'px'});that.resizeMap();}}).addClass('OxMap').bindEvent({gainfocus:function(){self.options.zoomOnlyWhenFocused&&self.map.setOptions({scrollwheel:true});},losefocus:function(){self.options.zoomOnlyWhenFocused&&self.map.setOptions({scrollwheel:false});},key_0:function(){panToPlace()},key_c:toggleControls,key_down:function(){pan(0,1);},key_enter:pressEnter,key_escape:pressEscape,key_equal:function(){zoom(1);},key_l:toggleLabels,key_left:function(){pan(-1,0);},'key_meta':function(){self.metaKey=true;$(document).one({keyup:function(){self.metaKey=false;}});},key_minus:function(){zoom(-1);},key_right:function(){pan(1,0);},key_shift:function(){self.shiftKey=true;$(document).one({keyup:function(){self.shiftKey=false;}});},key_shift_down:function(){pan(0,2);},key_shift_0:function(){zoomToPlace();},key_shift_equal:function(){zoom(2);},key_shift_left:function(){pan(-2,0);},key_shift_minus:function(){zoom(-2);},key_shift_right:function(){pan(2,0);},key_shift_up:function(){pan(0,-2);},key_up:function(){pan(0,-1);},key_z:undo,mousedown:function(e){!$(e.target).is('input')&&that.gainFocus();}});options&&['statusbar','toolbar','zoombar'].forEach(function(key){if(options[key]){self.options['show'+Ox.toTitleCase(key)]=options[key];}});if(Ox.isArray(self.options.places)){self.options.places.forEach(function(place){if(Ox.isUndefined(place.id)){place.id=Ox.encodeBase32(Ox.uid());}});self.options.places=Ox.api(self.options.places,{geo:true,sort:'-area'});}
|
||
|
|
self.mapHeight=getMapHeight();self.metaKey=false;self.minZoom=getMinZoom();self.placeKeys=['id','name','alternativeNames','geoname','countryCode','type','lat','lng','south','west','north','east','area','editable'].concat(self.options.keys);self.places=[],self.resultPlace=null;self.scaleMeters=[50000000,20000000,10000000,5000000,2000000,1000000,500000,200000,100000,50000,20000,10000,5000,2000,1000,500,200,100,50,20,10];self.shiftKey=false,self.tileSize=256;if(self.options.showToolbar){self.$toolbar=Ox.Bar({size:24}).appendTo(that);self.$menu=Ox.MenuButton({items:[{id:'toggleLabels',title:self.options.showLabels?[Ox._('Hide Labels'),Ox._('Show Labels')]:[Ox._('Show Labels'),Ox._('Hide Labels')],keyboard:'l'},{id:'toggleControls',title:self.options.showControls?[Ox._('Hide Controls'),Ox._('Show Controls')]:[Ox._('Show Controls'),Ox._('Hide Controls')],keyboard:'c'}],title:'set',tooltip:Ox._('Map Options'),type:'image'}).css({float:'left',margin:'4px'}).bindEvent({click:function(data){if(data.id=='toggleLabels'){toggleLabels();}else if(data.id=='toggleControls'){toggleControls();}}}).appendTo(self.$toolbar);self.$findInput=Ox.Input({clear:true,placeholder:self.options.findPlaceholder,width:192}).css({float:'right',margin:'4px 4px 4px 2px'}).bindEvent({submit:submitFind}).appendTo(self.$toolbar);self.$loadingIcon=Ox.LoadingIcon({size:16}).css({float:'right',margin:'4px 2px 4px 2px'}).appendTo(self.$toolbar);}
|
||
|
|
self.$map=Ox.Element().css({left:0,top:self.options.showToolbar*24+'px',right:0,bottom:self.options.showZoombar*16+self.options.showStatusbar*24+'px'}).appendTo(that);if(self.options.showZoombar){self.$zoombar=Ox.Bar({size:16}).css({bottom:self.options.showStatusbar*24+'px'}).appendTo(that);}
|
||
|
|
if(self.options.showStatusbar){self.$statusbar=Ox.Bar({size:24}).css({bottom:0}).appendTo(that);self.$placeFlag=Ox.$('<img>').addClass('OxFlag').attr({src:Ox.PATH+'Ox.Geo/png/icons/16/NTHH.png'}).css({float:'left',margin:'4px 2px 4px 4px'}).appendTo(self.$statusbar);self.$placeNameInput=Ox.Input({placeholder:'Name',width:96}).css({float:'left',margin:'4px 2px 4px 2px'}).appendTo(self.$statusbar);self.$placeGeonameInput=Ox.Input({placeholder:'Geoname',width:96}).css({float:'left',margin:'4px 2px 4px 2px'}).appendTo(self.$statusbar);self.$placeButton=Ox.Button({title:'New Place',width:96}).css({float:'right',margin:'4px 4px 4px 2px'}).bindEvent({click:clickPlaceButton}).appendTo(self.$statusbar);}
|
||
|
|
self.$controls={center:Ox.Button({title:'center',type:'image'}).addClass('OxMapControl OxMapButtonCenter').bindEvent({singleclick:function(){panToPlace();},doubleclick:function(){zoomToPlace();}}),east:Ox.Button({title:'right',type:'image'}).addClass('OxMapControl OxMapButtonEast').bindEvent({singleclick:function(){pan(1,0);},doubleclick:function(){pan(2,0);}}),north:Ox.Button({title:'up',type:'image'}).addClass('OxMapControl OxMapButtonNorth').bindEvent({singleclick:function(){pan(0,-1);},doubleclick:function(){pan(0,-2);}}),south:Ox.Button({title:'down',type:'image'}).addClass('OxMapControl OxMapButtonSouth').bindEvent({singleclick:function(){pan(0,1);},doubleclick:function(){pan(0,2);}}),west:Ox.Button({title:'left',type:'image'}).addClass('OxMapControl OxMapButtonWest').bindEvent({singleclick:function(){pan(-1,0);},doubleclick:function(){pan(-2,0);}}),scale:Ox.Label({textAlign:'center'}).addClass('OxMapControl OxMapScale')};!self.options.showControls&&Ox.forEach(self.$controls,function($control){$control.css({opacity:0}).hide();});self.$placeControls={flag:Ox.Element().addClass('OxPlaceControl OxPlaceFlag').bindEvent({anyclick:function(){var country=this.data('country');country&&getPlaceByName(country,function(place){place&&self.map.fitBounds(place.bounds);});}}),name:Ox.Label({textAlign:'center',tooltip:Ox._('Click to pan, doubleclick to zoom')}).addClass('OxPlaceControl OxPlaceName').bindEvent({singleclick:function(){panToPlace();},doubleclick:function(){zoomToPlace();}}),deselectButton:Ox.Button({title:'close',tooltip:Ox._('Deselect'),type:'image'}).addClass('OxPlaceControl OxPlaceDeselectButton').bindEvent({click:function(){selectPlace(null);}})}
|
||
|
|
Ox.forEach(self.$placeControls,function($placeControl){$placeControl.css({opacity:0}).hide();});if(window.L){setTimeout(initMap);}else{Ox.getStylesheet('https://unpkg.com/leaflet@1.9.4/dist/leaflet.css',()=>{})
|
||
|
|
$.getScript(document.location.protocol
|
||
|
|
+'//unpkg.com/leaflet@1.9.4/dist/leaflet.js',function(){console.log('loaded leaflet');console.log(window.L);initMap();});}
|
||
|
|
function addPlaceToMap(place){Ox.Log('Map','addPlaceToMap',place)
|
||
|
|
var exists=false;if(!place){var bounds=self.map.getBounds(),center=self.map.getCenter(),southwest=new google.maps.LatLngBounds(bounds.getSouthWest(),center).getCenter(),northeast=new google.maps.LatLngBounds(center,bounds.getNorthEast()).getCenter(),place=new Ox.LeafletMapPlace({alternativeNames:[],countryCode:'',editable:true,geoname:'',id:'_'+Ox.encodeBase32(Ox.uid()),map:that,name:'',type:'feature',south:southwest.lat(),west:southwest.lng(),north:northeast.lat(),east:northeast.lng()});}
|
||
|
|
Ox.forEach(self.places,function(p,i){if(place.bounds.equals(p.bounds)){place=p;exists=true;return false;}});if(!exists){self.resultPlace&&self.resultPlace.remove();self.resultPlace=place;place.add();}
|
||
|
|
selectPlace(place.id);}
|
||
|
|
function addPlaceToPlaces(data){var place=Ox.extend(getSelectedPlace()||{},data),country=Ox.getCountryByGeoname(place.geoname);place.countryCode=country?country.code:'';self.options.selected=place.id;setPlaceControls(place);place.marker.update();place.rectangle.update();self.places.push(place);self.resultPlace=null;that.triggerEvent('addplace',place)}
|
||
|
|
function boundsChanged(){setScale();self.boundsChanged=true;}
|
||
|
|
function canContain(outerBounds,innerBounds){var outerSpan=outerBounds.toSpan(),innerSpan=innerBounds.toSpan();return outerSpan.lat()>innerSpan.lat()&&outerSpan.lng()>innerSpan.lng();}
|
||
|
|
function centerChanged(){var tooltip=$('.OxMapMarkerTooltip');tooltip.length&&Ox.$elements[$(tooltip[0]).data('oxid')].hide();self.center=self.map.getCenter();self.centerChanged=true;}
|
||
|
|
function changeZoom(data){self.map.setZoom(data.value);}
|
||
|
|
function clickMap(event){var place=getSelectedPlace();if(self.options.clickable){getPlaceByLatLng(event.latLng,self.map.getBounds(),function(place){if(place){addPlaceToMap(place);}else{selectPlace(null);}});}else{pressEscape();}}
|
||
|
|
function clickPlaceButton(){var place=getSelectedPlace(),title=self.$placeButton.options('title');if(title==Ox._('New Place')){addPlaceToMap();}else if(title==Ox._('Add Place')){addPlaceToPlaces();}}
|
||
|
|
function constructZoomInput(){if(self.options.showZoombar){self.$zoomInput&&self.$zoomInput.remove();self.$zoomInput=Ox.Range({arrows:true,changeOnDrag:true,max:self.maxZoom,min:self.minZoom,size:that.width(),thumbSize:32,thumbValue:true,value:self.map.getZoom()}).bindEvent({change:changeZoom}).appendTo(self.$zoombar);}}
|
||
|
|
function crossesDateline(){var bounds=self.map.getBounds();return bounds.getSouthWest().lng()>bounds.getNorthEast().lng();}
|
||
|
|
function editing(){var place=getSelectedPlace();return place&&place.editing;}
|
||
|
|
function getElevation(point,callback){if(arguments.length==1){callback=point;point=self.map.getCenter();}
|
||
|
|
self.elevationService.getElevationForLocations({locations:[point]},function(data){callback(data.elevation);});}
|
||
|
|
function getMapBounds(callback){self.options.places({},function(result){var area=result.data.area;console.log('area',area);console.log(L.latLngBounds([area.south,area.west],[area.north,area.east]));callback(new L.latLngBounds([area.south,area.west],[area.north,area.east]));});}
|
||
|
|
function getMapHeight(){return self.options.height
|
||
|
|
-self.options.showStatusbar*24
|
||
|
|
-self.options.showToolbar*24
|
||
|
|
-self.options.showZoombar*16;}
|
||
|
|
function getMapType(){return self.options.showLabels?'HYBRID':'SATELLITE'}
|
||
|
|
function getMaxZoom(point,callback){if(arguments.length==1){callback=point;point=self.map.getCenter();}
|
||
|
|
setTimeout(function(){callback(18)});}
|
||
|
|
function getMetersPerPixel(){var degreesPerPixel=360/(self.tileSize*Math.pow(2,self.map.getZoom()));return Ox.getMetersPerDegree(self.map.getCenter().lat)*degreesPerPixel;}
|
||
|
|
function getMinZoom(){return self.mapHeight>1024?3:self.mapHeight>512?2:self.mapHeight>256?1:0;}
|
||
|
|
function getPlaceById(id){return self.resultPlace&&self.resultPlace.id==id?self.resultPlace:Ox.getObjectById(self.places,id);}
|
||
|
|
function getPlaceByLatLng(latlng,bounds,callback){var callback=arguments.length==3?callback:bounds,bounds=arguments.length==3?bounds:null;self.$loadingIcon&&self.$loadingIcon.start();self.geocoder.geocode({latLng:latlng},function(results,status){self.$loadingIcon&&self.$loadingIcon.stop();if(status==google.maps.GeocoderStatus.OK){if(bounds){Ox.forEach(results.reverse(),function(result,i){if(i==results.length-1||canContain(bounds,result.geometry.bounds||result.geometry.viewport)){callback(new Ox.LeafletMapPlace(parseGeodata(results[i])));return false;}});}else{callback(new Ox.LeafletMapPlace(parseGeodata(results[0])));}}
|
||
|
|
if(status==google.maps.GeocoderStatus.OK||status==google.maps.GeocoderStatus.ZERO_RESULTS){triggerGeocodeEvent({latLng:latlng,results:results});}else{Ox.Log('Map','geocode failed:',status);callback(null);}});}
|
||
|
|
function getPlaceByName(name,callback){self.$loadingIcon&&self.$loadingIcon.start();self.geocoder.geocode({address:name},function(results,status){self.$loadingIcon&&self.$loadingIcon.stop();if(status==google.maps.GeocoderStatus.OK){callback(new Ox.LeafletMapPlace(parseGeodata(results[0])));}
|
||
|
|
if(status==google.maps.GeocoderStatus.OK&&status!=google.maps.GeocoderStatus.ZERO_RESULTS){triggerGeocodeEvent({address:name,results:results});}else{Ox.Log('Map','geocode failed:',status);callback(null);}});}
|
||
|
|
function getPositionByName(name){var position=-1;Ox.forEach(self.options.places,function(place,i){if(place.name==name){position=i;return false;}});return position;}
|
||
|
|
function getSelectedMarker(){var id=null;if(self.resultPlace&&self.resultPlace.selected){id=self.resultPlace.id;}else{Ox.forEach(self.places,function(place){if(place.selected){id=place.id;return false;}});}
|
||
|
|
return id;}
|
||
|
|
function getSelectedPlace(){return self.options.selected?getPlaceById(self.options.selected):null;}
|
||
|
|
function initMap(){getMapBounds(function(mapBounds){console.log('map bounds',mapBounds);self.center=mapBounds?mapBounds.getCenter():new L.LatLng([0,0]);self.zoom=self.minZoom;that.map=self.map=new L.Map(self.$map[0],{center:self.center,zoom:self.zoom});console.log('that map',that.map);L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png',{maxZoom:19,attribution:'© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'}).addTo(that.map);self.map.fitBounds(mapBounds);self.map.on('moveend',boundsChanged);self.map.on('moveend',centerChanged);self.map.on('click',clickMap);self.map.on('zoomend',zoomChanged);setTimeout(function(){mapChanged();});Ox.forEach(self.$controls,function($control){$control.appendTo(self.$map);});Ox.forEach(self.$placeControls,function($placeControl){$placeControl.appendTo(self.$map);});if(self.options.find){self.$findInput.value(self.options.find).triggerEvent('submit',{value:self.options.find});}else{if(self.options.selected){selectPlace(self.options.selected,true);}
|
||
|
|
if(mapBounds){if(isEmpty(mapBounds)){self.map.setZoom(self.minZoom);}else{self.map.fitBounds(mapBounds);}}
|
||
|
|
if(self.map.getZoom()<self.minZoom){self.map.setZoom(self.minZoom);}}
|
||
|
|
updateFormElements();self.loaded=true;that.triggerEvent('load');});}
|
||
|
|
function isEmpty(bounds){var southWest=bounds.getSouthWest(),northEast=bounds.getNorthEast();return southWest.lat==northEast.lat&&southWest.lng==northEast.lng;}
|
||
|
|
function isLoaded(){return window.google&&window.google.maps&&window.google.maps.LatLng;}
|
||
|
|
function mapChanged(){if(self.boundsChanged){var bounds=self.map.getBounds()
|
||
|
|
if(!bounds){self.boundsChanged=false;return}
|
||
|
|
var southWest=bounds.getSouthWest(),northEast=bounds.getNorthEast(),south=southWest.lat,west=southWest.lng,north=northEast.lat,east=northEast.lng;self.options.places({keys:self.placeKeys,query:{conditions:[].concat([{key:'lat',value:[south,north],operator:'='}],spansGlobe()?[{key:'lng',value:[-180,180],operator:'='}]:crossesDateline()?[{key:'lng',value:[east,west],operator:'!='}]:[{key:'lng',value:[west,east],operator:'='}]),operator:'&'},range:[0,self.options.maxMarkers],sort:[{key:'area',operator:'-'}]},function(result){var ids=self.options.selected?[self.options.selected]:[],previousIds=self.places.map(function(place){return place.id;});result.data.items.forEach(function(item,i){var place=getPlaceById(item.id);if(!place){place=new Ox.LeafletMapPlace(Ox.extend({map:that},item)).add();self.places.push(place);}else if(!place.visible){place.add();}
|
||
|
|
item.id!=self.options.selected&&ids.push(item.id);});previousIds.forEach(function(id){var place=getPlaceById(id);if(place&&ids.indexOf(id)==-1){place.remove();}});self.places=self.places.filter(function(place){return place.visible;});});self.boundsChanged=false;}
|
||
|
|
if(self.centerChanged){getMaxZoom(function(zoom){if(zoom&&zoom!=self.maxZoom){self.maxZoom=zoom;if(self.map.getZoom()>zoom){self.map.setZoom(zoom);}
|
||
|
|
constructZoomInput();}});self.centerChanged=false;}
|
||
|
|
if(self.zoomChanged){self.zoomChanged=false;}}
|
||
|
|
function pan(x,y){self.map.panBy(x*self.$map.width()/2,y*self.$map.height()/2);};function panToPlace(){var place;if(!self.loaded){setTimeout(function(){panToPlace();},100);}else{place=getSelectedPlace();place&&self.map.panTo(place.center);}}
|
||
|
|
function parseGeodata(data){var bounds=data.geometry.bounds||data.geometry.viewport,northEast=bounds.getNorthEast(),southWest=bounds.getSouthWest(),place={alternativeNames:[],components:data.address_components,countryCode:getCountryCode(data.address_components),east:northEast.lng(),editable:self.options.editable,fullGeoname:getFullGeoname(data.address_components),id:'_'+Ox.encodeBase32(Ox.uid()),map:that,north:northEast.lat(),south:southWest.lat(),type:getType(data.address_components[0].types),west:southWest.lng()};place.geoname=data.formatted_address||place.fullGeoname;place.name=(place.geoname||place.fullGeoname).split(', ')[0];if(Math.abs(place.west)==180&&Math.abs(place.east)==180){place.west=-179.99999999;place.east=179.99999999;}
|
||
|
|
place.south=Ox.limit(place.south,Ox.MIN_LATITUDE,Ox.MAX_LATITUDE-0.00000001);place.north=Ox.limit(place.north,Ox.MIN_LATITUDE+0.00000001,Ox.MAX_LATITUDE);function getCountryCode(components){var countryCode='';Ox.forEach(components,function(component){if(component.types.indexOf('country')>-1){countryCode=component.short_name;return false;}});return countryCode;}
|
||
|
|
function getFullGeoname(components){var country=false;return components.map(function(component,i){var name=component.long_name;if(i&&components[i-1].types.indexOf('country')>-1){country=true;}
|
||
|
|
return!country&&(i==0||name!=components[i-1].long_name)?name:null;}).join(', ');}
|
||
|
|
function getType(types){var strings={'country':['country'],'region':['administrative_area','colloquial_area'],'city':['locality'],'borough':['neighborhood','postal_code','sublocality'],'street':['intersection','route','street_address','street_number'],'building':['airport','floor','premise','room','subpremise'],'feature':['natural_feature','park']},type;function find(type){var ret;Ox.forEach(types,function(v){ret=Ox.startsWith(v,type);if(ret){return false;}});return ret;}Ox.forEach(strings,function(values,key){Ox.forEach(values,function(value){if(find(value)){type=key;return false;}});if(type){return false;}});return type||'feature';}
|
||
|
|
return place;}
|
||
|
|
function pressEnter(){var place=getSelectedPlace();if(place){if(place.editing){place.submit();}else{place.edit();}}else if(self.resultPlace){selectPlace(self.resultPlace.id)}}
|
||
|
|
function pressEscape(){var place=getSelectedPlace();if(place){if(place.editing){place.cancel();}else{selectPlace(null);}}else if(self.resultPlace){self.resultPlace.remove();self.resultPlace=null;}}
|
||
|
|
function removePlace(){var place=getSelectedPlace();place.id='_'+place.id;self.options.selected=place.id;self.places.splice(Ox.getIndexById(self.places,place.id),1);self.resultPlace&&self.resultPlace.remove();self.resultPlace=place;place.marker.update();place.rectangle.update();}
|
||
|
|
function reset(){self.map.getZoom()==self.zoom?self.map.panTo(self.center):self.map.fitBounds(self.bounds);}
|
||
|
|
function selectPlace(id,zoom){var place,selected;if(!self.loaded){setTimeout(function(){selectPlace(id,zoom);},100);}else{selected=getSelectedMarker();Ox.Log('Map','Ox.Map selectPlace()',id,selected);if(id!=selected){place=getPlaceById(selected);place&&place.deselect();if(id!==null){place=getPlaceById(id);if(place){select();}else{self.options.places({keys:self.placeKeys,query:{conditions:[{key:'id',value:id,operator:'=='}],operator:'&'}},function(result){if(result.data.items.length){place=new Ox.LeafletMapPlace(Ox.extend({map:that},result.data.items[0])).add();self.places.push(place);select();if(zoom){zoomToPlace();}else{panToPlace();}}});}}else{place=null;select();}}}
|
||
|
|
function select(){place&&place.select();self.options.selected=id;setPlaceControls(place);setStatus();that.triggerEvent('selectplace',place);that.triggerEvent('select',place);}};function setPlaceControls(place){var $placeControls=that.find('.OxPlaceControl'),country,isVisible=self.$placeControls.name.is(':visible');if(place){country=place.geoname.indexOf(', ')>-1?place.geoname.split(', ').pop():'';self.$placeControls.flag.options({tooltip:country?'Zoom to '+country:''}).data({country:country}).empty().append(Ox.$('<img>').attr({src:Ox.getFlagByGeoname(place.geoname,16)})).show();self.$placeControls.name.options({title:place.name||'<span class="OxLight">Unnamed</span>'});!isVisible&&$placeControls.show().animate({opacity:1},250);}else{isVisible&&$placeControls.animate({opacity:0},250,function(){$placeControls.hide();});}}
|
||
|
|
function setScale(){var metersPerPixel=getMetersPerPixel();Ox.forEach(self.scaleMeters,function(meters){var mapWidth=self.options.width||that.width(),scaleWidth=Math.round(meters/metersPerPixel);if(scaleWidth<=mapWidth/2-4){self.$controls.scale.options({title:'\u2190 '+(meters>1000?Ox.formatNumber(meters/1000)+' k':meters+' ')+'m \u2192'}).css({width:(scaleWidth-16)+'px'});return false;}});}
|
||
|
|
function setStatus(){var code,country,disabled,place,title;if(self.options.showStatusbar){place=getSelectedPlace();country=place?Ox.getCountryByGeoname(place.geoname):'';code=country?country.code:'NTHH';disabled=place&&!place.editable;if(place){title=place.id[0]=='_'?Ox._('Add Place'):Ox._('Remove Place');}else{title=Ox._('New Place');}
|
||
|
|
self.$placeFlag.attr({src:Ox.PATH+'Ox.Geo/png/icons/16/'+code+'.png'});self.$placeNameInput.options({disabled:disabled,value:place?place.name:''});self.$placeGeonameInput.options({disabled:disabled,value:place?place.geoname:''});self.$placeButton.options({disabled:disabled,title:title});}}
|
||
|
|
function spansGlobe(){return self.$map.width()>self.tileSize*Math.pow(2,self.map.getZoom());};function submitFind(data){self.options.find=data.value;if(data.value===''){if(self.options.selected&&self.options.selected[0]=='_'){selectPlace(null);}}else{that.findPlace(data.value,function(place){setStatus(place);});}
|
||
|
|
that.triggerEvent('find',{value:data.value});}
|
||
|
|
function toggleControls(){var $controls=that.find('.OxMapControl');self.options.showControls=!self.options.showControls;if(self.options.showControls){$controls.show().animate({opacity:1},250);}else{$controls.animate({opacity:0},250,function(){$controls.hide();});}
|
||
|
|
that.triggerEvent('togglecontrols',{visible:self.options.showControls});}
|
||
|
|
function toggleLabels(){self.options.showLabels=!self.options.showLabels;self.map.setMapTypeId(google.maps.MapTypeId[getMapType()]);that.triggerEvent('togglelabels',{visible:self.options.showLabels});}
|
||
|
|
function triggerGeocodeEvent(data){if(data.latLng){data.latLng={lat:data.latLng.lat(),lng:data.latLng.lng()}}
|
||
|
|
data.results.forEach(function(result){['bounds','viewport'].forEach(function(key){if(result.geometry[key]){result.geometry[key]={northEast:{lat:result.geometry[key].getNorthEast().lat(),lng:result.geometry[key].getNorthEast().lng()},southWest:{lat:result.geometry[key].getSouthWest().lat(),lng:result.geometry[key].getSouthWest().lng()}}}});if(result.geometry.location){result.geometry.location={lat:result.geometry.location.lat(),lng:result.geometry.location.lng()}}});that.triggerEvent('geocode',data);}
|
||
|
|
function undo(){Ox.Log('Map','Map undo')
|
||
|
|
var place=getSelectedPlace();place.editing&&place.undo();}
|
||
|
|
function updateFormElements(){var width=that.width();if(self.options.showZoombar){getMaxZoom(function(zoom){self.maxZoom=zoom;constructZoomInput();});}
|
||
|
|
if(self.options.showStatusbar){self.$placeNameInput.options({width:Math.floor((width-132)/2)});self.$placeGeonameInput.options({width:Math.ceil((width-132)/2)});}}
|
||
|
|
function zoom(z){if(!self.loaded){setTimeout(function(){zoom(z);},100);}else{self.map.setZoom(self.map.getZoom()+z);}}
|
||
|
|
function zoomChanged(){var zoom=self.map.getZoom();if(zoom<self.minZoom){self.map.setZoom(self.minZoom);}else if(self.maxZoom&&zoom>self.maxZoom){self.map.setZoom(self.maxZoom);}else{self.zoomChanged=true;self.$zoomInput&&self.$zoomInput.value(zoom);that.triggerEvent('zoom',{value:zoom});}}
|
||
|
|
function zoomToPlace(){var place;if(!self.loaded){setTimeout(function(){zoomToPlace();},100);}else{place=getSelectedPlace();place&&self.map.fitBounds(place.bounds);}}
|
||
|
|
that.addPlace=function(data){addPlaceToPlaces(data);};that.getCenter=function(){var center=self.map.getCenter();return{lat:center.lat(),lng:center.lng()};};that.getKey=function(){return self.shiftKey?'shift':self.metaKey?'meta':null;};that.getSelectedPlace=function(){return getSelectedPlace();}
|
||
|
|
that.editPlace=function(){getSelectedPlace().edit();return that;};that.findPlace=function(name,callback){getPlaceByName(name,function(place){if(place){addPlaceToMap(place);self.map.fitBounds(place.bounds);}else{name&&self.$findInput.addClass('OxError');}
|
||
|
|
callback(place);});return that;};that.newPlace=function(place){addPlaceToMap(place);return that;};that.panToPlace=function(){panToPlace();return that;};that.removePlace=function(){removePlace();return that;};that.resizeMap=function(){self.options.height=that.height();self.options.width=that.width();if(self.map){self.mapHeight=getMapHeight();self.minZoom=getMinZoom();if(self.minZoom>self.map.getZoom()){self.map.setZoom(self.minZoom);}
|
||
|
|
self.$map.css({height:self.mapHeight+'px',width:self.options.width+'px'});self.options.$zoomInput&&self.$zoomInput.options({size:self.options.width});updateFormElements();Ox.Log('Map','triggering google maps resize event, height',self.options.height)
|
||
|
|
google.maps.event.trigger(self.map,'resize');}
|
||
|
|
return that;}
|
||
|
|
that.setCenter=function(center){self.map.setCenter(new google.maps.LatLng(center.lat,center.lng));return that;};that.value=function(id,key,value){Ox.Log('Map','Map.value',id,key,value);getPlaceById(id).options(key,value);if(id==self.options.selected){if(key=='name'){self.$placeControls.name.options({title:value});}else if(key=='geoname'){self.$placeControls.flag.empty().append(Ox.$('<img>').attr({src:Ox.getFlagByGeoname(value,16)}));}}
|
||
|
|
return that;}
|
||
|
|
that.zoomToPlace=function(){zoomToPlace();return that;};that.zoom=function(value){zoom(value);return that;};return that;};'use strict';Ox.LeafletMapMarker=function(options){options=Ox.extend({map:null,place:null},options);var that=this,areaSize={100:10,10000:12,1000000:14,100000000:16,10000000000:18,1000000000000:20,100000000000000:22},themeData=Ox.Theme.getThemeData(),typeColor={};['country','region','city','borough','street','building','feature'].forEach(function(type){typeColor[type]=themeData['mapPlace'+Ox.toTitleCase(type)+'Color'];});Ox.forEach(options,function(val,key){that[key]=val;});console.log('place',options.place);that.marker=new L.Marker([options.place.center.lat,options.place.center.lng],{}).addTo(options.map.map);function click(){var key=that.map.getKey(),place,bounds,southWest,northEast;if(!that.place.selected){if(that.map.options('editable')&&(key=='meta'||key=='shift')){place=that.map.getSelectedPlace();}
|
||
|
|
if(place){bounds=new google.maps.LatLngBounds(new google.maps.LatLng(place.south,place.west),new google.maps.LatLng(place.north,place.east));bounds=bounds.union(that.place.bounds);southWest=bounds.getSouthWest();northEast=bounds.getNorthEast();that.map.newPlace(new Ox.LeafletMapPlace({alternativeNames:[],countryCode:'',editable:true,geoname:'',id:'_'+Ox.encodeBase32(Ox.uid()),map:that.map,name:'',type:'feature',south:southWest.lat(),west:southWest.lng(),north:northEast.lat(),east:northEast.lng()}));}else{that.map.options({selected:that.place.id});}}else{if(key=='meta'){that.map.options({selected:null});}else{that.map.panToPlace();}}}
|
||
|
|
function dblclick(){that.place.selected&&that.map.zoomToPlace();}
|
||
|
|
function dragstart(e){Ox.$body.addClass('OxDragging');}
|
||
|
|
function drag(e){var northSouth=(that.place.north-that.place.south)/2,lat=Ox.limit(e.latLng.lat(),Ox.MIN_LATITUDE+northSouth,Ox.MAX_LATITUDE-northSouth),lng=e.latLng.lng(),span=Math.min(that.place.sizeEastWest*Ox.getDegreesPerMeter(lat)/2,179.99999999),degreesPerMeter=Ox.getDegreesPerMeter(lat);that.place.south+=lat-that.place.lat;that.place.north+=lat-that.place.lat;that.place.west=lng-span;that.place.east=lng+span;if(that.place.west<-180){that.place.west+=360;}else if(that.place.east>180){that.place.east-=360;}
|
||
|
|
Ox.Log('Map','west',that.place.west,'east',that.place.east,'span',span);that.place.update();that.marker.setOptions({position:that.place.center});that.place.rectangle.update();}
|
||
|
|
function dragend(e){Ox.$body.removeClass('OxDragging');that.map.triggerEvent('changeplaceend',that.place);}
|
||
|
|
function getMarkerImage(options,callback){options=Ox.extend({background:[255,0,0],editing:false,result:false,selected:false,size:16},options);var background=options.result?[255,255,0]:[255,0,0],border=options.editing?[128,128,255]:options.selected?[255,255,255]:[0,0,0],c=Ox.canvas(options.size,options.size),image,r=options.size/2;if(Ox.isArray(background)){c.context.fillStyle='rgba('+background.join(', ')+', 0.5)';c.context.arc(r,r,r-2,0,360);c.context.fill();renderImage();}else{image=new Image();image.onload=renderImage;image.src=background;}
|
||
|
|
function renderImage(){if(Ox.isString(background)){c.context.drawImage(image,1,1,options.size-2,options.size-2);}
|
||
|
|
c.context.beginPath();c.context.lineWidth=2;c.context.strokeStyle='rgb('+border.join(', ')+')';c.context.arc(r,r,r-1,0,360);c.context.stroke();callback(new google.maps.MarkerImage(c.canvas.toDataURL(),new google.maps.Size(options.size,options.size),new google.maps.Point(0,0),new google.maps.Point(r,r)));}}
|
||
|
|
function mouseover(e){var offset=that.map.offset(),xy=that.map.overlayView.getProjection().fromLatLngToContainerPixel(e.latLng);that.tooltip.show(offset.left+Math.round(xy.x)-4,offset.top+Math.round(xy.y)+20);}
|
||
|
|
function mouseout(){that.tooltip.hide();}
|
||
|
|
function setOptions(){var fix=that.marker.getDraggable()&&!that.place.editing,color=that.map.options('markerColor'),size=that.map.options('markerSize');if(color=='auto'){that.color=typeColor[that.place.type]||typeColor['mapPlaceFeatureColor'];}else if(Ox.isArray(color)){that.color=color;}else{that.color=color(that.place);}
|
||
|
|
if(size=='auto'){that.size=8;Ox.forEach(areaSize,function(size,area){if(that.place.area>=area){that.size=size;}else{return false;}});}else if(Ox.isNumber(size)){that.size=size;}else{that.size=size(that.place);}
|
||
|
|
that.marker.setOptions({cursor:that.place.editing?'move':'pointer',draggable:that.place.editing,icon:Ox.MapMarkerImage({color:that.color,mode:that.place.editing?'editing':that.place.selected?'selected':'normal',size:that.size,type:that.place.id[0]=='_'?'result':'place'}),position:that.place.center});if(fix){that.marker.setVisible(false);setTimeout(function(){that.marker.setVisible(true);},0);}
|
||
|
|
setTooltip();}
|
||
|
|
function setTooltip(){that.tooltip&&that.tooltip.remove();that.tooltip=Ox.Tooltip({title:'<img src="'
|
||
|
|
+Ox.getFlagByGeoname(that.place.geoname,16)
|
||
|
|
+'" style="float: left; width: 16px; height: 16px; margin: 1px 0 1px -1px; border-radius: 4px"/>'
|
||
|
|
+'<div style="float: left; margin: 4px -1px 0 4px; font-size: 9px;">'
|
||
|
|
+that.map.options('markerTooltip')(that.place)+'</div>'}).addClass('OxMapMarkerTooltip');}
|
||
|
|
that.add=function(){that.marker.setMap(that.map.map);google.maps.event.addListener(that.marker,'click',click);google.maps.event.addListener(that.marker,'dblclick',dblclick);google.maps.event.addListener(that.marker,'mouseover',mouseover);google.maps.event.addListener(that.marker,'mouseout',mouseout);return that;};that.edit=function(){setOptions();google.maps.event.addListener(that.marker,'dragstart',dragstart);google.maps.event.addListener(that.marker,'drag',drag);google.maps.event.addListener(that.marker,'dragend',dragend);return that;};that.remove=function(){that.marker.setMap(null);google.maps.event.clearListeners(that.marker);return that;};that.submit=function(){google.maps.event.clearListeners(that.marker,'dragstart');google.maps.event.clearListeners(that.marker,'drag');google.maps.event.clearListeners(that.marker,'dragend');return that;}
|
||
|
|
that.update=function(){setOptions();return that;}
|
||
|
|
return that;};'use strict';Ox.LeafletMapPlace=function(options){options=Ox.extend({east:0,editing:false,geoname:'',map:null,name:'',north:0,selected:false,south:0,type:'',visible:false,west:0},options);var that=this;Ox.forEach(options,function(val,key){that[key]=val;});update();function update(updateMarker){that.points={ne:new L.LatLng(that.north,that.east),sw:new L.LatLng(that.south,that.west)};console.log('points',JSON.stringify(that.points,null,2));that.bounds=new L.latLngBounds(that.points.sw,that.points.ne);that.center=that.bounds.getCenter();that.lat=that.center.lat;that.lng=that.center.lng;Ox.extend(that.points,{e:new L.LatLng(that.lat,that.east),s:new L.LatLng(that.south,that.lng),se:new L.LatLng(that.south,that.east),n:new L.LatLng(that.north,that.lng),nw:new L.LatLng(that.north,that.west),w:new L.LatLng(that.lat,that.west)});that.sizeNorthSouth=(that.north-that.south)*Ox.EARTH_CIRCUMFERENCE/360;that.sizeEastWest=(that.east+(that.west>that.east?360:0)-that.west)*Ox.getMetersPerDegree(that.lat);that.area=Ox.getArea({lat:that.south,lng:that.west},{lat:that.north,lng:that.east});if(!that.marker){that.marker=new Ox.LeafletMapMarker({map:that.map,place:that});that.rectangle=new Ox.LeafletMapRectangle({map:that.map,place:that});}else if(updateMarker){that.marker.update();that.rectangle.update();}}
|
||
|
|
function editable(){return that.map.options('editable')&&that.editable;}
|
||
|
|
that.add=function(){that.visible=true;that.marker.add();return that;};that.cancel=function(){if(editable()){that.undo();that.editing=false;that.marker.update();that.rectangle.deselect();}
|
||
|
|
return that;};that.crossesDateline=function(){return that.west>that.east;}
|
||
|
|
that.deselect=function(){that.editing&&that.submit();that.selected=false;that.marker.update();that.rectangle.remove();return that;};that.edit=function(){if(editable()){that.editing=true;that.original={south:that.south,west:that.west,north:that.north,east:that.east};that.marker.edit();that.rectangle.select();}
|
||
|
|
return that;};that.options=function(options){options=Ox.makeObject(arguments);Ox.forEach(options,function(value,key){that[key]=value;});update(true);};that.remove=function(){that.editing&&that.submit();that.selected&&that.deselect();that.visible=false;that.marker.remove();return that;};that.select=function(){that.selected=true;!that.visible&&that.add();that.marker.update();that.rectangle.add();return that;};that.submit=function(){if(editable()){that.editing=false;that.marker.update();that.rectangle.deselect();}
|
||
|
|
return that;};that.update=function(updateMarker){update(updateMarker);that.map.triggerEvent('changeplace',that);return that;};that.undo=function(){if(editable()){Ox.forEach(that.original,function(v,k){that[k]=v;});that.update();that.marker.update();that.rectangle.update();}
|
||
|
|
return that;};return that;};'use strict';Ox.LeafletMapRectangle=function(options){options=Ox.extend({map:null,place:null},options);var that=this,themeData=Ox.Theme.getThemeData();Ox.forEach(options,function(val,key){that[key]=val;});that.rectangle=new L.rectangle({bounds:that.place.bounds});that.markers=Ox.map(that.place.points,function(point,position){return new Ox.LeafletMapRectangleMarker({map:that.map,place:that.place,position:position});});setOptions();function click(){if(that.map.options('editable')&&that.place.editable&&!that.place.editing){that.place.edit();}else if(that.map.getKey()=='meta'){that.place.submit();}else if(that.map.getKey()=='shift'){that.map.zoomToPlace();}else{that.map.panToPlace();}}
|
||
|
|
function setOptions(){var color='#'+Ox.toHex(themeData[that.place.editing?'mapPlaceEditingBorder':'mapPlaceSelectedBorder']);that.rectangle.setOptions({bounds:that.place.bounds,fillColor:color,fillOpacity:that.place.editing?0.1:0,strokeColor:color,strokeOpacity:that.place.id[0]=='_'?0.5:1,strokeWeight:2});}
|
||
|
|
that.add=function(){that.rectangle.addTo(that.map.map);that.rectangle.on('click',click);return that;};that.deselect=function(){setOptions();Ox.Log('Map','MARKERS',that.markers)
|
||
|
|
Ox.forEach(that.markers,function(marker){marker.remove();});return that;};that.remove=function(){that.rectangle.remove();return that;}
|
||
|
|
that.select=function(){setOptions();Ox.forEach(that.markers,function(marker){marker.add();});return that;};that.update=function(){Ox.Log('Map','UPDATE...')
|
||
|
|
setOptions();Ox.forEach(that.markers,function(marker){marker.update();});return that;}
|
||
|
|
return that;};'use strict';Ox.LeafletMapRectangleMarker=function(options){options=Ox.extend({map:null,place:null,position:''},options);var that=this;Ox.forEach(options,function(val,key){that[key]=val;});console.log('position',that.place.points,that.position);that.marker=new L.Marker({});function dragstart(e){Ox.$body.addClass('OxDragging');that.drag={lat:e.latLng.lat(),lng:e.latLng.lng()};}
|
||
|
|
function drag(e){Ox.Log('Map',e.pixel.x,e.pixel.y)
|
||
|
|
var lat=Ox.limit(e.latLng.lat(),Ox.MIN_LATITUDE,Ox.MAX_LATITUDE),lng=e.latLng.lng();that.drag={lat:lat,lng:lng};if(that.position.indexOf('s')>-1){that.place.south=lat;}
|
||
|
|
if(that.position.indexOf('n')>-1){that.place.north=lat;}
|
||
|
|
if(that.position.indexOf('w')>-1){that.place.west=lng;}
|
||
|
|
if(that.position.indexOf('e')>-1){that.place.east=lng;}
|
||
|
|
that.place.update();that.place.marker.update();that.place.rectangle.update();}
|
||
|
|
function dragend(e){var south;Ox.$body.removeClass('OxDragging');if(that.place.south>that.place.north){south=that.place.south;that.place.south=that.place.north;that.place.north=south;that.place.update();that.place.marker.update();that.place.rectangle.update();}
|
||
|
|
that.map.triggerEvent('changeplaceend',that.place);}
|
||
|
|
that.add=function(){that.marker.setMap(that.map.map);google.maps.event.addListener(that.marker,'dragstart',dragstart);google.maps.event.addListener(that.marker,'drag',drag);google.maps.event.addListener(that.marker,'dragend',dragend);};that.remove=function(){that.marker.setMap(null);google.maps.event.clearListeners(that.marker);};that.update=function(){that.marker.setOptions({icon:Ox.MapMarkerImage({mode:'editing',rectangle:true,type:that.place.id[0]=='_'?'result':'place'}),position:that.place.points[that.position]});};return that;};'use strict';Ox.Map=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({clickable:false,editable:false,find:'',findPlaceholder:'Find',keys:[],markerColor:'auto',markerSize:'auto',markerTooltip:function(place){return place.name||'<span class="OxLight">Unnamed</span>';},maxMarkers:100,places:null,selected:'',showControls:false,showLabels:false,showStatusbar:false,showToolbar:false,showZoombar:false,zoomOnlyWhenFocused:false}).options(options||{}).update({find:function(){self.$findInput.value(self.options.find).triggerEvent('submit',{value:self.options.find});},height:function(){that.css({height:self.options.height+'px'});that.resizeMap();},places:function(){if(Ox.isArray(self.options.places)){self.options.places.forEach(function(place){if(Ox.isUndefined(place.id)){place.id=Ox.encodeBase32(Ox.uid());}});if(self.options.selected&&!Ox.getObjectById(self.options.places,self.options.selected)){self.options.selected='';selectPlace(null);}
|
||
|
|
self.options.places=Ox.api(self.options.places,{geo:true,sort:'-area'});}
|
||
|
|
self.loaded&&getMapBounds(function(mapBounds){if(mapBounds){self.map.fitBounds(mapBounds);}else{self.map.setZoom(self.minZoom);self.map.setCenter(new google.maps.LatLng(0,0));}
|
||
|
|
self.boundsChanged=true;mapChanged();self.options.selected&&selectPlace(self.options.selected);});},selected:function(){selectPlace(self.options.selected||null);},type:function(){},width:function(){that.css({width:self.options.width+'px'});that.resizeMap();}}).addClass('OxMap').bindEvent({gainfocus:function(){self.options.zoomOnlyWhenFocused&&self.map.setOptions({scrollwheel:true});},losefocus:function(){self.options.zoomOnlyWhenFocused&&self.map.setOptions({scrollwheel:false});},key_0:function(){panToPlace()},key_c:toggleControls,key_down:function(){pan(0,1);},key_enter:pressEnter,key_escape:pressEscape,key_equal:function(){zoom(1);},key_l:toggleLabels,key_left:function(){pan(-1,0);},'key_meta':function(){self.metaKey=true;$(document).one({keyup:function(){self.metaKey=false;}});},key_minus:function(){zoom(-1);},key_right:function(){pan(1,0);},key_shift:function(){self.shiftKey=true;$(document).one({keyup:function(){self.shiftKey=false;}});},key_shift_down:function(){pan(0,2);},key_shift_0:function(){zoomToPlace();},key_shift_equal:function(){zoom(2);},key_shift_left:function(){pan(-2,0);},key_shift_minus:function(){zoom(-2);},key_shift_right:function(){pan(2,0);},key_shift_up:function(){pan(0,-2);},key_up:function(){pan(0,-1);},key_z:undo,mousedown:function(e){!$(e.target).is('input')&&that.gainFocus();}});options&&['statusbar','toolbar','zoombar'].forEach(function(key){if(options[key]){self.options['show'+Ox.toTitleCase(key)]=options[key];}});if(Ox.isArray(self.options.places)){self.options.places.forEach(function(place){if(Ox.isUndefined(place.id)){place.id=Ox.encodeBase32(Ox.uid());}});self.options.places=Ox.api(self.options.places,{geo:true,sort:'-area'});}
|
||
|
|
self.mapHeight=getMapHeight();self.metaKey=false;self.minZoom=getMinZoom();self.placeKeys=['id','name','alternativeNames','geoname','countryCode','type','lat','lng','south','west','north','east','area','editable'].concat(self.options.keys);self.places=[],self.resultPlace=null;self.scaleMeters=[50000000,20000000,10000000,5000000,2000000,1000000,500000,200000,100000,50000,20000,10000,5000,2000,1000,500,200,100,50,20,10];self.shiftKey=false,self.tileSize=256;if(self.options.showToolbar){self.$toolbar=Ox.Bar({size:24}).appendTo(that);self.$menu=Ox.MenuButton({items:[{id:'toggleLabels',title:self.options.showLabels?[Ox._('Hide Labels'),Ox._('Show Labels')]:[Ox._('Show Labels'),Ox._('Hide Labels')],keyboard:'l'},{id:'toggleControls',title:self.options.showControls?[Ox._('Hide Controls'),Ox._('Show Controls')]:[Ox._('Show Controls'),Ox._('Hide Controls')],keyboard:'c'}],title:'set',tooltip:Ox._('Map Options'),type:'image'}).css({float:'left',margin:'4px'}).bindEvent({click:function(data){if(data.id=='toggleLabels'){toggleLabels();}else if(data.id=='toggleControls'){toggleControls();}}}).appendTo(self.$toolbar);self.$findInput=Ox.Input({clear:true,placeholder:self.options.findPlaceholder,width:192}).css({float:'right',margin:'4px 4px 4px 2px'}).bindEvent({submit:submitFind}).appendTo(self.$toolbar);self.$loadingIcon=Ox.LoadingIcon({size:16}).css({float:'right',margin:'4px 2px 4px 2px'}).appendTo(self.$toolbar);}
|
||
|
|
self.$map=Ox.Element().css({left:0,top:self.options.showToolbar*24+'px',right:0,bottom:self.options.showZoombar*16+self.options.showStatusbar*24+'px'}).appendTo(that);if(self.options.showZoombar){self.$zoombar=Ox.Bar({size:16}).css({bottom:self.options.showStatusbar*24+'px'}).appendTo(that);}
|
||
|
|
if(self.options.showStatusbar){self.$statusbar=Ox.Bar({size:24}).css({bottom:0}).appendTo(that);self.$placeFlag=Ox.$('<img>').addClass('OxFlag').attr({src:Ox.PATH+'Ox.Geo/png/icons/16/NTHH.png'}).css({float:'left',margin:'4px 2px 4px 4px'}).appendTo(self.$statusbar);self.$placeNameInput=Ox.Input({placeholder:'Name',width:96}).css({float:'left',margin:'4px 2px 4px 2px'}).appendTo(self.$statusbar);self.$placeGeonameInput=Ox.Input({placeholder:'Geoname',width:96}).css({float:'left',margin:'4px 2px 4px 2px'}).appendTo(self.$statusbar);self.$placeButton=Ox.Button({title:'New Place',width:96}).css({float:'right',margin:'4px 4px 4px 2px'}).bindEvent({click:clickPlaceButton}).appendTo(self.$statusbar);}
|
||
|
|
self.$controls={center:Ox.Button({title:'center',type:'image'}).addClass('OxMapControl OxMapButtonCenter').bindEvent({singleclick:function(){panToPlace();},doubleclick:function(){zoomToPlace();}}),east:Ox.Button({title:'right',type:'image'}).addClass('OxMapControl OxMapButtonEast').bindEvent({singleclick:function(){pan(1,0);},doubleclick:function(){pan(2,0);}}),north:Ox.Button({title:'up',type:'image'}).addClass('OxMapControl OxMapButtonNorth').bindEvent({singleclick:function(){pan(0,-1);},doubleclick:function(){pan(0,-2);}}),south:Ox.Button({title:'down',type:'image'}).addClass('OxMapControl OxMapButtonSouth').bindEvent({singleclick:function(){pan(0,1);},doubleclick:function(){pan(0,2);}}),west:Ox.Button({title:'left',type:'image'}).addClass('OxMapControl OxMapButtonWest').bindEvent({singleclick:function(){pan(-1,0);},doubleclick:function(){pan(-2,0);}}),scale:Ox.Label({textAlign:'center'}).addClass('OxMapControl OxMapScale')};!self.options.showControls&&Ox.forEach(self.$controls,function($control){$control.css({opacity:0}).hide();});self.$placeControls={flag:Ox.Element().addClass('OxPlaceControl OxPlaceFlag').bindEvent({anyclick:function(){var country=this.data('country');country&&getPlaceByName(country,function(place){place&&self.map.fitBounds(place.bounds);});}}),name:Ox.Label({textAlign:'center',tooltip:Ox._('Click to pan, doubleclick to zoom')}).addClass('OxPlaceControl OxPlaceName').bindEvent({singleclick:function(){panToPlace();},doubleclick:function(){zoomToPlace();}}),deselectButton:Ox.Button({title:'close',tooltip:Ox._('Deselect'),type:'image'}).addClass('OxPlaceControl OxPlaceDeselectButton').bindEvent({click:function(){selectPlace(null);}})}
|
||
|
|
Ox.forEach(self.$placeControls,function($placeControl){$placeControl.css({opacity:0}).hide();});if(window.google){setTimeout(initMap);}else if(window.googleCallback){(function interval(){isLoaded()?initMap():setTimeout(interval,100);}());}else{window.googleCallback=function(){delete window.googleCallback;initMap();};$.getScript(document.location.protocol
|
||
|
|
+'//maps.google.com/maps/api/js?callback=googleCallback&sensor=false'
|
||
|
|
+(Ox.Map.GoogleApiKey?'&key='+Ox.Map.GoogleApiKey:''));}
|
||
|
|
function addPlaceToMap(place){Ox.Log('Map','addPlaceToMap',place)
|
||
|
|
var exists=false;if(!place){var bounds=self.map.getBounds(),center=self.map.getCenter(),southwest=new google.maps.LatLngBounds(bounds.getSouthWest(),center).getCenter(),northeast=new google.maps.LatLngBounds(center,bounds.getNorthEast()).getCenter(),place=new Ox.MapPlace({alternativeNames:[],countryCode:'',editable:true,geoname:'',id:'_'+Ox.encodeBase32(Ox.uid()),map:that,name:'',type:'feature',south:southwest.lat(),west:southwest.lng(),north:northeast.lat(),east:northeast.lng()});}
|
||
|
|
Ox.forEach(self.places,function(p,i){if(place.bounds.equals(p.bounds)){place=p;exists=true;return false;}});if(!exists){self.resultPlace&&self.resultPlace.remove();self.resultPlace=place;place.add();}
|
||
|
|
selectPlace(place.id);}
|
||
|
|
function addPlaceToPlaces(data){var place=Ox.extend(getSelectedPlace()||{},data),country=Ox.getCountryByGeoname(place.geoname);place.countryCode=country?country.code:'';self.options.selected=place.id;setPlaceControls(place);place.marker.update();place.rectangle.update();self.places.push(place);self.resultPlace=null;that.triggerEvent('addplace',place)}
|
||
|
|
function boundsChanged(){setScale();self.boundsChanged=true;}
|
||
|
|
function canContain(outerBounds,innerBounds){var outerSpan=outerBounds.toSpan(),innerSpan=innerBounds.toSpan();return outerSpan.lat()>innerSpan.lat()&&outerSpan.lng()>innerSpan.lng();}
|
||
|
|
function centerChanged(){var tooltip=$('.OxMapMarkerTooltip');tooltip.length&&Ox.$elements[$(tooltip[0]).data('oxid')].hide();self.center=self.map.getCenter();self.centerChanged=true;}
|
||
|
|
function changeZoom(data){self.map.setZoom(data.value);}
|
||
|
|
function clickMap(event){var place=getSelectedPlace();if(self.options.clickable){getPlaceByLatLng(event.latLng,self.map.getBounds(),function(place){if(place){addPlaceToMap(place);}else{selectPlace(null);}});}else{pressEscape();}}
|
||
|
|
function clickPlaceButton(){var place=getSelectedPlace(),title=self.$placeButton.options('title');if(title==Ox._('New Place')){addPlaceToMap();}else if(title==Ox._('Add Place')){addPlaceToPlaces();}}
|
||
|
|
function constructZoomInput(){if(self.options.showZoombar){self.$zoomInput&&self.$zoomInput.remove();self.$zoomInput=Ox.Range({arrows:true,changeOnDrag:true,max:self.maxZoom,min:self.minZoom,size:that.width(),thumbSize:32,thumbValue:true,value:self.map.getZoom()}).bindEvent({change:changeZoom}).appendTo(self.$zoombar);}}
|
||
|
|
function crossesDateline(){var bounds=self.map.getBounds();return bounds.getSouthWest().lng()>bounds.getNorthEast().lng();}
|
||
|
|
function editing(){var place=getSelectedPlace();return place&&place.editing;}
|
||
|
|
function getElevation(point,callback){if(arguments.length==1){callback=point;point=self.map.getCenter();}
|
||
|
|
self.elevationService.getElevationForLocations({locations:[point]},function(data){callback(data.elevation);});}
|
||
|
|
function getMapBounds(callback){self.options.places({},function(result){var area=result.data.area;callback(new google.maps.LatLngBounds(new google.maps.LatLng(area.south,area.west),new google.maps.LatLng(area.north,area.east)));});}
|
||
|
|
function getMapHeight(){return self.options.height
|
||
|
|
-self.options.showStatusbar*24
|
||
|
|
-self.options.showToolbar*24
|
||
|
|
-self.options.showZoombar*16;}
|
||
|
|
function getMapType(){return self.options.showLabels?'HYBRID':'SATELLITE'}
|
||
|
|
function getMaxZoom(point,callback){if(arguments.length==1){callback=point;point=self.map.getCenter();}
|
||
|
|
self.maxZoomService.getMaxZoomAtLatLng(point,function(data){callback(data.status=='OK'?data.zoom:null);});}
|
||
|
|
function getMetersPerPixel(){var degreesPerPixel=360/(self.tileSize*Math.pow(2,self.map.getZoom()));return Ox.getMetersPerDegree(self.map.getCenter().lat())*degreesPerPixel;}
|
||
|
|
function getMinZoom(){return self.mapHeight>1024?3:self.mapHeight>512?2:self.mapHeight>256?1:0;}
|
||
|
|
function getPlaceById(id){return self.resultPlace&&self.resultPlace.id==id?self.resultPlace:Ox.getObjectById(self.places,id);}
|
||
|
|
function getPlaceByLatLng(latlng,bounds,callback){var callback=arguments.length==3?callback:bounds,bounds=arguments.length==3?bounds:null;self.$loadingIcon&&self.$loadingIcon.start();self.geocoder.geocode({latLng:latlng},function(results,status){self.$loadingIcon&&self.$loadingIcon.stop();if(status==google.maps.GeocoderStatus.OK){if(bounds){Ox.forEach(results.reverse(),function(result,i){if(i==results.length-1||canContain(bounds,result.geometry.bounds||result.geometry.viewport)){callback(new Ox.MapPlace(parseGeodata(results[i])));return false;}});}else{callback(new Ox.MapPlace(parseGeodata(results[0])));}}
|
||
|
|
if(status==google.maps.GeocoderStatus.OK||status==google.maps.GeocoderStatus.ZERO_RESULTS){triggerGeocodeEvent({latLng:latlng,results:results});}else{Ox.Log('Map','geocode failed:',status);callback(null);}});}
|
||
|
|
function getPlaceByName(name,callback){self.$loadingIcon&&self.$loadingIcon.start();self.geocoder.geocode({address:name},function(results,status){self.$loadingIcon&&self.$loadingIcon.stop();if(status==google.maps.GeocoderStatus.OK){callback(new Ox.MapPlace(parseGeodata(results[0])));}
|
||
|
|
if(status==google.maps.GeocoderStatus.OK&&status!=google.maps.GeocoderStatus.ZERO_RESULTS){triggerGeocodeEvent({address:name,results:results});}else{Ox.Log('Map','geocode failed:',status);callback(null);}});}
|
||
|
|
function getPositionByName(name){var position=-1;Ox.forEach(self.options.places,function(place,i){if(place.name==name){position=i;return false;}});return position;}
|
||
|
|
function getSelectedMarker(){var id=null;if(self.resultPlace&&self.resultPlace.selected){id=self.resultPlace.id;}else{Ox.forEach(self.places,function(place){if(place.selected){id=place.id;return false;}});}
|
||
|
|
return id;}
|
||
|
|
function getSelectedPlace(){return self.options.selected?getPlaceById(self.options.selected):null;}
|
||
|
|
function initMap(){getMapBounds(function(mapBounds){self.elevationService=new google.maps.ElevationService();self.geocoder=new google.maps.Geocoder();self.maxZoomService=new google.maps.MaxZoomService();self.center=mapBounds?mapBounds.getCenter():new google.maps.LatLng(0,0);self.zoom=self.minZoom;that.map=self.map=new google.maps.Map(self.$map[0],{center:self.center,disableDefaultUI:true,disableDoubleClickZoom:true,mapTypeId:google.maps.MapTypeId[getMapType()],noClear:true,scrollwheel:!self.options.zoomOnlyWhenFocused,zoom:self.zoom});google.maps.event.addListener(self.map,'bounds_changed',boundsChanged);google.maps.event.addListener(self.map,'center_changed',centerChanged);google.maps.event.addListener(self.map,'click',clickMap);google.maps.event.addListener(self.map,'idle',mapChanged);google.maps.event.addListener(self.map,'zoom_changed',zoomChanged);google.maps.event.trigger(self.map,'resize');that.overlayView=new google.maps.OverlayView();that.overlayView.setMap(self.map);that.overlayView.draw=function(){if(!this.ready){this.ready=true;google.maps.event.trigger(this,'ready');}}
|
||
|
|
that.overlayView.draw();Ox.forEach(self.$controls,function($control){$control.appendTo(self.$map);});Ox.forEach(self.$placeControls,function($placeControl){$placeControl.appendTo(self.$map);});if(self.options.find){self.$findInput.value(self.options.find).triggerEvent('submit',{value:self.options.find});}else{if(self.options.selected){selectPlace(self.options.selected,true);}
|
||
|
|
if(mapBounds){if(isEmpty(mapBounds)){self.map.setZoom(self.minZoom);}else{self.map.fitBounds(mapBounds);}}
|
||
|
|
if(self.map.getZoom()<self.minZoom){self.map.setZoom(self.minZoom);}}
|
||
|
|
updateFormElements();self.loaded=true;that.triggerEvent('load');});}
|
||
|
|
function isEmpty(bounds){var southWest=bounds.getSouthWest(),northEast=bounds.getNorthEast();return southWest.lat()==northEast.lat()&&southWest.lng()==northEast.lng();}
|
||
|
|
function isLoaded(){return window.google&&window.google.maps&&window.google.maps.LatLng;}
|
||
|
|
function mapChanged(){if(self.boundsChanged){var bounds=self.map.getBounds()
|
||
|
|
if(!bounds){self.boundsChanged=false;return}
|
||
|
|
var southWest=bounds.getSouthWest(),northEast=bounds.getNorthEast(),south=southWest.lat(),west=southWest.lng(),north=northEast.lat(),east=northEast.lng();self.options.places({keys:self.placeKeys,query:{conditions:[].concat([{key:'lat',value:[south,north],operator:'='}],spansGlobe()?[{key:'lng',value:[-180,180],operator:'='}]:crossesDateline()?[{key:'lng',value:[east,west],operator:'!='}]:[{key:'lng',value:[west,east],operator:'='}]),operator:'&'},range:[0,self.options.maxMarkers],sort:[{key:'area',operator:'-'}]},function(result){var ids=self.options.selected?[self.options.selected]:[],previousIds=self.places.map(function(place){return place.id;});result.data.items.forEach(function(item,i){var place=getPlaceById(item.id);if(!place){place=new Ox.MapPlace(Ox.extend({map:that},item)).add();self.places.push(place);}else if(!place.visible){place.add();}
|
||
|
|
item.id!=self.options.selected&&ids.push(item.id);});previousIds.forEach(function(id){var place=getPlaceById(id);if(place&&ids.indexOf(id)==-1){place.remove();}});self.places=self.places.filter(function(place){return place.visible;});});self.boundsChanged=false;}
|
||
|
|
if(self.centerChanged){getMaxZoom(function(zoom){if(zoom&&zoom!=self.maxZoom){self.maxZoom=zoom;if(self.map.getZoom()>zoom){self.map.setZoom(zoom);}
|
||
|
|
constructZoomInput();}});self.centerChanged=false;}
|
||
|
|
if(self.zoomChanged){self.zoomChanged=false;}}
|
||
|
|
function pan(x,y){self.map.panBy(x*self.$map.width()/2,y*self.$map.height()/2);};function panToPlace(){var place;if(!self.loaded){setTimeout(function(){panToPlace();},100);}else{place=getSelectedPlace();place&&self.map.panTo(place.center);}}
|
||
|
|
function parseGeodata(data){var bounds=data.geometry.bounds||data.geometry.viewport,northEast=bounds.getNorthEast(),southWest=bounds.getSouthWest(),place={alternativeNames:[],components:data.address_components,countryCode:getCountryCode(data.address_components),east:northEast.lng(),editable:self.options.editable,fullGeoname:getFullGeoname(data.address_components),id:'_'+Ox.encodeBase32(Ox.uid()),map:that,north:northEast.lat(),south:southWest.lat(),type:getType(data.address_components[0].types),west:southWest.lng()};place.geoname=data.formatted_address||place.fullGeoname;place.name=(place.geoname||place.fullGeoname).split(', ')[0];if(Math.abs(place.west)==180&&Math.abs(place.east)==180){place.west=-179.99999999;place.east=179.99999999;}
|
||
|
|
place.south=Ox.limit(place.south,Ox.MIN_LATITUDE,Ox.MAX_LATITUDE-0.00000001);place.north=Ox.limit(place.north,Ox.MIN_LATITUDE+0.00000001,Ox.MAX_LATITUDE);function getCountryCode(components){var countryCode='';Ox.forEach(components,function(component){if(component.types.indexOf('country')>-1){countryCode=component.short_name;return false;}});return countryCode;}
|
||
|
|
function getFullGeoname(components){var country=false;return components.map(function(component,i){var name=component.long_name;if(i&&components[i-1].types.indexOf('country')>-1){country=true;}
|
||
|
|
return!country&&(i==0||name!=components[i-1].long_name)?name:null;}).join(', ');}
|
||
|
|
function getType(types){var strings={'country':['country'],'region':['administrative_area','colloquial_area'],'city':['locality'],'borough':['neighborhood','postal_code','sublocality'],'street':['intersection','route','street_address','street_number'],'building':['airport','floor','premise','room','subpremise'],'feature':['natural_feature','park']},type;function find(type){var ret;Ox.forEach(types,function(v){ret=Ox.startsWith(v,type);if(ret){return false;}});return ret;}Ox.forEach(strings,function(values,key){Ox.forEach(values,function(value){if(find(value)){type=key;return false;}});if(type){return false;}});return type||'feature';}
|
||
|
|
return place;}
|
||
|
|
function pressEnter(){var place=getSelectedPlace();if(place){if(place.editing){place.submit();}else{place.edit();}}else if(self.resultPlace){selectPlace(self.resultPlace.id)}}
|
||
|
|
function pressEscape(){var place=getSelectedPlace();if(place){if(place.editing){place.cancel();}else{selectPlace(null);}}else if(self.resultPlace){self.resultPlace.remove();self.resultPlace=null;}}
|
||
|
|
function removePlace(){var place=getSelectedPlace();place.id='_'+place.id;self.options.selected=place.id;self.places.splice(Ox.getIndexById(self.places,place.id),1);self.resultPlace&&self.resultPlace.remove();self.resultPlace=place;place.marker.update();place.rectangle.update();}
|
||
|
|
function reset(){self.map.getZoom()==self.zoom?self.map.panTo(self.center):self.map.fitBounds(self.bounds);}
|
||
|
|
function selectPlace(id,zoom){var place,selected;if(!self.loaded){setTimeout(function(){selectPlace(id,zoom);},100);}else{selected=getSelectedMarker();Ox.Log('Map','Ox.Map selectPlace()',id,selected);if(id!=selected){place=getPlaceById(selected);place&&place.deselect();if(id!==null){place=getPlaceById(id);if(place){select();}else{self.options.places({keys:self.placeKeys,query:{conditions:[{key:'id',value:id,operator:'=='}],operator:'&'}},function(result){if(result.data.items.length){place=new Ox.MapPlace(Ox.extend({map:that},result.data.items[0])).add();self.places.push(place);select();if(zoom){zoomToPlace();}else{panToPlace();}}});}}else{place=null;select();}}}
|
||
|
|
function select(){place&&place.select();self.options.selected=id;setPlaceControls(place);setStatus();that.triggerEvent('selectplace',place);that.triggerEvent('select',place);}};function setPlaceControls(place){var $placeControls=that.find('.OxPlaceControl'),country,isVisible=self.$placeControls.name.is(':visible');if(place){country=place.geoname.indexOf(', ')>-1?place.geoname.split(', ').pop():'';self.$placeControls.flag.options({tooltip:country?'Zoom to '+country:''}).data({country:country}).empty().append(Ox.$('<img>').attr({src:Ox.getFlagByGeoname(place.geoname,16)})).show();self.$placeControls.name.options({title:place.name||'<span class="OxLight">Unnamed</span>'});!isVisible&&$placeControls.show().animate({opacity:1},250);}else{isVisible&&$placeControls.animate({opacity:0},250,function(){$placeControls.hide();});}}
|
||
|
|
function setScale(){var metersPerPixel=getMetersPerPixel();Ox.forEach(self.scaleMeters,function(meters){var mapWidth=self.options.width||that.width(),scaleWidth=Math.round(meters/metersPerPixel);if(scaleWidth<=mapWidth/2-4){self.$controls.scale.options({title:'\u2190 '+(meters>1000?Ox.formatNumber(meters/1000)+' k':meters+' ')+'m \u2192'}).css({width:(scaleWidth-16)+'px'});return false;}});}
|
||
|
|
function setStatus(){var code,country,disabled,place,title;if(self.options.showStatusbar){place=getSelectedPlace();country=place?Ox.getCountryByGeoname(place.geoname):'';code=country?country.code:'NTHH';disabled=place&&!place.editable;if(place){title=place.id[0]=='_'?Ox._('Add Place'):Ox._('Remove Place');}else{title=Ox._('New Place');}
|
||
|
|
self.$placeFlag.attr({src:Ox.PATH+'Ox.Geo/png/icons/16/'+code+'.png'});self.$placeNameInput.options({disabled:disabled,value:place?place.name:''});self.$placeGeonameInput.options({disabled:disabled,value:place?place.geoname:''});self.$placeButton.options({disabled:disabled,title:title});}}
|
||
|
|
function spansGlobe(){return self.$map.width()>self.tileSize*Math.pow(2,self.map.getZoom());};function submitFind(data){self.options.find=data.value;if(data.value===''){if(self.options.selected&&self.options.selected[0]=='_'){selectPlace(null);}}else{that.findPlace(data.value,function(place){setStatus(place);});}
|
||
|
|
that.triggerEvent('find',{value:data.value});}
|
||
|
|
function toggleControls(){var $controls=that.find('.OxMapControl');self.options.showControls=!self.options.showControls;if(self.options.showControls){$controls.show().animate({opacity:1},250);}else{$controls.animate({opacity:0},250,function(){$controls.hide();});}
|
||
|
|
that.triggerEvent('togglecontrols',{visible:self.options.showControls});}
|
||
|
|
function toggleLabels(){self.options.showLabels=!self.options.showLabels;self.map.setMapTypeId(google.maps.MapTypeId[getMapType()]);that.triggerEvent('togglelabels',{visible:self.options.showLabels});}
|
||
|
|
function triggerGeocodeEvent(data){if(data.latLng){data.latLng={lat:data.latLng.lat(),lng:data.latLng.lng()}}
|
||
|
|
data.results.forEach(function(result){['bounds','viewport'].forEach(function(key){if(result.geometry[key]){result.geometry[key]={northEast:{lat:result.geometry[key].getNorthEast().lat(),lng:result.geometry[key].getNorthEast().lng()},southWest:{lat:result.geometry[key].getSouthWest().lat(),lng:result.geometry[key].getSouthWest().lng()}}}});if(result.geometry.location){result.geometry.location={lat:result.geometry.location.lat(),lng:result.geometry.location.lng()}}});that.triggerEvent('geocode',data);}
|
||
|
|
function undo(){Ox.Log('Map','Map undo')
|
||
|
|
var place=getSelectedPlace();place.editing&&place.undo();}
|
||
|
|
function updateFormElements(){var width=that.width();if(self.options.showZoombar){getMaxZoom(function(zoom){self.maxZoom=zoom;constructZoomInput();});}
|
||
|
|
if(self.options.showStatusbar){self.$placeNameInput.options({width:Math.floor((width-132)/2)});self.$placeGeonameInput.options({width:Math.ceil((width-132)/2)});}}
|
||
|
|
function zoom(z){if(!self.loaded){setTimeout(function(){zoom(z);},100);}else{self.map.setZoom(self.map.getZoom()+z);}}
|
||
|
|
function zoomChanged(){var zoom=self.map.getZoom();if(zoom<self.minZoom){self.map.setZoom(self.minZoom);}else if(self.maxZoom&&zoom>self.maxZoom){self.map.setZoom(self.maxZoom);}else{self.zoomChanged=true;self.$zoomInput&&self.$zoomInput.value(zoom);that.triggerEvent('zoom',{value:zoom});}}
|
||
|
|
function zoomToPlace(){var place;if(!self.loaded){setTimeout(function(){zoomToPlace();},100);}else{place=getSelectedPlace();place&&self.map.fitBounds(place.bounds);}}
|
||
|
|
that.addPlace=function(data){addPlaceToPlaces(data);};that.getCenter=function(){var center=self.map.getCenter();return{lat:center.lat(),lng:center.lng()};};that.getKey=function(){return self.shiftKey?'shift':self.metaKey?'meta':null;};that.getSelectedPlace=function(){return getSelectedPlace();}
|
||
|
|
that.editPlace=function(){getSelectedPlace().edit();return that;};that.findPlace=function(name,callback){getPlaceByName(name,function(place){if(place){addPlaceToMap(place);self.map.fitBounds(place.bounds);}else{name&&self.$findInput.addClass('OxError');}
|
||
|
|
callback(place);});return that;};that.newPlace=function(place){addPlaceToMap(place);return that;};that.panToPlace=function(){panToPlace();return that;};that.removePlace=function(){removePlace();return that;};that.resizeMap=function(){self.options.height=that.height();self.options.width=that.width();if(self.map){self.mapHeight=getMapHeight();self.minZoom=getMinZoom();if(self.minZoom>self.map.getZoom()){self.map.setZoom(self.minZoom);}
|
||
|
|
self.$map.css({height:self.mapHeight+'px',width:self.options.width+'px'});self.options.$zoomInput&&self.$zoomInput.options({size:self.options.width});updateFormElements();Ox.Log('Map','triggering google maps resize event, height',self.options.height)
|
||
|
|
google.maps.event.trigger(self.map,'resize');}
|
||
|
|
return that;}
|
||
|
|
that.setCenter=function(center){self.map.setCenter(new google.maps.LatLng(center.lat,center.lng));return that;};that.value=function(id,key,value){Ox.Log('Map','Map.value',id,key,value);getPlaceById(id).options(key,value);if(id==self.options.selected){if(key=='name'){self.$placeControls.name.options({title:value});}else if(key=='geoname'){self.$placeControls.flag.empty().append(Ox.$('<img>').attr({src:Ox.getFlagByGeoname(value,16)}));}}
|
||
|
|
return that;}
|
||
|
|
that.zoomToPlace=function(){zoomToPlace();return that;};that.zoom=function(value){zoom(value);return that;};return that;};'use strict';Ox.MapEditor=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({addPlace:null,collapsible:false,editPlace:null,getMatches:null,hasMatches:false,height:256,labels:false,mode:'add',pageLength:100,places:null,removePlace:null,selected:'',showControls:false,showLabels:false,showTypes:false,sort:[{key:'geoname',operator:'+'}],width:256}).options(options||{}).update({height:function(){self.$list.size();self.$map.resizeMap();},selected:function(){self.$list.options({selected:self.options.selected});},width:function(){self.$map.resizeMap();}}).css({width:self.options.width+'px',height:self.options.height+'px'});self.isAsync=Ox.isFunction(self.options.places);self.typeColor={country:[64,64,255],region:[0,192,192],city:[255,0,0],borough:[255,128,0],street:[255,255,0],building:[255,64,128],feature:[0,192,0]};self.areaSize={1000000:8,10000000000:10};self.columns=[{format:function(value,data){return data.type?Ox.$('<img>').attr({src:Ox.getFlagByGeoname(data.geoname,16)}).css({width:'14px',height:'14px',borderRadius:'4px',marginLeft:'-3px',marginTop:0}):'';},id:'countryCode',operator:'+',resizable:false,sort:function(value){var names=value.split(', ');if(!Ox.getCountryByGeoname(names[names.length-1])){names.push('~');}
|
||
|
|
return names.reverse().join(', ');},title:Ox._('Flag'),titleImage:'flag',tooltip:function(data){return Ox.toTitleCase(data.geoname||'')},visible:true,width:16},{format:function(value,data){var iconSize=6;Ox.forEach(self.areaSize,function(size,area){if(data.area>=area){iconSize=size;}else{return false;}});return data.type?Ox.$('<div>').addClass('OxTypeIcon').css({width:iconSize+'px',height:iconSize+'px',borderRadius:(iconSize+4)/2+'px',margin:[0,0,0,-3].map(function(v){return v+(10-iconSize)/2+'px';}).join(' '),background:'rgb('+self.typeColor[data.type].join(', ')+')'}):'';},id:'type',operator:'+',title:Ox._('Type'),titleImage:'icon',tooltip:function(data){return Ox.toTitleCase(data.type||'');},visible:true,width:16},{format:function(value,data){return data.type?value:Ox.$('<span>').addClass('OxWarning').html(value);},id:'name',operator:'+',removable:false,title:Ox._('Name'),visible:true,width:144},{format:function(value){return value.join('; ');},id:'alternativeNames',operator:'+',title:Ox._('Alternative Names'),visible:true,width:144},{id:'geoname',operator:'+',sort:function(value){var names=value.split(', ');if(!Ox.getCountryByGeoname(names[names.length-1])){names.push('~');}
|
||
|
|
return names.reverse().join(', ');},title:Ox._('Geoname'),visible:false,width:192},{align:'right',format:toFixed,id:'lat',operator:'+',title:Ox._('Latitude'),visible:true,width:64},{align:'right',format:toFixed,id:'lng',operator:'+',title:Ox._('Longitude'),visible:true,width:64},{align:'right',format:toFixed,id:'south',operator:'+',title:Ox._('South'),visible:false,width:64},{align:'right',id:'west',operator:'+',title:Ox._('West'),visible:false,width:64},{align:'right',format:toFixed,id:'north',operator:'+',title:Ox._('North'),visible:false,width:64},{align:'right',format:toFixed,id:'east',operator:'+',title:Ox._('East'),visible:false,width:64},{align:'right',format:{type:'area',args:[]},id:'area',operator:'-',title:Ox._('Area'),visible:true,width:128},{format:function(value){return Ox.encodeHTMLEntities(value);},id:'user',operator:'+',title:Ox._('User'),visible:false,width:96},{format:function(value){return value.replace('T',' ').replace('Z','');},id:'created',operator:'-',title:Ox._('Date Created'),visible:false,width:128},{format:function(value){return value.replace('T',' ').replace('Z','');},id:'modified',operator:'-',title:Ox._('Date Modified'),visible:false,width:128}];self.options.hasMatches&&self.columns.push({align:'right',id:'matches',operator:'-',title:Ox._('Matches'),visible:true,width:64});self.$listToolbar=Ox.Bar({size:24});self.$findElement=Ox.FormElementGroup({elements:[self.$findSelect=Ox.Select({items:[{id:'all',title:Ox._('Find: All')},{id:'name',title:Ox._('Find: Name')},{id:'alternativeNames',title:Ox._('Find: Alternative Names')},{id:'geoname',title:Ox._('Find: Geoname')}],overlap:'right',type:'image'}).bindEvent({change:function(data){var key=data.value,value=self.$findInput.value();value&&updateList(key,value);}}),self.$findInput=Ox.Input({clear:true,placeholder:Ox._('Find in List'),width:234}).bindEvent({submit:function(data){var key=self.$findSelect.value(),value=data.value;updateList(key,value);}})]}).css({float:'right',margin:'4px'}).appendTo(self.$listToolbar);self.$list=Ox.TableList({columns:self.columns,columnsRemovable:true,columnsVisible:true,items:Ox.clone(self.options.places),keys:['area','geoname','matches'],max:1,min:0,pageLength:self.options.pageLength,scrollbarVisible:true,selected:self.options.selected?[self.options.selected]:[],sort:self.options.sort,unique:'id'}).bindEvent({'delete':removeItem,init:initList,key_0:function(){self.$map.panToPlace();},key_equal:function(){self.$map.zoom(1);},key_minus:function(){self.$map.zoom(-1);},key_shift_0:function(){self.$map.zoomToPlace();},load:function(){that.triggerEvent('loadlist');},open:openItem,select:function(data){selectItem(data);}});self.options.selected&&self.$list.bindEventOnce({load:function(){self.$list.triggerEvent({select:{ids:[self.options.selected]}});}});self.$listStatusbar=Ox.Bar({size:16});self.$status=Ox.Element().css({paddingTop:'2px',margin:'auto',fontSize:'9px',textAlign:'center'}).appendTo(self.$listStatusbar);self.$map=Ox.Map({clickable:true,editable:true,findPlaceholder:Ox._('Find on Map'),height:self.options.height,places:self.options.places,showControls:self.options.showControls,showLabels:self.options.showLabels,showTypes:self.options.showTypes,toolbar:true,width:self.options.width-514,zoombar:true}).bindEvent({changeplace:function(data){self.$placeForm.values(data).show();self.$areaKmInput.value(Ox.formatArea(data.area));},changeplaceend:function(data){var isResult=self.selectedPlace[0]=='_';!isResult&&editPlace(['lat','lng','south','west','north','east','area']);},geocode:function(data){that.triggerEvent('geocode',data);},select:selectPlace});self.$placeTitlebar=Ox.Bar({size:24});self.$placeTitle=Ox.$('<div>').hide().appendTo(self.$placeTitlebar);if(self.options.mode=='define'){self.$findPlaceButton=Ox.Button({title:'find',tooltip:Ox._('Find'),type:'image'}).css({float:'left',margin:'4px'}).bindEvent({click:findPlace}).hide().appendTo(self.$placeTitle);}
|
||
|
|
self.$placeFlag=Ox.$('<img>').addClass('OxFlag').attr({src:Ox.getFlagByGeoname('',16)}).css({float:'left',margin:'4px'}).appendTo(self.$placeTitle);self.$placeName=Ox.Label({title:'',width:208}).css({float:'left',margin:'4px 0 4px 0'}).bindEvent({singleclick:function(){self.$map.panToPlace();},doubleclick:function(){self.$map.zoomToPlace();}}).appendTo(self.$placeTitle);self.$deselectPlaceButton=Ox.Button({title:'close',tooltip:Ox._('Done'),type:'image'}).css({float:'left',margin:'4px'}).bindEvent({click:function(){self.$list.options({selected:[]});selectItem({ids:[]});}}).appendTo(self.$placeTitle);self.$placeData=Ox.Element();self.$placeForm=Ox.Form({items:[].concat([self.$nameInput=Ox.Input({id:'name',label:Ox._('Name'),labelWidth:80,width:240}),self.$alternativeNamesInput=Ox.ArrayInput({id:'alternativeNames',label:Ox._('Alternative Names'),max:10,values:[],width:240}),self.$geonameInput=Ox.Input({id:'geoname',label:Ox._('Geoname'),labelWidth:80,width:240}),Ox.Input({id:'countryCode'}).hide(),Ox.Select({id:'type',items:[{id:'country',title:Ox._('Country')},{id:'region',title:Ox._('Region')},{id:'city',title:Ox._('City')},{id:'borough',title:Ox._('Borough')},{id:'street',title:Ox._('Street')},{id:'building',title:Ox._('Building')},{id:'feature',title:Ox._('Feature')}],label:Ox._('Type'),labelWidth:80,width:240})],['Latitude','Longitude','South','West','North','East'].map(function(v){var id=(v=='Latitude'?'lat':v=='Longitude'?'lng':v).toLowerCase(),max=['Latitude','South','North'].indexOf(v)>-1?Ox.MAX_LATITUDE:180;return Ox.Input({changeOnKeypress:true,decimals:8,disabled:['lat','lng'].indexOf(id)>-1,id:id,label:Ox._(v),labelWidth:80,min:-max,max:max,type:'float',width:240});}),[self.$areaInput=Ox.Input({id:'area',type:'float'}).hide()]),width:240}).css({margin:'8px'}).hide().bindEvent({change:function(data){var isResult=self.selectedPlace[0]=='_';if(data.id=='name'){var name=data.data.value;!isResult&&self.$list.value(self.selectedPlace,'name',name);self.$placeName.options({title:name});if(!self.isAsync){Ox.getObjectById(self.options.places,self.selectedPlace).name=name;}else if(isResult){getMatches(this.values());}else{editPlace(['name']);}
|
||
|
|
self.$map.value(self.selectedPlace,'name',name);}else if(data.id=='alternativeNames'){if(!self.isAsync){}else if(isResult){getMatches(this.values());}else{editPlace(['alternativeNames']);}
|
||
|
|
self.$map.value(self.selectedPlace,'alternativeNames',data.data.value);}else if(data.id=='geoname'){var geoname=data.data.value,country=Ox.getCountryByGeoname(geoname),countryCode=country?country.code:'';self.$placeFlag.attr({src:Ox.getFlagByGeoname(geoname,16)});self.$placeForm.values({countryCode:countryCode});if(!self.isAsync){if(!isResult){self.$list.value(self.selectedPlace,'geoname',geoname);self.$list.value(self.selectedPlace,'countryCode',countryCode);}}else{!isResult&&editPlace(['countryCode','geoname']);}
|
||
|
|
self.$map.value(self.selectedPlace,'countryCode',countryCode);self.$map.value(self.selectedPlace,'geoname',geoname);}else if(data.id=='type'){if(!self.isAsync){}else{!isResult&&editPlace(['type']);}
|
||
|
|
self.$map.value(self.selectedPlace,'type',data.data.value);}else{if(!self.isAsync){}else{!isResult&&editPlace([data.id]);}
|
||
|
|
self.$map.value(self.selectedPlace,data.id,parseFloat(data.data.value));}}}).appendTo(self.$placeData);self.$areaKmInput=Ox.Input({disabled:true,id:'areaKm',label:Ox._('Area'),labelWidth:80,textAlign:'right',width:240}).css({margin:'8px 8px 0 8px'}).hide().appendTo(self.$placeData);if(self.options.hasMatches){self.$matchesInput=Ox.Input({disabled:true,id:'matches',label:Ox._('Matches'),labelWidth:80,type:'int',width:240}).css({margin:'8px'}).hide().appendTo(self.$placeData);}
|
||
|
|
self.$placeStatusbar=Ox.Bar({size:24});self.$addPlaceButton=Ox.Button({title:Ox._('Add Place'),width:90}).css({float:'left',margin:'4px'}).bindEvent({click:function(){if(this.options('title')==Ox._('Add Place')){addPlace();}else{removePlace();}}}).hide().appendTo(self.$placeStatusbar);self.$newPlaceButton=Ox.Button({title:Ox._('New Place'),width:70}).css({float:'right',margin:'4px'}).bindEvent({click:function(){self.$map.newPlace();}}).appendTo(self.$placeStatusbar);if(self.options.mode=='define'){self.$definePlaceButton=Ox.Button({title:Ox._('Define Place'),width:80}).css({float:'right',margin:'4px 0 4px 0'}).bindEvent({click:function(){if(this.options('title')==Ox._('Define Place')){definePlace();}else{clearPlace();}}}).hide().appendTo(self.$placeStatusbar);}
|
||
|
|
that.setElement(Ox.SplitPanel({elements:[{collapsible:self.options.collapsible,element:self.$listPanel=Ox.SplitPanel({elements:[{element:self.$listToolbar,size:24},{element:self.$list},{element:self.$listStatusbar,size:16}],orientation:'vertical'}),resizable:true,resize:[256,384,512],size:256},{element:self.$map.bindEvent({resize:function(){self.$map.resizeMap();}})},{collapsible:self.options.collapsible,element:Ox.SplitPanel({elements:[{element:self.$placeTitlebar,size:24},{element:self.$placeData},{element:self.$placeStatusbar,size:24}],orientation:'vertical'}).bindEvent({resize:function(data){self.$placeName.options({width:data.size-48});self.$placeForm.options('items').forEach(function($item){$item.options({width:data.size-16});});self.$areaKmInput.options({width:data.size-16});self.$matchesInput&&self.$matchesInput.options({width:data.size-16});}}),resizable:true,resize:[256,384],size:256}],orientation:'horizontal'}).addClass('OxMapEditor'));function addPlace(){var place=self.$placeForm.values(),country=Ox.getCountryByGeoname(place.geoname);place.countryCode=country?country.code:'';if(!self.isAsync){place.id=self.selectedPlace.slice(1);self.selectedPlace=place.id;self.options.selected=place.id;self.options.places.push(place);self.$list.options({items:Ox.clone(self.options.places)}).options({selected:[place.id]});self.$map.addPlace(place);self.$addPlaceButton.options({title:Ox._('Remove Place')});}else{self.$addPlaceButton.options({disabled:true,title:Ox._('Adding...')});self.options.addPlace(encodeValues(place),function(result){if(result.status.code==200){place.id=result.data.id;self.options.selected=place.id;self.selectedPlace=place.id;self.$list.reloadList().options({selected:[place.id]});self.$map.addPlace(place);self.options.hasMatches&&self.$matchesInput.value(result.data.matches).show();self.options.mode=='define'&&self.$definePlaceButton.options({disabled:!result.data.matches,title:Ox._('Clear Place')}).show();self.$addPlaceButton.options({disabled:false,title:Ox._('Remove Place')}).show();}else if(result.status.code==409){if(result.data.names.indexOf(self.$nameInput.value())>-1){self.$nameInput.addClass('OxError');}
|
||
|
|
self.$alternativeNamesInput.setErrors(result.data.names);self.$addPlaceButton.options({disabled:false,title:Ox._('Add Place')});}});}}
|
||
|
|
function clearPlace(){var values={id:self.selectedPlace,alternativeNames:[],geoname:'',type:'',lat:null,lng:null,south:null,west:null,north:null,east:null,area:null};self.$definePlaceButton.options({disabled:true,title:Ox._('Clearing...')});self.options.editPlace(values,function(){self.$map.removePlace();self.$list.reloadList();self.$findPlaceButton.show();self.$placeFlag.hide();hideForm();self.$definePlaceButton.options({disabled:false,title:Ox._('Define Place')})});}
|
||
|
|
function decodeValues(place){return Ox.map(place,function(value){var type=Ox.typeOf(value);return type=='string'?Ox.decodeHTMLEntities(value):type=='array'?Ox.map(value,function(value){return decodeValues(value);}):value;});}
|
||
|
|
function definePlace(){self.$map.newPlace();self.$definePlaceButton.options({title:Ox._('Clear Place')});}
|
||
|
|
function encodeValues(place){return Ox.map(place,function(value){var type=Ox.typeOf(value);return type=='string'?Ox.encodeHTMLEntities(value):type=='array'?Ox.map(value,function(value){return encodeValues(value);}):value;});}
|
||
|
|
function editPlace(keys){Ox.Log('Map','EDIT PLACE',keys,self.$placeForm.values())
|
||
|
|
var values=Ox.filter(self.$placeForm.values(),function(values,key){return keys.indexOf(key)>-1;});values.id=self.selectedPlace;self.options.editPlace(encodeValues(values),function(result){Ox.Log('Map','EDIT PLACE::',result)
|
||
|
|
if(result.status.code==200){if(keys.indexOf(self.$list.options('sort')[0].key)>-1||(self.options.mode=='define'&&(keys.indexOf('name')>-1||keys.indexOf('alternativeNames')>-1))){self.$list.reloadList();}else{Ox.forEach(values,function(value,key){if(key!='id'){self.$list.value(values.id,key,value);self.$map.value(values.id,key,value);}});self.$list.value(values.id,'matches',result.data.matches);}
|
||
|
|
if(self.options.mode=='define'){self.$findPlaceButton.hide();self.$placeFlag.show();}
|
||
|
|
self.options.hasMatches&&self.$matchesInput.value(result.data.matches);if(self.options.mode=='define'){self.$definePlaceButton.options({disabled:!result.data.matches,title:Ox._('Clear Place')});self.$addPlaceButton.options({disabled:!!result.data.matches});}}else{if(result.data.names.indexOf(self.$nameInput.value())>-1){self.$nameInput.addClass('OxError');}
|
||
|
|
self.$alternativeNamesInput.setErrors(result.data.names);}});}
|
||
|
|
function findPlace(){self.$map.options({find:self.$list.value(self.options.selected,'name')});}
|
||
|
|
function hideForm(){self.$placeForm.hide();self.$areaKmInput.hide();}
|
||
|
|
function getMatches(place){var names;if(self.options.hasMatches){names=Ox.filter([place.name].concat(place.alternativeNames),function(name){return name!=='';});self.options.getMatches(names,function(matches){self.$matchesInput.value(matches);});}}
|
||
|
|
function initList(data){self.$status.html(Ox.formatCount(data.items,'Place'));}
|
||
|
|
function openItem(data){selectItem(data);self.$map.zoomToPlace(data.ids[0]);}
|
||
|
|
function removeItem(data){var id=data.ids[0];self.$list.value(id,'type')&&self.$map.removePlace(id);that.triggerEvent('removeplace',{id:id});}
|
||
|
|
function removePlace(){var index;Ox.Log('Map','REMOVE PLACE',self.selectedPlace,index)
|
||
|
|
if(!self.isAsync){index=Ox.getIndexById(self.options.places,self.selectedPlace);self.options.selected='';self.options.places.splice(index,1);self.$list.options({items:Ox.clone(self.options.places)});self.$addPlaceButton.options({title:Ox._('Add Place')});}
|
||
|
|
if(self.isAsync){self.$addPlaceButton.options({disabled:true,title:Ox._('Removing...')})
|
||
|
|
self.options.removePlace({id:self.selectedPlace},function(){self.options.selected='';self.$list.options({selected:[]}).reloadList(true);self.options.hasMatches&&self.$matchesInput.hide();self.options.mode=='define'&&self.$definePlaceButton.options({disabled:true});self.$addPlaceButton.options({disabled:false,title:Ox._('Add Place')});});}
|
||
|
|
self.$map.removePlace();that.triggerEvent('removeplace',{id:self.selectedPlace});}
|
||
|
|
function selectItem(data,place){var isUndefined,selectedPlace;self.options.selected=data.ids.length?data.ids[0]:'';place=place||(self.options.selected?self.$list.value(self.options.selected):{});isUndefined=!!self.options.selected&&!place.type;selectedPlace=self.options.selected&&!isUndefined?self.options.selected:'';self.$map.options({selected:selectedPlace});selectedPlace&&self.$map.panToPlace();if(self.options.selected){self.options.mode=='define'&&self.$findPlaceButton[isUndefined?'show':'hide']();self.$placeFlag.attr({src:Ox.getFlagByGeoname(place.geoname||'',16)})[isUndefined?'hide':'show']();self.$placeName.options({title:place.name||''});self.$placeTitle.show();!isUndefined?showForm(place):hideForm();self.options.hasMatches&&self.$matchesInput.value(place.matches||0).show();self.options.mode=='define'&&self.$definePlaceButton.options({disabled:!isUndefined&&!place.matches,title:isUndefined?'Define Place':'Clear Place'}).show();self.$addPlaceButton.options({disabled:self.options.mode=='define'&&!!place.matches,title:Ox._('Remove Place')}).show();}else{self.$placeTitle.hide();hideForm();self.options.hasMatches&&self.$matchesInput.hide();self.options.mode=='define'&&self.$definePlaceButton.hide();self.$addPlaceButton.hide();}}
|
||
|
|
function selectPlace(place){var isResult=place&&place.id[0]=='_',isUndefined=!!self.options.selected&&!self.$list.value(self.options.selected,'type');self.selectedPlace=place&&place.id?place.id:'';if(isResult&&isUndefined){Ox.print('place.id',place.id,'self.options.selected',self.options.selected,'type',self.$list.value(self.options.selected));self.selectedPlace=self.options.selected;place.name=self.$list.value(self.options.selected,'name');place.id=self.options.selected;self.$map.addPlace(place);self.$findPlaceButton.hide();self.$placeFlag.attr({src:Ox.getFlagByGeoname(place.geoname||'',16)}).show();showForm(place);editPlace(['geoname','type','lat','lng','south','west','north','east','area']);}else if(self.selectedPlace&&isResult){self.$list.options({selected:[]});self.$placeFlag.attr({src:Ox.getFlagByGeoname(place.geoname||'',16)}).show();self.$placeName.options({title:place.name||''});self.$placeTitle.show();showForm(place);if(self.options.hasMatches){self.$matchesInput.value('').show();getMatches(place);}
|
||
|
|
self.options.mode=='define'&&self.$definePlaceButton.hide();self.$addPlaceButton.options({disabled:false,title:Ox._('Add Place')}).show();}else if(!self.selectedPlace&&!self.options.selected){self.$placeFlag.hide();self.$placeTitle.hide();hideForm();self.options.hasMatches&&self.$matchesInput.hide();}else if(!self.selectedPlace&&isUndefined){}else{self.options.selected=self.selectedPlace;self.$list.options({selected:self.options.selected?[self.options.selected]:[]});selectItem({ids:self.$list.options('selected')},place);}}
|
||
|
|
function showForm(place){self.$nameInput.removeClass('OxError');self.$alternativeNamesInput.setErrors([]);self.$placeForm.values(decodeValues(place)).show();self.$areaKmInput.value(Ox.formatArea(place.area)).show();}
|
||
|
|
function toFixed(val){return Ox.isNumber(val)?val.toFixed(3):'';}
|
||
|
|
function toggleList(){var list=self.$listSelect.options('value');list=='names'&&!self.namesLoaded?load():toggle();function load(){self.options.names(function(data){self.$namesList.options({items:data});self.namesLoaded=true;toggle();});}
|
||
|
|
function toggle(){self.$listPanel.replaceElement(1,self[list=='places'?'$list':'$namesList']);}}
|
||
|
|
function updateList(key,value){var query={conditions:[].concat(['all','name'].indexOf(key)>-1?[{key:'name',value:value,operator:'='}]:[],['all','alternativeNames'].indexOf(key)>-1?[{key:'alternativeNames',value:value,operator:'='}]:[],['all','geoname'].indexOf(key)>-1?[{key:'geoname',value:value,operator:'='}]:[]),operator:key=='all'?'|':'&'};self.$list.options({items:function(data,callback){return pandora.api.findPlaces(Ox.extend(data,{query:query}),callback);}});}
|
||
|
|
that.focusList=function(){self.$list.gainFocus();return that;};that.reloadList=function(){self.$list.reloadList();return that;};that.resizeMap=function(){self.$map.resizeMap();return that;};return that;};'use strict';Ox.MapImage=function(options,self){var self=self||{},that=Ox.Element('<img>',self).defaults({backgroundColor:[0,0,0,0],borderColor:[0,0,0,0],borderWidth:0,height:640,markers:[],place:null,type:'satellite',width:640}).options(options||{});self.src=document.location.protocol
|
||
|
|
+'//maps.google.com/maps/api/staticmap?sensor=false'+'&size='+self.options.width+'x'+self.options.height+'&maptype='+self.options.type;if(self.options.place){self.src+='&path=fillcolor:'+formatColor(self.options.backgroundColor)
|
||
|
|
+'|color:0x'+formatColor(self.options.borderColor)
|
||
|
|
+'|weight:'+self.options.borderWidth+'|'
|
||
|
|
+[['south','west'],['north','west'],['north','east'],['south','east'],['south','west']].map(function(keys){return[self.options.place[keys[0]],self.options.place[keys[1]]].join(',');}).join('|');}else{self.src+='¢er=0,0&zoom=2'}
|
||
|
|
if(self.options.markers.length){self.src+='&markers='
|
||
|
|
+self.options.markers.map(function(marker){return[marker.lat,marker.lng].join(',')}).join('|');}
|
||
|
|
that.attr({src:self.src});function formatColor(color){return color.map(function(c){return Ox.pad(c.toString(16),'left',2,'0');}).join('')}
|
||
|
|
return that;};'use strict';Ox.MapMarker=function(options){options=Ox.extend({map:null,place:null},options);var that=this,areaSize={100:10,10000:12,1000000:14,100000000:16,10000000000:18,1000000000000:20,100000000000000:22},themeData=Ox.Theme.getThemeData(),typeColor={};['country','region','city','borough','street','building','feature'].forEach(function(type){typeColor[type]=themeData['mapPlace'+Ox.toTitleCase(type)+'Color'];});Ox.forEach(options,function(val,key){that[key]=val;});that.marker=new google.maps.Marker({raiseOnDrag:false,shape:{coords:[8,8,8],type:'circle'}});setOptions();function click(){var key=that.map.getKey(),place,bounds,southWest,northEast;if(!that.place.selected){if(that.map.options('editable')&&(key=='meta'||key=='shift')){place=that.map.getSelectedPlace();}
|
||
|
|
if(place){bounds=new google.maps.LatLngBounds(new google.maps.LatLng(place.south,place.west),new google.maps.LatLng(place.north,place.east));bounds=bounds.union(that.place.bounds);southWest=bounds.getSouthWest();northEast=bounds.getNorthEast();that.map.newPlace(new Ox.MapPlace({alternativeNames:[],countryCode:'',editable:true,geoname:'',id:'_'+Ox.encodeBase32(Ox.uid()),map:that.map,name:'',type:'feature',south:southWest.lat(),west:southWest.lng(),north:northEast.lat(),east:northEast.lng()}));}else{that.map.options({selected:that.place.id});}}else{if(key=='meta'){that.map.options({selected:null});}else{that.map.panToPlace();}}}
|
||
|
|
function dblclick(){that.place.selected&&that.map.zoomToPlace();}
|
||
|
|
function dragstart(e){Ox.$body.addClass('OxDragging');}
|
||
|
|
function drag(e){var northSouth=(that.place.north-that.place.south)/2,lat=Ox.limit(e.latLng.lat(),Ox.MIN_LATITUDE+northSouth,Ox.MAX_LATITUDE-northSouth),lng=e.latLng.lng(),span=Math.min(that.place.sizeEastWest*Ox.getDegreesPerMeter(lat)/2,179.99999999),degreesPerMeter=Ox.getDegreesPerMeter(lat);that.place.south+=lat-that.place.lat;that.place.north+=lat-that.place.lat;that.place.west=lng-span;that.place.east=lng+span;if(that.place.west<-180){that.place.west+=360;}else if(that.place.east>180){that.place.east-=360;}
|
||
|
|
Ox.Log('Map','west',that.place.west,'east',that.place.east,'span',span);that.place.update();that.marker.setOptions({position:that.place.center});that.place.rectangle.update();}
|
||
|
|
function dragend(e){Ox.$body.removeClass('OxDragging');that.map.triggerEvent('changeplaceend',that.place);}
|
||
|
|
function getMarkerImage(options,callback){options=Ox.extend({background:[255,0,0],editing:false,result:false,selected:false,size:16},options);var background=options.result?[255,255,0]:[255,0,0],border=options.editing?[128,128,255]:options.selected?[255,255,255]:[0,0,0],c=Ox.canvas(options.size,options.size),image,r=options.size/2;if(Ox.isArray(background)){c.context.fillStyle='rgba('+background.join(', ')+', 0.5)';c.context.arc(r,r,r-2,0,360);c.context.fill();renderImage();}else{image=new Image();image.onload=renderImage;image.src=background;}
|
||
|
|
function renderImage(){if(Ox.isString(background)){c.context.drawImage(image,1,1,options.size-2,options.size-2);}
|
||
|
|
c.context.beginPath();c.context.lineWidth=2;c.context.strokeStyle='rgb('+border.join(', ')+')';c.context.arc(r,r,r-1,0,360);c.context.stroke();callback(new google.maps.MarkerImage(c.canvas.toDataURL(),new google.maps.Size(options.size,options.size),new google.maps.Point(0,0),new google.maps.Point(r,r)));}}
|
||
|
|
function mouseover(e){var offset=that.map.offset(),xy=that.map.overlayView.getProjection().fromLatLngToContainerPixel(e.latLng);that.tooltip.show(offset.left+Math.round(xy.x)-4,offset.top+Math.round(xy.y)+20);}
|
||
|
|
function mouseout(){that.tooltip.hide();}
|
||
|
|
function setOptions(){var fix=that.marker.getDraggable()&&!that.place.editing,color=that.map.options('markerColor'),size=that.map.options('markerSize');if(color=='auto'){that.color=typeColor[that.place.type]||typeColor['mapPlaceFeatureColor'];}else if(Ox.isArray(color)){that.color=color;}else{that.color=color(that.place);}
|
||
|
|
if(size=='auto'){that.size=8;Ox.forEach(areaSize,function(size,area){if(that.place.area>=area){that.size=size;}else{return false;}});}else if(Ox.isNumber(size)){that.size=size;}else{that.size=size(that.place);}
|
||
|
|
that.marker.setOptions({cursor:that.place.editing?'move':'pointer',draggable:that.place.editing,icon:Ox.MapMarkerImage({color:that.color,mode:that.place.editing?'editing':that.place.selected?'selected':'normal',size:that.size,type:that.place.id[0]=='_'?'result':'place'}),position:that.place.center});if(fix){that.marker.setVisible(false);setTimeout(function(){that.marker.setVisible(true);},0);}
|
||
|
|
setTooltip();}
|
||
|
|
function setTooltip(){that.tooltip&&that.tooltip.remove();that.tooltip=Ox.Tooltip({title:'<img src="'
|
||
|
|
+Ox.getFlagByGeoname(that.place.geoname,16)
|
||
|
|
+'" style="float: left; width: 16px; height: 16px; margin: 1px 0 1px -1px; border-radius: 4px"/>'
|
||
|
|
+'<div style="float: left; margin: 4px -1px 0 4px; font-size: 9px;">'
|
||
|
|
+that.map.options('markerTooltip')(that.place)+'</div>'}).addClass('OxMapMarkerTooltip');}
|
||
|
|
that.add=function(){that.marker.setMap(that.map.map);google.maps.event.addListener(that.marker,'click',click);google.maps.event.addListener(that.marker,'dblclick',dblclick);google.maps.event.addListener(that.marker,'mouseover',mouseover);google.maps.event.addListener(that.marker,'mouseout',mouseout);return that;};that.edit=function(){setOptions();google.maps.event.addListener(that.marker,'dragstart',dragstart);google.maps.event.addListener(that.marker,'drag',drag);google.maps.event.addListener(that.marker,'dragend',dragend);return that;};that.remove=function(){that.marker.setMap(null);google.maps.event.clearListeners(that.marker);return that;};that.submit=function(){google.maps.event.clearListeners(that.marker,'dragstart');google.maps.event.clearListeners(that.marker,'drag');google.maps.event.clearListeners(that.marker,'dragend');return that;}
|
||
|
|
that.update=function(){setOptions();return that;}
|
||
|
|
return that;};'use strict';Ox.MapMarkerImage=(function(){var cache={};return function(options){options=Ox.extend({color:[255,0,0],mode:'normal',rectangle:false,size:16,type:'place'},options);var index=[options.type,options.mode,options.size,options.color.join(',')].join(';'),themeData=Ox.Theme.getThemeData();if(!cache[index]){var color=options.rectangle?[0,0,0,0]:options.color.concat([options.type=='place'?0.75:0.25]),border=(options.mode=='normal'?themeData.mapPlaceBorder:options.mode=='selected'?themeData.mapPlaceSelectedBorder:themeData.mapPlaceEditingBorder).concat([options.type=='result'?0.5:1]),c=Ox.canvas(options.size,options.size),image,r=options.size/2;c.context.fillStyle='rgba('+color.join(', ')+')';c.context.arc(r,r,r-2,0,360);c.context.fill();c.context.beginPath();c.context.lineWidth=2;c.context.strokeStyle='rgba('+border.join(', ')+')';c.context.arc(r,r,r-1,0,360);c.context.stroke();cache[index]=new google.maps.MarkerImage(c.canvas.toDataURL(),new google.maps.Size(options.size,options.size),new google.maps.Point(0,0),new google.maps.Point(r,r));}
|
||
|
|
return cache[index];}}());'use strict';Ox.MapPlace=function(options){options=Ox.extend({east:0,editing:false,geoname:'',map:null,name:'',north:0,selected:false,south:0,type:'',visible:false,west:0},options);var that=this;Ox.forEach(options,function(val,key){that[key]=val;});update();function update(updateMarker){that.points={ne:new google.maps.LatLng(that.north,that.east),sw:new google.maps.LatLng(that.south,that.west)};that.bounds=new google.maps.LatLngBounds(that.points.sw,that.points.ne);that.center=that.bounds.getCenter();that.lat=that.center.lat();that.lng=that.center.lng();Ox.extend(that.points,{e:new google.maps.LatLng(that.lat,that.east),s:new google.maps.LatLng(that.south,that.lng),se:new google.maps.LatLng(that.south,that.east),n:new google.maps.LatLng(that.north,that.lng),nw:new google.maps.LatLng(that.north,that.west),w:new google.maps.LatLng(that.lat,that.west)});that.sizeNorthSouth=(that.north-that.south)*Ox.EARTH_CIRCUMFERENCE/360;that.sizeEastWest=(that.east+(that.west>that.east?360:0)-that.west)*Ox.getMetersPerDegree(that.lat);that.area=Ox.getArea({lat:that.south,lng:that.west},{lat:that.north,lng:that.east});if(!that.marker){that.marker=new Ox.MapMarker({map:that.map,place:that});that.rectangle=new Ox.MapRectangle({map:that.map,place:that});}else if(updateMarker){that.marker.update();that.rectangle.update();}}
|
||
|
|
function editable(){return that.map.options('editable')&&that.editable;}
|
||
|
|
that.add=function(){that.visible=true;that.marker.add();return that;};that.cancel=function(){if(editable()){that.undo();that.editing=false;that.marker.update();that.rectangle.deselect();}
|
||
|
|
return that;};that.crossesDateline=function(){return that.west>that.east;}
|
||
|
|
that.deselect=function(){that.editing&&that.submit();that.selected=false;that.marker.update();that.rectangle.remove();return that;};that.edit=function(){if(editable()){that.editing=true;that.original={south:that.south,west:that.west,north:that.north,east:that.east};that.marker.edit();that.rectangle.select();}
|
||
|
|
return that;};that.options=function(options){options=Ox.makeObject(arguments);Ox.forEach(options,function(value,key){that[key]=value;});update(true);};that.remove=function(){that.editing&&that.submit();that.selected&&that.deselect();that.visible=false;that.marker.remove();return that;};that.select=function(){that.selected=true;!that.visible&&that.add();that.marker.update();that.rectangle.add();return that;};that.submit=function(){if(editable()){that.editing=false;that.marker.update();that.rectangle.deselect();}
|
||
|
|
return that;};that.update=function(updateMarker){update(updateMarker);that.map.triggerEvent('changeplace',that);return that;};that.undo=function(){if(editable()){Ox.forEach(that.original,function(v,k){that[k]=v;});that.update();that.marker.update();that.rectangle.update();}
|
||
|
|
return that;};return that;};'use strict';Ox.MapRectangle=function(options){options=Ox.extend({map:null,place:null},options);var that=this,themeData=Ox.Theme.getThemeData();Ox.forEach(options,function(val,key){that[key]=val;});that.rectangle=new google.maps.Rectangle({clickable:true,bounds:that.place.bounds});that.markers=Ox.map(that.place.points,function(point,position){return new Ox.MapRectangleMarker({map:that.map,place:that.place,position:position});});setOptions();function click(){if(that.map.options('editable')&&that.place.editable&&!that.place.editing){that.place.edit();}else if(that.map.getKey()=='meta'){that.place.submit();}else if(that.map.getKey()=='shift'){that.map.zoomToPlace();}else{that.map.panToPlace();}}
|
||
|
|
function setOptions(){var color='#'+Ox.toHex(themeData[that.place.editing?'mapPlaceEditingBorder':'mapPlaceSelectedBorder']);that.rectangle.setOptions({bounds:that.place.bounds,fillColor:color,fillOpacity:that.place.editing?0.1:0,strokeColor:color,strokeOpacity:that.place.id[0]=='_'?0.5:1,strokeWeight:2});}
|
||
|
|
that.add=function(){that.rectangle.setMap(that.map.map);google.maps.event.addListener(that.rectangle,'click',click);return that;};that.deselect=function(){setOptions();Ox.Log('Map','MARKERS',that.markers)
|
||
|
|
Ox.forEach(that.markers,function(marker){marker.remove();});return that;};that.remove=function(){that.rectangle.setMap(null);google.maps.event.clearListeners(that.rectangle);return that;}
|
||
|
|
that.select=function(){setOptions();Ox.forEach(that.markers,function(marker){marker.add();});return that;};that.update=function(){Ox.Log('Map','UPDATE...')
|
||
|
|
setOptions();Ox.forEach(that.markers,function(marker){marker.update();});return that;}
|
||
|
|
return that;};'use strict';Ox.MapRectangleMarker=function(options){options=Ox.extend({map:null,place:null,position:''},options);var that=this;Ox.forEach(options,function(val,key){that[key]=val;});that.markerImage=new google.maps.MarkerImage
|
||
|
|
that.marker=new google.maps.Marker({cursor:that.position+'-resize',draggable:true,icon:Ox.MapMarkerImage({mode:'editing',rectangle:true,type:that.place.id[0]=='_'?'result':'place'}),position:that.place.points[that.position],raiseOnDrag:false});function dragstart(e){Ox.$body.addClass('OxDragging');that.drag={lat:e.latLng.lat(),lng:e.latLng.lng()};}
|
||
|
|
function drag(e){Ox.Log('Map',e.pixel.x,e.pixel.y)
|
||
|
|
var lat=Ox.limit(e.latLng.lat(),Ox.MIN_LATITUDE,Ox.MAX_LATITUDE),lng=e.latLng.lng();that.drag={lat:lat,lng:lng};if(that.position.indexOf('s')>-1){that.place.south=lat;}
|
||
|
|
if(that.position.indexOf('n')>-1){that.place.north=lat;}
|
||
|
|
if(that.position.indexOf('w')>-1){that.place.west=lng;}
|
||
|
|
if(that.position.indexOf('e')>-1){that.place.east=lng;}
|
||
|
|
that.place.update();that.place.marker.update();that.place.rectangle.update();}
|
||
|
|
function dragend(e){var south;Ox.$body.removeClass('OxDragging');if(that.place.south>that.place.north){south=that.place.south;that.place.south=that.place.north;that.place.north=south;that.place.update();that.place.marker.update();that.place.rectangle.update();}
|
||
|
|
that.map.triggerEvent('changeplaceend',that.place);}
|
||
|
|
that.add=function(){that.marker.setMap(that.map.map);google.maps.event.addListener(that.marker,'dragstart',dragstart);google.maps.event.addListener(that.marker,'drag',drag);google.maps.event.addListener(that.marker,'dragend',dragend);};that.remove=function(){that.marker.setMap(null);google.maps.event.clearListeners(that.marker);};that.update=function(){that.marker.setOptions({icon:Ox.MapMarkerImage({mode:'editing',rectangle:true,type:that.place.id[0]=='_'?'result':'place'}),position:that.place.points[that.position]});};return that;};'use strict';Ox.Dialog=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({buttons:[],controlsBottom:[],controlsTop:[],closeButton:false,content:null,fixedCenter:false,fixedSize:false,fixedRatio:false,focus:true,height:200,keys:{},maxHeight:Infinity,maximizeButton:false,maxWidth:Infinity,minHeight:64,minWidth:128,removeOnClose:false,title:'',width:400}).options(options||{}).update({buttons:setButtons,content:setContent,height:function(){setMinAndMax();setCSS({height:self.options.height});},title:function(){self.$title.animate({opacity:0},50,function(){self.$title.html(self.options.title).animate({opacity:1},50);});},width:function(){setMinAndMax();setCSS({width:self.options.width});}}).addClass('OxDialog').bindEvent({key_enter:function(){keypress('enter');},key_escape:function(){keypress('escape');}}).hide().appendTo(Ox.Fullscreen.element?Ox.Fullscreen.element:Ox.$body);self.hasButtons=!!self.options.buttons.length;self.barsHeight=24+24*self.hasButtons;self.initialMaxHeight=self.options.maxHeight;self.initialMaxWidth=self.options.maxWidth;self.titleMargin=8+(self.options.closeButton?20:0)
|
||
|
|
+(self.options.maximizeButton?20:0);if(self.options.focus){self.$layer=Ox.Layer({type:'dialog'});}
|
||
|
|
self.$titlebar=Ox.Bar({size:24}).addClass('OxTitlebar').appendTo(that);if(self.options.closeButton){self.$closeButton=Ox.Button({title:'close',type:'image'}).css({top:'4px',left:'4px'}).bindEvent({click:function(){that.close();}}).appendTo(self.$titlebar);}
|
||
|
|
if(self.options.maximizeButton){self.$maximizeButton=Ox.Button({type:'image',values:['add','remove']}).css({top:'4px',left:'24px'}).bindEvent({click:maximize}).appendTo(self.$titlebar);}
|
||
|
|
self.$title=Ox.Element().addClass('OxTitle').css({marginLeft:self.titleMargin+'px',marginRight:self.titleMargin+'px'}).html(self.options.title).appendTo(self.$titlebar);setContent();if(self.hasButtons){self.$buttonsbar=Ox.Bar({size:24}).addClass('OxButtonsbar').appendTo(that);self.$buttonsLeft=$('<div>').addClass('OxButtonsLeft').appendTo(self.$buttonsbar.$element);self.$buttonsRight=$('<div>').addClass('OxButtonsRight').appendTo(self.$buttonsbar.$element);setButtons();}
|
||
|
|
if(!self.options.fixedCenter){self.$titlebar.css({cursor:'move'}).bindEvent({doubleclick:function(){!self.centered&¢er(true);},dragstart:dragstart,drag:drag,dragend:dragend});self.hasButtons&&self.$buttonsbar.css({cursor:'move'}).bindEvent({doubleclick:function(){!self.centered&¢er(true);},dragstart:dragstart,drag:drag,dragend:dragend});}
|
||
|
|
!self.options.fixedSize&&['TopLeft','Top','TopRight','Left','Right','BottomLeft','Bottom','BottomRight'].forEach(function(edge){Ox.Element().addClass('OxResize OxResize'+edge).bindEvent({doubleclick:function(){reset(true);},dragstart:resizestart,drag:resize,dragend:resizeend}).appendTo(that);});function center(animate){var ms=animate?100:0;self.centered&&decenter();that.animate({left:Math.round((window.innerWidth-self.options.width)*0.5)+'px',top:Math.round((window.innerHeight-self.options.height-self.barsHeight)*0.4)+'px',width:self.options.width+'px',height:self.options.height+self.barsHeight+'px'},ms,function(){that.css({left:0,top:0,right:0,bottom:Math.round((window.innerHeight-self.options.height-self.barsHeight)*0.2)+'px',margin:'auto'});self.centered=true;Ox.isFunction(animate)&&animate();});}
|
||
|
|
function decenter(){var offset=that.offset();if(self.centered){that.css({left:offset.left+'px',top:offset.top+'px',margin:0});self.centered=false;}}
|
||
|
|
function dragstart(event){var offset;if(!$(event.target).is('.OxButton')){Ox.$body.addClass('OxDragging');offset=that.offset();self.drag={left:offset.left,top:offset.top,x:event.clientX,y:event.clientY};decenter();}}
|
||
|
|
function drag(event){Ox.Log('Window',document.body.scrollTop,'...')
|
||
|
|
var left,top;if(!$(event.target).is('.OxButton')){left=Ox.limit(self.drag.left-self.drag.x+event.clientX,self.minLeft,self.maxLeft);top=Ox.limit(self.drag.top-self.drag.y+event.clientY,self.minTop,self.maxTop);setCSS({left:left,top:top});}}
|
||
|
|
function dragend(event){if(!$(event.target).is('.OxButton')){Ox.$body.removeClass('OxDragging');}}
|
||
|
|
function getButtonById(id){var ret=null;Ox.forEach(self.options.buttons,function(button){if(button.options&&button.options('id')==id){ret=button;return false;}});return ret;}
|
||
|
|
function keypress(key){var id=self.options.keys[key];Ox.Log('Window',id,getButtonById(id));id&&getButtonById(id).$element.trigger('click');}
|
||
|
|
function maximize(){var data,offset=that.offset();decenter();if(!self.maximized){self.originalLeft=offset.left;self.originalTop=offset.top;self.originalWidth=self.options.width;self.originalHeight=self.options.height;}
|
||
|
|
setCSS(self.maximized?{left:self.originalLeft,top:self.originalTop,width:self.originalWidth,height:self.originalHeight}:{left:Math.round((window.innerWidth-self.options.maxWidth)/2),top:Math.round((window.innerHeight-self.options.maxHeight-self.barsHeight)/2),width:self.options.maxWidth,height:self.options.maxHeight},true);self.maximized=!self.maximized;}
|
||
|
|
function reset(animate){var data,left,offset,top;if(!self.centered){offset=that.offset();left=Ox.limit(offset.left+Math.round((self.options.width-self.initialWidth)/2),self.minLeft,self.maxLeft);top=Ox.limit(offset.top+Math.round((self.options.height-self.initialHeight)/2),self.minTop,self.maxTop);}
|
||
|
|
setCSS(Ox.extend({width:self.initialWidth,height:self.initialHeight},self.centered?{}:{left:left,top:top}),animate);}
|
||
|
|
function resizestart(event){Ox.$body.addClass('OxDragging');var edge=event.target.className.slice(17).toLowerCase(),offset=that.offset();self.drag={edge:edge,height:self.options.height,isLeft:edge.indexOf('left')>-1,isTop:edge.indexOf('top')>-1,isRight:edge.indexOf('right')>-1,isBottom:edge.indexOf('bottom')>-1,left:offset.left,top:offset.top,width:self.options.width};decenter();if(self.maximized){self.$maximizeButton.toggle();self.maximized=false;}}
|
||
|
|
function resize(event){var horizontal,vertical,offset,ratio=self.drag.width/self.drag.height;if(!self.drag.fixedRatio&&event.shiftKey){self.drag.centerX=Math.round(self.drag.left+self.drag.width/2);self.drag.centerY=Math.round(self.drag.top+self.drag.height/2);}
|
||
|
|
self.drag.fixedCenter=self.options.fixedCenter||event.altKey;self.drag.fixedRatio=self.options.fixedRatio||event.shiftKey;horizontal=self.drag.edge=='left'||self.drag.edge=='right'||ratio>=1||!self.drag.fixedRatio;vertical=self.drag.edge=='top'||self.drag.edge=='bottom'||ratio<1||!self.drag.fixedRatio;if(self.drag.isLeft&&horizontal){self.options.width=Ox.limit(self.options.width+(self.drag.left-Math.min(event.clientX,self.maxLeft))*(self.drag.fixedCenter?2:1),self.options.minWidth,self.options.maxWidth);if(self.drag.fixedRatio){self.options.height=Ox.limit(Math.round(self.options.width/ratio),self.options.minHeight,self.options.maxHeight);self.options.width=Math.round(self.options.height*ratio);}
|
||
|
|
setCSS(Ox.extend({left:self.drag.left+(self.drag.width-self.options.width)/(self.drag.fixedCenter?2:1),width:self.options.width},self.drag.fixedRatio?{top:Math.max(Math.round(self.drag.edge=='topleft'?self.drag.top+self.drag.height-self.options.height:self.drag.edge=='bottomleft'?self.drag.top:self.drag.centerY-self.options.height/2),self.minTop),height:self.options.height}:{}));}
|
||
|
|
if(self.drag.isTop&&vertical){self.options.height=Ox.limit(self.options.height+(self.drag.top
|
||
|
|
-Ox.limit(event.clientY,self.minTop,self.maxTop))*(self.drag.fixedCenter?2:1),self.options.minHeight,self.options.maxHeight);if(self.drag.fixedRatio){self.options.width=Ox.limit(Math.round(self.options.height*ratio),self.options.minWidth,self.options.maxWidth);self.options.height=Math.round(self.options.width/ratio);}
|
||
|
|
setCSS(Ox.extend({top:Math.max(self.drag.top+(self.drag.height-self.options.height)/(self.drag.fixedCenter?2:1),self.minTop),height:self.options.height},(self.drag.fixedRatio)?{left:Math.round(self.drag.edge=='topleft'?self.drag.left+self.drag.width-self.options.width:self.drag.edge=='topright'?self.drag.left:self.drag.centerX-self.options.width/2),width:self.options.width}:{}));}
|
||
|
|
if(self.drag.isRight&&horizontal){self.options.width=Ox.limit(self.options.width+(Math.max(event.clientX,24)
|
||
|
|
-self.drag.left-self.drag.width)*(self.drag.fixedCenter?2:1),self.options.minWidth,self.options.maxWidth);if(self.drag.fixedRatio){self.options.height=Ox.limit(Math.round(self.options.width/ratio),self.options.minHeight,self.options.maxHeight);self.options.width=Math.round(self.options.height*ratio);}
|
||
|
|
setCSS(Ox.extend({width:self.options.width},self.drag.fixedCenter?{left:self.drag.left+(self.drag.width-self.options.width)/2}:{},self.drag.fixedRatio?{top:Math.max(Math.round(self.drag.edge=='topright'?self.drag.top+self.drag.height-self.options.height:self.drag.edge=='bottomright'?self.drag.top:self.drag.centerY-self.options.height/2),self.minTop),height:self.options.height}:{}));}
|
||
|
|
if(self.drag.isBottom&&vertical){self.options.height=Ox.limit(self.options.height+(Math.max(event.clientY,24)
|
||
|
|
-self.drag.top-self.drag.height-self.barsHeight)*(self.drag.fixedCenter?2:1),self.options.minHeight,self.options.maxHeight);if(self.drag.fixedRatio){self.options.width=Ox.limit(Math.round(self.options.height*ratio),self.options.minWidth,self.options.maxWidth);self.options.height=Math.round(self.options.width/ratio);}
|
||
|
|
setCSS(Ox.extend({height:self.options.height},self.drag.fixedCenter?{top:Math.max(self.drag.top+(self.drag.height-self.options.height)/2,self.minTop)}:{},self.drag.fixedRatio&&self.drag.edge=='bottom'?{left:Math.round(self.drag.edge=='bottomleft'?self.drag.left+self.drag.width-self.options.width:self.drag.edge=='bottomright'?self.drag.left:self.drag.centerX-self.options.width/2),width:self.options.width}:{}));}
|
||
|
|
offset=that.offset();self.drag.left=offset.left;self.drag.top=offset.top;self.drag.width=self.options.width;self.drag.height=self.options.height;self.drag.minLeft=24-self.options.width;self.drag.minTop=self.hasButtons?24-self.options.height-self.barsHeight:0;that.triggerEvent('resize',{width:self.options.width,height:self.options.height});}
|
||
|
|
function resizeend(){Ox.$body.removeClass('OxDragging');that.triggerEvent('resizeend',{width:self.options.width,height:self.options.height});}
|
||
|
|
function resizeWindow(){self.options.width=Math.min(self.options.width,window.innerWidth);self.options.height=Math.min(self.options.height,window.innerHeight-self.barsHeight);var offset=that.offset();setMinAndMax();if(self.centered){center();}else if(self.maximized){self.maximized=false;maximize();}else{setCSS({left:Math.min(offset.left,self.maxLeft),top:Math.min(offset.top,self.maxTop),width:self.options.width,height:self.options.height});}}
|
||
|
|
function setButtons(){var buttonsLeft,buttonsRight,index=Ox.indexOf(self.options.buttons,Ox.isEmpty);if(index>-1){buttonsLeft=self.options.buttons.slice(0,index);buttonsRight=self.options.buttons.slice(index+1);}else{buttonsLeft=[];buttonsRight=self.options.buttons;}
|
||
|
|
self.$buttonsLeft.empty();buttonsLeft.forEach(function($button){$button.addClass('OxLeft').appendTo(self.$buttonsLeft);});self.$buttonsRight.empty();buttonsRight.forEach(function($button){$button.addClass('OxRight').appendTo(self.$buttonsRight);});}
|
||
|
|
function setContent(){var animate=!!self.$content,isImage=!Ox.UI.isElement(self.options.content)&&self.options.content.is('img');if(animate){self.$content.animate({opacity:0},250,function(){$(this).remove();});self.options.content.css({opacity:0});}
|
||
|
|
self.$content=(isImage?self.options.content:Ox.Element()).addClass('OxContent').css(self.hasButtons?{bottom:'24px'}:{bottom:0,borderBottomLeftRadius:'8px',borderBottomRightRadius:'8px'}).appendTo(that);!isImage&&self.$content.append(self.options.content.css(self.hasButtons?{}:{borderBottomLeftRadius:'8px',borderBottomRightRadius:'8px'}));animate&&self.options.content.animate({opacity:1},250);}
|
||
|
|
function setCSS(css,animate){var ms=animate?100:0,offset=that.offset(),triggerEvent=self.isOpen&&((css.width&&css.width!=self.options.width)||(css.height&&css.height!=self.options.height));css=Ox.extend({left:offset.left,top:offset.top,width:self.options.width,height:self.options.height},css);that.animate({left:css.left+'px',top:css.top+'px',width:css.width+'px',height:css.height+self.barsHeight+'px'},ms,function(){self.options.width=css.width;self.options.height=css.height;self.minLeft=24-self.options.width;self.minTop=self.hasButtons?24-self.options.height-self.barsHeight:0;triggerEvent&&that.triggerEvent('resize',{width:self.options.width,height:self.options.height});Ox.isFunction(animate)&&animate();});}
|
||
|
|
function setMinAndMax(){var ratio,maxRatio,minRatio;self.maxLeft=window.innerWidth-24;self.maxTop=window.innerHeight-24;self.minLeft=24-self.options.width;self.minTop=self.hasButtons?24-self.options.height:0;self.options.maxHeight=Ox.limit(self.initialMaxHeight,64,window.innerHeight-self.barsHeight);self.options.maxWidth=Ox.limit(self.initialMaxWidth,128,window.innerWidth);if(self.options.fixedRatio){ratio=self.options.width/self.options.height;maxRatio=self.options.maxWidth/self.options.maxHeight;minRatio=self.options.minWidth/self.options.minHeight;if(maxRatio>ratio){self.options.maxWidth=Math.round(self.options.maxHeight*ratio);}else if(maxRatio<ratio){self.options.maxHeight=Math.round(self.options.maxWidth/ratio);}if(minRatio>ratio){self.options.minWidth=Math.round(self.options.minHeight*ratio);}else if(minRatio<ratio){self.options.minHeight=Math.round(self.options.minWidth/ratio);}}}
|
||
|
|
that.close=function(callback){if(self.isOpen){self.isOpen=false;that.animate({opacity:0},250,function(){that.hide();callback&&callback();});if(self.maximized){self.$maximizeButton.toggle();self.maximized=false;}
|
||
|
|
if(self.options.focus){self.$layer.hide();that.loseFocus();}
|
||
|
|
Ox.$window.off({resize:resizeWindow});that.triggerEvent('close');self.options.removeOnClose&&that.remove();}
|
||
|
|
return that;};that.disableButton=function(id){getButtonById(id).options({disabled:true});return that;};that.disableButtons=function(){self.options.buttons.forEach(function(button){!Ox.isEmpty(button)&&button.options({disabled:true});});};that.disableCloseButton=function(){self.$closeButton&&self.$closeButton.options({disabled:true});return that;};that.enableButton=function(id){getButtonById(id).options({disabled:false});return that;};that.enableButtons=function(){self.options.buttons.forEach(function(button){!Ox.isEmpty(button)&&button.options({disabled:false});});};that.enableCloseButton=function(){self.$closeButton&&self.$closeButton.options({disabled:false});return that;};that.open=function(){if(!self.isOpen){self.isOpen=true;self.initialHeight=self.options.height;self.initialWidth=self.options.width;setMinAndMax();center();reset();that.css({opacity:0}).show().animate({opacity:1},250);if(self.options.focus){self.$layer.show();that.gainFocus();}
|
||
|
|
Ox.$window.on({resize:resizeWindow});that.triggerEvent('open');}
|
||
|
|
return that;};that.setSize=function(width,height){self.options.width=width;self.options.height=height;setMinAndMax();if(self.maximized){self.originalWidth=width;self.originalHeight=height;self.options.width=self.options.maxWidth;self.options.height=self.options.maxHeight;}
|
||
|
|
center(true);that.triggerEvent('resize',{width:self.options.width,height:self.options.height});return that;};return that;};'use strict';Ox.Layer=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({type:'dialog'}).options(options||{}).addClass('OxLayer Ox'+Ox.toTitleCase(self.options.type)+'Layer').on(self.options.type=='dialog'?{mousedown:mousedown}:{click:click});function click(){that.triggerEvent('click').remove();}
|
||
|
|
function mousedown(){that.stop().css({opacity:0.5});}
|
||
|
|
function mouseup(){that.stop().animate({opacity:0},250);}
|
||
|
|
that.hide=function(){if(self.options.type=='dialog'){Ox.$window.off({mouseup:mouseup});}
|
||
|
|
that.remove();};that.show=function(){if(self.options.type=='dialog'){Ox.$window.on({mouseup:mouseup});}
|
||
|
|
that.appendTo(Ox.Fullscreen.element?Ox.Fullscreen.element:Ox.$body);return that;}
|
||
|
|
return that;}
|
||
|
|
'use strict';Ox.SortDialog=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({defaults:[],height:0,items:[],title:'',width:256}).options(options||{});self.fitAll=!self.options.height;self.hasDefaults=!!self.options.defaults.length;self.height=self.fitAll?self.options.items.length*16:self.options.height
|
||
|
|
self.$list=Ox.SortList({items:self.options.items,scrollbarVisible:!self.fitAll}).bindEvent({sort:function(data){self.hasDefaults&&updateDefaultsButton();that.triggerEvent('sort',data);}});if(self.hasDefaults){self.$defaultsButton=Ox.Button({title:Ox._('Restore Defaults')}).bindEvent({click:function(){self.options.items=Ox.clone(self.options.defaults);self.$list.options({items:self.options.items});}});}
|
||
|
|
self.$doneButton=Ox.Button({title:Ox._('Done')}).bindEvent({click:function(){self.$dialog.close();}});self.$dialog=Ox.Dialog({buttons:self.hasDefaults?[self.$defaultsButton,{},self.$doneButton]:[self.$doneButton],content:self.$list,fixedSize:true,height:self.height,removeOnClose:true,title:self.options.title,width:self.options.width});self.hasDefaults&&updateDefaultsButton();that.setElement(self.$dialog);function updateDefaultsButton(){self.$defaultsButton.options({disabled:Ox.isEqual(self.options.items,self.options.defaults)});}
|
||
|
|
that.close=function(){self.$dialog.close();};that.open=function(){self.$dialog.open();};return that;};'use strict';Ox.Tooltip=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({animate:true,title:''}).options(options||{}).update({title:function(){setTitle();self.options.title===''&&that.detach();}}).addClass('OxTooltip')
|
||
|
|
[Ox.isString(self.options.title)?'html':'append'](self.options.title);self.options.animate&&that.css({opacity:0});setTitle();function setTitle(){if(Ox.isString(self.options.title)){that.html(self.options.title);}else{that.empty().append(self.options.title);}}
|
||
|
|
that.hide=function(){var last=Ox.last(arguments);if(self.options.title){if(self.options.animate){that.animate({opacity:0},250,function(){that.detach();Ox.isFunction(last)&&last();});}else{that.detach();}}
|
||
|
|
return that;};that.show=function(x,y){var last=Ox.last(arguments),left,top,width,height;if(self.options.title){if(arguments.length==1){self.x=arguments[0].clientX;self.y=arguments[0].clientY;}else{self.x=x;self.y=y;}
|
||
|
|
$('.OxTooltip').detach();that.appendTo(Ox.Fullscreen.element?Ox.Fullscreen.element:Ox.$body);width=that.width();height=that.height();left=Ox.limit(self.x-Math.round(width/2),0,window.innerWidth-width-8);top=self.y>window.innerHeight-height-16?self.y-16-height:self.y+16;that.css({left:left+'px',top:top+'px'});self.options.animate&&that.animate({opacity:1},250,function(){Ox.isFunction(last)&&last();});}
|
||
|
|
return that;};return that;};'use strict';Ox.Chart=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({color:[128,128,128],data:{},formatKey:null,keyAlign:'right',keyWidth:128,limit:0,rows:1,sort:{key:'value',operator:'-'},sortKey:null,title:'',width:512}).options(options||{}).update({width:function(){self.$chart.empty();renderChart();}}).addClass('OxChart');self.valueWidth=self.options.width-self.options.keyWidth;self.keys=Object.keys(self.options.data);if(Ox.isObject(self.options.data[self.keys[0]])){if(Ox.isUndefined(options.color)){self.options.color=[[192,64,64],[64,192,64],[64,64,192],[192,192,64],[64,192,192],[192,64,192],[192,128,64],[64,192,128],[128,64,192],[192,64,128],[128,192,64],[64,128,192]];}
|
||
|
|
self.subData={};}
|
||
|
|
self.sort={};self.totals={};Ox.forEach(self.options.data,function(value,key){self.totals[key]=self.subData?Ox.sum(value):value;if(self.subData){Object.keys(value).forEach(function(subKey){self.subData[subKey]=(self.subData[subKey]||0)+value[subKey];});}
|
||
|
|
self.sort[key]=key.replace(/(\d+)/g,function(number){return Ox.pad(parseInt(number,10),16);});});self.max=Ox.max(self.totals);self.sum=Ox.sum(self.totals);if(self.subData){Ox.forEach(self.subData,function(subValue,subKey){self.sort[subKey]=subKey.replace(/(\d+)/g,function(number){return Ox.pad(parseInt(number,10),16);});});self.subKeys=Object.keys(self.subData).sort(function(a,b){var aValue=self.subData[a],bValue=self.subData[b];return a===''?1:b===''?-1:self.sort[a]<self.sort[b]?-1:self.sort[a]>self.sort[b]?1:0;});}
|
||
|
|
self.items=self.keys.map(function(key){return{key:key,keySort:self.sort[key],value:self.options.data[key],valueSort:self.subData?self.totals[key]:self.options.data[key]};});self.sortBy=self.options.sort.key=='key'?[{key:'keySort',operator:self.options.sort.operator}]:[{key:'valueSort',operator:self.options.sort.operator},{key:'keySort',operator:'+'}]
|
||
|
|
if(self.options.limit){self.items=Ox.sortBy(self.items,self.sortBy).slice(0,self.options.limit);self.max=Ox.max(self.items.map(function(item){return self.subData?Ox.sum(item.value):item.value;}));}
|
||
|
|
self.max=self.max||1;if(self.options.rows==2){self.row=0;}
|
||
|
|
self.$title=Ox.Bar({size:16}).append($('<div>').css({margin:'1px 0 0 4px'}).html(self.options.title)).appendTo(that);self.$chart=$('<div>').css({position:'absolute',top:'16px'}).append(renderChart()).appendTo(that);function getColumns(){return[{align:self.options.keyAlign,format:self.options.formatKey,id:'key',width:self.options.keyWidth,visible:true},{format:renderValue,id:'value',width:self.valueWidth,visible:true}];}
|
||
|
|
function getWidths(values){var max,maxKeys,total=Ox.sum(values),totalWidth=Math.ceil(total/self.max*self.valueWidth),widths={};Ox.forEach(values,function(value,key){widths[key]=Math.round(value/total*totalWidth);});while(Ox.sum(widths)!=totalWidth){max=Ox.max(widths);maxKeys=Object.keys(widths).filter(function(key){return widths[key]==max;});widths[maxKeys[0]]+=Ox.sum(widths)<totalWidth?1:-1;}
|
||
|
|
return widths;}
|
||
|
|
function renderChart(){that.css({width:self.options.width+'px',height:16+self.items.length*16+'px',overflowY:'hidden'});return Ox.TableList({columns:getColumns(),items:self.items,max:0,min:0,pageLength:self.items.length,sort:self.sortBy,width:self.options.width,unique:'key'}).css({left:0,top:0,width:self.options.width+'px',height:self.items.length*16+'px'});}
|
||
|
|
function renderValue(value,data){var $bars=[],$element,colors=[],len,widths;if(!self.subData){$element=$bars[0]=Ox.Element({element:'<div>',tooltip:Ox.formatNumber(value)
|
||
|
|
+' ('+Ox.formatPercent(value*self.options.rows,self.sum,2)+')'}).css({width:Math.ceil(value/self.max*self.valueWidth)+'px',height:'14px',borderRadius:'4px',marginLeft:'-4px'});colors[0]=Ox.isFunction(self.options.color)?self.options.color(data.key):self.options.color;}else{$element=$('<div>').css({width:Math.ceil(self.totals[data.key]/self.max*self.valueWidth)+'px',height:'14px',marginLeft:'-4px'});len=Ox.len(value);widths=getWidths(value);self.subKeys.forEach(function(subKey,subKeyIndex){var i=$bars.length,subValue=value[subKey];if(subValue){$bars[i]=Ox.Element({element:'<div>',tooltip:Ox.formatNumber(self.totals[data.key])
|
||
|
|
+' ('+Ox.formatPercent(self.totals[data.key]*self.options.rows,self.sum,2)+')'}).css({float:'left',width:widths[subKey]+'px',height:'14px',borderTopLeftRadius:i==0?'4px':0,borderBottomLeftRadius:i==0?'4px':0,borderTopRightRadius:i==len-1?'4px':0,borderBottomRightRadius:i==len-1?'4px':0}).appendTo($element);colors[i]=subKey==''?[128,128,128]:Ox.isArray(self.options.color)?self.options.color[subKeyIndex%self.options.color.length]:Ox.isObject(self.options.color)?self.options.color[subKey]:self.options.color(subKey);}});}
|
||
|
|
$bars.forEach(function($bar,i){['moz','o','webkit'].forEach(function(browser){$bar.css({backgroundImage:'-'+browser
|
||
|
|
+'-linear-gradient(top, rgb('+colors[i].map(function(v){return Ox.limit(v+16,0,255);}).join(', ')+'), rgb('+colors[i].map(function(v){return Ox.limit(v-16,0,255);})+'))'});});});if(self.options.rows==2){self.row++;}
|
||
|
|
return $element;}
|
||
|
|
return that;};'use strict';Ox.ColumnList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({columns:[],custom:{},items:[],list:'table',query:{conditions:[],operator:'&'},resize:null,width:768}).options(options||{}).update({query:updateQuery,width:function(){self.columnWidths=getColumnWidths();self.$panel.size(0,self.columnWidths[0]);self.$panel.size(2,self.columnWidths[2]);self.$lists.forEach(function($list,i){$list.options({itemWidth:self.columnWidths[i]});});}}).addClass('OxColumnList');self.numberOfColumns=self.options.columns.length;self.columnWidths=getColumnWidths();self.flatItems=[];self.ids=[{},{},{}];self.options.items.forEach(function(item0){item0.items.forEach(function(item1){self.ids[1][item1.id]=[item0.id];item1.items.forEach(function(item2){self.ids[2][item2.id]=[item0.id,item1.id];self.flatItems.push(item2);});});});self.api=Ox.api(self.flatItems);self.$lists=self.options.columns.map(function(column,i){return Ox.CustomList({item:self.options.columns[i].item,itemHeight:self.options.columns[i].itemHeight,items:getItems(i),itemWidth:self.columnWidths[i],keys:self.options.columns[i].keys,max:self.options.columns[i].max,resize:self.options.resize,scrollbarVisible:true,selected:self.options.columns[i].selected,sort:self.options.columns[i].sort,unique:'id'}).bindEvent({key_left:function(){if(i>0){self.$lists[i-1].gainFocus();that.triggerEvent('select',{id:self.options.columns[i-1].id,ids:self.$lists[i-1].options('selected')});}},key_right:function(){var index,object,selected=self.$lists[i].options('selected');if(selected.length){if(i<self.numberOfColumns-1){if(self.$lists[i+1].options('selected').length==0){self.$lists[i+1].selectPosition(0);}
|
||
|
|
self.$lists[i+1].gainFocus();that.triggerEvent('select',{id:self.options.columns[i+1].id,ids:self.$lists[i+1].options('selected')});}}},open:function(data){that.triggerEvent('open',{id:column.id,ids:data.ids});},select:function(data){self.options.columns[i].selected=data.ids;if(i<self.numberOfColumns-1){self.$lists[i+1].options({items:getItems(i+1)});}
|
||
|
|
if(i==0||data.ids.length){that.triggerEvent('select',{id:column.id,ids:data.ids});}else{self.$lists[i-1].gainFocus();that.triggerEvent('select',{id:self.options.columns[i-1].id,ids:self.$lists[i-1].options('selected')});}}});});self.$panel=Ox.SplitPanel({elements:self.$lists.map(function($list,index){return Ox.extend({element:$list},index==1?{}:{size:self.columnWidths[index]});}),orientation:'horizontal'});that.setElement(self.$panel);function getColumnWidths(){return Ox.splitInt(self.options.width,self.numberOfColumns);}
|
||
|
|
function getItems(i){var items;if(i==0){items=self.options.items;}else{items=[];self.options.columns[i-1].selected.forEach(function(id){var index;if(i==1){index=Ox.getIndexById(self.options.items,id);items=items.concat(self.options.items[index].items);}else if(i==2){index=[];Ox.forEach(self.options.columns[0].selected,function(id_){index[0]=Ox.getIndexById(self.options.items,id_);index[1]=Ox.getIndexById(self.options.items[index[0]].items,id);if(index[1]>-1){return false;}});items=items.concat(self.options.items[index[0]].items[index[1]].items);}});}
|
||
|
|
return items;}
|
||
|
|
function updateQuery(){if(self.options.query.conditions.length==0){self.items=self.options.items;}else{self.api({keys:['id','_ids'],query:self.options.query},function(result){var ids=[[],[],[]];result.data.items.forEach(function(item){ids[0].push(self.ids[2][item.id][0]);ids[1].push(self.ids[2][item.id][1]);ids[2].push(item.id);});self.items=self.options.items.filter(function(item0){return Ox.contains(ids[0],item0.id);});self.items.forEach(function(item0){item0.items=item0.items.filter(function(item1){return Ox.contains(ids[1],item1.id);});item0.items.forEach(function(item1){item1.items=item1.items.filter(function(item2){return Ox.contains(ids[2],item2.id);});});});});}
|
||
|
|
self.$lists.forEach(function($list,i){$list.options({items:i==0?self.items:[]});});}
|
||
|
|
that.sort=function(id,sort){var index=Ox.isNumber(id)?id:Ox.getIndexById(self.options.columns,id);self.$lists[index].options({sort:sort});self.options.columns[index].sort=sort;};return that;};'use strict';Ox.CustomList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({draggable:false,item:null,itemHeight:32,items:null,itemWidth:256,keys:[],max:-1,min:0,pageLength:100,query:{conditions:[],operator:'&'},resize:null,scrollbarVisible:false,selected:[],sort:[],sortable:false,sums:[],unique:''}).options(options||{}).update({items:function(){self.$list.options({items:self.options.items});},itemWidth:function(){var width=self.options.itemWidth-Ox.UI.SCROLLBAR_SIZE;if(self.options.resize){that.find('.OxItem').each(function(element){self.options.resize($(this),width);});}},query:function(){self.$list.options({query:self.options.query});},selected:function(){self.$list.options({selected:self.options.selected});that.triggerEvent('select',{ids:self.options.selected});},sort:function(){self.$list.options({sort:self.options.sort});}}).addClass('OxCustomList');self.$list=Ox.List({construct:function(data){return self.options.item(data,self.options.itemWidth-Ox.UI.SCROLLBAR_SIZE).addClass('OxTarget');},draggable:self.options.draggable,itemHeight:self.options.itemHeight,itemWidth:self.options.itemWidth
|
||
|
|
-self.options.scrollbarVisible*Ox.UI.SCROLLBAR_SIZE,items:self.options.items,keys:self.options.keys.concat(self.options.unique),max:self.options.max,min:self.options.min,orientation:'vertical',pageLength:self.options.pageLength,query:Ox.clone(self.options.query,true),selected:self.options.selected,sort:Ox.clone(self.options.sort,true),sortable:self.options.sortable,sums:self.options.sums,type:'text',unique:self.options.unique}).css({top:0,overflowY:(self.options.scrollbarVisible?'scroll':'hidden')}).bindEvent(function(data,event){if(event=='select'){self.options.selected=data.ids;}
|
||
|
|
that.triggerEvent(event,data);}).appendTo(that);that.api=self.$list.options('items');that.gainFocus=function(){self.$list.gainFocus();return that;};that.getPasteIndex=function(){return self.$list.getPasteIndex();};that.hasFocus=function(){return self.$list.hasFocus();};that.invertSelection=function(){self.$list.invertSelection();return that;};that.loseFocus=function(){self.$list.loseFocus();return that;};that.selectAll=function(){self.$list.selectAll();return that;};that.selectPosition=function(pos){self.$list.selectPosition(pos);return that;};that.selectSelected=function(offset){that.$list.selectSelected(offset);return that;};that.size=function(){self.$list.size();return that;};return that;};'use strict';Ox.IconItem=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({borderRadius:0,extra:null,find:'',iconHeight:128,iconWidth:128,imageHeight:128,imageWidth:128,itemHeight:192,itemWidth:128,id:'',info:'',title:'',url:''}).options(options||{});Ox.extend(self,{fontSize:self.options.itemWidth==64?6:9,infoIsObject:Ox.isObject(self.options.info),lineLength:self.options.itemWidth==64?15:23,lines:self.options.itemWidth==64?4:5,url:Ox.UI.PATH+'png/transparent.png'});self.title=formatText(self.options.title,self.lines-1-self.infoIsObject,self.lineLength);if(!self.infoIsObject){self.info=formatText(self.options.info,5-self.title.split('<br/>').length,self.lineLength);}else{self.title=$('<div>').css({fontSize:self.fontSize+'px'}).html(self.title);self.info=$('<div>').append(self.options.info.css(Ox.extend(self.options.info.css('width')=='0px'?{width:Math.round(self.options.itemWidth/2)+'px'}:{},{padding:0,margin:'1px auto',fontSize:self.fontSize+'px',textShadow:'none'})));}
|
||
|
|
that.css({width:self.options.itemWidth+4+'px',height:self.options.itemHeight+ +4+'px'});that.$icon=$('<div>').addClass('OxIcon').css({top:(self.options.iconWidth==64?-64:-122)+'px',width:self.options.iconWidth+4+'px',height:self.options.iconHeight+4+'px'});that.$iconImage=$('<img>').addClass('OxLoading OxTarget').attr({src:self.url}).css({width:self.options.imageWidth+'px',height:self.options.imageHeight+'px',borderRadius:self.options.borderRadius+4+'px'}).mousedown(mousedown).mouseenter(mouseenter).mouseleave(mouseleave);self.options.url&&that.$iconImage.one('load',load);that.$textBox=$('<div>').addClass('OxText').css({top:self.options.iconHeight-(self.options.itemWidth==64?32:62)+'px',width:self.options.itemWidth+4+'px',height:(self.options.itemWidth==64?30:58)+'px'});that.$text=$('<div>').addClass('OxTarget').css({fontSize:self.fontSize+'px'}).mouseenter(mouseenter).mouseleave(mouseleave);if(!self.infoIsObject){that.$text.html((self.title?self.title+'<br/>':'')
|
||
|
|
+'<span class="OxInfo">'+self.info+'</span>');}else{that.$text.append(self.title).append(self.info);}
|
||
|
|
that.$reflection=$('<div>').addClass('OxReflection').css({top:self.options.iconHeight+(self.options.itemWidth==64?0:2)+'px',width:self.options.itemWidth+4+'px',height:self.options.itemHeight-self.options.iconHeight+'px'});that.$reflectionImage=$('<img>').addClass('OxLoading').attr({src:self.url}).css({width:self.options.imageWidth+'px',height:self.options.imageHeight+'px',paddingLeft:($.browser.mozilla&&self.options.imageWidth%2?1:0)+'px',borderRadius:self.options.borderRadius+'px'});that.$gradient=$('<div>').css({width:self.options.itemWidth+2+'px',height:self.options.itemWidth/2+'px'});that.append(that.$reflection.append(that.$reflectionImage).append(that.$gradient)).append(that.$textBox.append(that.$text)).append(that.$icon.append(that.$iconImage));if(self.options.extra){that.$extra=$('<div>').addClass('OxTarget').css({position:'absolute',left:0,right:0,bottom:0,width:self.options.imageWidth+'px',height:self.options.imageHeight+'px',border:'2px solid transparent',margin:'auto',cursor:'pointer',overflow:'hidden'})
|
||
|
|
that.$icon.append(that.$extra.append(self.options.extra));}
|
||
|
|
function formatText(text,maxLines,maxLength){text=Ox.isArray(text)?text.join(', '):text;var lines=Ox.wordwrap(text,maxLength,true).split('\n');if(lines.length>maxLines){lines[maxLines-1]=Ox.truncate(lines.slice(maxLines-1).join(''),'center',maxLength).replace('…','<span class="OxLight">…</span>');lines=lines.slice(0,maxLines);}
|
||
|
|
return Ox.highlight(lines.join('<br/>'),self.options.find,'OxHighlight',true);}
|
||
|
|
function load(){that.$iconImage.attr({src:self.options.url}).one('load',function(){that.$iconImage.removeClass('OxLoading');that.$reflectionImage.attr({src:self.options.url}).removeClass('OxLoading');});}
|
||
|
|
function mousedown(e){}
|
||
|
|
function mouseenter(){that.addClass('OxHover');}
|
||
|
|
function mouseleave(){that.removeClass('OxHover');}
|
||
|
|
return that;};'use strict';Ox.IconList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({borderRadius:0,centered:false,defaultRatio:1,draggable:false,find:'',fixedRatio:false,id:'',item:null,itemConstructor:Ox.IconItem,items:null,keys:[],max:-1,min:0,orientation:'both',pageLength:100,query:{conditions:[],operator:'&'},selectAsYouType:'',selected:[],size:128,sort:[],sums:[],unique:''}).options(options||{}).update({items:function(){self.$list.options({items:self.options.items});},query:function(){self.$list.options({query:self.options.query});},selected:function(){self.$list.options({selected:self.options.selected});},sort:function(){updateKeys();self.$list.options({sort:self.options.sort});}});if(self.options.fixedRatio){self.options.defaultRatio=self.options.fixedRatio;}
|
||
|
|
if(Ox.isArray(self.options.items)){self.options.keys=Ox.unique(Ox.flatten(self.options.items.map(function(item){return Object.keys(item);})));}
|
||
|
|
self.iconWidth=self.options.size;self.iconHeight=self.options.fixedRatio>1?Math.round(self.options.size/self.options.fixedRatio):self.options.size;self.itemWidth=self.options.size;self.itemHeight=self.iconHeight+self.options.size*0.5;self.$list=Ox.List({centered:self.options.centered,construct:constructItem,draggable:self.options.draggable,id:self.options.id,itemHeight:self.itemHeight,items:self.options.items,itemWidth:self.itemWidth,keys:self.options.keys,max:self.options.max,min:self.options.min,orientation:self.options.orientation,pageLength:self.options.pageLength,query:self.options.query,selectAsYouType:self.options.selectAsYouType,selected:self.options.selected,sort:self.options.sort,sums:self.options.sums,type:'icon',unique:self.options.unique}).addClass('OxIconList Ox'+Ox.toTitleCase(self.options.orientation)).bindEvent(function(data,event){if(event=='select'){self.options.selected=data.ids;}
|
||
|
|
that.triggerEvent(event,data);});that.setElement(self.$list);updateKeys();function constructItem(data){var isEmpty=Ox.isEmpty(data);data=!isEmpty?self.options.item(data,self.options.sort,self.options.size):{width:Math.round(self.options.size*(self.options.defaultRatio>=1?1:self.options.defaultRatio)),height:Math.round(self.options.size/(self.options.defaultRatio<=1?1:self.options.defaultRatio))};return self.options.itemConstructor(Ox.extend(data,{borderRadius:self.options.borderRadius,find:self.options.find,iconHeight:self.iconHeight,iconWidth:self.iconWidth,imageHeight:data.height,imageWidth:data.width,itemHeight:self.itemHeight,itemWidth:self.itemWidth}));}
|
||
|
|
function updateKeys(){self.$list.options({keys:Ox.unique([self.options.sort[0].key].concat(self.options.keys))});}
|
||
|
|
that.closePreview=function(){self.$list.closePreview();return that;};that.gainFocus=function(){self.$list.gainFocus();return that;};that.getPasteIndex=function(){return self.$list.getPasteIndex();};that.hasFocus=function(){return self.$list.hasFocus();};that.invertSelection=function(){self.$list.invertSelection();return that;};that.loseFocus=function(){self.$list.loseFocus();return that;};that.openPreview=function(){self.$list.openPreview();return that;};that.reloadList=function(){self.$list.reloadList();return that;};that.scrollToSelection=function(){self.$list.scrollToSelection();return that;};that.selectAll=function(){self.$list.selectAll();return that;};that.selectPosition=function(pos){self.$list.selectPosition(pos);return that;};that.selectSelected=function(offset){self.$list.selectSelected(offset);return that;};that.size=function(){self.$list.size();return that;};that.sortList=function(key,operator){self.options.sort=[{key:key,operator:operator}];updateKeys();self.$list.sortList(key,operator);return that;};that.value=function(){var args=Ox.slice(arguments),id=args.shift(),sort=false;if(arguments.length==1){return self.$list.value(id);}else if(arguments.length==2&&Ox.isString(arguments[1])){return self.$list.value(id,arguments[1]);}else{Ox.forEach(Ox.makeObject(args),function(value,key){self.$list.value(id,key,value);if(key==self.unique){self.options.selected=self.options.selected.map(function(id_){return id_==id?value:id_});id=value;}
|
||
|
|
if(key==self.options.sort[0].key){sort=true;}});sort&&self.$list.sort();return that;}};return that;};'use strict';Ox.InfoList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({borderRadius:0,defaultRatio:1,draggable:false,id:'',item:null,items:null,keys:[],max:-1,min:0,query:{conditions:[],operator:'&'},selectAsYouType:'',selected:[],size:192,sort:[],sums:[],unique:''}).options(options||{}).update({items:function(){self.$list.options({items:self.options.items});},query:function(){self.$list.options({query:self.options.query});},selected:function(){self.$list.options({selected:self.options.selected});},sort:function(){updateKeys();self.$list.options({sort:self.options.sort});},width:function(){var width=getItemWidth();$('.OxInfoElement').each(function(){var $parent=$(this).parent(),id=parseInt(/OxId(.*?)$/.exec(this.className)[1],10);$parent.css({width:width-144});$parent.parent().css({width:width-144});$parent.parent().parent().css({width:width-8});Ox.$elements[id].options({width:width-152});});}});self.iconSize=Math.round(self.options.size*2/3);self.itemHeight=self.options.size;that.setElement(self.$list=Ox.List({construct:constructItem,draggable:self.options.draggable,id:self.options.id,itemHeight:self.itemHeight,items:self.options.items,itemWidth:getItemWidth(),keys:self.options.keys,max:self.options.max,min:self.options.min,orientation:'vertical',pageLength:10,query:self.options.query,selectAsYouType:self.options.selectAsYouType,selected:self.options.selected,sort:self.options.sort,sums:self.options.sums,type:'info',unique:self.options.unique}).addClass('OxInfoList').bindEvent(function(data,event){if(event=='select'){self.options.selected=data.ids;}
|
||
|
|
that.triggerEvent(event,data);}));updateKeys();function constructItem(data){var isEmpty=Ox.isEmpty(data),data=!isEmpty?self.options.item(data,self.options.sort,self.options.size):{icon:{width:Math.round(self.iconSize*(self.options.defaultRatio>=1?1:self.options.defaultRatio)),height:Math.round(self.iconSize/(self.options.defaultRatio<=1?1:self.options.defaultRatio))},info:{}},$icon=Ox.Element().css({float:'left',width:'132px',height:'192px',margin:'2px'}).append(Ox.IconItem(Ox.extend(data.icon,{borderRadius:self.options.borderRadius,iconHeight:self.iconSize,iconWidth:self.iconSize,imageHeight:data.icon.height,imageWidth:data.icon.width,itemHeight:self.itemHeight,itemWidth:128})).addClass('OxInfoIcon').css({position:'absolute'})),$info=Ox.Element().css({float:'left',width:getItemWidth()-144+'px',height:196+'px'}),$infobox=Ox.Element().css({position:'absolute',width:getItemWidth()-144+'px',height:196+'px',marginTop:'-2px',overflow:'hidden'}).appendTo($info),$item=Ox.Element().css({width:getItemWidth()-8+'px',height:196+'px',margin:'4px'}).append($icon).append($info);if(!isEmpty){var $element=data.info.element(Ox.extend(data.info.options,{width:getItemWidth()-152})).addClass('OxInfoElement');data.info.css&&$element.css(data.info.css);data.info.events&&$element.bindEvent(data.info.events);$element.addClass('OxId'+$element.oxid);$infobox.append($element);}
|
||
|
|
return $item;}
|
||
|
|
function getItemWidth(cached){if(!cached){self.cachedWidth=that.width()-Ox.UI.SCROLLBAR_SIZE;}else if(!self.cachedWidth||self.cachedWidthTime<+new Date()-5000){self.cachedWidth=that.width()-Ox.UI.SCROLLBAR_SIZE;self.cachedWidthTime=+new Date();}
|
||
|
|
return self.cachedWidth;}
|
||
|
|
function updateKeys(){self.$list.options({keys:Ox.unique([self.options.sort[0].key].concat(self.options.keys))});}
|
||
|
|
that.closePreview=function(){self.$list.closePreview();return that;};that.gainFocus=function(){self.$list.gainFocus();return that;};that.getPasteIndex=function(){return self.$list.getPasteIndex();};that.hasFocus=function(){return self.$list.hasFocus();};that.invertSelection=function(){self.$list.invertSelection();return that;};that.loseFocus=function(){self.$list.loseFocus();return that;};that.reloadList=function(stayAtPosition){self.$list.reloadList(stayAtPosition);return that;};that.scrollToSelection=function(){self.$list.scrollToSelection();return that;};that.selectAll=function(){self.$list.selectAll();return that;};that.selectPosition=function(pos){self.$list.selectPosition(pos);return that;};that.selectSelected=function(offset){self.$list.selectSelected(offset);return that;};that.size=function(){self.$list.size();return that;};that.sortList=function(key,operator){self.options.sort=[{key:key,operator:operator}];updateKeys();self.$list.sortList(key,operator);return that;};that.value=function(){var args=Ox.slice(arguments),id=args.shift();if(arguments.length==1){return self.$list.value(id);}else if(arguments.length==2&&Ox.isString(arguments[1])){return self.$list.value(id,arguments[1]);}else{Ox.forEach(Ox.makeObject(args),function(value,key){self.$list.value(id,key,value);});return that;}};return that;};'use strict';Ox.List=function(options,self){self=self||{};var that=Ox.Container({},self).defaults({_tree:false,centered:false,construct:null,disableHorizonzalScrolling:false,draggable:false,format:[],itemHeight:16,items:null,itemWidth:16,keys:[],max:-1,min:0,orientation:'vertical',pageLength:100,query:{conditions:[],operator:'&'},selected:[],sort:[],sortable:false,sums:[],type:'text',unique:''}).options(options||{}).update({draggable:updateDraggable,items:function(){if(!self.isAsync){updateItems();}else{if(Ox.isArray(self.options.items)){self.items=self.options.items;self.options.items=self.itemsAPI.update(self.items);}
|
||
|
|
updateQuery();}},query:function(){that.reloadList();},selected:function(){setSelected(self.options.selected);},sort:updateSort,sortable:updateSortable}).on({scroll:scroll});self.options.sort=self.options.sort.map(function(sort){return Ox.isString(sort)?{key:sort.replace(/^[\+\-]/,''),operator:sort[0]=='-'?'-':'+'}:sort;});if(Ox.isArray(self.options.items)&&!self.options._tree){self.items=self.options.items;self.options.items=Ox.api(self.items,{cache:true,map:self.options.map,sort:self.options.sort,sums:self.options.sums,unique:self.options.unique});self.itemsAPI=self.options.items;}
|
||
|
|
that.$content.bindEvent({mousedown:mousedown,singleclick:singleclick,doubleclick:doubleclick}).on({touchend:function(e){if(self.touchSelection.length&&self.options.selected[0]==self.touchSelection[0]){doubleclick(e);}else{self.touchSelection=Ox.clone(self.options.selected);}}});self.options.draggable&&updateDraggable();self.options.sortable&&updateSortable();self.options.orientation=='horizontal'&&that.$content.css({height:'1px'});Ox.extend(self,{$items:[],$pages:[],format:{},isAsync:!self.options._tree,itemMargin:self.options.type=='text'?0:8,keyboardEvents:{key_control_c:function(){copyItems();},key_control_shift_c:function(){copyItems(true);},key_control_e:editItems,key_control_n:function(){addItem('');},key_alt_control_n:function(){addItem('alt');},key_alt_control_shift_n:function(){addItem('alt_shift');},key_control_shift_n:function(){addItem('shift');},key_control_v:pasteItems,key_control_x:function(){cutItems();},key_control_shift_x:function(){cutItems(true);},key_delete:deleteItems,key_end:scrollToLast,key_enter:open,key_home:scrollToFirst,key_pagedown:scrollPageDown,key_pageup:scrollPageUp,key_section:preview,key_space:preview},listMargin:self.options.type=='text'?0:8,page:0,preview:false,requests:[],scrollTimeout:0,selected:[],touchSelection:[]});if(!self.isAsync){self.selected=self.options.items.map(function(item,i){return Ox.extend(item,{_index:i})}).filter(function(item){return Ox.contains(self.options.selected,item[self.options.unique]);}).map(function(item){return item['_index'];});}
|
||
|
|
self.options.max==-1&&Ox.extend(self.keyboardEvents,{key_alt_control_a:function(){that.invertSelection();},key_control_a:function(){that.selectAll();}});self.options.min==0&&Ox.extend(self.keyboardEvents,{key_control_shift_a:selectNone});self.keyboardEvents['key_'+(self.options.orientation=='vertical'?'up':'left')]=selectPrevious;self.keyboardEvents['key_'+(self.options.orientation=='vertical'?'down':'right')]=selectNext;if(self.options.max==-1){self.keyboardEvents['key_shift_'+(self.options.orientation=='vertical'?'up':'left')]=addPreviousToSelection;self.keyboardEvents['key_shift_'+(self.options.orientation=='vertical'?'down':'right')]=addNextToSelection;}
|
||
|
|
if(self.options.orientation=='vertical'){Ox.extend(self.keyboardEvents,{key_left:function(){triggerToggleEvent(false);},key_right:function(){triggerToggleEvent(true);}});}else if(self.options.orientation=='both'){Ox.extend(self.keyboardEvents,{key_down:selectBelow,key_up:selectAbove});if(self.options.max==-1){Ox.extend(self.keyboardEvents,{key_shift_down:addBelowToSelection,key_shift_up:addAboveToSelection});}
|
||
|
|
self.pageLengthByRowLength=[0,60,60,60,60,60,60,63,64,72,80,88,96,104,112,120,128,136,144,152,160,168,176,184,192];}
|
||
|
|
if(self.options.selectAsYouType){Ox.extend(self.keyboardEvents,{keys:selectAsYouType});}
|
||
|
|
that.bindEvent(self.keyboardEvents);!self.isAsync?updateItems():updateQuery();function addAboveToSelection(){var pos=getAbove();if(pos>-1){addToSelection(pos);scrollToPosition(pos);}}
|
||
|
|
function addAllToSelection(pos){var arr,i,len=self.$items.length;if(!isSelected(pos)){if(self.selected.length==0){addToSelection(pos);}else{arr=[pos];if(Ox.min(self.selected)<pos){for(i=pos-1;i>=0;i--){if(isSelected(i)){break;}
|
||
|
|
arr.push(i);}}
|
||
|
|
if(Ox.max(self.selected)>pos){for(i=pos+1;i<len;i++){if(isSelected(i)){break;}
|
||
|
|
arr.push(i);}}
|
||
|
|
addToSelection(arr);}}}
|
||
|
|
function addBelowToSelection(){var pos=getBelow();if(pos>-1){addToSelection(pos);scrollToPosition(pos);}}
|
||
|
|
function addItem(keys){that.triggerEvent('add',{keys:keys});}
|
||
|
|
function addNextToSelection(){var pos=getNext();if(pos>-1){addToSelection(pos);scrollToPosition(pos);}}
|
||
|
|
function addPreviousToSelection(){var pos=getPrevious();if(pos>-1){addToSelection(pos);scrollToPosition(pos);}}
|
||
|
|
function addToSelection(pos){Ox.makeArray(pos).reverse().forEach(function(pos){if(!isSelected(pos)){self.selected.unshift(pos);if(!Ox.isUndefined(self.$items[pos])){self.$items[pos].addClass('OxSelected');}}else{self.selected.splice(self.selected.indexOf(pos),1);self.selected.unshift(pos);}});triggerSelectEvent();}
|
||
|
|
function clear(){self.requests.forEach(function(request){Ox.Request.cancel(request);});Ox.extend(self,{$items:[],$pages:[],page:0,requests:[]});}
|
||
|
|
function constructEmptyPage(page){var i,$page=Ox.Element().addClass('OxPage').css(getPageCSS(page));Ox.loop(getPageLength(page),function(){Ox.ListItem({construct:self.options.construct}).appendTo($page);});return $page;}
|
||
|
|
function copyItems(add){self.options.selected.length&&that.triggerEvent('copy'+(add?'add':''),{ids:self.options.selected});}
|
||
|
|
function cutItems(add){self.options.selected.length&&that.triggerEvent('cut'+(add?'add':''),{ids:self.options.selected});}
|
||
|
|
function deleteItems(){self.options.selected.length&&that.triggerEvent('delete',{ids:self.options.selected});}
|
||
|
|
function deselect(pos){var triggerEvent=false;Ox.makeArray(pos).forEach(function(pos){if(isSelected(pos)){self.selected.splice(self.selected.indexOf(pos),1);!Ox.isUndefined(self.$items[pos])&&self.$items[pos].removeClass('OxSelected');triggerEvent=true;}});triggerEvent&&triggerSelectEvent();}
|
||
|
|
function doubleclick(data){open(isSpecialTarget(data));}
|
||
|
|
function dragstart(data){var $target=$(data.target),$parent=$target.parent();if(($target.is('.OxTarget')||$parent.is('.OxTarget')||$parent.parent().is('.OxTarget'))&&!$target.is('.OxSpecialTarget')){Ox.$body.addClass('OxDragging');self.drag={ids:self.options.selected};that.triggerEvent('draganddropstart',{event:data,ids:self.drag.ids});}}
|
||
|
|
function drag(data){self.drag&&that.triggerEvent('draganddrop',{event:data,ids:self.drag.ids});}
|
||
|
|
function dragpause(data){self.drag&&that.triggerEvent('draganddroppause',{event:data,ids:self.drag.ids});}
|
||
|
|
function dragenter(data){self.drag&&that.triggerEvent('draganddropenter',{event:data,ids:self.drag.ids});}
|
||
|
|
function dragleave(data){self.drag&&that.triggerEvent('draganddropleave',{event:data,ids:self.drag.ids});}
|
||
|
|
function dragend(data){if(self.drag){Ox.$body.removeClass('OxDragging');that.triggerEvent('draganddropend',{event:data,ids:self.drag.ids});delete self.drag;}}
|
||
|
|
function editItems(){}
|
||
|
|
function emptyFirstPage(){if(self.$pages[0]){if(self.options.type=='text'){self.$pages[0].find('.OxEmpty').each(function(){Ox.UI.getElement($(this)).remove();});}else if(self.options.orientation=='both'){that.$content.css({height:getListSize()+'px'});}}}
|
||
|
|
function fillFirstPage(){if(self.$pages[0]){if(self.options.type=='text'){var height=getHeight(),lastItemHeight=height%self.options.itemHeight||self.options.itemHeight,visibleItems=Math.ceil(height/self.options.itemHeight);if(self.listLength<visibleItems){Ox.range(self.listLength,visibleItems).forEach(function(i){var $item=Ox.ListItem({construct:self.options.construct});$item.addClass('OxEmpty').removeClass('OxTarget');if(i==visibleItems-1){$item.$element.css({height:lastItemHeight+'px',overflowY:'hidden'});}
|
||
|
|
$item.appendTo(self.$pages[0]);});}}else if(self.options.orientation=='both'){var height=getHeight(),listSize=getListSize();if(listSize<height){that.$content.css({height:height+'px'});}}}}
|
||
|
|
function findCell(e){var $element=$(e.target);while(!$element.is('.OxCell')&&!$element.is('.OxPage')&&!$element.is('body')){$element=$element.parent();}
|
||
|
|
return $element.is('.OxCell')?$element:null;}
|
||
|
|
function findItemPosition(e){var $element=$(e.target),$parent,position=-1;while(!$element.is('.OxTarget')&&!$element.is('.OxPage')&&($parent=$element.parent()).length){$element=$parent;}
|
||
|
|
if($element.is('.OxTarget')){while(!$element.is('.OxItem')&&!$element.is('.OxPage')&&($parent=$element.parent()).length){$element=$parent;}
|
||
|
|
if($element.is('.OxItem')){position=$element.data('position');}}
|
||
|
|
return position;}
|
||
|
|
function getAbove(){var pos=-1;if(self.selected.length){pos=self.selected[0]-self.rowLength;if(pos<0){pos=-1;}}
|
||
|
|
return pos;}
|
||
|
|
function getBelow(){var pos=-1;if(self.selected.length){pos=self.selected[0]+self.rowLength;if(pos>=self.$items.length){pos=-1;}}
|
||
|
|
return pos;}
|
||
|
|
function getHeight(){return that.height()-(!self.options.disableHorizontalScrolling&&that.$content.width()>that.width()?Ox.UI.SCROLLBAR_SIZE:0);}
|
||
|
|
function getListSize(){return Math.ceil(self.listLength/self.rowLength)*(self.options[self.options.orientation=='horizontal'?'itemWidth':'itemHeight']+self.itemMargin);}
|
||
|
|
function getNext(){var pos=-1;if(self.selected.length){pos=self.selected[0]+1;if(pos==self.$items.length){pos=-1;}}
|
||
|
|
return pos;}
|
||
|
|
function getPage(){return Math.max(Math.floor(self.options.orientation=='horizontal'?(that.scrollLeft()-self.listMargin/2)/self.pageWidth:(that.scrollTop()-self.listMargin/2)/self.pageHeight),0);}
|
||
|
|
function getPageByPosition(pos){return Math.floor(pos/self.options.pageLength);}
|
||
|
|
function getPageByScrollPosition(pos){return getPageByPosition(pos/(self.options.orientation=='vertical'?self.options.itemHeight:self.options.itemWidth));}
|
||
|
|
function getPageCSS(page){return self.options.orientation=='horizontal'?{left:(page*self.pageWidth+self.listMargin/2)+'px',top:(self.listMargin/2)+'px',width:(page<self.pages-1?self.pageWidth:getPageLength(page)*(self.options.itemWidth+self.itemMargin))+'px'}:{top:(page*self.pageHeight+self.listMargin/2)+'px',width:self.pageWidth+'px'};}
|
||
|
|
function getPageHeight(){return Math.ceil(self.pageLength*(self.options.itemHeight+self.itemMargin)/self.rowLength);}
|
||
|
|
function getPageLength(page){var mod=self.listLength%self.pageLength;return page<self.pages-1||(self.listLength&&mod==0)?self.pageLength:mod;}
|
||
|
|
function getPositionById(id){var pos=-1;Ox.forEach(self.$items,function($item,i){if($item.options('data')[self.options.unique]==id){pos=i;return false;}});return pos;}
|
||
|
|
function getPositions(callback){if(self.options.selected.length){self.requests.push(self.options.items({positions:self.options.selected,query:self.options.query,sort:self.options.sort},function(result){getPositionsCallback(result,callback);}));}else{getPositionsCallback(null,callback);}}
|
||
|
|
function getPositionsCallback(result,callback){var pos=0,previousSelected=self.options.selected;if(result){self.options.selected=[];self.positions={};self.selected=[];Ox.forEach(result.data.positions,function(pos,id){if(pos>-1){self.options.selected.push(id);self.selected.push(pos);}});if(self.selected.length){pos=Ox.min(self.selected);self.page=getPageByPosition(pos);}
|
||
|
|
if(!Ox.isEqual(self.options.selected,previousSelected)){that.triggerEvent('select',{ids:self.options.selected});}}else if(self.stayAtPosition){self.page=getPageByScrollPosition(self.stayAtPosition);}
|
||
|
|
that.$content.empty();loadPages(self.page,function(){scrollToPosition(pos,true);callback&&callback();});}
|
||
|
|
function getPrevious(){var pos=-1;if(self.selected.length){pos=self.selected[0]-1;}
|
||
|
|
return pos;}
|
||
|
|
function getRow(pos){return Math.floor(pos/self.rowLength);}
|
||
|
|
function getRowLength(){return self.options.orientation=='both'?Math.floor((getWidth()-self.listMargin)/(self.options.itemWidth+self.itemMargin)):1;}
|
||
|
|
function getScrollPosition(){return Math.floor(that.scrollTop()/(self.options.itemHeight+self.itemMargin))*self.rowLength;}
|
||
|
|
function getSelectedIds(callback){var ids=[],notFound=false;if(self.$items.length==0){callback(self.options.selected);}else{Ox.forEach(self.selected,function(pos){if(self.$items[pos]){ids.push(self.$items[pos].options('data')[self.options.unique]);}else{notFound=true;return false;}});if(notFound){self.options.items({keys:[self.options.unique],query:self.options.query,range:[0,self.listLength],sort:self.options.sort},function(result){var ids=[],rest=[],useRest=self.selected.length>self.listLength/2;result.data.items.forEach(function(item,i){if(isSelected(i)){ids.push(item[self.options.unique]);}else if(useRest){rest.push(item[self.options.unique]);}});useRest?callback(ids,rest):callback(ids);});}else{callback(ids);}}}
|
||
|
|
function getWidth(){return that.width()-(that.$content.height()>that.height()?Ox.UI.SCROLLBAR_SIZE:0);}
|
||
|
|
function isSelected(pos){return Ox.contains(self.selected,pos);}
|
||
|
|
function isSpecialTarget(e){var $element=$(e.target),$parent;while(!$element.is('.OxSpecialTarget')&&!$element.is('.OxPage')&&($parent=$element.parent()).length){$element=$parent;}
|
||
|
|
return $element.is('.OxSpecialTarget');}
|
||
|
|
function loadItems(){self.$pages[0].empty();self.$items=[];self.options.items.forEach(function(item,pos){var time0=+new Date();self.$items[pos]=Ox.ListItem({construct:self.options.construct,data:item,position:pos,unique:self.options.unique});isSelected(pos)&&self.$items[pos].addClass('OxSelected');self.$items[pos].appendTo(self.$pages[0]);});setTimeout(fillFirstPage,0);self.selected.length&&scrollToPosition(self.selected[0]);that.triggerEvent('init',{items:self.options.items.length});}
|
||
|
|
function loadPage(page,callback){if(page<0||page>=self.pages){!Ox.isUndefined(callback)&&callback();return;}
|
||
|
|
Ox.Log('List',that.oxid,'loadPage',page);var keys=Ox.unique(self.options.keys.concat(self.options.unique)),offset=page*self.pageLength,range=[offset,offset+getPageLength(page)];if(!Ox.isUndefined(self.$pages[page])){Ox.Log('List','fixme: unload should have made this undefined already');}
|
||
|
|
self.$pages[page]=constructEmptyPage(page);page==0&&fillFirstPage();self.$pages[page].appendTo(that.$content);self.requests.push(self.options.items({keys:keys,query:self.options.query,range:range,sort:self.options.sort},function(result){var $emptyPage=self.$pages[page];self.$pages[page]=Ox.Element().addClass('OxPage').css(getPageCSS(page));result.data.items.forEach(function(v,i){var pos=offset+i;self.$items[pos]=Ox.ListItem({construct:self.options.construct,data:v,position:pos,unique:self.options.unique});isSelected(pos)&&self.$items[pos].addClass('OxSelected');self.$items[pos].appendTo(self.$pages[page]);});page==0&&fillFirstPage();$emptyPage&&$emptyPage.remove&&$emptyPage.remove();self.$pages[page].appendTo(that.$content);!Ox.isUndefined(callback)&&callback();}));}
|
||
|
|
function loadPages(page,callback){Ox.Log('List','loadPages',page);var counter=0,fn=function(){if(++counter==3){!Ox.isUndefined(callback)&&callback();that.triggerEvent('load');}};loadPage(page,fn);loadPage(page-1,fn);loadPage(page+1,fn);}
|
||
|
|
function mousedown(data){var pos=findItemPosition(data);that.gainFocus();self.mousedownOnSelectedCell=false;if(pos>-1){if(data.metaKey){if(!isSelected(pos)&&(self.options.max==-1||self.options.max>self.selected.length)){addToSelection(pos);}else if(isSelected(pos)&&self.options.min<self.selected.length){deselect(pos);}}else if(data.shiftKey){if(!isSelected(pos)&&self.options.max==-1){addAllToSelection(pos);}else if(isSelected(pos)){addToSelection(pos);}}else if(!isSelected(pos)&&self.options.max!=0){select(pos);}else if(self.options.type=='text'){self.mousedownOnSelectedCell=true;}}else if(!$(data.target).is('.OxToggle')&&self.options.min==0){selectNone();}}
|
||
|
|
function movestart(data){Ox.$body.addClass('OxDragging');var pos=findItemPosition(data),$items=self.$items.filter(function($item,i){if($item.is('.OxSelected')){$item.addClass('OxDrag');return true;}
|
||
|
|
return false;});self.drag={$items:$items,index:Ox.indexOf($items,function($item){return $item.options('position')==pos;}),length:$items.length,startPos:pos,startY:data.clientY,stopPos:pos};}
|
||
|
|
function move(data){var clientY=data.clientY-that.offset().top,offset=clientY%16,position=Ox.limit(Math.floor(clientY/16),0,self.$items.length-1);if(position<self.drag.startPos){self.drag.stopPos=position+(offset>8?1:0);}else if(position>self.drag.startPos){self.drag.stopPos=position-(offset<=8?1:0);}
|
||
|
|
if(self.drag.stopPos!=self.drag.startPos){moveItems(self.drag.startPos,self.drag.stopPos);self.drag.startPos=self.drag.stopPos;}}
|
||
|
|
function moveend(data){var ids=[];Ox.$body.removeClass('OxDragging');self.$items.forEach(function($item){$item.removeClass('OxDrag');ids.push($item.options('data')[self.options.unique]);});that.triggerEvent('move',{ids:ids});delete self.drag;}
|
||
|
|
function moveItems(startPos,stopPos){var pos=stopPos;while(self.$items[pos].is('.OxSelected')){pos=pos+(pos<startPos?-1:1);if(pos<0||pos>self.$items.length-1){return;}}
|
||
|
|
self.drag.$items.forEach(function($item){$item.detach();});self.drag.$items.forEach(function($item,i){if(i==0){$item[pos<startPos?'insertBefore':'insertAfter'](self.$items[pos].$element);}else{$item.insertAfter(self.drag.$items[i-1]);}});self.drag.$items.forEach(function($item,i){self.$items.splice($item.options('position')-i,1);});self.$items.splice.apply(self.$items,[stopPos-self.drag.index,0].concat(self.drag.$items));self.$items.forEach(function($item,pos){$item.options({position:pos});});self.selected=[];self.drag.$items.forEach(function($item){self.selected.push($item.options('position'));});}
|
||
|
|
function open(isSpecialTarget){self.options.selected.length&&that.triggerEvent('open',{ids:self.options.selected,isSpecialTarget:isSpecialTarget==true});}
|
||
|
|
function pasteItems(){that.triggerEvent('paste');}
|
||
|
|
function preview(){if(self.options.selected.length){self.preview=!self.preview;if(self.preview){that.triggerEvent('openpreview',{ids:self.options.selected});}else{that.triggerEvent('closepreview');}}}
|
||
|
|
function scroll(){if(self.isAsync){var page=self.page;self.scrollTimeout&&clearTimeout(self.scrollTimeout);self.scrollTimeout=setTimeout(function(){self.scrollTimeout=0;self.page=getPage();if(self.page==page-1){unloadPage(self.page+2);loadPage(self.page-1);}else if(self.page==page+1){unloadPage(self.page-2);loadPage(self.page+1);}else if(self.page==page-2){unloadPage(self.page+3);unloadPage(self.page+2);loadPage(self.page);loadPage(self.page-1);}else if(self.page==page+2){unloadPage(self.page-3);unloadPage(self.page-2);loadPage(self.page);loadPage(self.page+1);}else if(self.page!=page){unloadPages(page);loadPages(self.page);}},250);}}
|
||
|
|
function scrollPageDown(){that.scrollTop(that.scrollTop()+getHeight());}
|
||
|
|
function scrollPageUp(){that.scrollTop(that.scrollTop()-getHeight());}
|
||
|
|
function scrollTo(value){that.animate(self.options.orientation=='horizontal'?{scrollLeft:(self.listSize*value)+'px'}:{scrollTop:(self.listSize*value)+'px'},0);}
|
||
|
|
function scrollToFirst(){that[self.options.orientation=='horizontal'?'scrollLeft':'scrollTop'](0);}
|
||
|
|
function scrollToLast(){that[self.options.orientation=='horizontal'?'scrollLeft':'scrollTop'](self.listSize);}
|
||
|
|
function scrollToPosition(pos,leftOrTopAlign){var itemHeight=self.options.itemHeight+self.itemMargin,itemWidth=self.options.itemWidth+self.itemMargin,positions=[],scroll,size;if(self.options.orientation=='horizontal'){if(self.options.centered){that.stop().animate({scrollLeft:self.listMargin/2+(pos+0.5)*itemWidth
|
||
|
|
-that.width()/2+'px'},250);}else{positions[0]=pos*itemWidth+self.listMargin/2;positions[1]=positions[0]+itemWidth+self.itemMargin/2;scroll=that.scrollLeft();size=getWidth();if(positions[0]<scroll||leftOrTopAlign){that.animate({scrollLeft:positions[0]+'px'},0);}else if(positions[1]>scroll+size){that.animate({scrollLeft:(positions[1]-size)+'px'},0);}}}else{positions[0]=(self.options.orientation=='vertical'?pos:getRow(pos))*itemHeight;positions[1]=positions[0]+itemHeight+(self.options.orientation=='vertical'?0:self.itemMargin);scroll=that.scrollTop();size=getHeight();if(positions[0]<scroll||leftOrTopAlign){that.animate({scrollTop:positions[0]+'px'},0);}else if(positions[1]>scroll+size){that.animate({scrollTop:(positions[1]-size)+'px'},0);}}}
|
||
|
|
function select(pos){if(!isSelected(pos)||self.selected.length>1){setSelected([pos]);triggerSelectEvent();self.options.centered&&scrollToPosition(pos);}}
|
||
|
|
function selectAbove(){var pos=getAbove();if(pos>-1){select(pos);scrollToPosition(pos);}}
|
||
|
|
function selectAsYouType(data){self.options.items({keys:[self.options.unique],query:{conditions:[self.options.query,{key:self.options.selectAsYouType,operator:'^',value:data.keys},],operator:'&'},range:[0,1],sort:[{key:self.options.selectAsYouType,operator:'+'}]},function(result){result.data.items.length&&that.options({selected:[result.data.items[0][self.options.unique]]});});}
|
||
|
|
function selectBelow(){var pos=getBelow();if(pos>-1){select(pos);scrollToPosition(pos);}}
|
||
|
|
function selectNext(){var pos=getNext();if(pos>-1){select(pos);scrollToPosition(pos);}else if(self.selected.length){that.triggerEvent('selectnext');}}
|
||
|
|
function selectNone(){deselect(Ox.clone(self.selected));}
|
||
|
|
function selectPrevious(){var pos=getPrevious();if(pos>-1){select(pos);scrollToPosition(pos);}else if(self.selected.length){that.triggerEvent('selectprevious');}}
|
||
|
|
function selectQuery(str){Ox.forEach(self.$items,function(v,i){if(Ox.toLatin(v.title).toUpperCase().indexOf(str)==0){select(i);scrollToPosition(i);return false;}});}
|
||
|
|
function setSelected(ids,callback){var counter=0;self.$items.forEach(function($item,pos){if(isSelected(pos)){if(!Ox.isUndefined(self.$items[pos])){self.$items[pos].removeClass('OxSelected');}}});self.selected=[];ids.forEach(function(id,i){var pos=Ox.isString(id)?getPositionById(id):id;if(pos>-1){select(pos,i);}else if(self.isAsync){self.options.items({positions:[id],query:self.options.query,sort:self.options.sort},function(result){pos=result.data.positions[id];select(pos,i);});}});function select(pos,i){self.selected.push(pos);if(!Ox.isUndefined(self.$items[pos])){self.$items[pos].addClass('OxSelected');}
|
||
|
|
i==0&&scrollToPosition(pos);++counter==ids.length&&callback&&callback();}}
|
||
|
|
function singleclick(data){var pos=findItemPosition(data),$cell,clickable,editable;if(pos>-1){if(!data.metaKey&&!data.shiftKey&&isSelected(pos)&&self.selected.length>1){select(pos);}else if(self.mousedownOnSelectedCell){$cell=findCell(data);if($cell){clickable=$cell.is('.OxClickable');editable=$cell.is('.OxEditable')&&!$cell.is('.OxEdit');if(clickable||editable){triggerClickEvent(clickable?'click':'edit',self.$items[pos],$cell);}}}}}
|
||
|
|
function toggleSelection(pos){if(!isSelected(pos)){addToSelection(pos);}else{deselect(pos);}}
|
||
|
|
function triggerClickEvent(event,$item,$cell){var key;if($cell){key=$cell.attr('class').split('OxColumn')[1].split(' ')[0];key=key[0].toLowerCase()+key.slice(1);}
|
||
|
|
that.triggerEvent(event,Ox.extend({id:$item.data('id')},key?{key:key}:{}));}
|
||
|
|
var triggerSelectEvent=Ox.debounce(function(){getSelectedIds(function(ids,rest){self.options.selected=ids;that.triggerEvent('select',Ox.extend({ids:ids},rest?{rest:rest}:{}));if(self.preview){if(ids.length){that.triggerEvent('openpreview',{ids:ids});}else{that.triggerEvent('closepreview');}}});},true);function triggerToggleEvent(expanded){that.triggerEvent('toggle',{expanded:expanded,ids:self.options.selected});}
|
||
|
|
function unloadPage(page){if(page<0||page>=self.pages){return;}
|
||
|
|
if(!Ox.isUndefined(self.$pages[page])){self.$pages[page].remove();delete self.$pages[page];}}
|
||
|
|
function unloadPages(page){unloadPage(page);unloadPage(page-1);unloadPage(page+1)}
|
||
|
|
function updateDraggable(){that.$content[self.options.draggable?'bindEvent':'unbindEvent']({dragstart:dragstart,drag:drag,dragpause:dragpause,dragenter:dragenter,dragleave:dragleave,dragend:dragend});}
|
||
|
|
function updateItems(){clear();that.$content.empty();self.$pages=[];self.$pages[0]=Ox.Element().addClass('OxPage').css({left:self.listMargin/2+'px',top:self.listMargin/2+'px'}).appendTo(that.$content);self.listLength=self.options.items.length;loadItems();}
|
||
|
|
function updatePages(pos,scroll){clear();self.pageLength=self.pageLengthByRowLength[self.rowLength]
|
||
|
|
Ox.extend(self,{listSize:getListSize(),pages:Math.ceil(self.listLength/self.pageLength),pageWidth:(self.options.itemWidth+self.itemMargin)*self.rowLength,pageHeight:getPageHeight()});that.$content.css({height:self.listSize+'px'});self.page=getPageByPosition(pos);that.$content.empty();loadPages(self.page,function(){scrollTo(scroll);});}
|
||
|
|
function updatePositions(){self.$items.forEach(function($item,pos){$item.options({position:pos});});}
|
||
|
|
function updateQuery(callback){var data;self.requests.push(data=self.options.items({query:self.options.query},function(result){var keys={};setTimeout(function(){clear();that.triggerEvent('init',Ox.extend(result.data,data&&data.query?{query:data.query}:{}));self.rowLength=getRowLength();self.pageLength=self.options.orientation=='both'?self.pageLengthByRowLength[self.rowLength]:self.options.pageLength;Ox.extend(self,{listLength:result.data.items,pages:Math.max(Math.ceil(result.data.items/self.pageLength),1),pageWidth:self.options.orientation=='vertical'?0:(self.options.itemWidth+self.itemMargin)*(self.options.orientation=='horizontal'?self.pageLength:self.rowLength),pageHeight:self.options.orientation=='horizontal'?0:Math.ceil(self.pageLength*(self.options.itemHeight+self.itemMargin)/self.rowLength)});self.listSize=getListSize();that.$content.css(self.options.orientation=='horizontal'?'width':'height',self.listSize+'px');getPositions(callback);});}));}
|
||
|
|
function updateSelected(){getSelectedIds(function(oldIds){var newIds=[];Ox.forEach(self.options.items,function(item){if(Ox.contains(oldIds,item.id)){newIds.push(item.id);}
|
||
|
|
if(newIds.length==oldIds.length){return false;}});setSelected(newIds);});}
|
||
|
|
function updateSort(){var length=self.options.sort.length,operator=[],sort=[];if(!self.isAsync){getSelectedIds(function(selectedIds){self.options.sort.forEach(function(v,i){operator.push(v.operator);sort.push({});self.options.items.forEach(function(item){sort[i][item.id]=v.map?v.map(item[v.key],item):item[v.key]});});self.options.items.sort(function(a,b){var aValue,bValue,index=0,ret=0;while(ret==0&&index<length){aValue=sort[index][a.id];bValue=sort[index][b.id];if(aValue<bValue){ret=operator[index]=='+'?-1:1;}else if(aValue>bValue){ret=operator[index]=='+'?1:-1;}else{index++;}}
|
||
|
|
return ret;});if(selectedIds.length){self.selected=[];self.options.items.forEach(function(item,i){if(Ox.contains(selectedIds,item.id)){self.selected.push(i);}});}
|
||
|
|
loadItems();});}else{clear();getPositions();}}
|
||
|
|
function updateSortable(){that.$content[self.options.sortable?'bindEvent':'unbindEvent']({dragstart:movestart,drag:move,dragend:moveend});}
|
||
|
|
that.addItems=function(pos,items){if(arguments.length==1){items=pos;pos=self.listLength;}
|
||
|
|
var $items=[],length=items.length;self.selected.forEach(function(v,i){if(v>=pos){self.selected[i]+=length;}});items.forEach(function(item,i){var $item;$items.push($item=Ox.ListItem({construct:self.options.construct,data:item,position:pos+i,unique:self.options.unique}));if(i==0){if(pos==0){$item.insertBefore(self.$items[0]);}else{$item.insertAfter(self.$items[pos-1]);}}else{$item.insertAfter($items[i-1]);}});self.options.items.splice.apply(self.options.items,[pos,0].concat(items));self.$items.splice.apply(self.$items,[pos,0].concat($items));self.listLength=self.options.items.length;updatePositions();emptyFirstPage();fillFirstPage();};that.closePreview=function(){self.preview=false;that.triggerEvent('closepreview');return that;};that.clearCache=function(){self.$pages=[];return that;};that.getPasteIndex=function(){return self.selected.length?Ox.max(self.selected)+1:self.items.length;};that.invertSelection=function(){var arr=Ox.range(self.listLength).filter(function(pos){return!isSelected(pos);});setSelected(arr);triggerSelectEvent();return that;};that.openPreview=function(){self.preview=true;that.triggerEvent('openpreview',{ids:self.options.selected});return that;};that.reloadList=function(stayAtPosition){var scrollTop=that.scrollTop();if(!self.isAsync){loadItems();scrollList();}else{updateQuery(scrollList);}
|
||
|
|
function scrollList(){stayAtPosition&&that.scrollTop(scrollTop);}
|
||
|
|
return that;};that.reloadPages=function(){var page,scrollLeft,scrollTop;if(!self.isAsync){scrollLeft=that.scrollLeft();scrollTop=that.scrollTop();loadItems();that.scrollLeft(scrollLeft).scrollTop(scrollTop);}else{page=self.page;clear();self.page=page
|
||
|
|
that.$content.empty();loadPages(self.page);}
|
||
|
|
return that;};that.removeItems=function(pos,length){Ox.Log('List','removeItems',pos,length)
|
||
|
|
if(Ox.isUndefined(length)){pos.forEach(function(id){var p=getPositionById(id);that.removeItems(p,1);});}else{Ox.range(pos,pos+length).forEach(function(i){isSelected(i)&&deselect(i);self.$items[i].remove();});self.options.items.splice(pos,length);self.$items.splice(pos,length);self.selected.forEach(function(v,i){if(v>=pos+length){self.selected[i]-=length;}});self.listLength=self.options.items.length;updatePositions();}
|
||
|
|
emptyFirstPage();fillFirstPage();};that.scrollToSelection=function(){self.selected.length&&scrollToPosition(self.selected[0]);return that;};that.selectAll=function(){addToSelection(Ox.range(self.listLength));return that;};that.selectPosition=function(pos){select(pos);return that;};that.selectSelected=function(offset){var pos,positions;if(self.selected.length>1){positions=Ox.sort(Ox.clone(self.selected));pos=positions[Ox.mod(positions.indexOf(self.selected[0])+offset,positions.length)];addToSelection(pos);scrollToPosition(pos);}
|
||
|
|
return that;};that.size=function(){if(self.options.orientation=='both'){var rowLength=getRowLength(),pageLength=self.pageLengthByRowLength[rowLength],pos=getScrollPosition(),scroll=that.scrollTop()/self.listSize;if(pageLength!=self.pageLength){self.pageLength=pageLength;self.rowLength=rowLength;updatePages(pos,scroll);}else if(rowLength!=self.rowLength){self.rowLength=rowLength;self.pageWidth=(self.options.itemWidth+self.itemMargin)*self.rowLength;self.listSize=getListSize();self.pageHeight=getPageHeight();self.$pages.forEach(function($page,i){!Ox.isUndefined($page)&&$page.css({width:self.pageWidth+'px',top:(i*self.pageHeight+self.listMargin/2)+'px'});});that.$content.css({height:self.listSize+'px'});scrollTo(scroll);}
|
||
|
|
emptyFirstPage();fillFirstPage();}else if(self.options.type=='text'){emptyFirstPage();fillFirstPage();}
|
||
|
|
return that;};that.sort=function(){updateSort();};that.sortList=function(key,operator,map){if(key!=self.options.sort[0].key||operator!=self.options.sort[0].operator){self.options.sort[0]={key:key,operator:operator,map:map};updateSort();that.triggerEvent('sort',self.options.sort[0]);}
|
||
|
|
return that;};that.value=function(){var args=Ox.slice(arguments),id=args.shift(),pos=Ox.isNumber(id)?id:getPositionById(id),$item=self.$items[pos],data=$item?$item.options('data'):{},updateItems=false;if(arguments.length==1){return data;}else if(arguments.length==2&&Ox.isString(arguments[1])){return data[arguments[1]];}else if($item){Ox.forEach(Ox.makeObject(args),function(value,key){if(key==self.options.unique){self.options.selected=self.options.selected.map(function(id_){return id_==data[key]?value:id_});}
|
||
|
|
if(!self.isAsync){self.options.items[pos][key]=value;}else if(self.items){self.items[Ox.getIndex(self.items,self.options.unique,id)][key]=value;updateItems=true;}
|
||
|
|
data[key]=value;});$item.options({data:data});if(updateItems){self.options.items.update(self.items);}
|
||
|
|
return that;}};return that;};'use strict';Ox.ListItem=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({construct:null,data:{},draggable:false,position:0,unique:''}).options(options||{}).update({data:function(){if(!that.find('.OxEdit').length){constructItem(true);}},position:function(){that.data({position:self.options.position});}});constructItem();function constructItem(update){var $element=self.options.construct(self.options.data).addClass('OxItem').data({id:self.options.data[self.options.unique],position:self.options.position});if(update){that.hasClass('OxSelected')&&$element.addClass('OxSelected');}
|
||
|
|
that.setElement($element);}
|
||
|
|
return that;};'use strict';Ox.SortList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({items:[],scrollbarVisible:false}).options(options||{}).update({items:function(){self.items=getItems();self.$list.reloadList();that.triggerEvent('sort',{ids:self.items.map(function(item){return item.id;})});}});self.items=getItems();self.$list=Ox.TableList({columns:[{id:'title',visible:true}],items:self.items,max:1,scrollbarVisible:self.options.scrollbarVisible,sort:[{key:'position',operator:'+'}],sortable:true,unique:'id'}).bindEvent({move:function(data){self.options.items.sort(function(a,b){return data.ids.indexOf(a.id)-data.ids.indexOf(b.id);});that.triggerEvent('sort',data);}});function getItems(){return self.options.items.map(function(item,position){return{id:item.id,title:item.title,position:position};});}
|
||
|
|
that.setElement(self.$list);return that;};'use strict';Ox.TableList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({clearButton:false,clearButtonTooltip:'',columns:[],columnsMovable:false,columnsRemovable:false,columnsResizable:false,columnsVisible:false,columnWidth:[40,800],disableHorizontalScrolling:false,draggable:false,droppable:false,id:'',items:null,keys:[],max:-1,min:0,pageLength:100,query:{conditions:[],operator:'&'},scrollbarVisible:false,selected:[],sort:[],sortable:false,sums:[],unique:''}).options(options||{}).update({disableHorizontalScrolling:function(){self.options.disableHorizontalScrolling?disableHorizontalScrolling():enableHorizontalScrolling();},draggable:function(){that.$body.options({sortable:self.options.draggable});},items:function(){that.$body.options({items:self.options.items});},paste:function(){that.$body.options({paste:self.options.paste});},query:function(){that.$body.options({query:self.options.query});},selected:function(){that.$body.options({selected:self.options.selected});updateClearButton();},sort:function(){updateColumn();that.$body.options({sort:self.options.sort});},sortable:function(){that.$body.options({sortable:self.options.sortable});}}).addClass('OxTableList');self.options.columns.forEach(function(column){if(Ox.isUndefined(column.align)){column.align='left';}
|
||
|
|
if(Ox.isUndefined(column.clickable)){column.clickable=false;}
|
||
|
|
if(Ox.isUndefined(column.editable)){column.editable=false;}
|
||
|
|
if(Ox.isUndefined(column.unique)){column.unique=false;}
|
||
|
|
if(Ox.isUndefined(column.visible)){column.visible=false;}
|
||
|
|
if(column.unique&&!self.options.unique){self.options.unique=column.id;}});if(Ox.isEmpty(self.options.sort)){self.options.sort=[{key:self.options.unique,operator:Ox.getObjectById(self.options.columns,self.options.unique).operator}];}else{self.options.sort=self.options.sort.map(function(sort){return Ox.isString(sort)?{key:sort.replace(/^[\+\-]/,''),operator:sort[0]=='-'?'-':'+'}:sort;});}
|
||
|
|
Ox.extend(self,{columnPositions:[],defaultColumnWidths:self.options.columns.map(function(column){return column.defaultWidth||column.width;}),hasItemsArray:Ox.isArray(self.options.items),itemHeight:16,page:0,pageLength:100,scrollLeft:0,selectedColumn:getColumnIndexById(self.options.sort[0].key),visibleColumns:self.options.columns.filter(function(column){return column.visible;})});self.options.columns.forEach(function(column){if(!Ox.isUndefined(column.position)){self.visibleColumns[column.position]=column;}});Ox.extend(self,{columnWidths:self.visibleColumns.map(function(column){return column.width;}),pageHeight:self.options.pageLength*self.itemHeight});self.format={};self.map={};self.options.columns.forEach(function(column){if(column.format){self.format[column.id]=column.format;}
|
||
|
|
if(column.sort){self.map[column.id]=column.sort;}});if(self.options.columnsVisible){that.$bar=Ox.Bar({orientation:'horizontal',size:16}).appendTo(that);that.$head=Ox.Container().addClass('OxHead').css({right:self.options.scrollbarVisible?Math.max(Ox.UI.SCROLLBAR_SIZE,8)+'px':0}).appendTo(that.$bar);that.$head.$content.addClass('OxTitles');constructHead();if(self.options.columnsRemovable){that.$select=Ox.Select({id:self.options.id+'SelectColumns',items:self.options.columns.filter(function(column){return column.addable!==false;}).map(function(column){return{disabled:column.removable===false,id:column.id,title:column.title};}),max:-1,min:1,type:'image',value:Ox.filter(self.options.columns,function(column){return column.visible;}).map(function(column){return column.id;})}).css(Ox.UI.SCROLLBAR_SIZE==16?{right:0,width:'14px'}:{right:'-1px',width:'8px',}).bindEvent('change',changeColumns).appendTo(that.$bar);Ox.UI.SCROLLBAR_SIZE<16&&$(that.$select.find('input')[0]).css({marginRight:'-3px',marginTop:'1px',width:'8px',height:'8px'});}else if(self.options.clearButton){self.$clearButton=Ox.Element({element:'<img>',tooltip:self.options.clearButtonTooltip}).addClass('OxClear').attr({src:Ox.UI.getImageURL('symbolClose')}).css(Ox.UI.SCROLLBAR_SIZE==16?{paddingLeft:'4px',paddingRight:'2px',marginRight:0}:{paddingRight:'1px',marginRight:'-2px'})
|
||
|
|
[self.options.selected.length?'show':'hide']().bindEvent({anyclick:function(){self.$clearButton.hide();self.options.selected=[];that.$body.options({selected:self.options.selected});that.triggerEvent('select',{ids:[]});}}).appendTo(that.$bar);}}
|
||
|
|
that.$body=Ox.List({construct:constructItem,disableHorizontalScrolling:self.options.disableHorizontalScrolling,draggable:self.options.draggable,id:self.options.id,itemHeight:16,items:self.options.items,itemWidth:getItemWidth(),format:self.format,keys:Ox.unique((self.hasItemsArray?self.options.columns:self.visibleColumns).map(function(column){return column.id;}).concat(self.options.unique).concat(self.options.keys)),map:self.map,max:self.options.max,min:self.options.min,orientation:'vertical',pageLength:self.options.pageLength,paste:self.options.paste,query:self.options.query,selectAsYouType:self.options.selectAsYouType,selected:self.options.selected,sort:self.options.sort,sortable:self.options.sortable,sums:self.options.sums,type:'text',unique:self.options.unique}).addClass('OxBody').css({top:(self.options.columnsVisible?16:0)+'px',overflowY:(self.options.scrollbarVisible?'scroll':'hidden')}).on({scroll:function(){var scrollLeft=$(this).scrollLeft();if(scrollLeft!=self.scrollLeft){self.scrollLeft=scrollLeft;that.$head&&that.$head.scrollLeft(scrollLeft);}}}).bindEvent(function(data,event){if(event=='cancel'){Ox.Log('List','cancel edit',data);}else if(event=='edit'){that.editCell(data.id,data.key);}else if(event=='select'){self.options.selected=data.ids;updateClearButton();}
|
||
|
|
that.triggerEvent(event,data);}).appendTo(that);that.$body.$content.css({width:getItemWidth()+'px'});self.options.disableHorizontalScrolling?disableHorizontalScrolling():enableHorizontalScrolling();function addColumn(id){var column,ids,index=0;Ox.forEach(self.options.columns,function(v){if(v.visible){index++;}else if(v.id==id){column=v;return false;}});column.visible=true;self.visibleColumns.splice(index,0,column);self.columnWidths.splice(index,0,column.width);that.$head.$content.empty();constructHead();!self.hasItemsArray&&that.$body.options({keys:self.visibleColumns.map(function(column){return column.id;}).concat(self.options.keys)});that.$body.reloadPages();}
|
||
|
|
function changeColumns(data){var add,ids=[];Ox.forEach(data.value,function(id){var index=getColumnIndexById(id);if(!self.options.columns[index].visible){addColumn(id);add=true;return false;}
|
||
|
|
ids.push(id);});if(!add){Ox.forEach(self.visibleColumns,function(column){if(ids.indexOf(column.id)==-1){removeColumn(column.id);return false;}});}
|
||
|
|
triggerColumnChangeEvent();}
|
||
|
|
function clickColumn(id){Ox.Log('List','clickColumn',id);var i=getColumnIndexById(id),isSelected=self.options.sort[0].key==self.options.columns[i].id;self.options.sort=[{key:self.options.columns[i].id,operator:isSelected?(self.options.sort[0].operator=='+'?'-':'+'):self.options.columns[i].operator}];updateColumn();setTimeout(function(){that.$body.options({sort:self.options.sort});that.gainFocus().triggerEvent('sort',{key:self.options.sort[0].key,operator:self.options.sort[0].operator});},10);}
|
||
|
|
function constructHead(){var pos;self.$heads=[];self.$titles=[];self.$titleImages=[];self.$orderImages=[];self.visibleColumns.forEach(function(column,i){var $resize;self.$heads[i]=Ox.Element().addClass('OxHeadCell '+getColumnClassName(column.id)).css({width:self.columnWidths[i]-5+'px'}).appendTo(that.$head.$content);if(column.operator){self.$heads[i].bindEvent({anyclick:function(){clickColumn(column.id);}});}
|
||
|
|
if(self.options.columnsMovable){self.$heads[i].bindEvent({dragstart:function(data){dragstartColumn(column.id,data);},drag:function(data){dragColumn(column.id,data);},dragpause:function(data){dragpauseColumn(column.id,data);},dragend:function(data){dragendColumn(column.id,data);}});}
|
||
|
|
self.$titles[i]=Ox.Element().addClass('OxTitle').css({width:self.columnWidths[i]-9+'px',textAlign:column.align}).appendTo(self.$heads[i]);if(column.titleImage){self.$titleImages[i]=$('<img>').attr({src:Ox.UI.getImageURL('symbol'+Ox.toTitleCase(column.titleImage))}).appendTo(self.$titles[i]);}else{self.$titles[i].html(column.title);}
|
||
|
|
if(column.operator){self.$orderImages[i]=$('<img>').attr({src:Ox.UI.getImageURL('symbol'+(column.operator=='+'?'Up':'Down'),'selected')}).addClass('OxOrder').css({marginTop:(column.operator=='+'?3:2)+'px'}).click(function(){$(this).parent().trigger('click');}).appendTo(self.$heads[i]);}
|
||
|
|
$resize=Ox.Element().addClass('OxResize').appendTo(that.$head.$content);$('<div>').appendTo($resize);$('<div>').addClass('OxCenter').appendTo($resize);$('<div>').appendTo($resize);if(self.options.columnsResizable&&column.resizable!==false){$resize.addClass('OxResizable').bindEvent({doubleclick:function(data){resetColumn(column.id,data);},dragstart:function(data){dragstartResize(column.id,data);},drag:function(data){dragResize(column.id,data);},dragend:function(data){dragendResize(column.id,data);}});}});that.$head.$content.css({width:(Ox.sum(self.columnWidths)+2)+'px'});pos=getColumnPositionById(self.options.columns[self.selectedColumn].id);if(pos>-1){toggleSelected(self.options.columns[self.selectedColumn].id);self.$titles[pos].css({width:(self.options.columns[self.selectedColumn].width-25)+'px'});}}
|
||
|
|
function constructItem(data){var $item=$('<div>').addClass('OxTarget').css({width:getItemWidth(true)+'px'});self.visibleColumns.forEach(function(v,i){var clickable=Ox.isBoolean(v.clickable)?v.clickable:v.clickable(data),editable=Ox.isBoolean(v.editable)?v.editable:v.editable(data),value=v.id in data?formatValue(v.id,data[v.id],data):'',$cell;if(v.tooltip){$cell=Ox.Element({tooltip:function(){return self.options.selected.indexOf(data[self.options.unique])>-1?(Ox.isString(v.tooltip)?v.tooltip:v.tooltip(data)):'';}});}else if(self.options.droppable){$cell=Ox.Element();}else{$cell=$('<div>');}
|
||
|
|
$cell.addClass('OxCell '+getColumnClassName(v.id)
|
||
|
|
+(clickable?' OxClickable':'')
|
||
|
|
+(editable?' OxEditable':'')).css({width:(self.columnWidths[i]-(self.options.columnsVisible?9:8))+'px',borderRightWidth:(self.options.columnsVisible?1:0)+'px',textAlign:v.align})
|
||
|
|
[Ox.isString(value)?'html':'append'](value).appendTo($item);});return $item;}
|
||
|
|
function disableHorizontalScrolling(){that.$body.options({disableHorizontalScrolling:true}).css({overflowX:'hidden'});that.unbindEvent('key_left').unbindEvent('key_right');}
|
||
|
|
function dragstartColumn(id,e){Ox.$body.addClass('OxDragging');self.drag={columnOffsets:getColumnOffsets(),listOffset:that.offset().left-that.$body.scrollLeft(),startPos:getColumnPositionById(id)}
|
||
|
|
self.drag.stopPos=self.drag.startPos;$('.'+getColumnClassName(id)).css({opacity:0.5});self.drag.startPos>0&&self.$heads[self.drag.startPos].prev().children().eq(2).css({opacity:0.5});self.$heads[self.drag.startPos].next().children().eq(0).css({opacity:0.5});self.$heads[self.drag.startPos].addClass('OxDrag').css({cursor:'ew-resize'});}
|
||
|
|
function dragColumn(id,e){var listLeft=that.offset().left,listRight=listLeft+that.width(),pos=self.drag.stopPos;Ox.forEach(self.drag.columnOffsets,function(offset,i){var x=self.drag.listOffset+offset+self.columnWidths[i]/2;if(i<self.drag.startPos&&e.clientX<x){self.drag.stopPos=i;return false;}else if(i>self.drag.startPos&&e.clientX>x){self.drag.stopPos=i;}});if(self.drag.stopPos!=pos){moveColumn(id,self.drag.stopPos);self.drag.columnOffsets=getColumnOffsets();self.drag.startPos=self.drag.stopPos;var left=self.drag.columnOffsets[self.drag.startPos],right=left+self.columnWidths[self.drag.startPos];if(left<that.$body.scrollLeft()||right>that.width()){that.$body.scrollLeft(left<that.$body.scrollLeft()?left:right-that.width());self.drag.listOffset=that.offset().left-that.$body.scrollLeft();}}
|
||
|
|
if(e.clientX<listLeft+16||e.clientX>listRight-16){if(!self.scrollInterval){self.scrollInterval=setInterval(function(){that.$body.scrollLeft(that.$body.scrollLeft()+(e.clientX<listLeft+16?-16:16));self.drag.listOffset=that.offset().left-that.$body.scrollLeft();},100);}}else if(self.scrollInterval){clearInterval(self.scrollInterval);self.scrollInterval=0;}}
|
||
|
|
function dragpauseColumn(id,e){}
|
||
|
|
function dragendColumn(id,e){var column=self.visibleColumns.splice(self.drag.stopPos,1)[0],width=self.columnWidths.splice(self.drag.stopPos,1)[0];Ox.$body.removeClass('OxDragging');self.visibleColumns.splice(self.drag.stopPos,0,column);self.columnWidths.splice(self.drag.stopPos,0,width);that.$head.$content.empty();constructHead();$('.'+getColumnClassName(id)).css({opacity:1});self.$heads[self.drag.stopPos].removeClass('OxDrag').css({cursor:'default'});that.$body.clearCache();triggerColumnChangeEvent();}
|
||
|
|
function dragstartResize(id,e){var pos=getColumnPositionById(id);Ox.$body.addClass('OxDragging');self.drag={startWidth:self.columnWidths[pos]};}
|
||
|
|
function dragResize(id,e){var width=Ox.limit(self.drag.startWidth+e.clientDX,self.options.columnWidth[0],self.options.columnWidth[1]);resizeColumn(id,width);}
|
||
|
|
function dragendResize(id,e){var pos=getColumnPositionById(id);Ox.$body.removeClass('OxDragging');that.triggerEvent('columnresize',{id:id,width:self.columnWidths[pos]});}
|
||
|
|
function enableHorizontalScrolling(){that.$body.options({disableHorizontalScrolling:false}).css({overflowX:'auto'});that.bindEvent({key_left:function(){that.$body.animate({scrollLeft:that.$body[0].scrollLeft-that.$body.width()},250);},key_right:function(){that.$body.animate({scrollLeft:that.$body[0].scrollLeft+that.$body.width()},250);}});}
|
||
|
|
function formatValue(key,value,data){var format=self.format[key];if(value===null){value='';}else if(format){if(Ox.isObject(format)){value=(/^color/.test(format.type.toLowerCase())?Ox.Theme:Ox)['format'+Ox.toTitleCase(format.type)].apply(this,[value].concat(format.args||[]));}else{value=format(value,data);}}else if(Ox.isArray(value)){value=value.join(', ');}
|
||
|
|
return value;}
|
||
|
|
function getCell(id,key){var $item=getItem(id);key=key||'';return $($item.find('.OxCell.'+getColumnClassName(key))[0]);}
|
||
|
|
function getColumnClassName(id){return'OxColumn'+id[0].toUpperCase()+id.slice(1);}
|
||
|
|
function getColumnOffsets(){return self.visibleColumns.map(function(column,i){return Ox.sum(self.visibleColumns.map(function(column_,i_){return i_<i?self.columnWidths[i_]:0;}));});}
|
||
|
|
function getColumnIndexById(id){return Ox.getIndexById(self.options.columns,id);}
|
||
|
|
function getColumnPositionById(id){return Ox.getIndexById(self.visibleColumns,id);}
|
||
|
|
function getItem(id){var $item=null;that.find('.OxItem').each(function(){var $this=$(this);if($this.data('id')==id){$item=$this;return false;}});return $item;}
|
||
|
|
function getItemWidth(cached){if(!cached){self.cachedWidth=that.width();}else if((!self.cachedWidth&&self.cachedWidth!==0)||self.cachedWidthTime<+new Date()-5000){self.cachedWidth=that.width();self.cachedWidthTime=+new Date();}
|
||
|
|
return Math.max(Ox.sum(self.columnWidths),self.cachedWidth-(self.options.scrollbarVisible?Ox.UI.SCROLLBAR_SIZE:0));}
|
||
|
|
function moveColumn(id,pos){var startPos=getColumnPositionById(id),stopPos=pos,startSelector='.'+getColumnClassName(id),stopSelector='.'+getColumnClassName(self.visibleColumns[stopPos].id),insert=startPos<stopPos?'insertAfter':'insertBefore',$column=$('.OxHeadCell'+startSelector),$resize=$column.next();$column.detach()[insert](insert=='insertAfter'?$('.OxHeadCell'+stopSelector).next():$('.OxHeadCell'+stopSelector));$resize.detach().insertAfter($column);that.$body.find('.OxItem').each(function(){var $this=$(this);$this.children(startSelector).detach()[insert]($this.children(stopSelector));});var $head=self.$heads.splice(startPos,1)[0],columnWidth=self.columnWidths.splice(startPos,1)[0],visibleColumn=self.visibleColumns.splice(startPos,1)[0];self.$heads.splice(stopPos,0,$head);self.columnWidths.splice(stopPos,0,columnWidth);self.visibleColumns.splice(stopPos,0,visibleColumn);var pos=getColumnPositionById(self.options.columns[self.selectedColumn].id);if(pos>-1){that.find('.OxResize .OxSelected').removeClass('OxSelected');pos>0&&self.$heads[pos].prev().children().eq(2).addClass('OxSelected');self.$heads[pos].next().children().eq(0).addClass('OxSelected');if(pos==stopPos){pos>0&&self.$heads[pos].prev().children().eq(2).css({opacity:0.5});self.$heads[pos].next().children().eq(0).css({opacity:0.5});}}}
|
||
|
|
function removeColumn(id){var index=getColumnIndexById(id),itemWidth,position=getColumnPositionById(id),selector='.'+getColumnClassName(id),$column=$('.OxHeadCell '+selector),$order=$column.next(),$resize=$order.next();self.options.columns[index].visible=false;self.visibleColumns.splice(position,1);self.columnWidths.splice(position,1);that.$head.$content.empty();constructHead();itemWidth=getItemWidth();that.$body.find('.OxItem').each(function(){var $this=$(this);$this.children(selector).remove();$this.css({width:itemWidth+'px'});});that.$body.$content.css({width:itemWidth+'px'});!self.hasItemsArray&&that.$body.options({keys:self.visibleColumns.map(function(column){return column.id;}).concat(self.options.keys)});}
|
||
|
|
function resetColumn(id){var width=self.defaultColumnWidths[getColumnIndexById(id)];resizeColumn(id,width);that.triggerEvent('columnresize',{id:id,width:width});}
|
||
|
|
function resizeColumn(id,width){var i=getColumnIndexById(id),pos=getColumnPositionById(id);self.options.columns[i].width=width;self.columnWidths[pos]=width;if(self.options.columnsVisible){that.$head.$content.css({width:(Ox.sum(self.columnWidths)+2)+'px'});self.$heads[pos].css({width:width-5+'px'});self.$titles[pos].css({width:width-9-(i==self.selectedColumn?16:0)+'px'});}
|
||
|
|
that.find('.OxCell.'+getColumnClassName(self.options.columns[i].id)).css({width:width-(self.options.columnsVisible?9:8)+'px'});setWidth();}
|
||
|
|
function setWidth(){var width=getItemWidth();that.$body.find('.OxItem').css({width:width+'px'});that.$body.$content.css({width:width+'px'});}
|
||
|
|
function toggleSelected(id){var isSelected,pos=getColumnPositionById(id);if(pos>-1){updateOrder(id);pos>0&&self.$heads[pos].prev().children().eq(2).toggleClass('OxSelected');self.$heads[pos].toggleClass('OxSelected');self.$heads[pos].next().children().eq(0).toggleClass('OxSelected');isSelected=self.$heads[pos].hasClass('OxSelected');self.$titles[pos].css({width:self.$titles[pos].width()
|
||
|
|
+(isSelected?-16:16)
|
||
|
|
+'px'});if(self.visibleColumns[pos].titleImage){self.$titleImages[pos].attr({src:Ox.UI.getImageURL('symbol'+Ox.toTitleCase(self.visibleColumns[pos].titleImage),isSelected?'selected':'')});}}}
|
||
|
|
function triggerColumnChangeEvent(){that.triggerEvent('columnchange',{ids:self.visibleColumns.map(function(column){return column.id;})});}
|
||
|
|
function updateClearButton(){if(self.options.clearButton){self.$clearButton[self.options.selected.length?'show':'hide']();}}
|
||
|
|
function updateColumn(){var columnId=self.options.columns[self.selectedColumn].id,isSelected=columnId==self.options.sort[0].key;if(self.options.columnsVisible){if(isSelected){updateOrder(columnId);}else{toggleSelected(columnId);self.selectedColumn=getColumnIndexById(self.options.sort[0].key);toggleSelected(self.options.columns[self.selectedColumn].id);}}}
|
||
|
|
function updateImages(){that.$body.find('img').each(function(i,element){var $element=$(element),data=Ox.UI.getImageData($element.attr('src'));if(data&&data.color=='selected'){$element.attr({src:Ox.UI.getImageURL(data.name,'default')});}});that.$body.find('.OxSelected img').each(function(i,element){var $element=$(element),data=Ox.UI.getImageData($element.attr('src'));if(data&&data.color=='default'){$element.attr({src:Ox.UI.getImageURL(data.name,'selected')});}});}
|
||
|
|
function updateOrder(id){var operator=self.options.sort[0].operator,pos=getColumnPositionById(id);if(pos>-1){self.$orderImages[pos].attr({src:Ox.UI.getImageURL('symbol'+(operator=='+'?'Up':'Down'),'selected')}).css({marginTop:(operator=='+'?3:2)+'px'});}}
|
||
|
|
that.addColumn=function(id){addColumn(id);};that.addItems=function(items){that.$body.addItems(items);};that.api=that.$body.options('items');that.closePreview=function(){that.$body.closePreview();return that;};that.editCell=function(id,key,select){Ox.Log('List','editCell',id,key)
|
||
|
|
var $item=getItem(id),$cell=getCell(id,key),$input,html=$cell.html(),clickableCells=$item.find('.OxClickable').removeClass('OxClickable'),editableCells=$item.find('.OxEditable').removeClass('OxEditable'),index=getColumnIndexById(key),column=self.options.columns[index],width=column.width-self.options.columnsVisible;$cell.empty().addClass('OxEdit').css({width:width+'px'});$input=Ox.Input({autovalidate:column.input?column.input.autovalidate:null,style:'square',textAlign:column.align||'left',value:column.unformat?column.unformat(html):html,width:width-2}).css({padding:'0 1px'}).on({mousedown:function(e){e.stopPropagation();}}).bindEvent({blur:submit,cancel:submit,submit:submit}).appendTo($cell);setTimeout(function(){$input.focusInput(select);});function submit(){var value=$input.value();$input.remove();$cell.removeClass('OxEdit').css({width:(width-8)+'px'}).html(value);setTimeout(function(){clickableCells.addClass('OxClickable');editableCells.addClass('OxEditable');},250);that.triggerEvent('submit',{id:id,key:key,value:value});}};that.gainFocus=function(){that.$body.gainFocus();return that;};that.getColumnWidth=function(id){var pos=getColumnPositionById(id);return self.columnWidths[pos];};that.getPasteIndex=function(){return that.$body.getPasteIndex();};that.getVisibleColumns=function(){return self.visibleColumns.map(function(column){return column.id;});};that.hasFocus=function(){return that.$body.hasFocus();};that.invertSelection=function(){that.$body.invertSelection();return that;};that.loseFocus=function(){that.$body.loseFocus();return that;};that.openPreview=function(){that.$body.openPreview();return that;};that.reloadList=function(stayAtPosition){that.$body.reloadList(stayAtPosition);return that;};that.removeColumn=function(id){removeColumn(id);return that;};that.selectAll=function(){that.$body.selectAll();return that;};that.selectPosition=function(pos){that.$body.selectPosition(pos);return that;};that.selectSelected=function(offset){that.$body.selectSelected(offset);return that;};that.setColumnTitle=function(id,title){var index=getColumnIndexById(id);self.options.columns[index].title=title;if(self.options.columns[index].visible){self.$titles[getColumnPositionById(id)].html(title);}
|
||
|
|
return that;};that.setColumnWidth=that.resizeColumn=function(id,width){resizeColumn(id,width);return that;};that.setVisibleColumns=function(ids){Ox.forEach(ids,function(id){var index=getColumnIndexById(id);if(!self.options.columns[index].visible){addColumn(id);}});Ox.forEach(self.visibleColumns,function(column){if(ids.indexOf(column.id)==-1){removeColumn(column.id);}});triggerColumnChangeEvent();return that;};that.size=function(){setWidth();that.$body.size();return that;};that.sortList=function(key,operator){Ox.Log('List','$$$$ DEPRECATED $$$$')
|
||
|
|
var isSelected=key==self.options.sort[0].key;self.options.sort=[{key:key,operator:operator,map:self.options.columns[self.selectedColumn].sort}];if(self.options.columnsVisible){if(isSelected){updateOrder(self.options.columns[self.selectedColumn].id);}else{toggleSelected(self.options.columns[self.selectedColumn].id);self.selectedColumn=getColumnIndexById(key);toggleSelected(self.options.columns[self.selectedColumn].id);}}
|
||
|
|
setTimeout(function(){that.$body.options({sort:self.options.sort});},10);return that;};that.value=function(){var $cell,args=Ox.slice(arguments),id=args.shift(),sort=false;if(arguments.length==1){return that.$body.value(id);}else if(arguments.length==2&&Ox.isString(arguments[1])){return that.$body.value(id,arguments[1]);}else{that.$body.value(id,Ox.makeObject(args));Ox.forEach(Ox.makeObject(args),function(value,key){var changed=false;if(key==self.options.unique){self.options.selected=self.options.selected.map(function(id_){return id_==id?value:id_});id=value;}
|
||
|
|
$cell=getItem(id)&&getCell(id,key);if($cell&&!$cell.is('.OxEdit')){var value=formatValue(key,value,that.$body.value(id));if(value!=$cell.html()){$cell.html(value);changed=true;}}
|
||
|
|
if(changed&&!self.options.sortable&&key==self.options.sort[0].key){sort=true;}});sort&&that.$body.sort();return that;}};return that;};'use strict';Ox.TreeList=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({data:null,expanded:false,icon:null,items:[],max:1,min:0,selected:[],width:'auto'}).options(options||{}).update({data:function(){self.options.items=getItems();self.$list.options({items:parseItems()});},selected:function(){selectItem({ids:self.options.selected});self.$list.scrollToSelection();},width:function(){}});if(self.options.data){self.options.items=getItems();}
|
||
|
|
that.setElement(self.$list=Ox.List({_tree:true,construct:constructItem,itemHeight:16,items:parseItems(),itemWidth:self.options.width,keys:['expanded','id','items','level','title'],max:self.options.max,min:self.options.min,unique:'id'}).addClass('OxTableList OxTreeList').css({width:self.options.width+'px',overflowY:'scroll'}).bindEvent(function(data,event){if(event=='anyclick'){clickItem(data);}else if(event=='toggle'){toggleItems(data);}
|
||
|
|
that.triggerEvent(event,data);}));self.options.selected.length&&selectItem({ids:self.options.selected});function clickItem(e){var $target=$(e.target),$item,id,item;if($target.is('.OxToggle')){$item=$target.parent().parent();id=$item.data('id');item=getItemById(id);toggleItem(item,!item.expanded);}}
|
||
|
|
function constructItem(data){var $item=$('<div>').css({width:self.options.width=='auto'?'100%':self.options.width-Ox.UI.SCROLLBAR_SIZE+'px'}),$cell=$('<div>').addClass('OxCell').css({width:'8px'}),$icon=data.id?getIcon(data.id,data.expanded||(data.items?false:null)):null,padding=data.level*16-8;if(data.level){$('<div>').addClass('OxCell OxTarget').css({width:padding+'px'}).appendTo($item);}
|
||
|
|
$cell.appendTo($item);$icon&&$icon.addClass(data.items?'OxToggle':'OxTarget').appendTo($cell);$('<div>').addClass('OxCell OxTarget').css({width:self.options.width-padding-32-Ox.UI.SCROLLBAR_SIZE+'px'}).html(data.title||'').appendTo($item);return $item;}
|
||
|
|
function getIcon(id,expanded){var isFunction=Ox.isFunction(self.options.icon),$icon=isFunction?self.options.icon(id,expanded):null;if(!$icon){if(expanded===null){if(!$icon&&self.options.icon&&!isFunction){$icon=$('<img>').attr({src:self.options.icon});}}else{$icon=$('<img>').attr({src:Ox.UI.getImageURL('symbol'+(expanded?'Down':'Right'))});}}
|
||
|
|
return $icon;}
|
||
|
|
function getItemById(id,items,level){var ret=null;items=items||self.options.items;level=level||0;Ox.forEach(items,function(item){if(item.id==id){ret=Ox.extend(item,{level:level});return false;}
|
||
|
|
if(item.items){ret=getItemById(id,item.items,level+1);if(ret){return false;}}});return ret;}
|
||
|
|
function getItems(){var items=[];Ox.sort(Object.keys(self.options.data)).forEach(function(key){items.push(parseData(key,self.options.data[key]));});return items;}
|
||
|
|
function getParent(id,items){var ret;Ox.forEach(items,function(item){if(item.items){if(Ox.getObjectById(item.items,id)){ret=item.id;}else{ret=getParent(id,item.items);}
|
||
|
|
if(ret){return false;}}});return ret;}
|
||
|
|
function parseData(key,value){var ret={id:Ox.uid().toString(),title:Ox.encodeHTMLEntities(key.toString())+': '},type=Ox.typeOf(value);if(type=='array'||type=='object'){ret.expanded=self.options.expanded;ret.title+=Ox.toTitleCase(type)
|
||
|
|
+' <span class="OxLight">['+Ox.len(value)+']</span>';ret.items=type=='array'?value.map(function(v,i){return parseData(i,v);}):Ox.sort(Object.keys(value)).map(function(k){return parseData(k,value[k]);});}else{ret.title+=(type=='function'?value.toString().split('{')[0]:Ox.encodeHTMLEntities(JSON.stringify(value)).replace(/(^"|"$)/g,'<span class="OxLight">"</span>'));}
|
||
|
|
return ret;}
|
||
|
|
function parseItems(items,level){var ret=[];items=items||self.options.items;level=level||0;items.forEach(function(item,i){if(item.items&&self.options.expanded){item.expanded=true;}
|
||
|
|
var item_=Ox.extend({level:level},item,item.items?{items:item.expanded?parseItems(item.items,level+1):[]}:{});ret.push(item_);if(item.items){ret=ret.concat(item_.items);}});return ret;}
|
||
|
|
function selectItem(data){var id=data.ids[0],parent=id,parents=[];while(parent=getParent(parent,self.options.items)){parents.push(parent);}
|
||
|
|
parents=parents.reverse();toggleItems({expanded:true,ids:parents});self.$list.options({selected:data.ids})}
|
||
|
|
function toggleItem(item,expanded){var $img,pos;item.expanded=expanded;that.find('.OxItem').each(function(){var $item=$(this);if($item.data('id')==item.id){$img=$item.find('.OxToggle');pos=$item.data('position');return false;}});$img.attr({src:getIcon(item.id,expanded).attr('src')});if(expanded){self.$list.addItems(pos+1,parseItems(item.items,item.level+1));}else{self.$list.removeItems(pos+1,parseItems(item.items,item.level+1).length);}}
|
||
|
|
function toggleItems(data){data.ids.forEach(function(id,i){var item=getItemById(id);if(item.items&&data.expanded!=!!item.expanded){toggleItem(item,data.expanded);}});}
|
||
|
|
that.gainFocus=function(){self.$list.gainFocus();return that;};that.hasFocus=function(){return self.$list.hasFocus();};that.loseFocus=function(){self.$list.loseFocus();return that;};return that;};'use strict';Ox.MainMenu=function(options,self){self=self||{};var that=Ox.Bar({},self).defaults({extras:[],menus:[],size:'medium'}).options(options||{}).addClass('OxMainMenu Ox'+Ox.toTitleCase(self.options.size)).on({click:click,mousemove:mousemove});self.focused=false;self.selected=-1;that.menus=[];that.titles=[];that.layer=$('<div>').addClass('OxLayer');self.options.menus.forEach(function(menu,position){addMenu(menu,position);});if(self.options.extras.length){that.extras=$('<div>').addClass('OxExtras').appendTo(that);self.options.extras.forEach(function(extra){extra&&extra.appendTo(that.extras);});}
|
||
|
|
function addMenu(menu,position){that.titles[position]=$('<div>').addClass('OxTitle').html(menu.title).data({position:position});if(position==0){if(that.titles.length==1){that.titles[position].appendTo(that);}else{that.titles[position].insertBefore(that.titles[1]);}}else{that.titles[position].insertAfter(that.titles[position-1])}
|
||
|
|
that.menus[position]=Ox.Menu(Ox.extend(menu,{element:that.titles[position],mainmenu:that,size:self.options.size})).bindEvent({hide:onHideMenu});}
|
||
|
|
function click(event){var $element=getElement(event),position=typeof $element.data('position')!='undefined'?$element.data('position'):-1;clickTitle(position);}
|
||
|
|
function clickTitle(position){var selected=self.selected;if(self.selected>-1){that.menus[self.selected].hideMenu();}
|
||
|
|
if(position>-1){if(position!=selected){self.focused=true;self.selected=position;that.titles[self.selected].addClass('OxSelected');that.menus[self.selected].showMenu();}}}
|
||
|
|
function getElement(event){var $element=$(event.target);return $element.is('img')?$element.parent():$element;}
|
||
|
|
function mousemove(event){var $element=getElement(event),focused,position=typeof $element.data('position')!='undefined'?$element.data('position'):-1;if(self.focused&&position!=self.selected){if(position>-1){clickTitle(position);}else{focused=self.focused;that.menus[self.selected].hideMenu();self.focused=focused;}}}
|
||
|
|
function onHideMenu(){if(self.selected>-1){that.titles[self.selected].removeClass('OxSelected');self.selected=-1;}
|
||
|
|
self.focused=false;}
|
||
|
|
function removeMenu(position){that.titles[position].remove();that.menus[position].remove();}
|
||
|
|
that.addMenuAfter=function(id){};that.addMenuBefore=function(id){};that.checkItem=function(id){var ids=id.split('_'),item=that.getItem(id);if(item){if(item.options('group')){item.options('menu').checkItem(ids[ids.length-1]);}else{item.options({checked:true});}}
|
||
|
|
return that;};that.disableItem=function(id){var item=that.getItem(id);item&&item.options({disabled:true});return that;};that.enableItem=function(id){var item=that.getItem(id);item&&item.options({disabled:false});return that;};that.getItem=function(id){var ids=id.split('_'),item;if(ids.length==1){Ox.forEach(that.menus,function(menu){item=menu.getItem(id);if(item){return false;}});}else{item=that.getMenu(ids.shift()).getItem(ids.join('_'));}
|
||
|
|
Ox.Log('Menu','getItem',id,item);return item;};that.getMenu=function(id){var ids=id.split('_'),menu;if(ids.length==1){Ox.forEach(that.menus,function(v){if(v.options('id')==id){menu=v;return false;}});}else{menu=that.getMenu(ids.shift()).getSubmenu(ids.join('_'));}
|
||
|
|
return menu;};that.highlightMenu=function(id){var position=Ox.getIndexById(self.options.menus,id);self.highlightTimeout&&clearTimeout(self.highlightTimeout);that.titles[position].addClass('OxHighlight');self.highlightTimeout=setTimeout(function(){that.titles[position].removeClass('OxHighlight');delete self.highlightTimeout;},500);};that.isSelected=function(){return self.selected>-1;};that.removeMenu=function(){};that.replaceMenu=function(id,menu){var position=Ox.getIndexById(self.options.menus,id);self.options.menus[position]=menu;removeMenu(position);addMenu(menu,position);};that.selectNextMenu=function(){if(self.selected<self.options.menus.length-1){clickTitle(self.selected+1);}
|
||
|
|
return that;};that.selectPreviousMenu=function(){if(self.selected){clickTitle(self.selected-1);}
|
||
|
|
return that;};that.setItemKeyboard=function(id,keyboard){var item=that.getItem(id);item&&item.options({keyboard:keyboard});return that;};that.setItemTitle=function(id,title){var item=that.getItem(id);item&&item.options({title:title});return that;};that.uncheckItem=function(id){var item=that.getItem(id);item&&item.options({checked:false});return that;};return that;};'use strict';Ox.Menu=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({edge:'bottom',element:null,id:'',items:[],mainmenu:null,maxWidth:0,offset:{left:0,top:0},parent:null,selected:-1,size:'medium'}).options(options||{}).update({items:function(){renderItems(self.options.items);},selected:function(){that.$content.find('.OxSelected').removeClass('OxSelected');selectItem(self.options.selected);}}).addClass('OxMenu Ox'+Ox.toTitleCase(self.options.edge)+' Ox'+Ox.toTitleCase(self.options.size)).on({mouseenter:mouseenter,mouseleave:mouseleave,mousemove:mousemove,mouseup:mouseup,mousewheel:mousewheel}).bindEvent({key_up:selectPreviousItem,key_down:selectNextItem,key_left:selectSupermenu,key_right:selectSubmenu,key_escape:hideMenu,key_enter:clickSelectedItem});self.itemHeight=self.options.size=='small'?12:self.options.size=='medium'?16:20;self.scrollSpeed=1;that.items=[];that.submenus={};that.$scrollbars=[];that.$top=$('<div>').addClass('OxTop').appendTo(that);that.$scrollbars.up=renderScrollbar('up').appendTo(that);that.$container=$('<div>').addClass('OxContainer').appendTo(that);that.$content=$('<table>').addClass('OxContent').appendTo(that.$container);renderItems(self.options.items);that.$scrollbars.down=renderScrollbar('down').appendTo(that);that.$bottom=$('<div>').addClass('OxBottom').appendTo(that);function clickItem(position,files){var item=that.items[position],group=item.options('group'),menu=self.options.mainmenu||self.options.parent||that,offset,toggled;that.hideMenu();if(!item.options('items').length){if(self.options.parent){self.options.parent.hideMenu(true).triggerEvent('click',Ox.extend({id:item.options('id'),title:parseTitle(item.options('title')[0])},files?{files:files}:{}));}
|
||
|
|
if(item.options('checked')!==null){if(group){offset=self.optionGroupOffset[group];toggled=self.optionGroup[group].toggle(position-offset);if(toggled.length){toggled.forEach(function(pos){that.items[pos+offset].toggleChecked();});menu.triggerEvent('change',{id:item.options('group'),checked:self.optionGroup[group].checked().map(function(pos){return{id:that.items[pos+offset].options('id'),title:Ox.isString(that.items[pos+offset].options('title')[0])?parseTitle(that.items[pos+offset].options('title')[0]):''};})});}}else{item.toggleChecked();menu.triggerEvent('change',{checked:item.options('checked'),id:item.options('id'),title:Ox.isString(item.options('title')[0])?parseTitle(item.options('title')[0]):''});}}else{if(!item.options('file')||files){menu.triggerEvent('click',Ox.extend({id:item.options('id'),title:parseTitle(item.options('title')[0])},files?{files:files}:{}));}}
|
||
|
|
if(item.options('title').length==2){item.toggleTitle();}}}
|
||
|
|
function clickLayer(){that.hideMenu();}
|
||
|
|
function clickSelectedItem(){if(self.options.selected>-1){clickItem(self.options.selected);}}
|
||
|
|
function getElement(id){return $('#'+Ox.toCamelCase(options.id+'/'+id));}
|
||
|
|
function getItemPositionById(id){var position;Ox.forEach(that.items,function(item,i){if(item.options('id')==id){position=i;return false;}});return position;}
|
||
|
|
function hideMenu(){that.hideMenu();}
|
||
|
|
function isFirstEnabledItem(){var ret=true;Ox.forEach(that.items,function(item,i){if(i<self.options.selected&&!item.options('disabled')){ret=false;return false;}});return ret;}
|
||
|
|
function isLastEnabledItem(){var ret=true;Ox.forEach(that.items,function(item,i){if(i>self.options.selected&&!item.options('disabled')){ret=false;return false;}});return ret;}
|
||
|
|
function mouseenter(){that.gainFocus();}
|
||
|
|
function mouseleave(){if(self.options.selected>-1&&!that.items[self.options.selected].options('items').length){selectItem(-1);}}
|
||
|
|
function mousemove(event){var item,position,$target=$(event.target),$parent=$target.parent(),$grandparent=$parent.parent();if($parent.is('.OxCell')){$target=$parent;$parent=$target.parent();}else if($grandparent.is('.OxCell')){$target=$grandparent;$parent=$target.parent();}
|
||
|
|
if($target.is('.OxCell')){position=$parent.data('position');item=that.items[position];if(position!=self.options.selected){if(!item.options('disabled')){selectItem(position);}else{mouseleave();}}}else{mouseleave();}}
|
||
|
|
function mouseup(event){var item,position,$target=$(event.target),$parent=$target.parent();if($parent.is('.OxCell')){$target=$parent;$parent=$target.parent();}
|
||
|
|
if($target.is('.OxCell')){position=$parent.data('position');item=that.items[position];if(!item.options('disabled')){clickItem(position);}else{that.hideMenu();}}else{that.hideMenu();}}
|
||
|
|
function mousewheel(e,delta,deltaX,deltaY){var $scrollbar;if(deltaY&&!$(e.target).is('.OxScrollbar')){$scrollbar=that.$scrollbars[deltaY<0?'down':'up'];Ox.loop(0,Math.abs(deltaY),function(){if($scrollbar.is(':visible')){$scrollbar.trigger('mouseenter').trigger('mouseleave');}});}}
|
||
|
|
function parseTitle(title){return Ox.decodeHTMLEntities(Ox.stripTags(title));}
|
||
|
|
function renderItems(items){var offset=0;that.$content.empty();scrollMenuUp();self.optionGroup={};self.optionGroupOffset={};items.forEach(function(item,i){if(item.group&&item.items){items[i]=item.items.map(function(v){return Ox.extend(v,{group:item.group});});self.optionGroup[item.group]=new Ox.OptionGroup(items[i].filter(function(v){return'id'in v;}),'min'in item?item.min:1,'max'in item?item.max:1);self.optionGroupOffset[item.group]=offset;offset+=items[i].length;}else if('id'in item){offset+=1;}});items=Ox.flatten(items);that.items=[];items.forEach(function(item){var position;if('id'in item){position=that.items.length;that.items.push(Ox.MenuItem(Ox.extend(Ox.clone(item),{maxWidth:self.options.maxWidth,menu:that,position:position})).data('position',position).appendTo(that.$content));if(item.items){that.submenus[item.id]=Ox.Menu({edge:'right',element:that.items[position],id:Ox.toCamelCase(self.options.id+'/'+item.id),items:item.items,mainmenu:self.options.mainmenu,offset:{left:0,top:-4},parent:that,size:self.options.size});}}else{that.$content.append(renderSpace());that.$content.append(renderLine());that.$content.append(renderSpace());}});if(!that.is(':hidden')){that.hideMenu();that.showMenu();}}
|
||
|
|
function renderLine(){return $('<tr>').append($('<td>').addClass('OxLine').attr({colspan:5}));}
|
||
|
|
function renderScrollbar(direction){var interval,speed=direction=='up'?-1:1;return $('<div/>',{'class':'OxScrollbar Ox'+Ox.toTitleCase(direction),html:Ox.SYMBOLS['triangle_'+direction],mousedown:function(){self.scrollSpeed=2;return false;},mouseenter:function(){self.scrollSpeed=1;var $otherScrollbar=that.$scrollbars[direction=='up'?'down':'up'];$(this).addClass('OxSelected');if($otherScrollbar.is(':hidden')){$otherScrollbar.show();that.$container.height(that.$container.height()-self.itemHeight);if(direction=='down'){that.$content.css({top:-self.itemHeight+'px'});}}
|
||
|
|
scrollMenu(speed);interval=setInterval(function(){scrollMenu(speed);},100);},mouseleave:function(){self.scrollSpeed=1;$(this).removeClass('OxSelected');clearInterval(interval);},mouseup:function(){self.scrollSpeed=1;return false;}});}
|
||
|
|
function renderSpace(){return $('<tr>').append($('<td>').addClass('OxSpace').attr({colspan:5}));}
|
||
|
|
function scrollMenu(speed){var containerHeight=that.$container.height(),contentHeight=that.$content.height(),top=parseInt(that.$content.css('top'),10)||0,min=containerHeight-contentHeight+self.itemHeight,max=0;top+=speed*self.scrollSpeed*-self.itemHeight;if(top<=min){top=min;that.$scrollbars.down.hide().trigger('mouseleave');that.$container.height(containerHeight+self.itemHeight);that.items[that.items.length-1].trigger('mouseover');}else if(top>=max-self.itemHeight){top=max;that.$scrollbars.up.hide().trigger('mouseleave');that.$container.height(containerHeight+self.itemHeight);that.items[0].trigger('mouseover');}
|
||
|
|
that.$content.css({top:top+'px'});}
|
||
|
|
function scrollMenuUp(){if(that.$scrollbars.up.is(':visible')){that.$content.css({top:'0px'});that.$scrollbars.up.hide();if(that.$scrollbars.down.is(':hidden')){that.$scrollbars.down.show();}else{that.$container.height(that.$container.height()+self.itemHeight);}}}
|
||
|
|
function selectItem(position){var item;if(self.options.selected>-1){item=that.items[self.options.selected];if(item){item.removeClass('OxSelected');}}
|
||
|
|
if(position>-1){item=that.items[position];Ox.forEach(that.submenus,function(submenu,id){if(!submenu.is(':hidden')){submenu.hideMenu();return false;}});item.options('items').length&&that.submenus[item.options('id')].showMenu();item.addClass('OxSelected');that.triggerEvent('select',{id:item.options('id'),title:Ox.isString(item.options('title')[0])?parseTitle(item.options('title')[0]):''});}
|
||
|
|
self.options.selected=position;}
|
||
|
|
function selectNextItem(){var offset,selected=self.options.selected;if(!isLastEnabledItem()){if(selected==-1){scrollMenuUp();}else{that.items[selected].removeClass('OxSelected');}
|
||
|
|
do{selected++;}while(that.items[selected].options('disabled'))
|
||
|
|
selectItem(selected);offset=that.items[selected].offset().top+self.itemHeight-that.$container.offset().top-that.$container.height();if(offset>0){if(that.$scrollbars.up.is(':hidden')){that.$scrollbars.up.show();that.$container.height(that.$container.height()-self.itemHeight);offset+=self.itemHeight;}
|
||
|
|
if(selected==that.items.length-1){that.$scrollbars.down.hide();that.$container.height(that.$container.height()+self.itemHeight);}else{that.$content.css({top:((parseInt(that.$content.css('top'),10)||0)-offset)+'px'});}}}}
|
||
|
|
function selectPreviousItem(){var offset,selected=self.options.selected;if(selected>-1){if(!isFirstEnabledItem()){that.items[selected].removeClass('OxSelected');do{selected--;}while(that.items[selected].options('disabled'))
|
||
|
|
selectItem(selected);}
|
||
|
|
offset=that.items[selected].offset().top-that.$container.offset().top;if(offset<0){if(that.$scrollbars.down.is(':hidden')){that.$scrollbars.down.show();that.$container.height(that.$container.height()-self.itemHeight);}
|
||
|
|
if(selected==0){that.$scrollbars.up.hide();that.$container.height(that.$container.height()+self.itemHeight);}
|
||
|
|
that.$content.css({top:((parseInt(that.$content.css('top'),10)||0)-offset)+'px'});}}}
|
||
|
|
function selectSubmenu(){if(self.options.selected>-1){var submenu=that.submenus[that.items[self.options.selected].options('id')];if(submenu&&submenu.hasEnabledItems()){submenu.gainFocus();submenu.selectFirstItem();}else if(self.options.mainmenu){self.options.mainmenu.selectNextMenu();}}else if(self.options.mainmenu){self.options.mainmenu.selectNextMenu();}}
|
||
|
|
function selectSupermenu(){if(self.options.parent){self.options.selected>-1&&that.items[self.options.selected].trigger('mouseleave');scrollMenuUp();self.options.parent.gainFocus();}else if(self.options.mainmenu){self.options.mainmenu.selectPreviousMenu();}}
|
||
|
|
function setCSS(){var offset=self.options.element.offset(),width=self.options.element.outerWidth(),height=self.options.element.outerHeight(),menuWidth=that.width(),windowWidth=Ox.$window.width(),windowHeight=Ox.$window.height(),left=offset.left+self.options.offset.left+(self.options.edge=='bottom'?0:width),top=offset.top+self.options.offset.top+(self.options.edge=='bottom'?height:0),menuHeight=that.$content.outerHeight(),menuMaxHeight=Math.floor(Ox.$window.height()-top-16);if(self.options.edge=='bottom'&&left+menuWidth>windowWidth){left=offset.left+width-menuWidth;that.is('.OxRight')&&that.removeClass('OxRight')&&that.addClass('OxLeft');}
|
||
|
|
if(self.options.parent){if(menuHeight>menuMaxHeight){top=Ox.limit(top-menuHeight+menuMaxHeight,self.options.parent.offset().top,top);menuMaxHeight=Math.floor(windowHeight-top-16);}}
|
||
|
|
that.css({left:left+'px',top:top+'px'});if(menuHeight>menuMaxHeight){that.$container.height(menuMaxHeight-self.itemHeight-8);that.$scrollbars.down.show();}else{that.$container.height(menuHeight);}}
|
||
|
|
that.addItem=function(item,position){};that.addItemAfter=function(item,id){};that.addItemBefore=function(item,id){};that.checkItem=function(id,checked){Ox.Log('Menu','checkItem id',id)
|
||
|
|
var group,ids=Ox.isEmpty(that.submenus)?[id]:id.split('_'),item,offset,position,toggled;checked=Ox.isUndefined(checked)?true:checked;if(ids.length==1){item=that.getItem(id);group=item.options('group');if(group){offset=self.optionGroupOffset[group];position=getItemPositionById(id);if(item.options('checked')!=checked){toggled=self.optionGroup[item.options('group')].toggle(position-offset);if(toggled.length){toggled.forEach(function(pos){that.items[pos+offset].toggleChecked();});}}}else{item.options({checked:checked});}}else{that.submenus[ids.shift()].checkItem(ids.join('_'),checked);}
|
||
|
|
return that;};that.clickItem=function(position,files){clickItem(position,files);return that;};that.getItem=function(id){var ids=Ox.isEmpty(that.submenus)?[id]:id.split('_'),item;if(ids.length==1){Ox.forEach(that.items,function(v){if(v.options('id')==id){item=v;return false;}});if(!item){Ox.forEach(that.submenus,function(submenu){item=submenu.getItem(id);if(item){return false;}});}}else{item=that.submenus[ids.shift()].getItem(ids.join('_'));}
|
||
|
|
return item;};that.getSubmenu=function(id){var ids=id.split('_'),submenu;if(ids.length==1){submenu=that.submenus[id];}else{submenu=that.submenus[ids.shift()].getSubmenu(ids.join('_'));}
|
||
|
|
return submenu;}
|
||
|
|
that.hasEnabledItems=function(){var ret=false;Ox.forEach(that.items,function(item){if(!item.options('disabled')){ret=true;return false;}});return ret;};that.hideMenu=function(hideParent){if(that.is(':hidden')){return;}
|
||
|
|
Ox.forEach(that.submenus,function(submenu){if(submenu.is(':visible')){submenu.hideMenu();return false;}});selectItem(-1);scrollMenuUp();that.$scrollbars.up.is(':visible')&&that.$scrollbars.up.hide();that.$scrollbars.down.is(':visible')&&that.$scrollbars.down.hide();if(self.options.parent){self.options.parent.options({selected:-1});hideParent&&self.options.parent.hideMenu(true);}
|
||
|
|
that.$layer&&that.$layer.hide();that.hide().loseFocus().triggerEvent('hide');return that;};that.removeElement=function(){Ox.forEach(that.submenus,function(submenu){submenu.remove();});return Ox.Element.prototype.removeElement.apply(that,arguments);};that.removeItem=function(){};that.selectFirstItem=function(){selectNextItem();return that;};that.setItemKeyboard=function(id,keyboard){var item=that.getItem(id);item&&item.options({keyboard:keyboard});return that;};that.setItemTitle=function(id,title){var item=that.getItem(id);item&&item.options({title:title});return that;};that.showMenu=function(){if(!that.is(':hidden')){return;}
|
||
|
|
that.appendTo(Ox.Fullscreen.element?Ox.Fullscreen.element:Ox.$body);that.css({position:'fixed',left:'-1000px',top:'-1000px'}).show();setCSS();if(!self.options.parent){that.gainFocus();that.$layer=Ox.Layer({type:'menu'}).css({top:self.options.mainmenu?'20px':0}).on({mouseup:clickLayer}).show();}
|
||
|
|
return that;};that.toggleMenu=function(){return that.is(':hidden')?that.showMenu():that.hideMenu();};that.uncheckItem=function(id){that.checkItem(id,false);return that;};that.updatePosition=function(){setCSS();return that;};return that;};'use strict';Ox.MenuButton=function(options,self){self=self||{};var that=Ox.Element({tooltip:options.tooltip||''},self).defaults({disabled:false,id:'',items:[],maxWidth:0,overlap:'none',style:'rounded',title:'',type:'text',width:'auto'}).options(options||{}).update({items:function(){self.$menu.options({items:self.options.items});},title:function(){if(self.options.type=='text'){self.$title.html(self.options.title);}else{self.$button.options({title:self.options.title});}},width:function(){that.css({width:self.options.width-2+'px'});self.$title.css({width:self.options.width-24+'px'});}}).addClass('OxSelect Ox'+Ox.toTitleCase(self.options.style)+(self.options.overlap!='none'?' OxOverlap'+Ox.toTitleCase(self.options.overlap):'')).css(self.options.width=='auto'?{}:{width:self.options.width-2+'px'}).bindEvent({anyclick:function(e){showMenu($(e.target).is('.OxButton')?'button':null);},});if(self.options.type=='text'){self.$title=Ox.$('<div>').addClass('OxTitle').css({width:self.options.width-24+'px'}).html(self.options.title).appendTo(that);}
|
||
|
|
self.$button=Ox.Button({id:self.options.id+'Button',selectable:true,overlap:self.options.overlap,style:'symbol',title:self.options.type=='text'||!self.options.title?'select':self.options.title,type:'image'}).appendTo(that);self.$menu=Ox.Menu({edge:'bottom',element:self.$title||self.$button,id:self.options.id+'Menu',items:self.options.items,maxWidth:self.options.maxWidth}).bindEvent({change:changeMenu,click:clickMenu,hide:hideMenu});self.options.type=='image'&&self.$menu.addClass('OxRight');function clickMenu(data){that.triggerEvent('click',data);}
|
||
|
|
function changeMenu(data){that.triggerEvent('change',data);}
|
||
|
|
function hideMenu(data){that.loseFocus();that.removeClass('OxSelected');self.$button.options({value:false});that.triggerEvent('hide');}
|
||
|
|
function showMenu(from){that.gainFocus();that.addClass('OxSelected');from!='button'&&self.$button.options({value:true});that.$tooltip&&that.$tooltip.hide();self.$menu.showMenu();that.triggerEvent('show');}
|
||
|
|
that.checkItem=function(id){self.$menu.checkItem(id);return that;};that.disableItem=function(id){self.$menu.getItem(id).options({disabled:true});return that;};that.enableItem=function(id){self.$menu.getItem(id).options({disabled:false});return that;};that.removeElement=function(){self.$menu.remove();return Ox.Element.prototype.removeElement.apply(that,arguments);};that.setItemTitle=function(id,title){self.$menu.setItemTitle(id,title);return that;};that.uncheckItem=function(id){self.$menu.uncheckItem(id);return that;};return that;};'use strict';Ox.MenuItem=function(options,self){self=self||{};var that=Ox.Element('<tr>',self).defaults({bind:[],checked:null,disabled:false,file:null,group:'',icon:'',id:'',items:[],keyboard:'',maxWidth:0,menu:null,position:0,title:[],type:''}).options(Ox.extend(Ox.clone(options),{keyboard:parseKeyboard(options.keyboard||self.defaults.keyboard),title:Ox.makeArray(options.title||self.defaults.title)})).update({checked:function(){that.$status.html(self.options.checked?Ox.SYMBOLS.check:'')},disabled:function(){that[self.options.disabled?'addClass':'removeClass']('OxDisabled');},keyboard:function(){self.options.keyboard=parseKeyboard(self.options.keyboard);that.$modifiers.html(formatModifiers());that.$key.html(formatKey());},title:function(){self.options.title=Ox.makeArray(self.options.title);that.$title.html(self.options.title[0]);}}).addClass('OxItem'+(self.options.disabled?' OxDisabled':'')).data('group',self.options.group);if(self.options.group&&self.options.checked===null){self.options.checked=false;}
|
||
|
|
if(self.options.file){self.$input=$('<input>').attr(Ox.extend({type:'file'},self.options.file.multiple?{multiple:true}:{})).on({change:function(event){var filelist=this.files
|
||
|
|
var files=[];Ox.loop(filelist.length,function(i){files.push(filelist.item(i));});self.options.menu.clickItem(self.options.position,files);}})}
|
||
|
|
that.append(that.$status=Ox.$('<td>').addClass('OxCell OxStatus').html(self.options.checked?Ox.SYMBOLS.check:'')).append(that.$icon=$('<td>').addClass('OxCell OxIcon').append(self.options.icon?Ox.$('<img>').attr({src:self.options.icon}):null)).append(that.$title=$('<td>').addClass('OxCell OxTitle').css(self.options.maxWidth?{maxWidth:self.options.maxWidth-46,textOverflow:'ellipsis',overflow:'hidden'}:{}).html(Ox.isString(self.options.title[0])?self.options.title[0]:Ox.$('<div>').html(self.options.title[0]).html()).on({click:self.options.file?function(event){!self.options.disabled&&self.$input.click()
|
||
|
|
event.preventDefault()
|
||
|
|
event.stopPropagation()}:null})).append(that.$modifiers=Ox.$('<td>').addClass('OxCell OxModifiers').html(formatModifiers())).append(that.$key=Ox.$('<td>').addClass('OxCell Ox'+(self.options.items.length?'Submenu':'Key')).html(self.options.items.length?Ox.SYMBOLS.triangle_right:formatKey()));function formatKey(){return Ox.SYMBOLS[self.options.keyboard.key]||self.options.keyboard.key.toUpperCase();}
|
||
|
|
function formatModifiers(){return self.options.keyboard.modifiers.map(function(modifier){return Ox.SYMBOLS[modifier];}).join('');}
|
||
|
|
function parseKeyboard(str){var modifiers=str.split(' '),key=modifiers.pop();return{modifiers:modifiers,key:key};}
|
||
|
|
that.toggle=function(){};that.toggleChecked=function(){that.options({checked:!self.options.checked});return that;};that.toggleDisabled=function(){};that.toggleTitle=function(){that.options({title:Ox.clone(self.options.title).reverse()});return that;};return that;};'use strict';Ox.Bar=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({orientation:'horizontal',size:16}).options(options||{}).addClass('OxBar Ox'+Ox.toTitleCase(self.options.orientation));self.dimensions=Ox.UI.DIMENSIONS[self.options.orientation];that.css(self.dimensions[0],'100%').css(self.dimensions[1],self.options.size+'px');return that;};'use strict';Ox.Progressbar=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({cancelled:false,paused:false,progress:0,style:'default',showCancelButton:false,showPauseButton:false,showPercent:false,showRestartButton:false,showTime:false,showTooltips:false,width:256}).options(options||{}).update({cancelled:toggleCancelled,paused:togglePaused,progress:function(){self.indeterminate=self.options.progress==-1;if(self.options.progress!=-1){self.options.progress=Ox.limit(self.options.progress,0,1);}
|
||
|
|
!self.options.paused&&!self.options.cancelled&&setProgress(true);}}).addClass('OxProgressbar'+(self.options.style!='default'?' Ox'+Ox.toTitleCase(self.options.style):'')).css({width:self.options.width-2+'px'});self.indeterminate=self.options.progress==-1;self.trackWidth=self.options.width
|
||
|
|
-self.options.showPercent*36
|
||
|
|
-self.options.showTime*60
|
||
|
|
-self.options.showPauseButton*16
|
||
|
|
-self.options.showCancelButton*16;self.$track=$('<div>').addClass('OxTrack').css({width:self.trackWidth-2+'px'}).appendTo(that);self.$progress=$('<div>').addClass('OxProgress').appendTo(self.$track);if(self.options.showPercent){self.$percent=$('<div>').addClass('OxText').css({width:'36px'}).appendTo(that);}
|
||
|
|
if(self.options.showTime){self.$time=$('<div>').addClass('OxText').css({width:'60px'}).appendTo(that);}
|
||
|
|
if(self.options.showPauseButton){self.$pauseButton=Ox.Button({style:'symbol',tooltip:self.options.showTooltips?[Ox._('Pause'),Ox._('Resume')]:'',type:'image',value:!self.options.paused?'pause':'redo',values:['pause','redo']}).bindEvent({click:togglePaused}).appendTo(that);}
|
||
|
|
if(self.options.showCancelButton){self.$cancelButton=Ox.Button(Ox.extend({style:'symbol',type:'image'},self.options.showRestartButton?{tooltip:self.options.showTooltips?[Ox._('Cancel'),Ox._('Restart')]:'',value:'close',values:['close','redo']}:{title:'close',tooltip:self.options.showTooltips?Ox._('Cancel'):''})).bindEvent({click:toggleCancelled}).appendTo(that);}
|
||
|
|
setProgress();!self.options.paused&&resume();function cancel(){self.options.cancelled=true;if(self.options.paused){self.options.paused=false;self.$pauseButton&&self.$pauseButton.toggle();}
|
||
|
|
stop();that.triggerEvent('cancel');}
|
||
|
|
function complete(){self.complete=true;stop();self.paused=false;that.triggerEvent('complete');}
|
||
|
|
function pause(){self.pauseTime=+new Date();self.$progress.removeClass('OxAnimate');($.browser.mozilla||$.browser.opera)&&clearInterval(self.interval);self.$time&&self.$time.html(self.options.cancelled?Ox._('Cancelled'):Ox._('Paused'));}
|
||
|
|
function restart(){self.options.cancelled=false;if(!self.indeterminate){self.options.progress=0;}
|
||
|
|
delete self.startTime;self.$pauseButton&&self.$pauseButton.options({disabled:false});setProgress();resume();that.triggerEvent('restart');}
|
||
|
|
function resume(){self.startTime=!self.startTime?+new Date():self.startTime+ +new Date()-self.pauseTime;self.$progress.addClass('OxAnimate');if($.browser.mozilla||$.browser.opera){self.offset=0;self.interval=setInterval(function(){self.$progress.css({backgroundPosition:--self.offset+'px 0, 0 0'})},1000/32);}
|
||
|
|
self.$time&&self.$time.html(self.options.progress?Ox.formatDuration(that.status().remaining):Ox._('unknown'));}
|
||
|
|
function setProgress(animate){self.$percent&&self.$percent.html(Math.floor(self.options.progress*100)+'%');self.$time&&self.$time.html(self.options.progress?Ox.formatDuration(that.status().remaining):Ox._('unknown'));self.$progress.stop().animate({width:Math.round(14+Math.abs(self.options.progress)*(self.trackWidth-16))+'px'},animate?250:0,function(){self.options.progress==1&&complete();});}
|
||
|
|
function stop(){pause();self.$time&&self.$time.html(self.options.cancelled?Ox._('Cancelled'):Ox._('Complete'));if(self.$pauseButton&&(self.options.cancelled||self.complete)){self.$pauseButton.options({disabled:true});}
|
||
|
|
if(self.$cancelButton&&(self.complete||!self.options.showRestartButton)){self.$cancelButton.options({disabled:true});}}
|
||
|
|
function toggleCancelled(e){if(e){self.options.cancelled=!self.options.cancelled;}else if(self.$cancelButton){self.$cancelButton.toggle();}
|
||
|
|
self.options.cancelled?cancel():restart();that.triggerEvent(self.options.cancelled?'cancel':'restart');}
|
||
|
|
function togglePaused(e){if(e){self.options.paused=!self.options.paused;}else if(self.$pauseButton){self.$pauseButton.toggle();}
|
||
|
|
self.options.paused?pause():resume();that.triggerEvent(self.options.paused?'pause':'resume');}
|
||
|
|
that.status=function(){var elapsed=+new Date()-self.startTime,remaining=elapsed/self.options.progress*(1-self.options.progress);return{elapsed:Math.floor(elapsed/1000),remaining:self.options.progress?Math.ceil(remaining/1000):Infinity};};return that;};'use strict';Ox.Resizebar=function(options,self){self=self||{};var that=Ox.Element({},self).defaults({collapsed:false,collapsible:false,defaultSize:null,edge:'left',orientation:'horizontal',resettable:false,resizable:false,resize:[],size:0,tooltip:false}).options(options||{}).update({collapsed:function(){that.css({cursor:getCursor()});self.$tooltip&&self.$tooltip.options({title:getTooltipTitle()});}}).addClass('OxResizebar Ox'+Ox.toTitleCase(self.options.orientation)).bindEvent(Ox.extend({dragstart:onDragstart,drag:onDrag,dragpause:onDragpause,dragend:onDragend},self.options.resettable?{doubleclick:reset,singleclick:toggle}:{anyclick:toggle})).append(Ox.$('<div>').addClass('OxSpace')).append(Ox.$('<div>').addClass('OxLine')).append(Ox.$('<div>').addClass('OxSpace'));if(Ox.isString(self.options.tooltip)){self.$tooltip=Ox.Tooltip({title:getTooltipTitle()});that.on({mouseenter:self.$tooltip.show,mouseleave:self.$tooltip.hide});}
|
||
|
|
self.clientXY=self.options.orientation=='horizontal'?'clientY':'clientX';self.dimensions=Ox.UI.DIMENSIONS[self.options.orientation];self.edges=Ox.UI.EDGES[self.options.orientation];self.isLeftOrTop=self.options.edge=='left'||self.options.edge=='top';that.css({cursor:getCursor()});function getCursor(){var cursor='';if(self.options.collapsed){cursor=self.options.orientation=='horizontal'?(self.isLeftOrTop?'s':'n'):(self.isLeftOrTop?'e':'w');}else{if(self.options.resizable){cursor=self.options.orientation=='horizontal'?'ns':'ew';}else if(self.options.collapsible){cursor=self.options.orientation=='horizontal'?(self.isLeftOrTop?'n':'s'):(self.isLeftOrTop?'w':'e');}}
|
||
|
|
return cursor+'-resize';}
|
||
|
|
function getTooltipTitle(){var title='';if(self.options.collapsed){title=Ox._('Click to show');}else{if(self.options.resizable){title=Ox._('Drag to resize');}
|
||
|
|
if(self.options.collapsible){title=title?Ox._('{0}{1} click to hide',[title,self.options.resettable?',':' or']):Ox._('Click to hide');}
|
||
|
|
if(self.options.resettable){title+=' or doubleclick to reset'}}
|
||
|
|
if(title&&self.options.tooltip){title+=' '+self.options.tooltip;}
|
||
|
|
return title;}
|
||
|
|
function onDragstart(data){if(self.options.resizable&&!self.options.collapsed){Ox.$body.addClass('OxDragging');self.drag={startPos:data[self.clientXY],startSize:self.options.size}}
|
||
|
|
that.triggerEvent('resizestart',{size:self.options.size});}
|
||
|
|
function onDrag(data){if(self.options.resizable&&!self.options.collapsed){var delta=data[self.clientXY]-self.drag.startPos,size=self.options.size;self.options.size=Ox.limit(self.drag.startSize+delta*(self.isLeftOrTop?1:-1),self.options.resize[0],self.options.resize[self.options.resize.length-1]);Ox.forEach(self.options.resize,function(value){if(self.options.size>=value-8&&self.options.size<=value+8){self.options.size=value;return false;}});if(self.options.size!=size){that.css(self.edges[self.isLeftOrTop?2:3],self.options.size+'px').triggerEvent('resize',{size:self.options.size});}}}
|
||
|
|
function onDragpause(){if(self.options.resizable&&!self.options.collapsed){if(self.options.size!=self.drag.startSize){that.triggerEvent('resizepause',{size:self.options.size});}}}
|
||
|
|
function onDragend(){if(self.options.resizable&&!self.options.collapsed){Ox.$body.removeClass('OxDragging');if(self.options.size!=self.drag.startSize){that.triggerEvent('resizeend',{size:self.options.size});}}}
|
||
|
|
function reset(){if(self.options.resizable&&!self.options.collapsed){that.triggerEvent('reset');}}
|
||
|
|
function toggle(){if(self.options.collapsible){self.options.collapsed=!self.options.collapsed;that.css({cursor:getCursor()});self.$tooltip&&self.$tooltip.hide(function(){self.$tooltip.options({title:getTooltipTitle()});});that.triggerEvent('toggle',{collapsed:self.options.collapsed});}}
|
||
|
|
return that;};'use strict';Ox.Tabbar=function(options,self){self=self||{};var that=Ox.Bar({size:20},self).defaults({selected:0,tabs:[]}).options(options||{}).addClass('OxTabbar');Ox.ButtonGroup({buttons:self.options.tabs,group:true,selectable:true,selected:self.options.selected,size:'medium',style:'tab'}).appendTo(that);return that;};
|