-
199static/lib/timeline/CHANGELOG
-
176static/lib/timeline/LICENSE
-
14static/lib/timeline/NOTICE
-
66static/lib/timeline/README
-
92static/lib/timeline/doc/default.css
-
BINstatic/lib/timeline/doc/img/structure_box.png
-
310static/lib/timeline/doc/img/structure_box.svg
-
BINstatic/lib/timeline/doc/img/structure_dot.png
-
286static/lib/timeline/doc/img/structure_dot.svg
-
BINstatic/lib/timeline/doc/img/structure_range.png
-
327static/lib/timeline/doc/img/structure_range.svg
-
1696static/lib/timeline/doc/index.html
-
234static/lib/timeline/doc/jsdoc/files.html
-
282static/lib/timeline/doc/jsdoc/index.html
-
392static/lib/timeline/doc/jsdoc/symbols/Array.html
-
325static/lib/timeline/doc/jsdoc/symbols/_global_.html
-
570static/lib/timeline/doc/jsdoc/symbols/links.Timeline.ClusterGenerator.html
-
1039static/lib/timeline/doc/jsdoc/symbols/links.Timeline.Item.html
-
895static/lib/timeline/doc/jsdoc/symbols/links.Timeline.ItemBox.html
-
893static/lib/timeline/doc/jsdoc/symbols/links.Timeline.ItemDot.html
-
906static/lib/timeline/doc/jsdoc/symbols/links.Timeline.ItemFloatingRange.html
-
906static/lib/timeline/doc/jsdoc/symbols/links.Timeline.ItemRange.html
-
1016static/lib/timeline/doc/jsdoc/symbols/links.Timeline.StepDate.html
-
5812static/lib/timeline/doc/jsdoc/symbols/links.Timeline.html
-
7013static/lib/timeline/doc/jsdoc/symbols/src/timeline.js.html
-
2static/lib/timeline/doc/prettify/lang-apollo.js
-
2static/lib/timeline/doc/prettify/lang-css.js
-
2static/lib/timeline/doc/prettify/lang-hs.js
-
2static/lib/timeline/doc/prettify/lang-lisp.js
-
2static/lib/timeline/doc/prettify/lang-lua.js
-
2static/lib/timeline/doc/prettify/lang-ml.js
-
1static/lib/timeline/doc/prettify/lang-proto.js
-
2static/lib/timeline/doc/prettify/lang-scala.js
-
2static/lib/timeline/doc/prettify/lang-sql.js
-
2static/lib/timeline/doc/prettify/lang-vb.js
-
3static/lib/timeline/doc/prettify/lang-vhdl.js
-
2static/lib/timeline/doc/prettify/lang-wiki.js
-
2static/lib/timeline/doc/prettify/lang-yaml.js
-
1static/lib/timeline/doc/prettify/prettify.css
-
33static/lib/timeline/doc/prettify/prettify.js
-
63static/lib/timeline/doc/sourcecode.html
-
BINstatic/lib/timeline/doc/timeline.png
-
BINstatic/lib/timeline/doc/timeline120x60.png
-
51static/lib/timeline/examples/data.php
-
87static/lib/timeline/examples/default.css
-
71static/lib/timeline/examples/example01_basis.html
-
205static/lib/timeline/examples/example02_interactive.html
-
125static/lib/timeline/examples/example03_performance.html
-
80static/lib/timeline/examples/example04_format_dot.html
-
174static/lib/timeline/examples/example05_format_custom_html.html
-
138static/lib/timeline/examples/example06_format_custom_css.html
-
166static/lib/timeline/examples/example07_confirm_changes.html
-
99static/lib/timeline/examples/example08_calendar.html
-
196static/lib/timeline/examples/example09_editable.html
-
120static/lib/timeline/examples/example10_link_two_timelines.html
-
106static/lib/timeline/examples/example11_datasource.html
-
72static/lib/timeline/examples/example12_millisecondscale.html
-
144static/lib/timeline/examples/example13_grouping.html
-
91static/lib/timeline/examples/example14_past_and_future.html
-
201static/lib/timeline/examples/example15_mobile.html
-
159static/lib/timeline/examples/example16_performance_grouping.html
-
103static/lib/timeline/examples/example17_json_data.html
-
49static/lib/timeline/examples/example18_limit_range.html
-
145static/lib/timeline/examples/example19_bar_graph.html
-
127static/lib/timeline/examples/example20_custom_class_names.html
-
117static/lib/timeline/examples/example21_animate_visible_range.html
-
106static/lib/timeline/examples/example22_clustering.html
-
100static/lib/timeline/examples/example24_individual_editable_events.html
-
182static/lib/timeline/examples/example25_new_item_type.html
-
93static/lib/timeline/examples/example26_localization.html
-
110static/lib/timeline/examples/example27_jquery_themeroller.html
-
120static/lib/timeline/examples/example28_custom_controls.html
-
142static/lib/timeline/examples/example29_stacking_with_grouping.html
-
73static/lib/timeline/examples/example30_floatingRange.html
-
BINstatic/lib/timeline/examples/img/Hardware-Mobile-Phone-icon.png
-
BINstatic/lib/timeline/examples/img/attachment-icon.png
-
BINstatic/lib/timeline/examples/img/blog-post-edit-icon.png
-
BINstatic/lib/timeline/examples/img/comments-icon.png
-
BINstatic/lib/timeline/examples/img/community-users-icon.png
-
17static/lib/timeline/examples/img/license.txt
-
36static/lib/timeline/examples/img/license_aesthetica-2.txt
-
26static/lib/timeline/examples/img/license_refresh-cl.txt
-
BINstatic/lib/timeline/examples/img/mail-icon.png
-
BINstatic/lib/timeline/examples/img/notes-edit-icon.png
-
BINstatic/lib/timeline/examples/img/product-icon.png
-
BINstatic/lib/timeline/examples/img/truck-icon.png
-
41static/lib/timeline/examples/index.html
-
BINstatic/lib/timeline/img/16/moveleft.png
-
BINstatic/lib/timeline/img/16/moveright.png
-
BINstatic/lib/timeline/img/16/new.png
-
BINstatic/lib/timeline/img/16/zoomin.png
-
BINstatic/lib/timeline/img/16/zoomout.png
-
BINstatic/lib/timeline/img/24/delete.png
-
BINstatic/lib/timeline/img/24/moveleft.png
-
BINstatic/lib/timeline/img/24/moveright.png
-
BINstatic/lib/timeline/img/24/new.png
-
BINstatic/lib/timeline/img/24/zoomin.png
-
BINstatic/lib/timeline/img/24/zoomout.png
-
BINstatic/lib/timeline/img/32/delete.png
-
BINstatic/lib/timeline/img/32/moveleft.png
@ -1,199 +0,0 @@ |
|||||
CHAP Links Library - Timeline |
|
||||
|
|
||||
|
|
||||
2015-03-04, version 2.9.1 |
|
||||
|
|
||||
- Fixed broken option `groupsWidth`. |
|
||||
- Fixed group height collapsing when there are no items, height now reckons |
|
||||
with the label height. |
|
||||
- Added Brazilian Portuguese locale, thanks @gmmoreira. |
|
||||
- Added locales Portuguese, Chinese, Arabic, Japanese, Korean. Thanks Mario |
|
||||
Fischer. |
|
||||
- Added Polish locale, thanks @pbrzoski. |
|
||||
|
|
||||
|
|
||||
2014-07-28, version 2.9.0 |
|
||||
|
|
||||
- Implemented function `getCluster()`, `getClusterIndex()` and `getSelection()`. |
|
||||
Thanks @igui. |
|
||||
- Added option `clusterMaxItems`. Thanks @igui. |
|
||||
- Fixed 'change' event not being fired when dragging the left or right side |
|
||||
of a range. |
|
||||
- Fixed restoring original dates after canceling a changed item. |
|
||||
|
|
||||
|
|
||||
2014-05-16, version 2.8.0 |
|
||||
|
|
||||
- Implemented a new item type, `FloatingRange`. Thanks Nick Hardy (@NickHardy). |
|
||||
- Implemented options `groupMinHeight`. Thanks @sapeish. |
|
||||
- Fixed event `add` not triggered in case of ctrl+click to add a new item. |
|
||||
Thanks @sapeish. |
|
||||
|
|
||||
|
|
||||
2014-04-09, version 2.7.0 |
|
||||
|
|
||||
- Implemented option `timeChangeable` which allows to have items which can be |
|
||||
moved to a different group but not moved in time. |
|
||||
Thanks Martin Fischer (hansmaulwurf23). |
|
||||
- Implemented function `getVisibleItems(start, end)`. Thanks StephanieHe. |
|
||||
- Added Finish locale. Thanks magandrez. |
|
||||
- Changed default type of a newly created item from range to box. |
|
||||
|
|
||||
|
|
||||
2014-01-14, version 2.6.1 |
|
||||
|
|
||||
- Function `Timeline.getItem` now also returns foreign fields available in the |
|
||||
items data. |
|
||||
|
|
||||
|
|
||||
2014-01-13, version 2.6.0 |
|
||||
|
|
||||
- Implemented support for stacking items within groups. Thanks Stefano Fornari. |
|
||||
- Added Turkish locale. Thanks Batuhan Kucukali (LadyArch3r). |
|
||||
|
|
||||
|
|
||||
2013-12-13, version 2.5.1 |
|
||||
|
|
||||
- Added option groupsOrder, which is `true` by default and can be used to provide |
|
||||
a custom group order (or no ordering at all by setting the option to `false`). |
|
||||
(Thanks hansmaulwurf23). |
|
||||
- Rename event `change` to `changed`, added event `change` which fires |
|
||||
repeatedly when an item is being changed. (Thanks bensleveritt). |
|
||||
- Fixed an off-by-one error in mapping columns of a Google DataTable. |
|
||||
- Fixed `type` not being read correctly from a Google DataTable. |
|
||||
Thanks boblepepeur. |
|
||||
- Fixed getting the className of an item. Thanks Pedro Heliodoro. |
|
||||
|
|
||||
|
|
||||
2013-08-20, version 2.5.0 |
|
||||
|
|
||||
- Added French and Dutch localization. Thanks sp0ken and jeroenvg. |
|
||||
- Integration with jQuery Themeroller. Thanks Oleg Varaksin. |
|
||||
- Implemented Shift+Scroll to move the timeline. Thanks Olivier Aubert (oaubert). |
|
||||
- Implemented support for a field `type` to give events a type individually. |
|
||||
- Improved: Timeline is more robust against invalid data (data without |
|
||||
start and end fields). Thanks Roberto Tyley. |
|
||||
- Added an option 'unselectable'. Thanks judge. |
|
||||
- Fixed: when updating a selected item using changeItem, the selection was not |
|
||||
restored correctly. |
|
||||
- Fixed not being able to define columns for fields `group`, `className`, and |
|
||||
`editable` in a Google SpreadSheet. |
|
||||
- Fixed non-working touch events. |
|
||||
|
|
||||
|
|
||||
2013-04-18, version 2.4.2 |
|
||||
|
|
||||
- Implemented localization. (Thanks bjarkebech and José Renato). |
|
||||
- Changed: renamed option intervalMin to zoomMin and intervalMax to zoomMax |
|
||||
(Thanks Oleg Varaksin). |
|
||||
- Fixed: could not change an items field editable using method changeItem. |
|
||||
- Fixed: fields editable and className could not be retrieved from method |
|
||||
getItem (Thanks Oleg Varaksin). |
|
||||
|
|
||||
|
|
||||
2013-03-04, version 2.4.1 |
|
||||
|
|
||||
- Fixed: issue with calculating absolute positions of mouse and elements in |
|
||||
scrolled elements or body. |
|
||||
|
|
||||
|
|
||||
2013-02-26, version 2.4.0 |
|
||||
|
|
||||
- Added a new scale "WEEKDAY", which shows the weekday in the minor label. |
|
||||
- Implemented clustering of items. |
|
||||
- Implemented support for custom item types (besides the built in types box, |
|
||||
range, and dot). See example 25. Thanks Alexander Parshin. |
|
||||
- events can be made editable/read-only on an individual basis by providing |
|
||||
them with a field "editable". |
|
||||
- changed: data can now have custom fields (like an id). |
|
||||
- changed: method addItem has a second, optional parameter "preventRedraw", |
|
||||
which can be used to prevent redrawing the timeline after every addItem. |
|
||||
- changed: option showButtonAdd renamed to showButtonNew, and is now false by |
|
||||
default. |
|
||||
- changed: new items created via a double-click or the "Add" button are now |
|
||||
rendered after add trigger (which can cancel the create action). |
|
||||
- fixed: issues with dates on millisecond scale or with negative years |
|
||||
(issues #19 and #54). |
|
||||
- fixed: options scale and step did not work (method setScale worked correctly |
|
||||
though). |
|
||||
- fixed: alignment of the delete button for selected events with style box, |
|
||||
when the option box.align was "left" or "right" instead of the default |
|
||||
"center". |
|
||||
- fixed: DataTable columns may now have their name defined as label or id, |
|
||||
and the first three columns can have any order now. More robust and flexible. |
|
||||
- fixed: when deleting an item via deleteItem, the currently selection is |
|
||||
maintained instead of unselected (issue #47). |
|
||||
- fixed: When dragging the edges of a range, it was possible to move the range |
|
||||
to another group. |
|
||||
- fixed: non reachable event 'ready" (issue #69). |
|
||||
|
|
||||
|
|
||||
2012-09-18, version 2.3.2 |
|
||||
|
|
||||
- fixed mouseover/dragging of the vertical lines with current time and custom |
|
||||
time, which did only work in the axis area but not in the contents area. |
|
||||
|
|
||||
|
|
||||
2012-09-13, version 2.3.1 |
|
||||
|
|
||||
- added: double tap events on mobile devices will now fire the edit/new event. |
|
||||
- fixed/updated example 09, 15, 17, and 18. |
|
||||
- created example 21. |
|
||||
|
|
||||
|
|
||||
2012-09-05, version 2.3.0 |
|
||||
|
|
||||
- new: items can now have an individual class name which allows styling of |
|
||||
individual items. This gives a lot of extra flexibility. |
|
||||
- fixed issue #26: pinching on Ipad did throw an error "ReferenceError: Can't |
|
||||
find variable: timeline". |
|
||||
- fixed issue #28: in some cases, clicking an item would not select the item |
|
||||
but move the timeline slightly (less than 1px). |
|
||||
|
|
||||
|
|
||||
2012-07-30, version 2.2.1 |
|
||||
|
|
||||
- fixed the 'select' event not being fired when an item gets unselected. |
|
||||
- fixed method changeItem not dealing with changing the type of the item |
|
||||
from box to range or vice versa. |
|
||||
|
|
||||
|
|
||||
2012-07-27, version 2.2.0 |
|
||||
|
|
||||
- added an option showMinorLabels. By setting both showMinorLabels and |
|
||||
showMajorLabels, true, the axis will not be visible. |
|
||||
- fixed issue #6: items and axis did not move with the speed when moving |
|
||||
the Timeline under IE8 and older. |
|
||||
- fixed issue #8: start, end, min, max not working correctly around Date(0). |
|
||||
- fixed issue #9. It is now possible to specify only start or end in the |
|
||||
options, instead of having to specify both. |
|
||||
- fixed issue #12: the group of an item was not restored after canceling a |
|
||||
change. |
|
||||
|
|
||||
|
|
||||
2012-06-18, version 2.1.2 |
|
||||
|
|
||||
- fixed issue #4 again: sorting groups still not working correctly |
|
||||
|
|
||||
|
|
||||
2012-06-15, version 2.1.1 |
|
||||
|
|
||||
- fixed issue #3: broken option stackEvents=false |
|
||||
- fixed issue #4: sorting groups not working correctly |
|
||||
|
|
||||
|
|
||||
2012-06-04, version 2.1 |
|
||||
|
|
||||
- Documentation has a new layout |
|
||||
- Source code cleaned up |
|
||||
|
|
||||
|
|
||||
2012-05-02, version 2.0.1 |
|
||||
|
|
||||
- bug fix: areas on the left and right end of a range (for changing start/end) |
|
||||
where displayed below the range instead of on top of it. |
|
||||
|
|
||||
|
|
||||
2012-05-02, version 2.0 |
|
||||
|
|
||||
- initial upload to github (formerly located at sourceforge) |
|
@ -1,176 +0,0 @@ |
|||||
Apache License |
|
||||
Version 2.0, January 2004 |
|
||||
http://www.apache.org/licenses/ |
|
||||
|
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION |
|
||||
|
|
||||
1. Definitions. |
|
||||
|
|
||||
"License" shall mean the terms and conditions for use, reproduction, |
|
||||
and distribution as defined by Sections 1 through 9 of this document. |
|
||||
|
|
||||
"Licensor" shall mean the copyright owner or entity authorized by |
|
||||
the copyright owner that is granting the License. |
|
||||
|
|
||||
"Legal Entity" shall mean the union of the acting entity and all |
|
||||
other entities that control, are controlled by, or are under common |
|
||||
control with that entity. For the purposes of this definition, |
|
||||
"control" means (i) the power, direct or indirect, to cause the |
|
||||
direction or management of such entity, whether by contract or |
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the |
|
||||
outstanding shares, or (iii) beneficial ownership of such entity. |
|
||||
|
|
||||
"You" (or "Your") shall mean an individual or Legal Entity |
|
||||
exercising permissions granted by this License. |
|
||||
|
|
||||
"Source" form shall mean the preferred form for making modifications, |
|
||||
including but not limited to software source code, documentation |
|
||||
source, and configuration files. |
|
||||
|
|
||||
"Object" form shall mean any form resulting from mechanical |
|
||||
transformation or translation of a Source form, including but |
|
||||
not limited to compiled object code, generated documentation, |
|
||||
and conversions to other media types. |
|
||||
|
|
||||
"Work" shall mean the work of authorship, whether in Source or |
|
||||
Object form, made available under the License, as indicated by a |
|
||||
copyright notice that is included in or attached to the work |
|
||||
(an example is provided in the Appendix below). |
|
||||
|
|
||||
"Derivative Works" shall mean any work, whether in Source or Object |
|
||||
form, that is based on (or derived from) the Work and for which the |
|
||||
editorial revisions, annotations, elaborations, or other modifications |
|
||||
represent, as a whole, an original work of authorship. For the purposes |
|
||||
of this License, Derivative Works shall not include works that remain |
|
||||
separable from, or merely link (or bind by name) to the interfaces of, |
|
||||
the Work and Derivative Works thereof. |
|
||||
|
|
||||
"Contribution" shall mean any work of authorship, including |
|
||||
the original version of the Work and any modifications or additions |
|
||||
to that Work or Derivative Works thereof, that is intentionally |
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner |
|
||||
or by an individual or Legal Entity authorized to submit on behalf of |
|
||||
the copyright owner. For the purposes of this definition, "submitted" |
|
||||
means any form of electronic, verbal, or written communication sent |
|
||||
to the Licensor or its representatives, including but not limited to |
|
||||
communication on electronic mailing lists, source code control systems, |
|
||||
and issue tracking systems that are managed by, or on behalf of, the |
|
||||
Licensor for the purpose of discussing and improving the Work, but |
|
||||
excluding communication that is conspicuously marked or otherwise |
|
||||
designated in writing by the copyright owner as "Not a Contribution." |
|
||||
|
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity |
|
||||
on behalf of whom a Contribution has been received by Licensor and |
|
||||
subsequently incorporated within the Work. |
|
||||
|
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of |
|
||||
this License, each Contributor hereby grants to You a perpetual, |
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable |
|
||||
copyright license to reproduce, prepare Derivative Works of, |
|
||||
publicly display, publicly perform, sublicense, and distribute the |
|
||||
Work and such Derivative Works in Source or Object form. |
|
||||
|
|
||||
3. Grant of Patent License. Subject to the terms and conditions of |
|
||||
this License, each Contributor hereby grants to You a perpetual, |
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable |
|
||||
(except as stated in this section) patent license to make, have made, |
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work, |
|
||||
where such license applies only to those patent claims licensable |
|
||||
by such Contributor that are necessarily infringed by their |
|
||||
Contribution(s) alone or by combination of their Contribution(s) |
|
||||
with the Work to which such Contribution(s) was submitted. If You |
|
||||
institute patent litigation against any entity (including a |
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work |
|
||||
or a Contribution incorporated within the Work constitutes direct |
|
||||
or contributory patent infringement, then any patent licenses |
|
||||
granted to You under this License for that Work shall terminate |
|
||||
as of the date such litigation is filed. |
|
||||
|
|
||||
4. Redistribution. You may reproduce and distribute copies of the |
|
||||
Work or Derivative Works thereof in any medium, with or without |
|
||||
modifications, and in Source or Object form, provided that You |
|
||||
meet the following conditions: |
|
||||
|
|
||||
(a) You must give any other recipients of the Work or |
|
||||
Derivative Works a copy of this License; and |
|
||||
|
|
||||
(b) You must cause any modified files to carry prominent notices |
|
||||
stating that You changed the files; and |
|
||||
|
|
||||
(c) You must retain, in the Source form of any Derivative Works |
|
||||
that You distribute, all copyright, patent, trademark, and |
|
||||
attribution notices from the Source form of the Work, |
|
||||
excluding those notices that do not pertain to any part of |
|
||||
the Derivative Works; and |
|
||||
|
|
||||
(d) If the Work includes a "NOTICE" text file as part of its |
|
||||
distribution, then any Derivative Works that You distribute must |
|
||||
include a readable copy of the attribution notices contained |
|
||||
within such NOTICE file, excluding those notices that do not |
|
||||
pertain to any part of the Derivative Works, in at least one |
|
||||
of the following places: within a NOTICE text file distributed |
|
||||
as part of the Derivative Works; within the Source form or |
|
||||
documentation, if provided along with the Derivative Works; or, |
|
||||
within a display generated by the Derivative Works, if and |
|
||||
wherever such third-party notices normally appear. The contents |
|
||||
of the NOTICE file are for informational purposes only and |
|
||||
do not modify the License. You may add Your own attribution |
|
||||
notices within Derivative Works that You distribute, alongside |
|
||||
or as an addendum to the NOTICE text from the Work, provided |
|
||||
that such additional attribution notices cannot be construed |
|
||||
as modifying the License. |
|
||||
|
|
||||
You may add Your own copyright statement to Your modifications and |
|
||||
may provide additional or different license terms and conditions |
|
||||
for use, reproduction, or distribution of Your modifications, or |
|
||||
for any such Derivative Works as a whole, provided Your use, |
|
||||
reproduction, and distribution of the Work otherwise complies with |
|
||||
the conditions stated in this License. |
|
||||
|
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise, |
|
||||
any Contribution intentionally submitted for inclusion in the Work |
|
||||
by You to the Licensor shall be under the terms and conditions of |
|
||||
this License, without any additional terms or conditions. |
|
||||
Notwithstanding the above, nothing herein shall supersede or modify |
|
||||
the terms of any separate license agreement you may have executed |
|
||||
with Licensor regarding such Contributions. |
|
||||
|
|
||||
6. Trademarks. This License does not grant permission to use the trade |
|
||||
names, trademarks, service marks, or product names of the Licensor, |
|
||||
except as required for reasonable and customary use in describing the |
|
||||
origin of the Work and reproducing the content of the NOTICE file. |
|
||||
|
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or |
|
||||
agreed to in writing, Licensor provides the Work (and each |
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS, |
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or |
|
||||
implied, including, without limitation, any warranties or conditions |
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A |
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the |
|
||||
appropriateness of using or redistributing the Work and assume any |
|
||||
risks associated with Your exercise of permissions under this License. |
|
||||
|
|
||||
8. Limitation of Liability. In no event and under no legal theory, |
|
||||
whether in tort (including negligence), contract, or otherwise, |
|
||||
unless required by applicable law (such as deliberate and grossly |
|
||||
negligent acts) or agreed to in writing, shall any Contributor be |
|
||||
liable to You for damages, including any direct, indirect, special, |
|
||||
incidental, or consequential damages of any character arising as a |
|
||||
result of this License or out of the use or inability to use the |
|
||||
Work (including but not limited to damages for loss of goodwill, |
|
||||
work stoppage, computer failure or malfunction, or any and all |
|
||||
other commercial damages or losses), even if such Contributor |
|
||||
has been advised of the possibility of such damages. |
|
||||
|
|
||||
9. Accepting Warranty or Additional Liability. While redistributing |
|
||||
the Work or Derivative Works thereof, You may choose to offer, |
|
||||
and charge a fee for, acceptance of support, warranty, indemnity, |
|
||||
or other liability obligations and/or rights consistent with this |
|
||||
License. However, in accepting such obligations, You may act only |
|
||||
on Your own behalf and on Your sole responsibility, not on behalf |
|
||||
of any other Contributor, and only if You agree to indemnify, |
|
||||
defend, and hold each Contributor harmless for any liability |
|
||||
incurred by, or claims asserted against, such Contributor by reason |
|
||||
of your accepting any such warranty or additional liability. |
|
||||
|
|
||||
END OF TERMS AND CONDITIONS |
|
@ -1,14 +0,0 @@ |
|||||
CHAP Links Timeline |
|
||||
Copyright 2010-2015 Almende B.V. |
|
||||
|
|
||||
Licensed under the Apache License, Version 2.0 (the "License"); |
|
||||
you may not use this file except in compliance with the License. |
|
||||
You may obtain a copy of the License at |
|
||||
|
|
||||
http://www.apache.org/licenses/LICENSE-2.0 |
|
||||
|
|
||||
Unless required by applicable law or agreed to in writing, software |
|
||||
distributed under the License is distributed on an "AS IS" BASIS, |
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
|
||||
See the License for the specific language governing permissions and |
|
||||
limitations under the License. |
|
@ -1,66 +0,0 @@ |
|||||
CHAP Links Network |
|
||||
|
|
||||
http://www.almende.com |
|
||||
http://almende.github.com/chap-links-library/ |
|
||||
|
|
||||
DESCRIPTION |
|
||||
|
|
||||
The Timeline is an interactive visualization chart to visualize events in time. |
|
||||
The events can take place on a single date, or have a start and end date |
|
||||
(a range). You can freely move and zoom in the timeline by dragging and |
|
||||
scrolling in the Timeline. Events can be created, edited, and deleted in the |
|
||||
timeline. The time scale on the axis is adjusted automatically, and supports |
|
||||
scales ranging from milliseconds to years. |
|
||||
|
|
||||
When the timeline is defined as editable, events can be moved to another time |
|
||||
by dragging them. By double clicking, the contents of an event can be changed. |
|
||||
An event can be deleted by clicking the delete button on the upper right. A new |
|
||||
event can be added in different ways: by double clicking in the timeline, or by |
|
||||
keeping the Ctrl key down and clicking or dragging in the timeline, or by |
|
||||
clicking the add button in the upper left of the timeline, and then clicking or |
|
||||
dragging at the right location in the timeline. |
|
||||
|
|
||||
The Timeline is developed as a Google Visualization Chart in javascript. It |
|
||||
runs in every browser without additional requirements. There is a GWT wrapper |
|
||||
available to use the Timeline in GWT (Google Web Toolkit), you can find relevant |
|
||||
documentation here. |
|
||||
|
|
||||
The Timeline is designed to display up to 100 events smoothly on any modern |
|
||||
browser. |
|
||||
|
|
||||
|
|
||||
USAGE |
|
||||
|
|
||||
The Timeline is no built-in visualization of Google. To load the Timeline, |
|
||||
download the file timeline.zip and unzip it in a sub directory timeline on your |
|
||||
html page. Include the google API and the two downloaded files in the head of |
|
||||
your html code: |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="timeline/timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="timeline/timeline.css"> |
|
||||
|
|
||||
The google visualization needs to be loaded in order to use DataTable. |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
google.setOnLoadCallback(drawTimeline); |
|
||||
function drawTimeline() { |
|
||||
// load data and create the timeline here |
|
||||
} |
|
||||
|
|
||||
The class name of the Timeline is links.Timeline |
|
||||
|
|
||||
var timeline = new links.Timeline(container); |
|
||||
|
|
||||
After being loaded, the timeline can be drawn via the function draw(), provided |
|
||||
with data and options. |
|
||||
|
|
||||
timeline.draw(data, options); |
|
||||
|
|
||||
where data is a DataTable, and options is a name-value map in the JSON format. |
|
||||
|
|
||||
|
|
||||
DOCUMENTATION |
|
||||
|
|
||||
Documentation can be found in the directory doc |
|
||||
Examples can be found in the directory examples |
|
@ -1,92 +0,0 @@ |
|||||
html, body { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
padding: 0; |
|
||||
margin: 0; |
|
||||
} |
|
||||
|
|
||||
body, td, th { |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 11pt; |
|
||||
color: #4D4D4D; |
|
||||
line-height: 1.7em; |
|
||||
} |
|
||||
|
|
||||
#container { |
|
||||
margin: 0 auto; |
|
||||
padding-bottom: 50px; |
|
||||
width: 900px; |
|
||||
} |
|
||||
|
|
||||
h1 { |
|
||||
font-size: 180%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 1em 0; |
|
||||
} |
|
||||
|
|
||||
h2 { |
|
||||
padding-top: 20px; |
|
||||
padding-bottom: 10px; |
|
||||
border-bottom: 1px solid #a0c0f0; |
|
||||
color: #2B7CE9; |
|
||||
} |
|
||||
|
|
||||
h3 { |
|
||||
font-size: 140%; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
a { |
|
||||
color: #2B7CE9; |
|
||||
text-decoration: none; |
|
||||
} |
|
||||
a:visited { |
|
||||
color: #2E60A4; |
|
||||
} |
|
||||
a:hover { |
|
||||
color: red; |
|
||||
text-decoration: underline; |
|
||||
} |
|
||||
|
|
||||
hr { |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #abc; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre { |
|
||||
display: block; |
|
||||
font-size: 10pt; |
|
||||
line-height: 1.5em; |
|
||||
font-family: monospace; |
|
||||
} |
|
||||
|
|
||||
pre, code { |
|
||||
background-color: #f5f5f5; |
|
||||
} |
|
||||
|
|
||||
table |
|
||||
{ |
|
||||
border-collapse: collapse; |
|
||||
} |
|
||||
|
|
||||
th { |
|
||||
font-weight: bold; |
|
||||
border: 1px solid lightgray; |
|
||||
background-color: #E5E5E5; |
|
||||
text-align: left; |
|
||||
vertical-align: top; |
|
||||
padding: 5px; |
|
||||
} |
|
||||
|
|
||||
td { |
|
||||
border: 1px solid lightgray; |
|
||||
padding: 5px; |
|
||||
vertical-align: top; |
|
||||
} |
|
||||
|
|
||||
img.structure { |
|
||||
border: 1px solid gray; |
|
||||
background-color: #f5f5f5; |
|
||||
} |
|
Before Width: 500 | Height: 200 | Size: 17 KiB |
@ -1,310 +0,0 @@ |
|||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?> |
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) --> |
|
||||
|
|
||||
<svg |
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/" |
|
||||
xmlns:cc="http://creativecommons.org/ns#" |
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" |
|
||||
xmlns:svg="http://www.w3.org/2000/svg" |
|
||||
xmlns="http://www.w3.org/2000/svg" |
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" |
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" |
|
||||
width="500" |
|
||||
height="200" |
|
||||
id="svg2" |
|
||||
version="1.1" |
|
||||
inkscape:version="0.48.3.1 r9886" |
|
||||
sodipodi:docname="structure_box.svg" |
|
||||
inkscape:export-filename="/home/jos/projects/chap-links-library/js/src/timeline/doc/img/structure_box.png" |
|
||||
inkscape:export-xdpi="90" |
|
||||
inkscape:export-ydpi="90"> |
|
||||
<sodipodi:namedview |
|
||||
id="base" |
|
||||
pagecolor="#ffffff" |
|
||||
bordercolor="#666666" |
|
||||
borderopacity="1.0" |
|
||||
inkscape:pageopacity="0.0" |
|
||||
inkscape:pageshadow="2" |
|
||||
inkscape:zoom="2" |
|
||||
inkscape:cx="294.32886" |
|
||||
inkscape:cy="137.82236" |
|
||||
inkscape:document-units="px" |
|
||||
inkscape:current-layer="layer1" |
|
||||
showgrid="true" |
|
||||
inkscape:window-width="1600" |
|
||||
inkscape:window-height="849" |
|
||||
inkscape:window-x="0" |
|
||||
inkscape:window-y="0" |
|
||||
inkscape:window-maximized="1"> |
|
||||
<inkscape:grid |
|
||||
empopacity="0.25098039" |
|
||||
empcolor="#808080" |
|
||||
opacity="0.1254902" |
|
||||
color="#c8c8c8" |
|
||||
dotted="true" |
|
||||
snapvisiblegridlinesonly="true" |
|
||||
enabled="true" |
|
||||
visible="true" |
|
||||
empspacing="5" |
|
||||
id="grid3776" |
|
||||
type="xygrid" /> |
|
||||
</sodipodi:namedview> |
|
||||
<defs |
|
||||
id="defs4"> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lend" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lend"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="fill-rule:evenodd;stroke-width:0.62500000;stroke-linejoin:round;" |
|
||||
id="path3905" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendx" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;stroke:#ff0000;stroke-width:0.62500000;fill:#ff0000;fill-rule:evenodd" |
|
||||
id="path4515" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-3" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-3" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-2" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-7" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-7" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-4" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2LendxE" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2LendxE"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path5545" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2LendxD" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2LendxD"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path5622" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendxn" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendxn"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path5703" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendxs" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendxs"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path5788" /> |
|
||||
</marker> |
|
||||
</defs> |
|
||||
<metadata |
|
||||
id="metadata7"> |
|
||||
<rdf:RDF> |
|
||||
<cc:Work |
|
||||
rdf:about=""> |
|
||||
<dc:format>image/svg+xml</dc:format> |
|
||||
<dc:type |
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> |
|
||||
<dc:title></dc:title> |
|
||||
</cc:Work> |
|
||||
</rdf:RDF> |
|
||||
</metadata> |
|
||||
<g |
|
||||
transform="translate(0,-852.36218)" |
|
||||
id="layer1" |
|
||||
inkscape:groupmode="layer" |
|
||||
inkscape:label="Layer 1"> |
|
||||
<rect |
|
||||
ry="10" |
|
||||
rx="10" |
|
||||
y="872.36218" |
|
||||
x="20" |
|
||||
height="84.999992" |
|
||||
width="155" |
|
||||
id="rect3004" |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:1;stroke-opacity:1" /> |
|
||||
<rect |
|
||||
ry="0" |
|
||||
rx="0" |
|
||||
y="892.36218" |
|
||||
x="40" |
|
||||
height="44.999992" |
|
||||
width="115" |
|
||||
id="rect3774" |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:0.99999988;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2.99999994, 2.99999994;stroke-dashoffset:0" /> |
|
||||
<flowRoot |
|
||||
style="font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Arial;-inkscape-font-specification:Arial" |
|
||||
id="flowRoot3778" |
|
||||
xml:space="preserve" |
|
||||
transform="translate(0,-5.0000026)"><flowRegion |
|
||||
id="flowRegion3780"><rect |
|
||||
style="font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Arial;-inkscape-font-specification:Arial" |
|
||||
y="4.6428566" |
|
||||
x="16.785715" |
|
||||
height="22.142857" |
|
||||
width="73.214287" |
|
||||
id="rect3782" /></flowRegion><flowPara |
|
||||
id="flowPara3784" /></flowRoot> <path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3790" |
|
||||
d="m 95,957.36218 0,60.00002" |
|
||||
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /> |
|
||||
<path |
|
||||
transform="matrix(1,0,0,1.3333333,0,797.36218)" |
|
||||
d="m 105,172.5 c 0,4.14214 -4.47715,7.5 -10,7.5 -5.522847,0 -10,-3.35786 -10,-7.5 0,-4.14214 4.477153,-7.5 10,-7.5 5.52285,0 10,3.35786 10,7.5 z" |
|
||||
sodipodi:ry="7.5" |
|
||||
sodipodi:rx="10" |
|
||||
sodipodi:cy="172.5" |
|
||||
sodipodi:cx="95" |
|
||||
id="path3792" |
|
||||
style="fill:#1a1a1a;fill-opacity:1;stroke:#1a1a1a;stroke-width:0.86602539;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" |
|
||||
sodipodi:type="arc" /> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4" |
|
||||
y="937.36218" |
|
||||
x="230" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="937.36218" |
|
||||
x="230" |
|
||||
id="tspan3788-1" |
|
||||
sodipodi:role="line">timeline-event-content</tspan></text> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4-0" |
|
||||
y="902.36218" |
|
||||
x="230" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="902.36218" |
|
||||
x="230" |
|
||||
id="tspan3788-1-3" |
|
||||
sodipodi:role="line">timeline-event timeline-event-box</tspan></text> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4-0-8" |
|
||||
y="987.36218" |
|
||||
x="230" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="987.36218" |
|
||||
x="230" |
|
||||
id="tspan3788-1-3-5" |
|
||||
sodipodi:role="line">timeline-event timeline-event-line</tspan></text> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4-0-8-7" |
|
||||
y="1017.3622" |
|
||||
x="230" |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="1017.3622" |
|
||||
x="230" |
|
||||
id="tspan3788-1-3-5-9" |
|
||||
sodipodi:role="line">timeline-event timeline-event-dot</tspan></text> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878" |
|
||||
d="m 225,982.36218 -130,10" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendxn);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878-7" |
|
||||
d="m 225,932.36218 -70,-15" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2LendxD);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878-1" |
|
||||
d="m 225,1012.3622 -120,15" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendxs);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878-7-6" |
|
||||
d="m 225,897.36218 -50,-10" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2LendxE);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
</g> |
|
||||
</svg> |
|
Before Width: 500 | Height: 200 | Size: 11 KiB |
@ -1,286 +0,0 @@ |
|||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?> |
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) --> |
|
||||
|
|
||||
<svg |
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/" |
|
||||
xmlns:cc="http://creativecommons.org/ns#" |
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" |
|
||||
xmlns:svg="http://www.w3.org/2000/svg" |
|
||||
xmlns="http://www.w3.org/2000/svg" |
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" |
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" |
|
||||
width="500" |
|
||||
height="200" |
|
||||
id="svg2" |
|
||||
version="1.1" |
|
||||
inkscape:version="0.48.3.1 r9886" |
|
||||
sodipodi:docname="structure_dot.svg" |
|
||||
inkscape:export-filename="/home/jos/projects/chap-links-library/js/src/timeline/doc/img/structure_dot.png" |
|
||||
inkscape:export-xdpi="90" |
|
||||
inkscape:export-ydpi="90"> |
|
||||
<sodipodi:namedview |
|
||||
id="base" |
|
||||
pagecolor="#ffffff" |
|
||||
bordercolor="#666666" |
|
||||
borderopacity="1.0" |
|
||||
inkscape:pageopacity="0.0" |
|
||||
inkscape:pageshadow="2" |
|
||||
inkscape:zoom="1.4142136" |
|
||||
inkscape:cx="159.31768" |
|
||||
inkscape:cy="127.21549" |
|
||||
inkscape:document-units="px" |
|
||||
inkscape:current-layer="layer1" |
|
||||
showgrid="true" |
|
||||
inkscape:window-width="1600" |
|
||||
inkscape:window-height="849" |
|
||||
inkscape:window-x="0" |
|
||||
inkscape:window-y="0" |
|
||||
inkscape:window-maximized="1"> |
|
||||
<inkscape:grid |
|
||||
type="xygrid" |
|
||||
id="grid3776" |
|
||||
empspacing="5" |
|
||||
visible="true" |
|
||||
enabled="true" |
|
||||
snapvisiblegridlinesonly="true" |
|
||||
dotted="true" |
|
||||
color="#c8c8c8" |
|
||||
opacity="0.1254902" |
|
||||
empcolor="#808080" |
|
||||
empopacity="0.25098039" /> |
|
||||
</sodipodi:namedview> |
|
||||
<defs |
|
||||
id="defs4"> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lend" |
|
||||
orient="auto" |
|
||||
refY="0.0" |
|
||||
refX="0.0" |
|
||||
id="Arrow2Lend" |
|
||||
style="overflow:visible;"> |
|
||||
<path |
|
||||
id="path3905" |
|
||||
style="fill-rule:evenodd;stroke-width:0.62500000;stroke-linejoin:round;" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendx" |
|
||||
orient="auto" |
|
||||
refY="0.0" |
|
||||
refX="0.0" |
|
||||
id="Arrow2Lendx" |
|
||||
style="overflow:visible;"> |
|
||||
<path |
|
||||
id="path4515" |
|
||||
style="stroke-linejoin:round;stroke:#ff0000;stroke-width:0.62500000;fill:#ff0000;fill-rule:evenodd" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendx" |
|
||||
orient="auto" |
|
||||
refY="0" |
|
||||
refX="0" |
|
||||
id="Arrow2Lendx-3" |
|
||||
style="overflow:visible"> |
|
||||
<path |
|
||||
id="path4515-3" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
inkscape:connector-curvature="0" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendx" |
|
||||
orient="auto" |
|
||||
refY="0" |
|
||||
refX="0" |
|
||||
id="Arrow2Lendx-2" |
|
||||
style="overflow:visible"> |
|
||||
<path |
|
||||
id="path4515-7" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
inkscape:connector-curvature="0" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendx" |
|
||||
orient="auto" |
|
||||
refY="0" |
|
||||
refX="0" |
|
||||
id="Arrow2Lendx-7" |
|
||||
style="overflow:visible"> |
|
||||
<path |
|
||||
id="path4515-4" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
inkscape:connector-curvature="0" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendxl" |
|
||||
orient="auto" |
|
||||
refY="0.0" |
|
||||
refX="0.0" |
|
||||
id="Arrow2Lendxl" |
|
||||
style="overflow:visible;"> |
|
||||
<path |
|
||||
id="path4782" |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendx6" |
|
||||
orient="auto" |
|
||||
refY="0.0" |
|
||||
refX="0.0" |
|
||||
id="Arrow2Lendx6" |
|
||||
style="overflow:visible;"> |
|
||||
<path |
|
||||
id="path4855" |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
inkscape:stockid="Arrow2Lendxp" |
|
||||
orient="auto" |
|
||||
refY="0.0" |
|
||||
refX="0.0" |
|
||||
id="Arrow2Lendxp" |
|
||||
style="overflow:visible;"> |
|
||||
<path |
|
||||
id="path4932" |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" /> |
|
||||
</marker> |
|
||||
</defs> |
|
||||
<metadata |
|
||||
id="metadata7"> |
|
||||
<rdf:RDF> |
|
||||
<cc:Work |
|
||||
rdf:about=""> |
|
||||
<dc:format>image/svg+xml</dc:format> |
|
||||
<dc:type |
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> |
|
||||
<dc:title></dc:title> |
|
||||
</cc:Work> |
|
||||
</rdf:RDF> |
|
||||
</metadata> |
|
||||
<g |
|
||||
inkscape:label="Layer 1" |
|
||||
inkscape:groupmode="layer" |
|
||||
id="layer1" |
|
||||
transform="translate(0,-852.36218)"> |
|
||||
<rect |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:0.99999994;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:3.00000001, 3.00000001;stroke-dashoffset:0" |
|
||||
id="rect3774" |
|
||||
width="305" |
|
||||
height="49.999992" |
|
||||
x="60" |
|
||||
y="892.36218" |
|
||||
rx="0" |
|
||||
ry="0" /> |
|
||||
<flowRoot |
|
||||
transform="translate(-3.8146973e-6,-5.0000026)" |
|
||||
xml:space="preserve" |
|
||||
id="flowRoot3778" |
|
||||
style="font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Arial;-inkscape-font-specification:Arial"><flowRegion |
|
||||
id="flowRegion3780"><rect |
|
||||
id="rect3782" |
|
||||
width="73.214287" |
|
||||
height="22.142857" |
|
||||
x="16.785715" |
|
||||
y="4.6428566" |
|
||||
style="font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Arial;-inkscape-font-specification:Arial" /></flowRegion><flowPara |
|
||||
id="flowPara3784" /></flowRoot> <path |
|
||||
sodipodi:type="arc" |
|
||||
style="fill:#1a1a1a;fill-opacity:1;stroke:#1a1a1a;stroke-width:0.86602539;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" |
|
||||
id="path3792" |
|
||||
sodipodi:cx="95" |
|
||||
sodipodi:cy="172.5" |
|
||||
sodipodi:rx="10" |
|
||||
sodipodi:ry="7.5" |
|
||||
d="m 105,172.5 c 0,4.14214 -4.47715,7.5 -10,7.5 -5.522847,0 -10,-3.35786 -10,-7.5 0,-4.14214 4.477153,-7.5 10,-7.5 5.52285,0 10,3.35786 10,7.5 z" |
|
||||
transform="matrix(1,0,0,1.3333333,-65.000004,687.36219)" /> |
|
||||
<text |
|
||||
xml:space="preserve" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
x="160" |
|
||||
y="987.36218" |
|
||||
id="text3786-4" |
|
||||
sodipodi:linespacing="125%"><tspan |
|
||||
sodipodi:role="line" |
|
||||
id="tspan3788-1" |
|
||||
x="160" |
|
||||
y="987.36218" |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold">timeline-event-content</tspan></text> |
|
||||
<text |
|
||||
xml:space="preserve" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
x="160" |
|
||||
y="1177.3622" |
|
||||
id="text3786-4-0" |
|
||||
sodipodi:linespacing="125%"><tspan |
|
||||
sodipodi:role="line" |
|
||||
id="tspan3788-1-3" |
|
||||
x="160" |
|
||||
y="1177.3622" |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#ff0000;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold">timeline-event timeline-event-box</tspan></text> |
|
||||
<text |
|
||||
xml:space="preserve" |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
x="160" |
|
||||
y="1007.3622" |
|
||||
id="text3786-4-0-8-7" |
|
||||
sodipodi:linespacing="125%"><tspan |
|
||||
sodipodi:role="line" |
|
||||
id="tspan3788-1-3-5-9" |
|
||||
x="160" |
|
||||
y="1007.3622" |
|
||||
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold">timeline-event timeline-event-dot</tspan></text> |
|
||||
<path |
|
||||
sodipodi:nodetypes="cc" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendxl);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
d="m 155,982.36218 -25,-40" |
|
||||
id="path3878" |
|
||||
inkscape:connector-curvature="0" /> |
|
||||
<path |
|
||||
sodipodi:nodetypes="cc" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendxp);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
d="M 155,1022.3622 44.999996,962.36218" |
|
||||
id="path3878-7" |
|
||||
inkscape:connector-curvature="0" /> |
|
||||
<path |
|
||||
sodipodi:nodetypes="cc" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendx6);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
d="M 155,1002.3622 34.999996,927.36218" |
|
||||
id="path3878-1" |
|
||||
inkscape:connector-curvature="0" /> |
|
||||
<rect |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:1;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2.99999997, 2.99999997;stroke-dashoffset:0" |
|
||||
id="rect3774-3" |
|
||||
width="365" |
|
||||
height="89.999985" |
|
||||
x="19.999994" |
|
||||
y="872.36218" |
|
||||
rx="0" |
|
||||
ry="0" /> |
|
||||
<text |
|
||||
xml:space="preserve" |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
x="160" |
|
||||
y="1027.3622" |
|
||||
id="text3786-4-0-8-7-2" |
|
||||
sodipodi:linespacing="125%"><tspan |
|
||||
sodipodi:role="line" |
|
||||
id="tspan3788-1-3-5-9-1" |
|
||||
x="160" |
|
||||
y="1027.3622" |
|
||||
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold">(no class)</tspan></text> |
|
||||
</g> |
|
||||
</svg> |
|
Before Width: 500 | Height: 200 | Size: 19 KiB |
@ -1,327 +0,0 @@ |
|||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?> |
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) --> |
|
||||
|
|
||||
<svg |
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/" |
|
||||
xmlns:cc="http://creativecommons.org/ns#" |
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" |
|
||||
xmlns:svg="http://www.w3.org/2000/svg" |
|
||||
xmlns="http://www.w3.org/2000/svg" |
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" |
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" |
|
||||
width="500" |
|
||||
height="200" |
|
||||
id="svg2" |
|
||||
version="1.1" |
|
||||
inkscape:version="0.48.3.1 r9886" |
|
||||
sodipodi:docname="structure_range.svg" |
|
||||
inkscape:export-filename="/home/jos/projects/chap-links-library/js/src/timeline/doc/img/structure_range.png" |
|
||||
inkscape:export-xdpi="90" |
|
||||
inkscape:export-ydpi="90"> |
|
||||
<sodipodi:namedview |
|
||||
id="base" |
|
||||
pagecolor="#ffffff" |
|
||||
bordercolor="#666666" |
|
||||
borderopacity="1.0" |
|
||||
inkscape:pageopacity="0.0" |
|
||||
inkscape:pageshadow="2" |
|
||||
inkscape:zoom="2.0000001" |
|
||||
inkscape:cx="245.56803" |
|
||||
inkscape:cy="139.44127" |
|
||||
inkscape:document-units="px" |
|
||||
inkscape:current-layer="layer1" |
|
||||
showgrid="true" |
|
||||
inkscape:window-width="1600" |
|
||||
inkscape:window-height="849" |
|
||||
inkscape:window-x="0" |
|
||||
inkscape:window-y="0" |
|
||||
inkscape:window-maximized="1"> |
|
||||
<inkscape:grid |
|
||||
empopacity="0.25098039" |
|
||||
empcolor="#808080" |
|
||||
opacity="0.1254902" |
|
||||
color="#c8c8c8" |
|
||||
dotted="true" |
|
||||
snapvisiblegridlinesonly="true" |
|
||||
enabled="true" |
|
||||
visible="true" |
|
||||
empspacing="5" |
|
||||
id="grid3776" |
|
||||
type="xygrid" /> |
|
||||
</sodipodi:namedview> |
|
||||
<defs |
|
||||
id="defs4"> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lend" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lend"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="fill-rule:evenodd;stroke-width:0.62500000;stroke-linejoin:round;" |
|
||||
id="path3905" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendx" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;stroke:#ff0000;stroke-width:0.62500000;fill:#ff0000;fill-rule:evenodd" |
|
||||
id="path4515" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-3" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-3" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-2" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-7" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-7" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-4" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible" |
|
||||
id="Arrow2Lendx-1" |
|
||||
refX="0" |
|
||||
refY="0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx"> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
transform="matrix(-1.1,0,0,-1.1,-1.1,0)" |
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z" |
|
||||
style="fill:#ff0000;fill-rule:evenodd;stroke:#ff0000;stroke-width:0.625;stroke-linejoin:round" |
|
||||
id="path4515-42" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendx2" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx2"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path3906" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendxi" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendxi"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path3987" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendx6" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendx6"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path4072" /> |
|
||||
</marker> |
|
||||
<marker |
|
||||
style="overflow:visible;" |
|
||||
id="Arrow2Lendxz" |
|
||||
refX="0.0" |
|
||||
refY="0.0" |
|
||||
orient="auto" |
|
||||
inkscape:stockid="Arrow2Lendxz"> |
|
||||
<path |
|
||||
transform="scale(1.1) rotate(180) translate(1,0)" |
|
||||
d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z " |
|
||||
style="stroke-linejoin:round;fill-rule:evenodd;stroke:#2b7ce9;stroke-width:0.62500000;fill:#2b7ce9" |
|
||||
id="path4161" /> |
|
||||
</marker> |
|
||||
</defs> |
|
||||
<metadata |
|
||||
id="metadata7"> |
|
||||
<rdf:RDF> |
|
||||
<cc:Work |
|
||||
rdf:about=""> |
|
||||
<dc:format>image/svg+xml</dc:format> |
|
||||
<dc:type |
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> |
|
||||
<dc:title></dc:title> |
|
||||
</cc:Work> |
|
||||
</rdf:RDF> |
|
||||
</metadata> |
|
||||
<g |
|
||||
transform="translate(0,-852.36218)" |
|
||||
id="layer1" |
|
||||
inkscape:groupmode="layer" |
|
||||
inkscape:label="Layer 1"> |
|
||||
<rect |
|
||||
ry="4.9999976" |
|
||||
rx="5" |
|
||||
y="872.36218" |
|
||||
x="20" |
|
||||
height="84.999992" |
|
||||
width="460" |
|
||||
id="rect3004" |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:1;stroke-opacity:1" /> |
|
||||
<rect |
|
||||
ry="0" |
|
||||
rx="0" |
|
||||
y="892.36218" |
|
||||
x="40" |
|
||||
height="44.999992" |
|
||||
width="420" |
|
||||
id="rect3774" |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:0.99999994;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2.99999992, 2.99999992;stroke-dashoffset:0" /> |
|
||||
<flowRoot |
|
||||
style="font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Arial;-inkscape-font-specification:Arial" |
|
||||
id="flowRoot3778" |
|
||||
xml:space="preserve" |
|
||||
transform="translate(0,-5.0000026)"><flowRegion |
|
||||
id="flowRegion3780"><rect |
|
||||
style="font-size:11px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Arial;-inkscape-font-specification:Arial" |
|
||||
y="4.6428566" |
|
||||
x="16.785715" |
|
||||
height="22.142857" |
|
||||
width="73.214287" |
|
||||
id="rect3782" /></flowRegion><flowPara |
|
||||
id="flowPara3784" /></flowRoot> <text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4" |
|
||||
y="997.36218" |
|
||||
x="140" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="997.36218" |
|
||||
x="140" |
|
||||
id="tspan3788-1" |
|
||||
sodipodi:role="line">timeline-event-content</tspan></text> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4-0" |
|
||||
y="977.36218" |
|
||||
x="140" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="977.36218" |
|
||||
x="140" |
|
||||
id="tspan3788-1-3" |
|
||||
sodipodi:role="line">timeline-event timeline-event-range</tspan></text> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4-0-8" |
|
||||
y="1017.3622" |
|
||||
x="140" |
|
||||
style="font-size:12px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Sans" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="1017.3622" |
|
||||
x="140" |
|
||||
id="tspan3788-1-3-5" |
|
||||
sodipodi:role="line">timeline-event-range-drag-left</tspan></text> |
|
||||
<text |
|
||||
sodipodi:linespacing="125%" |
|
||||
id="text3786-4-0-8-7" |
|
||||
y="1037.3622" |
|
||||
x="140" |
|
||||
style="font-size:12px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b7ce9;fill-opacity:1;stroke:none;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
xml:space="preserve"><tspan |
|
||||
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;fill:#2b7ce9;fill-opacity:1;font-family:Courier New;-inkscape-font-specification:Courier New Bold" |
|
||||
y="1037.3622" |
|
||||
x="140" |
|
||||
id="tspan3788-1-3-5-9" |
|
||||
sodipodi:role="line">timeline-event-range-drag-right</tspan></text> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878" |
|
||||
d="m 365,1032.3622 80,-85.00002" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendxi);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878-7" |
|
||||
d="m 135,972.36218 -5,-15" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendxz);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878-7-6" |
|
||||
d="M 135,1012.3622 55,947.36218" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendx6);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
<rect |
|
||||
ry="0" |
|
||||
rx="0" |
|
||||
y="877.36218" |
|
||||
x="25" |
|
||||
height="74.999985" |
|
||||
width="30" |
|
||||
id="rect3774-4" |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:1;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2.99999996, 2.99999996;stroke-dashoffset:0" /> |
|
||||
<rect |
|
||||
ry="0" |
|
||||
rx="0" |
|
||||
y="877.36218" |
|
||||
x="445" |
|
||||
height="74.999985" |
|
||||
width="30" |
|
||||
id="rect3774-4-2" |
|
||||
style="fill:none;stroke:#1a1a1a;stroke-width:1;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2.99999996, 2.99999996;stroke-dashoffset:0" /> |
|
||||
<path |
|
||||
inkscape:connector-curvature="0" |
|
||||
id="path3878-7-0" |
|
||||
d="m 135,992.36218 -45,-55" |
|
||||
style="stroke-linejoin:miter;marker-end:url(#Arrow2Lendx2);stroke-opacity:1;stroke:#2b7ce9;stroke-linecap:butt;stroke-width:1px;fill:none" |
|
||||
sodipodi:nodetypes="cc" /> |
|
||||
</g> |
|
||||
</svg> |
|
1696
static/lib/timeline/doc/index.html
File diff suppressed because it is too large
View File
@ -1,234 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
|
|
||||
<title>JsDoc Reference - File Index</title> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
|
|
||||
<div id="index"> |
|
||||
<div align="center"><a href="index.html">Class Index</a> |
|
||||
| <a href="files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<h1 class="classTitle">File Index</h1> |
|
||||
|
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/src/timeline.js.html">timeline.js</a></h2> |
|
||||
|
|
||||
<dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</dl> |
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blankt">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,282 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
|
|
||||
<title>JsDoc Reference - Index</title> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
|
|
||||
<div id="index"> |
|
||||
<div align="center"><a href="index.html">Class Index</a> |
|
||||
| <a href="files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<h1 class="classTitle">Class Index</h1> |
|
||||
|
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/_global_.html">_global_</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/Array.html">Array</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.html">links.Timeline</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.Item.html">links.Timeline.Item</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
<div> |
|
||||
<h2><a href="symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></h2> |
|
||||
|
|
||||
</div> |
|
||||
<hr /> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blankt">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,392 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - Array</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Built-In Namespace Array |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class Array."> |
|
||||
<caption>Method Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Method Attributes</th> |
|
||||
<th scope="col">Method Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/Array.html#forEach">forEach</a></b>(fn, scope) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/Array.html#indexOf">indexOf</a></b>(obj) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Method Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="forEach"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>forEach</b>(fn, scope) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
<br /> |
|
||||
<i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<b>fn</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<b>scope</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="indexOf"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>indexOf</b>(obj) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
<br /> |
|
||||
<i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<b>obj</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:27 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,325 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - _global_</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Built-In Namespace _global_ |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the fields documented in the class _global_."> |
|
||||
<caption>Field Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Field Attributes</th> |
|
||||
<th scope="col">Field Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"> |
|
||||
<b><a href="../symbols/_global_.html#listeners">listeners</a></b> |
|
||||
</div> |
|
||||
<div class="description">Remove all registered event listeners</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Field Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="listeners"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>listeners</b> |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Remove all registered event listeners |
|
||||
|
|
||||
<br /> |
|
||||
<i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:27 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,570 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - links.Timeline.ClusterGenerator</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Class links.Timeline.ClusterGenerator |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<br /><i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class links.Timeline.ClusterGenerator."> |
|
||||
<caption>Class Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Constructor Attributes</th> |
|
||||
<th scope="col">Constructor Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription" > |
|
||||
<div class="fixedFont"> |
|
||||
<b><a href="../symbols/links.Timeline.ClusterGenerator.html#constructor">links.Timeline.ClusterGenerator</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class links.Timeline.ClusterGenerator."> |
|
||||
<caption>Method Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Method Attributes</th> |
|
||||
<th scope="col">Method Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ClusterGenerator.html#clear">clear</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Clear all cached clusters and data, and initialize all variables</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ClusterGenerator.html#clearCache">clearCache</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Clear the cached clusters</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ClusterGenerator.html#getClusters">getClusters</a></b>(scale, maxItems) |
|
||||
</div> |
|
||||
<div class="description">Cluster the events which are too close together</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ClusterGenerator.html#setData">setData</a></b>(items, options) |
|
||||
</div> |
|
||||
<div class="description">Set the items to be clustered.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ClusterGenerator.html#updateData">updateData</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Update the current data set: clear cache, and recalculate the clustering for |
|
||||
the current level</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
<div class="details"><a name="constructor"> </a> |
|
||||
<div class="sectionTitle"> |
|
||||
Class Detail |
|
||||
</div> |
|
||||
|
|
||||
<div class="fixedFont"> |
|
||||
<b>links.Timeline.ClusterGenerator</b>(timeline) |
|
||||
</div> |
|
||||
|
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Method Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="clear"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>clear</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Clear all cached clusters and data, and initialize all variables |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="clearCache"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>clearCache</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Clear the cached clusters |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getClusters"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Item[]}</span> |
|
||||
<b>getClusters</b>(scale, maxItems) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Cluster the events which are too close together |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>scale</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd>The scale of the current window, |
|
||||
defined as (windowWidth / (endDate - startDate))</dd> |
|
||||
|
|
||||
<dt> |
|
||||
<b>maxItems</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Item[]}</span> clusters</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="setData"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>setData</b>(items, options) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Set the items to be clustered. |
|
||||
This will clear cached clusters. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Item[]}</span> <b>items</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>options</b> |
|
||||
<i>Optional</i> |
|
||||
</dt> |
|
||||
<dd>Available options: |
|
||||
{boolean} applyOnChangedLevel |
|
||||
If true (default), the changed data is applied |
|
||||
as soon the cluster level changes. If false, |
|
||||
The changed data is applied immediately</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updateData"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updateData</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Update the current data set: clear cache, and recalculate the clustering for |
|
||||
the current level |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
1039
static/lib/timeline/doc/jsdoc/symbols/links.Timeline.Item.html
File diff suppressed because it is too large
View File
@ -1,895 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - links.Timeline.ItemBox</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Class links.Timeline.ItemBox |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
<br />Extends |
|
||||
<a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>.<br /> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<br /><i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class links.Timeline.ItemBox."> |
|
||||
<caption>Class Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Constructor Attributes</th> |
|
||||
<th scope="col">Constructor Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription" > |
|
||||
<div class="fixedFont"> |
|
||||
<b><a href="../symbols/links.Timeline.ItemBox.html#constructor">links.Timeline.ItemBox</a></b>(data, options) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class links.Timeline.ItemBox."> |
|
||||
<caption>Method Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Method Attributes</th> |
|
||||
<th scope="col">Method Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#createDOM">createDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Creates the DOM for the item, depending on its type</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#getLeft">getLeft</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the left position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#getRight">getRight</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the right position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#hideDOM">hideDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Remove the items DOM from the current HTML container, but keep the DOM in |
|
||||
memory</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#isVisible">isVisible</a></b>(start, end) |
|
||||
</div> |
|
||||
<div class="description">Check if the item is visible in the timeline, and not part of a cluster</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#reflow">reflow</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Reflow the Item: retrieve its actual size from the DOM</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#select">select</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Select the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#setPosition">setPosition</a></b>(left, right) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#showDOM">showDOM</a></b>(container) |
|
||||
</div> |
|
||||
<div class="description">Append the items DOM to the given HTML container.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#unselect">unselect</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Unselect the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#updateDOM">updateDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Update the DOM of the item.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemBox.html#updatePosition">updatePosition</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="inheritsList"> |
|
||||
<dt>Methods borrowed from class <a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>: </dt><dd><a href="../symbols/links.Timeline.Item.html#getImageUrls">getImageUrls</a>, <a href="../symbols/links.Timeline.Item.html#getWidth">getWidth</a>, <a href="../symbols/links.Timeline.Item.html#isRendered">isRendered</a></dd> |
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
<div class="details"><a name="constructor"> </a> |
|
||||
<div class="sectionTitle"> |
|
||||
Class Detail |
|
||||
</div> |
|
||||
|
|
||||
<div class="fixedFont"> |
|
||||
<b>links.Timeline.ItemBox</b>(data, options) |
|
||||
</div> |
|
||||
|
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>data</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd>Object containing parameters start, end |
|
||||
content, group, type, className, editable.</dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>options</b> |
|
||||
<i>Optional</i> |
|
||||
</dt> |
|
||||
<dd>Options to set initial property values |
|
||||
{Number} top |
|
||||
{Number} left |
|
||||
{Number} width |
|
||||
{Number} height</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Method Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="createDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Element | undefined}</span> |
|
||||
<b>createDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Creates the DOM for the item, depending on its type |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Element | undefined}</span> </dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getLeft"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getLeft</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the left position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> left</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getRight"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getRight</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the right position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> right</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="hideDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>hideDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Remove the items DOM from the current HTML container, but keep the DOM in |
|
||||
memory |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="isVisible"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Boolean}</span> |
|
||||
<b>isVisible</b>(start, end) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Check if the item is visible in the timeline, and not part of a cluster |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Date}</span> <b>start</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Date}</span> <b>end</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Boolean}</span> visible</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="reflow"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{boolean}</span> |
|
||||
<b>reflow</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reflow the Item: retrieve its actual size from the DOM |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{boolean}</span> resized returns true if the axis is resized</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="select"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>select</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Select the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="setPosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>setPosition</b>(left, right) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>left</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>right</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="showDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>showDOM</b>(container) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Append the items DOM to the given HTML container. If items DOM does not yet |
|
||||
exist, it will be created first. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Element}</span> <b>container</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="unselect"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>unselect</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Unselect the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updateDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updateDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Update the DOM of the item. This will update the content and the classes |
|
||||
of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updatePosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updatePosition</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,893 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - links.Timeline.ItemDot</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Class links.Timeline.ItemDot |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
<br />Extends |
|
||||
<a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>.<br /> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<br /><i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class links.Timeline.ItemDot."> |
|
||||
<caption>Class Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Constructor Attributes</th> |
|
||||
<th scope="col">Constructor Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription" > |
|
||||
<div class="fixedFont"> |
|
||||
<b><a href="../symbols/links.Timeline.ItemDot.html#constructor">links.Timeline.ItemDot</a></b>(data, options) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class links.Timeline.ItemDot."> |
|
||||
<caption>Method Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Method Attributes</th> |
|
||||
<th scope="col">Method Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#createDOM">createDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Creates the DOM for the item, depending on its type</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#getLeft">getLeft</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the left position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#getRight">getRight</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the right position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#hideDOM">hideDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Remove the items DOM from the current HTML container</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#isVisible">isVisible</a></b>(start, end) |
|
||||
</div> |
|
||||
<div class="description">Check if the item is visible in the timeline, and not part of a cluster.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#reflow">reflow</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Reflow the Item: retrieve its actual size from the DOM</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#select">select</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Select the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#setPosition">setPosition</a></b>(left, right) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#showDOM">showDOM</a></b>(container) |
|
||||
</div> |
|
||||
<div class="description">Append the items DOM to the given HTML container.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#unselect">unselect</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Unselect the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#updateDOM">updateDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Update the DOM of the item.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemDot.html#updatePosition">updatePosition</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="inheritsList"> |
|
||||
<dt>Methods borrowed from class <a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>: </dt><dd><a href="../symbols/links.Timeline.Item.html#getImageUrls">getImageUrls</a>, <a href="../symbols/links.Timeline.Item.html#getWidth">getWidth</a>, <a href="../symbols/links.Timeline.Item.html#isRendered">isRendered</a></dd> |
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
<div class="details"><a name="constructor"> </a> |
|
||||
<div class="sectionTitle"> |
|
||||
Class Detail |
|
||||
</div> |
|
||||
|
|
||||
<div class="fixedFont"> |
|
||||
<b>links.Timeline.ItemDot</b>(data, options) |
|
||||
</div> |
|
||||
|
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>data</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd>Object containing parameters start, end |
|
||||
content, group, type, className, editable.</dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>options</b> |
|
||||
<i>Optional</i> |
|
||||
</dt> |
|
||||
<dd>Options to set initial property values |
|
||||
{Number} top |
|
||||
{Number} left |
|
||||
{Number} width |
|
||||
{Number} height</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Method Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="createDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Element | undefined}</span> |
|
||||
<b>createDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Creates the DOM for the item, depending on its type |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Element | undefined}</span> </dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getLeft"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getLeft</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the left position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> left</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getRight"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getRight</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the right position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> right</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="hideDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>hideDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Remove the items DOM from the current HTML container |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="isVisible"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{boolean}</span> |
|
||||
<b>isVisible</b>(start, end) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Check if the item is visible in the timeline, and not part of a cluster. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Date}</span> <b>start</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Date}</span> <b>end</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{boolean}</span> visible</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="reflow"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{boolean}</span> |
|
||||
<b>reflow</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reflow the Item: retrieve its actual size from the DOM |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{boolean}</span> resized returns true if the axis is resized</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="select"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>select</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Select the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="setPosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>setPosition</b>(left, right) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>left</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>right</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="showDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>showDOM</b>(container) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Append the items DOM to the given HTML container. If items DOM does not yet |
|
||||
exist, it will be created first. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Element}</span> <b>container</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="unselect"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>unselect</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Unselect the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updateDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updateDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Update the DOM of the item. This will update the content and the classes |
|
||||
of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updatePosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updatePosition</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options. * |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,906 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - links.Timeline.ItemFloatingRange</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Class links.Timeline.ItemFloatingRange |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
<br />Extends |
|
||||
<a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>.<br /> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<br /><i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class links.Timeline.ItemFloatingRange."> |
|
||||
<caption>Class Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Constructor Attributes</th> |
|
||||
<th scope="col">Constructor Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription" > |
|
||||
<div class="fixedFont"> |
|
||||
<b><a href="../symbols/links.Timeline.ItemFloatingRange.html#constructor">links.Timeline.ItemFloatingRange</a></b>(data, options) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class links.Timeline.ItemFloatingRange."> |
|
||||
<caption>Method Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Method Attributes</th> |
|
||||
<th scope="col">Method Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#createDOM">createDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Creates the DOM for the item, depending on its type</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#getLeft">getLeft</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the left position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#getRight">getRight</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the right position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#getWidth">getWidth</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the width of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#hideDOM">hideDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Remove the items DOM from the current HTML container |
|
||||
The DOM will be kept in memory</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#isVisible">isVisible</a></b>(start, end) |
|
||||
</div> |
|
||||
<div class="description">Check if the item is visible in the timeline, and not part of a cluster</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#select">select</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Select the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#setPosition">setPosition</a></b>(left, right) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#showDOM">showDOM</a></b>(container) |
|
||||
</div> |
|
||||
<div class="description">Append the items DOM to the given HTML container.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#unselect">unselect</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Unselect the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#updateDOM">updateDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Update the DOM of the item.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemFloatingRange.html#updatePosition">updatePosition</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="inheritsList"> |
|
||||
<dt>Methods borrowed from class <a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>: </dt><dd><a href="../symbols/links.Timeline.Item.html#getImageUrls">getImageUrls</a>, <a href="../symbols/links.Timeline.Item.html#isRendered">isRendered</a>, <a href="../symbols/links.Timeline.Item.html#reflow">reflow</a></dd> |
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
<div class="details"><a name="constructor"> </a> |
|
||||
<div class="sectionTitle"> |
|
||||
Class Detail |
|
||||
</div> |
|
||||
|
|
||||
<div class="fixedFont"> |
|
||||
<b>links.Timeline.ItemFloatingRange</b>(data, options) |
|
||||
</div> |
|
||||
|
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>data</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd>Object containing parameters start, end |
|
||||
content, group, type, className, editable.</dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>options</b> |
|
||||
<i>Optional</i> |
|
||||
</dt> |
|
||||
<dd>Options to set initial property values |
|
||||
{Number} top |
|
||||
{Number} left |
|
||||
{Number} width |
|
||||
{Number} height</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Method Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="createDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Element | undefined}</span> |
|
||||
<b>createDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Creates the DOM for the item, depending on its type |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Element | undefined}</span> </dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getLeft"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getLeft</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the left position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> left</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getRight"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getRight</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the right position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> right</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getWidth"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getWidth</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the width of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> width</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="hideDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>hideDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Remove the items DOM from the current HTML container |
|
||||
The DOM will be kept in memory |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="isVisible"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{boolean}</span> |
|
||||
<b>isVisible</b>(start, end) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Check if the item is visible in the timeline, and not part of a cluster |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>start</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>end</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{boolean}</span> visible</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="select"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>select</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Select the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="setPosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>setPosition</b>(left, right) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>left</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>right</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="showDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>showDOM</b>(container) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Append the items DOM to the given HTML container. If items DOM does not yet |
|
||||
exist, it will be created first. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Element}</span> <b>container</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="unselect"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>unselect</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Unselect the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updateDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updateDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Update the DOM of the item. This will update the content and the classes |
|
||||
of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updatePosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updatePosition</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options. * |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,906 +0,0 @@ |
|||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> |
|
||||
<head> |
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
|
||||
<meta name="generator" content="JsDoc Toolkit" /> |
|
||||
|
|
||||
<title>JsDoc Reference - links.Timeline.ItemRange</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* default.css */ |
|
||||
body |
|
||||
{ |
|
||||
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; |
|
||||
width: 800px; |
|
||||
} |
|
||||
|
|
||||
.header |
|
||||
{ |
|
||||
clear: both; |
|
||||
background-color: #ccc; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
h1 |
|
||||
{ |
|
||||
font-size: 150%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 0 .3em; |
|
||||
} |
|
||||
|
|
||||
hr |
|
||||
{ |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #7F8FB1; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre.code |
|
||||
{ |
|
||||
display: block; |
|
||||
padding: 8px; |
|
||||
border: 1px dashed #ccc; |
|
||||
} |
|
||||
|
|
||||
#index |
|
||||
{ |
|
||||
margin-top: 24px; |
|
||||
float: left; |
|
||||
width: 160px; |
|
||||
position: absolute; |
|
||||
left: 8px; |
|
||||
background-color: #F3F3F3; |
|
||||
padding: 8px; |
|
||||
} |
|
||||
|
|
||||
#content |
|
||||
{ |
|
||||
margin-left: 190px; |
|
||||
width: 600px; |
|
||||
} |
|
||||
|
|
||||
.classList |
|
||||
{ |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
margin: 0 0 0 8px; |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 1em; |
|
||||
overflow: auto; |
|
||||
} |
|
||||
|
|
||||
.classList li |
|
||||
{ |
|
||||
padding: 0; |
|
||||
margin: 0 0 8px 0; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { width: 100%; } |
|
||||
|
|
||||
h1.classTitle |
|
||||
{ |
|
||||
font-size:170%; |
|
||||
line-height:130%; |
|
||||
} |
|
||||
|
|
||||
h2 { font-size: 110%; } |
|
||||
caption, div.sectionTitle |
|
||||
{ |
|
||||
background-color: #7F8FB1; |
|
||||
color: #fff; |
|
||||
font-size:130%; |
|
||||
text-align: left; |
|
||||
padding: 2px 6px 2px 6px; |
|
||||
border: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
div.sectionTitle { margin-bottom: 8px; } |
|
||||
.summaryTable thead { display: none; } |
|
||||
|
|
||||
.summaryTable td |
|
||||
{ |
|
||||
vertical-align: top; |
|
||||
padding: 4px; |
|
||||
border-bottom: 1px #7F8FB1 solid; |
|
||||
border-right: 1px #7F8FB1 solid; |
|
||||
} |
|
||||
|
|
||||
/*col#summaryAttributes {}*/ |
|
||||
.summaryTable td.attributes |
|
||||
{ |
|
||||
border-left: 1px #7F8FB1 solid; |
|
||||
width: 140px; |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
td.attributes, .fixedFont |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
color: #002EBE; |
|
||||
font-family: "Courier New",Courier,monospace; |
|
||||
font-size: 13px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription |
|
||||
{ |
|
||||
text-align: left; |
|
||||
font-size: 13px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable td.nameDescription, .description |
|
||||
{ |
|
||||
line-height: 15px; |
|
||||
padding: 4px; |
|
||||
padding-left: 4px; |
|
||||
} |
|
||||
|
|
||||
.summaryTable { margin-bottom: 8px; } |
|
||||
|
|
||||
ul.inheritsList |
|
||||
{ |
|
||||
list-style: square; |
|
||||
margin-left: 20px; |
|
||||
padding-left: 0; |
|
||||
} |
|
||||
|
|
||||
.detailList { |
|
||||
margin-left: 20px; |
|
||||
line-height: 15px; |
|
||||
} |
|
||||
.detailList dt { margin-left: 20px; } |
|
||||
|
|
||||
.detailList .heading |
|
||||
{ |
|
||||
font-weight: bold; |
|
||||
padding-bottom: 6px; |
|
||||
margin-left: 0; |
|
||||
} |
|
||||
|
|
||||
.light, td.attributes, .light a:link, .light a:visited |
|
||||
{ |
|
||||
color: #777; |
|
||||
font-style: italic; |
|
||||
} |
|
||||
|
|
||||
.fineprint |
|
||||
{ |
|
||||
text-align: right; |
|
||||
font-size: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<!-- ============================== header ================================= --> |
|
||||
<!-- begin static/header.html --> |
|
||||
<div id="header"> |
|
||||
</div> |
|
||||
<!-- end static/header.html --> |
|
||||
|
|
||||
<!-- ============================== classes index ============================ --> |
|
||||
<div id="index"> |
|
||||
<!-- begin publish.classesIndex --> |
|
||||
<div align="center"><a href="../index.html">Class Index</a> |
|
||||
| <a href="../files.html">File Index</a></div> |
|
||||
<hr /> |
|
||||
<h2>Classes</h2> |
|
||||
<ul class="classList"> |
|
||||
|
|
||||
<li><i><a href="../symbols/_global_.html">_global_</a></i></li> |
|
||||
|
|
||||
<li><a href="../symbols/Array.html">Array</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.html">links.Timeline</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ClusterGenerator.html">links.Timeline.ClusterGenerator</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemBox.html">links.Timeline.ItemBox</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemDot.html">links.Timeline.ItemDot</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemFloatingRange.html">links.Timeline.ItemFloatingRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.ItemRange.html">links.Timeline.ItemRange</a></li> |
|
||||
|
|
||||
<li><a href="../symbols/links.Timeline.StepDate.html">links.Timeline.StepDate</a></li> |
|
||||
|
|
||||
</ul> |
|
||||
<hr /> |
|
||||
<!-- end publish.classesIndex --> |
|
||||
</div> |
|
||||
|
|
||||
<div id="content"> |
|
||||
<!-- ============================== class title ============================ --> |
|
||||
<h1 class="classTitle"> |
|
||||
|
|
||||
Class links.Timeline.ItemRange |
|
||||
</h1> |
|
||||
|
|
||||
<!-- ============================== class summary ========================== --> |
|
||||
<p class="description"> |
|
||||
|
|
||||
<br />Extends |
|
||||
<a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>.<br /> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<br /><i>Defined in: </i> <a href="../symbols/src/timeline.js.html">timeline.js</a>. |
|
||||
|
|
||||
</p> |
|
||||
|
|
||||
<!-- ============================== constructor summary ==================== --> |
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class links.Timeline.ItemRange."> |
|
||||
<caption>Class Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Constructor Attributes</th> |
|
||||
<th scope="col">Constructor Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription" > |
|
||||
<div class="fixedFont"> |
|
||||
<b><a href="../symbols/links.Timeline.ItemRange.html#constructor">links.Timeline.ItemRange</a></b>(data, options) |
|
||||
</div> |
|
||||
<div class="description"></div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== properties summary ===================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== methods summary ======================== --> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class links.Timeline.ItemRange."> |
|
||||
<caption>Method Summary</caption> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">Method Attributes</th> |
|
||||
<th scope="col">Method Name and Description</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#createDOM">createDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Creates the DOM for the item, depending on its type</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#getLeft">getLeft</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the left position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#getRight">getRight</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the right position of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#getWidth">getWidth</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Calculate the width of the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#hideDOM">hideDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Remove the items DOM from the current HTML container |
|
||||
The DOM will be kept in memory</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#isVisible">isVisible</a></b>(start, end) |
|
||||
</div> |
|
||||
<div class="description">Check if the item is visible in the timeline, and not part of a cluster</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#select">select</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Select the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#setPosition">setPosition</a></b>(left, right) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#showDOM">showDOM</a></b>(container) |
|
||||
</div> |
|
||||
<div class="description">Append the items DOM to the given HTML container.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#unselect">unselect</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Unselect the item</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#updateDOM">updateDOM</a></b>() |
|
||||
</div> |
|
||||
<div class="description">Update the DOM of the item.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
<tr> |
|
||||
<td class="attributes"> </td> |
|
||||
<td class="nameDescription"> |
|
||||
<div class="fixedFont"><b><a href="../symbols/links.Timeline.ItemRange.html#updatePosition">updatePosition</a></b>(timeline) |
|
||||
</div> |
|
||||
<div class="description">Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options.</div> |
|
||||
</td> |
|
||||
</tr> |
|
||||
|
|
||||
</tbody> |
|
||||
</table> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="inheritsList"> |
|
||||
<dt>Methods borrowed from class <a href="../symbols/links.Timeline.Item.html">links.Timeline.Item</a>: </dt><dd><a href="../symbols/links.Timeline.Item.html#getImageUrls">getImageUrls</a>, <a href="../symbols/links.Timeline.Item.html#isRendered">isRendered</a>, <a href="../symbols/links.Timeline.Item.html#reflow">reflow</a></dd> |
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== events summary ======================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== constructor details ==================== --> |
|
||||
|
|
||||
<div class="details"><a name="constructor"> </a> |
|
||||
<div class="sectionTitle"> |
|
||||
Class Detail |
|
||||
</div> |
|
||||
|
|
||||
<div class="fixedFont"> |
|
||||
<b>links.Timeline.ItemRange</b>(data, options) |
|
||||
</div> |
|
||||
|
|
||||
<div class="description"> |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>data</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd>Object containing parameters start, end |
|
||||
content, group, type, className, editable.</dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Object}</span> <b>options</b> |
|
||||
<i>Optional</i> |
|
||||
</dt> |
|
||||
<dd>Options to set initial property values |
|
||||
{Number} top |
|
||||
{Number} left |
|
||||
{Number} width |
|
||||
{Number} height</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== field details ========================== --> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== method details ========================= --> |
|
||||
|
|
||||
<div class="sectionTitle"> |
|
||||
Method Detail |
|
||||
</div> |
|
||||
|
|
||||
<a name="createDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Element | undefined}</span> |
|
||||
<b>createDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Creates the DOM for the item, depending on its type |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Element | undefined}</span> </dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getLeft"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getLeft</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the left position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> left</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getRight"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getRight</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the right position of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> right</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="getWidth"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{Number}</span> |
|
||||
<b>getWidth</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Calculate the width of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{Number}</span> width</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="hideDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>hideDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Remove the items DOM from the current HTML container |
|
||||
The DOM will be kept in memory |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="isVisible"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
<span class="light">{boolean}</span> |
|
||||
<b>isVisible</b>(start, end) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Check if the item is visible in the timeline, and not part of a cluster |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>start</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>end</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Returns:</dt> |
|
||||
|
|
||||
<dd><span class="light fixedFont">{boolean}</span> visible</dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="select"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>select</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Select the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="setPosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>setPosition</b>(left, right) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>left</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Number}</span> <b>right</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="showDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>showDOM</b>(container) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Append the items DOM to the given HTML container. If items DOM does not yet |
|
||||
exist, it will be created first. |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{Element}</span> <b>container</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="unselect"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>unselect</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Unselect the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updateDOM"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updateDOM</b>() |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Update the DOM of the item. This will update the content and the classes |
|
||||
of the item |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
|
|
||||
<a name="updatePosition"> </a> |
|
||||
<div class="fixedFont"> |
|
||||
|
|
||||
|
|
||||
<b>updatePosition</b>(timeline) |
|
||||
|
|
||||
</div> |
|
||||
<div class="description"> |
|
||||
Reposition the item, recalculate its left, top, and width, using the current |
|
||||
range of the timeline and the timeline options. * |
|
||||
|
|
||||
|
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<dl class="detailList"> |
|
||||
<dt class="heading">Parameters:</dt> |
|
||||
|
|
||||
<dt> |
|
||||
<span class="light fixedFont">{<a href="../symbols/links.Timeline.html">links.Timeline</a>}</span> <b>timeline</b> |
|
||||
|
|
||||
</dt> |
|
||||
<dd></dd> |
|
||||
|
|
||||
</dl> |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
<!-- ============================== event details ========================= --> |
|
||||
|
|
||||
|
|
||||
<hr /> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
<!-- ============================== footer ================================= --> |
|
||||
<div class="fineprint" style="clear:both"> |
|
||||
|
|
||||
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Wed Mar 04 2015 09:58:28 GMT+0100 (CET) |
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
1016
static/lib/timeline/doc/jsdoc/symbols/links.Timeline.StepDate.html
File diff suppressed because it is too large
View File
5812
static/lib/timeline/doc/jsdoc/symbols/links.Timeline.html
File diff suppressed because it is too large
View File
7013
static/lib/timeline/doc/jsdoc/symbols/src/timeline.js.html
File diff suppressed because it is too large
View File
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["com",/^#[^\r\n]*/,null,"#"],["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)/,null,'"']],[["kwd",/^(?:ADS|AD|AUG|BZF|BZMF|CAE|CAF|CA|CCS|COM|CS|DAS|DCA|DCOM|DCS|DDOUBL|DIM|DOUBLE|DTCB|DTCF|DV|DXCH|EDRUPT|EXTEND|INCR|INDEX|NDX|INHINT|LXCH|MASK|MSK|MP|MSU|NOOP|OVSK|QXCH|RAND|READ|RELINT|RESUME|RETURN|ROR|RXOR|SQUARE|SU|TCR|TCAA|OVSK|TCF|TC|TS|WAND|WOR|WRITE|XCH|XLQ|XXALQ|ZL|ZQ|ADD|ADZ|SUB|SUZ|MPY|MPR|MPZ|DVP|COM|ABS|CLA|CLZ|LDQ|STO|STQ|ALS|LLS|LRS|TRA|TSQ|TMI|TOV|AXT|TIX|DLY|INP|OUT)\s/, |
|
||||
null],["typ",/^(?:-?GENADR|=MINUS|2BCADR|VN|BOF|MM|-?2CADR|-?[1-6]DNADR|ADRES|BBCON|[SE]?BANK\=?|BLOCK|BNKSUM|E?CADR|COUNT\*?|2?DEC\*?|-?DNCHAN|-?DNPTR|EQUALS|ERASE|MEMORY|2?OCT|REMADR|SETLOC|SUBRO|ORG|BSS|BES|SYN|EQU|DEFINE|END)\s/,null],["lit",/^\'(?:-*(?:\w|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?)?/],["pln",/^-*(?:[!-z_]|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?/i],["pun",/^[^\w\t\n\r \xA0()\"\\\';]+/]]),["apollo","agc","aea"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[ \t\r\n\f]+/,null," \t\r\n\u000c"]],[["str",/^\"(?:[^\n\r\f\\\"]|\\(?:\r\n?|\n|\f)|\\[\s\S])*\"/,null],["str",/^\'(?:[^\n\r\f\\\']|\\(?:\r\n?|\n|\f)|\\[\s\S])*\'/,null],["lang-css-str",/^url\(([^\)\"\']*)\)/i],["kwd",/^(?:url|rgb|\!important|@import|@page|@media|@charset|inherit)(?=[^\-\w]|$)/i,null],["lang-css-kw",/^(-?(?:[_a-z]|(?:\\[0-9a-f]+ ?))(?:[_a-z0-9\-]|\\(?:\\[0-9a-f]+ ?))*)\s*:/i],["com",/^\/\*[^*]*\*+(?:[^\/*][^*]*\*+)*\//], |
|
||||
["com",/^(?:<!--|--\>)/],["lit",/^(?:\d+|\d*\.\d+)(?:%|[a-z]+)?/i],["lit",/^#(?:[0-9a-f]{3}){1,2}/i],["pln",/^-?(?:[_a-z]|(?:\\[\da-f]+ ?))(?:[_a-z\d\-]|\\(?:\\[\da-f]+ ?))*/i],["pun",/^[^\s\w\'\"]+/]]),["css"]);PR.registerLangHandler(PR.createSimpleLexer([],[["kwd",/^-?(?:[_a-z]|(?:\\[\da-f]+ ?))(?:[_a-z\d\-]|\\(?:\\[\da-f]+ ?))*/i]]),["css-kw"]);PR.registerLangHandler(PR.createSimpleLexer([],[["str",/^[^\)\"\']+/]]),["css-str"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\x0B\x0C\r ]+/,null,"\t\n\u000b\u000c\r "],["str",/^\"(?:[^\"\\\n\x0C\r]|\\[\s\S])*(?:\"|$)/,null,'"'],["str",/^\'(?:[^\'\\\n\x0C\r]|\\[^&])\'?/,null,"'"],["lit",/^(?:0o[0-7]+|0x[\da-f]+|\d+(?:\.\d+)?(?:e[+\-]?\d+)?)/i,null,"0123456789"]],[["com",/^(?:(?:--+(?:[^\r\n\x0C]*)?)|(?:\{-(?:[^-]|-+[^-\}])*-\}))/],["kwd",/^(?:case|class|data|default|deriving|do|else|if|import|in|infix|infixl|infixr|instance|let|module|newtype|of|then|type|where|_)(?=[^a-zA-Z0-9\']|$)/, |
|
||||
null],["pln",/^(?:[A-Z][\w\']*\.)*[a-zA-Z][\w\']*/],["pun",/^[^\t\n\x0B\x0C\r a-zA-Z0-9\'\"]+/]]),["hs"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["opn",/^\(/,null,"("],["clo",/^\)/,null,")"],["com",/^;[^\r\n]*/,null,";"],["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)/,null,'"']],[["kwd",/^(?:block|c[ad]+r|catch|con[ds]|def(?:ine|un)|do|eq|eql|equal|equalp|eval-when|flet|format|go|if|labels|lambda|let|load-time-value|locally|macrolet|multiple-value-call|nil|progn|progv|quote|require|return-from|setq|symbol-macrolet|t|tagbody|the|throw|unwind)\b/, |
|
||||
null],["lit",/^[+\-]?(?:0x[0-9a-f]+|\d+\/\d+|(?:\.\d+|\d+(?:\.\d*)?)(?:[ed][+\-]?\d+)?)/i],["lit",/^\'(?:-*(?:\w|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?)?/],["pln",/^-*(?:[a-z_]|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?/i],["pun",/^[^\w\t\n\r \xA0()\"\\\';]+/]]),["cl","el","lisp","scm"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^(?:\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)|\'(?:[^\'\\]|\\[\s\S])*(?:\'|$))/,null,"\"'"]],[["com",/^--(?:\[(=*)\[[\s\S]*?(?:\]\1\]|$)|[^\r\n]*)/],["str",/^\[(=*)\[[\s\S]*?(?:\]\1\]|$)/],["kwd",/^(?:and|break|do|else|elseif|end|false|for|function|if|in|local|nil|not|or|repeat|return|then|true|until|while)\b/,null],["lit",/^[+-]?(?:0x[\da-f]+|(?:(?:\.\d+|\d+(?:\.\d*)?)(?:e[+\-]?\d+)?))/i], |
|
||||
["pln",/^[a-z_]\w*/i],["pun",/^[^\w\t\n\r \xA0][^\w\t\n\r \xA0\"\'\-\+=]*/]]),["lua"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["com",/^#(?:if[\t\n\r \xA0]+(?:[a-z_$][\w\']*|``[^\r\n\t`]*(?:``|$))|else|endif|light)/i,null,"#"],["str",/^(?:\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)|\'(?:[^\'\\]|\\[\s\S])*(?:\'|$))/,null,"\"'"]],[["com",/^(?:\/\/[^\r\n]*|\(\*[\s\S]*?\*\))/],["kwd",/^(?:abstract|and|as|assert|begin|class|default|delegate|do|done|downcast|downto|elif|else|end|exception|extern|false|finally|for|fun|function|if|in|inherit|inline|interface|internal|lazy|let|match|member|module|mutable|namespace|new|null|of|open|or|override|private|public|rec|return|static|struct|then|to|true|try|type|upcast|use|val|void|when|while|with|yield|asr|land|lor|lsl|lsr|lxor|mod|sig|atomic|break|checked|component|const|constraint|constructor|continue|eager|event|external|fixed|functor|global|include|method|mixin|object|parallel|process|protected|pure|sealed|trait|virtual|volatile)\b/], |
|
||||
["lit",/^[+\-]?(?:0x[\da-f]+|(?:(?:\.\d+|\d+(?:\.\d*)?)(?:e[+\-]?\d+)?))/i],["pln",/^(?:[a-z_]\w*[!?#]?|``[^\r\n\t`]*(?:``|$))/i],["pun",/^[^\t\n\r \xA0\"\'\w]+/]]),["fs","ml"]) |
|
@ -1 +0,0 @@ |
|||||
PR.registerLangHandler(PR.sourceDecorator({keywords:"bool bytes default double enum extend extensions false fixed32 fixed64 float group import int32 int64 max message option optional package repeated required returns rpc service sfixed32 sfixed64 sint32 sint64 string syntax to true uint32 uint64",cStyleComments:true}),["proto"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^(?:"(?:(?:""(?:""?(?!")|[^\\"]|\\.)*"{0,3})|(?:[^"\r\n\\]|\\.)*"?))/,null,'"'],["lit",/^`(?:[^\r\n\\`]|\\.)*`?/,null,"`"],["pun",/^[!#%&()*+,\-:;<=>?@\[\\\]^{|}~]+/,null,"!#%&()*+,-:;<=>?@[\\]^{|}~"]],[["str",/^'(?:[^\r\n\\']|\\(?:'|[^\r\n']+))'/],["lit",/^'[a-zA-Z_$][\w$]*(?!['$\w])/],["kwd",/^(?:abstract|case|catch|class|def|do|else|extends|final|finally|for|forSome|if|implicit|import|lazy|match|new|object|override|package|private|protected|requires|return|sealed|super|throw|trait|try|type|val|var|while|with|yield)\b/], |
|
||||
["lit",/^(?:true|false|null|this)\b/],["lit",/^(?:(?:0(?:[0-7]+|X[0-9A-F]+))L?|(?:(?:0|[1-9][0-9]*)(?:(?:\.[0-9]+)?(?:E[+\-]?[0-9]+)?F?|L?))|\\.[0-9]+(?:E[+\-]?[0-9]+)?F?)/i],["typ",/^[$_]*[A-Z][_$A-Z0-9]*[a-z][\w$]*/],["pln",/^[$a-zA-Z_][\w$]*/],["com",/^\/(?:\/.*|\*(?:\/|\**[^*/])*(?:\*+\/?)?)/],["pun",/^(?:\.+|\/)/]]),["scala"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^(?:"(?:[^\"\\]|\\.)*"|'(?:[^\'\\]|\\.)*')/,null,"\"'"]],[["com",/^(?:--[^\r\n]*|\/\*[\s\S]*?(?:\*\/|$))/],["kwd",/^(?:ADD|ALL|ALTER|AND|ANY|AS|ASC|AUTHORIZATION|BACKUP|BEGIN|BETWEEN|BREAK|BROWSE|BULK|BY|CASCADE|CASE|CHECK|CHECKPOINT|CLOSE|CLUSTERED|COALESCE|COLLATE|COLUMN|COMMIT|COMPUTE|CONSTRAINT|CONTAINS|CONTAINSTABLE|CONTINUE|CONVERT|CREATE|CROSS|CURRENT|CURRENT_DATE|CURRENT_TIME|CURRENT_TIMESTAMP|CURRENT_USER|CURSOR|DATABASE|DBCC|DEALLOCATE|DECLARE|DEFAULT|DELETE|DENY|DESC|DISK|DISTINCT|DISTRIBUTED|DOUBLE|DROP|DUMMY|DUMP|ELSE|END|ERRLVL|ESCAPE|EXCEPT|EXEC|EXECUTE|EXISTS|EXIT|FETCH|FILE|FILLFACTOR|FOR|FOREIGN|FREETEXT|FREETEXTTABLE|FROM|FULL|FUNCTION|GOTO|GRANT|GROUP|HAVING|HOLDLOCK|IDENTITY|IDENTITYCOL|IDENTITY_INSERT|IF|IN|INDEX|INNER|INSERT|INTERSECT|INTO|IS|JOIN|KEY|KILL|LEFT|LIKE|LINENO|LOAD|NATIONAL|NOCHECK|NONCLUSTERED|NOT|NULL|NULLIF|OF|OFF|OFFSETS|ON|OPEN|OPENDATASOURCE|OPENQUERY|OPENROWSET|OPENXML|OPTION|OR|ORDER|OUTER|OVER|PERCENT|PLAN|PRECISION|PRIMARY|PRINT|PROC|PROCEDURE|PUBLIC|RAISERROR|READ|READTEXT|RECONFIGURE|REFERENCES|REPLICATION|RESTORE|RESTRICT|RETURN|REVOKE|RIGHT|ROLLBACK|ROWCOUNT|ROWGUIDCOL|RULE|SAVE|SCHEMA|SELECT|SESSION_USER|SET|SETUSER|SHUTDOWN|SOME|STATISTICS|SYSTEM_USER|TABLE|TEXTSIZE|THEN|TO|TOP|TRAN|TRANSACTION|TRIGGER|TRUNCATE|TSEQUAL|UNION|UNIQUE|UPDATE|UPDATETEXT|USE|USER|VALUES|VARYING|VIEW|WAITFOR|WHEN|WHERE|WHILE|WITH|WRITETEXT)(?=[^\w-]|$)/i, |
|
||||
null],["lit",/^[+-]?(?:0x[\da-f]+|(?:(?:\.\d+|\d+(?:\.\d*)?)(?:e[+\-]?\d+)?))/i],["pln",/^[a-z_][\w-]*/i],["pun",/^[^\w\t\n\r \xA0\"\'][^\w\t\n\r \xA0+\-\"\']*/]]),["sql"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0\u2028\u2029]+/,null,"\t\n\r \u00a0\u2028\u2029"],["str",/^(?:[\"\u201C\u201D](?:[^\"\u201C\u201D]|[\"\u201C\u201D]{2})(?:[\"\u201C\u201D]c|$)|[\"\u201C\u201D](?:[^\"\u201C\u201D]|[\"\u201C\u201D]{2})*(?:[\"\u201C\u201D]|$))/i,null,'"\u201c\u201d'],["com",/^[\'\u2018\u2019][^\r\n\u2028\u2029]*/,null,"'\u2018\u2019"]],[["kwd",/^(?:AddHandler|AddressOf|Alias|And|AndAlso|Ansi|As|Assembly|Auto|Boolean|ByRef|Byte|ByVal|Call|Case|Catch|CBool|CByte|CChar|CDate|CDbl|CDec|Char|CInt|Class|CLng|CObj|Const|CShort|CSng|CStr|CType|Date|Decimal|Declare|Default|Delegate|Dim|DirectCast|Do|Double|Each|Else|ElseIf|End|EndIf|Enum|Erase|Error|Event|Exit|Finally|For|Friend|Function|Get|GetType|GoSub|GoTo|Handles|If|Implements|Imports|In|Inherits|Integer|Interface|Is|Let|Lib|Like|Long|Loop|Me|Mod|Module|MustInherit|MustOverride|MyBase|MyClass|Namespace|New|Next|Not|NotInheritable|NotOverridable|Object|On|Option|Optional|Or|OrElse|Overloads|Overridable|Overrides|ParamArray|Preserve|Private|Property|Protected|Public|RaiseEvent|ReadOnly|ReDim|RemoveHandler|Resume|Return|Select|Set|Shadows|Shared|Short|Single|Static|Step|Stop|String|Structure|Sub|SyncLock|Then|Throw|To|Try|TypeOf|Unicode|Until|Variant|Wend|When|While|With|WithEvents|WriteOnly|Xor|EndIf|GoSub|Let|Variant|Wend)\b/i, |
|
||||
null],["com",/^REM[^\r\n\u2028\u2029]*/i],["lit",/^(?:True\b|False\b|Nothing\b|\d+(?:E[+\-]?\d+[FRD]?|[FRDSIL])?|(?:&H[0-9A-F]+|&O[0-7]+)[SIL]?|\d*\.\d+(?:E[+\-]?\d+)?[FRD]?|#\s+(?:\d+[\-\/]\d+[\-\/]\d+(?:\s+\d+:\d+(?::\d+)?(\s*(?:AM|PM))?)?|\d+:\d+(?::\d+)?(\s*(?:AM|PM))?)\s+#)/i],["pln",/^(?:(?:[a-z]|_\w)\w*|\[(?:[a-z]|_\w)\w*\])/i],["pun",/^[^\w\t\n\r \"\'\[\]\xA0\u2018\u2019\u201C\u201D\u2028\u2029]+/],["pun",/^(?:\[|\])/]]),["vb","vbs"]) |
|
@ -1,3 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"]],[["str",/^(?:[BOX]?"(?:[^\"]|"")*"|'.')/i],["com",/^--[^\r\n]*/],["kwd",/^(?:abs|access|after|alias|all|and|architecture|array|assert|attribute|begin|block|body|buffer|bus|case|component|configuration|constant|disconnect|downto|else|elsif|end|entity|exit|file|for|function|generate|generic|group|guarded|if|impure|in|inertial|inout|is|label|library|linkage|literal|loop|map|mod|nand|new|next|nor|not|null|of|on|open|or|others|out|package|port|postponed|procedure|process|pure|range|record|register|reject|rem|report|return|rol|ror|select|severity|shared|signal|sla|sll|sra|srl|subtype|then|to|transport|type|unaffected|units|until|use|variable|wait|when|while|with|xnor|xor)(?=[^\w-]|$)/i, |
|
||||
null],["typ",/^(?:bit|bit_vector|character|boolean|integer|real|time|string|severity_level|positive|natural|signed|unsigned|line|text|std_u?logic(?:_vector)?)(?=[^\w-]|$)/i,null],["typ",/^\'(?:ACTIVE|ASCENDING|BASE|DELAYED|DRIVING|DRIVING_VALUE|EVENT|HIGH|IMAGE|INSTANCE_NAME|LAST_ACTIVE|LAST_EVENT|LAST_VALUE|LEFT|LEFTOF|LENGTH|LOW|PATH_NAME|POS|PRED|QUIET|RANGE|REVERSE_RANGE|RIGHT|RIGHTOF|SIMPLE_NAME|STABLE|SUCC|TRANSACTION|VAL|VALUE)(?=[^\w-]|$)/i,null],["lit",/^\d+(?:_\d+)*(?:#[\w\\.]+#(?:[+\-]?\d+(?:_\d+)*)?|(?:\.\d+(?:_\d+)*)?(?:E[+\-]?\d+(?:_\d+)*)?)/i], |
|
||||
["pln",/^(?:[a-z]\w*|\\[^\\]*\\)/i],["pun",/^[^\w\t\n\r \xA0\"\'][^\w\t\n\r \xA0\-\"\']*/]]),["vhdl","vhd"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t \xA0a-gi-z0-9]+/,null,"\t \u00a0abcdefgijklmnopqrstuvwxyz0123456789"],["pun",/^[=*~\^\[\]]+/,null,"=*~^[]"]],[["lang-wiki.meta",/(?:^^|\r\n?|\n)(#[a-z]+)\b/],["lit",/^(?:[A-Z][a-z][a-z0-9]+[A-Z][a-z][a-zA-Z0-9]+)\b/],["lang-",/^\{\{\{([\s\S]+?)\}\}\}/],["lang-",/^`([^\r\n`]+)`/],["str",/^https?:\/\/[^\/?#\s]*(?:\/[^?#\s]*)?(?:\?[^#\s]*)?(?:#\S*)?/i],["pln",/^(?:\r\n|[\s\S])[^#=*~^A-Zh\{`\[\r\n]*/]]),["wiki"]); |
|
||||
PR.registerLangHandler(PR.createSimpleLexer([["kwd",/^#[a-z]+/i,null,"#"]],[]),["wiki.meta"]) |
|
@ -1,2 +0,0 @@ |
|||||
PR.registerLangHandler(PR.createSimpleLexer([["pun",/^[:|>?]+/,null,":|>?"],["dec",/^%(?:YAML|TAG)[^#\r\n]+/,null,"%"],["typ",/^[&]\S+/,null,"&"],["typ",/^!\S*/,null,"!"],["str",/^"(?:[^\\"]|\\.)*(?:"|$)/,null,'"'],["str",/^'(?:[^']|'')*(?:'|$)/,null,"'"],["com",/^#[^\r\n]*/,null,"#"],["pln",/^\s+/,null," \t\r\n"]],[["dec",/^(?:---|\.\.\.)(?:[\r\n]|$)/],["pun",/^-/],["kwd",/^\w+:[ \r\n]/],["pln",/^\w+/]]), |
|
||||
["yaml","yml"]) |
|
@ -1 +0,0 @@ |
|||||
.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun{color:#660}.pln{color:#000}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec{color:#606}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}@media print{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun{color:#440}.pln{color:#000}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}} |
|
@ -1,33 +0,0 @@ |
|||||
window.PR_SHOULD_USE_CONTINUATION=true;window.PR_TAB_WIDTH=8;window.PR_normalizedHtml=window.PR=window.prettyPrintOne=window.prettyPrint=void 0;window._pr_isIE6=function(){var y=navigator&&navigator.userAgent&&navigator.userAgent.match(/\bMSIE ([678])\./);y=y?+y[1]:false;window._pr_isIE6=function(){return y};return y}; |
|
||||
(function(){function y(b){return b.replace(L,"&").replace(M,"<").replace(N,">")}function H(b,f,i){switch(b.nodeType){case 1:var o=b.tagName.toLowerCase();f.push("<",o);var l=b.attributes,n=l.length;if(n){if(i){for(var r=[],j=n;--j>=0;)r[j]=l[j];r.sort(function(q,m){return q.name<m.name?-1:q.name===m.name?0:1});l=r}for(j=0;j<n;++j){r=l[j];r.specified&&f.push(" ",r.name.toLowerCase(),'="',r.value.replace(L,"&").replace(M,"<").replace(N,">").replace(X,"""),'"')}}f.push(">"); |
|
||||
for(l=b.firstChild;l;l=l.nextSibling)H(l,f,i);if(b.firstChild||!/^(?:br|link|img)$/.test(o))f.push("</",o,">");break;case 3:case 4:f.push(y(b.nodeValue));break}}function O(b){function f(c){if(c.charAt(0)!=="\\")return c.charCodeAt(0);switch(c.charAt(1)){case "b":return 8;case "t":return 9;case "n":return 10;case "v":return 11;case "f":return 12;case "r":return 13;case "u":case "x":return parseInt(c.substring(2),16)||c.charCodeAt(1);case "0":case "1":case "2":case "3":case "4":case "5":case "6":case "7":return parseInt(c.substring(1), |
|
||||
8);default:return c.charCodeAt(1)}}function i(c){if(c<32)return(c<16?"\\x0":"\\x")+c.toString(16);c=String.fromCharCode(c);if(c==="\\"||c==="-"||c==="["||c==="]")c="\\"+c;return c}function o(c){var d=c.substring(1,c.length-1).match(RegExp("\\\\u[0-9A-Fa-f]{4}|\\\\x[0-9A-Fa-f]{2}|\\\\[0-3][0-7]{0,2}|\\\\[0-7]{1,2}|\\\\[\\s\\S]|-|[^-\\\\]","g"));c=[];for(var a=[],k=d[0]==="^",e=k?1:0,h=d.length;e<h;++e){var g=d[e];switch(g){case "\\B":case "\\b":case "\\D":case "\\d":case "\\S":case "\\s":case "\\W":case "\\w":c.push(g); |
|
||||
continue}g=f(g);var s;if(e+2<h&&"-"===d[e+1]){s=f(d[e+2]);e+=2}else s=g;a.push([g,s]);if(!(s<65||g>122)){s<65||g>90||a.push([Math.max(65,g)|32,Math.min(s,90)|32]);s<97||g>122||a.push([Math.max(97,g)&-33,Math.min(s,122)&-33])}}a.sort(function(v,w){return v[0]-w[0]||w[1]-v[1]});d=[];g=[NaN,NaN];for(e=0;e<a.length;++e){h=a[e];if(h[0]<=g[1]+1)g[1]=Math.max(g[1],h[1]);else d.push(g=h)}a=["["];k&&a.push("^");a.push.apply(a,c);for(e=0;e<d.length;++e){h=d[e];a.push(i(h[0]));if(h[1]>h[0]){h[1]+1>h[0]&&a.push("-"); |
|
||||
a.push(i(h[1]))}}a.push("]");return a.join("")}function l(c){for(var d=c.source.match(RegExp("(?:\\[(?:[^\\x5C\\x5D]|\\\\[\\s\\S])*\\]|\\\\u[A-Fa-f0-9]{4}|\\\\x[A-Fa-f0-9]{2}|\\\\[0-9]+|\\\\[^ux0-9]|\\(\\?[:!=]|[\\(\\)\\^]|[^\\x5B\\x5C\\(\\)\\^]+)","g")),a=d.length,k=[],e=0,h=0;e<a;++e){var g=d[e];if(g==="(")++h;else if("\\"===g.charAt(0))if((g=+g.substring(1))&&g<=h)k[g]=-1}for(e=1;e<k.length;++e)if(-1===k[e])k[e]=++n;for(h=e=0;e<a;++e){g=d[e];if(g==="("){++h;if(k[h]===undefined)d[e]="(?:"}else if("\\"=== |
|
||||
g.charAt(0))if((g=+g.substring(1))&&g<=h)d[e]="\\"+k[h]}for(h=e=0;e<a;++e)if("^"===d[e]&&"^"!==d[e+1])d[e]="";if(c.ignoreCase&&r)for(e=0;e<a;++e){g=d[e];c=g.charAt(0);if(g.length>=2&&c==="[")d[e]=o(g);else if(c!=="\\")d[e]=g.replace(/[a-zA-Z]/g,function(s){s=s.charCodeAt(0);return"["+String.fromCharCode(s&-33,s|32)+"]"})}return d.join("")}for(var n=0,r=false,j=false,q=0,m=b.length;q<m;++q){var t=b[q];if(t.ignoreCase)j=true;else if(/[a-z]/i.test(t.source.replace(/\\u[0-9a-f]{4}|\\x[0-9a-f]{2}|\\[^ux]/gi, |
|
||||
""))){r=true;j=false;break}}var p=[];q=0;for(m=b.length;q<m;++q){t=b[q];if(t.global||t.multiline)throw Error(""+t);p.push("(?:"+l(t)+")")}return RegExp(p.join("|"),j?"gi":"g")}function Y(b){var f=0;return function(i){for(var o=null,l=0,n=0,r=i.length;n<r;++n)switch(i.charAt(n)){case "\t":o||(o=[]);o.push(i.substring(l,n));l=b-f%b;for(f+=l;l>=0;l-=16)o.push(" ".substring(0,l));l=n+1;break;case "\n":f=0;break;default:++f}if(!o)return i;o.push(i.substring(l));return o.join("")}}function I(b, |
|
||||
f,i,o){if(f){b={source:f,c:b};i(b);o.push.apply(o,b.d)}}function B(b,f){var i={},o;(function(){for(var r=b.concat(f),j=[],q={},m=0,t=r.length;m<t;++m){var p=r[m],c=p[3];if(c)for(var d=c.length;--d>=0;)i[c.charAt(d)]=p;p=p[1];c=""+p;if(!q.hasOwnProperty(c)){j.push(p);q[c]=null}}j.push(/[\0-\uffff]/);o=O(j)})();var l=f.length;function n(r){for(var j=r.c,q=[j,z],m=0,t=r.source.match(o)||[],p={},c=0,d=t.length;c<d;++c){var a=t[c],k=p[a],e=void 0,h;if(typeof k==="string")h=false;else{var g=i[a.charAt(0)]; |
|
||||
if(g){e=a.match(g[1]);k=g[0]}else{for(h=0;h<l;++h){g=f[h];if(e=a.match(g[1])){k=g[0];break}}e||(k=z)}if((h=k.length>=5&&"lang-"===k.substring(0,5))&&!(e&&typeof e[1]==="string")){h=false;k=P}h||(p[a]=k)}g=m;m+=a.length;if(h){h=e[1];var s=a.indexOf(h),v=s+h.length;if(e[2]){v=a.length-e[2].length;s=v-h.length}k=k.substring(5);I(j+g,a.substring(0,s),n,q);I(j+g+s,h,Q(k,h),q);I(j+g+v,a.substring(v),n,q)}else q.push(j+g,k)}r.d=q}return n}function x(b){var f=[],i=[];if(b.tripleQuotedStrings)f.push([A,/^(?:\'\'\'(?:[^\'\\]|\\[\s\S]|\'{1,2}(?=[^\']))*(?:\'\'\'|$)|\"\"\"(?:[^\"\\]|\\[\s\S]|\"{1,2}(?=[^\"]))*(?:\"\"\"|$)|\'(?:[^\\\']|\\[\s\S])*(?:\'|$)|\"(?:[^\\\"]|\\[\s\S])*(?:\"|$))/, |
|
||||
null,"'\""]);else b.multiLineStrings?f.push([A,/^(?:\'(?:[^\\\']|\\[\s\S])*(?:\'|$)|\"(?:[^\\\"]|\\[\s\S])*(?:\"|$)|\`(?:[^\\\`]|\\[\s\S])*(?:\`|$))/,null,"'\"`"]):f.push([A,/^(?:\'(?:[^\\\'\r\n]|\\.)*(?:\'|$)|\"(?:[^\\\"\r\n]|\\.)*(?:\"|$))/,null,"\"'"]);b.verbatimStrings&&i.push([A,/^@\"(?:[^\"]|\"\")*(?:\"|$)/,null]);if(b.hashComments)if(b.cStyleComments){f.push([C,/^#(?:(?:define|elif|else|endif|error|ifdef|include|ifndef|line|pragma|undef|warning)\b|[^\r\n]*)/,null,"#"]);i.push([A,/^<(?:(?:(?:\.\.\/)*|\/?)(?:[\w-]+(?:\/[\w-]+)+)?[\w-]+\.h|[a-z]\w*)>/, |
|
||||
null])}else f.push([C,/^#[^\r\n]*/,null,"#"]);if(b.cStyleComments){i.push([C,/^\/\/[^\r\n]*/,null]);i.push([C,/^\/\*[\s\S]*?(?:\*\/|$)/,null])}b.regexLiterals&&i.push(["lang-regex",RegExp("^"+Z+"(/(?=[^/*])(?:[^/\\x5B\\x5C]|\\x5C[\\s\\S]|\\x5B(?:[^\\x5C\\x5D]|\\x5C[\\s\\S])*(?:\\x5D|$))+/)")]);b=b.keywords.replace(/^\s+|\s+$/g,"");b.length&&i.push([R,RegExp("^(?:"+b.replace(/\s+/g,"|")+")\\b"),null]);f.push([z,/^\s+/,null," \r\n\t\u00a0"]);i.push([J,/^@[a-z_$][a-z_$@0-9]*/i,null],[S,/^@?[A-Z]+[a-z][A-Za-z_$@0-9]*/, |
|
||||
null],[z,/^[a-z_$][a-z_$@0-9]*/i,null],[J,/^(?:0x[a-f0-9]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+\-]?\d+)?)[a-z]*/i,null,"0123456789"],[E,/^.[^\s\w\.$@\'\"\`\/\#]*/,null]);return B(f,i)}function $(b){function f(D){if(D>r){if(j&&j!==q){n.push("</span>");j=null}if(!j&&q){j=q;n.push('<span class="',j,'">')}var T=y(p(i.substring(r,D))).replace(e?d:c,"$1 ");e=k.test(T);n.push(T.replace(a,s));r=D}}var i=b.source,o=b.g,l=b.d,n=[],r=0,j=null,q=null,m=0,t=0,p=Y(window.PR_TAB_WIDTH),c=/([\r\n ]) /g, |
|
||||
d=/(^| ) /gm,a=/\r\n?|\n/g,k=/[ \r\n]$/,e=true,h=window._pr_isIE6();h=h?b.b.tagName==="PRE"?h===6?" \r\n":h===7?" <br>\r":" \r":" <br />":"<br />";var g=b.b.className.match(/\blinenums\b(?::(\d+))?/),s;if(g){for(var v=[],w=0;w<10;++w)v[w]=h+'</li><li class="L'+w+'">';var F=g[1]&&g[1].length?g[1]-1:0;n.push('<ol class="linenums"><li class="L',F%10,'"');F&&n.push(' value="',F+1,'"');n.push(">");s=function(){var D=v[++F%10];return j?"</span>"+D+'<span class="'+j+'">':D}}else s=h; |
|
||||
for(;;)if(m<o.length?t<l.length?o[m]<=l[t]:true:false){f(o[m]);if(j){n.push("</span>");j=null}n.push(o[m+1]);m+=2}else if(t<l.length){f(l[t]);q=l[t+1];t+=2}else break;f(i.length);j&&n.push("</span>");g&&n.push("</li></ol>");b.a=n.join("")}function u(b,f){for(var i=f.length;--i>=0;){var o=f[i];if(G.hasOwnProperty(o))"console"in window&&console.warn("cannot override language handler %s",o);else G[o]=b}}function Q(b,f){b&&G.hasOwnProperty(b)||(b=/^\s*</.test(f)?"default-markup":"default-code");return G[b]} |
|
||||
function U(b){var f=b.f,i=b.e;b.a=f;try{var o,l=f.match(aa);f=[];var n=0,r=[];if(l)for(var j=0,q=l.length;j<q;++j){var m=l[j];if(m.length>1&&m.charAt(0)==="<"){if(!ba.test(m))if(ca.test(m)){f.push(m.substring(9,m.length-3));n+=m.length-12}else if(da.test(m)){f.push("\n");++n}else if(m.indexOf(V)>=0&&m.replace(/\s(\w+)\s*=\s*(?:\"([^\"]*)\"|'([^\']*)'|(\S+))/g,' $1="$2$3$4"').match(/[cC][lL][aA][sS][sS]=\"[^\"]*\bnocode\b/)){var t=m.match(W)[2],p=1,c;c=j+1;a:for(;c<q;++c){var d=l[c].match(W);if(d&& |
|
||||
d[2]===t)if(d[1]==="/"){if(--p===0)break a}else++p}if(c<q){r.push(n,l.slice(j,c+1).join(""));j=c}else r.push(n,m)}else r.push(n,m)}else{var a;p=m;var k=p.indexOf("&");if(k<0)a=p;else{for(--k;(k=p.indexOf("&#",k+1))>=0;){var e=p.indexOf(";",k);if(e>=0){var h=p.substring(k+3,e),g=10;if(h&&h.charAt(0)==="x"){h=h.substring(1);g=16}var s=parseInt(h,g);isNaN(s)||(p=p.substring(0,k)+String.fromCharCode(s)+p.substring(e+1))}}a=p.replace(ea,"<").replace(fa,">").replace(ga,"'").replace(ha,'"').replace(ia," ").replace(ja, |
|
||||
"&")}f.push(a);n+=a.length}}o={source:f.join(""),h:r};var v=o.source;b.source=v;b.c=0;b.g=o.h;Q(i,v)(b);$(b)}catch(w){if("console"in window)console.log(w&&w.stack?w.stack:w)}}var A="str",R="kwd",C="com",S="typ",J="lit",E="pun",z="pln",P="src",V="nocode",Z=function(){for(var b=["!","!=","!==","#","%","%=","&","&&","&&=","&=","(","*","*=","+=",",","-=","->","/","/=",":","::",";","<","<<","<<=","<=","=","==","===",">",">=",">>",">>=",">>>",">>>=","?","@","[","^","^=","^^","^^=","{","|","|=","||","||=", |
|
||||
"~","break","case","continue","delete","do","else","finally","instanceof","return","throw","try","typeof"],f="(?:^^|[+-]",i=0;i<b.length;++i)f+="|"+b[i].replace(/([^=<>:&a-z])/g,"\\$1");f+=")\\s*";return f}(),L=/&/g,M=/</g,N=/>/g,X=/\"/g,ea=/</g,fa=/>/g,ga=/'/g,ha=/"/g,ja=/&/g,ia=/ /g,ka=/[\r\n]/g,K=null,aa=RegExp("[^<]+|<!--[\\s\\S]*?--\>|<!\\[CDATA\\[[\\s\\S]*?\\]\\]>|</?[a-zA-Z](?:[^>\"']|'[^']*'|\"[^\"]*\")*>|<","g"),ba=/^<\!--/,ca=/^<!\[CDATA\[/,da=/^<br\b/i,W=/^<(\/?)([a-zA-Z][a-zA-Z0-9]*)/, |
|
||||
la=x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof alignof align_union asm axiom bool concept concept_map const_cast constexpr decltype dynamic_cast explicit export friend inline late_check mutable namespace nullptr reinterpret_cast static_assert static_cast template typeid typename using virtual wchar_t where break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof abstract boolean byte extends final finally implements import instanceof null native package strictfp super synchronized throws transient as base by checked decimal delegate descending event fixed foreach from group implicit in interface internal into is lock object out override orderby params partial readonly ref sbyte sealed stackalloc string select uint ulong unchecked unsafe ushort var break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof debugger eval export function get null set undefined var with Infinity NaN caller delete die do dump elsif eval exit foreach for goto if import last local my next no our print package redo require sub undef unless until use wantarray while BEGIN END break continue do else for if return while and as assert class def del elif except exec finally from global import in is lambda nonlocal not or pass print raise try with yield False True None break continue do else for if return while alias and begin case class def defined elsif end ensure false in module next nil not or redo rescue retry self super then true undef unless until when yield BEGIN END break continue do else for if return while case done elif esac eval fi function in local set then until ", |
|
||||
hashComments:true,cStyleComments:true,multiLineStrings:true,regexLiterals:true}),G={};u(la,["default-code"]);u(B([],[[z,/^[^<?]+/],["dec",/^<!\w[^>]*(?:>|$)/],[C,/^<\!--[\s\S]*?(?:-\->|$)/],["lang-",/^<\?([\s\S]+?)(?:\?>|$)/],["lang-",/^<%([\s\S]+?)(?:%>|$)/],[E,/^(?:<[%?]|[%?]>)/],["lang-",/^<xmp\b[^>]*>([\s\S]+?)<\/xmp\b[^>]*>/i],["lang-js",/^<script\b[^>]*>([\s\S]*?)(<\/script\b[^>]*>)/i],["lang-css",/^<style\b[^>]*>([\s\S]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),["default-markup", |
|
||||
"htm","html","mxml","xhtml","xml","xsl"]);u(B([[z,/^[\s]+/,null," \t\r\n"],["atv",/^(?:\"[^\"]*\"?|\'[^\']*\'?)/,null,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w.:-]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^>\'\"\s]*(?:[^>\'\"\s\/]|\/(?=\s)))/],[E,/^[=<>\/]+/],["lang-js",/^on\w+\s*=\s*\"([^\"]+)\"/i],["lang-js",/^on\w+\s*=\s*\'([^\']+)\'/i],["lang-js",/^on\w+\s*=\s*([^\"\'>\s]+)/i],["lang-css",/^style\s*=\s*\"([^\"]+)\"/i],["lang-css",/^style\s*=\s*\'([^\']+)\'/i], |
|
||||
["lang-css",/^style\s*=\s*([^\"\'>\s]+)/i]]),["in.tag"]);u(B([],[["atv",/^[\s\S]+/]]),["uq.val"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof alignof align_union asm axiom bool concept concept_map const_cast constexpr decltype dynamic_cast explicit export friend inline late_check mutable namespace nullptr reinterpret_cast static_assert static_cast template typeid typename using virtual wchar_t where ", |
|
||||
hashComments:true,cStyleComments:true}),["c","cc","cpp","cxx","cyc","m"]);u(x({keywords:"null true false"}),["json"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof abstract boolean byte extends final finally implements import instanceof null native package strictfp super synchronized throws transient as base by checked decimal delegate descending event fixed foreach from group implicit in interface internal into is lock object out override orderby params partial readonly ref sbyte sealed stackalloc string select uint ulong unchecked unsafe ushort var ", |
|
||||
hashComments:true,cStyleComments:true,verbatimStrings:true}),["cs"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof abstract boolean byte extends final finally implements import instanceof null native package strictfp super synchronized throws transient ", |
|
||||
cStyleComments:true}),["java"]);u(x({keywords:"break continue do else for if return while case done elif esac eval fi function in local set then until ",hashComments:true,multiLineStrings:true}),["bsh","csh","sh"]);u(x({keywords:"break continue do else for if return while and as assert class def del elif except exec finally from global import in is lambda nonlocal not or pass print raise try with yield False True None ",hashComments:true,multiLineStrings:true,tripleQuotedStrings:true}),["cv","py"]); |
|
||||
u(x({keywords:"caller delete die do dump elsif eval exit foreach for goto if import last local my next no our print package redo require sub undef unless until use wantarray while BEGIN END ",hashComments:true,multiLineStrings:true,regexLiterals:true}),["perl","pl","pm"]);u(x({keywords:"break continue do else for if return while alias and begin case class def defined elsif end ensure false in module next nil not or redo rescue retry self super then true undef unless until when yield BEGIN END ",hashComments:true, |
|
||||
multiLineStrings:true,regexLiterals:true}),["rb"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof debugger eval export function get null set undefined var with Infinity NaN ",cStyleComments:true,regexLiterals:true}),["js"]);u(B([],[[A,/^[\s\S]+/]]), |
|
||||
["regex"]);window.PR_normalizedHtml=H;window.prettyPrintOne=function(b,f){var i={f:b,e:f};U(i);return i.a};window.prettyPrint=function(b){function f(){for(var t=window.PR_SHOULD_USE_CONTINUATION?j.now()+250:Infinity;q<o.length&&j.now()<t;q++){var p=o[q];if(p.className&&p.className.indexOf("prettyprint")>=0){var c=p.className.match(/\blang-(\w+)\b/);if(c)c=c[1];for(var d=false,a=p.parentNode;a;a=a.parentNode)if((a.tagName==="pre"||a.tagName==="code"||a.tagName==="xmp")&&a.className&&a.className.indexOf("prettyprint")>= |
|
||||
0){d=true;break}if(!d){a=p;if(null===K){d=document.createElement("PRE");d.appendChild(document.createTextNode('<!DOCTYPE foo PUBLIC "foo bar">\n<foo />'));K=!/</.test(d.innerHTML)}if(K){d=a.innerHTML;if("XMP"===a.tagName)d=y(d);else{a=a;if("PRE"===a.tagName)a=true;else if(ka.test(d)){var k="";if(a.currentStyle)k=a.currentStyle.whiteSpace;else if(window.getComputedStyle)k=window.getComputedStyle(a,null).whiteSpace;a=!k||k==="pre"}else a=true;a||(d=d.replace(/(<br\s*\/?>)[\r\n]+/g,"$1").replace(/(?:[\r\n]+[ \t]*)+/g, |
|
||||
" "))}d=d}else{d=[];for(a=a.firstChild;a;a=a.nextSibling)H(a,d);d=d.join("")}d=d.replace(/(?:\r\n?|\n)$/,"");m={f:d,e:c,b:p};U(m);if(p=m.a){c=m.b;if("XMP"===c.tagName){d=document.createElement("PRE");for(a=0;a<c.attributes.length;++a){k=c.attributes[a];if(k.specified)if(k.name.toLowerCase()==="class")d.className=k.value;else d.setAttribute(k.name,k.value)}d.innerHTML=p;c.parentNode.replaceChild(d,c)}else c.innerHTML=p}}}}if(q<o.length)setTimeout(f,250);else b&&b()}for(var i=[document.getElementsByTagName("pre"), |
|
||||
document.getElementsByTagName("code"),document.getElementsByTagName("xmp")],o=[],l=0;l<i.length;++l)for(var n=0,r=i[l].length;n<r;++n)o.push(i[l][n]);i=null;var j=Date;j.now||(j={now:function(){return(new Date).getTime()}});var q=0,m;f()};window.PR={combinePrefixPatterns:O,createSimpleLexer:B,registerLangHandler:u,sourceDecorator:x,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:C,PR_DECLARATION:"dec",PR_KEYWORD:R,PR_LITERAL:J,PR_NOCODE:V,PR_PLAIN:z,PR_PUNCTUATION:E,PR_SOURCE:P,PR_STRING:A, |
|
||||
PR_TAG:"tag",PR_TYPE:S}})() |
|
@ -1,63 +0,0 @@ |
|||||
<html> |
|
||||
|
|
||||
<head> |
|
||||
<title>Timeline sourcecode documentation</title> |
|
||||
<link rel='stylesheet' href='default.css' type='text/css'> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>Timeline sourcecode documentation</h1> |
|
||||
<p> |
|
||||
The timeline is written in pure Javascript. There is a GWT wrapper written |
|
||||
that enables you to use the Timeline from within GWT (Google Web Toolkit). |
|
||||
This page explains how the sourcecode is built up. |
|
||||
For detailed information about all functions, one can use the |
|
||||
<a href="jsdoc">JsDoc</a> reference pages. |
|
||||
</p> |
|
||||
|
|
||||
<h2>Timeline Javascript</h2> |
|
||||
<p> |
|
||||
The sourcecode of the Timeline is in one javascript file, <code>timeline.js</code>. |
|
||||
|
|
||||
The file contains a class <code>Timeline</code>, which is defined in the |
|
||||
namespace <code>links</code>. |
|
||||
|
|
||||
All important local variables and constants are defined in the constructor. |
|
||||
The constructor requires a parameter with teh container element inside which |
|
||||
Timeline will be created. |
|
||||
</p> |
|
||||
|
|
||||
<p> |
|
||||
The constructor calls the function <code>create()</code>. This function creates |
|
||||
a frame element. Inside the frame, a canvas is created. The html elements for |
|
||||
the axis and the events are added to the canvas. |
|
||||
</p> |
|
||||
|
|
||||
<p> |
|
||||
After the Timeline is constructed, it can be filled and drawn via the function |
|
||||
<code>draw(data, options)</code>. The parameter <code>data</code> is a DataTable which |
|
||||
contains the events. <code>options</code> is an optional name-value map containing |
|
||||
settings for the timeline such as startDate, endDate, widht, height, layout. |
|
||||
|
|
||||
The function <code>draw()</code> loads the data, draws the axis, and draws the |
|
||||
events. |
|
||||
</p> |
|
||||
|
|
||||
<p> |
|
||||
The Timeline can be moved by dragging it. When moving the Timeline, the canvas |
|
||||
is moved inside the frame. To prevent the user from seeing an undrawn area |
|
||||
when moving, the actual with of the canvas is three times the width of the |
|
||||
screen, and only the middle part is visible. |
|
||||
After the mouse button is up again, the the whole timeline is redrawn again. |
|
||||
|
|
||||
When zooming, the timeline is redrawn after each zoom action. This is needed |
|
||||
because the axis changes and possibly the scale too. |
|
||||
</p> |
|
||||
|
|
||||
<p> |
|
||||
Todo... |
|
||||
</p> |
|
||||
|
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
Before Width: 642 | Height: 314 | Size: 23 KiB |
Before Width: 120 | Height: 60 | Size: 6.5 KiB |
@ -1,51 +0,0 @@ |
|||||
<?php |
|
||||
|
|
||||
// in the reply we must fill in the request id that came with the request
|
|
||||
$reqId = getReqId(); |
|
||||
|
|
||||
echo "
|
|
||||
google.visualization.Query.setResponse({ |
|
||||
version:'0.6', |
|
||||
reqId:'$reqId', |
|
||||
status:'ok', |
|
||||
table:{ |
|
||||
cols:[{id:'start', |
|
||||
label:'', |
|
||||
type:'datetime'}, |
|
||||
{id:'end', |
|
||||
label:'', |
|
||||
type:'datetime'}, |
|
||||
{id:'content', |
|
||||
label:'', |
|
||||
type:'string'} |
|
||||
], |
|
||||
rows:[{c:[{v:new Date(2010, 7, 19)}, {v:null}, {v:'Conversation'}]}, |
|
||||
{c:[{v:new Date(2010, 7, 20)}, {v:null}, {v:'Official start'}]}, |
|
||||
{c:[{v:new Date(2010, 7, 23)}, {v:null}, {v:'Memo'}]}, |
|
||||
{c:[{v:new Date(2010, 8, 2, 12, 0, 0)}, {v:null}, {v:'Report'}]}, |
|
||||
{c:[{v:new Date(2010, 8, 6)}, {v:new Date(2010, 8, 12)}, {v:'Bla bla'}]} |
|
||||
] |
|
||||
} |
|
||||
}); |
|
||||
";
|
|
||||
|
|
||||
|
|
||||
|
|
||||
/** |
|
||||
* Retrieve the request id from the get/post data |
|
||||
* @return {number} $reqId The request id, or 0 if not found |
|
||||
*/ |
|
||||
function getReqId() { |
|
||||
$reqId = 0; |
|
||||
|
|
||||
foreach ($_REQUEST as $req) { |
|
||||
if (substr($req, 0,6) == "reqId:") { |
|
||||
$reqId = substr($req, 6); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
return $reqId; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
?>
|
|
@ -1,87 +0,0 @@ |
|||||
html, body { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
padding: 0; |
|
||||
margin: 0; |
|
||||
} |
|
||||
|
|
||||
body, td, th { |
|
||||
font-family: arial, sans-serif; |
|
||||
font-size: 11pt; |
|
||||
color: #4D4D4D; |
|
||||
line-height: 1.7em; |
|
||||
} |
|
||||
|
|
||||
#container { |
|
||||
margin: 0 auto; |
|
||||
padding-bottom: 50px; |
|
||||
width: 900px; |
|
||||
} |
|
||||
|
|
||||
h1 { |
|
||||
font-size: 180%; |
|
||||
font-weight: bold; |
|
||||
padding: 0; |
|
||||
margin: 1em 0 1em 0; |
|
||||
} |
|
||||
|
|
||||
h2 { |
|
||||
padding-top: 20px; |
|
||||
padding-bottom: 10px; |
|
||||
border-bottom: 1px solid #a0c0f0; |
|
||||
color: #2B7CE9; |
|
||||
} |
|
||||
|
|
||||
h3 { |
|
||||
font-size: 140%; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
a { |
|
||||
color: #2B7CE9; |
|
||||
text-decoration: none; |
|
||||
} |
|
||||
a:visited { |
|
||||
color: #2E60A4; |
|
||||
} |
|
||||
a:hover { |
|
||||
color: red; |
|
||||
text-decoration: underline; |
|
||||
} |
|
||||
|
|
||||
hr { |
|
||||
border: none 0; |
|
||||
border-top: 1px solid #abc; |
|
||||
height: 1px; |
|
||||
} |
|
||||
|
|
||||
pre { |
|
||||
display: block; |
|
||||
font-size: 10pt; |
|
||||
line-height: 1.5em; |
|
||||
font-family: monospace; |
|
||||
} |
|
||||
|
|
||||
pre, code { |
|
||||
background-color: #f5f5f5; |
|
||||
} |
|
||||
|
|
||||
table |
|
||||
{ |
|
||||
border-collapse: collapse; |
|
||||
} |
|
||||
|
|
||||
th { |
|
||||
font-weight: bold; |
|
||||
border: 1px solid lightgray; |
|
||||
background-color: #E5E5E5; |
|
||||
text-align: left; |
|
||||
vertical-align: top; |
|
||||
padding: 5px; |
|
||||
} |
|
||||
|
|
||||
td { |
|
||||
border: 1px solid lightgray; |
|
||||
padding: 5px; |
|
||||
vertical-align: top; |
|
||||
} |
|
@ -1,71 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2010,7,23), , 'Conversation<br>' + |
|
||||
'<img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,23,23,0,0), , 'Mail from boss<br>' + |
|
||||
'<img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,24,16,0,0), , 'Report'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A'], |
|
||||
[new Date(2010,7,28), , 'Memo<br>' + |
|
||||
'<img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,7,29), , 'Phone call<br>' + |
|
||||
'<img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,31), new Date(2010,8,3), 'Traject B'], |
|
||||
[new Date(2010,8,4,12,0,0), , 'Report<br>' + |
|
||||
'<img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
"width": "100%", |
|
||||
"height": "300px", |
|
||||
"style": "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,205 +0,0 @@ |
|||||
<!DOCTYPE HTML> |
|
||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style> |
|
||||
body { |
|
||||
font-family: verdana, sans, arial; |
|
||||
font-size: 10pt; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
function getSelectedRow() { |
|
||||
var row = undefined; |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
return row; |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2011,1,23), , '<div>Conversation</div><img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011,1,23,23,0,0), , '<div>Mail from boss</div><img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011,1,24,16,0,0), , 'Report'], |
|
||||
[new Date(2011,1,26), new Date(2011,2,2), 'Traject A'], |
|
||||
[new Date(2011,1,27), , '<div>Memo</div><img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2011,1,29), , '<div>Phone call</div><img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011,1,28), new Date(2011,2,3), 'Traject B'], |
|
||||
[new Date(2011,2,4,12,0,0), , '<div>Report</div><img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "300px", |
|
||||
//height: "auto", |
|
||||
editable: true, // enable dragging and editing items |
|
||||
//axisOnTop: true, |
|
||||
style: "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Add event listeners |
|
||||
google.visualization.events.addListener(timeline, 'select', onselect); |
|
||||
google.visualization.events.addListener(timeline, 'change', onchange); |
|
||||
google.visualization.events.addListener(timeline, 'add', onadd); |
|
||||
google.visualization.events.addListener(timeline, 'edit', onedit); |
|
||||
google.visualization.events.addListener(timeline, 'delete', ondelete); |
|
||||
google.visualization.events.addListener(timeline, 'rangechange', onrangechange); |
|
||||
google.visualization.events.addListener(timeline, 'rangechanged', onrangechanged); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
onrangechange(); |
|
||||
} |
|
||||
|
|
||||
// Make a callback function for the select item |
|
||||
var onselect = function (event) { |
|
||||
var row = getSelectedRow(); |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
document.getElementById("info").innerHTML += "item " + row + " selected<br>"; |
|
||||
// Note: you can retrieve the contents of the selected row with |
|
||||
// data.getValue(row, 2); |
|
||||
} |
|
||||
else { |
|
||||
document.getElementById("info").innerHTML += "no item selected<br>"; |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// callback function for the change item |
|
||||
var onchange = function () { |
|
||||
var row = getSelectedRow(); |
|
||||
document.getElementById("info").innerHTML += "item " + row + " changed<br>"; |
|
||||
}; |
|
||||
|
|
||||
// callback function for the delete item |
|
||||
var ondelete = function () { |
|
||||
var row = getSelectedRow(); |
|
||||
document.getElementById("info").innerHTML += "item " + row + " deleted<br>"; |
|
||||
}; |
|
||||
|
|
||||
// callback function for the edit item |
|
||||
var onedit = function () { |
|
||||
var row = getSelectedRow(); |
|
||||
document.getElementById("info").innerHTML += "item " + row + " edit<br>"; |
|
||||
var content = data.getValue(row, 2); |
|
||||
var newContent = prompt("Enter content", content); |
|
||||
if (newContent != undefined) { |
|
||||
data.setValue(row, 2, newContent); |
|
||||
} |
|
||||
timeline.redraw(); |
|
||||
}; |
|
||||
|
|
||||
// callback function for the add item |
|
||||
var onadd = function () { |
|
||||
var row = getSelectedRow(); |
|
||||
document.getElementById("info").innerHTML += "item " + row + " created<br>"; |
|
||||
var content = data.getValue(row, 2); |
|
||||
var newContent = prompt("Enter content", content); |
|
||||
if (newContent != undefined) { |
|
||||
data.setValue(row, 2, newContent); |
|
||||
timeline.redraw(); |
|
||||
} |
|
||||
else { |
|
||||
// cancel adding the item |
|
||||
timeline.cancelAdd(); |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
function onrangechange() { |
|
||||
// adjust the values of startDate and endDate |
|
||||
var range = timeline.getVisibleChartRange(); |
|
||||
document.getElementById('startDate').value = dateFormat(range.start); |
|
||||
document.getElementById('endDate').value = dateFormat(range.end); |
|
||||
} |
|
||||
|
|
||||
function onrangechanged() { |
|
||||
document.getElementById("info").innerHTML += "range changed<br>"; |
|
||||
} |
|
||||
|
|
||||
// adjust start and end time. |
|
||||
function setTime() { |
|
||||
if (!timeline) return; |
|
||||
|
|
||||
var newStartDate = new Date(document.getElementById('startDate').value); |
|
||||
var newEndDate = new Date(document.getElementById('endDate').value); |
|
||||
timeline.setVisibleChartRange(newStartDate, newEndDate); |
|
||||
} |
|
||||
|
|
||||
// set the visible range to the current time |
|
||||
function setCurrentTime() { |
|
||||
if (!timeline) return; |
|
||||
|
|
||||
timeline.setVisibleChartRangeNow(); |
|
||||
onrangechange(); |
|
||||
} |
|
||||
|
|
||||
// Format given date as "yyyy-mm-dd hh:ii:ss" |
|
||||
// @param datetime A Date object. |
|
||||
function dateFormat(date) { |
|
||||
var datetime = date.getFullYear() + "-" + |
|
||||
((date.getMonth() < 9) ? "0" : "") + (date.getMonth() + 1) + "-" + |
|
||||
((date.getDate() < 10) ? "0" : "") + date.getDate() + " " + |
|
||||
((date.getHours() < 10) ? "0" : "") + date.getHours() + ":" + |
|
||||
((date.getMinutes() < 10) ? "0" : "") + date.getMinutes() + ":" + |
|
||||
((date.getSeconds() < 10) ? "0" : "") + date.getSeconds(); |
|
||||
return datetime; |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p>This page demonstrates the timeline visualization.</p> |
|
||||
<ul> |
|
||||
<li>Click and drag on the time axis to move the timeline, scroll to zoom the timeline</li> |
|
||||
<li>Click and drag an item to change its date, double-click to change its text</li> |
|
||||
<li>Click or drag on an empty spot in the timeline to create a new item</li> |
|
||||
</ul> |
|
||||
<p> |
|
||||
Starttime: <input type="text" id="startDate" value=""> |
|
||||
Endtime: <input type="text" id="endDate" value=""> |
|
||||
<input type="button" id="setRange" value="Set" onclick="setTime();"> |
|
||||
<input type="button" id="setCurrentTime" value="Current time" onclick="setCurrentTime();"> |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
<br> |
|
||||
<div id="info"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,125 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
font: 10pt arial; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var data; |
|
||||
var options; |
|
||||
var timeline; |
|
||||
|
|
||||
function go() { |
|
||||
var eventnum = parseInt(document.getElementById("eventnum").value); |
|
||||
createEvents(eventnum); |
|
||||
} |
|
||||
|
|
||||
function createEvents(eventnum) { |
|
||||
// clear the table |
|
||||
data.removeRows(0, data.getNumberOfRows()); |
|
||||
|
|
||||
// insert new events |
|
||||
var startDate = new Date(2010, 7, 1); |
|
||||
var date = new Date(startDate); |
|
||||
for (var i = 0; i < eventnum; i++) { |
|
||||
data.addRow([new Date(date), null, "event" + i]); |
|
||||
date.setDate(date.getDate() + 1); |
|
||||
} |
|
||||
var endDate = new Date(date); |
|
||||
|
|
||||
timeline.setVisibleChartRange(startDate, endDate); |
|
||||
|
|
||||
// load the new data in the timeline |
|
||||
timeline.redraw(); |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
// specify options |
|
||||
options = { |
|
||||
'width': '100%', |
|
||||
'height': '300px', |
|
||||
'editable': true, // make the events dragable |
|
||||
'style': 'box', |
|
||||
'intervalMax': 1000 * 60 * 60 * 24 * 90, |
|
||||
'start': new Date(2010, 7, 1), |
|
||||
'end': new Date(2010, 10, 1) |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Make a callback function for the select event |
|
||||
var onselect = function () { |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
document.getElementById("info").innerHTML += "event " + row + " selected<br>"; |
|
||||
|
|
||||
// Note: you can retrieve the contents of the selected row with |
|
||||
// data.getValue(row, 2); |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// callback function for the change event |
|
||||
var onchange = function () { |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
document.getElementById("info").innerHTML += "event " + row + " changed<br>"; |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// Add event listeners |
|
||||
google.visualization.events.addListener(timeline, 'select', onselect); |
|
||||
google.visualization.events.addListener(timeline, 'change', onchange); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
// load initial data |
|
||||
go(); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p> |
|
||||
You can test the performance of the timeline visualization here. |
|
||||
Note that stacking events is relatively heavy. |
|
||||
</p> |
|
||||
|
|
||||
<form onsubmit='go(); return false;'> |
|
||||
number of events: <input type="input" id="eventnum" value="50" size="5"> |
|
||||
<input type="submit" value="Go"> |
|
||||
</form> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
<br> |
|
||||
|
|
||||
<div id="info"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,80 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
var data; |
|
||||
var options; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(1939,8,1), , 'German Invasion of Poland'], |
|
||||
[new Date(1940,4,10), , 'Battle of France and the Low Countries'], |
|
||||
[new Date(1940,7,13), , 'Battle of Britain - RAF vs. Luftwaffe'], |
|
||||
[new Date(1941,1,14), , 'German Afrika Korps arrives in North Africa'], |
|
||||
[new Date(1941,5,22), , 'Third Reich Invades the USSR'], |
|
||||
[new Date(1941,11,7), , 'Japanese Attack Pearl Harbor'], |
|
||||
[new Date(1942,5,4), , 'Battle of Midway in the Pacific'], |
|
||||
[new Date(1942,10,8), , 'Americans open Second Front in North Africa'], |
|
||||
[new Date(1942,10,19), , 'Battle of Stalingrad in Russia'], |
|
||||
[new Date(1943,6,5), , 'Battle of Kursk - Last German Offensive on Eastern Front'], |
|
||||
[new Date(1943,6,10), , 'Anglo-American Landings in Sicily'], |
|
||||
[new Date(1944,2,8), , 'Japanese Attack British India'], |
|
||||
[new Date(1944,5,6), , 'D-Day - Allied Invasion of Normandy'], |
|
||||
[new Date(1944,5,22), , 'Destruction of Army Group Center in Byelorussia'], |
|
||||
[new Date(1944,7,1), , 'The Warsaw Uprising in Occupied Poland'], |
|
||||
[new Date(1944,9,20), , 'American Liberation of the Philippines'], |
|
||||
[new Date(1944,11,16), , 'Battle of the Bulge in the Ardennes'], |
|
||||
[new Date(1944,1,19), , 'American Landings on Iwo Jima'], |
|
||||
[new Date(1945,3,1), , 'US Invasion of Okinawa'], |
|
||||
[new Date(1945,3,16), ,'Battle of Berlin - End of the Third Reich'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
options = { |
|
||||
'width': '100%', |
|
||||
'height': 'auto', |
|
||||
'start': new Date(1942, 6, 1), |
|
||||
'end': new Date(1946, 6, 1), |
|
||||
'editable': false, |
|
||||
'animate': false, |
|
||||
'style': 'dot' |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>World War II timeline</h1> |
|
||||
<p>Source: <a href="http://www.onwar.com/chrono/index.htm" target="_blank">http://www.onwar.com/chrono/index.htm</a></p> |
|
||||
<div id="mytimeline" style="background-color: #FAFAFA;"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,174 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 11pt arial;} |
|
||||
input {font: 11pt arial;} |
|
||||
|
|
||||
div.myParagraph { |
|
||||
width: 200px; |
|
||||
white-space: normal; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
// Called when the timelineualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
function addRow(startDate, endDate, content, backgroundColor, borderColor) |
|
||||
{ |
|
||||
// we make our own customized layout for the events |
|
||||
|
|
||||
if (backgroundColor == undefined) |
|
||||
backgroundColor = "yellow"; |
|
||||
if (borderColor == undefined) |
|
||||
borderColor = "gold"; |
|
||||
|
|
||||
var fill = endDate ? "pink" : "yellow"; |
|
||||
var div = '<div style="background-color:' + backgroundColor + |
|
||||
'; border:1px solid ' + borderColor + ';padding:5px;">' + |
|
||||
content + '</div>'; |
|
||||
|
|
||||
data.addRows([ |
|
||||
[startDate, endDate, div] |
|
||||
]); |
|
||||
} |
|
||||
|
|
||||
data.addRows([ |
|
||||
[ |
|
||||
new Date(2010, 7, 19), |
|
||||
null, |
|
||||
'Some html<br>containing an image<br>' + |
|
||||
'<img src="img/notes-edit-icon.png">' |
|
||||
], |
|
||||
[ |
|
||||
new Date(2010, 7, 23), |
|
||||
null, |
|
||||
'<h3>Lorem ipsum</h3>' + |
|
||||
'<div class="myParagraph">' + |
|
||||
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget sem arcu. Pellentesque habitant morbi tristique senectus et netus et.' + |
|
||||
'</div>' |
|
||||
], |
|
||||
[ |
|
||||
new Date(2010, 7, 22), |
|
||||
new Date(2010, 7, 30), |
|
||||
'This text contains some <span style="font-weight: bold;">bold</span> text,<br>' + |
|
||||
'some <span style="font-style: italic;">italic</span> text,<br>' + |
|
||||
'and some <span style="color: red;">red</span> text.' |
|
||||
], |
|
||||
[ |
|
||||
new Date(2010, 7, 29), |
|
||||
null, |
|
||||
'<div style="text-align:left;">There are a few limitations<br>' + |
|
||||
'<ul>' + |
|
||||
'<li>A box can have either non-wrapped text and a<br>flexible width, or a fixed width and wrapping text.</li>' + |
|
||||
'<li>A range cannot automatically wrap text</li>' + |
|
||||
'<li>The css styles <i>min-width</i> and <i>max-width</i><br>are not working well together with the timeline.</li>' + |
|
||||
'</ul></div>' |
|
||||
] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "75%", |
|
||||
height: "auto", |
|
||||
start: new Date(2010, 7, 17), |
|
||||
end: new Date(2010, 8, 2), |
|
||||
style: "box" // optional. choose "dot" (default), "box", or "none" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our table object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Attach event listeners |
|
||||
google.visualization.events.addListener(timeline, 'select', onselect); |
|
||||
google.visualization.events.addListener(timeline, 'rangechange', onrangechange); |
|
||||
|
|
||||
// Draw our table with the data we created locally. |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
// Set the scale by hand. Autoscaling will be disabled. |
|
||||
// Note: you can achieve the same by specifying scale and step in the |
|
||||
// options for the timeline. |
|
||||
timeline.setScale(links.Timeline.StepDate.SCALE.DAY, 1); |
|
||||
} |
|
||||
|
|
||||
// adjust start and end time. |
|
||||
function setTime() { |
|
||||
if (!timeline) return; |
|
||||
|
|
||||
var newStartDate = new Date(document.getElementById('startDate').value); |
|
||||
var newEndDate = new Date(document.getElementById('endDate').value); |
|
||||
timeline.setVisibleChartRange(newStartDate, newEndDate); |
|
||||
timeline.redraw(); |
|
||||
} |
|
||||
|
|
||||
function onrangechange() { |
|
||||
// adjust the values of startDate and endDate |
|
||||
var range = timeline.getVisibleChartRange(); |
|
||||
document.getElementById('startDate').value = dateFormat(range.start); |
|
||||
document.getElementById('endDate').value = dateFormat(range.end); |
|
||||
} |
|
||||
|
|
||||
function onselect() { |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
alert("event " + row + " selected"); |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// Format given date as "yyyy-mm-dd hh:ii:ss" |
|
||||
// @param datetime A Date object. |
|
||||
function dateFormat(date) { |
|
||||
var datetime = date.getFullYear() + "-" + |
|
||||
((date.getMonth() < 9) ? "0" : "") + (date.getMonth() + 1) + "-" + |
|
||||
((date.getDate() < 10) ? "0" : "") + date.getDate() + " " + |
|
||||
((date.getHours() < 10) ? "0" : "") + date.getHours() + ":" + |
|
||||
((date.getMinutes() < 10) ? "0" : "") + date.getMinutes() + ":" + |
|
||||
((date.getSeconds() < 10) ? "0" : "") + date.getSeconds(); |
|
||||
return datetime; |
|
||||
} |
|
||||
|
|
||||
</script> |
|
||||
</head> |
|
||||
<body onresize="if (timeline) {timeline.redraw();}"> |
|
||||
<p>This page demonstrates the timeline visualization.</p> |
|
||||
<p>Click and drag to move the timeline, scroll to zoom the timeline.</p> |
|
||||
<p> |
|
||||
Starttime: <input type="text" id="startDate" value="2010-08-16"> |
|
||||
Endtime: <input type="text" id="endDate" value="2010-09-07"> |
|
||||
<input type="button" id="setStartDate" value="set" onclick="setTime();"> |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
<div id="info"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,138 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
|
|
||||
div.timeline-frame { |
|
||||
border-color: purple; |
|
||||
border-width: 2px; |
|
||||
} |
|
||||
|
|
||||
div.timeline-canvas { |
|
||||
background-color: #FFF4F7; |
|
||||
} |
|
||||
|
|
||||
div.timeline-event { |
|
||||
border-color: #F991A3; |
|
||||
background-color: pink; |
|
||||
} |
|
||||
div.timeline-event-selected { |
|
||||
border-color: orange; |
|
||||
background-color: yellow; |
|
||||
} |
|
||||
div.timeline-event-box { |
|
||||
font-size: 12pt; |
|
||||
font-family: purisa, cursive; |
|
||||
color: purple; |
|
||||
border-width: 3px; |
|
||||
} |
|
||||
div.timeline-event-line { |
|
||||
border-width: 3px; |
|
||||
} |
|
||||
div.timeline-event-dot { |
|
||||
border-width: 8px; |
|
||||
border-radius: 8px; |
|
||||
-moz-border-radius: 8px; |
|
||||
} |
|
||||
div.timeline-event-range { |
|
||||
font-size: 12pt; |
|
||||
font-family: purisa, cursive; |
|
||||
color: purple; |
|
||||
border-width: 3px; |
|
||||
} |
|
||||
|
|
||||
div.timeline-axis { |
|
||||
border-color: purple; |
|
||||
border-width: 2px; |
|
||||
} |
|
||||
div.timeline-axis-grid { |
|
||||
border-width: 2px; |
|
||||
} |
|
||||
div.timeline-axis-grid-minor { |
|
||||
border-color: #FFD7DD; |
|
||||
} |
|
||||
div.timeline-axis-grid-major { |
|
||||
border-color: pink; |
|
||||
} |
|
||||
|
|
||||
div.timeline-axis-text { |
|
||||
font-family: purisa, cursive; |
|
||||
font-size: 15px; |
|
||||
color: purple; |
|
||||
} |
|
||||
div.timeline-axis-text-minor { |
|
||||
padding-top: 15px; |
|
||||
} |
|
||||
div.timeline-axis-text-major { |
|
||||
font-weight: bold; |
|
||||
padding-top: 5px; |
|
||||
padding-bottom: 10px; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var timeline; |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2010,7,23), , '<div>Conversation</div><img src="img/community-users-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,23,23,0,0), , '<div>Mail from boss</div><img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,24,16,0,0), , 'Report'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A'], |
|
||||
[new Date(2010,7,28), , '<div>Memo</div><img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,7,29), , '<div>Phone call</div><img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,31), new Date(2010,8,3), 'Traject B'], |
|
||||
[new Date(2010,8,4,12,00,00), , '<div>Report</div><img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "400px", |
|
||||
editable: true, // make the events draggable |
|
||||
eventMargin: 15, |
|
||||
showButtonNew: false, |
|
||||
style: "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
|
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p>This page demonstrates the timeline visualization with custom css.</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,166 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline = undefined; |
|
||||
var data = undefined; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
function getSelectedRow() { |
|
||||
var row = undefined; |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
return row; |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2010,07,23), , '<div>Conversation</div><img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,07,23,23,00,00), , '<div>Mail from boss</div><img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,07,24,16,00,00), , 'Report'], |
|
||||
[new Date(2010,07,26), new Date(2010,08,02), 'Traject A'], |
|
||||
[new Date(2010,07,28), , '<div>Memo</div><img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,07,29), , '<div>Phone call</div><img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,07,31), new Date(2010,08,03), 'Traject B'], |
|
||||
[new Date(2010,08,04,12,00,00), , '<div>Report</div><img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "300px", |
|
||||
editable: true // make the events dragable |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Make a callback function for the select event |
|
||||
var onselect = function (event) { |
|
||||
var row = getSelectedRow(); |
|
||||
document.getElementById("info").innerHTML += "event " + row + " selected<br>"; |
|
||||
// Note: you can retrieve the contents of the selected row with |
|
||||
// data.getValue(row, 2); |
|
||||
} |
|
||||
|
|
||||
// callback function for the change event |
|
||||
var onchanged = function (event) { |
|
||||
// retrieve the changed row |
|
||||
var row = getSelectedRow(); |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
// request approval from the user. |
|
||||
// You can choose your own approval mechanism here, for example |
|
||||
// send data to a server which responds with approved/denied |
|
||||
var approve = confirm("Are you sure you want to move the event?"); |
|
||||
|
|
||||
if (approve) { |
|
||||
document.getElementById("info").innerHTML += "event " + row + " changed<br>"; |
|
||||
} else { |
|
||||
// new date NOT approved. cancel the change |
|
||||
timeline.cancelChange(); |
|
||||
|
|
||||
document.getElementById("info").innerHTML += "change of event " + row + " cancelled<br>"; |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// callback function for the delete event |
|
||||
var ondelete = function (event) { |
|
||||
// retrieve the row to be deleted |
|
||||
var row = getSelectedRow(); |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
// request approval from the user. |
|
||||
// You can choose your own approval mechanism here, for example |
|
||||
// send data to a server which responds with approved/denied |
|
||||
var approve = confirm("Are you sure you want to delete the event?"); |
|
||||
|
|
||||
if (approve) { |
|
||||
document.getElementById("info").innerHTML += "event " + row + " deleted<br>"; |
|
||||
} else { |
|
||||
// new date NOT approved. cancel the change |
|
||||
timeline.cancelDelete(); |
|
||||
|
|
||||
document.getElementById("info").innerHTML += "deleting event " + row + " cancelled<br>"; |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
|
|
||||
// callback function for adding an event |
|
||||
var onadd = function (event) { |
|
||||
// retrieve the row to be deleted |
|
||||
var row = getSelectedRow(); |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
// request approval from the user. |
|
||||
// You can choose your own approval mechanism here, for example |
|
||||
// send data to a server which responds with approved/denied |
|
||||
var title = prompt("Enter a title for the new event", "New event"); |
|
||||
|
|
||||
if (title != undefined) { |
|
||||
data.setValue(row, 2, title); |
|
||||
document.getElementById("info").innerHTML += "event " + row + " created<br>"; |
|
||||
timeline.redraw(); |
|
||||
} else { |
|
||||
// cancel adding a new event |
|
||||
timeline.cancelAdd(); |
|
||||
|
|
||||
document.getElementById("info").innerHTML += "creating event " + row + " cancelled<br>"; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// Add event listeners |
|
||||
google.visualization.events.addListener(timeline, 'select', onselect); |
|
||||
google.visualization.events.addListener(timeline, 'changed', onchanged); |
|
||||
google.visualization.events.addListener(timeline, 'delete', ondelete); |
|
||||
google.visualization.events.addListener(timeline, 'add', onadd); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p>This page demonstrates the timeline visualization.</p> |
|
||||
<p>Click and drag to move the timeline, scroll to zoom the timeline. |
|
||||
Click and drag events to change there date. |
|
||||
You will be asked for confirmation before changes are actually applied.</p> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
<div id="info"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,99 +0,0 @@ |
|||||
<!-- |
|
||||
http://code.google.com/apis/gdata/samples/cal_sample.html |
|
||||
--> |
|
||||
|
|
||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var cal; |
|
||||
|
|
||||
// load the google calendar feed |
|
||||
function insertAgenda(calendar) { |
|
||||
cal = calendar; |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/calendar/feeds/developer-calendar@google.com/public/full?alt=json-in-script&callback=insertAgenda&orderby=starttime&max-results=20&singleevents=true&sortorder=ascending&futureevents=true"></script> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
/** |
|
||||
* Parse a date like "2010-10-07T17:00:00.000-07:00" or "2010-10-07" |
|
||||
* @param {string} googledate |
|
||||
* @return {Date} |
|
||||
*/ |
|
||||
function parseGoogleDate(googledate) { |
|
||||
var year = parseInt(googledate.substr(0,4), 10); |
|
||||
var month = parseInt(googledate.substr(5,2), 10) - 1; |
|
||||
var date = parseInt(googledate.substr(8,2), 10); |
|
||||
var dateObj; |
|
||||
|
|
||||
if (googledate.length <= 10) { |
|
||||
dateObj = new Date(year, month, date); |
|
||||
} else { |
|
||||
var hour = parseInt(googledate.substr(11,2), 10) - parseInt(googledate.substr(25,2), 10); |
|
||||
var minute = parseInt(googledate.substr(14,2), 10) - parseInt(googledate.substr(28,2), 10); |
|
||||
var second = parseInt(googledate.substr(17,2), 10); |
|
||||
|
|
||||
dateObj = new Date(year, month, date, hour, minute, second); |
|
||||
dateObj.setMinutes(dateObj.getMinutes() - dateObj.getTimezoneOffset()); |
|
||||
} |
|
||||
return dateObj; |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
for (i = 0; i < cal.feed.entry.length; i++) { |
|
||||
var start = parseGoogleDate(cal.feed.entry[i].gd$when[0].startTime); |
|
||||
var end = parseGoogleDate(cal.feed.entry[i].gd$when[0].endTime); |
|
||||
var title = cal.feed.entry[i].title.$t; |
|
||||
var content = cal.feed.entry[i].content.$t; |
|
||||
var href = cal.feed.entry[i].link[0].href; |
|
||||
|
|
||||
var eventcontent = "<a href='" + href + "'>" + title + "</a>"; |
|
||||
data.addRow([start, undefined, eventcontent]); |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'width': "100%", |
|
||||
'height': "auto", |
|
||||
'style': "dot" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>Google upcoming events</h1> |
|
||||
<div id="mytimeline"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,196 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
#mytimeline { |
|
||||
width: 100%; |
|
||||
height: 300px; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2010,7,23), , '<div>Conversation</div><img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,23,23,0,0), , '<div>Mail from boss</div><img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,24,16,0,0), , 'Report'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A'], |
|
||||
[new Date(2010,7,28), , '<div>Memo</div><img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,7,29), , '<div>Phone call</div><img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,31), new Date(2010,8,3), 'Traject B'], |
|
||||
[new Date(2010,8,4,12,0,0), , '<div>Report</div><img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'width': "100%", |
|
||||
'height': "300px", |
|
||||
'editable': true, // make the events dragable |
|
||||
'layout': "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Make a callback function for the select event |
|
||||
var onselect = function (event) { |
|
||||
var row = undefined; |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
var content = data.getValue(row, 2); |
|
||||
document.getElementById("txtContent").value = content; |
|
||||
document.getElementById("info").innerHTML += "event " + row + " selected<br>"; |
|
||||
|
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// callback function for the change event |
|
||||
var onchange = function () { |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
document.getElementById("info").innerHTML += "event " + row + " changed<br>"; |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// callback function for the delete event |
|
||||
var ondelete = function () { |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
document.getElementById("info").innerHTML += "event " + row + " deleted<br>"; |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
// callback function for the add event |
|
||||
var onadd = function () { |
|
||||
var count = data.getNumberOfRows(); |
|
||||
document.getElementById("info").innerHTML += "event " + (count-1) + " added<br>"; |
|
||||
}; |
|
||||
|
|
||||
// Add event listeners |
|
||||
google.visualization.events.addListener(timeline, 'select', onselect); |
|
||||
google.visualization.events.addListener(timeline, 'change', onchange); |
|
||||
google.visualization.events.addListener(timeline, 'delete', ondelete); |
|
||||
google.visualization.events.addListener(timeline, 'add', onadd); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Add a new event |
|
||||
*/ |
|
||||
function add() { |
|
||||
var range = timeline.getVisibleChartRange(); |
|
||||
var start = new Date((range.start.valueOf() + range.end.valueOf()) / 2); |
|
||||
var content = document.getElementById("txtContent").value; |
|
||||
|
|
||||
timeline.addItem({ |
|
||||
'start': start, |
|
||||
'content': content |
|
||||
}); |
|
||||
|
|
||||
var count = data.getNumberOfRows(); |
|
||||
timeline.setSelection([{ |
|
||||
'row': count-1 |
|
||||
}]); |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Change the content of the currently selected event |
|
||||
*/ |
|
||||
function change() { |
|
||||
// retrieve the selected row |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
var content = document.getElementById("txtContent").value; |
|
||||
timeline.changeItem(row, { |
|
||||
'content': content |
|
||||
// Note: start, end, and group can be added here too. |
|
||||
}); |
|
||||
} else { |
|
||||
alert("First select an event, then press remove again"); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Delete the currently selected event |
|
||||
*/ |
|
||||
function doDelete() { |
|
||||
// retrieve the selected row |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
if (row != undefined) { |
|
||||
timeline.deleteItem(row); |
|
||||
} else { |
|
||||
alert("First select an event, then press remove again"); |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p>This page demonstrates the timeline visualization.</p> |
|
||||
<p>Click and drag to move the timeline, scroll to zoom the timeline. Click and drag events to change there date.</p> |
|
||||
|
|
||||
<p> |
|
||||
<input type="text" value="New text" id="txtContent"> |
|
||||
<input type="button" value="Add" title="Add new event" onclick="add();"> |
|
||||
<input type="button" value="Change" title="Change content of selected event" onclick="change();"> |
|
||||
<input type="button" value="Delete" title="Delete selected event" onclick="doDelete();"> |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
<div id="info"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,120 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var vis1; |
|
||||
var vis2; |
|
||||
|
|
||||
function createTimeline1() { |
|
||||
// Create and populate a data table. |
|
||||
var data1 = new google.visualization.DataTable(); |
|
||||
data1.addColumn('datetime', 'start'); |
|
||||
data1.addColumn('datetime', 'end'); |
|
||||
data1.addColumn('string', 'content'); |
|
||||
|
|
||||
data1.addRows([ |
|
||||
[new Date(2010,7,23), , 'Conversation<br>' + |
|
||||
'<img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,23,23,0,0), , 'Mail from boss<br>' + |
|
||||
'<img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,24,16,0,0), , 'Report'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A'], |
|
||||
[new Date(2010,7,28), , 'Memo<br>' + |
|
||||
'<img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,7,29), , 'Phone call<br>' + |
|
||||
'<img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,31), new Date(2010,8,3), 'Traject B'], |
|
||||
[new Date(2010,8,1,12,0,0), , 'Report<br>' + |
|
||||
'<img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
options1 = {width: "100%", |
|
||||
height: "300px", |
|
||||
layout: "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
vis1 = new links.Timeline(document.getElementById('timeline1'), options1); |
|
||||
|
|
||||
google.visualization.events.addListener(vis1, 'rangechange', onrangechange1); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
vis1.draw(data1); |
|
||||
} |
|
||||
|
|
||||
function createTimeline2() { |
|
||||
// Create and populate a data table. |
|
||||
var data2 = new google.visualization.DataTable(); |
|
||||
data2.addColumn('datetime', 'start'); |
|
||||
data2.addColumn('datetime', 'end'); |
|
||||
data2.addColumn('string', 'content'); |
|
||||
|
|
||||
data2.addRows([ |
|
||||
[new Date(2010,7,23), new Date(2010,7,30), 'Traject C'], |
|
||||
[new Date(2010,7,27), new Date(2010,7,31), 'Traject D'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options2 = { |
|
||||
width: "100%", |
|
||||
height: "300px" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
vis2 = new links.Timeline(document.getElementById('timeline2'), options2); |
|
||||
|
|
||||
google.visualization.events.addListener(vis2, 'rangechange', onrangechange2); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
vis2.draw(data2); |
|
||||
|
|
||||
onrangechange1(); // to set the range equal initially |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
createTimeline1(); |
|
||||
createTimeline2(); |
|
||||
} |
|
||||
|
|
||||
function onrangechange1() { |
|
||||
var range = vis1.getVisibleChartRange(); |
|
||||
vis2.setVisibleChartRange(range.start, range.end); |
|
||||
} |
|
||||
|
|
||||
function onrangechange2() { |
|
||||
var range = vis2.getVisibleChartRange(); |
|
||||
vis1.setVisibleChartRange(range.start, range.end); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p>When moving one timeline, the other moves along.</p> |
|
||||
<div id="timeline1"></div> |
|
||||
<br> |
|
||||
<div id="timeline2"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,106 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
var urlSpreadsheet = "https://spreadsheets.google.com/a/almende.org/ccc?key=tpN13qnPm37g3qTXT5Hc9sg&hl=en#gid=0"; |
|
||||
var urlData = "data.php"; |
|
||||
|
|
||||
var initialized = false; |
|
||||
var query; |
|
||||
var vis; |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(initialize); |
|
||||
|
|
||||
function initialize() { |
|
||||
initialized = true; |
|
||||
} |
|
||||
|
|
||||
function load(url) { |
|
||||
if (!initialized) { |
|
||||
alert("One moment please... still busy loading Google Visualization API"); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
if (url == undefined) { |
|
||||
dataSourceUrl = document.getElementById("dataSourceUrl").value |
|
||||
} else { |
|
||||
dataSourceUrl = url; |
|
||||
} |
|
||||
|
|
||||
// if the entered url is a google spreadsheet url, replace the part |
|
||||
// "/ccc?" with "/tq?" in order to retrieve a neat data query result |
|
||||
if (dataSourceUrl.indexOf("/ccc?")) { |
|
||||
dataSourceUrl.replace("/ccc?", "/tq?"); |
|
||||
} |
|
||||
|
|
||||
var handleQueryResponse = function(response) { |
|
||||
if (response.isError()) { |
|
||||
alert('Error in query: ' + response.getMessage() + ', ' + response.getDetailedMessage()); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
// retrieve the data from the query response |
|
||||
var data = response.getDataTable(); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "300px", |
|
||||
editable: true, |
|
||||
layout: "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
vis = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
vis.draw(data); |
|
||||
} |
|
||||
|
|
||||
query && query.abort(); |
|
||||
query = new google.visualization.Query(dataSourceUrl); |
|
||||
query.send(handleQueryResponse); |
|
||||
} |
|
||||
|
|
||||
function loadDataHtml() { |
|
||||
document.getElementById("dataSourceUrl").value = urlData; |
|
||||
load(urlData); |
|
||||
} |
|
||||
|
|
||||
function loadSpreadSheet() { |
|
||||
document.getElementById("dataSourceUrl").value = urlSpreadsheet; |
|
||||
load(urlSpreadsheet); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p>Enter a datasource and click the button "Go".</p> |
|
||||
<p> |
|
||||
Datasource: <input type="text" id="dataSourceUrl" value="data.php" style="width: 600px;"> |
|
||||
<input type="button" value="Go" onclick="load();"> |
|
||||
</p> |
|
||||
<p> |
|
||||
Examples: |
|
||||
</p> |
|
||||
<p> |
|
||||
<a href="javascript:loadDataHtml();">Open data.php</a> (Works only if you run the example on a PHP server)<br> |
|
||||
<a href="javascript:loadSpreadSheet();">Open a Google spreadsheet</a> |
|
||||
(or <a href="" onclick="window.open(urlSpreadsheet); return false;">view</a> this sheet)<br> |
|
||||
</p> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,72 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
var t = new Date(2010,7,23,16,30,15); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(t.getTime()+15), , 'Conversation<br>' + |
|
||||
'<img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(t.getTime()+16), , 'Mail from boss<br>' + |
|
||||
'<img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(t.getTime()+18), , 'Report'], |
|
||||
[new Date(t.getTime()+20), new Date(t.getTime()+26), 'Traject A'], |
|
||||
[new Date(t.getTime()+22), , 'Memo<br>' + |
|
||||
'<img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(t.getTime()+23), , 'Phone call<br>' + |
|
||||
'<img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(t.getTime()+24), new Date(t.getTime()+27), 'Traject B'], |
|
||||
[new Date(t.getTime()+29), , 'Report<br>' + |
|
||||
'<img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "300px", |
|
||||
editable: true, |
|
||||
style: "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
var vis = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
vis.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,144 +0,0 @@ |
|||||
<html > |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
|
|
||||
div.timeline-frame { |
|
||||
border-color: #103E9C; |
|
||||
} |
|
||||
|
|
||||
div.timeline-axis { |
|
||||
border-color: #103E9C; |
|
||||
|
|
||||
background-color: #EEEFF1; |
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9F9F9', endColorstr='#EEEFF1'); /* for IE */ |
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#F9F9F9), to(#EEEFF1)); /* for webkit browsers */ |
|
||||
background: -moz-linear-gradient(top, #F9F9F9, #EEEFF1); /* for firefox 3.6+ */ |
|
||||
} |
|
||||
|
|
||||
div.timeline-axis-text { |
|
||||
font: bold 12px arial ; |
|
||||
color: #103E9C; |
|
||||
} |
|
||||
|
|
||||
div.timeline-event { |
|
||||
border: none; |
|
||||
background-color: white; |
|
||||
} |
|
||||
div.timeline-event-selected { |
|
||||
background-color: #C0D8E1; |
|
||||
} |
|
||||
div.timeline-event-content { |
|
||||
margin: 0; |
|
||||
} |
|
||||
|
|
||||
div.timeline-groups-axis { |
|
||||
border-color: #103E9C; |
|
||||
} |
|
||||
div.timeline-groups-text { |
|
||||
font: bold 12px arial ; |
|
||||
color: #103E9C; |
|
||||
} |
|
||||
|
|
||||
div.order { |
|
||||
border: 1px solid #FB3738; |
|
||||
border-radius: 2px; |
|
||||
-moz-border-radius: 2px; |
|
||||
|
|
||||
font: bold 12px arial ; |
|
||||
color: #103E9C; |
|
||||
|
|
||||
padding: 2px; |
|
||||
margin:1px; |
|
||||
overflow: hidden; |
|
||||
} |
|
||||
|
|
||||
</style> |
|
||||
|
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline = null; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
data.addColumn('string', 'group'); |
|
||||
|
|
||||
var order = 1; |
|
||||
for (var truck = 11; truck < 15; truck++) { |
|
||||
var date = new Date(2010, 12, 14, 8, 0, 0); |
|
||||
for (var i = 0; i < 10; i++) { |
|
||||
date.setHours(date.getHours() + 4 * (Math.random() < 0.2)); |
|
||||
var start = new Date(date); |
|
||||
|
|
||||
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4)); |
|
||||
var end = new Date(date); |
|
||||
|
|
||||
var orderText = "Order " + order; |
|
||||
if (Math.random() < 0.25) { |
|
||||
orderText = "<img src='img/product-icon.png' style='width:32px; height:32px; vertical-align: middle'> " + orderText; |
|
||||
} |
|
||||
orderText = "<div title='Order " + order + "' class='order'>" + orderText + "</div>"; |
|
||||
|
|
||||
var truckText = "<img src='img/truck-icon.png' style='width:24px; height:24px; vertical-align: middle'>" + |
|
||||
"Truck " + truck; |
|
||||
data.addRow([start, end, orderText, truckText]); |
|
||||
order++; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
//height: "300px", |
|
||||
height: "auto", |
|
||||
layout: "box", |
|
||||
editable: true, |
|
||||
eventMargin: 5, // minimal margin between events |
|
||||
eventMarginAxis: 0, // minimal margin beteen events and the axis |
|
||||
showMajorLabels: false, |
|
||||
axisOnTop: true, |
|
||||
// groupsWidth : "200px", |
|
||||
groupsChangeable : true, |
|
||||
groupsOnRight: false, |
|
||||
stackEvents: false |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>Grouping example</h1> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,91 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
var data = undefined; |
|
||||
var timeline = undefined; |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
function onTimeChange(event) { |
|
||||
document.getElementById("customTime").innerHTML = "Custom Time: " + event.time; |
|
||||
|
|
||||
// adjust the end date of the event in the data table |
|
||||
var start = data.getValue(0, 0); |
|
||||
if (event.time > start) { |
|
||||
data.setValue(0, 1, new Date(event.time)); |
|
||||
var now = new Date(); |
|
||||
if (event.time < now) { |
|
||||
data.setValue(0, 2, "Dynamic Event (past)"); |
|
||||
} |
|
||||
else if (event.time > now) { |
|
||||
data.setValue(0, 2, "Dynamic Event (future)"); |
|
||||
} |
|
||||
else { |
|
||||
data.setValue(0, 2, "Dynamic Event (now)"); |
|
||||
} |
|
||||
timeline.redraw(); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
data.addRows([[ |
|
||||
new Date((new Date()).getTime() - 60 * 1000), |
|
||||
new Date(), |
|
||||
'Dynamic event']]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'showCustomTime': true |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Add event listeners |
|
||||
google.visualization.events.addListener(timeline, 'timechange', onTimeChange); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
// set a custom range from -2 minute to +3 minutes current time |
|
||||
var start = new Date((new Date()).getTime() - 2 * 60 * 1000); |
|
||||
var end = new Date((new Date()).getTime() + 3 * 60 * 1000); |
|
||||
timeline.setVisibleChartRange(start, end); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p style="width: 600px;"> |
|
||||
When the custom time bar is shown, the user can drag this bar to a specific |
|
||||
time. The Timeline sends an event that the custom time is changed, after |
|
||||
which the contents of the timeline can be changed according to the specified |
|
||||
time in past or future. |
|
||||
</p> |
|
||||
|
|
||||
<div id="customTime"> </div> |
|
||||
<p></p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,201 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline mobile demo</title> |
|
||||
|
|
||||
<!-- for mobile devices like android and iphone --> |
|
||||
<meta content="True" name="HandheldFriendly" /> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
/* Styles for the page */ |
|
||||
html, body { |
|
||||
font: 10pt arial; |
|
||||
} |
|
||||
|
|
||||
#mytimeline { |
|
||||
} |
|
||||
|
|
||||
#new { |
|
||||
position: absolute; |
|
||||
left: 25px; |
|
||||
top: 8px; |
|
||||
|
|
||||
text-transform: uppercase; |
|
||||
color: white; |
|
||||
font-weight: bold; |
|
||||
font-size: 40px; |
|
||||
text-decoration: none; |
|
||||
} |
|
||||
|
|
||||
/* Custom styles for the Timeline */ |
|
||||
div.timeline-frame { |
|
||||
border-color: #5D99C3; |
|
||||
|
|
||||
border-radius: 5px; |
|
||||
-moz-border-radius: 5px; /* For Firefox 3.6 and older */ |
|
||||
} |
|
||||
div.timeline-axis { |
|
||||
border-color: #5D99C3; |
|
||||
|
|
||||
background-color: #5D99C3; |
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5D99C3', endColorstr='#3A6DA0'); /* for IE */ |
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#5D99C3), to(#3A6DA0)); /* for webkit browsers */ |
|
||||
background: -moz-linear-gradient(top, #5D99C3, #3A6DA0); /* for firefox 3.6+ */ |
|
||||
} |
|
||||
div.timeline-axis-grid { |
|
||||
} |
|
||||
div.timeline-groups-axis { |
|
||||
border-color: #5D99C3; |
|
||||
} |
|
||||
div.timeline-axis-text { |
|
||||
color: white; |
|
||||
} |
|
||||
div.timeline-groups-text { |
|
||||
color: #4D4D4D; |
|
||||
} |
|
||||
div.timeline-event { |
|
||||
color: white; |
|
||||
border-radius: 5px; |
|
||||
} |
|
||||
div.timeline-event-content { |
|
||||
padding: 5px; |
|
||||
} |
|
||||
|
|
||||
div.unavailable { |
|
||||
background-color: #F03030; /* red */ |
|
||||
border-color: #bd2828; /* red */ |
|
||||
} |
|
||||
div.available { |
|
||||
background-color: #1AA11A; /* green */ |
|
||||
border-color: #136e13; /* green */ |
|
||||
} |
|
||||
div.maybe { |
|
||||
background-color: #FFA500; /* orange */ |
|
||||
border-color: #cc8100; /* orange */ |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline = undefined; |
|
||||
var data = undefined; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
data.addColumn('string', 'group'); |
|
||||
data.addColumn('string', 'className'); |
|
||||
|
|
||||
// create some random data |
|
||||
var names = ["Algie", "Barney", "Chris"]; |
|
||||
for (var n = 0, len = names.length; n < len; n++) { |
|
||||
var name = names[n]; |
|
||||
var now = new Date(); |
|
||||
var end = new Date(now.getTime() - 12 * 60 * 60 * 1000); |
|
||||
for (var i = 0; i < 5; i++) { |
|
||||
var start = new Date(end.getTime() + Math.round(Math.random() * 5) * 60 * 60 * 1000); |
|
||||
var end = new Date(start.getTime() + Math.round(4 + Math.random() * 5) * 60 * 60 * 1000); |
|
||||
|
|
||||
var r = Math.round(Math.random() * 2); |
|
||||
var availability = (r === 0 ? "Unavailable" : (r === 1 ? "Available" : "Maybe")); |
|
||||
var group = availability.toLowerCase(); |
|
||||
var content = availability; |
|
||||
data.addRow([start, end, content, name, group]); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "99%", |
|
||||
layout: "box", |
|
||||
axisOnTop: true, |
|
||||
eventMargin: 10, // minimal margin between events |
|
||||
eventMarginAxis: 0, // minimal margin beteen events and the axis |
|
||||
editable: true, |
|
||||
showNavigation: true |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// register event listeners |
|
||||
google.visualization.events.addListener(timeline, 'edit', onEdit); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
// Set a customized visible range |
|
||||
var start = new Date(now.getTime() - 4 * 60 * 60 * 1000); |
|
||||
var end = new Date(now.getTime() + 8 * 60 * 60 * 1000); |
|
||||
timeline.setVisibleChartRange(start, end); |
|
||||
} |
|
||||
|
|
||||
function getRandomName() { |
|
||||
var names = ["Algie", "Barney", "Grant", "Mick", "Langdon"]; |
|
||||
|
|
||||
var r = Math.round(Math.random() * (names.length - 1)); |
|
||||
return names[r]; |
|
||||
} |
|
||||
|
|
||||
function getSelectedRow() { |
|
||||
var row = undefined; |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
return row; |
|
||||
} |
|
||||
|
|
||||
function strip(html) |
|
||||
{ |
|
||||
var tmp = document.createElement("DIV"); |
|
||||
tmp.innerHTML = html; |
|
||||
return tmp.textContent||tmp.innerText; |
|
||||
} |
|
||||
|
|
||||
// Make a callback function for the select event |
|
||||
var onEdit = function (event) { |
|
||||
var row = getSelectedRow(); |
|
||||
var content = data.getValue(row, 2); |
|
||||
var availability = strip(content); |
|
||||
var newAvailability = prompt("Enter status\n\n" + |
|
||||
"Choose from: Available, Unavailable, Maybe", availability); |
|
||||
if (newAvailability != undefined) { |
|
||||
var newContent = newAvailability; |
|
||||
data.setValue(row, 2, newContent); |
|
||||
data.setValue(row, 4, newAvailability.toLowerCase()); |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
var onNew = function () { |
|
||||
alert("Clicking this NEW button should open a popup window where " + |
|
||||
"a new status event can be created.\n\n" + |
|
||||
"Apperently this is not yet implemented..."); |
|
||||
}; |
|
||||
|
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onresize="timeline.redraw();"> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<a id="new" title="Add new status event" href="javascript:void(0);" onclick="onNew();">+</a> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,159 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
color: #4D4D4D; |
|
||||
font: 10pt arial; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline = null; |
|
||||
var data = null; |
|
||||
var order = 1; |
|
||||
var truck = 1; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
stackEvents: false, |
|
||||
start: new Date(), |
|
||||
end: new Date(1000*60*60*24 + (new Date()).valueOf()), |
|
||||
editable: true, |
|
||||
animate: false, |
|
||||
eventMargin: 10, // minimal margin between events |
|
||||
eventMarginAxis: 5, // minimal margin between events and the axis |
|
||||
showMajorLabels: true, |
|
||||
cluster: true, |
|
||||
axisOnTop: true, |
|
||||
snapEvents: true, |
|
||||
dragAreaWidth: 20 |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
data.addColumn('string', 'group'); |
|
||||
|
|
||||
addData(); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
google.visualization.events.addListener(timeline, 'select', |
|
||||
function () { |
|
||||
//console.log('select', timeline.getSelection()[0]); |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
google.visualization.events.addListener(timeline, 'edit', |
|
||||
function() { |
|
||||
//console.log('edit') |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
google.visualization.events.addListener(timeline, 'change', |
|
||||
function() { |
|
||||
//console.log('change') |
|
||||
//timeline.cancelChange(); |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
google.visualization.events.addListener(timeline, 'add', |
|
||||
function() { |
|
||||
//console.log('add') |
|
||||
//timeline.cancelAdd(); |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
/* |
|
||||
console.profile(); |
|
||||
var count = 10; |
|
||||
for (var i = 0; i < count; i++) { |
|
||||
timeline.redraw(); |
|
||||
} |
|
||||
console.profileEnd(); |
|
||||
//*/ |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Get URL parameter |
|
||||
* http://www.netlobo.com/url_query_string_javascript.html |
|
||||
*/ |
|
||||
function gup( name ) { |
|
||||
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); |
|
||||
var regexS = "[\\?&]"+name+"=([^&#]*)"; |
|
||||
var regex = new RegExp( regexS ); |
|
||||
var results = regex.exec( window.location.href ); |
|
||||
if( results == null ) |
|
||||
return ""; |
|
||||
else |
|
||||
return results[1]; |
|
||||
} |
|
||||
|
|
||||
var count = (Number(gup('count')) || 100); |
|
||||
|
|
||||
function addData() { |
|
||||
for (var j = 0; j < 4; j++) { |
|
||||
var date = new Date(); |
|
||||
for (var i = 0; i < count/4; i++) { |
|
||||
date.setHours(date.getHours() + 4 * (Math.random() < 0.2)); |
|
||||
var start = new Date(date); |
|
||||
|
|
||||
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4)); |
|
||||
var end = new Date(date); |
|
||||
|
|
||||
var orderText = "Order " + order; |
|
||||
var truckText = "Truck " + truck; |
|
||||
data.addRow([start, end, orderText, truckText]); |
|
||||
order++; |
|
||||
} |
|
||||
truck++; |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onresize="/*timeline.checkResize();*/"> |
|
||||
<h1>Timeline grouping performance</h1> |
|
||||
|
|
||||
<p> |
|
||||
Choose a number of items: |
|
||||
<a href="?count=20">20</a>, |
|
||||
<a href="?count=100">100</a>, |
|
||||
<a href="?count=1000">1000</a>, |
|
||||
<a href="?count=10000">10000</a> |
|
||||
<p> |
|
||||
<p> |
|
||||
Current number of items: <span id='count'>100</span> |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<div id="info"></div> |
|
||||
|
|
||||
<script> |
|
||||
document.getElementById('count').innerHTML = count; |
|
||||
</script> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,103 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline JSON data</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
font-size: 10pt; |
|
||||
font-family: verdana, sans, arial, sans-serif; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create a JSON data table |
|
||||
data = [ |
|
||||
{ |
|
||||
'start': new Date(2010,7,23), |
|
||||
'content': 'Conversation<br><img src="img/comments-icon.png" style="width:32px; height:32px;">' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,23,23,0,0), |
|
||||
'content': 'Mail from boss<br><img src="img/mail-icon.png" style="width:32px; height:32px;">' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,24,16,0,0), |
|
||||
'content': 'Report' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,26), |
|
||||
'end': new Date(2010,8,2), |
|
||||
'content': 'Traject A' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,28), |
|
||||
'content': 'Memo<br><img src="img/notes-edit-icon.png" style="width:48px; height:48px;">' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,29), |
|
||||
'content': 'Phone call<br><img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,31), |
|
||||
'end': new Date(2010,8,3), |
|
||||
'content': 'Traject B' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,8,4,12,0,0), |
|
||||
'content': 'Report<br><img src="img/attachment-icon.png" style="width:32px; height:32px;">' |
|
||||
} |
|
||||
]; |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'width': '100%', |
|
||||
'height': '300px', |
|
||||
'editable': true, // enable dragging and editing events |
|
||||
'style': 'box' |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
function onRangeChanged(properties) { |
|
||||
document.getElementById('info').innerHTML += 'rangechanged ' + |
|
||||
properties.start + ' - ' + properties.end + '<br>'; |
|
||||
} |
|
||||
|
|
||||
// attach an event listener using the links events handler |
|
||||
links.events.addListener(timeline, 'rangechanged', onRangeChanged); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onload="drawVisualization();"> |
|
||||
<h1>Timeline JSON data</h1> |
|
||||
<p> |
|
||||
This demo shows how to feed the Timeline with JSON data. |
|
||||
No Google DataTable is used, and therefore the Google JSAPI is |
|
||||
not needed by the Timeline, which can thus be used offline. |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
<div id="info"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,49 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
function drawVisualization() { |
|
||||
// create and populate an array with data |
|
||||
var data = [ |
|
||||
{'start': new Date(2012, 4, 25), 'content': 'First'}, |
|
||||
{'start': new Date(2012, 4, 26), 'content': 'Last'} |
|
||||
]; |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
"width": "100%", |
|
||||
"height": "300px", |
|
||||
"min": new Date(2012, 0, 1), // lower limit of visible range |
|
||||
"max": new Date(2013, 0, 1), // upper limit of visible range |
|
||||
"zoomMin": 1000 * 60 * 60 * 24, // one day in milliseconds |
|
||||
"zoomMax": 1000 * 60 * 60 * 24 * 31 * 3 // about three months in milliseconds |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onload="drawVisualization();"> |
|
||||
<p> |
|
||||
The visible range is limited in this demo: |
|
||||
</p> |
|
||||
<ul> |
|
||||
<li>minimum visible date is limited to 2012-01-01 using option <code>min</code></li> |
|
||||
<li>maximum visible date is limited to 2013-01-01 (excluded) using option <code>max</code></li> |
|
||||
<li>visible interval is limited to a minimum of 24 hours using option <code>zoomMin</code></li> |
|
||||
<li>visible interval is limited to a maximum of about 3 months using option <code>zoomMax</code></li> |
|
||||
</ul> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,145 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
|
|
||||
div.timeline-event { |
|
||||
border: none; |
|
||||
background: none; |
|
||||
border-radius: 0; |
|
||||
} |
|
||||
div.timeline-event-selected { |
|
||||
border: none; |
|
||||
background: none; |
|
||||
} |
|
||||
div.timeline-event-content { |
|
||||
margin: 0; |
|
||||
} |
|
||||
div.timeline-event-range { |
|
||||
border: none; |
|
||||
border-radius: 0; |
|
||||
height: 100px; |
|
||||
width: 100%; |
|
||||
position: relative; |
|
||||
overflow: visible; |
|
||||
} |
|
||||
div.bar { |
|
||||
position: absolute; |
|
||||
bottom: 0; |
|
||||
left: 0; |
|
||||
width: 100%; |
|
||||
text-align: center; |
|
||||
color: white; |
|
||||
/* height and color is set for each individual bar */ |
|
||||
} |
|
||||
div.requirement { |
|
||||
position: absolute; |
|
||||
bottom: 0; |
|
||||
left: 0; |
|
||||
width: 100%; |
|
||||
border-top: 2px solid gray; |
|
||||
background: #e5e5e5; |
|
||||
opacity: 0.5; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
|
|
||||
/** |
|
||||
* Calculate the color based on the given value. |
|
||||
* @param {number} H Hue, a value be between 0 and 360 |
|
||||
* @param {number} S Saturation, a value between 0 and 1 |
|
||||
* @param {number} V Value, a value between 0 and 1 |
|
||||
*/ |
|
||||
var hsv2rgb = function(H, S, V) { |
|
||||
var R, G, B, C, Hi, X; |
|
||||
|
|
||||
C = V * S; |
|
||||
Hi = Math.floor(H/60); // hi = 0,1,2,3,4,5 |
|
||||
X = C * (1 - Math.abs(((H/60) % 2) - 1)); |
|
||||
|
|
||||
switch (Hi) { |
|
||||
case 0: R = C; G = X; B = 0; break; |
|
||||
case 1: R = X; G = C; B = 0; break; |
|
||||
case 2: R = 0; G = C; B = X; break; |
|
||||
case 3: R = 0; G = X; B = C; break; |
|
||||
case 4: R = X; G = 0; B = C; break; |
|
||||
case 5: R = C; G = 0; B = X; break; |
|
||||
|
|
||||
default: R = 0; G = 0; B = 0; break; |
|
||||
} |
|
||||
|
|
||||
return "RGB(" + parseInt(R*255) + "," + parseInt(G*255) + "," + parseInt(B*255) + ")"; |
|
||||
}; |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = []; |
|
||||
|
|
||||
var maxNum = 20; |
|
||||
var d = new Date(2012, 6, 5); |
|
||||
for (var i = 0; i < 20; i++) { |
|
||||
var hours = Math.round(1 + Math.random() * 7); |
|
||||
var start = new Date(d); |
|
||||
var end = new Date(d); |
|
||||
end.setHours(end.getHours() + hours); |
|
||||
|
|
||||
// create item with minimum requirement |
|
||||
var num = Math.round(Math.random() * maxNum); // number of members available |
|
||||
var height = Math.round(num / maxNum * 80 + 20); // a percentage, with a lower bound on 20% |
|
||||
var style = 'height:' + height + 'px;'; |
|
||||
var requirement = '<div class="requirement" style="' + style + '" ' + |
|
||||
'title="Minimum requirement: ' + num + ' people"></div>'; |
|
||||
|
|
||||
// create item with actual number |
|
||||
num = Math.round(Math.random() * maxNum); // number of members available |
|
||||
height = Math.round(num / maxNum * 70 + 20); // a percentage, with a lower bound on 20% |
|
||||
var hue = Math.min(Math.max(height, 20), 80) * 1.2; // hue between 0 (red) and 120 (green) |
|
||||
var color = hsv2rgb(hue, 0.95, 0.95); |
|
||||
var borderColor = hsv2rgb(hue, 0.9, 0.9); |
|
||||
style = 'height:' + height + 'px;' + |
|
||||
'background-color: ' + color + ';' + |
|
||||
'border-top: 2px solid ' + borderColor + ';'; |
|
||||
var actual = '<div class="bar" style="' + style + '" ' + |
|
||||
' title="Actual: ' + num + ' people">' + num + '</div>'; |
|
||||
var item = { |
|
||||
'group': 'Team', |
|
||||
'start': start, |
|
||||
'end': end, |
|
||||
'content': requirement + actual |
|
||||
}; |
|
||||
data.push(item); |
|
||||
|
|
||||
d = new Date(end); |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
"width": "100%", |
|
||||
"height": "300px", |
|
||||
"style": "box", |
|
||||
"stackEvents": false |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onload="drawVisualization();"> |
|
||||
<h1>Timeline - Bar Graph Example</h1> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,127 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
font: 14pt arial; |
|
||||
} |
|
||||
input { |
|
||||
font: 14pt arial; |
|
||||
} |
|
||||
|
|
||||
/* custom styles for individual items, load this after timeline.css */ |
|
||||
|
|
||||
div.green { |
|
||||
background-color: greenyellow; |
|
||||
border-color: green; |
|
||||
} |
|
||||
|
|
||||
/* create a custom sized dot at the bottom of the red item */ |
|
||||
div.red { |
|
||||
background-color: red; |
|
||||
border-color: darkred; |
|
||||
color: white; |
|
||||
font-family: monospace; |
|
||||
box-shadow: 0 0 10px gray; |
|
||||
} |
|
||||
div.timeline-event-dot.red { |
|
||||
border-radius: 10px; |
|
||||
border-width: 10px; |
|
||||
} |
|
||||
div.timeline-event-line.red { |
|
||||
border-width: 5px; |
|
||||
} |
|
||||
div.timeline-event-box.red { |
|
||||
border-radius: 0; |
|
||||
border-width: 2px; |
|
||||
font-size: 24pt; |
|
||||
font-weight: bold; |
|
||||
} |
|
||||
|
|
||||
div.orange { |
|
||||
background-color: gold; |
|
||||
border-color: orange; |
|
||||
} |
|
||||
div.timeline-event-selected.orange { |
|
||||
/* custom colors for selected orange items */ |
|
||||
background-color: orange; |
|
||||
border-color: orangered; |
|
||||
} |
|
||||
|
|
||||
div.magenta { |
|
||||
background-color: magenta; |
|
||||
border-color: purple; |
|
||||
color: white; |
|
||||
} |
|
||||
|
|
||||
/* our custom classes overrule the styles for selected events, |
|
||||
so lets define a new style for the selected events */ |
|
||||
div.timeline-event-selected { |
|
||||
background-color: white; |
|
||||
border-color: black; |
|
||||
color: black; |
|
||||
box-shadow: 0 0 10px gray; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
// Called when the page is loaded |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = [ |
|
||||
{ |
|
||||
'start': new Date(2012,7,19), |
|
||||
'content': 'default' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2012,7,23), |
|
||||
'content': 'green', |
|
||||
'className': 'green' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2012,7,29), |
|
||||
'content': 'red', |
|
||||
'className': 'red' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2012,7,27), |
|
||||
'end': new Date(2012,8,1), |
|
||||
'content': 'orange', |
|
||||
'className': 'orange' |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2012,8,2), |
|
||||
'content': 'magenta', |
|
||||
'className': 'magenta' |
|
||||
} |
|
||||
]; |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
//'editable': true |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our table object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our table with the data we created locally. |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
|
|
||||
</script> |
|
||||
</head> |
|
||||
<body onload="drawVisualization()"> |
|
||||
<p>This page demonstrates the timeline visualization with custom css classes |
|
||||
for individual items.</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,117 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline animate visible range</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
font-size: 10pt; |
|
||||
font-family: verdana, sans, arial, sans-serif; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create a JSON data table |
|
||||
data = []; |
|
||||
for (var i = 0; i < 10; i++) { |
|
||||
var date = new Date(2012, i, 1); |
|
||||
data.push({ |
|
||||
"start": date, |
|
||||
"content": "item " + i |
|
||||
}); |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'width': '100%', |
|
||||
'height': '300px', |
|
||||
'showCustomTime': true |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// cancel any running animation as soon as the user changes the range |
|
||||
links.events.addListener(timeline, 'rangechange', function (properties) { |
|
||||
animateCancel(); |
|
||||
}); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
|
|
||||
// create a simple animation |
|
||||
var animateTimeout = undefined; |
|
||||
var animateFinal = undefined; |
|
||||
function animateTo(date) { |
|
||||
// get the new final date |
|
||||
animateFinal = date.valueOf(); |
|
||||
timeline.setCustomTime(date); |
|
||||
|
|
||||
// cancel any running animation |
|
||||
animateCancel(); |
|
||||
|
|
||||
// animate towards the final date |
|
||||
var animate = function () { |
|
||||
var range = timeline.getVisibleChartRange(); |
|
||||
var current = (range.start.getTime() + range.end.getTime())/ 2; |
|
||||
var width = (range.end.getTime() - range.start.getTime()); |
|
||||
var minDiff = Math.max(width / 1000, 1); |
|
||||
var diff = (animateFinal - current); |
|
||||
if (Math.abs(diff) > minDiff) { |
|
||||
// move towards the final date |
|
||||
var start = new Date(range.start.getTime() + diff / 4); |
|
||||
var end = new Date(range.end.getTime() + diff / 4); |
|
||||
timeline.setVisibleChartRange(start, end); |
|
||||
|
|
||||
// start next timer |
|
||||
animateTimeout = setTimeout(animate, 50); |
|
||||
} |
|
||||
}; |
|
||||
animate(); |
|
||||
} |
|
||||
function animateCancel () { |
|
||||
if (animateTimeout) { |
|
||||
clearTimeout(animateTimeout); |
|
||||
animateTimeout = undefined; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
function go () { |
|
||||
// interpret the value as a date formatted as "yyyy-MM-dd" |
|
||||
var v = document.getElementById('animateDate').value.split('-'); |
|
||||
var date = new Date(v[0], v[1], v[2]); |
|
||||
if (date.toString() == "Invalid Date") { |
|
||||
alert("Invalid Date"); |
|
||||
} |
|
||||
else { |
|
||||
animateTo(date); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onload="drawVisualization();"> |
|
||||
<h1>Timeline - animate visible range</h1> |
|
||||
<p> |
|
||||
This demo shows how to to animate the timeline visible range to another date |
|
||||
</p> |
|
||||
|
|
||||
<div> |
|
||||
<input id="animateDate" value="2012-09-13" placeholder="yyyy-MM-dd"> |
|
||||
<button id="go" onclick="go()">Animate to</button> |
|
||||
</div> |
|
||||
<br> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,106 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline clustering demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
font-size: 10pt; |
|
||||
font-family: verdana, sans, arial, sans-serif; |
|
||||
color: #4d4d4d; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create a JSON data table |
|
||||
data = []; |
|
||||
|
|
||||
// an item every month |
|
||||
var i, iMax = 1000; |
|
||||
var num = 0; |
|
||||
var date = new Date(2012, 0, 1); |
|
||||
for (i = 0; i < iMax; i++) { |
|
||||
date.setMonth(date.getMonth() + 1); |
|
||||
data.push({ |
|
||||
"start": new Date(date), |
|
||||
"content": "item " + num |
|
||||
}); |
|
||||
num++; |
|
||||
} |
|
||||
|
|
||||
// an item every day |
|
||||
date = new Date(2012, 3, 1); |
|
||||
for (i = 0; i < iMax; i++) { |
|
||||
date.setDate(date.getDate() + 1); |
|
||||
data.push({ |
|
||||
"start": new Date(date), |
|
||||
"content": "item " + num |
|
||||
}); |
|
||||
num++; |
|
||||
} |
|
||||
|
|
||||
// an item every hour |
|
||||
date = new Date(2012, 6, 1); |
|
||||
for (i = 0; i < iMax; i++) { |
|
||||
date.setHours(date.getHours() + 1); |
|
||||
data.push({ |
|
||||
"start": new Date(date), |
|
||||
"content": "item " + num |
|
||||
}); |
|
||||
num++; |
|
||||
} |
|
||||
|
|
||||
// items on the same spot |
|
||||
date = new Date(2012, 9, 1); |
|
||||
for (i = 0; i < iMax; i++) { |
|
||||
data.push({ |
|
||||
"start": new Date(date), |
|
||||
"content": "item " + num |
|
||||
}); |
|
||||
num++; |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'width': '100%', |
|
||||
'height': '300px', |
|
||||
'start': new Date(2012, 0, 1), |
|
||||
'end': new Date(2012, 11, 31), |
|
||||
'cluster': true, |
|
||||
// 'axisOnTop': true, |
|
||||
'editable': true |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
|
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body onload="drawVisualization();"> |
|
||||
<h1>Timeline - clustering demo</h1> |
|
||||
<p> |
|
||||
When too much items are being displayed, Timeline will smartly cluster |
|
||||
the items together. This both: |
|
||||
</p> |
|
||||
|
|
||||
<ul> |
|
||||
<li>keeps the amount of displayed information limited for the user,</li> |
|
||||
<li>and prevents the browser from getting overloaded</li> |
|
||||
</ul> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,100 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline</title> |
|
||||
|
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body { |
|
||||
font-size: 10pt; |
|
||||
font-family: verdana, sans, arial, sans-serif; |
|
||||
} |
|
||||
div.readonly { |
|
||||
background-color: #ff4500; |
|
||||
border-color: red; |
|
||||
color: white; |
|
||||
} |
|
||||
</style> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>Timeline - editable/read-only events</h1> |
|
||||
<p style="max-width: 600px;"> |
|
||||
In the demo below, events are made editable or read-only on an individual |
|
||||
basis. |
|
||||
To check whether an item is editable, the Timeline first checks |
|
||||
if the item has the field 'editable' defined, and if not, uses the global |
|
||||
options.editable. |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
// Create some JSON data |
|
||||
var data = [ |
|
||||
{ |
|
||||
'start': new Date(2010,7,23), |
|
||||
'content': 'Editable', |
|
||||
'editable': true |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,23,23,0,0), |
|
||||
'content': 'Editable', |
|
||||
'editable': true |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,24,16,0,0), |
|
||||
'content': 'Read-only', |
|
||||
'className': 'readonly', |
|
||||
'editable': false |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,26), |
|
||||
'end': new Date(2010,8,2), |
|
||||
'content': 'Read-only', |
|
||||
'className': 'readonly', |
|
||||
'editable': false |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,28), |
|
||||
'content': 'Editable', |
|
||||
'editable': true |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,29), |
|
||||
'content': 'Read-only', |
|
||||
'className': 'readonly', |
|
||||
'editable': false |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,7,31), |
|
||||
'end': new Date(2010,8,3), |
|
||||
'content': 'Editable', |
|
||||
'editable': true |
|
||||
}, |
|
||||
{ |
|
||||
'start': new Date(2010,8,4,12,0,0), |
|
||||
'className': 'readonly', |
|
||||
'content': 'Read-only', |
|
||||
'editable': false |
|
||||
} |
|
||||
]; |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
'width': '100%', |
|
||||
'height': '300px', |
|
||||
'editable': true, // enable dragging and editing events |
|
||||
'style': 'box' |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
var timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
</script> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,182 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
.item-line |
|
||||
{ |
|
||||
border-left-width: 3px; |
|
||||
border-left-style: solid; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
|
|
||||
/** |
|
||||
* @constructor links.Timeline.ItemLine |
|
||||
* @extends links.Timeline.Item |
|
||||
* User defined item type "line". |
|
||||
*/ |
|
||||
var ItemLine = function (data, options) { |
|
||||
links.Timeline.Item.call(this, data, options); |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype = new links.Timeline.Item(); |
|
||||
|
|
||||
ItemLine.prototype.createDOM = function () { |
|
||||
var _this = this; |
|
||||
var divLine = document.createElement("DIV"); |
|
||||
divLine.style.position = "absolute"; |
|
||||
divLine.style.width = "0px"; |
|
||||
|
|
||||
this.dom = divLine; |
|
||||
this.updateDOM(); |
|
||||
|
|
||||
return divLine; |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.showDOM = function (container) { |
|
||||
var dom = this.dom; |
|
||||
if (!dom) { |
|
||||
dom = this.createDOM(); |
|
||||
} |
|
||||
|
|
||||
if (dom.parentNode != container) { |
|
||||
if (dom.parentNode) { |
|
||||
this.hideDOM(); |
|
||||
} |
|
||||
|
|
||||
container.insertBefore(dom, container.firstChild); |
|
||||
this.rendered = true; |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.hideDOM = function () { |
|
||||
var dom = this.dom; |
|
||||
if (dom) { |
|
||||
var parent = dom.parentNode; |
|
||||
if (parent) { |
|
||||
parent.removeChild(dom); |
|
||||
this.rendered = false; |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.updateDOM = function () { |
|
||||
var divLine = this.dom; |
|
||||
if (divLine) { |
|
||||
|
|
||||
// update class |
|
||||
divLine.className = "timeline-event item-line"; |
|
||||
|
|
||||
if (this.isCluster) { |
|
||||
links.Timeline.addClassName(divLine, 'timeline-event-cluster'); |
|
||||
} |
|
||||
|
|
||||
// add item specific class name when provided |
|
||||
if (this.className) { |
|
||||
links.Timeline.addClassName(divLine, this.className); |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.updatePosition = function (timeline) { |
|
||||
var dom = this.dom; |
|
||||
if (dom) { |
|
||||
var left = timeline.timeToScreen(this.start), |
|
||||
axisOnTop = timeline.options.axisOnTop, |
|
||||
axisTop = timeline.size.axis.top, |
|
||||
axisHeight = timeline.size.axis.height |
|
||||
|
|
||||
dom.style.left = (left - this.lineWidth / 2) + "px"; |
|
||||
dom.style.top = "0px"; |
|
||||
dom.style.height = axisTop + "px"; |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.isVisible = function (start, end) { |
|
||||
if (this.cluster) { |
|
||||
return false; |
|
||||
} |
|
||||
|
|
||||
return (this.start > start) |
|
||||
&& (this.start < end); |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.setPosition = function (left, right) { |
|
||||
var dom = this.dom; |
|
||||
dom.style.left = (left - this.lineWidth / 2) + "px"; |
|
||||
}; |
|
||||
|
|
||||
ItemLine.prototype.getRight = function (timeline) { |
|
||||
return timeline.timeToScreen(this.start); |
|
||||
}; |
|
||||
|
|
||||
var timeline; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2010,7,23), , 'Conversation<br>' + |
|
||||
'<img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,23,23,0,0), , 'Mail from boss<br>' + |
|
||||
'<img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,24,16,0,0), , 'Report'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A'], |
|
||||
[new Date(2010,7,28), , 'Memo<br>' + |
|
||||
'<img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,7,29), , 'Phone call<br>' + |
|
||||
'<img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,31), new Date(2010,8,3), 'Traject B'], |
|
||||
[new Date(2010,8,4,12,0,0), , 'Report<br>' + |
|
||||
'<img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
"width": "100%", |
|
||||
"height": "300px", |
|
||||
"style": "line" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
timeline.addItemType('line', ItemLine); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,93 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline localization demo</title> |
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> |
|
||||
|
|
||||
<style> |
|
||||
body { |
|
||||
font: 10pt verdana; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<script type="text/javascript" src="../timeline-locales.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2011, 01, 23), , '<div>Conversation</div><img src="../examples/img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011, 01, 23, 23, 00, 00), , '<div>Mail from boss</div><img src="../examples/img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011, 01, 24, 16, 00, 00), , '<span onclick="alert(\'test\')">Click here!</span>'], |
|
||||
[new Date(2011, 01, 26), new Date(2011, 02, 02), 'Traject A'], |
|
||||
[new Date(2011, 01, 27), , '<div>Memo</div><img src="../examples/img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2011, 01, 28), new Date(2011, 02, 03), 'Traject B'], |
|
||||
[new Date(2011, 02, 04, 12, 00, 00), , '<div>Report</div><img src="../examples/img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "200px", |
|
||||
editable: true, // enable dragging and editing events |
|
||||
enableKeys: true, |
|
||||
axisOnTop: false, |
|
||||
showNavigation: true, |
|
||||
showButtonNew: true, |
|
||||
animate: true, |
|
||||
animateZoom: true, |
|
||||
layout: "box" |
|
||||
}; |
|
||||
|
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline1'), options); |
|
||||
options.locale = "de"; |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline2'), options); |
|
||||
options.locale = "es"; |
|
||||
timeline.draw(data); |
|
||||
|
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline3'), options); |
|
||||
options.locale = "ru"; |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<p><strong>This page demonstrates the timeline localization (i18n text).</strong></p> |
|
||||
|
|
||||
<p><strong>German Timeline</strong></p> |
|
||||
<div id="mytimeline1"></div> |
|
||||
|
|
||||
<p><strong>Spanish Timeline</strong></p> |
|
||||
<div id="mytimeline2"></div> |
|
||||
|
|
||||
<p><strong>Russian Timeline</strong></p> |
|
||||
<div id="mytimeline3"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;">DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;">TpdkDesign.net</a> |
|
||||
</p> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,110 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline jQuery Themeroller demo</title> |
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> |
|
||||
<script type="text/javascript" src="../lib/jquery-1.9.1.js"></script> |
|
||||
<script type="text/javascript" src="../lib/jquery-ui.js"></script> |
|
||||
<script type="text/javascript" src="../lib/jquery.themeswitcher.js"></script> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline-theme.css"> |
|
||||
|
|
||||
<style> |
|
||||
body, |
|
||||
.ui-widget, |
|
||||
.ui-widget input, |
|
||||
.ui-widget select, |
|
||||
.ui-widget textarea, |
|
||||
.ui-widget button, |
|
||||
.ui-widget-header, |
|
||||
.ui-widget-content, |
|
||||
.ui-widget-header .ui-widget-header, |
|
||||
.ui-widget-content .ui-widget-content { |
|
||||
font-family: Arial, "Trebuchet MS", Verdana, sans-serif !important; |
|
||||
font-size: 12px !important; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
$(document).ready(function () { |
|
||||
$("#switcher").themeswitcher({ |
|
||||
imgpath: "../img/themeswitcher/", |
|
||||
loadtheme: "sunny" |
|
||||
}); |
|
||||
}); |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
var timeline; |
|
||||
var data; |
|
||||
|
|
||||
function getSelectedRow() { |
|
||||
var row = undefined |
|
||||
var sel = timeline.getSelection(); |
|
||||
if (sel.length) { |
|
||||
if (sel[0].row != undefined) { |
|
||||
var row = sel[0].row; |
|
||||
} |
|
||||
} |
|
||||
return row; |
|
||||
} |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2011, 01, 23), , '<div>Conversation</div><img src="../examples/img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011, 01, 23, 23, 00, 00), , '<div>Mail from boss</div><img src="../examples/img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2011, 01, 24, 16, 00, 00), , '<span onclick="alert(\'test\')">Click here!</span>'], |
|
||||
[new Date(2011, 01, 26), new Date(2011, 02, 02), 'Traject A'], |
|
||||
[new Date(2011, 01, 27), , '<div>Memo</div><img src="../examples/img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2011, 01, 28), new Date(2011, 02, 03), 'Traject B'], |
|
||||
[new Date(2011, 02, 04, 12, 00, 00), , '<div>Report</div><img src="../examples/img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
editable: true, // enable dragging and editing events |
|
||||
enableKeys: true, |
|
||||
axisOnTop: false, |
|
||||
showNavigation: true, |
|
||||
showButtonNew: true, |
|
||||
animate: true, |
|
||||
animateZoom: true, |
|
||||
layout: "box" |
|
||||
}; |
|
||||
|
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1><strong>This page demonstrates the timeline intergation with jQuery Themeroller CSS framework.</strong></h1> |
|
||||
|
|
||||
<p> |
|
||||
|
|
||||
<div id="switcher"></div> |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;">DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;">TpdkDesign.net</a> |
|
||||
</p> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,120 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(), , 'Conversation<br>' + |
|
||||
'<img src="img/comments-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,23,23,0,0), , 'Mail from boss<br>' + |
|
||||
'<img src="img/mail-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,24,16,0,0), , 'Report'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A'], |
|
||||
[new Date(2010,7,28), , 'Memo<br>' + |
|
||||
'<img src="img/notes-edit-icon.png" style="width:48px; height:48px;">'], |
|
||||
[new Date(2010,7,29), , 'Phone call<br>' + |
|
||||
'<img src="img/Hardware-Mobile-Phone-icon.png" style="width:32px; height:32px;">'], |
|
||||
[new Date(2010,7,31), new Date(2010,8,3), 'Traject B'], |
|
||||
[new Date(2010,8,4,12,0,0), , 'Report<br>' + |
|
||||
'<img src="img/attachment-icon.png" style="width:32px; height:32px;">'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
"width": "100%", |
|
||||
"height": "300px", |
|
||||
"style": "box" |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Zoom |
|
||||
* @param zoomVal |
|
||||
*/ |
|
||||
function zoom(zoomVal) { |
|
||||
timeline.zoom(zoomVal); |
|
||||
timeline.trigger("rangechange"); |
|
||||
timeline.trigger("rangechanged"); |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Adjust the visible time range such that all events are visible. |
|
||||
*/ |
|
||||
function adjustVisibleTimeRangeToAccommodateAllEvents() { |
|
||||
timeline.setVisibleChartRangeAuto(); |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Move |
|
||||
* @param moveVal |
|
||||
*/ |
|
||||
function move(moveVal) { |
|
||||
timeline.move(moveVal); |
|
||||
timeline.trigger("rangechange"); |
|
||||
timeline.trigger("rangechanged"); |
|
||||
} |
|
||||
|
|
||||
/** |
|
||||
* Move the visible range such that the current time is located in the center of the timeline. |
|
||||
*/ |
|
||||
function moveToCurrentTime() { |
|
||||
timeline.setVisibleChartRangeNow(); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>This page demonstrates the timeline zoom and move functions</h1> |
|
||||
|
|
||||
<div> |
|
||||
<h2>Zoom controls</h2> |
|
||||
<input type="button" value="Zoom in" title="Zoom in" onclick="zoom(0.4);"> |
|
||||
<input type="button" value="Adjust visible range to accommodate all events" title="Adjust visible range to accommodate all events" onclick="adjustVisibleTimeRangeToAccommodateAllEvents();"> |
|
||||
<input type="button" value="Zoom out" title="Zoom in" onclick="zoom(-0.4);"> |
|
||||
</div> |
|
||||
<div> |
|
||||
<h2>Move controls</h2> |
|
||||
<input type="button" value="Move left" title="Move left" onclick="move(-0.2);"> |
|
||||
<input type="button" value="Move to current time" title="Move to current time" onclick="moveToCurrentTime();"> |
|
||||
<input type="button" value="Move right" title="Move right" onclick="move(0.2);"> |
|
||||
</div> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,142 +0,0 @@ |
|||||
<html > |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
|
|
||||
div.timeline-frame { |
|
||||
border-color: #103E9C; |
|
||||
} |
|
||||
|
|
||||
div.timeline-axis { |
|
||||
border-color: #103E9C; |
|
||||
|
|
||||
background-color: #EEEFF1; |
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9F9F9', endColorstr='#EEEFF1'); /* for IE */ |
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#F9F9F9), to(#EEEFF1)); /* for webkit browsers */ |
|
||||
background: -moz-linear-gradient(top, #F9F9F9, #EEEFF1); /* for firefox 3.6+ */ |
|
||||
} |
|
||||
|
|
||||
div.timeline-axis-text { |
|
||||
font: bold 12px arial ; |
|
||||
color: #103E9C; |
|
||||
} |
|
||||
|
|
||||
div.timeline-event { |
|
||||
border: none; |
|
||||
background-color: white; |
|
||||
} |
|
||||
div.timeline-event-selected { |
|
||||
background-color: #C0D8E1; |
|
||||
} |
|
||||
div.timeline-event-content { |
|
||||
margin: 0; |
|
||||
} |
|
||||
|
|
||||
div.timeline-groups-axis { |
|
||||
border-color: #103E9C; |
|
||||
} |
|
||||
div.timeline-groups-text { |
|
||||
font: bold 12px arial ; |
|
||||
color: #103E9C; |
|
||||
} |
|
||||
|
|
||||
div.order { |
|
||||
border: 1px solid #FB3738; |
|
||||
border-radius: 2px; |
|
||||
-moz-border-radius: 2px; |
|
||||
|
|
||||
font: bold 12px arial ; |
|
||||
color: #103E9C; |
|
||||
|
|
||||
padding: 2px; |
|
||||
margin:1px; |
|
||||
overflow: hidden; |
|
||||
} |
|
||||
|
|
||||
</style> |
|
||||
|
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline = null; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
data.addColumn('string', 'group'); |
|
||||
|
|
||||
var order = 1; |
|
||||
for (var truck = 11; truck < 15; truck++) { |
|
||||
var date = new Date(2010, 12, 14, 8, 0, 0); |
|
||||
for (var i = 0; i < 10; i++) { |
|
||||
date.setHours(date.getHours() + 4 * (Math.random() < 0.2)); |
|
||||
var start = new Date(date); |
|
||||
|
|
||||
date.setHours(date.getHours() + 2 + Math.floor(Math.random()*4)); |
|
||||
var end = new Date(date); |
|
||||
|
|
||||
var orderText = "Order " + order; |
|
||||
if (Math.random() < 0.25) { |
|
||||
orderText = "<img src='img/product-icon.png' style='width:32px; height:32px; vertical-align: middle'> " + orderText; |
|
||||
} |
|
||||
orderText = "<div title='Order " + order + "' class='order'>" + orderText + "</div>"; |
|
||||
|
|
||||
var truckText = "<img src='img/truck-icon.png' style='width:24px; height:24px; vertical-align: middle'>" + |
|
||||
"Truck " + truck; |
|
||||
data.addRow([start, end, orderText, truckText]); |
|
||||
order++; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
width: "100%", |
|
||||
height: "auto", |
|
||||
layout: "box", |
|
||||
editable: false, |
|
||||
selectable: false, |
|
||||
eventMargin: 10, // minimal margin between events |
|
||||
eventMarginAxis: 20, // minimal margin beteen events and the axis |
|
||||
showMajorLabels: false, |
|
||||
axisOnTop: true, |
|
||||
groupsChangeable : false, |
|
||||
groupsOnRight: false |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>Stacking with grouping example</h1> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
@ -1,73 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<title>Timeline demo</title> |
|
||||
|
|
||||
<style type="text/css"> |
|
||||
body {font: 10pt arial;} |
|
||||
</style> |
|
||||
|
|
||||
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
||||
<script type="text/javascript" src="../timeline.js"></script> |
|
||||
<link rel="stylesheet" type="text/css" href="../timeline.css"> |
|
||||
|
|
||||
<script type="text/javascript"> |
|
||||
var timeline; |
|
||||
|
|
||||
google.load("visualization", "1"); |
|
||||
|
|
||||
// Set callback to run when API is loaded |
|
||||
google.setOnLoadCallback(drawVisualization); |
|
||||
|
|
||||
// Called when the Visualization API is loaded. |
|
||||
function drawVisualization() { |
|
||||
// Create and populate a data table. |
|
||||
var data = new google.visualization.DataTable(); |
|
||||
data.addColumn('datetime', 'start'); |
|
||||
data.addColumn('datetime', 'end'); |
|
||||
data.addColumn('string', 'content'); |
|
||||
data.addColumn('string', 'type'); |
|
||||
|
|
||||
data.addRows([ |
|
||||
[new Date(2010,7,23), , 'Conversation<br>' + |
|
||||
'<img src="img/comments-icon.png" style="width:32px; height:32px;">', 'box'], |
|
||||
[new Date(2010,7,23,23,0,0), , 'Mail from boss<br>' + |
|
||||
'<img src="img/mail-icon.png" style="width:32px; height:32px;">', 'box'], |
|
||||
[new Date(2010,7,26), new Date(2010,8,2), 'Traject A (default range)', 'range'], |
|
||||
[ , new Date(2010,7,26), 'Traject B ( floatingRange no start date )', 'floatingRange'], |
|
||||
[new Date(2010,7,31), , 'Traject C ( floatingRange no end date )', 'floatingRange'], |
|
||||
[ , , 'Traject D ( floatingRange no start date and no end date )', 'floatingRange'] |
|
||||
]); |
|
||||
|
|
||||
// specify options |
|
||||
var options = { |
|
||||
"width": "100%", |
|
||||
"height": "300px", |
|
||||
'editable': true, // enable dragging and editing events |
|
||||
}; |
|
||||
|
|
||||
// Instantiate our timeline object. |
|
||||
timeline = new links.Timeline(document.getElementById('mytimeline'), options); |
|
||||
|
|
||||
// Draw our timeline with the created data and options |
|
||||
timeline.draw(data); |
|
||||
} |
|
||||
</script> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<h1>Timeline floatingRange demo</h1> |
|
||||
<p> |
|
||||
This demo shows how to use floatingRange items. |
|
||||
The start and end dates are optional in this type of range. |
|
||||
</p> |
|
||||
|
|
||||
<div id="mytimeline"></div> |
|
||||
|
|
||||
<!-- Information about where the used icons come from --> |
|
||||
<p style="color:gray; font-size:10px; font-style:italic;"> |
|
||||
Icons by <a href="http://dryicons.com" target="_blank" title="Aesthetica 2 Icons by DryIcons" style="color:gray;" >DryIcons</a> |
|
||||
and <a href="http://www.tpdkdesign.net" target="_blank" title="Refresh Cl Icons by TpdkDesign.net" style="color:gray;" >TpdkDesign.net</a> |
|
||||
</p> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
Before Width: 48 | Height: 48 | Size: 3.4 KiB |
Before Width: 48 | Height: 48 | Size: 2.7 KiB |
Before Width: 48 | Height: 48 | Size: 4.1 KiB |
Before Width: 48 | Height: 48 | Size: 3.1 KiB |
Before Width: 48 | Height: 48 | Size: 4.6 KiB |
@ -1,17 +0,0 @@ |
|||||
IMAGE LICENSES |
|
||||
|
|
||||
REFRESH CL |
|
||||
http://www.iconarchive.com/category/system/refresh-cl-icons-by-tpdkdesign.net.html |
|
||||
|
|
||||
License: Free for non-commercial use. |
|
||||
http://www.iconarchive.com/icons/tpdkdesign.net/refresh-cl/readme_eng.txt |
|
||||
|
|
||||
|
|
||||
|
|
||||
AESTHETICA 2 |
|
||||
http://www.iconarchive.com/category/application/aesthetica-2-icons-by-dryicons.html |
|
||||
|
|
||||
License: |
|
||||
DryIcons Terms of Use |
|
||||
http://dryicons.com/terms/ |
|
||||
|
|
@ -1,36 +0,0 @@ |
|||||
Aesthetica Icon Set, version 2.0 |
|
||||
http://dryicons.com/free-icons/preview/aesthetica-version-2/ |
|
||||
|
|
||||
Information |
|
||||
---------------------- |
|
||||
|
|
||||
This icon set contains 181 quality icons in the following formats: |
|
||||
Transparent PNG |
|
||||
16 x 16 px |
|
||||
24 x 24 px |
|
||||
32 x 32 px |
|
||||
48 x 48 px |
|
||||
128 x 128 px |
|
||||
|
|
||||
|
|
||||
|
|
||||
Licensing |
|
||||
---------------------- |
|
||||
|
|
||||
The usage of DryIcons' work (icons, icon sets and graphics) is limited to the terms of the "Free License" and "Commercial License" use. |
|
||||
The DryIcons Free License means that you can use our icons, icon sets and graphics in any publicly accesible web site, web application or any form of presentation publicly accessible through the World Wide Web only according to the DryIcons Free License Terms and Conditions: |
|
||||
|
|
||||
* You must put a back link with credits to http://dryicons.com on every page where DryIcons' Works are used (example: Icons by http://dryicons.com); |
|
||||
|
|
||||
* You must include the correct back link to DryIcons website, which is: http://dryicons.com; |
|
||||
|
|
||||
* You must place the link on an easy-to-see, recognizable place, so there is no confusion about the Original Author of the Works (DryIcons); |
|
||||
|
|
||||
* When copying, or paraphrasing description text (or title) on one of the Works, you must make sure there are no spelling mistakes; |
|
||||
|
|
||||
* Do not try to take credit or imply in any way that you and not DryIcons is the Original Author of the Works (icons, icon sets and graphics). |
|
||||
|
|
||||
For a more detailed look at our Free License Agreement, please follow the link: http://dryicons.com/terms/#free-license |
|
||||
|
|
||||
|
|
||||
The DryIcons Commercial License means that you can use our Free Icon Sets and Free Graphics without being obligated to put a back link to DryIcons.com for a certain fee. After you complete yourpayment transaction DryIcons grants you a Commercial License. |
|
@ -1,26 +0,0 @@ |
|||||
RefreshCL Icon Pack by TPDK ©2005 www.tpdkdesign.net |
|
||||
All rights reserved. |
|
||||
version 1.0 2005/18/11 |
|
||||
|
|
||||
|
|
||||
Terms of use |
|
||||
Theses icons are copyrighted, and for personal use only. |
|
||||
Until now, COMMERCIAL USE is strictly forbidden. |
|
||||
|
|
||||
You cannot (non-exhaustive list) : |
|
||||
- Use my icons in commercial website |
|
||||
- Use my icons in a professional website layout |
|
||||
- Sell or distribute those icons |
|
||||
|
|
||||
For any other use, such as : |
|
||||
- using in non-commercial website |
|
||||
- using icon in free software under GPL licence |
|
||||
you need my authorization to use them. If you have my permission, you need to credit me in your terms and put a link to my website. |
|
||||
I would not be responsible fo any damage you may encounter while using this product. |
|
||||
For any question or request about the pack, please send me an email to tpdk@tpdkdesign.net. |
|
||||
|
|
||||
Special thanks to customxp's & crystalxp's teams and members for help and support ;) |
|
||||
http://crystalxp.net |
|
||||
http://customxp.net |
|
||||
http://pngfactory.net |
|
||||
visit my deviantart webpage : http://tpdkcasimir.deviantart.com/ |
|
Before Width: 48 | Height: 48 | Size: 3.2 KiB |
Before Width: 48 | Height: 48 | Size: 2.8 KiB |
Before Width: 32 | Height: 32 | Size: 1.6 KiB |
Before Width: 32 | Height: 32 | Size: 1.7 KiB |
@ -1,41 +0,0 @@ |
|||||
<html> |
|
||||
<head> |
|
||||
<link rel='stylesheet' href='default.css' type='text/css'> |
|
||||
</head> |
|
||||
<body> |
|
||||
<div id="container"> |
|
||||
|
|
||||
<h1>Examples</h1> |
|
||||
|
|
||||
<p><a href="example01_basis.html">example01_basis.html</a></p> |
|
||||
<p><a href="example02_interactive.html">example02_interactive.html</a></p> |
|
||||
<p><a href="example03_performance.html">example03_performance.html</a></p> |
|
||||
<p><a href="example04_format_dot.html">example04_format_dot.html</a></p> |
|
||||
<p><a href="example05_format_custom_html.html">example05_format_custom_html.html</a></p> |
|
||||
<p><a href="example06_format_custom_css.html">example06_format_custom_css.html</a></p> |
|
||||
<p><a href="example07_confirm_changes.html">example07_confirm_changes.html</a></p> |
|
||||
<p><a href="example08_calendar.html">example08_calendar.html</a></p> |
|
||||
<p><a href="example09_editable.html">example09_editable.html</a></p> |
|
||||
<p><a href="example10_link_two_timelines.html">example10_link_two_timelines.html</a></p> |
|
||||
<p><a href="example11_datasource.html">example11_datasource.html</a></p> |
|
||||
<p><a href="example12_millisecondscale.html">example12_millisecondscale.html</a></p> |
|
||||
<p><a href="example13_grouping.html">example13_grouping.html</a></p> |
|
||||
<p><a href="example14_past_and_future.html">example14_past_and_future.html</a></p> |
|
||||
<p><a href="example15_mobile.html">example15_mobile.html</a></p> |
|
||||
<p><a href="example16_performance_grouping.html">example16_performance_grouping.html</a></p> |
|
||||
<p><a href="example17_json_data.html">example17_json_data.html</a></p> |
|
||||
<p><a href="example18_limit_range.html">example18_limit_range.html</a></p> |
|
||||
<p><a href="example19_bar_graph.html">example19_bar_graph.html</a></p> |
|
||||
<p><a href="example20_custom_class_names.html">example20_custom_class_names.html</a></p> |
|
||||
<p><a href="example21_animate_visible_range.html">example21_animate_visible_range.html</a></p> |
|
||||
<p><a href="example22_clustering.html">example22_clustering.html</a></p> |
|
||||
<p><a href="example24_individual_editable_events.html">example24_individual_editable_events.html</a></p> |
|
||||
<p><a href="example25_new_item_type.html">example25_new_item_type.html</a></p> |
|
||||
<p><a href="example26_localization.html">example26_localization.html</a></p> |
|
||||
<p><a href="example28_custom_controls.html">example28_custom_controls.html</a></p> |
|
||||
<p><a href="example29_stacking_with_grouping.html">example29_stacking_with_grouping.html</a></p> |
|
||||
<p><a href="example30_floatingRange.html">example30_floatingRange.html</a></p> |
|
||||
|
|
||||
</div> |
|
||||
</body> |
|
||||
</html> |
|
Before Width: 16 | Height: 16 | Size: 553 B |
Before Width: 16 | Height: 16 | Size: 557 B |
Before Width: 16 | Height: 16 | Size: 593 B |
Before Width: 16 | Height: 16 | Size: 441 B |
Before Width: 16 | Height: 16 | Size: 361 B |
Before Width: 24 | Height: 24 | Size: 944 B |
Before Width: 24 | Height: 24 | Size: 679 B |
Before Width: 24 | Height: 24 | Size: 685 B |
Before Width: 24 | Height: 24 | Size: 667 B |
Before Width: 24 | Height: 24 | Size: 454 B |
Before Width: 24 | Height: 24 | Size: 367 B |
Before Width: 32 | Height: 32 | Size: 725 B |
Before Width: 32 | Height: 32 | Size: 590 B |