View
Theme
Font Style
7pt
8pt
9pt
10pt
11pt
Line Style
100%
110%
120%
130%
140%
Bold Keyword
Default
Inspector
Kkaefer
Eclipse
SQ Light
Lesser
Dark
Cobalt
Monokai
Rubyblue
Night
SQ Dark
Ambiance
Blackboard
Line Num.
Wrap Lines
Preview
Redraw
JS Tab
HTML Tab
CSS Tab
Live Tab
Prev. Tab
Next Tab
Browser
History…
Help
Edit
Settings
Auto Complete
Match Brackets
Match Highlight
Strip Whitespace
Auto Close Brackets
Auto Close Quotes
Show Print Margin
Undo
Redo
Delete
Select Line
Select All
Find & Replace
Find
Find in Repo.
Find Next
Find Previous
Replace Single
Replace All
Wrap Search
Revert
As Template
Diff Revision
Format
Compress
Text
Zen Coding
Indent
Tab Width
1
2
3
4
5
6
7
8
Indent Unit
1
2
3
4
5
6
7
8
Smart Indent
Use Tabs
Visible Tabs
Shift Left
Shift Right
Put Indent
Number
Increment by 1
Decrement by 1
Increment by 0.1
Decrement by 0.1
Increment by 10
Decrement by 10
Simple Math
Comment
Line
Move Up
Move Down
Copy Up
Copy Down
Go to Line…
Remove Line
Next Point
Prev. Point
Help
Share
Login
You can jump to the latest bin by adding
/latest
to your URL
×
z
Find
→
←
⟲
Replace
⊗
All
Replace
var testingCanvas = document.createElement('canvas'); if (!testingCanvas || !testingCanvas.getContext) unsupported(); var testingContext = testingCanvas.getContext('2d'); if (!testingContext) unsupported(); function unsupported() { // disable handlers and leave window.init = null; window.onbeforeunload = null; window.onunload = null; window.location = "http://html5readiness.com/"; }
Anchor Modeler
File
New model...
Load public model from cloud...
Load private model from cloud...
Save model in cloud...
Load model from local file...
Save model to local file...
Load example model
Layout
Toggle names
Toggle mnemonics
Toggle cardinalities
Toggle shadows
Change detail level
Toggle fixation
Release all fixed
Reset view
Randomize layout
Generate
XML code
HTML documentation
SQL code
PNG screenshot
SVG graphics
SVG code
Pause
Zoom+
Zoom-
Redo
Undo
None selected
Help
Tutorials
About
Defaults
Capsule
Identity
Time range
Historization suffix
Identity suffix
Metadata prefix
Metadata type
Use metadata
Mono-temporal
Bi-temporal
Temporalization
Microsoft SQL Server
Oracle
Target database
Reset to default values
Settings
% Damping
px Normal distance
px/s Stopping velocity
px/s Minimum starting velocity
px/s Maximum starting velocity
Node influence factor
Edge stiffness factor
fps Target frame rate
Miniature refresh interval
Simplified
Adjustable
Calculations
Reset settings to default values
Toggle debug
body { font: 75% georgia, sans-serif; line-height: 1.88889; color: #000000; background: #f9f8f7; overflow: hidden; margin: 0; padding: 0; } .unselectable { user-select: none; -moz-user-select: none; -khtml-user-select: none; } .invisible { opacity: 0; filter: alpha(opacity=0); z-index: 1000; position: absolute; left: 0; } .editable:invalid { background-color: #fbb; } .closebutton { display: none; background-image: url(deleteButton.png); position: absolute; left: -15px; top: -15px; height: 30px; width: 30px; z-index: 14; } .closebutton:active { background-image: url(deleteButtonPressed.png); } /* visible canvas - at the bottom of the visible layers */ #canvas { position: absolute; top: 0px; left: 0px; z-index: 1; } /* invisible canvas - at the very z-bottom */ #shadow { position: absolute; top: 0px; left: 0px; display: none; z-index: 0; } /* Removed due to memory issues #maxiature { position: absolute; top: 0px; left: 0px; width: 0px; height: 0px; display: none; z-index: 0; } */ /* minature canvas - positioned in the southeast corner */ #miniature { position: absolute; bottom: 40px; right: 42px; background-color: #fff; z-index: 2; box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); } #search { position: absolute; top: 42px; left: 50%; margin-left: -150px; /* half of the actual width */ display: block; z-index: 9; } #search input { width: 150px; text-align: left; background-color: rgba(255, 255, 255, 0.9); } #search select { width: 150px; text-align: left; background-color: rgba(255, 255, 255, 0.9); } /* shows login status to the cloud (google app engine) */ #cloud { font: 8pt sans-serif; position: absolute; color: black; text-align: left; bottom: 12px; left: 12px; cursor: pointer; display: block; z-index: 10; } /* shows model name if cloud based or local */ #model { font: 8pt sans-serif; position: absolute; color: black; text-align: left; bottom: 26px; left: 12px; display: block; z-index: 10; } /* context menu that pops up when editing */ #contextMenu { position: absolute; top: 0; left: 0; display: block; background-color: rgba(212, 212, 212, 0.8); color: black; padding: 0; margin: 0; text-align: left; border: 2px solid #fff; z-index: 11; box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); } #contextMenu .items { margin: 10px 10px 5px 10px; } #contextMenu .topper { font: 10px sans-serif; cursor: move; color: #333; height: 15px; padding-top: 2px; padding-left: 24px; border-bottom: 1px solid #888; background-color: rgba(255, 255, 255, 0.8); } #contextMenu .divider { border-top: 1px dotted #888; height: 2px; } .toggler { position: absolute; margin: 0; padding: 0; border: 1px solid #555; width: 16px; height: 16px; z-index: 12; } .expanded { cursor: nw-resize; background-color: #f55; } .collapsed { cursor: se-resize; left: -3px; top: -3px; background-color: #fff; box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); } .collapsed:hover { background-color: #fa5; } .operators { position: relative; margin: 0px 5px 5px 5px; padding: 5px 0px 0px 0px; top: 0; left: 0; } .operator { margin: 0; line-height: 25px; text-align: left; cursor: pointer; white-space: nowrap; padding-right: 10px; padding-left: 10px; z-index: 8; } .operator:hover { color: white; background-color: rgba(128, 128, 128, 0.8); text-decoration: none; text-shadow: 0px 0px 6px #555; } /* is used in the code popover */ #modalBackground { position: absolute; top: 0; left: 0; background-color: rgba(142, 128, 128, 0.5); margin: 0; padding: 0; overflow: hidden; z-index: 10; } #urlPopover { position: relative; border: 2px solid white; top: 5%; margin: auto; display: table; background-color: rgba(249, 248, 247, 0.95); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); z-index: 11; } #urlPopover .closebutton { display: inherit; position: relative; } #urlPopover #content { margin-top: -30px; padding: 0; } #cloudBrowserPopover { position: relative; border: 2px solid white; top: 5%; margin: auto; display: table; background-color: rgba(249, 248, 247, 0.95); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); z-index: 11; } #cloudBrowserPopover .closebutton { display: inherit; position: relative; } #cloudBrowserPopover #content { margin: -10px 10px 20px 10px; padding: 0; } #cloudBrowserPopover #content div { display: inline-block; text-align: center; color: black; border-width: medium; border-style: inset; margin: 0px 5px 10px 5px; padding: 8px; cursor: pointer; } #cloudBrowserPopover #content img { background: #fff; border: 1px solid black; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); } .modelName { font: 100% georgia, sans-serif; } .modelKeywords { font: 75% georgia, sans-serif; } #cloudSaverPopover { position: relative; border: 2px solid white; top: 5%; margin: auto; display: table; background-color: rgba(249, 248, 247, 0.95); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); z-index: 11; } #cloudSaverPopover .closebutton { display: inherit; position: relative; } #cloudSaverPopover #content { margin: -10px 10px 10px 10px; padding: 0; text-align: center; } #cloudSaverPopover #content table { margin-top: 20px; margin-bottom: 20px; } #cloudSaverPopover #content td { font: 84% georgia, sans-serif; color: black; padding-top: 5px; text-align: left; } #cloudSaverPopover #content img { background: #fff; border: 1px solid black; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); } /* these classes style the xml representation */ #codePopover { position: relative; border: 2px solid black; top: 5%; margin: auto; display: table; background-color: rgba(8, 0, 0, 0.8); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5); z-index: 11; } #codePopover .closebutton { display: inherit; position: relative; } #content { position: relative; margin-top: -30px; text-align: left; font: 125% Andale Mono, monospace; color: white; padding: 15px 20px; overflow: auto; background-color: transparent; z-index: 12; } #content .tabs { visibility: hidden; } #content .texts { color: #f55; font-weight: bold; } #content .brackets { color: white; } #content .elements { color: #ffffc0; } #content .attributes { color: #c0c0c0; font-weight: bold; } #content .values { color: #ffc0c0; font-style: italic; } .preformatted { white-space: pre; } /* Menus and control buttons */ ul, li, table, tr, td { list-style-type: none; margin: 0; padding: 0; border: 0; border-collapse: collapse; } td { padding: 0px 5px 2px 5px; } #header { font: 10pt georgia, sans-serif; position: relative; margin: 0; padding: 0; top: 0; left: 0; height: 32px; display: block; background-color: rgba(212, 212, 212, 0.9); color: black; border-bottom: 2px solid #fff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); z-index: 7; } /* http://www.ie7nomore.com/fun/menu2/ */ /* TODO: position using relative instead */ #actions, #settings, #file, #generate, #about, #defaults { position: absolute; display: block; top: 0px; z-index: 42; } #file { left: 8px; text-align: left; z-index: 43; } #actions { left: 50px; text-align: left; z-index: 44; } #generate { left: 110px; text-align: left; z-index: 45; } #defaults { right: 130px; text-align: right; z-index: 45; } #settings { right: 60px; text-align: right; z-index: 44; } #about { right: 8px; text-align: right; z-index: 43; } .menu { font: 10pt georgia, sans-serif; margin: 0; cursor: pointer; list-style: none; } .menu li { padding-left: 8px; padding-right: 8px; line-height: 32px; } .menu > li { display: inline-block; } .submenu { opacity: 0; background-color: rgba(212, 212, 212, 0.9); white-space: nowrap; border: 2px solid #fff; box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5); z-index: 9; } .submenu li { height: 0; line-height: 25px; list-style-type: none; margin: 0; padding-right: 8px; padding-left: 8px; text-align: left; } .menu > li:hover .submenu, .menu > li.focus .submenu { opacity: 1; } .menu > li:hover .submenu li, .menu > li.focus .submenu li { height: 25px; } .submenu li:hover { color: white; background-color: rgba(128, 128, 128, 0.8); text-decoration: none; text-shadow: 0px 0px 6px #555; } .submenu select { width: 130px; } .submenu input { width: 45px; } .submenu .inputDefaults { width: 125px; } #controls { position: absolute; top: 0px; left: 50%; margin-left: -200px; /* half of the actual width */ height: 32px; display: block; z-index: 555; } #controls .playing { background-color: #fa5; } #controls .pausing { /* just go back to normal */ } #controls div { cursor: pointer; position: relative; top: 0; display: inline-block; width: 100px; height: 16px; padding: 8px 0 8px 20px; margin: 0; border: 0; background: #b55; color: #fff; text-decoration: none; text-shadow: 0px 0px 6px #777; -moz-border-radius: 10px 0 / 40px 0; -webkit-border-radius: 10px 0 / 40px 0; border-radius: 10px 0 / 40px 0; -webkit-transition: .5s; -moz-transition: .5s; transition: .5s; } #controls div:hover { background: #f77; } #controls div + div { margin-left: -50px; }
Pop out
Help
About
×
×