代码拉取完成，页面将自动刷新
Fork 仓库
加载中
确定同步？
同步操作将从 tony zhou/Visor.js 强制同步，此操作会覆盖自 Fork 仓库以来所做的任何修改，且无法恢复！！！
确定后同步将在后台操作，完成时将刷新页面，请耐心等待。
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923
(function($){
var globalWidgetPropertyEditor=new Map();
$.registerPropertyObject = function(type, _function) {
if (typeof _function !== "function") {
alert(type + " is not a sinppet");
return;
}
try {
globalSnippetPropertyEditor.update(type, _function);
} catch (ex) {
alert(ex);
}
};
$.propertyObject = function(type, option) {
if (!globalWidgetPropertyEditor.containsKey(type)) {
return new propertyObject(option);
}
var _propertyObject = globalWidgetPropertyEditor.get(type);
return new _propertyObject(option);
};
propertyObject=function(option){
var opt= {
name:{
format:"string",
title:"名称",
required:false,
editable:true
},
text:{
format:"text",
title:"描述",
required:false,
editable:true
},
collapsed:{
format:"boolean",
title:"折叠的",
required:false,
editable:true
},
datatype:{
format:"single",
title:"数据类型",
required:false,
editable:true,
options:[{id:'String',text:"字符串"},{id:'Integer',text:"整数"},{id:'Date',text:"日期"},{id:'Boolean',text:"布尔"},{id:'Array',text:"数组"},{id:'Object',text:"对象"}]
},
mappingtype:{
format:"single",
title:"映射类型",
required:false,
editable:true,
options:[{id:"Object",text:"子对象"},{id:"Array",text:"数组"}]
},
matchcriteria:{
format:"list",
title:"匹配条件",
required:false,
editable:false
},
targetpath:{
format:"string",
title:"映射路径",
required:false,
editable:false
},
}
$.extend(opt,option);
return opt;
}
$.drawArrow=function(ctx,sp,ep,type,opt){
return new drawArrow(ctx,sp,ep,type,opt);
};
$.drawDiamond=function(ctx,sp,ep,type,opt){
return new drawDiamond(ctx,sp,ep,type,opt);
};
$.drawEllipse=function(ctx, x, y, a, b){
return new drawEllipse(ctx, x, y, a, b);
};
function drawEllipse(ctx, x, y, a, b)
{
var k = .5522848,
ox = a * k, // 水平控制点偏移量
oy = b * k; // 垂直控制点偏移量
ctx.beginPath();
//从椭圆的左端点开始顺时针绘制四条三次贝塞尔曲线
ctx.moveTo(x - a, y);
ctx.bezierCurveTo(x - a, y - oy, x - ox, y - b, x, y - b);
ctx.bezierCurveTo(x + ox, y - b, x + a, y - oy, x + a, y);
ctx.bezierCurveTo(x + a, y + oy, x + ox, y + b, x, y + b);
ctx.bezierCurveTo(x - ox, y + b, x - a, y + oy, x - a, y);
ctx.closePath();
ctx.stroke();
};
endpoint=function(opt){
this.x=0,
this.y=0,
this.position="",
this.shape={
name:"arrow", //none,dot,arrow,diamond,other
type:1,
size:5,
sharp:10,
radius:5
},
this.background={
filltype:"color",
color:"black"
},
this.border={
width : 1,
type:"solid", //solid, dotted,dashed
color : "black"
},
$.extend(this,opt);
this.offsetx=0;
this.offsety=0;
this.shape.size=this.shape.size?this.shape.size:5;
this.shape.sharp=this.shape.sharp?this.shape.sharp:10;
this.shape.radius=this.shape.radius?this.shape.radius:5;
if(opt)
this.widget=opt.widget;
return this;
};
endpoint.prototype.persist=function()
{
var r={};
r.x=this.x;
r.y=this.y;
r.position=this.position;
r.shape={};
$.extend(r.shape,this.shape);
r.background={};
$.extend(r.background,this.background);
r.border={};
$.extend(r.border,this.border);
if(this.widget)
r.widget=this.widget.persist();
return r;
};
var drawDiamond=function(ctx,sp,ep,type,opt){
if(ep===undefined||sp===undefined)
return null;
if(ep===undefined||sp===undefined)
return null;
var sta = new Array(sp.x,sp.y);
var end = new Array(ep.x,ep.y);
var sizeW = opt.size?opt.size:5;
var sizeH = opt.sharp?opt.sharp:10;
var sizeM = opt.radius?opt.radius:5;
//算出直线偏离Y的角
var ang=(end[0]-sta[0])/(end[1]-sta[1]);
ang=Math.atan(ang);
ctx.save();
//画箭头
ctx.beginPath();
ctx.translate(end[0],end[1]);
if(end[1]-sta[1] >= 0){
ctx.rotate(-ang);
}else{
ctx.rotate(Math.PI-ang);//加个180度，反过来
}
if(type==1){
//棱形透明箭头
ctx.moveTo(0,-sizeH*2);
ctx.lineTo(-sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.lineTo(sizeW,-sizeH);
ctx.lineTo(0,-sizeH*2);
ctx.stroke();
ctx.restore();
ctx.closePath();
}else if(type==2){
//棱形实心箭头
ctx.moveTo(0,-sizeH*2);
ctx.lineTo(-sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.lineTo(sizeW,-sizeH);
ctx.lineTo(0,-sizeH*2);
ctx.stroke();
ctx.fill();
ctx.restore();
ctx.closePath();
}
else{
//棱形空心箭头
ctx.moveTo(0,-sizeH*2);
ctx.lineTo(-sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.lineTo(sizeW,-sizeH);
ctx.lineTo(0,-sizeH*2);
ctx.stroke();
ctx.fillStyle="white";
ctx.fill();
ctx.restore();
ctx.closePath();
}
};
var drawArrow=function(ctx,sp,ep,type,opt){
if(ep===undefined||sp===undefined)
return null;
var sta = new Array(sp.x,sp.y);
var end = new Array(ep.x,ep.y);
var sizeW = opt.size?opt.size:5;
var sizeH = opt.sharp?opt.sharp:10;
var sizeM = opt.radius?opt.radius:5;
//算出直线偏离Y的角
var ang=(end[0]-sta[0])/(end[1]-sta[1]);
ang=Math.atan(ang);
ctx.save();
//画箭头
ctx.beginPath();
ctx.translate(end[0],end[1]);
if(end[1]-sta[1] >= 0){
ctx.rotate(-ang);
}else{
ctx.rotate(Math.PI-ang);//加个180度，反过来
}
if(type==1){
//三角透明箭头
ctx.moveTo(-sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.lineTo(sizeW,-sizeH);
ctx.stroke();
ctx.restore();
ctx.closePath();
}
if(type==2){
//三角实心箭头
ctx.moveTo(-sizeW,-sizeH);
ctx.lineTo(sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.moveTo(-sizeW,-sizeH);
ctx.stroke();
ctx.fill();
ctx.restore();
ctx.closePath();
}else if(type==3){
//三角白心箭头
ctx.moveTo(-sizeW,-sizeH);
ctx.lineTo(sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.lineTo(-sizeW,-sizeH);
ctx.stroke();
ctx.fillStyle="white";
ctx.fill();
ctx.restore();
ctx.closePath();
}else if(type==4){
//箭头 ------->>
ctx.moveTo(-sizeW,-sizeH);
ctx.lineTo(0,-sizeM);
ctx.lineTo(sizeW,-sizeH);
ctx.lineTo(0,0);
ctx.lineTo(-sizeW,-sizeH);
ctx.stroke();
ctx.fill();
ctx.restore();
ctx.closePath();
}else if(type==5){
//三爪箭头
ctx.moveTo(-sizeW,0);
ctx.lineTo(0,-sizeH);
ctx.lineTo(sizeW,0);
ctx.stroke();
ctx.restore();
ctx.closePath();
}else if(type==6){
//五爪箭头
ctx.moveTo(-sizeW,0);
ctx.lineTo(0,-sizeH);
ctx.lineTo(sizeW,0);
ctx.moveTo(-sizeW,-sizeH);
ctx.lineTo(sizeW,-sizeH);
ctx.stroke();
ctx.restore();
ctx.closePath();
}
};
//旋转坐标
var _scrollXOY=function(p,theta){
return {
x:p.x*Math.cos(theta)+p.y*Math.sin(theta),
y:p.y*Math.cos(theta)-p.x*Math.sin(theta)
};
};
label=function(option){
var opt={
name:"label",
height:22,
margin:10,
font:{
style:"normal", // normal,italic,
weight:"normal",//normal,lighter,bold
family:"Arial",
size:"11pt",
color:"black",
fill:true
},
minheight:17
};
$.extend(opt,option);
$.extend(this,new widget(opt));
this.type="label";
this.propertyEditors=["common","font"];
this.afterresize=function(ev){
this.font.size=(this.height-2*this.margin)+"pt";
};
this.beforePaint=function(ctx){
var margin=this.margin;
if(typeof this.font==="String")
ctx.font=this.font;
else{
ctx.font=this.font.style+" "+this.font.weight+" "+this.font.size+" "+this.font.family;
}
var metrics=ctx.measureText(this.text);
this.width=Math.round(metrics.width+2*margin);
this.setResizers();
};
return this;
};
actionWidget=function(option){
var opt={
name:"actionWidget",
hyperlink :{
window:"",
url:"",
command:"",
type:"url", //url,command,window
target:"_blank",
},
shadow:{
color : "black",
offsetX : 4,
offsetY : 4,
blur : 4
},
};
$.extend(opt,option);
$.extend(this,new widget(opt));
this.type="actionWidget";
this.click=function(e){
if(!this.editable&&this.hyperlink){
if(this.hyperlink.type==="url"&&this.hyperlink.url!="")
window.open(this.hyperlink.url,this.hyperlink.target);
else if(this.hyperlink.type==="window"&&this.hyperlink.window!=""){
if($.fn.fullpage!=null&&$.fn.fullpage.moveTo&&this.hyperlink.index){
$.fn.fullpage.moveTo(this.hyperlink.index, 0);
}
else if(this.presenters[0])
this.presenters[0].designer.setActive(parseInt(this.hyperlink.window));
else
this.root.presenters[0].designer.setActive(parseInt(this.hyperlink.window));
}
}
if(option.click)
option.click.call(this,e);
this.paint();
};
this.tap=function(e){
this.click.call(this,e.originalEvent);
};
};
link=function(option){
var opt={
name:"link",
text:"link",
font:{
style:"normal",
weight:"normal",
family:"Arial",
size:"10pt",
color:"blue",
fill:true
},
shadow:null,
height:24,
minheight:17
};
$.extend(opt,option);
$.extend(this,new actionWidget(opt));
this.propertyEditors=["common","font","hyperlink"];
this.afterresize=function(ev){
this.font.size=(this.height-2*this.margin)+"pt";
};
this.beforePaint=function(ctx){
var margin=this.margin;
if(typeof this.font==="String")
ctx.font=this.font;
else{
ctx.font=this.font.style+" "+this.font.weight+" "+this.font.size+" "+this.font.family;
}
var metrics=ctx.measureText(this.text);
this.width=Math.round(metrics.width+2*margin);
this.setResizers();
};
this.font.color="blue";
this.type="link";
return this;
};
note=function(option){
var opt={
name:"note",
text:"note",
width:160,
height:140,
corner:{
type:"round", //round,rect
radius:16
},
background:{
filltype:"color",
image:"",
imageType:"fill",
color:"yellow"
},
font:{
style:"normal",
weight:"normal",
family:"Arial",
size:"10pt",
color:"blue",
fill:true
},
paragraph:{
linespace:10,
textalign:"center", //left,center,right
textvalign:"middle" //top,middle,bottom
},
autosize:false,
};
$.extend(opt,option);
$.extend(this,new actionWidget(opt));
this.type="note";
this.persist=function(){
var r=widget.persistproperty(this);
if(this.paragraph){
r.paragraph={};
$.extend(r.paragraph,this.paragraph);
}
return r;
};
this.calculateSize=function(ctx){
if(this.text){
ctx.save();
if(typeof this.font==="String")
ctx.font=this.font;
else{
ctx.font=this.font.style+" "+this.font.weight+" "+this.font.size+" "+this.font.family;
}
var ths=this;
var lines=this.text.split("\n");
var formatlines=[];
this.paragraph.linespace=parseInt(this.paragraph.linespace);
$(lines).each(function(index,line){
var words=line.split(/[\s]/);
var line1="";
while(words.length>0){
var word=words.shift();
if(ctx.measureText(line1+" "+word).width>ths.width-2*ths.margin){
//ctx.fillText(line1,x,y,ths.width-2*ths.margin);
if(line1!="")
formatlines.push(line1);
if(ctx.measureText(word).width>ths.width-2*ths.margin)
{
line1="";
for(var i=0;i<word.length;i++){
var a=word.substring(i,i+1);
if(ctx.measureText(line1+a).width>ths.width-2*ths.margin)
{
formatlines.push(line1);
line1=a;
}
else
line1=line1+a;
}
}
else
line1=word;
}
else
line1=line1?line1+" "+word:word;
}
if(line1!=""){
formatlines.push(line1);
}
});
this.minheight=this.fontSize()*formatlines.length+this.paragraph.linespace*(formatlines.length-1)+2*this.margin;
if(this.height<this.minheight)
this.height=this.minheight;
ctx.restore();
this.formatlines=formatlines;
}
return this;
};
this.drawTextTo=function(ctx){
if(this.text){
ctx.save();
if(typeof this.font==="String")
ctx.font=this.font;
else{
ctx.font=this.font.style+" "+this.font.weight+" "+this.font.size+" "+this.font.family;
}
ctx.StrokeStyle=this.font.color||"black";
ctx.fillStyle=this.font.color||"black";
var x=this.margin;
var y=this.margin+this.fontSize();
ctx.textAlign="start";
if(this.paragraph.textalign==="center"){
x=this.width/2;
ctx.textAlign="center";
}
else if(this.paragraph.textalign==="right"){
x=this.width-this.margin;
ctx.textAlign="end";
}
ctx.textBaseline=this.textBaseline||"alphabetic";
var ths=this;
this.paragraph.linespace=parseInt(this.paragraph.linespace);
if(this.paragraph.textvalign==="middle"){
y=(this.height-this.minheight)/2+y;
}
else if(this.paragraph.textvalign==="bottom"){
y=(this.height-this.minheight)+y;
}
$(this.formatlines).each(function(index,line){
if(ths.font.fill)
ctx.fillText(line,x,y,ths.width-2*ths.margin);
else
ctx.strokeText(line,x,y,ths.width-2*ths.margin);
y=y+ths.fontSize()+ths.paragraph.linespace;
});
ctx.restore();
}
};
return this;
};
noticeboard=function(option){
var opt={
name:"noticeboard",
tooltip:null,
shadow:{
color : "none",
offsetX : 4,
offsetY : 4,
blur : 4
},
background:{
color:"none",
filltype:"color",
image : null,
imageType : "center"// repeat center fit fill
},
corner:{
type:"rect",
radius:16
},
border:{
width : 1,
type:"dashed", //solid, dotted,dashed
color : "black"
},
hint:{
show:true,
hasmask:true,
maskcolor:"#cecccd",
maskalpha:0.5,
}
};
$.extend(opt,option);
$.extend(this,new note(opt));
this.type="noticeboard";
if(this.functionPoints.length===0)
this.functionPoints=[
{x:this.width*3/4,y:0,cursor:"pointer",visible:true},
];
if(this.tooltip==null){
this.tooltip=$.widgets("tooltip",{
editable:this.editable,
height:50,
width:250,
text:"",
tail:{
position:"left", //top,bottom,left,right
margin:16,
size:20
},
name:this.name+"_tooltip"
});
}
else{
this.tooltip=new tooltip(this.tooltip);
this.tooltip.name=this.name+"_tooltip";
}
this.beforePaint=function(ctx){
if(this.tooltip.x==0&&this.tooltip.y==0){
this.tooltip.x=this.x+this.width+10,
this.tooltip.y=this.y-60;
}
this.tooltip.functionPoints[1].visible=false;
var point0=this.functionPoints[0];
var relpoint0=this.tooltip.relativePoint(this.x+point0.x,this.y+point0.y,1);
this.tooltip.functionPoints[1].x=relpoint0.x;
this.tooltip.functionPoints[1].y=relpoint0.y;
if(this.editable&&this.presenters[0]&&!this.presenters[0].Widget(this.tooltip)&&this.hint.show){
this.tooltip.editable=true;
this.presenters[0].appendWidget(this.tooltip);
}
};
this.mouseup=function(e){
if(e.offsetX){
this.tooltip.x+=e.offsetX/this.scale;
this.tooltip.y+=e.offsetY/this.scale;
}
};
this.mousemove=function(e){
// console.info(this.name+" mousemove at x="+e.x+",y="+e.y+"/x="+e.desktopX+",y="+e.desktopY);
if(this.tooltip.text!="" &&!this.editable){
var ths=this;
var relativePoint=this.tooltip.relativePoint(ths.x+ths.functionPoints[0].x,ths.y+ths.functionPoints[0].y);
this.tooltip.functionPoints[1].x=relativePoint.x;
this.tooltip.functionPoints[1].y=relativePoint.y;
ths.paint();
if(ths.hint.hasmask){
ths.paintMask(ths.parent);
ths.paintTo(ths.parent.canvas);
}
this.tooltip.paintTo(ths.parent.canvas);
}
};
this.persist=function(){
if(this.presenters[0]&&this.presenters[0].Widget(this.tooltip))
this.presenters[0].removeWidget(this.tooltip);
else if(this.parent&&this.parent.Widget(this.tooltip))
this.parent.removeWidget(this.tooltip);
var r=widget.persistproperty(this);
if(this.paragraph)
{
r.paragraph={};
$.extend(r.paragraph,this.paragraph);
}
if(this.hint){
r.tooltip=this.tooltip.persist();
r.hint={};
$.extend(r.hint,this.hint);
}
return r;
};
this.paintMask=function(panel){
if(this.hint.hasmask){
var ctx=panel.ctx;
var root=panel;
ctx.save();
ctx.fillStyle =this.hint.maskcolor;
ctx.globalAlpha=this.hint.maskalpha;
ctx.fillRect(root.x,root.y,root.width,root.height);
ctx.restore();
}
};
};
checkbox=function(option){
var opt={
name:"checkBox",
checked:true,
size:15,
text:"checkBox",
autosize:true
};
$.extend(opt,option);
$.extend(this,new widget(opt));
this.propertyEditors=["common"];
this.allowRotate=false;
this.click=function(e){
var ths=this;
this.checked=!this.checked;
if(option.click)
option.click.call(this,e);
if(this.presenters.length>0)
ths.paint();
else
this.root.paint();
};
this.type="checkbox";
this.persist=function(){
var r=widget.persistproperty(this);
r.checked=this.checked;
return r;
};
this.drawBorderTo = function(ctx){
var margin=this.margin;
ctx.strokeStyle="black";
ctx.lineWidth=1;
ctx.beginPath();
var side=this.size;
ctx.strokeRect(margin,margin,side,side);
if(this.checked){
ctx.moveTo(0+margin,side/2+margin);
ctx.lineTo(side/2+margin,side+margin);
ctx.lineTo(side+margin,0+margin);
ctx.stroke();
}
return this;
};
this.drawTextTo=function(ctx){
var _widget=this;
var margin=this.margin;
var length=16;
var autosize=_widget.autosize||false;
if(_widget.text){
if(typeof _widget.font==="String")
ctx.font=_widget.font;
else{
var font=_widget.font.style+" "+_widget.font.weight+" "+_widget.font.size+" "+_widget.font.family;
ctx.font=font;
}
ctx.fillStyle=_widget.font.color||"black";
ctx.strokeStyle=_widget.font.color||"black";
aWidth=ctx.measureText("A");
metrics=ctx.measureText(_widget.text);
if(autosize){
_widget.width=Math.round(metrics.width+length+length/2+2*margin);
_widget.height=Math.round(length+2*margin);
this.setConnectionPoints();
}
if(_widget.font.fill)
ctx.fillText(_widget.text,length+length/2+margin,(length+aWidth.width)/2+margin);
else
ctx.strokeText(_widget.text,length+length/2+margin,(length+aWidth.width)/2+margin);
}
};
return this;
};
radio=function(option){
var opt={
name:"radio",
text:"radio",
radius:15,
autosize:true,
allowRotate:false
};
$.extend(opt,option);
$.extend(this,new checkbox(opt));
this.type="radio";
this.drawBorderTo = function(ctx){
ctx.beginPath();
ctx.strokeStyle="black";
ctx.lineWidth=1;
var radius=this.radius;
ctx.arc(radius/2+this.margin,radius/2+this.margin,radius/2,0,2*Math.PI,true);
ctx.closePath();
ctx.stroke();
if(this.checked){
ctx.save();
ctx.fillStyle="black";
ctx.beginPath();
ctx.arc(radius/2+this.margin,radius/2+this.margin,radius/2-3,0,2*Math.PI,true);
ctx.stroke();
ctx.fill();
ctx.restore();
}
return this;
};
return this;
};
box=function(option){
var opt={
border:{
width:1,
type:"solid",
color:"black"
},
corner:{
type:"round", //round,rect
radius:16
},
background:{
filltype:"none",
color:"white",
image:"",
imageType:"fill"
},
paragraph:{
linespace:10,
textalign:"center", //left,center,right
textvalign:"top" //top,middle,bottom
},
width:145,
height:125 ,
afterresize:function(ev){
if(ev.resizer==4){
this.functionPoints[0].x+=ev.offset.x/2;
this.functionPoints[0].y+=ev.offset.y;
}
else if(ev.resizer==1){
this.functionPoints[0].x-=ev.offset.x/2;
this.functionPoints[0].y-=ev.offset.y;
}
else if(ev.resizer==2){
this.functionPoints[0].x+=ev.offset.x/2;
this.functionPoints[0].y-=ev.offset.y;
}
else if(ev.resizer==3){
this.functionPoints[0].x-=ev.offset.x/2;
this.functionPoints[0].y+=ev.offset.y;
}
}
};
$.extend(opt,option);
$.extend(this,new actionWidget(opt));
this.propertyEditors=["common","border","corner","font","background","hyperlink"];
if(this.functionPoints.length===0)
this.functionPoints=[
{x:this.width/2,y:this.height+12,cursor:"pointer",visible:true}
];
this.calculateSize=function(ctx){
//do nothing
};
this.drawTextTo=function(ctx){
if(this.text){
ctx.save();
if(typeof this.font==="String")
ctx.font=this.font;
else{
ctx.font=this.font.style+" "+this.font.weight+" "+this.font.size+" "+this.font.family;
}
ctx.StrokeStyle=this.font.color||"black";
ctx.fillStyle=this.font.color||"black";
var x=this.margin;
var y=this.height+this.fontSize()+this.margin;
ctx.textAlign="start";
if(this.paragraph.textalign==="center"){
x=this.width/2;
ctx.textAlign="center";
}
else if(this.paragraph.textalign==="right"){
x=this.width-this.margin;
ctx.textAlign="end";
}
x=this.functionPoints[0].x;
y=this.functionPoints[0].y+18;
this.functionPoints[0].visible=true;
ctx.textBaseline=this.textBaseline||"alphabetic";
var ths=this;
var formatlines=this.text.split("\n");
$(formatlines).each(function(index,line){
if(ths.font.fill)
ctx.fillText(line,x,y);
else
ctx.strokeText(line,x,y);
y=y+ths.fontSize()+ths.paragraph.linespace;
});
ctx.restore();
}
else{
this.functionPoints[0].visible=false;
}
};
this.type="box";
return this;
};
line=function(option){
var opt={
name:"line",
width:250,
height:140,
border:{
width:1,
type:"solid",
color:"black"
},
margin:2,
linecap:"round",//butt,square
minheight:0,
minwidth:0,
};
$.extend(opt,option);
$.extend(this,new widget(opt));
this.allowconnectionPoint=false;
this.begin=new endpoint(option.begin);
this.end=new endpoint(option.end);
this.type="line";
this.direction=option.direction?option.direction:1;
this.persist=function(){
var r=widget.persistproperty(this);
r.direction=this.direction;
r.begin=this.begin.persist();
r.end=this.end.persist();
return r;
};
this.checkPointIn =function(x, y,scale) {
if(this.root!=null)
scale=scale||this.root.scale;
if(!scale)
scale=1;
var _xc = this.relativePoint(x, y,scale);
var x2 = _xc.x;
var y2 = _xc.y;
var result=math.isPointOnLine(x2,y2,this.begin.x*scale,this.begin.y*scale,this.end.x*scale,this.end.y*scale);
return result;
};
this.paintTo=function(canvas){
var ctx=canvas.getContext("2d");
ctx.save();
ctx.scale(this.scaleX,this.scaleY);
if(canvas!=this.canvas)
ctx.translate(this.x, this.y);
ctx.rotate(this.rotate / 180 * Math.PI);
ctx.globalAlpha = this.alpha;
this.drawImageTo(ctx);
if(this.editable){
if(this.focus&&canvas!=this.canvas){
// this.drawSelectRect(ctx);
if(this.editable&&!this.autosize)
this.drawResizerTo(ctx);
}
// else if(this.inselect&&canvas!=this.canvas){
// this.drawSelectRect(ctx);
// }
}
ctx.restore();
};
this.drawImageTo = function(ctx){
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
ctx.lineCap=this.linecap;
ctx.fillStyle=this.border.color;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
var sp=0,ep=0;
if(!this.direction||this.direction===1){
ctx.moveTo(this.margin,this.margin);
ctx.lineTo(this.width,this.height);
sp={x:this.margin,y:this.margin};
ep={x:this.width,y:this.height};
this.resizers[1].visible=false;
this.resizers[2].visible=false;
}
else if(this.direction===2){
ctx.moveTo(this.width,this.margin);
ctx.lineTo(this.margin,this.height);
sp={x:this.width,y:this.margin};
ep={x:this.margin,y:this.height};
this.resizers[0].visible=false;
this.resizers[3].visible=false;
}
else if(this.direction===3){
ctx.moveTo(this.width,this.height);
ctx.lineTo(this.margin,this.margin);
sp={x:this.width,y:this.height};
ep={x:this.margin,y:this.margin};
this.resizers[1].visible=false;
this.resizers[2].visible=false;
}
else if(this.direction===4){
ctx.moveTo(this.margin,this.height);
ctx.lineTo(this.width,this.margin);
sp={x:this.margin,y:this.height};
ep={x:this.width,y:this.margin};
this.resizers[0].visible=false;
this.resizers[3].visible=false;
}
this.begin.x=sp.x;
this.begin.y=sp.y;
this.end.x=ep.x;
this.end.y=ep.y;
ctx.stroke();
if(this.begin.shape.name==="arrow"&&ep&&sp)
$.drawArrow(ctx,ep,sp,this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
else if(this.begin.shape.name==="diamond"){
$.drawDiamond(ctx,ep,sp,this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
}
else if(this.begin.shape.name==="dot")
{
ctx.beginPath();
ctx.arc(sp.x,sp.y,this.begin.shape.radius,0,2*Math.PI);
ctx.stroke();
if(this.begin.shape.type===2)
ctx.fill();
else if(this.begin.shape.type===3){
ctx.fillStyle="white";
ctx.fill();
}
}
ctx.fillStyle=this.border.color;
if(this.end.shape.name==="arrow"&&sp&&ep)
$.drawArrow(ctx,sp,ep,this.end.shape.type,{size:this.end.shape.size,sharp:this.end.shape.sharp});
else if(this.end.shape.name==="diamond"){
$.drawDiamond(ctx,sp,ep,this.end.shape.type,{size:this.end.shape.size,sharp:this.end.shape.sharp});
}
else if(this.end.shape.name==="dot")
{
ctx.beginPath();
ctx.arc(ep.x,ep.y,this.end.shape.radius,0,2*Math.PI);
ctx.stroke();
if(this.end.shape.type===2)
ctx.fill();
else if(this.end.shape.type===3){
ctx.fillStyle="white";
ctx.fill();
}
}
return this;
};
return this;
};
circle=function(option){
var opt={
name:"circle",
width:150,
height:150,
border:{
width:1,
type:"solid",
color:"black"
},
background:{
filltype:"none",
color:"white"
},
corner:null,
margin:2,
minheight:15,
minwidth:15,
autosize:false
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","hyperlink"];
this.type="circle";
this.drawBorderTo = function(ctx){
ctx.save();
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
var x=this.width/2;
var y=this.height/2;
var a=(this.width-2*this.margin)/2;
var b=(this.height-2*this.margin)/2;
drawEllipse(ctx,x,y,a,b);
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
return this;
};
return this;
};
quadraticCurve=function(option){
var opt={
name:"quadraticCurve",
width:250,
height:140,
margin:2,
linecap:"round",//butt,square
minheight:0,
minwidth:0,
border:{
width:1,
type:"solid",
color:"black"
},
};
$.extend(opt,option);
$.extend(this,new widget(opt));
this.allowconnectionPoint=false;
this.begin=new endpoint(option.begin);
this.end=new endpoint(option.end);
this.type="curve";
this.persist=function(){
var r=widget.persistproperty(this);
if(this.resizers){
r.resizers=[];
$.extend(true,r.resizers,this.resizers);
}
r.begin=this.begin.persist();
r.end=this.end.persist();
return r;
};
var startpoint={
x:this.margin,
y:this.margin,
cursor:"nw-resize",
visible:true
},
endPoint={
x:this.width,
y:this.height,
cursor:"nw-resize",
visible:true
},
controlpoint={
x:this.margin,
y:this.height,
cursor:"ne-resize",
visible:true
};
this.paintTo=function(canvas){
var ctx=canvas.getContext("2d");
ctx.save();
ctx.scale(this.scaleX,this.scaleY);
if(canvas!=this.canvas)
ctx.translate(this.x, this.y);
ctx.rotate(this.rotate / 180 * Math.PI);
ctx.globalAlpha = this.alpha;
this.setResizers();
this.drawImageTo(ctx);
if(this.focus&&canvas!=this.canvas&&this.editable){
this.drawResizerTo(ctx);
this.drawSelectRect(ctx);
}
else if(this.inselect&&canvas!=this.canvas){
this.drawSelectRect(ctx);
}
ctx.restore();
};
this.setResizers=function(){
if(option.resizers)
this.resizers=option.resizers;
else
this.resizers=[startpoint,controlpoint,endPoint];
};
this.resize=function(e){
var offsetX=e.offset.x;
var offsetY=e.offset.y;
var resizer=e.resizer-1;
if(resizer>=0){
this.resizers[resizer].x+=offsetX;
this.resizers[resizer].y+=offsetY;
if(this.resizers[resizer].x<0){
this.x+=offsetX;
this.resizers[0].x-=offsetX;
this.resizers[1].x-=offsetX;
this.resizers[2].x-=offsetX;
}
else{
var minX=Math.min(this.resizers[0].x,this.resizers[1].x,this.resizers[2].x);
if(minX>0){
this.x+=minX;
this.resizers[0].x-=minX;
this.resizers[1].x-=minX;
this.resizers[2].x-=minX;
}
}
if(this.resizers[resizer].y<0){
this.y+=offsetY;
this.resizers[0].y-=offsetY;
this.resizers[1].y-=offsetY;
this.resizers[2].y-=offsetY;
}
else{
var minY=Math.min(this.resizers[0].y,this.resizers[1].y,this.resizers[2].y);
if(minY>0){
this.y+=minY;
this.resizers[0].y-=minY;
this.resizers[1].y-=minY;
this.resizers[2].y-=minY;
}
}
var minX=Math.min(this.resizers[0].x,this.resizers[1].x,this.resizers[2].x);
var minY=Math.min(this.resizers[0].y,this.resizers[1].y,this.resizers[2].y);
var maxX=Math.max(this.resizers[0].x,this.resizers[1].x,this.resizers[2].x);
var maxY=Math.max(this.resizers[0].y,this.resizers[1].y,this.resizers[2].y);
this.height=maxY-minY;
this.width=maxX-minX;
}
};
this.drawImageTo = function(ctx){
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
ctx.lineCap=this.linecap;
ctx.fillStyle=this.border.color;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
ctx.moveTo(this.resizers[0].x,this.resizers[0].y);
ctx.quadraticCurveTo(this.resizers[1].x,this.resizers[1].y,this.resizers[2].x,this.resizers[2].y);
ctx.stroke();
if(this.begin.shape.name==="arrow")
$.drawArrow(ctx,this.resizers[1],this.resizers[0],this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
else if(this.begin.shape.name==="diamond"){
$.drawDiamond(ctx,this.resizers[1],this.resizers[0],this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
}
else if(this.begin.shape.name==="dot")
{
ctx.beginPath();
ctx.arc(this.resizers[0].x,this.resizers[0].y,this.begin.shape.radius,0,2*Math.PI);
ctx.stroke();
if(this.begin.shape.type===2)
ctx.fill();
else if(this.begin.shape.type===3){
ctx.fillStyle="white";
ctx.fill();
}
}
ctx.fillStyle=this.border.color;
if(this.end.shape.name==="arrow")
$.drawArrow(ctx,this.resizers[1],this.resizers[2],this.end.shape.type,{size:this.end.shape.size,sharp:this.end.shape.sharp});
else if(this.end.shape.name==="diamond"){
$.drawDiamond(ctx,this.resizers[1],this.resizers[2],this.end.shape.type,{size:this.end.shape.size,sharp:this.end.shape.sharp});
}
else if(this.end.shape.name==="dot")
{
ctx.beginPath();
ctx.arc(this.resizers[2].x,this.resizers[2].y,this.end.shape.radius,0,2*Math.PI);
ctx.stroke();
if(this.end.shape.type===2)
ctx.fill();
else if(this.end.shape.type===3){
ctx.fillStyle="white";
ctx.fill();
}
}
return this;
};
return this;
};
bezierCurve=function(option){
var opt={
name:"bezierCurve",
width:250,
height:140,
margin:2,
linecap:"round",//butt,square
minheight:20,
minwidth:30,
border:{
width:1,
type:"solid",
color:"black"
}
};
$.extend(opt,option);
$.extend(this,new widget(opt));
this.allowconnectionPoint=false;
this.begin=new endpoint(option.begin);
this.end=new endpoint(option.end);
this.type="bezierCurve";
this.allowRotate=false;
this.text="";
this.persist=function(){
var r=widget.persistproperty(this);
if(this.resizers){
r.resizers=[];
$.extend(true,r.resizers,this.resizers);
}
r.begin=this.begin.persist();
r.end=this.end.persist();
return r;
};
var startpoint={
x:this.margin,
y:this.margin,
cursor:"nw-resize",
visible:true
},
endPoint={
x:this.width,
y:this.height,
cursor:"nw-resize",
visible:true
},
controlpoint1={
x:this.margin,
y:this.height,
cursor:"ne-resize",
visible:true
};
controlpoint2={
x:this.width,
y:this.margin,
cursor:"ne-resize",
visible:true
};
this.paintTo=function(canvas){
var ctx=canvas.getContext("2d");
ctx.save();
ctx.scale(this.scaleX,this.scaleY);
if(canvas!=this.canvas)
ctx.translate(this.x, this.y);
ctx.rotate(this.rotate / 180 * Math.PI);
ctx.globalAlpha = this.alpha;
this.setResizers();
this.drawImageTo(ctx);
if(this.focus&&canvas!=this.canvas&&this.editable){
this.drawResizerTo(ctx);
this.drawSelectRect(ctx);
}
else if(this.inselect&&canvas!=this.canvas){
this.drawSelectRect(ctx);
}
ctx.restore();
};
this.setResizers=function(){
if(option.resizers)
this.resizers=option.resizers;
else
this.resizers=[startpoint,controlpoint1,controlpoint2,endPoint];
};
this.resize=function(e){
var offsetX=e.offset.x;
var offsetY=e.offset.y;
var resizer=e.resizer-1;
if(resizer>=0){
this.resizers[resizer].x+=offsetX;
this.resizers[resizer].y+=offsetY;
if(this.resizers[resizer].x<0){
this.x+=offsetX;
this.resizers[0].x-=offsetX;
this.resizers[1].x-=offsetX;
this.resizers[2].x-=offsetX;
this.resizers[3].x-=offsetX;
}
else{
var minX=Math.min(this.resizers[0].x,this.resizers[1].x,this.resizers[2].x);
if(minX>0){
this.x+=minX;
this.resizers[0].x-=minX;
this.resizers[1].x-=minX;
this.resizers[2].x-=minX;
this.resizers[3].x-=minX;
}
}
if(this.resizers[resizer].y<0){
this.y+=offsetY;
this.resizers[0].y-=offsetY;
this.resizers[1].y-=offsetY;
this.resizers[2].y-=offsetY;
this.resizers[3].y-=offsetY;
}
else{
var minY=Math.min(this.resizers[0].y,this.resizers[1].y,this.resizers[2].y);
if(minY>0){
this.y+=minY;
this.resizers[0].y-=minY;
this.resizers[1].y-=minY;
this.resizers[2].y-=minY;
this.resizers[3].y-=minY;
}
}
var minX=Math.min(this.resizers[0].x,this.resizers[1].x,this.resizers[2].x,this.resizers[3].x);
var minY=Math.min(this.resizers[0].y,this.resizers[1].y,this.resizers[2].y,this.resizers[3].y);
var maxX=Math.max(this.resizers[0].x,this.resizers[1].x,this.resizers[2].x,this.resizers[3].x);
var maxY=Math.max(this.resizers[0].y,this.resizers[1].y,this.resizers[2].y,this.resizers[3].y);
this.height=maxY-minY;
this.width=maxX-minX;
}
};
this.drawImageTo = function(ctx){
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
ctx.lineCap=this.linecap;
ctx.fillStyle=this.border.color;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
ctx.moveTo(this.resizers[0].x,this.resizers[0].y);
ctx.bezierCurveTo(this.resizers[1].x,this.resizers[1].y,this.resizers[2].x,this.resizers[2].y,this.resizers[3].x,this.resizers[3].y);
ctx.stroke();
if(this.begin.shape.name==="arrow")
$.drawArrow(ctx,this.resizers[1],this.resizers[0],this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
else if(this.begin.shape.name==="diamond"){
$.drawDiamond(ctx,this.resizers[1],this.resizers[0],this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
}
else if(this.begin.shape.name==="dot")
{
ctx.beginPath();
ctx.arc(this.resizers[0].x,this.resizers[0].y,this.begin.shape.radius,0,2*Math.PI);
ctx.stroke();
if(this.begin.shape.type===2)
ctx.fill();
else if(this.begin.shape.type===3){
ctx.fillStyle="white";
ctx.fill();
}
}
ctx.fillStyle=this.border.color;
if(this.end.shape.name==="arrow")
$.drawArrow(ctx,this.resizers[2],this.resizers[3],this.end.shape.type,{size:this.end.shape.size,sharp:this.end.shape.sharp});
else if(this.begin.shape.name==="diamond"){
$.drawDiamond(ctx,this.resizers[2],this.resizers[3],this.begin.shape.type,{size:this.begin.shape.size,sharp:this.begin.shape.sharp});
}
else if(this.end.shape.name==="dot")
{
ctx.beginPath();
ctx.arc(this.resizers[3].x,this.resizers[3].y,this.end.shape.radius,0,2*Math.PI);
ctx.stroke();
if(this.end.shape.type===2)
ctx.fill();
else if(this.end.shape.type===3){
ctx.fillStyle="white";
ctx.fill();
}
}
return this;
};
return this;
};
tooltip=function(option){
var opt={
name:"tooltip",
text:"tooltip",
height:140,
width:280,
corner:{
type:"round", //round,rect
radius:8
},
background:{
filltype:"color",
image:"",
imageType:"fill",
color:"white"
},
font:{
style:"normal",
weight:"normal",
family:"Arial",
size:"10pt",
color:"black",
fill:true
},
paragraph:{
linespace:10,
textalign:"left" //left,center,right
},
tail:{
position:"top", //top,bottom,left,right
margin:16,
size:20
}
};
$.extend(opt,option);
$.extend(this,new note(opt));
this.type="tooltip";
this.setFunctionPoints=function(){
if(this.tail.position=="top"){
if(this.functionPoints.length===0)
this.functionPoints=[
{x:this.tail.margin,y:0,cursor:"pointer",visible:true},
{x:this.tail.margin+this.tail.size/2,y:-15,cursor:"pointer",visible:true},
{x:this.tail.margin+this.tail.size,y:0,cursor:"pointer",visible:true},
];
else
this.functionPoints=[
{x:this.tail.margin,y:0,cursor:"pointer",visible:true},
this.functionPoints[1],
{x:this.tail.margin+this.tail.size,y:0,cursor:"pointer",visible:true},
];
}
else if(this.tail.position=="bottom")
if(this.functionPoints.length===0)
this.functionPoints=[
{x:this.tail.margin,y:this.height,cursor:"pointer",visible:true},
{x:this.tail.margin+this.tail.size/2,y:this.height+this.tail.size,cursor:"pointer",visible:true},
{x:this.tail.margin+this.tail.size,y:this.height,cursor:"pointer",visible:true},
];
else
this.functionPoints=[
{x:this.tail.margin,y:this.height,cursor:"pointer",visible:true},
this.functionPoints[1],
{x:this.tail.margin+this.tail.size,y:this.height,cursor:"pointer",visible:true},
];
else if(this.tail.position=="left")
if(this.functionPoints.length===0)
this.functionPoints=[
{x:0,y:this.tail.margin,cursor:"pointer",visible:true},
{x:-this.tail.size,y:this.tail.margin+this.tail.size/2,cursor:"pointer",visible:true},
{x:0,y:this.tail.margin+this.tail.size,cursor:"pointer",visible:true},
];
else
this.functionPoints=[
{x:0,y:this.tail.margin,cursor:"pointer",visible:true},
this.functionPoints[1],
{x:0,y:this.tail.margin+this.tail.size,cursor:"pointer",visible:true},
];
else if(this.tail.position=="right")
if(this.functionPoints.length===0)
this.functionPoints=[
{x:this.width,y:this.tail.margin,cursor:"pointer",visible:true},
{x:this.width+this.tail.size,y:this.tail.margin+this.tail.size/2,cursor:"pointer",visible:true},
{x:this.width,y:this.margin+this.tail.size,y:this.tail.margin+this.tail.size,cursor:"pointer",visible:true},
];
else
this.functionPoints=[
{x:this.width,y:this.tail.margin,cursor:"pointer",visible:true},
this.functionPoints[1],
{x:this.width,y:this.margin+this.tail.size,y:this.tail.margin+this.tail.size,cursor:"pointer",visible:true},
];
};
this.setFunctionPoints();
this.beforePaint=function(ctx){
this.setFunctionPoints();
};
this.persist=function(){
var r=widget.persistproperty(this);
if(this.paragraph){
r.paragraph={};
$.extend(r.paragraph,this.paragraph);
}
if(this.tail){
r.tail={};
$.extend(r.tail,this.tail);
}
return r;
};
this.drawBorderTo=function(ctx){
ctx.save();
var radius=0;
this.border.width=parseInt(this.border.width);
ctx.beginPath();
ctx.lineWidth=this.border.width;
ctx.strokeStyle=this.border.color;
ctx.fillStyle=this.background.color;
if(typeof this.font==="String")
ctx.font=this.font;
else{
ctx.font=this.font.style+" "+this.font.weight+" "+this.font.size+" "+this.font.family;
}
if(this.border.type!=="solid"&&ctx.setLineDash){
var dashList = this.border.type==="dashed"?[ this.border.width+3, this.border.width+1]:[this.border.width+1,this.border.width+1];
ctx.setLineDash(dashList);
}
if(this.corner.type==="round"){
radius=this.corner.radius;
}
//this.tail.target=this.relativePoint(this.x-200,this.y+100);
if(this.tail.position==="top"){
ctx.moveTo(0,this.height-radius);
ctx.lineTo(0,radius);
ctx.arcTo(0,0,radius,0,radius);
ctx.lineTo(this.functionPoints[0].x,this.functionPoints[0].y);
ctx.lineTo(this.functionPoints[1].x,this.functionPoints[1].y);
ctx.lineTo(this.functionPoints[2].x,this.functionPoints[2].y);
ctx.lineTo(this.width-radius,0);
ctx.arcTo(this.width,0,this.width,radius,radius);
ctx.lineTo(this.width,this.height-radius);
ctx.arcTo(this.width,this.height,this.width-radius,this.height,radius);
ctx.lineTo(radius,this.height);
ctx.arcTo(0,this.height,0,this.height-radius,radius);
ctx.stroke();
}
else if(this.tail.position==="bottom"){
ctx.moveTo(0,this.height-radius);
ctx.lineTo(0,radius);
ctx.arcTo(0,0,radius,0,radius);
ctx.lineTo(this.width-radius,0);
ctx.arcTo(this.width,0,this.width,radius,radius);
ctx.lineTo(this.width,this.height-radius);
ctx.arcTo(this.width,this.height,this.width-radius,this.height,radius);
ctx.lineTo(this.functionPoints[2].x,this.functionPoints[2].y);
ctx.lineTo(this.functionPoints[1].x,this.functionPoints[1].y);
ctx.lineTo(this.functionPoints[0].x,this.functionPoints[0].y);
ctx.lineTo(radius,this.height);
ctx.arcTo(0,this.height,0,this.height-radius,radius);
ctx.stroke();
}
else if(this.tail.position==="right"){
ctx.moveTo(0,this.height-radius);
ctx.lineTo(0,radius);
ctx.arcTo(0,0,radius,0,radius);
ctx.lineTo(this.width-radius,0);
ctx.arcTo(this.width,0,this.width,radius,radius);
ctx.lineTo(this.functionPoints[0].x,this.functionPoints[0].y);
ctx.lineTo(this.functionPoints[1].x,this.functionPoints[1].y);
ctx.lineTo(this.functionPoints[2].x,this.functionPoints[2].y);
ctx.lineTo(this.width,this.height-radius);
ctx.arcTo(this.width,this.height,this.width-radius,this.height,radius);
ctx.lineTo(radius,this.height);
ctx.arcTo(0,this.height,0,this.height-radius,radius);
ctx.stroke();
}
else if(this.tail.position==="left"){
ctx.moveTo(0,this.height-radius);
ctx.lineTo(0,radius+this.tail.margin+this.tail.size);
ctx.lineTo(this.functionPoints[2].x,this.functionPoints[2].y);
ctx.lineTo(this.functionPoints[1].x,this.functionPoints[1].y);
ctx.lineTo(this.functionPoints[0].x,this.functionPoints[0].y);
ctx.lineTo(0,radius);
ctx.arcTo(0,0,radius,0,radius);
ctx.lineTo(this.width-radius,0);
ctx.arcTo(this.width,0,this.width,radius,radius);
ctx.lineTo(this.width,this.height-radius);
ctx.arcTo(this.width,this.height,this.width-radius,this.height,radius);
ctx.lineTo(radius,this.height);
ctx.arcTo(0,this.height,0,this.height-radius,radius);
ctx.stroke();
}
this.fillBackgroundTo(ctx,2);
ctx.clip();
// this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
};
this.afterfunctionPoint=function(ev){
var radius=0;
if(this.corner.type==="round"){
radius=this.corner.radius;
}
if(this.tail.position=="top"){
if(ev.functionPoint==1){
var _x=this.tail.margin+ev.offset.x;
if(_x>radius&&_x<this.width-2*radius-this.tail.size)
this.tail.margin=_x;
}
else if(ev.functionPoint==3){
var _x=this.tail.size+ev.offset.x;
if(_x>15&&_x<this.width-2*radius-this.tail.margin)
this.tail.size=_x;
}
}
else if(this.tail.position=="bottom"){
if(ev.functionPoint==1){
var _x=this.tail.margin+ev.offset.x;
if(_x>radius&&_x<this.width-2*radius-this.tail.size)
this.tail.margin=_x;
}
else if(ev.functionPoint==3){
var _x=this.tail.size+ev.offset.x;
if(_x>15&&_x<this.width-2*radius-this.tail.margin)
this.tail.size=_x;
}
}
else if(this.tail.position=="right"){
if(ev.functionPoint==1){
var _y=this.tail.margin+ev.offset.y;
if(_y>radius&&_y<this.height-2*radius-this.tail.size)
this.tail.margin=_y;
}
else if(ev.functionPoint==3){
var _x=this.tail.size+ev.offset.y;
if(_x>15&&_x<this.height-2*radius-this.tail.margin)
this.tail.size=_x;
}
}
else if(this.tail.position=="left"){
if(ev.functionPoint==1){
var _x=this.tail.margin+ev.offset.y;
if(_x>radius&&_x<this.height-2*radius-this.tail.size)
this.tail.margin=_x;
}
else if(ev.functionPoint==3){
var _x=this.tail.size+ev.offset.y;
if(_x>15&&_x<this.height-2*radius-this.tail.margin)
this.tail.size=_x;
}
}
};
return this;
};
textInput=function(option){
var opt={
name:"textInput",
text:"textInput",
width:150,
height:35,
minheight:15,
margin:10,
shadow:{
color : "none",
offsetX : 4,
offsetY : 4,
blur : 4
},
corner:{
type:"rect", //round,rect
radius:8
},
background:{
filltype:"color",
image:"",
imageType:"fill",
color:"white"
},
border:{
color:"#e5cdcd",
width:1,
type:"solid"
},
font:{
style:"italic",
weight:"normal",
family:"Arial",
size:"10pt",
color:"black",
fill:true
}
};
$.extend(opt,option);
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font"];
this.type="textInput";
};
spirograph=function(option){
var opt={
name:"spirograph",
corner:null,
background:{
filltype:"none",
image: "",
imageType:"fill",
color:"white"
},
border:{
width:1,
type:"solid",
color:"black"
},
width:150,
height:150,
linecap:"round",//butt,square
minheight:20,
minwidth:20,
spirograph:{
R:1,
r:1,
o:40
}
};
$.extend(opt,option);
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","shadow","hyperlink","paragraph"];
this.type="spirograph";
this.persist=function(){
var r=widget.persistproperty(this);
if(this.paragraph)
{
r.paragraph={};
$.extend(r.paragraph,this.paragraph);
}
if(this.spirograph){
r.spirograph={};
$.extend(r.spirograph,this.spirograph);
}
return r;
};
this.drawSpirograph=function(ctx,R,r,o){
var x1=R-o;
var y1=0;
var i=1;
ctx.beginPath();
ctx.moveTo(x1,y1);
do{
if(i>2000) break;
var x2=(R+r)*Math.cos(i*Math.PI/72)-(r+o)*Math.cos(((R+r)/r)*(i*Math.PI/72));
var y2=(R+r)*Math.sin(i*Math.PI/72)-(r+o)*Math.sin(((R+r)/r)*(i*Math.PI/72));
ctx.lineTo(x2,y2);
x1=x2;
y1=y2;
i++;
} while(x2!=R-o && y2!=0);
ctx.stroke();
};
this.drawBorderTo = function(ctx){
var _widget=this;
//this.height=this.width;
this.spirograph.o=Math.min(this.width,this.height)/2;
if(_widget.border.color==="none" && _widget.background && _widget.background.filltype==="color" &&_widget.background.color!="none")
_widget.border.color=_widget.background.color;
else if(_widget.border.color==="none" && _widget.background && _widget.background.filltype==="gradient" &&_widget.gradient.begincolor!="none")
_widget.border.color=_widget.gradient.begincolor;
if (_widget.border.color !== "none") {
ctx.save();
ctx.beginPath();
ctx.lineJoin="round";
_widget.border.width=parseInt(_widget.border.width);
ctx.lineWidth = _widget.border.width;
ctx.lineCap="round";
ctx.strokeStyle = _widget.border.color;
if(_widget.border.type!=="solid"){
var dashList = _widget.border.type==="dashed"?[ _widget.border.width+3, _widget.border.width+1]:[_widget.border.width+1,_widget.border.width+1];
ctx.setLineDash(dashList);
}
ctx.translate(this.width/2,this.height/2);
var radius=this.spirograph.o;
this.drawSpirograph(ctx,radius*(this.spirograph.r+5)/10,-radius*(this.spirograph.R/10),radius/2);
// for (var i=0;i<3;i++){
// for (var j=0;j<3;j++){
// ctx.save();
// ctx.translate(50+j*100,50+i*100);
// this.drawSpirograph(ctx,20*(j+2)/(j+1),-8*(i+3)/(i+1),10);
// ctx.restore();
//
// };
// };
this.drawShadowTo(ctx);
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
}
else{
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
}
return this;
};
};
polygon=function(option){
var opt={
name:"polygon",
corner:null,
background:{
filltype:"none",
image: "",
imageType:"fill",
color:"white"
},
border:{
width:1,
type:"solid",
color:"black"
},
width:150,
height:150,
linecap:"round",//butt,square
minheight:20,
minwidth:20,
polygon:{
sides:7,
startAngle:0
}
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","hyperlink"];
var points=[];
this.type="polygon";
this.persist=function(){
var r=widget.persistproperty(this);
if(this.paragraph)
{
r.paragraph={};
$.extend(r.paragraph,this.paragraph);
}
if(this.polygon){
r.polygon={};
$.extend(r.polygon,this.polygon);
}
return r;
};
var getPolygonPoints=function(centerX,centerY,radius,sides,startAngle){
var points=[], angle=startAngle*Math.PI/180||0;
for(var i=0;i<sides;i++){
points.push({x:centerX+radius*Math.sin(angle),y:centerY-radius*Math.cos(angle)});
angle+=2*Math.PI/sides;
}
return points;
};
this.refresh=function(){
points=getPolygonPoints(this.width/2,this.height/2,this.polygon.radius,this.polygon.sides,this.polygon.startAngle);
};
this.afterresize=function(e){
this.refresh();
};
this.drawBorderTo = function(ctx){
var _widget=this;
var dx=0;
//this.height=this.width;
this.polygon.radius=Math.min(this.height,this.width)/2;
this.refresh();
if(_widget.border.color==="none" && _widget.background && _widget.background.filltype==="color" &&_widget.background.color!="none")
_widget.border.color=_widget.background.color;
else if(_widget.border.color==="none" && _widget.background && _widget.background.filltype==="gradient" &&_widget.gradient.begincolor!="none")
_widget.border.color=_widget.gradient.begincolor;
if (_widget.border.color !== "none") {
ctx.save();
ctx.beginPath();
ctx.lineJoin="round";
_widget.border.width=parseInt(_widget.border.width);
ctx.lineWidth = _widget.border.width;
ctx.lineCap="round";
ctx.strokeStyle = _widget.border.color;
if(_widget.border.type!=="solid"){
var dashList = _widget.border.type==="dashed"?[ _widget.border.width+3, _widget.border.width+1]:[_widget.border.width+1,_widget.border.width+1];
ctx.setLineDash(dashList);
}
if(points.length>0){
ctx.moveTo(points[0].x,points[0].y);
for(var i=1;i<points.length;i++){
ctx.lineTo(points[i].x+dx,points[i].y+dx);
}
ctx.closePath();
}
ctx.stroke();
this.drawShadowTo(ctx);
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
}
else{
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
}
return this;
};
};
triangle=function(option){
var opt={
name:"triangle",
corner:null,
background:{
filltype:"none",
image: "",
imageType:"fill",
color:"white"
},
width:150,
height:150,
linecap:"round",//butt,square,round
afterresize:function(ev){
this.functionPoints[0].x+=ev.offset.x/2;
this.functionPoints[0].x=Math.max(this.functionPoints[0].x,0);
this.functionPoints[0].x=Math.min(this.functionPoints[0].x,this.width);
},
afterfunctionPoint:function(ev){
this.functionPoints[0].y=0;
this.functionPoints[0].x=Math.max(this.functionPoints[0].x,0);
this.functionPoints[0].x=Math.min(this.functionPoints[0].x,this.width);
}
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","hyperlink"];
if(this.functionPoints.length==0)
this.functionPoints=[
{x:150/2,y:0,cursor:"pointer",visible:true}
];
// this.font=null;
this.end=null;
this.type="triangle";
this.drawBorderTo = function(ctx){
var dx=0.5;
ctx.save();
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
ctx.lineCap=this.linecap;
ctx.lineJoin="round";
if(this.border.width>1)
dx=0;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
ctx.moveTo(this.functionPoints[0].x+dx,this.functionPoints[0].y+dx);
ctx.lineTo(this.resizers[2].x+dx,this.resizers[2].y+dx);
ctx.lineTo(this.resizers[3].x+dx,this.resizers[3].y+dx);
ctx.closePath();
ctx.stroke();
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
return this;
};
return this;
};
parallelogram=function(option){
var opt={
name:"parallelogram",
corner:null,
width:150,
height:150,
background:{
filltype:"none",
color:"white"
},
linecap:"round",//butt,square
offsetx:0,
afterresize:function(ev){
if(this.width<this.offsetx+10)
this.width=this.offsetx+10;
},
afterfunctionPoint:function(ev){
this.functionPoints[0].y=0;
var old_offsetx=this.offsetx;
this.offsetx+=ev.offset.x;
if(old_offsetx<0&&this.offsetx<0){
this.width-=ev.offset.x;
this.x+=ev.offset.x;
}
else if(old_offsetx>0&&this.offsetx>0){
this.width+=ev.offset.x;
}
this.setfunctionPoints();
}
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","shadow","hyperlink","paragraph"];
this.setfunctionPoints=function(){
var x1=this.offsetx;
if(x1>=0)
this.functionPoints=[
{x:x1,y:0,cursor:"pointer",visible:true},
];
else
this.functionPoints=[
{x:0,y:0,cursor:"pointer",visible:true},
];
};
if(this.functionPoints.length<1)
this.setfunctionPoints();
// this.font=null;
this.type="parallelogram";
this.drawBorderTo = function(ctx){
var dx=0;
ctx.save();
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
if(this.border.width===1)
dx=0.5;
ctx.lineCap=this.linecap;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
this.setResizers();
ctx.moveTo(this.functionPoints[0].x+dx,this.functionPoints[0].y+dx);
if(this.offsetx>=0){
ctx.lineTo(this.resizers[1].x+dx,this.resizers[1].y+dx);
ctx.lineTo(this.resizers[1].x+dx-this.offsetx,this.resizers[2].y+dx);
ctx.lineTo(this.resizers[2].x+dx,this.resizers[2].y+dx);
}
else{
ctx.lineTo(this.resizers[1].x+dx+this.offsetx,this.resizers[1].y+dx);
ctx.lineTo(this.resizers[3].x+dx,this.resizers[3].y+dx);
ctx.lineTo(this.resizers[2].x+dx-this.offsetx,this.resizers[2].y+dx);
}
ctx.closePath();
ctx.stroke();
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
return this;
};
return this;
};
quadrangle=function(option){
var opt={
name:"quadrangle",
corner:null,
width:150,
height:150,
background:{
filltype:"none",
color:"white"
},
linecap:"round",//butt,square
afterresize:function(ev){
this.functionPoints[1].x+=ev.offset.x;
if(ev.resizer==1||ev.resizer==3)
this.functionPoints[1].x-=2*ev.offset.x;
this.functionPoints[0].x=Math.max(0,this.functionPoints[0].x);
this.functionPoints[0].x=Math.min(this.functionPoints[0].x,this.width/2);
this.functionPoints[1].x=Math.max(this.width/2,this.functionPoints[1].x);
this.functionPoints[1].x=Math.min(this.functionPoints[1].x,this.width);
},
afterfunctionPoint:function(ev){
this.functionPoints[0].y=0;
this.functionPoints[0].x=Math.max(0,this.functionPoints[0].x);
this.functionPoints[0].x=Math.min(this.functionPoints[0].x,this.width/2);
this.functionPoints[1].y=0;
this.functionPoints[1].x=Math.max(this.width/2,this.functionPoints[1].x);
this.functionPoints[1].x=Math.min(this.functionPoints[1].x,this.width);
}
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","hyperlink"];
if(this.functionPoints.length==0)
this.functionPoints=[
{x:0,y:0,cursor:"pointer",visible:true},
{x:this.width,y:0,cursor:"pointer",visible:true}
];
// this.font=null;
this.type="quadrangle";
this.drawBorderTo = function(ctx){
var dx=0.5;
ctx.save();
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
if(this.border.width>1)
dx=0;
ctx.lineCap=this.linecap;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
this.setResizers();
ctx.moveTo(this.functionPoints[0].x+dx,this.functionPoints[0].y+dx);
ctx.lineTo(this.functionPoints[1].x+dx,this.functionPoints[1].y+dx);
ctx.lineTo(this.resizers[3].x+dx,this.resizers[3].y+dx);
ctx.lineTo(this.resizers[2].x+dx,this.resizers[2].y+dx);
ctx.closePath();
ctx.stroke();
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
return this;
};
return this;
};
pentagon=function(option){
var opt={
name:"pentagon",
corner:null,
width:200,
height:150,
linecap:"round",//butt,square
background:{
filltype:"none",
color:"white"
},
arrow:{
sharp:20
},
afterresize:function(ev){
if(this.width<this.arrow.sharp+10)
this.width=this.arrow.sharp+10;
this.setfunctionPoints();
},
afterfunctionPoint:function(ev){
this.arrow.sharp-=ev.offset.x;
if(this.arrow.sharp<0)
this.arrow.sharp=0;
else if(this.arrow.sharp>this.width)
this.arrow.sharp=this.width;
this.setfunctionPoints();
}
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","shadow","hyperlink","paragraph"];
this.setfunctionPoints=function(){
this.functionPoints=[
{x:this.width-this.arrow.sharp,y:0,cursor:"pointer",visible:true}
];
};
if(this.functionPoints.length==0)
this.setfunctionPoints();
// this.font=null;
this.type="pentagon";
this.drawBorderTo = function(ctx){
var dx=0;
ctx.save();
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
if(this.border.width==1)
dx=0.5;
ctx.lineCap=this.linecap;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
this.setResizers();
ctx.moveTo(dx,dx);
ctx.lineTo(this.width-this.arrow.sharp+dx,dx);
ctx.lineTo(this.width+dx,this.height/2+dx);
ctx.lineTo(this.width-this.arrow.sharp+dx,this.height+dx);
ctx.lineTo(dx,this.height+dx);
ctx.lineTo(dx,dx);
ctx.stroke();
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
return this;
};
return this;
};
swallowtailed=function(option){
var opt={
name:"swallowtailed",
corner:null,
width:200,
height:150,
linecap:"round",//butt,square
background:{
filltype:"none",
color:"white"
},
afterresize:function(ev){
if(ev.resizer==2||ev.resizer==4){
this.functionPoints[0].x+=ev.offset.x;
}
},
afterfunctionPoint:function(ev){
this.functionPoints[0].y=0;
this.functionPoints[0].x=Math.max(this.functionPoints[0].x,10);
this.functionPoints[0].x=Math.min(this.functionPoints[0].x,this.width);
}
};
$.extend(opt,option);
if(option.focus)
opt.text="";
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","shadow","hyperlink","paragraph"];
if(this.functionPoints.length==0)
this.functionPoints=[
{x:this.width-20,y:0,cursor:"pointer",visible:true}
];
//this.font=null;
this.type="swallowtailed";
this.drawBorderTo = function(ctx){
var dx=0;
ctx.save();
ctx.beginPath();
ctx.strokeStyle=this.border.color;
ctx.lineWidth=this.border.width;
if(this.border.width===1)
dx=0.5;
ctx.lineCap=this.linecap;
if(this.border.type!="solid"&&ctx.setLineDash){
var dashList =this.border.type==="dashed"?[this.border.width+5, this.border.width+2]:[this.border.width+2,this.border.width+2];
ctx.setLineDash(dashList);
}
this.setResizers();
ctx.moveTo(this.resizers[0].x+dx,this.resizers[0].y+dx);
ctx.lineTo(this.functionPoints[0].x+dx,this.functionPoints[0].y+dx);
ctx.lineTo(this.width+dx,this.height/2+dx);
ctx.lineTo(this.functionPoints[0].x+dx,this.height+dx);
ctx.lineTo(this.resizers[2].x+dx,this.resizers[2].y+dx);
ctx.lineTo(this.width-this.functionPoints[0].x+dx,this.height/2+dx);
ctx.closePath();
ctx.stroke();
this.fillBackgroundTo(ctx,2);
ctx.clip();
this.fillBackgroundTo(ctx);
this.drawImageTo(ctx);
ctx.restore();
return this;
};
return this;
};
// header=function(option){
// var opt={
// name:"header",
// corner:null,
// width:200,
// height:80,
// margin:10,
// allowdrop:true,
// linecap:"round",//butt,square
// border:{
// width :2,
// type:"solid", //solid, dotted,dashed
// color : "#ddd"
// },
// shadow:{
// color:"none"
// },
// background:{
// filltype:"color",
// color:"#000000"
// },
// font:{
// style:"normal", //normal, italic
// weight:"bold", //normal,bold
// family:"Arial",
// size:"11pt",
// color:"white",
// fill:true
// },
// paragraph:{
// linespace:10,
// textalign:"center", //left,center,right
// textvalign:"bottom" //top,middle,bottom
//
// },
// afterresize:function(ev){
// this.setfunctionPoints();
// },
// afterfunctionPoint:function(ev){
// this.height+=ev.offset.y;
// this.setfunctionPoints();
// }
// };
// $.extend(opt,option);
// if(option.focus)
// opt.font.color="white";
// $.extend(this,new note(opt));
// this.allowconnectionPoint=false;
// this.allowRotate=false;
// this.setfunctionPoints=function(){
// this.functionPoints=[
// {x:this.width/2,y:this.height,cursor:"pointer",visible:true}
// ];
// };
// if(this.functionPoints.length==0)
// this.setfunctionPoints();
// this.type="header";
// this.drop=function(ev){
// var e=ev.originalEvent;
// var data=e.dataTransfer.getData("text");
// var _widget=this.createWidget(data);
// this.appendWidget(_widget);
// ev.cancel=true;
// };
// this.beforePaint=function(){
// this.x=-this.border.width;
// this.y=-this.border.width;
// this.width=parseInt(this.parent.width)+2*this.border.width;
// this.height=Math.min(parseInt(this.parent.height)/2,this.height);
// this.height=Math.max(20,this.height);
// this.setfunctionPoints();
// };
// return this;
// };
//
// header.prototype.createWidget=function(data){
// var font={
// style:"normal", //normal, italic
// weight:"normal", //normal,bold
// family:"verdana",//微软雅黑
// size:"11pt",
// color:"black",
// fill:true
// };
// var panel=this.presenters[0];
// data=data.substring(data.indexOf(":")+1,data.length);
// var opt;
// var widgetType;
// if(data.indexOf("custom:")==0){
// var id=data.substring("7",data.length);
// widgetModel=$.model(ctx+"/api/visorwidget/"+id);
// var _a=widgetModel.items()[0];
// opt=JSON.parse(_a.content);
// opt.name=panel.getName(opt.type);
// if(opt.background.image!=null&&opt.background.filltype==null)
// opt.background.filltype="image";
// opt.text=opt.text;
// opt.focus=true;
// opt.editable=true;
// opt.click=designer.widgetClickEvent;
// widgetType=opt.type;
// }
// else if(data.indexOf("image:")==0){
// var url=data.substring("6",data.length);
// opt={};
// opt.type="box";
// opt.name=panel.getName(opt.type);
// opt.text="";
// opt.focus=true;
// opt.background={
// filltype:"image",
// image:url,
// imageType:"fill",
// color:"none"
// };
// opt.border={
// color:"none"
// };
// opt.editable=true;
// opt.click=designer.widgetClickEvent;
// widgetType=opt.type;
// }
// else{
// var widgetName;
// var option={};
// if(data.indexOf(":")<0){
// widgetType=data;
// }
// else{
// widgetType=data.substring(0, data.indexOf(":"));
// option=JSON.parse(data.substring(data.indexOf(":")+1,data.length));
// }
// widgetName=panel.getName(widgetType);
// opt={
// name:widgetName,
// text:widgetName,
// focus:true,
// editable:true,
// font:font,
// ondelete:designer.widgetDeleteEvent,
// click:designer.widgetClickEvent
// };
// $.extend(opt,option);
// }
// var _widget=$.widgets(widgetType,opt);
// return _widget;
// };
//
// footer=function(option){
// var opt={
// name:"footer",
// corner:null,
// width:200,
// height:78,
// linecap:"round",//butt,square
// border:{
// width : 2,
// type:"solid", //solid, dotted,dashed
// color : "#ddd"
// },
// shadow:{
// color:"none"
// },
// background:{
// filltype:"color",
// color:"#fffbff"
// },
// afterresize:function(ev){
// this.setfunctionPoints();
// },
// afterfunctionPoint:function(ev){
// this.height-=ev.offset.y;
// this.setfunctionPoints();
// }
// };
// $.extend(opt,option);
// if(option.focus)
// opt.text="";
// $.extend(this,new note(opt));
// this.allowconnectionPoint=false;
// this.allowRotate=false;
// this.autosize=true;
// this.setfunctionPoints=function(){
// this.functionPoints=[
// {x:this.width/2,y:0,cursor:"pointer",visible:true}
// ];
// };
// if(this.functionPoints.length==0)
// this.setfunctionPoints();
// this.type="footer";
// this.beforePaint=function(){
// this.x=-this.border.width;
// this.y=this.parent.height-this.height+this.border.width;
// this.width=parseInt(this.parent.width)+2*this.border.width;
// this.height=Math.min(parseInt(this.parent.height)/2,this.height);
// this.height=Math.max(20,this.height);
// this.setfunctionPoints();
// };
// return this;
// };
//
// searchBox=function(option){
// var opt={
// name:"searchBox",
// margin:0,
// height:40,
// width:134,
// filltype:"image",
// border:{
// width:1,
// type:"solid",
// color:"none"
// },
// background:{
// filltype:"image",
// image: ctx+"/res/images/visor/searchbar.png",
// imageType:"fill",
// color:"none"
// }
// };
// $.extend(opt,option);
// if(option.focus)
// opt.text="";
// $.extend(this,new header(opt));
// this.type="searchBox";
// return this;
// };
//
// keyboard=function(option){
// var opt={
// name:"keyboard",
// margin:0,
// height:205,
// width:134,
// filltype:"image",
// border:{
// width:1,
// type:"solid",
// color:"none"
// },
// background:{
// filltype:"image",
// image: ctx+"/res/images/visor/keyboard2.png",
// imageType:"fill",
// color:"none"
// }
// };
// $.extend(opt,option);
// if(option.focus)
// opt.text="";
// $.extend(this,new footer(opt));
// this.type="keyboard";
// return this;
// };
//
// imageButton=function(option){
// var opt={
// name:"imageButton",
// margin:0,
// height:50,
// width:134,
// filltype:"image",
// border:{
// width:1,
// type:"solid",
// color:"none"
// },
// background:{
// filltype:"image",
// image: ctx+"/res/images/visor/sample.png",
// imageType:"fill",
// color:"none"
// }
// };
// $.extend(opt,option);
// $.extend(this,new button(opt));
// this.type="imageButton";
// return this;
//};
// button=function(option){
// var opt={
// name:"button",
// text:"button",
// width:120,
// height:30,
// margin:12,
// shadow:{
// color:"none"
// },
// corner:{
// type:"round", //round,rect
// radius:4
// },
// background:{
// filltype:"color",
// image:"",
// imageType:"fill",
// color:"#ccc"
// },
// font:{
// style:"normal", // normal,italic,
// weight:"normal",//normal,lighter,bold
// family:"Arial",
// size:"10pt",
// color:"black",
// fill:true
// },
// border:{
// width:1,
// type:"solid",
// color:"#4B4B4B"
// },
// autosize:false
// };
// $.extend(opt,option);
// $.extend(this,new note(opt));
// this.type="button";
// };
spirit=function(option){
var opt={
name:"spirit",
width:121,
height:168,
text:"",
font:null,
border:{
color:"none",
width:1,
type:"solid"
},
background:{
filltype:"images",
color : "white",
image : null,
imageType : "fill"
},
spirit:{
images:[],
index:0,
interval:6,
direction:"forward",
autoplay:false
},
mousedown:function(e){
this.oldx=e.x;
this.oldy=e.y;
this.isdown=true;
},
mousemove:function(e){
var size=2;
if(this.isdown){
var dx=e.x-this.oldx;
this.oldx=e.x;
this.oldy=e.y;
if(dx>=size){
this.spirit.index++;
if(this.spirit.index==this.spirit.images.length)
this.spirit.index=0;
this.paint();
}
else if(dx<=-size){
this.spirit.index--;
if(this.spirit.index<0)
this.spirit.index=this.spirit.images.length-1;
this.paint();
}
}
},
mouseup:function(e){
this.isdown=false;
},
click:function(e){
this.spirit.index++;
if(this.spirit.index==this.spirit.images.length)
this.spirit.index=0;
this.paint();
}
};
$.extend(opt,option);
$.extend(this,new note(opt));
this.propertyEditors=["common","border","font","background","shadow","hyperlink","paragraph"];
this.spirit.direction=this.spirit.direction||"forward1";
this.type="spirit";
this.isdown=false;
this.init=function(){
var _images=[];
$(this.spirit.images).each(function(i,item){
var image="";
if(typeof item==="string")
image=item;
else
image=item.value;
if(typeof image==="string"){
var img=new Image();
img.src=image;
_images.push(img);
}
});
this.spirit._images=_images;
this.spirit.index=this.spirit.index||0;
this.spirit.interval=this.spirit.interval||1;
};
this.init();
var pan=0;
this.panright=function(e){
pan++;
if(pan==3){
this.forward();
this.paint();
pan=0;
}
};
this.panleft=function(e){
pan++;
if(pan==3){
this.backward();
this.paint();
pan=0;
}
};
this.appendPresenter = function(presenter) {
this.parent=presenter.rootwidget;
this.root=presenter.rootwidget;
presenter.widgets.push(this);
this.depth = presenter.widgets.length;
this.presenters.push(presenter);
if(this.spirit.autoplay){
if(!presenter.globalAnimations)
presenter.globalAnimations=[];
presenter.globalAnimations.push(this);
}
return this;
};
this.persist=function(){
var r=widget.persistproperty(this);
r.spirit={};
r.spirit.images=[];
r.spirit.autoplay=this.spirit.autoplay;
r.spirit.interval=this.spirit.interval;
$(this.spirit.images).each(function(i,image){
r.spirit.images.push(image);
});
return r;
};
this.drawImageTo = function(ctx) {
var _widget=this;
var image=null;
if(_widget.background==null||(_widget.background.filltype!="images"&&_widget.background.filltype!="image"))
return;
if(_widget.background.filltype=="images"){
if(this.spirit.index<this.spirit.images.length){
image=this.spirit._images[this.spirit.index];
}
if(image==null)
image = _widget.background.image;
}
else{
image = _widget.background.image;
}
var type = _widget.background.imageType ? _widget.background.imageType : "fit";
if (image) {
if (type === "fit") {
var _w = 0, _h, _x = 0, _y = 0;
if (image.width > _widget.width) {
_w = _widget.width;
_h = (image.height / image.width) * _w;
if (_h > _widget.height) {
_h = _widget.height;
_w = (image.width / image.height) * _h;
}
} else {
_h = _widget.height;
_w = (image.width / image.height) * _h;
if (_w > _widget.width) {
_w = _widget.width;
_h = (image.height / image.width) * _w;
}
}
_x = (_widget.width - _w) / 2;
_y = (_widget.height - _h) / 2;
ctx.drawImage(image, _x, _y, _w, _h);
} else if (type === "repeat") {
var _w = _widget.width, _h = _widget.height, _x = 0, _y = 0;
while (true) {
ctx.drawImage(image, _x, _y, image.width,image.height);
_x += image.width;
if (_x > _w) {
_y += image.height;
if (_y < _h) {
_x = 0;
} else {
break;
}
}
}
} else if (type === "fill") {
ctx.drawImage(image, 0, 0, _widget.width,_widget.height);
} else if (type === "center") {
var _w = image.width, _h = image.height, _x = 0, _y = 0;
_x = (_widget.width - _w) / 2;
_y = (_widget.height - _h) / 2;
ctx.drawImage(image, _x, _y, _w, _h);
}
}
return this;
};
var timeStamp=0;
this.run=function(){
var ths=this;
var startValues={index:0};
var endValues={index:this.spirit.images.length-1};
var tweenA=new TWEEN.Tween(startValues).to(endValues, ths.spirit.interval*1000).delay(0).repeat(Infinity).easing(TWEEN.Easing.Linear.None).onUpdate(function(){
for(var s in startValues){
ths.spirit[s]=parseInt(this[s]);
}
}).onComplete(function(){
});
tweenA.start();
};
};
// $.register("searchBox",searchBox);
// $.register("keyboard",keyboard);
// $.register("header",header);
// $.register("footer",footer);
// $.register("imageButton",imageButton);
// $.register("button",button);
$.register("box",box);
$.register("label",label);
$.register("note",note);
$.register("link",link);
$.register("checkbox",checkbox);
$.register("textInput",textInput);
$.register("tooltip",tooltip);
$.register("radio",radio);
$.register("line",line);
$.register("curve",quadraticCurve);
$.register("bezierCurve",bezierCurve);
$.register("triangle",triangle);
$.register("quadrangle",quadrangle);
$.register("parallelogram",parallelogram);
$.register("pentagon",pentagon);
$.register("swallowtailed",swallowtailed);
$.register("circle",circle);
$.register("noticeboard",noticeboard);
$.register("polygon",polygon);
$.register("spirograph",spirograph);
$.register("spirit",spirit);
})(jQuery);
Loading...
举报
请认真填写举报原因，尽可能描述详细。
请选择举报类型
误判申诉
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化