Comparar commits
767 Commits
| Autor | SHA1 | Data | |
|---|---|---|---|
| 5308dd41d2 | |||
| 4e216cdddb | |||
| 847472f286 | |||
| df7c91ad92 | |||
| 10c3e46e95 | |||
| 48f6332f78 | |||
| d9bb81018b | |||
| 4e0128bb3d | |||
| 6c1adb79d2 | |||
| 7ee2f864b3 | |||
| c85d94a2ce | |||
| 4c6a12898b | |||
| 6e3eb5075e | |||
| f318eb9f1f | |||
| 9bfbceb047 | |||
| c56e6ed37c | |||
| 7a8d808b0e | |||
| 124c62fe24 | |||
| ba20239147 | |||
| 0c4ab0b449 | |||
| e0794cf4b4 | |||
| 3203c2c5ed | |||
| 9ec2556a7c | |||
| d3efe4b04c | |||
| f35ae5c44f | |||
| 14193c4308 | |||
| 1bef68a60b | |||
| e37e870d42 | |||
| c5a8cff129 | |||
| 61bc016637 | |||
| acf41c4882 | |||
| da3550a6d8 | |||
| 3640623147 | |||
| a6198efaca | |||
| f07caa2b97 | |||
| 2662ad9c96 | |||
| 13dbf23c3c | |||
| b2098e0efe | |||
| faea65a44e | |||
| 50adf355af | |||
| 1d05177627 | |||
| a94259cc73 | |||
| a49213e20c | |||
| 7b73c2725e | |||
| 8f53e514de | |||
| c39dd5567e | |||
| 8e9db2d662 | |||
| 52c577995c | |||
| efe7a12ccb | |||
| f146ebb179 | |||
| 72bf48cf36 | |||
| e6ecbfe824 | |||
| 0ccb6dd156 | |||
| 62b4f799b9 | |||
| bd789b8613 | |||
| 4772e4680b | |||
| 26cc24c59d | |||
| 4bc269992e | |||
| 07351ada80 | |||
| acb4a43d8a | |||
| 75dd7c5a3c | |||
| f515ac0236 | |||
| 6418531d0c | |||
| a04932eaf9 | |||
| 96f6c2388a | |||
| 8721202ec1 | |||
| 92d16d6409 | |||
| 7c2ae3f68c | |||
| 7ab3d190f2 | |||
| 29668ec45b | |||
| bd18f5b25f | |||
| 5a6fa37623 | |||
| e520e1eba4 | |||
| 2f68bfc7c1 | |||
| 57c576f96c | |||
| acf6d67e0d | |||
| d47f78f5d1 | |||
| 02de927043 | |||
| 20e2d4e984 | |||
| ff9165b7da | |||
| f7a72b1f20 | |||
| 9030a5655e | |||
| 699c476575 | |||
| b5b0f42888 | |||
| 15544c3d05 | |||
| 8010b77eb3 | |||
| 15fab6df81 | |||
| 89fb86bff7 | |||
| 75ff27307d | |||
| 1d972a0686 | |||
| 334ff59ff0 | |||
| a809954495 | |||
| 7936d7967d | |||
| aa64669ca3 | |||
| a726b07538 | |||
| ca96297ef9 | |||
| a38ce63474 | |||
| c8ee76b80e | |||
| 1eca8add85 | |||
| 2b1bb60f7e | |||
| 5aa1ff59b3 | |||
| 59af460ad4 | |||
| a449cb043a | |||
| 9d424c61f4 | |||
| 91da153c02 | |||
| 150facab44 | |||
| 3716f3b1f0 | |||
| 918ee040e1 | |||
| 1c606779c3 | |||
| fdf7f4f228 | |||
| c82611d506 | |||
| ed8ed4dd94 | |||
| 9f647ef081 | |||
| c616695e4d | |||
| 52751a0d67 | |||
| ffd308e305 | |||
| b4a07a3d9d | |||
| db97df69dc | |||
| 8f45f93c84 | |||
| b6667dfaf6 | |||
| 23fc4cca35 | |||
| 00a043f1e1 | |||
| 9abe53a32e | |||
| 8e5cf7a69d | |||
| fd39878f8b | |||
| 1ddef27903 | |||
| 19a33cc7c7 | |||
| 02a1057ff4 | |||
| a040ce61ad | |||
| 042076043b | |||
| 38d119e75d | |||
| 93c6645744 | |||
| 85c6b46ec8 | |||
| 1e199da117 | |||
| 3a40dcd883 | |||
| afc39f711f | |||
| 8a728a80ac | |||
| d932cffd50 | |||
| 6fe5513f30 | |||
| 138b1381c2 | |||
| 60d389e1f8 | |||
| 93e3b38132 | |||
| b02f879bf3 | |||
| 9997d0a7ef | |||
| 3dd0b1d234 | |||
| d27c3102e9 | |||
| d5d97bd64f | |||
| 0ddf8af452 | |||
| f6bd819c5c | |||
| 21cd77358a | |||
| 847e392e0c | |||
| 8799984a8c | |||
| 0c4c30a3bd | |||
| 4db3dba068 | |||
| 46731c40c3 | |||
| 5bc5c40f8a | |||
| d5fe1c40d8 | |||
| 6251acdf56 | |||
| 0f21f86521 | |||
| ed5ac285c3 | |||
| 880be64f48 | |||
| 753ce48e21 | |||
| 6b4d811b2f | |||
| baac2af4ab | |||
| 731ec4fa0b | |||
| 8dd88d1626 | |||
| 0fe7348456 | |||
| a7dd81f82f | |||
| d4168cd2b6 | |||
| 36c92404c3 | |||
| 1f23529cf0 | |||
| 68d5cb996a | |||
| fe36ae172d | |||
| a6a443bac3 | |||
| b3d4ed6459 | |||
| f4ac570297 | |||
| 8c31278c2f | |||
| 623ea7bb0f | |||
| 9e65eb3618 | |||
| 0e4f3cfa08 | |||
| c6c8cd1bd2 | |||
| 07000db77d | |||
| 94c07756dc | |||
| 18c3853039 | |||
| c59275583c | |||
| 65f4f1da96 | |||
| 3acdb497d1 | |||
| 6c75c5ea34 | |||
| d40bcc617d | |||
| 32519181c8 | |||
| 6eac0a44c4 | |||
| 55e2c99899 | |||
| 199b8f29da | |||
| c02e1a4a99 | |||
| d1def0bcca | |||
| 90ac799d57 | |||
| 7cc733a8df | |||
| a799a506f4 | |||
| d395f6e684 | |||
| 886d555a47 | |||
| 05ab972a1a | |||
| 997b327fcd | |||
| 64f7729b72 | |||
| d54f473670 | |||
| 4f319a2174 | |||
| 0f115df0b6 | |||
| 6d1afd059f | |||
| 78ec7f0f16 | |||
| 5dc9c0f2ae | |||
| 89b6f42e99 | |||
| b2539cb1ea | |||
| beb3a94135 | |||
| f42c96e012 | |||
| 9c6dbea344 | |||
| fa79564802 | |||
| e21dd3649c | |||
| c2f8930e99 | |||
| fb603745dc | |||
| 4faa411ece | |||
| 7ea76951c6 | |||
| 5172875afb | |||
| 0633a93837 | |||
| c548229e73 | |||
| e47850a152 | |||
| ae49f1efc8 | |||
| fc96ef68ac | |||
| b36665ebcd | |||
| 9acacaac37 | |||
| c92991e2fc | |||
| 99373ce4b6 | |||
| 9c6c384704 | |||
| e7fa682976 | |||
| d270a16b32 | |||
| f0d3680fe4 | |||
| ff56061853 | |||
| 0154d04535 | |||
| 22bbd00ac9 | |||
| 04feef9303 | |||
| c7823ceb68 | |||
| 85cf34017a | |||
| a681d172f2 | |||
| 8c52d02c21 | |||
| 7fab906843 | |||
| 90f975c20e | |||
| 247a725cad | |||
| 016e94f889 | |||
| 8524ad9817 | |||
| 01104ef2a4 | |||
| 7199b91f4d | |||
| 623bb75267 | |||
| 83b007504f | |||
| 9576710b2f | |||
| 07d90fb6e0 | |||
| 7d67abdae8 | |||
| c4d07c402d | |||
| c0726d20f0 | |||
| f81b369955 | |||
| 229f5028e1 | |||
| 8494080c90 | |||
| ea792587d5 | |||
| a8e87f80ed | |||
| b1b0ac0377 | |||
| 953ae8abec | |||
| 23c647eecb | |||
| 99c982c103 | |||
| 5ff2b1d061 | |||
| c172ed715b | |||
| fd798f3dac | |||
| 7a0155aa03 | |||
| a73f0ab6f0 | |||
| bdb4456c62 | |||
| 83553b6540 | |||
| 3b48be921e | |||
| 2138d4f2a0 | |||
| 3a32f44f23 | |||
| c74f39318f | |||
| 0aa814fae7 | |||
| 896d0333c7 | |||
| dbd02fb05a | |||
| bafaf49e7e | |||
| 78a74536e5 | |||
| a59822065d | |||
| 6e5407596e | |||
| 2ff8a2bba2 | |||
| 496fa982e0 | |||
| 6f5e49fc16 | |||
| a9352922d9 | |||
| 1faa39db5b | |||
| 143e53febc | |||
| 99a973e529 | |||
| 6bd4651767 | |||
| ece4f7e5e9 | |||
| baeff8030d | |||
| 65687aa3d0 | |||
| f1d957929c | |||
| be63a06f54 | |||
| 7b7452ff9f | |||
| 1e640b9790 | |||
| 22c3f47546 | |||
| e08851a2cc | |||
| e41472f0e5 | |||
| a703294275 | |||
| e0b2e470f4 | |||
| cf52750a57 | |||
| e55e5a7313 | |||
| 9b25484a92 | |||
| c9bba46846 | |||
| d40c33cf65 | |||
| 30949a3c83 | |||
| 5dbb9aabc7 | |||
| 1bf4502766 | |||
| 7c8af82c07 | |||
| a6578d5a5d | |||
| 37c463d37a | |||
| bae6fa1ab4 | |||
| c71203bd56 | |||
| dc9934b765 | |||
| bf804d5571 | |||
| c17d5890d0 | |||
| 5b324c05e1 | |||
| 452f9b3971 | |||
| da4400f437 | |||
| 9555b80cc0 | |||
| f8706bbffe | |||
| 85df20d736 | |||
| cbcff6a168 | |||
| c94ceca337 | |||
| 57c5cefe0f | |||
| 95e87be2d2 | |||
| 4d74fb3b7c | |||
| 80802e68d8 | |||
| ff957fa9f5 | |||
| 610974854c | |||
| 59cdd4edcd | |||
| 32755ca855 | |||
| f3af77e985 | |||
| 8c6138797a | |||
| 8bc5fb055e | |||
| d147b1ae2f | |||
| a3b9b50e8b | |||
| de5acf4fe7 | |||
| 7e0ee0c799 | |||
| 0ba7166636 | |||
| bc723acb06 | |||
| dcc66cb14c | |||
| e1409f8972 | |||
| 264e3aeb38 | |||
| 696097ca38 | |||
| cf2fd9cbe8 | |||
| 93f8737fc7 | |||
| f11c5d3ca9 | |||
| eb3f1aca8a | |||
| 253c510da0 | |||
| 888f04484a | |||
| f1e90d65f2 | |||
| 1bceadf094 | |||
| 2de8ad6f63 | |||
| ad98bebf55 | |||
| e4c9588048 | |||
| 9b52edea07 | |||
| 29297bd37b | |||
| 754f590778 | |||
| b662139708 | |||
| f72a90f4a8 | |||
| ab25a823b7 | |||
| f8385f06d0 | |||
| 6a6b46cbcf | |||
| 3d617476a5 | |||
| 50e7fac830 | |||
| e005f1a505 | |||
| b681af9cf8 | |||
| 34dfaec5ca | |||
| 496c699298 | |||
| c647b436aa | |||
| fa29d9ac86 | |||
| 60f9b505f1 | |||
| 191a9d671d | |||
| 4f18a6bd97 | |||
| 6fffd7e77b | |||
| eda21b7b22 | |||
| dd9f1603a4 | |||
| f5b4980718 | |||
| 4e5a85a24a | |||
| 0373d15c2f | |||
| aa0ea90ee2 | |||
| 7adede7b68 | |||
| 1905e59bdb | |||
| 2f3ef4099e | |||
| 1da6396102 | |||
| 6c9e17dce2 | |||
| 07cda9583f | |||
| c6338728d8 | |||
| f0f7c8917b | |||
| deb28e63d9 | |||
| 2539f81bda | |||
| 13327ce875 | |||
| 0771e86338 | |||
| 9fed9241d0 | |||
| d21df1bc12 | |||
| 6df5d30dff | |||
| 41d4641cea | |||
| b3f6aa0078 | |||
| 964e50a9ee | |||
| a2d4262c56 | |||
| d096a7d33e | |||
| 1636677995 | |||
| 24ff4b1321 | |||
| eadaa2f800 | |||
| f4cba1649d | |||
| c6d3481470 | |||
| 1579e623b0 | |||
| e23cf4a1c0 | |||
| 103adfc1a5 | |||
| b52cf5889e | |||
| 31f76092f8 | |||
| c13b96acbb | |||
| e6478e96de | |||
| 8f6d408802 | |||
| e1d4b2c827 | |||
| 5f2b8fb831 | |||
| 51a22adc6a | |||
| 4cefbf6bac | |||
| b8b23d00de | |||
| c6a855cf74 | |||
| 730b4723b0 | |||
| 701c1d210c | |||
| 3353b75327 | |||
| bce339c405 | |||
| 3865d44b0e | |||
| ba110169f5 | |||
| 0206ba9469 | |||
| 4b960849c7 | |||
| 3e555d77ea | |||
| 9f2b869135 | |||
| 7954af0ba3 | |||
| 042b81e566 | |||
| ecb7fb6b3e | |||
| a84d1f85b8 | |||
| 4c2b129947 | |||
| d38620bc7e | |||
| 6d90be9967 | |||
| 1d79a1fa26 | |||
| 1f3a9f117d | |||
| cb77fb337f | |||
| 6f2597cc8d | |||
| 120790a34a | |||
| ab5f977d62 | |||
| 8671f1ff91 | |||
| 2aaff4bf88 | |||
| dc18f475f8 | |||
| c7d3b9ebf9 | |||
| e284c88afa | |||
| 20e9a9feb5 | |||
| b0f1a8404c | |||
| c74c4e2c3a | |||
| 00a508508e | |||
| 1d6e93d990 | |||
| 56ebe98386 | |||
| 4fe808dcbc | |||
| ef260fca72 | |||
| 803e2da691 | |||
| 1c6bcb0a5e | |||
| b6ea80b67e | |||
| 0364e281d1 | |||
| 9f566c0742 | |||
| 273ec899a5 | |||
| fc97d6ece4 | |||
| 07d03e1a27 | |||
| 2c28d44f92 | |||
| ddb016e5b0 | |||
| f82296b4c1 | |||
| 2effe5a8cc | |||
| e840a27409 | |||
| 67c96304f2 | |||
| aece38716d | |||
| c6e23d772a | |||
| df2fc221e3 | |||
| 54737a8af2 | |||
| 487fdc8511 | |||
| 70fbf7fc8a | |||
| b208d63367 | |||
| 38e19282fd | |||
| 1189bbaa95 | |||
| 0b3e240999 | |||
| e17d1a2d85 | |||
| fd7d53cb5a | |||
| e4eb0d5ffe | |||
| a6f2161ca8 | |||
| 7f8acd2850 | |||
| 6623919429 | |||
| 6ad5e0dada | |||
| 3e7289f244 | |||
| 921b783e40 | |||
| 4c0d74b6c2 | |||
| 0f0fccc312 | |||
| e7c146bc1f | |||
| 675147645c | |||
| 06e3ec9dce | |||
| 77d9d34f91 | |||
| 92855aaf8f | |||
| 68441c7141 | |||
| f267e27e36 | |||
| 428203c466 | |||
| e125ee878e | |||
| 688b5053ee | |||
| 90febd2bcf | |||
| 74f055d125 | |||
| a34259860f | |||
| 21d2b2086f | |||
| d5e52b554c | |||
| f7f7cb475e | |||
| 55d02cf6d8 | |||
| e77dd302e5 | |||
| 53774c2f74 | |||
| b18bc876b0 | |||
| 6bb2a8cdda | |||
| 60a70f94b2 | |||
| 4d7da6cb8a | |||
| be0febaad9 | |||
| 0a8d967a3e | |||
| d8ec3cbc87 | |||
| 9293076b75 | |||
| e07f9172fa | |||
| 76740d93f1 | |||
| ef65237774 | |||
| 409b1936c9 | |||
| b4b4d55767 | |||
| a177931d71 | |||
| 2a8a4342e0 | |||
| 72b9203c8c | |||
| 0fe46d6c89 | |||
| b2ad563545 | |||
| d91afcf987 | |||
| 34b104cfd2 | |||
| 50d1bcb4ce | |||
| 5a697478f9 | |||
| c01676d2bb | |||
| c9d91f1d61 | |||
| caa4740b69 | |||
| 31033659bc | |||
| 2c3f7f7177 | |||
| dfbd21f111 | |||
| fc6d1b1229 | |||
| 54ef0a7758 | |||
| efb357f841 | |||
| a3038226f1 | |||
| a722498191 | |||
| 180c75b3a2 | |||
| 609ecf1f10 | |||
| 8eba022c0c | |||
| fffa9ddcab | |||
| 0edfae58eb | |||
| d71b0858d4 | |||
| 9343610596 | |||
| 5e8b6c8455 | |||
| f18cbffaa5 | |||
| 9d49f1487d | |||
| 8827b4c9cb | |||
| 51181f6a5d | |||
| 5758472d2f | |||
| c9fa0be0e0 | |||
| 94044afe74 | |||
| 448a70d2cc | |||
| 7502785062 | |||
| b98ecb7fbc | |||
| c189332ca3 | |||
| 11a9e88d42 | |||
| 3540fcfee8 | |||
| f82312e5fb | |||
| aa7d5a2839 | |||
| a787b5ca3a | |||
| 290d1c1ba4 | |||
| 048b808153 | |||
| 8bd70b6060 | |||
| 8c73d8f62c | |||
| b0061f0e30 | |||
| 2ee7ae0448 | |||
| 610ad964d0 | |||
| 452669e80a | |||
| cfd6b4d670 | |||
| dd8c2a2140 | |||
| 7d9b0e2629 | |||
| 6658c51474 | |||
| 7839f2e427 | |||
| 4fb7af6b53 | |||
| 937b52d9bf | |||
| b3d16d1437 | |||
| ec07398114 | |||
| 1a6c5ffcb9 | |||
| 980b4738f4 | |||
| 9321a54cee | |||
| 2d2e7117b3 | |||
| 5fc725c088 | |||
| 2ef7617c66 | |||
| c222eb1381 | |||
| dca5644878 | |||
| 1d680a9135 | |||
| a671e6b9d8 | |||
| b52b9a1faf | |||
| 82e2322493 | |||
| eff300cebb | |||
| 9cad8bff38 | |||
| d907f4aac2 | |||
| f8b43676ba | |||
| 7bf9b5936f | |||
| e1995350fe | |||
| 15c360cd26 | |||
| b1da28fe18 | |||
| 00567cff6c | |||
| 79cec32401 | |||
| f96f63acca | |||
| be48f1dd2e | |||
| 3875321d9e | |||
| b01ca8e805 | |||
| 43fc61f74d | |||
| 09ed8b3b6a | |||
| a9567e2574 | |||
| c17df5ab61 | |||
| 352bd386c3 | |||
| 8e50338da3 | |||
| 150a1796b6 | |||
| 4518fb0cef | |||
| 1ed4c36412 | |||
| 0ad74d53f6 | |||
| 1fe7855ec7 | |||
| 83dbc92a59 | |||
| df72cc6eb1 | |||
| 0657d3d118 | |||
| bf16a832ef | |||
| 83ed670dc3 | |||
| 10ec069e71 | |||
| d06badf061 | |||
| 393973775c | |||
| 4df3d84358 | |||
| 5c2a3cbbf8 | |||
| 10c4ef87a3 | |||
| d0b9903395 | |||
| 71a7e5f68a | |||
| 2fe90f9c5c | |||
| 8d09420b6a | |||
| 9943405289 | |||
| 6c44a19fba | |||
| fd1e8e9edf | |||
| cae79a9fe0 | |||
| 7aa70fe7be | |||
| 2aa5a2ee09 | |||
| 72a423237c | |||
| aeecc92194 | |||
| 12816b8409 | |||
| 96a3b03fd7 | |||
| 043203781e | |||
| 5702380c16 | |||
| 4d8316676f | |||
| 4da9ae8d07 | |||
| b0ac995f26 | |||
| 765ef8e93e | |||
| 168ae2cbe8 | |||
| 6932c64a18 | |||
| e4723240b6 | |||
| c714781aef | |||
| 6afb6d8e75 | |||
| ca6a04acfe | |||
| 842d761a37 | |||
| df6d6647f7 | |||
| 20ec85189c | |||
| cc2d1e136c | |||
| c762accb39 | |||
| 2751be7e0f | |||
| 0f45812b71 | |||
| 4fdbf91222 | |||
| 45f519820a | |||
| 5c4c2d30f2 | |||
| a839c89f0b | |||
| 4bc04c2e45 | |||
| 56355e572a | |||
| 32c9ecf242 | |||
| 35eb539d00 | |||
| 62feb5ad5f | |||
| c4fbc914cb | |||
| 1eda892c86 | |||
| 3fb6a14bbd | |||
| 5337efb0e7 | |||
| 05338dc704 | |||
| c3da40b3d8 | |||
| c84f0386bb | |||
| e9e1eeae63 | |||
| 2ecee69838 | |||
| 69088f3c20 | |||
| 4e6c5bc539 | |||
| 43f10ab655 | |||
| 234f7acf84 | |||
| c40cd9b03c | |||
| f5681765fd | |||
| a0f06a5908 | |||
| f67c5d951c | |||
| f5ab5d5c43 | |||
| 8719371e21 | |||
| 372ec827a3 | |||
| b994a177f9 | |||
| 9bea1b768f | |||
| 52975871e1 | |||
| ca9d044ae9 | |||
| 84e1f508e7 | |||
| 79d5694c99 | |||
| fbadb72eb1 | |||
| a4213763be | |||
| cd4f7e1945 | |||
| 58aaa100aa | |||
| 8437f704c7 | |||
| 375a201303 | |||
| ecd8fcc46e | |||
| 304921128c | |||
| 20d5342da2 | |||
| 14e250cdf4 | |||
| 66068858d7 | |||
| 17cec68bbb | |||
| 740fca702c | |||
| c4fb8b6fb4 | |||
| e967754c27 | |||
| 2b59be792d | |||
| c0c6db7071 | |||
| e14909468a | |||
| 865f914dad | |||
| 7631edae24 | |||
| 24bda85d73 | |||
| 528fa52b29 | |||
| c6c63df7fd | |||
| fa9e97bb56 | |||
| 0c2e3f5f5a | |||
| 7106c005ed | |||
| fb446cd059 | |||
| b9af34b33d | |||
| baab54c560 | |||
| 244159d9e9 | |||
| 61aad619a8 | |||
| a2249ddf3e | |||
| 23c219d0ce | |||
| a6b549813e | |||
| 4f34034c51 | |||
| 9b881cdf13 | |||
| 219f83e1f2 | |||
| e6967528cc | |||
| 3c21510d72 | |||
| 24e6e72dc4 | |||
| 34896d1f2c | |||
| 18ef75afbb | |||
| 16d9525fa8 | |||
| 0deba6e673 | |||
| 3708b1b6a5 | |||
| 386161c5b9 | |||
| aa72d9b050 | |||
| c345889535 | |||
| b7e7da427f | |||
| c6153f7556 | |||
| 11a75fe74f | |||
| 8a5f667159 | |||
| a2651b9ab5 | |||
| 1fedf3c1b9 | |||
| 2dc3de9de1 | |||
| d1824d7c28 | |||
| a9c9722647 | |||
| 534fb39e89 | |||
| 35dfa99e59 | |||
| a4986cd5f9 | |||
| 2d8f283680 | |||
| f9c1905840 | |||
| aca861a190 |
@@ -0,0 +1,21 @@
|
||||
/*
|
||||
Bunyip is a tool for multi-browser/device testing
|
||||
https://github.com/ryanseddon/bunyip
|
||||
It uses a few service under the hood including:
|
||||
Browsertack - http://browserstack.com
|
||||
Pagekite https://pagekite.net
|
||||
You'll need accounts at both to use bunyip
|
||||
You'll also need to download and install pagekite.py
|
||||
*/
|
||||
var config = {
|
||||
"browserstack": {
|
||||
"username": "your-browserstack-email@example.com",
|
||||
"password": "your browserstack password",
|
||||
"timeout": 300
|
||||
},
|
||||
"port": 9000,
|
||||
"tunnellink": "your-subdomain.pagekite.me",
|
||||
"tunnel": "pagekite.py <port> your-subdomain.pagekite.me"
|
||||
};
|
||||
|
||||
module.exports = config;
|
||||
@@ -0,0 +1,11 @@
|
||||
# editorconfig.org - unify code style
|
||||
# plugins for text editors: editorconfig.org/#download
|
||||
root = true
|
||||
|
||||
[*]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
+23
-1
@@ -1,5 +1,27 @@
|
||||
.DS_Store
|
||||
dist/*
|
||||
build/files/*
|
||||
docs/api/*
|
||||
dev.html
|
||||
projects
|
||||
.zenflow-log
|
||||
.zenflow-log
|
||||
test/*.map
|
||||
.bunyipconfig.js
|
||||
.s3config.json
|
||||
|
||||
node_modules
|
||||
npm-debug.log
|
||||
|
||||
sandbox/*
|
||||
!sandbox/*.example
|
||||
|
||||
# ignore any Karma conf.js files in the test/ directory
|
||||
test/*.conf.js
|
||||
|
||||
*.swp
|
||||
*.swo
|
||||
|
||||
*.orig
|
||||
|
||||
*results.xml
|
||||
*.log
|
||||
|
||||
+40
@@ -0,0 +1,40 @@
|
||||
{
|
||||
"evil" : true,
|
||||
"validthis": true,
|
||||
"browser" : true,
|
||||
"debug" : true,
|
||||
"boss" : true,
|
||||
"expr" : true,
|
||||
"eqnull" : true,
|
||||
"quotmark" : "single",
|
||||
"sub" : true,
|
||||
"trailing" : true,
|
||||
"undef" : true,
|
||||
"laxbreak" : true,
|
||||
"predef" : [
|
||||
"_V_",
|
||||
"videojs",
|
||||
"vjs",
|
||||
"goog",
|
||||
"console",
|
||||
|
||||
"require",
|
||||
|
||||
"PlayerTest",
|
||||
"asyncTest",
|
||||
"deepEqual",
|
||||
"equal",
|
||||
"expect",
|
||||
"module",
|
||||
"notDeepEqual",
|
||||
"notEqual",
|
||||
"notStrictEqual",
|
||||
"ok",
|
||||
"QUnit",
|
||||
"raises",
|
||||
"start",
|
||||
"stop",
|
||||
"strictEqual",
|
||||
"test"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
language: node_js
|
||||
node_js:
|
||||
- 0.8
|
||||
-10
@@ -1,10 +0,0 @@
|
||||
---
|
||||
confirm_review: true
|
||||
backup_remote: false
|
||||
release_branch: stable
|
||||
project: videojs
|
||||
qa_branch: false
|
||||
staging_branch: false
|
||||
development_branch: master
|
||||
remote: origin
|
||||
confirm_staging: false
|
||||
+126
-8
@@ -1,12 +1,130 @@
|
||||
--------------------------------------------------------------------------------
|
||||
^ ADD NEW CHANGES ABOVE ^
|
||||
--------------------------------------------------------------------------------
|
||||
|
||||
CHANGELOG
|
||||
=========
|
||||
|
||||
---- 3.0.3 / 2012-01-12 / doc-change -------------------------------------------
|
||||
* Added line to docs to test zenflow
|
||||
## Unreleased (HEAD)
|
||||
_(none)_
|
||||
|
||||
---- 3.0.4 / 2012-01-12 / undefined-source-fix ---------------------------------
|
||||
* Fixing an undefined source when no sources exist on load
|
||||
--------------------
|
||||
|
||||
## 4.3.0 (2013-11-04)
|
||||
* Added Karma for cross-browser unit testing ([view](https://github.com/videojs/video.js/pull/714))
|
||||
* Unmuting when the volume is changed ([view](https://github.com/videojs/video.js/pull/720))
|
||||
* Fixed an accessibility issue with the big play button ([view](https://github.com/videojs/video.js/pull/777))
|
||||
* Exported user activity methods ([view](https://github.com/videojs/video.js/pull/783))
|
||||
* Added a classname to center the play button and new spinner options ([view](https://github.com/videojs/video.js/pull/784))
|
||||
* Added API doc generation ([view](https://github.com/videojs/video.js/pull/801))
|
||||
* Added support for codecs in Flash mime types ([view](https://github.com/videojs/video.js/pull/805))
|
||||
|
||||
## 4.2.2 (2013-10-15)
|
||||
* Fixed a race condition that would cause videos to fail in Firefox ([view](https://github.com/videojs/video.js/pull/776))
|
||||
|
||||
## 4.2.1 (2013-09-09)
|
||||
* Fixed an infinite loop caused by loading the library asynchronously ([view](https://github.com/videojs/video.js/pull/727))
|
||||
|
||||
## 4.2.0 (2013-09-04)
|
||||
* Added LESS as a CSS preprocessor for the default skin ([view](https://github.com/videojs/video.js/pull/644))
|
||||
* Exported MenuButtons for use in the API ([view](https://github.com/videojs/video.js/pull/648))
|
||||
* Fixed ability to remove listeners added with one() ([view](https://github.com/videojs/video.js/pull/659))
|
||||
* Updated buffered() to account for multiple loaded ranges ([view](https://github.com/videojs/video.js/pull/643))
|
||||
* Exported createItems() for custom menus ([view](https://github.com/videojs/video.js/pull/654))
|
||||
* Preventing media events from bubbling up the DOM ([view](https://github.com/videojs/video.js/pull/630))
|
||||
* Major reworking of the control bar and many issues fixed ([view](https://github.com/videojs/video.js/pull/672))
|
||||
* Fixed an issue with minifiying the code on Windows systems ([view](https://github.com/videojs/video.js/pull/683))
|
||||
* Added support for RTMP streaming through Flash ([view](https://github.com/videojs/video.js/pull/605))
|
||||
* Made tech.features available to external techs ([view](https://github.com/videojs/video.js/pull/705))
|
||||
* Minor code improvements ([view](https://github.com/videojs/video.js/pull/706))
|
||||
* Updated time formatting to support NaN and Infinity ([view](https://github.com/videojs/video.js/pull/627))
|
||||
* Fixed an `undefined` error in cases where no tech is loaded ([view](https://github.com/videojs/video.js/pull/632))
|
||||
* Exported addClass and removeClass for player components ([view](https://github.com/videojs/video.js/pull/661))
|
||||
* Made the fallback message customizable ([view](https://github.com/videojs/video.js/pull/638))
|
||||
* Fixed an issue with the loading spinner placement and rotation ([view](https://github.com/videojs/video.js/pull/694))
|
||||
* Fixed an issue with fonts being flaky in IE8
|
||||
|
||||
## 4.1.0 (2013-06-28)
|
||||
* Turned on method queuing for unready playback technologies (flash) [view](https://github.com/videojs/video.js/pull/553)
|
||||
* Blocking user text selection on player components [view](https://github.com/videojs/video.js/pull/524)
|
||||
* Exported requestFullScreen() and cancelFullScreen() in the minified version [view](https://github.com/videojs/video.js/pull/555)
|
||||
* Exported the global players reference, videojs.players [view](https://github.com/videojs/video.js/pull/560)
|
||||
* Added google analytics to the CDN version ([view](https://github.com/videojs/video.js/pull/568))
|
||||
* Exported fadeIn/fadeOut for the Component API ([view](https://github.com/videojs/video.js/pull/581))
|
||||
* Fixed an IE poster error when autoplaying ([view](https://github.com/videojs/video.js/pull/593))
|
||||
* Exported bufferedPercent for the API ([view](https://github.com/videojs/video.js/pull/588))
|
||||
* Augmented user agent detection, specifically for Android versions ([view](https://github.com/videojs/video.js/pull/470))
|
||||
* Fixed IE9 canPlayType error ([view](https://github.com/videojs/video.js/pull/606))
|
||||
* Fixed various issues with captions ([view](https://github.com/videojs/video.js/pull/609))
|
||||
|
||||
## 4.0.4 (2013-06-11)
|
||||
* Added google analytics to current CDN version. ([view](https://github.com/videojs/video.js/pull/571))
|
||||
|
||||
## 4.0.3 (2013-05-28)
|
||||
* Fixed an bug with exiting fullscreen. [view](https://github.com/videojs/video.js/pull/546)
|
||||
|
||||
## 4.0.2 (2013-05-23)
|
||||
* Correct version number for CDN swf url. Minify CSS. [view](https://github.com/videojs/video.js/pull/535)
|
||||
|
||||
## 4.0.1 (2013-05-22)
|
||||
* Fixed old IE font loading [view](https://github.com/videojs/video.js/pull/532)
|
||||
|
||||
## 4.0.0 (2013-05-09)
|
||||
* Improved performance through an 18% size reduction using Google Closure Compiler in advanced mode
|
||||
* Greater stability through an automated cross-browser/device test suite using TravisCI, Bunyip, and Browserstack.
|
||||
* New plugin interface and plugin listing for extending Video.js
|
||||
* New default skin design that uses font icons for greater customization
|
||||
* Responsive design and retina display support
|
||||
* Improved accessibility through better ARIA support
|
||||
* Moved to Apache 2.0 license
|
||||
* 100% JavaScript development tool set including Grunt
|
||||
* Updated docs to use Github markdown
|
||||
* Allow disabling of default components
|
||||
* Duration is now setable (need ed for HLS m3u8 files)
|
||||
* Event binders (on/off/one) now return the player instance
|
||||
* Stopped player from going back to beginning on ended event
|
||||
* Added support for percent width/height and fluid layouts
|
||||
* Improved load order of elements to reduce reflow
|
||||
* Changed addEvent function name to 'on'
|
||||
* Removed conflicting array.indexOf function
|
||||
* Added exitFullScreen to support BlackBerry devices (pull/143)
|
||||
|
||||
## 3.2.0 (2012-03-20)
|
||||
* Updated docs with more options.
|
||||
* Overhauled HTML5 Track support.
|
||||
* Fixed Flash always autoplaying when setting source.
|
||||
* Fixed localStorage context
|
||||
* Updated 'fullscreenchange' event to be called even if the user presses escape to exit fullscreen.
|
||||
* Automatically converting URsource URL to absolute for Flash fallback.
|
||||
* Created new 'loadedalldata' event for when the source is completely downloaded
|
||||
* Improved player.destroy(). Now removes elements and references.
|
||||
* Refactored API to be more immediately available.
|
||||
|
||||
### Patches
|
||||
* 3.2.1 (2012-04-06) Fixed setting width/height with javascript options
|
||||
* 3.2.2 (2012-05-02) Fixed error with multiple controls fading listeners
|
||||
* 3.2.3 (2012-11-12) Fixed chrome spinner continuing on seek
|
||||
|
||||
## 3.1.0 (2012-01-30)
|
||||
* Added CSS fix for Firefox 9 fullscreen (in the rare case that it's enabled)
|
||||
* Replaced swfobject with custom embed to save file size.
|
||||
* Added flash iframe-mode, an experimental method for getting around flash reloading issues.
|
||||
* Fixed issue with volume knob position. Improved controls fading.
|
||||
* Fixed ian issue with triggering fullscreen a second time.
|
||||
* Fixed issue with getting attributes in Firefox 3.0
|
||||
* Escaping special characters in source URL for Flash
|
||||
* Added a check for if Firefox is enabled which fixes a Firefox 9 issue
|
||||
* Stopped spinner from showing on 'stalled' events since browsers sometimes don't show that they've recovered.
|
||||
* Fixed CDN Version which was breaking dev.html
|
||||
* Made full-window mode more independent
|
||||
* Added rakefile for release generation
|
||||
|
||||
## 3.0.0 (2012-01-10)
|
||||
* Same HTML/CSS Skin for both HTML5 and Flash video
|
||||
* Super lightweight Flash fallback player for browsers that don’t support HTML5 video
|
||||
* Free CDN hosting
|
||||
|
||||
### Patches
|
||||
* 3.0.2 (2012-01-12) Started tracking changes with zenflow
|
||||
* 3.0.3 (2012-01-12) Added line to docs to test zenflow
|
||||
* 3.0.4 (2012-01-12) Fixing an undefined source when no sources exist on load
|
||||
* 3.0.5 (2012-01-12) Removed deprecated event.layerX and layerY
|
||||
* 3.0.6 (2012-01-12) Fixed wrong URL for CDN in docs
|
||||
* 3.0.7 (2012-01-12) Fixed an ie8 breaking bug with the poster
|
||||
* 3.0.8 (2012-01-23) Fixed issue with controls not hiding in IE due to no opacity support
|
||||
|
||||
@@ -0,0 +1,270 @@
|
||||
CONTRIBUTING
|
||||
============
|
||||
So you want to help out? Great! There's a number of ways you can get involved.
|
||||
|
||||
* [File and discuss issues](#filing-issues)
|
||||
* [Contribute code](#contributing-code)
|
||||
* [Build and share plugins](docs/plugins.md)
|
||||
* [Answer questions on Stack Overflow](http://stackoverflow.com/questions/tagged/video.js)
|
||||
|
||||
There's also other Video.js projects where you can help. (check the [video.js org](https://github.com/videojs) for an up-to-date list of projects)
|
||||
|
||||
* [Videojs.com](https://github.com/videojs/videojs.com)
|
||||
* [Video.js flash player](https://github.com/videojs/video-js-swf)
|
||||
* [Player skin designer](https://github.com/videojs/designer)
|
||||
* [Contribflow](https://github.com/zencoder/contribflow)
|
||||
|
||||
Filing issues
|
||||
-------------
|
||||
[GitHub Issues](https://github.com/videojs/video.js/issues) are used for all discussions around the codebase, including **bugs**, **features**, and other **enhancements**.
|
||||
|
||||
### Reporting a Bug
|
||||
|
||||
**A bug is a demonstrable problem** that is caused by the code in the repository. Good bug reports are extremely helpful. Thank You!
|
||||
|
||||
Guidelines for bug reports:
|
||||
|
||||
1. Use the [GitHub issue search](https://github.com/videojs/video.js/issues) — check if the issue has already been reported.
|
||||
|
||||
2. Check if the issue has already been fixed — try to reproduce it using the latest `master` branch in the repository.
|
||||
|
||||
3. Isolate the problem — **create a [reduced test case](http://css-tricks.com/6263-reduced-test-cases/)** with a live example. You can possibly use [this JSBin example](http://jsbin.com/axedog/7/edit) as a starting point.
|
||||
|
||||
A good bug report should be as detailed as possible, so that others won't have to follow up for the essential details.
|
||||
|
||||
Here's an example:
|
||||
|
||||
> Short yet concise Bug Summary
|
||||
>
|
||||
> Description:
|
||||
> Happens on Windows 7 and OSX. Seen with IE9, Firefox 19 OSX, Chrome 21, Flash 11.6 and 11.2
|
||||
>
|
||||
> 1. This is the first step
|
||||
> 2. This is the second step
|
||||
> 3. Further steps, etc.
|
||||
>
|
||||
> Expected:
|
||||
> (describe the expected outcome of the steps above)
|
||||
>
|
||||
> Actual:
|
||||
> (describe what actually happens)
|
||||
>
|
||||
> `<url>` (a link to the reduced test case, if it exists)
|
||||
>
|
||||
> Any other information you want to share that is relevant to the issue being
|
||||
> reported. This might include the lines of code that you have identified as
|
||||
> causing the bug, and potential solutions (and your opinions on their
|
||||
> merits).
|
||||
|
||||
**[File a bug report](https://github.com/videojs/video.js/issues/new)**
|
||||
|
||||
### Requesting a Feature
|
||||
|
||||
1. [Check the plugin list](https://github.com/videojs/video.js/wiki/Plugins) for any plugins that may already support the feature.
|
||||
|
||||
2. [Search the issues](https://github.com/videojs/video.js/issues) for any previous requests for the same feature, and give a thumbs up or +1 on existing requests.
|
||||
|
||||
2. If no previous requests exist, create a new issue. Please be as clear as possible about why the feautre is needed and the intended use case.
|
||||
|
||||
**[Request a feature](https://github.com/videojs/video.js/issues/new)**
|
||||
|
||||
Contributing code
|
||||
-----------------
|
||||
|
||||
To contibute code you'll need to be able to build a copy of Video.js and run tests locally. There are a few requirements before getting started.
|
||||
|
||||
- Node.js -- Video.js uses Node for build and test automation. Node is available for Windows, Mac OS X, Linux, and SunOS, as well as source code if that doesn't scare you. [Download and install Node.js](http://nodejs.org/download/)
|
||||
|
||||
- grunt-cli -- Install grunt-cli globally so that you will have the correct version of grunt available for any project that needs it.
|
||||
|
||||
On Unix-based systems, you'll have to do this as a superuser:
|
||||
|
||||
```bash
|
||||
sudo npm install -g grunt-cli
|
||||
```
|
||||
On Windows, you can just run:
|
||||
|
||||
```bash
|
||||
npm install -g grunt-cli
|
||||
```
|
||||
|
||||
- Contribflow -- A homegrown git workflow tool for managing feature/hotfix branches and submitting pull requests. If you have your own preferred git workflow, contribflow isn't required, but the following instructions will assume you're using it.
|
||||
|
||||
On Unix-based systems, you'll have to do this as a superuser:
|
||||
|
||||
```bash
|
||||
sudo npm install -g contribflow
|
||||
```
|
||||
|
||||
On Windows, you can just run:
|
||||
|
||||
```bash
|
||||
npm install -g contribflow
|
||||
```
|
||||
|
||||
### Building your own copy of Video.js
|
||||
|
||||
First, [fork](http://help.github.com/fork-a-repo/) the video.js git repository. At the top of every github page, there is a Fork button. Click it, and the forking process will copy Video.js into your own GitHub account.
|
||||
|
||||
Clone your fork of the repo into your code directory
|
||||
|
||||
```bash
|
||||
git clone https://github.com/<your-username>/video.js.git
|
||||
```
|
||||
|
||||
Navigate to the newly cloned directory
|
||||
|
||||
```bash
|
||||
cd video.js
|
||||
```
|
||||
|
||||
Assign the original repo to a remote called "upstream"
|
||||
|
||||
```
|
||||
git remote add upstream https://github.com/videojs/video.js.git
|
||||
```
|
||||
|
||||
>In the future, if you want to pull in updates to video.js that happened after you cloned the main repo, you can run:
|
||||
>
|
||||
> ```bash
|
||||
> git checkout master
|
||||
> git pull upstream master
|
||||
> ```
|
||||
|
||||
Install the required node.js modules using node package manager
|
||||
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
> A note to Windows developers: If you run npm commands, and you find that your command prompt colors have suddenly reversed, you can configure npm to set color to false to prevent this from happening.
|
||||
> `npm config set color false`
|
||||
> Note that this change takes effect when a new command prompt window is opened; the current window will not be affected.
|
||||
|
||||
Build a local copy of video.js and run tests
|
||||
|
||||
```bash
|
||||
grunt
|
||||
grunt test
|
||||
```
|
||||
|
||||
Video.js is also configured to run tests with Karma. Karma is installed as a grunt plugin to run QUnit tests in real browsers, as opposed to simply running the tests in phantomjs, a headless browser.
|
||||
|
||||
To run the QUnit test suite in Karma, do the following:
|
||||
1. Copy test/karma.conf.js.example and rename the copy test/karma.conf.js. Please note that if you decide to name the file something other than karma.conf.js, or if you decide to change the location of your conf.js file from the test/ folder, you will need to change references to karma.conf.js in Gruntfile and .gitignore to your new file name and location, so that you don't inadvertently add your conf.js file to any of your video.js pull requests.
|
||||
2. Open test/karma.conf.js in an editor, and configure the properties in it as desired. At a minimum, you'll want to add the browsers that you want to run your tests in. The karma.conf.js.example file has detailed information on usage in the file itself.
|
||||
After you've configured the desired properties in your karma.conf.js, run:
|
||||
```bash
|
||||
grunt karma:dev
|
||||
```
|
||||
|
||||
At this point you should have a built copy of video.js in a directory named `dist`, and all tests should be passing.
|
||||
|
||||
### Making Changes
|
||||
|
||||
Whether you're adding something new, making something better, or fixing a bug, you'll first want to search the [GitHub issues](https://github.com/videojs/video.js/issues) and [plugins list](https://github.com/videojs/video.js/wiki/Plugins) to make sure you're aware of any previous discussion or work. If an unclaimed issue exists, claim it via a comment. If no issue exists for your change, submit one, follwing the [issue filing guidelines](#filing-issues).
|
||||
|
||||
There are two categories of changes in video.js land, features and hotfixes (Video.js follows a branching model similar to [gitflow](http://nvie.com/posts/a-successful-git-branching-model/)). Hotfixes are for urgent fixes that need to be released immediately as a patch. Features are for everything else (including non-urgent fixes). If you think you have a hotfix scenario, verify that (via comment) before starting the work. We'll focus on features here, but you can swap `hotfix` for `feature` in any command.
|
||||
|
||||
Start a new development branch
|
||||
|
||||
```bash
|
||||
contrib feature start
|
||||
```
|
||||
|
||||
You'll be prompted to name the branch. After that, contrib will create the branch locally, and use git to push it up to your origin, and track it. You're now ready to start building your feature or fixing that bug! Be sure to read the [Code Style Guide](#code-style-guide).
|
||||
|
||||
While you're developing, you can ensure your changes are working by writing tests (in the `test` directory) and running `grunt test`.
|
||||
|
||||
There's also a sandbox directory where you can add any file and it won't get tracked as a change. To start you can copy the example index file and see a working version of a player (using the local source code) by loading it in a browser.
|
||||
|
||||
```bash
|
||||
cp sandbox/index.html.example sandbox/index.html
|
||||
open sandbox/index.html
|
||||
```
|
||||
|
||||
> #### NOTE: Testing Flash Locally in Chrome
|
||||
> Chrome 21+ (as of 2013/01/01) doens't run Flash files that are local and loaded into a locally accessed page (file:///).
|
||||
> To get around this you can do either of the following:
|
||||
>
|
||||
> 1. Do your development and testing using a local HTTP server.
|
||||
>
|
||||
> 2. [Disable the version of Flash included with Chrome](http://helpx.adobe.com/flash-player/kb/flash-player-google-chrome.html#How_can_I_run_debugger_or_alternate_versions_of_Flash_Player_in_Google_Chrome) and enable a system-wide version of Flash instead.
|
||||
|
||||
|
||||
Commit and push changes as you go (using git directly). Write thorough descriptions of your changes in your commit messages.
|
||||
|
||||
```bash
|
||||
git add .
|
||||
git commit -av
|
||||
git push
|
||||
```
|
||||
|
||||
> GitHub allows you to close an issue through your commit message using the [fixes](https://github.com/blog/831-issues-2-0-the-next-generation) keyword.
|
||||
>
|
||||
> ```bash
|
||||
> My commit message. fixes #123
|
||||
> Testing: (briefly describe any testing here, for example, 'unit tests and cross-browser manual tests around playback and network interruption')
|
||||
> ```
|
||||
|
||||
### Submitting your changes
|
||||
|
||||
First, thoroughly test your feature or fix, including writing tests to make sure your change doesn't get regressed in a future update. If you're fixing a bug, we recommend in addition to testing the fix itself, to do some testing around the areas that your fix has touched. For example, a brief smoketest of the player never hurts.
|
||||
|
||||
Make sure your changes are pushed to origin
|
||||
|
||||
```bash
|
||||
git push
|
||||
```
|
||||
|
||||
Use contrib to submit a a pull request (make sure you're in your feature branch)
|
||||
|
||||
```bash
|
||||
contrib feature submit
|
||||
```
|
||||
|
||||
You'll be prompted for title and description for the Pull Request. After that, contrib will use Git to submit your pull request to video.js.
|
||||
|
||||
You're Done! (except for cleanup.) To clean up your feature or hotfix branch:
|
||||
|
||||
First, checkout your feature or issue branch:
|
||||
|
||||
```bash
|
||||
git checkout (branchname)
|
||||
```
|
||||
|
||||
Run this command to clean up your feature:
|
||||
|
||||
```bash
|
||||
contrib feature delete
|
||||
```
|
||||
|
||||
Run this command to clean up your bug fix:
|
||||
|
||||
```bash
|
||||
contrib hotfix delete
|
||||
```
|
||||
> PLEASE NOTE: THIS WILL DELETE YOUR LOCAL AND REMOTE COPIES OF THE FEATURE.
|
||||
> This is meant to clean up your local and remote branches, so make sure any changes you don't want to lose have been pulled into the parent project or another branch first.
|
||||
|
||||
Code Style Guide
|
||||
----------------
|
||||
Please follow [Google's JavaScript Style Guide](http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml) to the letter. If your editor supports [.editorconfig](http://editorconfig.org/#download) it will make it easier to manage differences from your own coding style.
|
||||
|
||||
### Style examples include:
|
||||
* Two space indents.
|
||||
* Delimit strings with single-quotes `'`, not double-quotes `"`.
|
||||
* No trailing whitespace, except in markdown files where a linebreak must be forced.
|
||||
* No more than [one assignment](http://benalman.com/news/2012/05/multiple-var-statements-javascript/) per `var` statement.
|
||||
* Prefer `if` and `else` to ["clever"](http://programmers.stackexchange.com/a/25281) uses of `? :` conditional or `||`, `&&` logical operators.
|
||||
* **When in doubt, follow the conventions you see used in the source already.**
|
||||
|
||||
If you happen to find something in the codebase that does not follow the style guide, that's a good opportunity to make your first contribution!
|
||||
|
||||
---
|
||||
### Doc Credit
|
||||
This doc was inspired by some great contribution guide examples including [contribute.md template](https://github.com/contribute-md/contribute-md-template),
|
||||
[grunt](https://github.com/gruntjs/grunt/wiki/Contributing),
|
||||
[html5 boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/CONTRIBUTING.md),
|
||||
[jquery](https://github.com/jquery/jquery/blob/master/CONTRIBUTING.md),
|
||||
and [node.js](https://github.com/joyent/node/wiki/Contributing).
|
||||
+325
@@ -0,0 +1,325 @@
|
||||
module.exports = function(grunt) {
|
||||
var pkg, s3, semver, version, verParts, uglify;
|
||||
|
||||
semver = require('semver');
|
||||
pkg = grunt.file.readJSON('package.json');
|
||||
uglify = require('uglify-js');
|
||||
|
||||
try {
|
||||
s3 = grunt.file.readJSON('.s3config.json');
|
||||
} catch(e) {
|
||||
s3 = {};
|
||||
}
|
||||
|
||||
verParts = pkg.version.split('.');
|
||||
version = {
|
||||
full: pkg.version,
|
||||
major: verParts[0],
|
||||
minor: verParts[1],
|
||||
patch: verParts[2]
|
||||
};
|
||||
version.majorMinor = version.major + '.' + version.minor;
|
||||
|
||||
// loading predefined source order from source-loader.js
|
||||
// trust me, this is the easist way to do it so far
|
||||
/*jshint undef:false, evil:true */
|
||||
var blockSourceLoading = true;
|
||||
var sourceFiles; // Needed to satisfy jshint
|
||||
eval(grunt.file.read('./build/source-loader.js'));
|
||||
|
||||
// Project configuration.
|
||||
grunt.initConfig({
|
||||
pkg: pkg,
|
||||
|
||||
build: {
|
||||
src: 'src/js/dependencies.js',
|
||||
options: {
|
||||
baseDir: 'src/js/'
|
||||
}
|
||||
},
|
||||
clean: {
|
||||
build: ['build/files/*'],
|
||||
dist: ['dist/*']
|
||||
},
|
||||
jshint: {
|
||||
src: {
|
||||
src: ['src/js/*.js', 'Gruntfile.js', 'test/unit/*.js'],
|
||||
options: {
|
||||
jshintrc: '.jshintrc'
|
||||
}
|
||||
}
|
||||
},
|
||||
minify: {
|
||||
source:{
|
||||
src: ['build/files/combined.video.js', 'build/compiler/goog.base.js', 'src/js/exports.js'],
|
||||
externs: ['src/js/media/flash.externs.js'],
|
||||
dest: 'build/files/minified.video.js'
|
||||
},
|
||||
tests: {
|
||||
src: ['build/files/combined.video.js', 'build/compiler/goog.base.js', 'src/js/exports.js', 'test/unit/*.js', '!test/unit/api.js'],
|
||||
externs: ['src/js/media/flash.externs.js', 'test/qunit/qunit-externs.js'],
|
||||
dest: 'build/files/test.minified.video.js'
|
||||
}
|
||||
},
|
||||
dist: {},
|
||||
qunit: {
|
||||
source: ['test/index.html'],
|
||||
minified: ['test/minified.html'],
|
||||
minified_api: ['test/minified-api.html']
|
||||
},
|
||||
watch: {
|
||||
files: [ 'src/**/*', 'test/unit/*.js', 'Gruntfile.js' ],
|
||||
tasks: 'dev'
|
||||
},
|
||||
copy: {
|
||||
minor: {
|
||||
files: [
|
||||
{expand: true, cwd: 'build/files/', src: ['*'], dest: 'dist/'+version.majorMinor+'/', filter: 'isFile'} // includes files in path
|
||||
]
|
||||
},
|
||||
patch: {
|
||||
files: [
|
||||
{expand: true, cwd: 'build/files/', src: ['*'], dest: 'dist/'+version.full+'/', filter: 'isFile'} // includes files in path
|
||||
]
|
||||
}
|
||||
},
|
||||
s3: {
|
||||
options: s3,
|
||||
minor: {
|
||||
upload: [
|
||||
{
|
||||
src: 'dist/cdn/*',
|
||||
dest: 'vjs/'+version.majorMinor+'/',
|
||||
rel: 'dist/cdn/',
|
||||
headers: {
|
||||
'Cache-Control': 'public, max-age=2628000'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
patch: {
|
||||
upload: [
|
||||
{
|
||||
src: 'dist/cdn/*',
|
||||
dest: 'vjs/'+version.full+'/',
|
||||
rel: 'dist/cdn/',
|
||||
headers: {
|
||||
'Cache-Control': 'public, max-age=31536000'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
cssmin: {
|
||||
minify: {
|
||||
expand: true,
|
||||
cwd: 'build/files/',
|
||||
src: ['video-js.css'],
|
||||
dest: 'build/files/',
|
||||
ext: '.min.css'
|
||||
}
|
||||
},
|
||||
less: {
|
||||
dev: {
|
||||
files: {
|
||||
'build/files/video-js.css': 'src/css/video-js.less'
|
||||
}
|
||||
}
|
||||
},
|
||||
karma: {
|
||||
options: {
|
||||
configFile: 'test/karma.conf.js'
|
||||
},
|
||||
dev: {
|
||||
configFile: 'test/karma.conf.js',
|
||||
autoWatch: true
|
||||
},
|
||||
ci: {
|
||||
configFile: 'test/karma.conf.js',
|
||||
autoWatch: false
|
||||
}
|
||||
},
|
||||
vjsdocs: {
|
||||
all: {
|
||||
src: sourceFiles,
|
||||
dest: 'docs/api',
|
||||
options: {
|
||||
baseURL: 'https://github.com/videojs/video.js/blob/master/'
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
grunt.loadNpmTasks('grunt-contrib-jshint');
|
||||
grunt.loadNpmTasks('grunt-contrib-qunit');
|
||||
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||
grunt.loadNpmTasks('grunt-contrib-clean');
|
||||
grunt.loadNpmTasks('grunt-contrib-copy');
|
||||
grunt.loadNpmTasks('grunt-contrib-cssmin');
|
||||
grunt.loadNpmTasks('grunt-contrib-less');
|
||||
grunt.loadNpmTasks('grunt-s3');
|
||||
grunt.loadNpmTasks('contribflow');
|
||||
grunt.loadNpmTasks('grunt-karma');
|
||||
grunt.loadNpmTasks('videojs-doc-generator');
|
||||
|
||||
// grunt.loadTasks('./docs/tasks/');
|
||||
// grunt.loadTasks('../videojs-doc-generator/tasks/');
|
||||
|
||||
// Default task.
|
||||
grunt.registerTask('default', ['jshint', 'less', 'build', 'minify', 'dist']);
|
||||
// Development watch task
|
||||
grunt.registerTask('dev', ['jshint', 'less', 'build', 'qunit:source']);
|
||||
grunt.registerTask('test', ['jshint', 'less', 'build', 'minify', 'qunit']);
|
||||
|
||||
var fs = require('fs'),
|
||||
gzip = require('zlib').gzip;
|
||||
|
||||
grunt.registerMultiTask('build', 'Building Source', function(){
|
||||
// Fix windows file path delimiter issue
|
||||
var i = sourceFiles.length;
|
||||
while (i--) {
|
||||
sourceFiles[i] = sourceFiles[i].replace(/\\/g, '/');
|
||||
}
|
||||
|
||||
// Create a combined sources file. https://github.com/zencoder/video-js/issues/287
|
||||
var combined = '';
|
||||
sourceFiles.forEach(function(result){
|
||||
combined += grunt.file.read(result);
|
||||
});
|
||||
// Replace CDN version ref in js. Use major/minor version.
|
||||
combined = combined.replace(/GENERATED_CDN_VSN/g, version.majorMinor);
|
||||
grunt.file.write('build/files/combined.video.js', combined);
|
||||
|
||||
// Copy over other files
|
||||
// grunt.file.copy('src/css/video-js.png', 'build/files/video-js.png');
|
||||
grunt.file.copy('src/swf/video-js.swf', 'build/files/video-js.swf');
|
||||
|
||||
// Inject version number into css file
|
||||
var css = grunt.file.read('build/files/video-js.css');
|
||||
css = css.replace(/GENERATED_AT_BUILD/g, version.full);
|
||||
grunt.file.write('build/files/video-js.css', css);
|
||||
|
||||
// Copy over font files
|
||||
grunt.file.recurse('src/css/font', function(absdir, rootdir, subdir, filename) {
|
||||
// Block .DS_Store files
|
||||
if ('filename'.substring(0,1) !== '.') {
|
||||
grunt.file.copy(absdir, 'build/files/font/' + filename);
|
||||
}
|
||||
});
|
||||
|
||||
// Minify CSS
|
||||
grunt.task.run(['cssmin']);
|
||||
});
|
||||
|
||||
grunt.registerMultiTask('minify', 'Minify JS files using Closure Compiler.', function() {
|
||||
var done = this.async();
|
||||
var exec = require('child_process').exec;
|
||||
|
||||
var externs = this.data.externs || [];
|
||||
var dest = this.data.dest;
|
||||
var filePatterns = [];
|
||||
|
||||
// Make sure deeper directories exist for compiler
|
||||
grunt.file.write(dest, '');
|
||||
|
||||
if (this.data.sourcelist) {
|
||||
filePatterns = filePatterns.concat(grunt.file.read(this.data.sourcelist).split(','));
|
||||
}
|
||||
if (this.data.src) {
|
||||
filePatterns = filePatterns.concat(this.data.src);
|
||||
}
|
||||
|
||||
// Build closure compiler shell command
|
||||
var command = 'java -jar build/compiler/compiler.jar'
|
||||
+ ' --compilation_level ADVANCED_OPTIMIZATIONS'
|
||||
// + ' --formatting=pretty_print'
|
||||
+ ' --js_output_file=' + dest
|
||||
+ ' --create_source_map ' + dest + '.map --source_map_format=V3'
|
||||
+ ' --jscomp_warning=checkTypes --warning_level=VERBOSE'
|
||||
+ ' --output_wrapper "/*! Video.js v' + version.full + ' ' + pkg.copyright + ' */ (function() {%output%})();"';
|
||||
//@ sourceMappingURL=video.js.map
|
||||
|
||||
// Add each js file
|
||||
grunt.file.expand(filePatterns).forEach(function(file){
|
||||
command += ' --js='+file;
|
||||
});
|
||||
|
||||
// Add externs
|
||||
externs.forEach(function(extern){
|
||||
command += ' --externs='+extern;
|
||||
});
|
||||
|
||||
// Run command
|
||||
exec(command, { maxBuffer: 500*1024 }, function(err, stdout, stderr){
|
||||
|
||||
if (err) {
|
||||
grunt.warn(err);
|
||||
done(false);
|
||||
}
|
||||
|
||||
if (stdout) {
|
||||
grunt.log.writeln(stdout);
|
||||
}
|
||||
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
grunt.registerTask('dist', 'Creating distribution', function(){
|
||||
var exec = require('child_process').exec;
|
||||
var done = this.async();
|
||||
var css, jsmin, jsdev, cdnjs;
|
||||
|
||||
// Manually copy each source file
|
||||
grunt.file.copy('build/files/minified.video.js', 'dist/video-js/video.js');
|
||||
grunt.file.copy('build/files/combined.video.js', 'dist/video-js/video.dev.js');
|
||||
grunt.file.copy('build/files/video-js.css', 'dist/video-js/video-js.css');
|
||||
grunt.file.copy('build/files/video-js.min.css', 'dist/video-js/video-js.min.css');
|
||||
grunt.file.copy('build/files/video-js.swf', 'dist/video-js/video-js.swf');
|
||||
grunt.file.copy('build/demo-files/demo.html', 'dist/video-js/demo.html');
|
||||
grunt.file.copy('build/demo-files/demo.captions.vtt', 'dist/video-js/demo.captions.vtt');
|
||||
|
||||
// Copy over font files
|
||||
grunt.file.recurse('build/files/font', function(absdir, rootdir, subdir, filename) {
|
||||
// Block .DS_Store files
|
||||
if ('filename'.substring(0,1) !== '.') {
|
||||
grunt.file.copy(absdir, 'dist/video-js/font/' + filename);
|
||||
}
|
||||
});
|
||||
|
||||
// CDN version uses already hosted font files
|
||||
// Minified version only, doesn't need demo files
|
||||
grunt.file.copy('build/files/minified.video.js', 'dist/cdn/video.js');
|
||||
grunt.file.copy('build/files/video-js.min.css', 'dist/cdn/video-js.css');
|
||||
grunt.file.copy('build/files/video-js.swf', 'dist/cdn/video-js.swf');
|
||||
grunt.file.copy('build/demo-files/demo.captions.vtt', 'dist/cdn/demo.captions.vtt');
|
||||
grunt.file.copy('build/demo-files/demo.html', 'dist/cdn/demo.html');
|
||||
|
||||
// Replace font urls with CDN versions
|
||||
css = grunt.file.read('dist/cdn/video-js.css');
|
||||
css = css.replace(/font\//g, '../f/2/');
|
||||
grunt.file.write('dist/cdn/video-js.css', css);
|
||||
|
||||
// Add CDN-specfic JS
|
||||
jsmin = grunt.file.read('dist/cdn/video.js');
|
||||
// GA Tracking Pixel (manually building the pixel URL)
|
||||
cdnjs = uglify.minify('src/js/cdn.js').code.replace('v0.0.0', 'v'+version.full);
|
||||
grunt.file.write('dist/cdn/video.js', jsmin + cdnjs);
|
||||
|
||||
// Zip up into video-js-VERSION.zip
|
||||
exec('cd dist && zip -r video-js-'+version.full+'.zip video-js && cd ..', { maxBuffer: 500*1024 }, function(err, stdout, stderr){
|
||||
|
||||
if (err) {
|
||||
grunt.warn(err);
|
||||
done(false);
|
||||
}
|
||||
|
||||
if (stdout) {
|
||||
grunt.log.writeln(stdout);
|
||||
}
|
||||
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
};
|
||||
@@ -1,165 +0,0 @@
|
||||
GNU LESSER GENERAL PUBLIC LICENSE
|
||||
Version 3, 29 June 2007
|
||||
|
||||
Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
|
||||
Everyone is permitted to copy and distribute verbatim copies
|
||||
of this license document, but changing it is not allowed.
|
||||
|
||||
|
||||
This version of the GNU Lesser General Public License incorporates
|
||||
the terms and conditions of version 3 of the GNU General Public
|
||||
License, supplemented by the additional permissions listed below.
|
||||
|
||||
0. Additional Definitions.
|
||||
|
||||
As used herein, "this License" refers to version 3 of the GNU Lesser
|
||||
General Public License, and the "GNU GPL" refers to version 3 of the GNU
|
||||
General Public License.
|
||||
|
||||
"The Library" refers to a covered work governed by this License,
|
||||
other than an Application or a Combined Work as defined below.
|
||||
|
||||
An "Application" is any work that makes use of an interface provided
|
||||
by the Library, but which is not otherwise based on the Library.
|
||||
Defining a subclass of a class defined by the Library is deemed a mode
|
||||
of using an interface provided by the Library.
|
||||
|
||||
A "Combined Work" is a work produced by combining or linking an
|
||||
Application with the Library. The particular version of the Library
|
||||
with which the Combined Work was made is also called the "Linked
|
||||
Version".
|
||||
|
||||
The "Minimal Corresponding Source" for a Combined Work means the
|
||||
Corresponding Source for the Combined Work, excluding any source code
|
||||
for portions of the Combined Work that, considered in isolation, are
|
||||
based on the Application, and not on the Linked Version.
|
||||
|
||||
The "Corresponding Application Code" for a Combined Work means the
|
||||
object code and/or source code for the Application, including any data
|
||||
and utility programs needed for reproducing the Combined Work from the
|
||||
Application, but excluding the System Libraries of the Combined Work.
|
||||
|
||||
1. Exception to Section 3 of the GNU GPL.
|
||||
|
||||
You may convey a covered work under sections 3 and 4 of this License
|
||||
without being bound by section 3 of the GNU GPL.
|
||||
|
||||
2. Conveying Modified Versions.
|
||||
|
||||
If you modify a copy of the Library, and, in your modifications, a
|
||||
facility refers to a function or data to be supplied by an Application
|
||||
that uses the facility (other than as an argument passed when the
|
||||
facility is invoked), then you may convey a copy of the modified
|
||||
version:
|
||||
|
||||
a) under this License, provided that you make a good faith effort to
|
||||
ensure that, in the event an Application does not supply the
|
||||
function or data, the facility still operates, and performs
|
||||
whatever part of its purpose remains meaningful, or
|
||||
|
||||
b) under the GNU GPL, with none of the additional permissions of
|
||||
this License applicable to that copy.
|
||||
|
||||
3. Object Code Incorporating Material from Library Header Files.
|
||||
|
||||
The object code form of an Application may incorporate material from
|
||||
a header file that is part of the Library. You may convey such object
|
||||
code under terms of your choice, provided that, if the incorporated
|
||||
material is not limited to numerical parameters, data structure
|
||||
layouts and accessors, or small macros, inline functions and templates
|
||||
(ten or fewer lines in length), you do both of the following:
|
||||
|
||||
a) Give prominent notice with each copy of the object code that the
|
||||
Library is used in it and that the Library and its use are
|
||||
covered by this License.
|
||||
|
||||
b) Accompany the object code with a copy of the GNU GPL and this license
|
||||
document.
|
||||
|
||||
4. Combined Works.
|
||||
|
||||
You may convey a Combined Work under terms of your choice that,
|
||||
taken together, effectively do not restrict modification of the
|
||||
portions of the Library contained in the Combined Work and reverse
|
||||
engineering for debugging such modifications, if you also do each of
|
||||
the following:
|
||||
|
||||
a) Give prominent notice with each copy of the Combined Work that
|
||||
the Library is used in it and that the Library and its use are
|
||||
covered by this License.
|
||||
|
||||
b) Accompany the Combined Work with a copy of the GNU GPL and this license
|
||||
document.
|
||||
|
||||
c) For a Combined Work that displays copyright notices during
|
||||
execution, include the copyright notice for the Library among
|
||||
these notices, as well as a reference directing the user to the
|
||||
copies of the GNU GPL and this license document.
|
||||
|
||||
d) Do one of the following:
|
||||
|
||||
0) Convey the Minimal Corresponding Source under the terms of this
|
||||
License, and the Corresponding Application Code in a form
|
||||
suitable for, and under terms that permit, the user to
|
||||
recombine or relink the Application with a modified version of
|
||||
the Linked Version to produce a modified Combined Work, in the
|
||||
manner specified by section 6 of the GNU GPL for conveying
|
||||
Corresponding Source.
|
||||
|
||||
1) Use a suitable shared library mechanism for linking with the
|
||||
Library. A suitable mechanism is one that (a) uses at run time
|
||||
a copy of the Library already present on the user's computer
|
||||
system, and (b) will operate properly with a modified version
|
||||
of the Library that is interface-compatible with the Linked
|
||||
Version.
|
||||
|
||||
e) Provide Installation Information, but only if you would otherwise
|
||||
be required to provide such information under section 6 of the
|
||||
GNU GPL, and only to the extent that such information is
|
||||
necessary to install and execute a modified version of the
|
||||
Combined Work produced by recombining or relinking the
|
||||
Application with a modified version of the Linked Version. (If
|
||||
you use option 4d0, the Installation Information must accompany
|
||||
the Minimal Corresponding Source and Corresponding Application
|
||||
Code. If you use option 4d1, you must provide the Installation
|
||||
Information in the manner specified by section 6 of the GNU GPL
|
||||
for conveying Corresponding Source.)
|
||||
|
||||
5. Combined Libraries.
|
||||
|
||||
You may place library facilities that are a work based on the
|
||||
Library side by side in a single library together with other library
|
||||
facilities that are not Applications and are not covered by this
|
||||
License, and convey such a combined library under terms of your
|
||||
choice, if you do both of the following:
|
||||
|
||||
a) Accompany the combined library with a copy of the same work based
|
||||
on the Library, uncombined with any other library facilities,
|
||||
conveyed under the terms of this License.
|
||||
|
||||
b) Give prominent notice with the combined library that part of it
|
||||
is a work based on the Library, and explaining where to find the
|
||||
accompanying uncombined form of the same work.
|
||||
|
||||
6. Revised Versions of the GNU Lesser General Public License.
|
||||
|
||||
The Free Software Foundation may publish revised and/or new versions
|
||||
of the GNU Lesser General Public License from time to time. Such new
|
||||
versions will be similar in spirit to the present version, but may
|
||||
differ in detail to address new problems or concerns.
|
||||
|
||||
Each version is given a distinguishing version number. If the
|
||||
Library as you received it specifies that a certain numbered version
|
||||
of the GNU Lesser General Public License "or any later version"
|
||||
applies to it, you have the option of following the terms and
|
||||
conditions either of that published version or of any later version
|
||||
published by the Free Software Foundation. If the Library as you
|
||||
received it does not specify a version number of the GNU Lesser
|
||||
General Public License, you may choose any version of the GNU Lesser
|
||||
General Public License ever published by the Free Software Foundation.
|
||||
|
||||
If the Library as you received it specifies that a proxy can decide
|
||||
whether future versions of the GNU Lesser General Public License shall
|
||||
apply, that proxy's public statement of acceptance of any version is
|
||||
permanent authorization for you to choose that version for the
|
||||
Library.
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
Copyright 2013 Brightcove, Inc.
|
||||
|
||||
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.
|
||||
+10
-22
@@ -1,30 +1,18 @@
|
||||
VideoJS - [HTML5 Video Player](http://videojs.com)
|
||||
==================================================
|
||||
Version 3.0 BETA
|
||||
|
||||
Visit the main site at [videojs.com](http://videojs.com) for download options and instructions.
|
||||
# [Video.js - HTML5 Video Player](http://videojs.com) [](https://travis-ci.org/zencoder/video-js)
|
||||
|
||||
To build video-js from the latest version of the source, clone the source repository and run:
|
||||
sh build.sh
|
||||
in the video-js directory using the commnand-line/terminal of a unix-based system.
|
||||
> Video.js is a web video player built from the ground up for an HTML5 world. It supports HTML5 and Flash video, as well as YouTube and Vimeo (through [plugins](https://github.com/videojs/video.js/wiki/Plugins)). It supports video playback on desktops and mobile devices. This project was started mid 2010, and the player is now used on over 50,000 websites.
|
||||
|
||||
Contributing
|
||||
------------
|
||||
If you'd like to help out on VideoJS, you are awesome. Updates should be made to the source files and then make a pull request.
|
||||
Visit [videojs.com](http://videojs.com) for an overview, download options, and instructions on how to use the player on your site.
|
||||
|
||||
When working on VideoJS code, you can use dev.html as your test page. It doesn't exist in the repo and changes to it won't be tracked. To get your own copy simply clone the repo and copy dev.html.example.
|
||||
cp dev.html.example dev.html
|
||||
## Contributing
|
||||
Video.js is a free and open source library, and we appreciate any help you're willing to give. Check out the [contributing guide](CONTRIBUTING.md).
|
||||
|
||||
You can use dev.html to test new code. It's simple HTML doc that includes all the source files. Send a pull request for any updates.
|
||||
## Building your own Video.js from source
|
||||
To build your own custom version read the section on [contributing code](CONTRIBUTING.md#contributing-code) and ["Building your own copy"](CONTRIBUTING.md#building-your-own-copy-of-videojs) in the contributing guide.
|
||||
|
||||
---
|
||||
BETA NOTES
|
||||
Version 3 is almost a complete rewrite of the previous versions of VideoJS. New features includes:
|
||||
## License
|
||||
|
||||
- HTML/CSS Controls and API now work for both the HTML5 and Flash versions.
|
||||
- Custom Super-lightweight Flash Fallback
|
||||
- Embed Code is much simpler.
|
||||
- No more "vjs-box" div required, just use the video tag.
|
||||
- No more embedding of Flash fallback within the video tag HTML.
|
||||
Video.js is licensed under the Apache License, Version 2.0. [View the license file](LICENSE)
|
||||
|
||||
---
|
||||
Copyright 2013 Brightcove, Inc.
|
||||
|
||||
@@ -1,4 +0,0 @@
|
||||
---
|
||||
major: 3
|
||||
patch: 4
|
||||
minor: 0
|
||||
@@ -0,0 +1,37 @@
|
||||
[
|
||||
{
|
||||
"os": "win",
|
||||
"browser": "chrome",
|
||||
"version": "27.0"
|
||||
},
|
||||
{
|
||||
"os": "win",
|
||||
"browser": "firefox",
|
||||
"version": "20.0"
|
||||
},
|
||||
{
|
||||
"os": "win",
|
||||
"browser": "ie",
|
||||
"version": "9.0"
|
||||
},
|
||||
{
|
||||
"os": "win",
|
||||
"browser": "ie",
|
||||
"version": "10.0"
|
||||
},
|
||||
{
|
||||
"os": "ios",
|
||||
"device": "iPhone 5",
|
||||
"version": "6.0"
|
||||
},
|
||||
{
|
||||
"os": "ios",
|
||||
"device": "iPad 3rd (6.0)",
|
||||
"version": "6.0"
|
||||
},
|
||||
{
|
||||
"os": "android",
|
||||
"device": "Samsung Galaxy Tab 2 10.1",
|
||||
"version": "4.0"
|
||||
}
|
||||
]
|
||||
-48
@@ -1,48 +0,0 @@
|
||||
#! /bin/csh
|
||||
# Combines Source Files. In terminal, sh build.sh
|
||||
# It will put a new video.js file under dist/
|
||||
|
||||
# Create dist directory if it doesn't already exist
|
||||
mkdir -p dist
|
||||
|
||||
# FILES=../src/*
|
||||
# for f in $FILES
|
||||
# do
|
||||
# echo "Processing $f file..."
|
||||
# # take action on each file. $f store current file name
|
||||
# cat $f
|
||||
# done
|
||||
|
||||
cat src/_begin.js > dist/video.js
|
||||
|
||||
cat src/core.js >> dist/video.js
|
||||
cat src/lib.js >> dist/video.js
|
||||
cat src/ecma.js >> dist/video.js
|
||||
cat src/json.js >> dist/video.js
|
||||
cat src/events.js >> dist/video.js
|
||||
|
||||
cat src/component.js >> dist/video.js
|
||||
cat src/player.js >> dist/video.js
|
||||
cat src/tech.js >> dist/video.js
|
||||
cat src/controls.js >> dist/video.js
|
||||
|
||||
cat src/tracks.js >> dist/video.js
|
||||
|
||||
# h5swf temporarily requires swfobject
|
||||
cat flash/swfobject.js >> dist/video.js
|
||||
|
||||
cat src/setup.js >> dist/video.js
|
||||
cat src/_end.js >> dist/video.js
|
||||
|
||||
|
||||
# Copy Files
|
||||
cp design/video-js.css dist/video-js.css
|
||||
cp design/video-js.png dist/video-js.png
|
||||
cp flash/video-js.swf dist/video-js.swf
|
||||
|
||||
cp build/release-files/README.md dist/README.md
|
||||
cp build/release-files/demo.html dist/demo.html
|
||||
cp LGPLv3-LICENSE.txt dist/LGPLv3-LICENSE.txt
|
||||
|
||||
java -jar build/lib/yuicompressor-2.4.7.jar dist/video.js -o dist/video.min.js
|
||||
java -jar build/lib/yuicompressor-2.4.7.jar dist/video-js.css -o dist/video-js.min.css
|
||||
@@ -1,28 +0,0 @@
|
||||
Deploying Version
|
||||
-----------------
|
||||
- Update SWF location for CDN
|
||||
|
||||
Version Numbers
|
||||
---------------
|
||||
http://en.wikipedia.org/wiki/Software_versioning#Sequence-based_identifiers
|
||||
|
||||
### Major Version (Integer, e.g 3.0)
|
||||
- Any features where we expect it could break plugins, skins, or any major API integration.
|
||||
|
||||
### Minor Version (3.1)
|
||||
- Additional non-breaking features
|
||||
|
||||
### Revision Versions
|
||||
|
||||
- Beta (3.1b1)
|
||||
- Release Candidate (3.1rc1)
|
||||
- Release with revisions (3.1r1)
|
||||
|
||||
Notes:
|
||||
The last level of one revision type (beta/release candidate) should match the first level of the next revision type. 4.0-b10 should match 4.0-rc1, assuming b10 is the last beta version.
|
||||
|
||||
Release revisions means bug fixes. The CDN url should not reflect the revision number. 4.0-r2 would still be /4.0/.
|
||||
|
||||
Tagging a Release
|
||||
-----------------
|
||||
git tag -a [version number] [commit]
|
||||
@@ -0,0 +1,202 @@
|
||||
|
||||
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
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
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.
|
||||
@@ -0,0 +1,292 @@
|
||||
/*
|
||||
* Copyright 2009 The Closure Compiler Authors.
|
||||
*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
//
|
||||
// Contents
|
||||
//
|
||||
|
||||
The Closure Compiler performs checking, instrumentation, and
|
||||
optimizations on JavaScript code. The purpose of this README is to
|
||||
explain how to build and run the Closure Compiler.
|
||||
|
||||
The Closure Compiler requires Java 6 or higher.
|
||||
http://www.java.com/
|
||||
|
||||
|
||||
//
|
||||
// Building The Closure Compiler
|
||||
//
|
||||
|
||||
There are three ways to get a Closure Compiler executable.
|
||||
|
||||
1) Use one we built for you.
|
||||
|
||||
Pre-built Closure binaries can be found at
|
||||
http://code.google.com/p/closure-compiler/downloads/list
|
||||
|
||||
|
||||
2) Check out the source and build it with Apache Ant.
|
||||
|
||||
First, check out the full source tree of the Closure Compiler. There
|
||||
are instructions on how to do this at the project site.
|
||||
http://code.google.com/p/closure-compiler/source/checkout
|
||||
|
||||
Apache Ant is a cross-platform build tool.
|
||||
http://ant.apache.org/
|
||||
|
||||
At the root of the source tree, there is an Ant file named
|
||||
build.xml. To use it, navigate to the same directory and type the
|
||||
command
|
||||
|
||||
ant jar
|
||||
|
||||
This will produce a jar file called "build/compiler.jar".
|
||||
|
||||
|
||||
3) Check out the source and build it with Eclipse.
|
||||
|
||||
Eclipse is a cross-platform IDE.
|
||||
http://www.eclipse.org/
|
||||
|
||||
Under Eclipse's File menu, click "New > Project ..." and create a
|
||||
"Java Project." You will see an options screen. Give the project a
|
||||
name, select "Create project from existing source," and choose the
|
||||
root of the checked-out source tree as the existing directory. Verify
|
||||
that you are using JRE version 6 or higher.
|
||||
|
||||
Eclipse can use the build.xml file to discover rules. When you
|
||||
navigate to the build.xml file, you will see all the build rules in
|
||||
the "Outline" pane. Run the "jar" rule to build the compiler in
|
||||
build/compiler.jar.
|
||||
|
||||
|
||||
//
|
||||
// Running The Closure Compiler
|
||||
//
|
||||
|
||||
Once you have the jar binary, running the Closure Compiler is straightforward.
|
||||
|
||||
On the command line, type
|
||||
|
||||
java -jar compiler.jar
|
||||
|
||||
This starts the compiler in interactive mode. Type
|
||||
|
||||
var x = 17 + 25;
|
||||
|
||||
then hit "Enter", then hit "Ctrl-Z" (on Windows) or "Ctrl-D" (on Mac or Linux)
|
||||
and "Enter" again. The Compiler will respond:
|
||||
|
||||
var x=42;
|
||||
|
||||
The Closure Compiler has many options for reading input from a file,
|
||||
writing output to a file, checking your code, and running
|
||||
optimizations. To learn more, type
|
||||
|
||||
java -jar compiler.jar --help
|
||||
|
||||
You can read more detailed documentation about the many flags at
|
||||
http://code.google.com/closure/compiler/docs/gettingstarted_app.html
|
||||
|
||||
|
||||
//
|
||||
// Compiling Multiple Scripts
|
||||
//
|
||||
|
||||
If you have multiple scripts, you should compile them all together with
|
||||
one compile command.
|
||||
|
||||
java -jar compiler.jar --js=in1.js --js=in2.js ... --js_output_file=out.js
|
||||
|
||||
The Closure Compiler will concatenate the files in the order they're
|
||||
passed at the command line.
|
||||
|
||||
If you need to compile many, many scripts together, you may start to
|
||||
run into problems with managing dependencies between scripts. You
|
||||
should check out the Closure Library. It contains functions for
|
||||
enforcing dependencies between scripts, and a tool called calcdeps.py
|
||||
that knows how to give scripts to the Closure Compiler in the right
|
||||
order.
|
||||
|
||||
http://code.google.com/p/closure-library/
|
||||
|
||||
//
|
||||
// Licensing
|
||||
//
|
||||
|
||||
Unless otherwise stated, all source files are licensed under
|
||||
the Apache License, Version 2.0.
|
||||
|
||||
|
||||
-----
|
||||
Code under:
|
||||
src/com/google/javascript/rhino
|
||||
test/com/google/javascript/rhino
|
||||
|
||||
URL: http://www.mozilla.org/rhino
|
||||
Version: 1.5R3, with heavy modifications
|
||||
License: Netscape Public License and MPL / GPL dual license
|
||||
|
||||
Description: A partial copy of Mozilla Rhino. Mozilla Rhino is an
|
||||
implementation of JavaScript for the JVM. The JavaScript parser and
|
||||
the parse tree data structures were extracted and modified
|
||||
significantly for use by Google's JavaScript compiler.
|
||||
|
||||
Local Modifications: The packages have been renamespaced. All code not
|
||||
relevant to parsing has been removed. A JsDoc parser and static typing
|
||||
system have been added.
|
||||
|
||||
|
||||
-----
|
||||
Code in:
|
||||
lib/rhino
|
||||
|
||||
Rhino
|
||||
URL: http://www.mozilla.org/rhino
|
||||
Version: Trunk
|
||||
License: Netscape Public License and MPL / GPL dual license
|
||||
|
||||
Description: Mozilla Rhino is an implementation of JavaScript for the JVM.
|
||||
|
||||
Local Modifications: Minor changes to parsing JSDoc that usually get pushed
|
||||
up-stream to Rhino trunk.
|
||||
|
||||
|
||||
-----
|
||||
Code in:
|
||||
lib/args4j.jar
|
||||
|
||||
Args4j
|
||||
URL: https://args4j.dev.java.net/
|
||||
Version: 2.0.16
|
||||
License: MIT
|
||||
|
||||
Description:
|
||||
args4j is a small Java class library that makes it easy to parse command line
|
||||
options/arguments in your CUI application.
|
||||
|
||||
Local Modifications: None.
|
||||
|
||||
|
||||
-----
|
||||
Code in:
|
||||
lib/guava.jar
|
||||
|
||||
Guava Libraries
|
||||
URL: http://code.google.com/p/guava-libraries/
|
||||
Version: 13.0.1
|
||||
License: Apache License 2.0
|
||||
|
||||
Description: Google's core Java libraries.
|
||||
|
||||
Local Modifications: None.
|
||||
|
||||
|
||||
-----
|
||||
Code in:
|
||||
lib/jsr305.jar
|
||||
|
||||
Annotations for software defect detection
|
||||
URL: http://code.google.com/p/jsr-305/
|
||||
Version: svn revision 47
|
||||
License: BSD License
|
||||
|
||||
Description: Annotations for software defect detection.
|
||||
|
||||
Local Modifications: None.
|
||||
|
||||
|
||||
-----
|
||||
Code in:
|
||||
lib/jarjar.jar
|
||||
|
||||
Jar Jar Links
|
||||
URL: http://jarjar.googlecode.com/
|
||||
Version: 1.1
|
||||
License: Apache License 2.0
|
||||
|
||||
Description:
|
||||
A utility for repackaging Java libraries.
|
||||
|
||||
Local Modifications: None.
|
||||
|
||||
|
||||
----
|
||||
Code in:
|
||||
lib/junit.jar
|
||||
|
||||
JUnit
|
||||
URL: http://sourceforge.net/projects/junit/
|
||||
Version: 4.10
|
||||
License: Common Public License 1.0
|
||||
|
||||
Description: A framework for writing and running automated tests in Java.
|
||||
|
||||
Local Modifications: None.
|
||||
|
||||
|
||||
---
|
||||
Code in:
|
||||
lib/protobuf-java.jar
|
||||
|
||||
Protocol Buffers
|
||||
URL: http://code.google.com/p/protobuf/
|
||||
Version: 2.4.1
|
||||
License: New BSD License
|
||||
|
||||
Description: Supporting libraries for protocol buffers,
|
||||
an encoding of structured data.
|
||||
|
||||
Local Modifications: None
|
||||
|
||||
|
||||
---
|
||||
Code in:
|
||||
lib/ant.jar
|
||||
lib/ant-launcher.jar
|
||||
|
||||
URL: http://ant.apache.org/bindownload.cgi
|
||||
Version: 1.8.1
|
||||
License: Apache License 2.0
|
||||
Description:
|
||||
Ant is a Java based build tool. In theory it is kind of like "make"
|
||||
without make's wrinkles and with the full portability of pure java code.
|
||||
|
||||
Local Modifications: None
|
||||
|
||||
|
||||
---
|
||||
Code in:
|
||||
lib/json.jar
|
||||
URL: http://json.org/java/index.html
|
||||
Version: JSON version 20090211
|
||||
License: MIT license
|
||||
Description:
|
||||
JSON is a set of java files for use in transmitting data in JSON format.
|
||||
|
||||
Local Modifications: None
|
||||
|
||||
---
|
||||
Code in:
|
||||
tools/maven-ant-tasks-2.1.3.jar
|
||||
URL: http://maven.apache.org
|
||||
Version 2.1.3
|
||||
License: Apache License 2.0
|
||||
Description:
|
||||
Maven Ant tasks are used to manage dependencies and to install/deploy to
|
||||
maven repositories.
|
||||
|
||||
Local Modifications: None
|
||||
Arquivo binário não exibido.
Diferenças do arquivo suprimidas por serem muito extensas
Carregar Diff
@@ -0,0 +1,41 @@
|
||||
WEBVTT
|
||||
|
||||
00:00.700 --> 00:04.110
|
||||
Captions describe all relevant audio for the hearing impaired.
|
||||
[ Heroic music playing for a seagull ]
|
||||
|
||||
00:04.500 --> 00:05.000
|
||||
[ Splash!!! ]
|
||||
|
||||
00:05.100 --> 00:06.000
|
||||
[ Sploosh!!! ]
|
||||
|
||||
00:08.000 --> 00:09.225
|
||||
[ Splash...splash...splash splash splash ]
|
||||
|
||||
00:10.525 --> 00:11.255
|
||||
[ Splash, Sploosh again ]
|
||||
|
||||
00:13.500 --> 00:14.984
|
||||
Dolphin: eeeEEEEEeeee!
|
||||
|
||||
00:14.984 --> 00:16.984
|
||||
Dolphin: Squawk! eeeEEE?
|
||||
|
||||
00:25.000 --> 00:28.284
|
||||
[ A whole ton of splashes ]
|
||||
|
||||
00:29.500 --> 00:31.000
|
||||
Mine. Mine. Mine.
|
||||
|
||||
00:34.300 --> 00:36.000
|
||||
Shark: Chomp
|
||||
|
||||
00:36.800 --> 00:37.900
|
||||
Shark: CHOMP!!!
|
||||
|
||||
00:37.861 --> 00:41.193
|
||||
EEEEEEOOOOOOOOOOWHALENOISE
|
||||
|
||||
00:42.593 --> 00:45.611
|
||||
[ BIG SPLASH ]
|
||||
@@ -3,11 +3,17 @@
|
||||
<head>
|
||||
<title>Video.js | HTML5 Video Player</title>
|
||||
|
||||
<!-- Chang URLs to wherever Video.js files will be hosted -->
|
||||
<link href="video-js.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<!-- video.js must be in the <head> for older IEs to work. -->
|
||||
<script src="video.js"></script>
|
||||
|
||||
<!-- Unless using the CDN hosted version, update the URL to the Flash SWF -->
|
||||
<script>
|
||||
videojs.options.flash.swf = "video-js.swf";
|
||||
</script>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -17,6 +23,8 @@
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
|
||||
<track kind="captions" src="demo.captions.vtt" srclang="en" label="English"></track><!-- Tracks need an ending tag thanks to IE9 -->
|
||||
<track kind="subtitles" src="demo.captions.vtt" srclang="en" label="English"></track><!-- Tracks need an ending tag thanks to IE9 -->
|
||||
</video>
|
||||
|
||||
</body>
|
||||
Arquivo binário não exibido.
@@ -1,153 +0,0 @@
|
||||
Video.js - [HTML5 Video Player](http://videojs.com)
|
||||
==================================================
|
||||
Version 3.0
|
||||
|
||||
---
|
||||
Version 3 is almost a complete rewrite of the previous versions of Video.js. New features includes:
|
||||
|
||||
- HTML/CSS Controls and API now work for both the HTML5 and Flash versions.
|
||||
- Custom Super-lightweight Flash Fallback
|
||||
- Embed Code is much simpler.
|
||||
- No more "vjs-box" div required, just use the video tag.
|
||||
- No more embedding of Flash fallback within the video tag HTML.
|
||||
|
||||
---
|
||||
|
||||
View [videojs.com](http://videojs.com) for a demo and overview.
|
||||
|
||||
Video.js is an HTML5 video player that uses the HTML5 video tag built into modern browsers, and uses javascript to add custom controls, new functionality, and to fix cross browser bugs. For browsers that don't support HTML5, it will fallback to a Flash player.
|
||||
|
||||
View demo.html for an example of how to use it.
|
||||
|
||||
Originally based on [this tutorial](http://blog.steveheffernan.com/2010/04/how-to-build-an-html5-video-player/).
|
||||
|
||||
Contributors (Github Username)
|
||||
------------------------------
|
||||
heff, dz0ny, sentientbit, tvdeyen, brandonarbini, gordonbrander, Shraymonks, albertogasparin, sandaru1, nicholasbs, majornista, Fredust85, @wonderboymusic, ellis-, emirpprime, eirikb, mbrubeck
|
||||
|
||||
|
||||
Getting Started
|
||||
---------------
|
||||
|
||||
### Step 1: Include the Video.js Javascript and CSS files in the head of your page.
|
||||
Change the file urls to point to the files on your server.
|
||||
|
||||
<script src="video.js"></script>
|
||||
<link href="video-js.css" rel="stylesheet">
|
||||
|
||||
|
||||
### Step 2: Add an HTML5 video tag to your page.
|
||||
Use the video tag as normal, with a few extra pieces for Video.js:
|
||||
|
||||
1. The 'data-setup' attribute tells Video.js to automatically set up the video when the page is ready, and read any options (in JSON format) from the attribute.
|
||||
2. The 'id' Attribute: Should be used and unique for every video on the same page.
|
||||
3. The 'class' attribute contains two classes:
|
||||
- 'video-js' applies styles that are required for Video.js functionality, like fullscreen and subtitles.
|
||||
- 'vjs-default-skin' applies the default skin to the HTML controls, and can be removed or overridden to create your own controls design.
|
||||
|
||||
Otherwise include/exclude attributes, settings, sources, and tracks exactly as you would for HTML5 video.
|
||||
|
||||
<video id="example_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264"
|
||||
poster="http://video-js.zencoder.com/oceans-clip.png"
|
||||
data-setup='{"example_option":true}'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
|
||||
</video>
|
||||
|
||||
|
||||
### Step 3: Nada!
|
||||
That's all it take to get started. See the [docs](http://videojs.com/docs/) for more advanced uses.
|
||||
|
||||
|
||||
Changelog
|
||||
---------
|
||||
3.0
|
||||
|
||||
- Complete rewrite
|
||||
- HTML/CSS Controls and API now work for both the HTML5 and Flash versions
|
||||
- Custom Super-lightweight Flash Fallback
|
||||
- Embed Code is much simpler.
|
||||
- No more "vjs-box" div required, just use the video tag.
|
||||
- No more embedding of Flash fallback within the video tag HTML.
|
||||
|
||||
2.0.3
|
||||
|
||||
- Feature: Made returning to the start at the end of the movie an option ("returnToStart").
|
||||
- Feature: Added loop option to loop movie ("loop").
|
||||
- Feature: Reorganized player API and listeners.
|
||||
- Feature: Added option to disable controls. controlsEnabled: false
|
||||
- Feature: Setup method now has a callback, so you can more easily work with the player after setup
|
||||
- Feature: Added listeners for enter/exit full screen/window.
|
||||
- Feature: Added a VideoJS.player(id) function for getting the player for a video ID
|
||||
- Changes: setupAllWhenReady is now just setupAll (backward compatible)
|
||||
- Fix: Check for Android browser now excludes firefox and opera
|
||||
|
||||
2.0.2 (2010-12-10)
|
||||
|
||||
- Feature: Rewrote and optimized subtitle code.
|
||||
- Feature: Protecting against volume ranges outside of 1 and 0.
|
||||
- Fix: Bug in Safari for Mac OS 10.5 (Leopard) that was breaking fullscreen.
|
||||
|
||||
2.0.1 (2010-11-22)
|
||||
|
||||
- Fix: Issue with big play button when multiple videos are on the page.
|
||||
- Fix: Optimized play progress tracking.
|
||||
- Fix: Optimized buffer progress checking.
|
||||
- Fix: Firefox not showing Flash fallback object.
|
||||
|
||||
2.0.0 (2010-11-21)
|
||||
|
||||
- Feature: Created "behaviors" concept for adding behaviors to elements
|
||||
- Feature: Switched back to divs for controls, for more portable styles
|
||||
- Feature: Created playerFallbackOrder array option. ["html5", "flash", "links"]
|
||||
- Feature: Created playerType concept, for initializing different platforms
|
||||
- Feature: Added play button for Android
|
||||
- Feature: Added spinner for iPad (non-fullscreen)
|
||||
- Feature: Split into multiple files for easier development
|
||||
- Feature: Combined VideoJS & _V_ into the same variable to reduce confusion
|
||||
- Fix: Checking for m3u8 files (Apple HTTP Streaming)
|
||||
- Fix: Catching error on localStorage full that safari seems to randomly throw
|
||||
- Fix: Scrubbing to end doesn't trigger onEnded
|
||||
|
||||
1.1.5 (2010-11-09)
|
||||
|
||||
- Feature: Switched to track method for setting subtitles. Now works like spec.
|
||||
- Feature: Created "players" concept for defining fallbacks and fallback order
|
||||
- Fix: Android playback bug.
|
||||
- Fix: Massive reorganization of code to make easier to navigate
|
||||
|
||||
1.1.4 (2010-11-06)
|
||||
|
||||
- Feature: Added loading spinner.
|
||||
- Feature: Improved styles loaded checking.
|
||||
- Feature: Added volume() function to get and set volume through the player.
|
||||
- Fix: Fix issue where FF would loop video in background when ended.
|
||||
- Fix: Bug in Chrome that shows poster & plays audio if you set currentTime too quickly.
|
||||
- Fix: Bug in Safari where waiting is triggered and shows spinner when not needed
|
||||
- Fix: Updated to show links if only unplayable sources and no Flash.
|
||||
- Fix: Issue where if play button was loaded after play, it wouldn't hide.
|
||||
|
||||
1.1.3 (2010-10-19)
|
||||
|
||||
- Feature: Width/Height functions for resizing the player
|
||||
- Feature: Made initial click & hold trigger new value on progress and volume
|
||||
- Feature: Made controls not hide when hovering over them
|
||||
- Feature: Added big play button as default starting control.
|
||||
- Fix: Removed trailing comma that was breaking IE7
|
||||
- Fix: Removed some vars from global scope
|
||||
- Fix: Changed a document.onmousemove to an eventListener to prevent conflicts
|
||||
- Fix: Added a unique ID to FlowPlayer demo object to fix a FlowPlayer bug. Thanks @emirpprime.
|
||||
- Fix: Safari error on unloaded video
|
||||
|
||||
1.1.2 (2010-09-20)
|
||||
|
||||
- Added a fix for the poster bug in iPad/iPhone
|
||||
- Added more specificity to styles
|
||||
|
||||
1.1.1 (2010-09-14)
|
||||
|
||||
- First Formally Versioned Release
|
||||
|
||||
1.0.0 (2010-05-18)
|
||||
|
||||
- First released
|
||||
@@ -0,0 +1,72 @@
|
||||
// This file is used to load the video.js source files into a page
|
||||
// in the correct order based on dependencies.
|
||||
// When you create a new source file you will need to add
|
||||
// it to the list below to use it in sandbox/index.html and
|
||||
// test/index.html
|
||||
|
||||
// You can use the projectRoot variable to adjust relative urls
|
||||
// that this script loads. By default it's "../", which is what /sandbox
|
||||
// and /test need. If you had sandbox/newDir/index.html, in index.html you
|
||||
// would set projectRoot = "../../"
|
||||
|
||||
// We could use somehting like requireJS to load files, and at one point
|
||||
// we used goog.require/provide to load dependencies, but that seems like
|
||||
// overkill with the small number of files we actually have.
|
||||
|
||||
// ADD NEW SOURCE FILES HERE
|
||||
var sourceFiles = [
|
||||
"src/js/core.js",
|
||||
"src/js/core-object.js",
|
||||
"src/js/events.js",
|
||||
"src/js/lib.js",
|
||||
"src/js/component.js",
|
||||
"src/js/button.js",
|
||||
"src/js/slider.js",
|
||||
"src/js/menu.js",
|
||||
"src/js/player.js",
|
||||
"src/js/control-bar/control-bar.js",
|
||||
"src/js/control-bar/play-toggle.js",
|
||||
"src/js/control-bar/time-display.js",
|
||||
"src/js/control-bar/fullscreen-toggle.js",
|
||||
"src/js/control-bar/progress-control.js",
|
||||
"src/js/control-bar/volume-control.js",
|
||||
"src/js/control-bar/mute-toggle.js",
|
||||
"src/js/control-bar/volume-menu-button.js",
|
||||
"src/js/poster.js",
|
||||
"src/js/loading-spinner.js",
|
||||
"src/js/big-play-button.js",
|
||||
"src/js/media/media.js",
|
||||
"src/js/media/html5.js",
|
||||
"src/js/media/flash.js",
|
||||
"src/js/media/loader.js",
|
||||
"src/js/tracks.js",
|
||||
"src/js/json.js",
|
||||
"src/js/setup.js",
|
||||
"src/js/plugins.js"
|
||||
];
|
||||
|
||||
// Allow overriding the default project root
|
||||
var projectRoot = projectRoot || '../';
|
||||
|
||||
function loadScripts(scriptsArr){
|
||||
for (var i = 0; i < scriptsArr.length; i++) {
|
||||
// Using document.write because that's the easiest way to avoid triggering
|
||||
// asynchrnous script loading
|
||||
document.write( "<script src='" + projectRoot + scriptsArr[i] + "'><\/script>" );
|
||||
}
|
||||
}
|
||||
|
||||
// We use this file in the grunt build script to load the same source file list
|
||||
// and don't want to load the scripts there.
|
||||
if (typeof blockSourceLoading === 'undefined') {
|
||||
loadScripts(sourceFiles);
|
||||
|
||||
// Allow for making Flash first
|
||||
if (window.location.href.indexOf("?flash") !== -1) {
|
||||
// Using doc.write to load this script to, otherwise when it runs videojs
|
||||
// is undefined
|
||||
document.write('<script>videojs.options.techOrder = ["flash"];videojs.options.flash.swf = "../src/swf/video-js.swf";</script>')
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +0,0 @@
|
||||
body { background-color: #ccc; font-size: 11px; font-family: 'Helvetica Neue', helvetica, arial; }
|
||||
#main { width: 1000px; margin: 10px auto 0; }
|
||||
td, th { text-align: left; vertical-align: top; }
|
||||
td.info-col { width: 240px; }
|
||||
td.data { text-align: right; }
|
||||
span.na { color: red; }
|
||||
span.undefined { color: #999; }
|
||||
@@ -1,75 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>HTML5 Video Player</title>
|
||||
|
||||
<link rel="stylesheet" href="../design/video-js.css" type="text/css">
|
||||
<!--[if lt IE 9]>
|
||||
<script>
|
||||
document.createElement("video"); // HTML5 Shiv. Must be in <head>.
|
||||
</script>
|
||||
<![endif]-->
|
||||
|
||||
<!--[if IE]>
|
||||
<script src="https://getfirebug.com/firebug-lite.js" type="text/javascript" charset="utf-8"></script>
|
||||
<![endif]-->
|
||||
|
||||
|
||||
<script src="../src/core.js"></script>
|
||||
<script src="../src/lib.js"></script>
|
||||
<script src="../src/ecma.js"></script>
|
||||
<script src="../src/json.js"></script>
|
||||
|
||||
<script src="../src/component.js"></script>
|
||||
<script src="../src/player.js"></script>
|
||||
<script src="../src/tech.js"></script>
|
||||
<script src="../src/controls.js"></script>
|
||||
<script src="../src/events.js"></script>
|
||||
<script src="../src/tracks.js"></script>
|
||||
|
||||
<script src="../flash/swfobject.js"></script>
|
||||
|
||||
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="compare.css" type="text/css">
|
||||
<script type="text/javascript" src="compare.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="main">
|
||||
<table border="0" cellspacing="5" cellpadding="5">
|
||||
<tr><th colspan="2">HTML5</th><th colspan="2">Flash</th></tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<video id="vid1" class="video-js vjs-default-skin" controls preload="auto" width="480" height="198"
|
||||
poster="http://video-js.zencoder.com/oceans-clip.png">
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
|
||||
</video>
|
||||
</td>
|
||||
<td colspan="2">
|
||||
<video id="vid2" class="video-js vjs-default-skin" controls preload="auto" width="480" height="198"
|
||||
poster="http://video-js.zencoder.com/oceans-clip.png">
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
|
||||
<!-- <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'> -->
|
||||
</video>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="info-col">
|
||||
<table id="html5_props" border="0" cellspacing="0" cellpadding="0"></table>
|
||||
</td>
|
||||
<td class="info-col">
|
||||
<div id="html5_events"></div>
|
||||
</td>
|
||||
<td class="info-col">
|
||||
<table id="flash_props" border="0" cellspacing="0" cellpadding="0"></table>
|
||||
</td>
|
||||
<td class="info-col">
|
||||
<div id="flash_events"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,70 +0,0 @@
|
||||
_V_.options.flash.swf = "../flash/video-js.swf";
|
||||
_V_.options.flash.swf = "http://andylemay.com/dev/videojs/VideoJS.swf";
|
||||
|
||||
$(function(){
|
||||
var tech, i, tname, player,
|
||||
techList = ["html5","flash"],
|
||||
props = "error,currentSrc,networkState,buffered,readyState,seeking,initialTime,duration,startOffsetTime,paused,played,seekable,ended,videoWidth,videoHeight,textTracks,preload,currentTime,defaultPlaybackRate,playbackRate,autoplay,loop,controls,volume,muted,defaultMuted,poster".split(","),
|
||||
methods = "play,pause,src,load,canPlayType,addTextTrack",
|
||||
notUsed = "mediaGroup,controller,videoTracks,audioTracks,defaultPlaybackRate";
|
||||
|
||||
for (i=0; i < techList.length; i++) {
|
||||
tech = techList[i];
|
||||
tname = tech.toLowerCase();
|
||||
|
||||
player = _V_("vid"+(i+1), { "techOrder":[tech] });
|
||||
|
||||
_V_.each(_V_.html5.events, function(evt){
|
||||
|
||||
player.addEvent(evt, _V_.proxy(tname, function(evt){
|
||||
var eventsId = "#"+this+"_events",
|
||||
type = evt.type,
|
||||
prev = $(eventsId+" div").first();
|
||||
|
||||
if (prev && prev.html() && prev.html().indexOf(type + " ") === 0) {
|
||||
var countSpan = prev.children(".count");
|
||||
countSpan.html(parseInt(countSpan.html() || 1) + 1);
|
||||
} else {
|
||||
$("#"+this+"_events").prepend("<div>" + evt.type + " <span class='count'></span></div>");
|
||||
}
|
||||
}));
|
||||
});
|
||||
|
||||
var propTable = $("#"+tname+"_props");
|
||||
_V_.each(props, function(prop){
|
||||
propTable.append("<tr><th>"+prop+"</th><td id='"+tname+prop+"' class='data'></td></tr>")
|
||||
});
|
||||
|
||||
setInterval(_V_.proxy(player, function(){
|
||||
_V_.each(props, _V_.proxy(this, function(prop){
|
||||
var result = ""
|
||||
try {
|
||||
result = this[prop]();
|
||||
if (result === false) result = "false";
|
||||
if (result === true) result = "true";
|
||||
if (result === "") result = "''";
|
||||
if (result === null) result = "<span class='undefined'>null</span>";
|
||||
if (result === undefined) result = "<span class='undefined'>undefined</span>";
|
||||
if (typeof result.start == "function") {
|
||||
var newResult = "", i;
|
||||
if (result.length > 0) {
|
||||
|
||||
for (i=0;i<result.length;i++) {
|
||||
newResult += "l:"+result.length+" s:"+result.start(i)+" e:"+result.end(i);
|
||||
}
|
||||
} else {
|
||||
newResult = "-";
|
||||
}
|
||||
result = newResult;
|
||||
// result = result.toString();
|
||||
// result = (result.length > 0) ? "s:"+result.start(0)+" e:"+result.end(0) : "-";
|
||||
}
|
||||
} catch(e) {
|
||||
result = "<span class='na'>N/A</span>";
|
||||
}
|
||||
$("#"+this.techName+prop).html(result);
|
||||
}));
|
||||
}), 500);
|
||||
|
||||
};
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"owner": "videojs",
|
||||
"project": "video.js",
|
||||
"developmentBranch": "master",
|
||||
"releaseBranch": "stable",
|
||||
"remote": "origin"
|
||||
}
|
||||
@@ -1,8 +0,0 @@
|
||||
Tracking/Polling CurrentTime Manually
|
||||
-------------------------------------
|
||||
- Necessary for most flash players and browsers that don't trigger timeupdate events.
|
||||
- In VJS 1-2, we always tracked time because timeupdate was rare.
|
||||
- Now most browsers support it well. There is a delay bug in the current Chrome.
|
||||
http://code.google.com/p/chromium/issues/detail?id=92251
|
||||
Andrew from Chrome told me it would be fix in an upcoming release.
|
||||
Going to rely on browsers timeupdates when available now.
|
||||
@@ -1,13 +0,0 @@
|
||||
1
|
||||
00:00:00,000 --> 00:00:07,200
|
||||
[Background Music Playing]
|
||||
|
||||
2
|
||||
00:00:16,000 --> 00:00:17,200
|
||||
Welcome to this week's episode
|
||||
|
||||
3
|
||||
00:00:17,400 --> 00:00:19,000
|
||||
of explore California
|
||||
|
||||
|
||||
Arquivo binário não exibido.
|
Antes Largura: | Altura: | Tamanho: 85 KiB |
Arquivo binário não exibido.
|
Antes Largura: | Altura: | Tamanho: 3.5 KiB |
@@ -1,190 +0,0 @@
|
||||
/* DEFAULT SKIN (override in another file)
|
||||
================================================================================
|
||||
Using all CSS to draw the controls. Images could be used if desired.
|
||||
Instead of editing this file, I recommend creating your own skin CSS file to be included after this file,
|
||||
so you can upgrade to newer versions easier. */
|
||||
|
||||
.vjs-original-skin .vjs-controls {
|
||||
position: absolute; margin: 0; opacity: 0.85; color: #fff;
|
||||
display: block; /* Start hidden */
|
||||
left: 0; right: 0; /* 100% width of video-js-box */
|
||||
width: 100%;
|
||||
bottom: 0px; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */
|
||||
height: 35px; /* Including any margin you want above or below control items */
|
||||
padding: 0; /* Controls are absolutely position, so no padding necessary */
|
||||
-webkit-transition: opacity 0.5s linear;
|
||||
-moz-transition: opacity 0.5s linear;
|
||||
-o-transition: opacity 0.5s linear;
|
||||
-ms-transition: opacity 0.5s linear;
|
||||
transition: opacity 0.5s linear;
|
||||
}
|
||||
|
||||
.vjs-original-skin .vjs-control {
|
||||
position: absolute; /* Use top, bottom, left, and right to specifically position the control. */
|
||||
text-align: center; margin: 0; padding: 0;
|
||||
height: 25px; /* Default height of individual controls */
|
||||
top: 5px; /* Top margin to put space between video and controls when controls are below */
|
||||
|
||||
/* CSS Background Gradients
|
||||
Using to give the aqua-ish look. */
|
||||
/* Default */ background-color: #0B151A;
|
||||
/* Webkit */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 12px;
|
||||
/* Firefox */ background: #1F3744 -moz-linear-gradient(top, #0B151A, #1F3744) left 12px;
|
||||
|
||||
/* CSS Curved Corners */
|
||||
-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
|
||||
|
||||
/* CSS Shadows */
|
||||
-webkit-box-shadow: 1px 1px 2px #000; -moz-box-shadow: 1px 1px 2px #000; box-shadow: 1px 1px 2px #000;
|
||||
}
|
||||
|
||||
/* Placement of Control Items
|
||||
- Left side of pogress bar, use left & width
|
||||
- Rigth side of progress bar, use right & width
|
||||
- Expand with the video (like progress bar) use left & right
|
||||
(using div.x to make more specific than vjs-control style)
|
||||
*/
|
||||
.vjs-original-skin div.vjs-play-control { left: 5px; width: 25px; }
|
||||
.vjs-original-skin div.vjs-progress-control { left: 35px; right: 165px; } /* Using left & right so it expands with the width of the video */
|
||||
.vjs-original-skin div.vjs-time-control { width: 75px; right: 90px; } /* Time control and progress bar are combined to look like one */
|
||||
.vjs-original-skin div.vjs-volume-control { width: 50px; right: 35px; }
|
||||
.vjs-original-skin div.vjs-fullscreen-control { width: 25px; right: 5px; }
|
||||
|
||||
/* Removing curved corners on progress control and time control to join them. */
|
||||
.vjs-original-skin div.vjs-progress-control {
|
||||
-webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; border-top-right-radius: 0;
|
||||
-webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0; border-bottom-right-radius: 0;
|
||||
}
|
||||
.vjs-original-skin div.vjs-time-control {
|
||||
-webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; border-top-left-radius: 0;
|
||||
-webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
/* Play/Pause
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-original-skin .vjs-play-control { cursor: pointer !important; }
|
||||
/* Play Icon */
|
||||
.vjs-original-skin .vjs-play-control span { display: block; font-size: 0; line-height: 0; }
|
||||
.vjs-original-skin.vjs-paused .vjs-play-control span {
|
||||
width: 0; height: 0; margin: 8px 0 0 8px;
|
||||
/* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
|
||||
border-left: 10px solid #fff; /* Width & Color of play icon */
|
||||
/* Height of play icon is total top & bottom border widths. Color is transparent. */
|
||||
border-top: 5px solid rgba(0,0,0,0); border-bottom: 5px solid rgba(0,0,0,0);
|
||||
}
|
||||
.vjs-original-skin.vjs-playing .vjs-play-control span {
|
||||
width: 3px; height: 10px; margin: 8px auto 0;
|
||||
/* Drawing the pause bars with borders */
|
||||
border-top: 0px; border-left: 3px solid #fff; border-bottom: 0px; border-right: 3px solid #fff;
|
||||
}
|
||||
|
||||
/* Progress
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-original-skin .vjs-progress-holder { /* Box containing play and load progresses */
|
||||
position: relative; padding: 0; overflow:hidden; cursor: pointer !important;
|
||||
height: 9px; border: 1px solid #777;
|
||||
margin: 7px 1px 0 5px; /* Placement within the progress control item */
|
||||
-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
|
||||
}
|
||||
.vjs-original-skin .vjs-progress-holder div { /* Progress Bars */
|
||||
position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0;
|
||||
left: 0; top: 0; /*Needed for IE6*/
|
||||
-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
|
||||
}
|
||||
.vjs-original-skin .vjs-play-progress {
|
||||
/* CSS Gradient */
|
||||
/* Default */ background: #fff;
|
||||
/* Webkit */ background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#777));
|
||||
/* Firefox */ background: -moz-linear-gradient(top, #fff, #777);
|
||||
}
|
||||
.vjs-original-skin .vjs-load-progress {
|
||||
opacity: 0.8;
|
||||
/* CSS Gradient */
|
||||
/* Default */ background-color: #555;
|
||||
/* Webkit */ background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#aaa));
|
||||
/* Firefox */ background: -moz-linear-gradient(top, #555, #aaa);
|
||||
}
|
||||
|
||||
/* Time Display
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-original-skin .vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
|
||||
.vjs-original-skin .vjs-time-control span { line-height: 25px; /* Centering vertically */ }
|
||||
|
||||
/* Volume
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-original-skin .vjs-volume-control { cursor: pointer !important; }
|
||||
.vjs-original-skin .vjs-volume-control div { display: block; margin: 0 5px 0 5px; padding: 4px 0 0 0; }
|
||||
/* Drawing the volume icon using 6 span elements */
|
||||
.vjs-original-skin .vjs-volume-control div span { /* Individual volume bars */
|
||||
float: left; padding: 0; font-size: 0; line-height: 0;
|
||||
margin: 0 2px 0 0; /* Space between */
|
||||
width: 5px; height: 0px; /* Total height is height + bottom border */
|
||||
border-bottom: 18px solid #555; /* Default (off) color and height of visible portion */
|
||||
}
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-volume-level-on { border-color: #fff; /* Volume on bar color */ }
|
||||
/* Creating differnt bar heights through height (transparent) and bottom border (visible). */
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-vc-1 { border-bottom-width: 2px; height: 16px; }
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-vc-2 { border-bottom-width: 4px; height: 14px; }
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-vc-3 { border-bottom-width: 7px; height: 11px; }
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-vc-4 { border-bottom-width: 10px; height: 8px; }
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-vc-5 { border-bottom-width: 14px; height: 4px; }
|
||||
.vjs-original-skin .vjs-volume-control div span.vjs-vc-6 { margin-right: 0; }
|
||||
|
||||
/* Fullscreen
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-original-skin .vjs-fullscreen-control { cursor: pointer !important; }
|
||||
.vjs-original-skin .vjs-fullscreen-control div {
|
||||
padding: 0; text-align: left; vertical-align: top; cursor: pointer !important;
|
||||
margin: 5px 0 0 5px; /* Placement within the fullscreen control item */
|
||||
width: 20px; height: 20px;
|
||||
}
|
||||
/* Drawing the fullscreen icon using 4 span elements */
|
||||
.vjs-original-skin .vjs-fullscreen-control div span { float: left; margin: 0; padding: 0; font-size: 0; line-height: 0; width: 0; text-align: left; vertical-align: top; }
|
||||
.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-1 { /* Top-left triangle */
|
||||
margin-right: 3px; /* Space between top-left and top-right */
|
||||
margin-bottom: 3px; /* Space between top-left and bottom-left */
|
||||
border-top: 6px solid #fff; /* Height and color */
|
||||
border-right: 6px solid rgba(0,0,0,0); /* Width */
|
||||
}
|
||||
.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-2 { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
|
||||
.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-3 { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
|
||||
.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-4 { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
|
||||
/* Icon when video is in fullscreen mode */
|
||||
.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-1 { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
|
||||
.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-2 { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
|
||||
.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-3 { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
|
||||
.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-4 { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* Big Play Button (at start)
|
||||
---------------------------------------------------------*/
|
||||
.vjs-original-skin .vjs-big-play-button {
|
||||
display: block; /* Start hidden */ z-index: 2;
|
||||
position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin: -43px 0 0 -43px; text-align: center; vertical-align: center; cursor: pointer !important;
|
||||
border: 3px solid #fff; opacity: 0.9;
|
||||
-webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;
|
||||
|
||||
/* CSS Background Gradients */
|
||||
/* Default */ background-color: #0B151A;
|
||||
/* Webkit */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 40px;
|
||||
/* Firefox */ background: #1F3744 -moz-linear-gradient(top, #0B151A, #1F3744) left 40px;
|
||||
|
||||
/* CSS Shadows */
|
||||
-webkit-box-shadow: 4px 4px 8px #000; -moz-box-shadow: 4px 4px 8px #000; box-shadow: 4px 4px 8px #000;
|
||||
}
|
||||
|
||||
.vjs-original-skin div.vjs-big-play-button:hover {
|
||||
-webkit-box-shadow: 0px 0px 80px #fff; -moz-box-shadow: 0px 0px 80px #fff; box-shadow: 0px 0px 80px #fff;
|
||||
}
|
||||
|
||||
.vjs-original-skin div.vjs-big-play-button span {
|
||||
display: block; font-size: 0; line-height: 0;
|
||||
width: 0; height: 0; margin: 20px 0 0 23px;
|
||||
/* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
|
||||
border-left: 40px solid #fff; /* Width & Color of play icon */
|
||||
/* Height of play icon is total top & bottom border widths. Color is transparent. */
|
||||
border-top: 20px solid rgba(0,0,0,0); border-bottom: 20px solid rgba(0,0,0,0);
|
||||
}
|
||||
@@ -1,405 +0,0 @@
|
||||
/*
|
||||
VideoJS Default Styles (http://videojs.com)
|
||||
Version 3.0
|
||||
|
||||
REQUIRED STYLES (be careful overriding)
|
||||
================================================================================ */
|
||||
/* When loading the player, the video tag is replaced with a DIV,
|
||||
that will hold the video tag or object tag for other playback methods.
|
||||
The div contains the video playback element (Flash or HTML5) and controls, and sets the width and height of the video.
|
||||
|
||||
** If you want to add some kind of border/padding (e.g. a frame), or special positioning, use another containing element.
|
||||
Otherwise you risk messing up control positioning and full window mode. **
|
||||
*/
|
||||
.video-js {
|
||||
background-color: #000; position: relative; padding: 0;
|
||||
|
||||
/* Start with 10px for base font size so other dimensions can be em based and easily calculable. */
|
||||
font-size: 10px;
|
||||
|
||||
/* Allow poster to be vertially aligned. */
|
||||
vertical-align: middle;
|
||||
/* display: table-cell; */ /*This works in Safari but not Firefox.*/
|
||||
}
|
||||
|
||||
/* Playback technology elements expand to the width/height of the containing div. <video> or <object> */
|
||||
.video-js .vjs-tech { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
|
||||
|
||||
/* Fullscreen Styles */
|
||||
body.vjs-full-window {
|
||||
padding: 0; margin: 0;
|
||||
height: 100%; overflow-y: auto; /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
|
||||
}
|
||||
.video-js.vjs-fullscreen {
|
||||
position: fixed; overflow: hidden; z-index: 1000; left: 0; top: 0; bottom: 0; right: 0; width: 100% !important; height: 100% !important;
|
||||
_position: absolute; /* IE6 Full-window (underscore hack) */
|
||||
}
|
||||
.video-js:-webkit-full-screen {
|
||||
width: 100% !important; height: 100% !important;
|
||||
}
|
||||
|
||||
/* Poster Styles */
|
||||
.vjs-poster {
|
||||
margin: 0 auto; padding: 0; cursor: pointer;
|
||||
|
||||
/* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
|
||||
position: relative; width: 100%; max-height: 100%;
|
||||
}
|
||||
|
||||
|
||||
/* Subtiles Styles */
|
||||
.video-js .vjs-subtitles { color: #fff; font-size: 20px; text-align: center; position: absolute; bottom: 40px; left: 0; right: 0; }
|
||||
|
||||
/* DEFAULT SKIN (override in another file to create new skins)
|
||||
================================================================================
|
||||
Instead of editing this file, I recommend creating your own skin CSS file to be included after this file,
|
||||
so you can upgrade to newer versions easier. You can remove all these styles by removing the 'vjs-default-skin' class from the tag. */
|
||||
|
||||
/* The default control bar. Created by bar.js */
|
||||
.vjs-default-skin .vjs-controls {
|
||||
position: absolute;
|
||||
bottom: 0; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */
|
||||
left: 0; right: 0; /* 100% width of div */
|
||||
opacity: 0.85;
|
||||
display: none; /* Start hidden */
|
||||
margin: 0; padding: 0; /* Controls are absolutely position, so no padding necessary */
|
||||
height: 2.6em; /* Including any margin you want above or below control items */
|
||||
color: #fff; border-top: 1px solid #404040;
|
||||
|
||||
/* CSS Gradient */
|
||||
/* Can use the Ultimate CSS Gradient Generator: http://www.colorzilla.com/gradient-editor/ */
|
||||
background: #242424; /* Old browsers */
|
||||
background: -moz-linear-gradient(top, #242424 50%, #1f1f1f 50%, #171717 100%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(50%,#242424), color-stop(50%,#1f1f1f), color-stop(100%,#171717)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* Opera11.10+ */
|
||||
background: -ms-linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* IE10+ */
|
||||
/* Filter was causing a lot of weird issues in IE. Elements would stop showing up, or other styles would break. */
|
||||
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#242424', endColorstr='#171717',GradientType=0 );*/ /* IE6-9 */
|
||||
background: linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* W3C */
|
||||
|
||||
/* Fade-in using CSS Transitions */
|
||||
-webkit-transition: opacity 0.3s linear;
|
||||
-moz-transition: opacity 0.3s linear;
|
||||
-o-transition: opacity 0.3s linear;
|
||||
-ms-transition: opacity 0.3s linear;
|
||||
transition: opacity 0.3s linear;
|
||||
}
|
||||
|
||||
/* General styles for individual controls. */
|
||||
.vjs-default-skin .vjs-control {
|
||||
position: relative; float: left;
|
||||
text-align: center; margin: 0; padding: 0;
|
||||
height: 2.6em; width: 2.6em;
|
||||
}
|
||||
|
||||
.vjs-default-skin .vjs-control:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* Hide control text visually, but have it available for screenreaders: h5bp.com/v */
|
||||
.vjs-default-skin .vjs-control-text { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
|
||||
|
||||
|
||||
/* Play/Pause
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-default-skin .vjs-play-control { width: 5em; cursor: pointer !important; }
|
||||
/* Play Icon */
|
||||
.vjs-default-skin.vjs-paused .vjs-play-control div { width: 15px; height: 17px; background: url('video-js.png'); margin: 0.5em auto 0; }
|
||||
.vjs-default-skin.vjs-playing .vjs-play-control div { width: 15px; height: 17px; background: url('video-js.png') -25px 0; margin: 0.5em auto 0; }
|
||||
|
||||
/* Rewind
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-default-skin .vjs-rewind-control { width: 5em; cursor: pointer !important; }
|
||||
.vjs-default-skin .vjs-rewind-control div { width: 19px; height: 16px; background: url('video-js.png'); margin: 0.5em auto 0; }
|
||||
|
||||
/* Volume/Mute
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-default-skin .vjs-mute-control { width: 3.8em; cursor: pointer !important; float: right; }
|
||||
.vjs-default-skin .vjs-mute-control div { width: 22px; height: 16px; background: url('video-js.png') -75px -25px; margin: 0.5em auto 0; }
|
||||
.vjs-default-skin .vjs-mute-control.vjs-vol-0 div { background: url('video-js.png') 0 -25px; }
|
||||
.vjs-default-skin .vjs-mute-control.vjs-vol-1 div { background: url('video-js.png') -25px -25px; }
|
||||
.vjs-default-skin .vjs-mute-control.vjs-vol-2 div { background: url('video-js.png') -50px -25px; }
|
||||
|
||||
|
||||
.vjs-default-skin .vjs-volume-control { width: 5em; float: right; }
|
||||
.vjs-default-skin .vjs-volume-bar {
|
||||
position: relative; width: 5em; height: 0.6em; margin: 1em auto 0; cursor: pointer !important;
|
||||
|
||||
-moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; border-radius: 0.3em;
|
||||
|
||||
background: #666;
|
||||
background: -moz-linear-gradient(top, #333, #666);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333), to(#666));
|
||||
background: -webkit-linear-gradient(top, #333, #666);
|
||||
background: -o-linear-gradient(top, #333, #666);
|
||||
background: -ms-linear-gradient(top, #333, #666);
|
||||
background: linear-gradient(top, #333, #666);
|
||||
}
|
||||
.vjs-default-skin .vjs-volume-level {
|
||||
position: absolute; top: 0; left: 0; height: 0.6em;
|
||||
|
||||
-moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; border-radius: 0.3em;
|
||||
|
||||
background: #fff;
|
||||
background: -moz-linear-gradient(top, #fff, #ccc);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#ccc));
|
||||
background: -webkit-linear-gradient(top, #fff, #ccc);
|
||||
background: -o-linear-gradient(top, #fff, #ccc);
|
||||
background: -ms-linear-gradient(top, #fff, #ccc);
|
||||
background: linear-gradient(top, #fff, #ccc);
|
||||
}
|
||||
.vjs-default-skin .vjs-volume-handle {
|
||||
position: absolute; top: -0.2em; width: 0.8em; height: 0.8em; background: #ccc; left: 0;
|
||||
border: 1px solid #fff;
|
||||
-moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; border-radius: 0.6em;
|
||||
}
|
||||
|
||||
/* Progress
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-default-skin div.vjs-progress-control {
|
||||
position: absolute;
|
||||
left: 4.8em; right: 4.8em; /* Leave room for time displays. */
|
||||
height: 1.0em; width: auto;
|
||||
top: -1.3em; /* Set above the rest of the controls. And leave room for 2px of borders (progress bottom and controls top). */
|
||||
border-bottom: 1px solid #1F1F1F;
|
||||
border-top: 1px solid #222;
|
||||
|
||||
/* CSS Gradient */
|
||||
background: #333;
|
||||
background: -moz-linear-gradient(top, #222, #333);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#222), to(#333));
|
||||
background: -webkit-linear-gradient(top, #222, #333);
|
||||
background: -o-linear-gradient(top, #333, #222);
|
||||
background: -ms-linear-gradient(top, #333, #222);
|
||||
background: linear-gradient(top, #333, #222);
|
||||
|
||||
|
||||
/* 1px top shadow */
|
||||
/* -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15);*/
|
||||
}
|
||||
|
||||
/* Box containing play and load progresses. Also acts as seek scrubber. */
|
||||
.vjs-default-skin .vjs-progress-holder {
|
||||
position: relative; cursor: pointer !important; /*overflow: hidden;*/
|
||||
padding: 0; margin: 0; /* Placement within the progress control item */
|
||||
height: 1.0em;
|
||||
-moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; border-radius: 0.6em;
|
||||
|
||||
/* CSS Gradient */
|
||||
background: #111;
|
||||
background: -moz-linear-gradient(top, #111, #262626);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#111), to(#262626));
|
||||
background: -webkit-linear-gradient(top, #111, #262626);
|
||||
background: -o-linear-gradient(top, #111, #262626);
|
||||
background: -ms-linear-gradient(top, #111, #262626);
|
||||
background: linear-gradient(top, #111, #262626);
|
||||
}
|
||||
.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
|
||||
.vjs-default-skin .vjs-progress-holder .vjs-load-progress { /* Progress Bars */
|
||||
position: absolute; display: block; height: 1.0em; margin: 0; padding: 0;
|
||||
left: 0; top: 0; /*Needed for IE6*/
|
||||
-moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; border-radius: 0.6em;
|
||||
|
||||
/*width: 0;*/
|
||||
}
|
||||
|
||||
.vjs-default-skin .vjs-play-progress {
|
||||
/* CSS Gradient. */
|
||||
background: #fff; /* Old browsers */
|
||||
background: -moz-linear-gradient(top, #fff 0%, #d6d6d6 50%, #fff 100%);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%,#fff), color-stop(50%,#d6d6d6), color-stop(100%,#fff));
|
||||
background: -webkit-linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
|
||||
background: -o-linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
|
||||
background: -ms-linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
|
||||
background: linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
|
||||
|
||||
background: #efefef;
|
||||
background: -moz-linear-gradient(top, #efefef 0%, #f5f5f5 50%, #dbdbdb 50%, #f1f1f1 100%);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%,#efefef), color-stop(50%,#f5f5f5), color-stop(50%,#dbdbdb), color-stop(100%,#f1f1f1));
|
||||
background: -webkit-linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
|
||||
background: -o-linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
|
||||
background: -ms-linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#f1f1f1',GradientType=0 );
|
||||
background: linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
|
||||
}
|
||||
.vjs-default-skin .vjs-load-progress {
|
||||
opacity: 0.8;
|
||||
|
||||
/* CSS Gradient */
|
||||
background: #666;
|
||||
background: -moz-linear-gradient(top, #666, #333);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666), to(#333));
|
||||
background: -webkit-linear-gradient(top, #666, #333);
|
||||
background: -o-linear-gradient(top, #666, #333);
|
||||
background: -ms-linear-gradient(top, #666, #333);
|
||||
background: linear-gradient(top, #666, #333);
|
||||
}
|
||||
|
||||
.vjs-default-skin div.vjs-seek-handle {
|
||||
position: absolute;
|
||||
width: 16px; height: 16px; /* Match img pixles */
|
||||
margin-top: -0.3em;
|
||||
left: 0; top: 0; /*Needed for IE6*/
|
||||
|
||||
background: url('video-js.png') 0 -50px;
|
||||
/* CSS Curved Corners. Needed to make shadows curved. */
|
||||
-moz-border-radius: 0.8em; -webkit-border-radius: 0.8em; border-radius: 0.8em;
|
||||
/* CSS Shadows */
|
||||
-webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
|
||||
}
|
||||
/* Time Display
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-default-skin .vjs-time-controls {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
height: 1.0em; width: 4.8em;
|
||||
top: -1.3em;
|
||||
border-bottom: 1px solid #1F1F1F;
|
||||
border-top: 1px solid #222;
|
||||
background-color: #333;
|
||||
|
||||
font-size: 1em; line-height: 1.0em; font-weight: normal; font-family: Helvetica, Arial, sans-serif;
|
||||
|
||||
background: #333;
|
||||
background: -moz-linear-gradient(top, #222, #333);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#222), to(#333));
|
||||
background: -webkit-linear-gradient(top, #222, #333);
|
||||
background: -o-linear-gradient(top, #333, #222);
|
||||
background: -ms-linear-gradient(top, #333, #222);
|
||||
background: linear-gradient(top, #333, #222);
|
||||
|
||||
/* 1px top shadow */
|
||||
/* -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15);*/
|
||||
}
|
||||
|
||||
.vjs-default-skin .vjs-current-time { left: 0; }
|
||||
|
||||
.vjs-default-skin .vjs-duration { right: 0; display: none; }
|
||||
.vjs-default-skin .vjs-remaining-time { right: 0; }
|
||||
|
||||
.vjs-time-divider { display:none; }
|
||||
|
||||
.vjs-default-skin .vjs-time-control { font-size: 1em; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
|
||||
.vjs-default-skin .vjs-time-control span { line-height: 25px; /* Centering vertically */ }
|
||||
|
||||
/* Fullscreen
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-secondary-controls { float: right; }
|
||||
|
||||
.vjs-default-skin .vjs-fullscreen-control { width: 3.8em; cursor: pointer !important; float: right; }
|
||||
.vjs-default-skin .vjs-fullscreen-control div { width: 16px; height: 16px; background: url('video-js.png') -50px 0; margin: 0.5em auto 0; }
|
||||
|
||||
.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control div { background: url('video-js.png') -75px 0; }
|
||||
|
||||
|
||||
/* Big Play Button (at start)
|
||||
---------------------------------------------------------*/
|
||||
.vjs-default-skin .vjs-big-play-button {
|
||||
display: block; /* Start hidden */ z-index: 2;
|
||||
position: absolute; top: 50%; left: 50%; width: 8.0em; height: 8.0em; margin: -43px 0 0 -43px; text-align: center; vertical-align: center; cursor: pointer !important;
|
||||
border: 0.3em solid #fff; opacity: 0.95;
|
||||
-webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;
|
||||
|
||||
background: #454545;
|
||||
background: -moz-linear-gradient(top, #454545 0%, #232323 50%, #161616 50%, #3f3f3f 100%);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%,#454545), color-stop(50%,#232323), color-stop(50%,#161616), color-stop(100%,#3f3f3f));
|
||||
background: -webkit-linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
|
||||
background: -o-linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
|
||||
background: -ms-linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#454545', endColorstr='#3f3f3f',GradientType=0 );
|
||||
background: linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
|
||||
|
||||
/* CSS Shadows */
|
||||
-webkit-box-shadow: 4px 4px 8px #000; -moz-box-shadow: 4px 4px 8px #000; box-shadow: 4px 4px 8px #000;
|
||||
}
|
||||
|
||||
.vjs-default-skin div.vjs-big-play-button:hover {
|
||||
-webkit-box-shadow: 0 0 80px #fff; -moz-box-shadow: 0 0 80px #fff; box-shadow: 0 0 80px #fff;
|
||||
}
|
||||
|
||||
.vjs-default-skin div.vjs-big-play-button span {
|
||||
position: absolute; top: 50%; left: 50%;
|
||||
display: block; width: 35px; height: 42px;
|
||||
margin: -20px 0 0 -15px; /* Using negative margin to center image. */
|
||||
background: url('video-js.png') -100px 0;
|
||||
}
|
||||
|
||||
/* Loading Spinner
|
||||
---------------------------------------------------------*/
|
||||
/* CSS Spinners by Kilian Valkhof - http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/ */
|
||||
.vjs-loading-spinner {
|
||||
display: none;
|
||||
position: absolute; top: 50%; left: 50%; width: 55px; height: 55px;
|
||||
margin: -28px 0 0 -28px;
|
||||
-webkit-animation-name: rotatethis;
|
||||
-webkit-animation-duration:1s;
|
||||
-webkit-animation-iteration-count:infinite;
|
||||
-webkit-animation-timing-function:linear;
|
||||
-moz-animation-name: rotatethis;
|
||||
-moz-animation-duration:1s;
|
||||
-moz-animation-iteration-count:infinite;
|
||||
-moz-animation-timing-function:linear;
|
||||
}
|
||||
|
||||
@-webkit-keyframes rotatethis {
|
||||
0% {-webkit-transform:scale(0.6) rotate(0deg); }
|
||||
12.5% {-webkit-transform:scale(0.6) rotate(0deg); }
|
||||
12.51% {-webkit-transform:scale(0.6) rotate(45deg); }
|
||||
25% {-webkit-transform:scale(0.6) rotate(45deg); }
|
||||
25.01% {-webkit-transform:scale(0.6) rotate(90deg);}
|
||||
37.5% {-webkit-transform:scale(0.6) rotate(90deg);}
|
||||
37.51% {-webkit-transform:scale(0.6) rotate(135deg);}
|
||||
50% {-webkit-transform:scale(0.6) rotate(135deg);}
|
||||
50.01% {-webkit-transform:scale(0.6) rotate(180deg);}
|
||||
62.5% {-webkit-transform:scale(0.6) rotate(180deg);}
|
||||
62.51% {-webkit-transform:scale(0.6) rotate(225deg);}
|
||||
75% {-webkit-transform:scale(0.6) rotate(225deg);}
|
||||
75.01% {-webkit-transform:scale(0.6) rotate(270deg);}
|
||||
87.5% {-webkit-transform:scale(0.6) rotate(270deg);}
|
||||
87.51% {-webkit-transform:scale(0.6) rotate(315deg);}
|
||||
100% {-webkit-transform:scale(0.6) rotate(315deg);}
|
||||
}
|
||||
|
||||
@-moz-keyframes rotatethis {
|
||||
0% {-moz-transform:scale(0.6) rotate(0deg);}
|
||||
12.5% {-moz-transform:scale(0.6) rotate(0deg);}
|
||||
12.51% {-moz-transform:scale(0.6) rotate(45deg);}
|
||||
25% {-moz-transform:scale(0.6) rotate(45deg);}
|
||||
25.01% {-moz-transform:scale(0.6) rotate(90deg);}
|
||||
37.5% {-moz-transform:scale(0.6) rotate(90deg);}
|
||||
37.51% {-moz-transform:scale(0.6) rotate(135deg);}
|
||||
50% {-moz-transform:scale(0.6) rotate(135deg);}
|
||||
50.01% {-moz-transform:scale(0.6) rotate(180deg);}
|
||||
62.5% {-moz-transform:scale(0.6) rotate(180deg);}
|
||||
62.51% {-moz-transform:scale(0.6) rotate(225deg);}
|
||||
75% {-moz-transform:scale(0.6) rotate(225deg);}
|
||||
75.01% {-moz-transform:scale(0.6) rotate(270deg);}
|
||||
87.5% {-moz-transform:scale(0.6) rotate(270deg);}
|
||||
87.51% {-moz-transform:scale(0.6) rotate(315deg);}
|
||||
100% {-moz-transform:scale(0.6) rotate(315deg);}
|
||||
}
|
||||
/* Each circle */
|
||||
div.vjs-loading-spinner .ball1 { opacity: 0.12; position:absolute; left: 20px; top: 0px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball2 { opacity: 0.25; position:absolute; left: 34px; top: 6px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball3 { opacity: 0.37; position:absolute; left: 40px; top: 20px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball4 { opacity: 0.50; position:absolute; left: 34px; top: 34px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 15px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball5 { opacity: 0.62; position:absolute; left: 20px; top: 40px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball6 { opacity: 0.75; position:absolute; left: 6px; top: 34px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball7 { opacity: 0.87; position:absolute; left: 0px; top: 20px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
|
||||
div.vjs-loading-spinner .ball8 { opacity: 1.00; position:absolute; left: 6px; top: 6px; width: 13px; height: 13px; background: #fff;
|
||||
border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
|
||||
Arquivo binário não exibido.
|
Antes Largura: | Altura: | Tamanho: 7.3 KiB |
@@ -1,53 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>HTML5 Video Player</title>
|
||||
|
||||
<link href="design/video-js.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<!--[if IE]>
|
||||
<script src="https://getfirebug.com/releases/lite/1.3/firebug-lite.js"></script>
|
||||
<!--<![endif]-->
|
||||
|
||||
<script src="src/core.js"></script>
|
||||
<script src="src/lib.js"></script>
|
||||
<script src="src/ecma.js"></script>
|
||||
<script src="src/json.js"></script>
|
||||
|
||||
<script src="src/component.js"></script>
|
||||
<script src="src/player.js"></script>
|
||||
<script src="src/tech.js"></script>
|
||||
<script src="src/controls.js"></script>
|
||||
<script src="src/events.js"></script>
|
||||
<script src="src/tracks.js"></script>
|
||||
|
||||
<script src="flash/swfobject.js"></script>
|
||||
|
||||
<script src="src/setup.js"></script>
|
||||
|
||||
<script type="text/javascript" charset="utf-8">
|
||||
// Easy access to test Flash over HTML5. Add ?flash to URL
|
||||
if (window.location.href.indexOf("?flash") !== -1) {
|
||||
_V_.options.techOrder = ["H5swf"]
|
||||
}
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<video id="vid1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264"
|
||||
poster="http://video-js.zencoder.com/oceans-clip.png"
|
||||
data-setup='{}'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg'>
|
||||
<p>Video Playback Not Supported</p>
|
||||
</video>
|
||||
|
||||
<script>
|
||||
vid = document.getElementById("vid1");
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,17 +0,0 @@
|
||||
#! /usr/bin/env ruby
|
||||
# Create javascript file with list of source files for easy inclusion in other development files.
|
||||
|
||||
# puts ARGV[0]
|
||||
|
||||
File.open("source-list.js", "w+") do |file|
|
||||
file.puts "var vjsSourceList = [];"
|
||||
|
||||
|
||||
Dir.foreach('../src') do |item|
|
||||
next if item == '.' or item == '..' or item == '.DS_Store'
|
||||
|
||||
file.puts "vjsSourceList.push('src/#{item}')"
|
||||
|
||||
end
|
||||
|
||||
end
|
||||
@@ -1,13 +0,0 @@
|
||||
var vjsSourceList = [];
|
||||
vjsSourceList.push('_begin.js')
|
||||
vjsSourceList.push('_end.js')
|
||||
vjsSourceList.push('component.js')
|
||||
vjsSourceList.push('controls.js')
|
||||
vjsSourceList.push('core.js')
|
||||
vjsSourceList.push('ecma.js')
|
||||
vjsSourceList.push('events.js')
|
||||
vjsSourceList.push('json.js')
|
||||
vjsSourceList.push('lib.js')
|
||||
vjsSourceList.push('player.js')
|
||||
vjsSourceList.push('tech.js')
|
||||
vjsSourceList.push('tracks.js')
|
||||
-243
@@ -1,243 +0,0 @@
|
||||
---
|
||||
layout: docs
|
||||
title: API
|
||||
description: Video.JS API Docs - API settings based on the HTML5 video API
|
||||
body_id: api
|
||||
body_class: docs subpage
|
||||
---
|
||||
|
||||
API
|
||||
===
|
||||
The Video.js API allows you to interact with the video through Javascript, whether the browser is playing the video through HTML5 video, Flash, or any other supported playback technologies.
|
||||
|
||||
Referencing the Player
|
||||
----------------------
|
||||
To use the API functions, you need access to the player object. Luckily this is easy to get. You just need to make sure your video tag has an ID. The example embed code has an ID of "example_video_1". If you have multiple videos on one page, make sure every video tag has a unique ID.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var myPlayer = _V_("example_video_1");
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
(If the player hasn't been initialized yet via the data-setup attribute or another method, this will also initialize the player.)
|
||||
|
||||
Wait Until the Player is Ready
|
||||
------------------------------
|
||||
The time it takes Video.js to set up the video and API will vary depending on the playback technology being used (HTML5 will often be much faster to load than Flash). For that reason we want to use the player's 'ready' function to trigger any code that requires the player's API.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
_V_("example_video_1").ready(function(){
|
||||
|
||||
var myPlayer = this;
|
||||
|
||||
// EXAMPLE: Start playing the video.
|
||||
myPlayer.play();
|
||||
|
||||
});
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
API Methods
|
||||
-----------
|
||||
Now that you have access to a ready player, you can control the video or respond to video events using the following functions. The Video.js API function names follow the [HTML5 media API](http://www.w3.org/TR/html5/video.html). The main difference is that attributes which you would get or set on a video element using the equals sign ( `myVideoElement.currentTime = "120";` ), you would use a function argument syntax for Video.js ( `myPlayer.currentTime(120);` )
|
||||
|
||||
### play()
|
||||
Start video playback. Returns the player object.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.play();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
|
||||
### pause()
|
||||
Pause the video playback. Returns: the player object
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.pause();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### currentTime()
|
||||
Returns the current time of the video in seconds.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var whereYouAt = myPlayer.currentTime();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### currentTime(seconds) // Type: Integer or Float
|
||||
Seek to the supplied time (seconds).
|
||||
Returns the player object.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.currentTime(120); // 2 minutes into the video
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### duration()
|
||||
Returns the length in time of the video in seconds. NOTE: The video must have started loading before the duration can be known, and in the case of Flash, may not be known until the video starts playing.
|
||||
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var howLongIsThis = myPlayer.duration();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### buffered()
|
||||
Returns a [TimeRange](http://videojs.com/docs/glossary.html#timerange) with sections of the video that have been downloaded. If you just want the percent of the video that's been downloaded, use bufferedPercent.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var whatHasBeenBuffered = myPlayer.buffered();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### bufferedPercent()
|
||||
Returns the percent (as a decimal) of the video that's been downloaded.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var howMuchIsDownloaded = myPlayer.bufferedPercent();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### volume()
|
||||
Returns the current volume of the video as a percent in decimal form. 0 is off (muted), 1.0 is all the way up, 0.5 is half way.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var howLoudIsIt = myPlayer.volume();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### volume(percentAsDecimal)
|
||||
Set the volume to the supplied percent (as a decimal between 0 and 1).
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.volume(0.5); // Set volume to half
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### width()
|
||||
Returns the current width of the video in pixels.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var howWideIsIt = myPlayer.width();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
### width(pixels)
|
||||
Change the width of the video to the supplied width in pixels.
|
||||
Returns the player object
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.width(640);
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### height()
|
||||
Returns the current height of the video in pixels.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var howTallIsIt = myPlayer.height();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### height(pixels)
|
||||
Change the height of the video to the supplied height in pixels.
|
||||
Returns the player object
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.height(480);
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### size(width, height)
|
||||
Changes the width and height of the video to the supplied width and height. This is more efficient if you're changing both width and height (only triggers the player's resize event once). Returns the player object.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.size(640,480);
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### requestFullScreen()
|
||||
Increase the size of the video to full screen. In some browsers, full screen is not supported natively, so it enters full window mode, where the fills the browser window. In browsers that support native full screen, typically the browser's default controls will be shown, and not the Video.js custom skin. In full window mode, the Video.js controls and skin will always be used.
|
||||
Returns the player object.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.enterFullScreen();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### cancelFullScreen()
|
||||
Return the video to its normal size after having been in full screen mode.
|
||||
Returns the player object.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.exitFullScreen();
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
Events
|
||||
------
|
||||
You can attach event listeners to the player similarly to how you would for a video element.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
var myFunc = function(){
|
||||
// Do something when the event is fired
|
||||
};
|
||||
myPlayer.addEvent("eventName", myFunc);
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
You can also remove the listeners later.
|
||||
|
||||
{% highlight javascript %}
|
||||
|
||||
myPlayer.removeEvent("eventName", myFunc);
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
|
||||
### Event Types
|
||||
List of player events you can add listeners for.
|
||||
|
||||
<table border="0" cellspacing="5" cellpadding="5">
|
||||
<tr><th>Name</th><th>Description</th></tr>
|
||||
<tr><td>loadstart</td><td>Fired when the user agent begins looking for media data.</td></tr>
|
||||
<tr><td>play</td><td>Fired whenever the media begins or resumes playback.</td></tr>
|
||||
<tr><td>pause</td><td>Fired whenever the media has been paused.</td></tr>
|
||||
<tr><td>timeupdate</td><td>Fired when the current playback position has changed. During playback this is fired every 15-250 milliseconds, depnding on the playback technology in use.</td></tr>
|
||||
<tr><td>ended</td><td>Fired when the end of the media resource is reached. currentTime == duration</td></tr>
|
||||
<tr><td>durationchange</td><td>Fired when the duration of the media resource is changed, or known for the first time.</td></tr>
|
||||
<tr><td>progress</td><td>Fired while the user agent is downloading media data.</td></tr>
|
||||
<tr><td>resize</td><td>Fired when the width and/or height of the video window changes.</td></tr>
|
||||
<tr><td>volumechange</td><td>Fired when the volume changes.</td></tr>
|
||||
<tr><td>error</td><td>Fired when there is an error in playback.</td></tr>
|
||||
</table>
|
||||
@@ -0,0 +1,503 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.BigPlayButton
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/big-play-button.js#L11](https://github.com/videojs/video.js/blob/master/src/js/big-play-button.js#L11)
|
||||
|
||||
Initial play button. Shows before the video has played. The hiding of the
|
||||
big play button is done via CSS and player states.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-ready-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_inherited from_: [src/js/button.js#L15](https://github.com/videojs/video.js/blob/master/src/js/button.js#L15)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,502 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Button
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/button.js#L10](https://github.com/videojs/video.js/blob/master/src/js/button.js#L10)
|
||||
|
||||
Base class for all buttons
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/button.js#L15](https://github.com/videojs/video.js/blob/master/src/js/button.js#L15)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,506 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.CaptionsButton
|
||||
|
||||
__EXTENDS__: [vjs.TextTrackButton](vjs.TextTrackButton.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L867](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L867)
|
||||
|
||||
The button component for toggling and selecting captions
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [createItems](#createitems) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
_inherited from_: [src/js/menu.js#L157](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L157)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### createItems()
|
||||
> Create the list of menu items. Specific to each subclass.
|
||||
|
||||
_inherited from_: [src/js/menu.js#L154](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L154)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L869](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L869)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,637 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.CaptionsTrack
|
||||
|
||||
__EXTENDS__: [vjs.TextTrack](vjs.TextTrack.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L679](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L679)
|
||||
|
||||
The track component for managing the hiding and showing of captions
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [activate](#activate) _`inherited`_
|
||||
- [activeCues](#activecues) _`inherited`_
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [adjustFontSize](#adjustfontsize) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel) _`inherited`_
|
||||
- [cues](#cues) _`inherited`_
|
||||
- [deactivate](#deactivate) _`inherited`_
|
||||
- [dflt](#dflt) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [kind](#kind) _`inherited`_
|
||||
- [label](#label) _`inherited`_
|
||||
- [language](#language) _`inherited`_
|
||||
- [mode](#mode) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [readyState](#readystate) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [src](#src) _`inherited`_
|
||||
- [title](#title) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### activate()
|
||||
> Turn on cue tracking. Tracks that are showing OR hidden are active.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L385](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L385)
|
||||
|
||||
---
|
||||
|
||||
### activeCues()
|
||||
> Get the track active cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L264](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L264)
|
||||
|
||||
---
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### adjustFontSize()
|
||||
> Change the font size of the text track to make it larger when playing in fullscreen mode
|
||||
> and restore it to its normal size when not in fullscreen mode.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L309](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L309)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl()
|
||||
> Create basic div to hold cue text
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L325](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L325)
|
||||
|
||||
---
|
||||
|
||||
### cues()
|
||||
> Get the track cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L249](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L249)
|
||||
|
||||
---
|
||||
|
||||
### deactivate()
|
||||
> Turn off cue tracking.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L408](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L408)
|
||||
|
||||
---
|
||||
|
||||
### dflt()
|
||||
> Get the track default value. ('default' is a reserved keyword)
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L190](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable: Mode Off/Disable (0)
|
||||
> Indicates that the text track is not active. Other than for the purposes of exposing the track in the DOM, the user agent is ignoring the text track.
|
||||
> No cues are active, no events are fired, and the user agent will not attempt to obtain the track's cues.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L371](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L371)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide: Mode Hidden (1)
|
||||
> Indicates that the text track is active, but that the user agent is not actively displaying the cues.
|
||||
> If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L356](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L356)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L128](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L128)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### kind()
|
||||
> Get the track kind value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L161](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L161)
|
||||
|
||||
---
|
||||
|
||||
### label()
|
||||
> Get the track label value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L234](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L234)
|
||||
|
||||
---
|
||||
|
||||
### language()
|
||||
> Get the track language value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L219](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L219)
|
||||
|
||||
---
|
||||
|
||||
### mode()
|
||||
> Get the track mode
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L301](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L301)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### readyState()
|
||||
> Get the track readyState
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L283](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L283)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show: Mode Showing (2)
|
||||
> Indicates that the text track is active. If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
> In addition, for text tracks whose kind is subtitles or captions, the cues are being displayed over the video as appropriate;
|
||||
> for text tracks whose kind is descriptions, the user agent is making the cues available to the user in a non-visual fashion;
|
||||
> and for text tracks whose kind is chapters, the user agent is making available to the user a mechanism by which the user can navigate to any point in the media resource by selecting a cue.
|
||||
> The showing by default state is used in conjunction with the default attribute on track elements to indicate that the text track was enabled due to that attribute.
|
||||
> This allows the user agent to override the state if a later track is discovered that is more appropriate per the user's preferences.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L341](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L341)
|
||||
|
||||
---
|
||||
|
||||
### src()
|
||||
> Get the track src value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L175](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L175)
|
||||
|
||||
---
|
||||
|
||||
### title()
|
||||
> Get the track title value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L204](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L204)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,506 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.ChaptersButton
|
||||
|
||||
__EXTENDS__: [vjs.TextTrackButton](vjs.TextTrackButton.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L901](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L901)
|
||||
|
||||
The button component for toggling and selecting chapters
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [createItems](#createitems) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
_inherited from_: [src/js/menu.js#L157](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L157)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### createItems()
|
||||
> Create the list of menu items. Specific to each subclass.
|
||||
|
||||
_inherited from_: [src/js/menu.js#L154](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L154)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L903](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L903)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,637 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.ChaptersTrack
|
||||
|
||||
__EXTENDS__: [vjs.TextTrack](vjs.TextTrack.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L697](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L697)
|
||||
|
||||
The track component for managing the hiding and showing of chapters
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [activate](#activate) _`inherited`_
|
||||
- [activeCues](#activecues) _`inherited`_
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [adjustFontSize](#adjustfontsize) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel) _`inherited`_
|
||||
- [cues](#cues) _`inherited`_
|
||||
- [deactivate](#deactivate) _`inherited`_
|
||||
- [dflt](#dflt) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [kind](#kind) _`inherited`_
|
||||
- [label](#label) _`inherited`_
|
||||
- [language](#language) _`inherited`_
|
||||
- [mode](#mode) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [readyState](#readystate) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [src](#src) _`inherited`_
|
||||
- [title](#title) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### activate()
|
||||
> Turn on cue tracking. Tracks that are showing OR hidden are active.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L385](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L385)
|
||||
|
||||
---
|
||||
|
||||
### activeCues()
|
||||
> Get the track active cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L264](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L264)
|
||||
|
||||
---
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### adjustFontSize()
|
||||
> Change the font size of the text track to make it larger when playing in fullscreen mode
|
||||
> and restore it to its normal size when not in fullscreen mode.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L309](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L309)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl()
|
||||
> Create basic div to hold cue text
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L325](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L325)
|
||||
|
||||
---
|
||||
|
||||
### cues()
|
||||
> Get the track cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L249](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L249)
|
||||
|
||||
---
|
||||
|
||||
### deactivate()
|
||||
> Turn off cue tracking.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L408](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L408)
|
||||
|
||||
---
|
||||
|
||||
### dflt()
|
||||
> Get the track default value. ('default' is a reserved keyword)
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L190](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable: Mode Off/Disable (0)
|
||||
> Indicates that the text track is not active. Other than for the purposes of exposing the track in the DOM, the user agent is ignoring the text track.
|
||||
> No cues are active, no events are fired, and the user agent will not attempt to obtain the track's cues.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L371](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L371)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide: Mode Hidden (1)
|
||||
> Indicates that the text track is active, but that the user agent is not actively displaying the cues.
|
||||
> If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L356](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L356)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L128](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L128)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### kind()
|
||||
> Get the track kind value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L161](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L161)
|
||||
|
||||
---
|
||||
|
||||
### label()
|
||||
> Get the track label value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L234](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L234)
|
||||
|
||||
---
|
||||
|
||||
### language()
|
||||
> Get the track language value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L219](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L219)
|
||||
|
||||
---
|
||||
|
||||
### mode()
|
||||
> Get the track mode
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L301](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L301)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### readyState()
|
||||
> Get the track readyState
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L283](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L283)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show: Mode Showing (2)
|
||||
> Indicates that the text track is active. If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
> In addition, for text tracks whose kind is subtitles or captions, the cues are being displayed over the video as appropriate;
|
||||
> for text tracks whose kind is descriptions, the user agent is making the cues available to the user in a non-visual fashion;
|
||||
> and for text tracks whose kind is chapters, the user agent is making available to the user a mechanism by which the user can navigate to any point in the media resource by selecting a cue.
|
||||
> The showing by default state is used in conjunction with the default attribute on track elements to indicate that the text track was enabled due to that attribute.
|
||||
> This allows the user agent to override the state if a later track is discovered that is more appropriate per the user's preferences.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L341](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L341)
|
||||
|
||||
---
|
||||
|
||||
### src()
|
||||
> Get the track src value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L175](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L175)
|
||||
|
||||
---
|
||||
|
||||
### title()
|
||||
> Get the track title value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L204](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L204)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,514 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.ChaptersTrackMenuItem
|
||||
|
||||
__EXTENDS__: [vjs.MenuItem](vjs.MenuItem.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L987](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L987)
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [selected](#selected-selected-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_inherited from_: [src/js/menu.js#L64](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L64)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L989](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L989)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick()
|
||||
> Handle a click on the menu item, and set it to selected
|
||||
|
||||
_inherited from_: [src/js/menu.js#L74](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### selected( selected )
|
||||
> Set this menu item as selected or not
|
||||
|
||||
##### PARAMETERS:
|
||||
* __selected__ `Boolean`
|
||||
|
||||
_inherited from_: [src/js/menu.js#L82](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L82)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,522 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Component
|
||||
|
||||
__EXTENDS__: [vjs.CoreObject](vjs.CoreObject.md)
|
||||
__DEFINED IN__: [src/js/component.js#L35](https://github.com/videojs/video.js/blob/master/src/js/component.js#L35)
|
||||
|
||||
Base UI Component class
|
||||
|
||||
Components are embeddable UI objects that are represented by both a
|
||||
javascript object and an element in the DOM. They can be children of other
|
||||
components, and can have many children themselves.
|
||||
|
||||
// adding a button to the player
|
||||
var button = player.addChild('button');
|
||||
button.el(); // -> button element
|
||||
|
||||
<div class="video-js">
|
||||
<div class="vjs-button">Button</div>
|
||||
</div>
|
||||
|
||||
Components are also event emitters.
|
||||
|
||||
button.on('click', function(){
|
||||
console.log('Button Clicked!');
|
||||
});
|
||||
|
||||
button.trigger('customevent');
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [addChild](#addchild-child-options-)
|
||||
- [addClass](#addclass-classtoadd-)
|
||||
- [buildCSSClass](#buildcssclass)
|
||||
- [children](#children)
|
||||
- [contentEl](#contentel)
|
||||
- [createEl](#createel-tagname-attributes-)
|
||||
- [dimensions](#dimensions-width-height-)
|
||||
- [disable](#disable)
|
||||
- [dispose](#dispose)
|
||||
- [el](#el)
|
||||
- [getChild](#getchild-name-)
|
||||
- [getChildById](#getchildbyid-id-)
|
||||
- [height](#height-num-skiplisteners-)
|
||||
- [hide](#hide)
|
||||
- [id](#id)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [initChildren](#initchildren)
|
||||
- [name](#name)
|
||||
- [off](#off-type-fn-)
|
||||
- [on](#on-type-fn-)
|
||||
- [one](#one-type-fn-)
|
||||
- [options](#options-obj-)
|
||||
- [player](#player)
|
||||
- [ready](#ready-fn-)
|
||||
- [removeChild](#removechild-component-)
|
||||
- [removeClass](#removeclass-classtoremove-)
|
||||
- [show](#show)
|
||||
- [trigger](#trigger-type-event-)
|
||||
- [triggerReady](#triggerready)
|
||||
- [width](#width-num-skiplisteners-)
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event)
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_defined in_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_defined in_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_defined in_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_defined in_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_defined in_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_defined in_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_defined in_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_defined in_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_defined in_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_defined in_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/component.js#L41](https://github.com/videojs/video.js/blob/master/src/js/component.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_defined in_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_defined in_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_defined in_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_defined in_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_defined in_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_defined in_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_defined in_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_defined in_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_defined in_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,502 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.ControlBar
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/control-bar.js#L9](https://github.com/videojs/video.js/blob/master/src/js/control-bar/control-bar.js#L9)
|
||||
|
||||
Container of main controls
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-ready-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_inherited from_: [src/js/component.js#L41](https://github.com/videojs/video.js/blob/master/src/js/component.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,93 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.CoreObject
|
||||
|
||||
__DEFINED IN__: [src/js/core-object.js#L52](https://github.com/videojs/video.js/blob/master/src/js/core-object.js#L52)
|
||||
|
||||
Core Object/Class for objects that use inheritance + contstructors
|
||||
|
||||
To create a class that can be subclassed itself, extend the CoreObject class.
|
||||
|
||||
var Animal = CoreObject.extend();
|
||||
var Horse = Animal.extend();
|
||||
|
||||
The constructor can be defined through the init property of an object argument.
|
||||
|
||||
var Animal = CoreObject.extend({
|
||||
init: function(name, sound){
|
||||
this.name = name;
|
||||
}
|
||||
});
|
||||
|
||||
Other methods and properties can be added the same way, or directly to the
|
||||
prototype.
|
||||
|
||||
var Animal = CoreObject.extend({
|
||||
init: function(name){
|
||||
this.name = name;
|
||||
},
|
||||
getName: function(){
|
||||
return this.name;
|
||||
},
|
||||
sound: '...'
|
||||
});
|
||||
|
||||
Animal.prototype.makeSound = function(){
|
||||
alert(this.sound);
|
||||
};
|
||||
|
||||
To create an instance of a class, use the create method.
|
||||
|
||||
var fluffy = Animal.create('Fluffy');
|
||||
fluffy.getName(); // -> Fluffy
|
||||
|
||||
Methods and properties can be overridden in subclasses.
|
||||
|
||||
var Horse = Animal.extend({
|
||||
sound: 'Neighhhhh!'
|
||||
});
|
||||
|
||||
var horsey = Horse.create('Horsey');
|
||||
horsey.getName(); // -> Horsey
|
||||
horsey.makeSound(); // -> Alert: Neighhhhh!
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [create](#create-static)
|
||||
- [extend](#extend-props--static)
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### create() `STATIC`
|
||||
> Create a new instace of this Object class
|
||||
>
|
||||
> var myAnimal = Animal.create();
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.CoreObject` An instance of a CoreObject subclass
|
||||
|
||||
_defined in_: [src/js/core-object.js#L120](https://github.com/videojs/video.js/blob/master/src/js/core-object.js#L120)
|
||||
|
||||
---
|
||||
|
||||
### extend( props ) `STATIC`
|
||||
> Create a new object that inherits from this Object
|
||||
>
|
||||
> var Animal = CoreObject.extend();
|
||||
> var Horse = Animal.extend();
|
||||
|
||||
##### PARAMETERS:
|
||||
* __props__ `Object` Functions and properties to be applied to the
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.CoreObject` An object that inherits from CoreObject
|
||||
|
||||
_defined in_: [src/js/core-object.js#L70](https://github.com/videojs/video.js/blob/master/src/js/core-object.js#L70)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.CurrentTimeDisplay
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/time-display.js#L7](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L7)
|
||||
|
||||
Displays the current time
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/time-display.js#L9](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L9)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.DurationDisplay
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/time-display.js#L43](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L43)
|
||||
|
||||
Displays the duration
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/time-display.js#L45](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L45)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,546 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Flash
|
||||
|
||||
__EXTENDS__: [vjs.MediaTechController](vjs.MediaTechController.md)
|
||||
__DEFINED IN__: [src/js/media/flash.js#L15](https://github.com/videojs/video.js/blob/master/src/js/media/flash.js#L15)
|
||||
|
||||
Flash Media Controller - Wrapper for fallback SWF API
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [initControlsListeners](#initcontrolslisteners) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick-event-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [removeControlsListeners](#removecontrolslisteners) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/media/flash.js#L17](https://github.com/videojs/video.js/blob/master/src/js/media/flash.js#L17)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### initControlsListeners()
|
||||
> Set up click and touch listeners for the playback element
|
||||
> On desktops, a click on the video itself will toggle playback,
|
||||
> on a mobile device a click on the video toggles controls.
|
||||
> (toggling controls is done by toggling the user state between active and
|
||||
> inactive)
|
||||
>
|
||||
> A tap can signal that a user has become active, or has become inactive
|
||||
> e.g. a quick tap on an iPhone movie should reveal the controls. Another
|
||||
> quick tap should hide them again (signaling the user is in an inactive
|
||||
> viewing state)
|
||||
>
|
||||
> In addition to this, we still want the user to be considered inactive after
|
||||
> a few seconds of inactivity.
|
||||
>
|
||||
> Note: the only part of iOS interaction we can't mimic with this setup
|
||||
> is a touch and hold on the video element counting as activity in order to
|
||||
> keep the controls showing, but that shouldn't be an issue. A touch and hold on
|
||||
> any controls will still keep the user active
|
||||
|
||||
_inherited from_: [src/js/media/media.js#L41](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick( event )
|
||||
> Handle a click on the media element. By default will play/pause the media.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __event__
|
||||
|
||||
_inherited from_: [src/js/media/media.js#L131](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L131)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### removeControlsListeners()
|
||||
> Remove the listeners used for click and tap controls. This is needed for
|
||||
> toggling to controls disabled, where a tap/touch should do nothing.
|
||||
|
||||
_inherited from_: [src/js/media/media.js#L115](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L115)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.FullscreenToggle
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/control-bar/fullscreen-toggle.js#L8](https://github.com/videojs/video.js/blob/master/src/js/control-bar/fullscreen-toggle.js#L8)
|
||||
|
||||
Toggle fullscreen video
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/fullscreen-toggle.js#L14](https://github.com/videojs/video.js/blob/master/src/js/control-bar/fullscreen-toggle.js#L14)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,546 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Html5
|
||||
|
||||
__EXTENDS__: [vjs.MediaTechController](vjs.MediaTechController.md)
|
||||
__DEFINED IN__: [src/js/media/html5.js#L12](https://github.com/videojs/video.js/blob/master/src/js/media/html5.js#L12)
|
||||
|
||||
HTML5 Media Controller - Wrapper for HTML5 Media API
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [initControlsListeners](#initcontrolslisteners) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick-event-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [removeControlsListeners](#removecontrolslisteners) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/media/html5.js#L14](https://github.com/videojs/video.js/blob/master/src/js/media/html5.js#L14)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### initControlsListeners()
|
||||
> Set up click and touch listeners for the playback element
|
||||
> On desktops, a click on the video itself will toggle playback,
|
||||
> on a mobile device a click on the video toggles controls.
|
||||
> (toggling controls is done by toggling the user state between active and
|
||||
> inactive)
|
||||
>
|
||||
> A tap can signal that a user has become active, or has become inactive
|
||||
> e.g. a quick tap on an iPhone movie should reveal the controls. Another
|
||||
> quick tap should hide them again (signaling the user is in an inactive
|
||||
> viewing state)
|
||||
>
|
||||
> In addition to this, we still want the user to be considered inactive after
|
||||
> a few seconds of inactivity.
|
||||
>
|
||||
> Note: the only part of iOS interaction we can't mimic with this setup
|
||||
> is a touch and hold on the video element counting as activity in order to
|
||||
> keep the controls showing, but that shouldn't be an issue. A touch and hold on
|
||||
> any controls will still keep the user active
|
||||
|
||||
_inherited from_: [src/js/media/media.js#L41](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick( event )
|
||||
> Handle a click on the media element. By default will play/pause the media.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __event__
|
||||
|
||||
_inherited from_: [src/js/media/media.js#L131](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L131)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### removeControlsListeners()
|
||||
> Remove the listeners used for click and tap controls. This is needed for
|
||||
> toggling to controls disabled, where a tap/touch should do nothing.
|
||||
|
||||
_inherited from_: [src/js/media/media.js#L115](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L115)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,30 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.JSON
|
||||
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [parse](#parse-text-reviver-)
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### parse( text, reviver )
|
||||
> parse the json
|
||||
|
||||
##### PARAMETERS:
|
||||
* __text__
|
||||
* __reviver__
|
||||
|
||||
##### RETURNS:
|
||||
* `Object|Array` The parsed JSON
|
||||
|
||||
_defined in_: [src/js/json.js#L32](https://github.com/videojs/video.js/blob/master/src/js/json.js#L32)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.LoadProgressBar
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/progress-control.js#L136](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L136)
|
||||
|
||||
Shows load progress
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/progress-control.js#L138](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L138)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.LoadingSpinner
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/loading-spinner.js#L10](https://github.com/videojs/video.js/blob/master/src/js/loading-spinner.js#L10)
|
||||
|
||||
Loading spinner for waiting events
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/loading-spinner.js#L12](https://github.com/videojs/video.js/blob/master/src/js/loading-spinner.js#L12)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,502 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.MediaLoader
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/media/loader.js#L7](https://github.com/videojs/video.js/blob/master/src/js/media/loader.js#L7)
|
||||
|
||||
The Media Loader is the component that decides which playback technology to load
|
||||
when the player is initialized.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/media/loader.js#L9](https://github.com/videojs/video.js/blob/master/src/js/media/loader.js#L9)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,546 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.MediaTechController
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/media/media.js#L12](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L12)
|
||||
|
||||
Base class for media (HTML5 Video, Flash) controllers
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [initControlsListeners](#initcontrolslisteners)
|
||||
- [onClick](#onclick-event-)
|
||||
- [removeControlsListeners](#removecontrolslisteners)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/media/media.js#L14](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L14)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### initControlsListeners()
|
||||
> Set up click and touch listeners for the playback element
|
||||
> On desktops, a click on the video itself will toggle playback,
|
||||
> on a mobile device a click on the video toggles controls.
|
||||
> (toggling controls is done by toggling the user state between active and
|
||||
> inactive)
|
||||
>
|
||||
> A tap can signal that a user has become active, or has become inactive
|
||||
> e.g. a quick tap on an iPhone movie should reveal the controls. Another
|
||||
> quick tap should hide them again (signaling the user is in an inactive
|
||||
> viewing state)
|
||||
>
|
||||
> In addition to this, we still want the user to be considered inactive after
|
||||
> a few seconds of inactivity.
|
||||
>
|
||||
> Note: the only part of iOS interaction we can't mimic with this setup
|
||||
> is a touch and hold on the video element counting as activity in order to
|
||||
> keep the controls showing, but that shouldn't be an issue. A touch and hold on
|
||||
> any controls will still keep the user active
|
||||
|
||||
_defined in_: [src/js/media/media.js#L41](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick( event )
|
||||
> Handle a click on the media element. By default will play/pause the media.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __event__
|
||||
|
||||
_defined in_: [src/js/media/media.js#L131](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L131)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### removeControlsListeners()
|
||||
> Remove the listeners used for click and tap controls. This is needed for
|
||||
> toggling to controls disabled, where a tap/touch should do nothing.
|
||||
|
||||
_defined in_: [src/js/media/media.js#L115](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L115)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,511 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Menu
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/menu.js#L12](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L12)
|
||||
|
||||
The Menu component is used to build pop up menus, including subtitle and
|
||||
captions selection menus.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [addItem](#additem-component-)
|
||||
- [createEl](#createel-tagname-attributes-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-ready-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### addItem( component )
|
||||
> Add a menu item to the menu
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `Object|String` Component or component type to add
|
||||
|
||||
_defined in_: [src/js/menu.js#L18](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L18)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_defined in_: [src/js/menu.js#L26](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L26)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_inherited from_: [src/js/component.js#L41](https://github.com/videojs/video.js/blob/master/src/js/component.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,505 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.MenuButton
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/menu.js#L99](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L99)
|
||||
|
||||
A button class with a popup menu
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [buildCSSClass](#buildcssclass)
|
||||
- [createItems](#createitems)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
_defined in_: [src/js/menu.js#L157](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L157)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### createItems()
|
||||
> Create the list of menu items. Specific to each subclass.
|
||||
|
||||
_defined in_: [src/js/menu.js#L154](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L154)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/menu.js#L101](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L101)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,516 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.MenuItem
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/menu.js#L55](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L55)
|
||||
|
||||
The component for a menu item. `<li>`
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [createEl](#createel-tagname-attributes-)
|
||||
- [init](#init-player-options-)
|
||||
- [onClick](#onclick)
|
||||
- [selected](#selected-selected-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_defined in_: [src/js/menu.js#L64](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L64)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/menu.js#L57](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L57)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick()
|
||||
> Handle a click on the menu item, and set it to selected
|
||||
|
||||
_defined in_: [src/js/menu.js#L74](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### selected( selected )
|
||||
> Set this menu item as selected or not
|
||||
|
||||
##### PARAMETERS:
|
||||
* __selected__ `Boolean`
|
||||
|
||||
_defined in_: [src/js/menu.js#L82](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L82)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.MuteToggle
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/control-bar/mute-toggle.js#L8](https://github.com/videojs/video.js/blob/master/src/js/control-bar/mute-toggle.js#L8)
|
||||
|
||||
A button component for muting the audio
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/mute-toggle.js#L10](https://github.com/videojs/video.js/blob/master/src/js/control-bar/mute-toggle.js#L10)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,516 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.OffTextTrackMenuItem
|
||||
|
||||
__EXTENDS__: [vjs.TextTrackMenuItem](vjs.TextTrackMenuItem.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L765](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L765)
|
||||
|
||||
A special menu item for turning of a specific type of text track
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [selected](#selected-selected-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_inherited from_: [src/js/menu.js#L64](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L64)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L767](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L767)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick()
|
||||
> Handle a click on the menu item, and set it to selected
|
||||
|
||||
_inherited from_: [src/js/menu.js#L74](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### selected( selected )
|
||||
> Set this menu item as selected or not
|
||||
|
||||
##### PARAMETERS:
|
||||
* __selected__ `Boolean`
|
||||
|
||||
_inherited from_: [src/js/menu.js#L82](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L82)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.PlayProgressBar
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/progress-control.js#L163](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L163)
|
||||
|
||||
Shows play progress
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/progress-control.js#L165](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L165)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.PlayToggle
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/control-bar/play-toggle.js#L8](https://github.com/videojs/video.js/blob/master/src/js/control-bar/play-toggle.js#L8)
|
||||
|
||||
Button to toggle between play and pause
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/play-toggle.js#L10](https://github.com/videojs/video.js/blob/master/src/js/control-bar/play-toggle.js#L10)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,919 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Player
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/player.js#L21](https://github.com/videojs/video.js/blob/master/src/js/player.js#L21)
|
||||
|
||||
An instance of the `vjs.Player` class is created when any of the Video.js setup methods are used to initialize a video.
|
||||
|
||||
```js
|
||||
var myPlayer = videojs('example_video_1');
|
||||
```
|
||||
|
||||
In the follwing example, the `data-setup` attribute tells the Video.js library to create a player instance when the library is ready.
|
||||
|
||||
```html
|
||||
<video id="example_video_1" data-setup='{}' controls>
|
||||
<source src="my-source.mp4" type="video/mp4">
|
||||
</video>
|
||||
```
|
||||
|
||||
After an instance has been created it can be accessed globally using `Video('example_video_1')`.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [buffered](#buffered)
|
||||
- [bufferedPercent](#bufferedpercent)
|
||||
- [cancelFullScreen](#cancelfullscreen)
|
||||
- [controls](#controls-controls-)
|
||||
- [currentTime](#currenttime-seconds-)
|
||||
- [dispose](#dispose)
|
||||
- [duration](#duration-seconds-)
|
||||
- [init](#init-tag-options-ready-)
|
||||
- [muted](#muted-muted-)
|
||||
- [pause](#pause)
|
||||
- [paused](#paused)
|
||||
- [play](#play)
|
||||
- [poster](#poster-src-)
|
||||
- [requestFullScreen](#requestfullscreen)
|
||||
- [src](#src-source-)
|
||||
- [volume](#volume-percentasdecimal-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [durationchange](#durationchange-event)
|
||||
- [ended](#ended-event)
|
||||
- [error](#error-event)
|
||||
- [firstplay](#firstplay-event)
|
||||
- [fullscreenchange](#fullscreenchange-event)
|
||||
- [loadedalldata](#loadedalldata-event)
|
||||
- [loadeddata](#loadeddata-event)
|
||||
- [loadedmetadata](#loadedmetadata-event)
|
||||
- [loadstart](#loadstart-event)
|
||||
- [pause](#pause-event)
|
||||
- [play](#play-event)
|
||||
- [progress](#progress-event)
|
||||
- [timeupdate](#timeupdate-event)
|
||||
- [volumechange](#volumechange-event)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buffered()
|
||||
> Get a TimeRange object with the times of the video that have been downloaded
|
||||
>
|
||||
> If you just want the percent of the video that's been downloaded,
|
||||
> use bufferedPercent.
|
||||
>
|
||||
> // Number of different ranges of time have been buffered. Usually 1.
|
||||
> numberOfRanges = bufferedTimeRange.length,
|
||||
>
|
||||
> // Time in seconds when the first range starts. Usually 0.
|
||||
> firstRangeStart = bufferedTimeRange.start(0),
|
||||
>
|
||||
> // Time in seconds when the first range ends
|
||||
> firstRangeEnd = bufferedTimeRange.end(0),
|
||||
>
|
||||
> // Length in seconds of the first time range
|
||||
> firstRangeLength = firstRangeEnd - firstRangeStart;
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` A mock TimeRange object (following HTML spec)
|
||||
|
||||
_defined in_: [src/js/player.js#L717](https://github.com/videojs/video.js/blob/master/src/js/player.js#L717)
|
||||
|
||||
---
|
||||
|
||||
### bufferedPercent()
|
||||
> Get the percent (as a decimal) of the video that's been downloaded
|
||||
>
|
||||
> var howMuchIsDownloaded = myPlayer.bufferedPercent();
|
||||
>
|
||||
> 0 means none, 1 means all.
|
||||
> (This method isn't in the HTML5 spec, but it's very convenient)
|
||||
|
||||
##### RETURNS:
|
||||
* `Number` A decimal between 0 and 1 representing the percent
|
||||
|
||||
_defined in_: [src/js/player.js#L743](https://github.com/videojs/video.js/blob/master/src/js/player.js#L743)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### cancelFullScreen()
|
||||
> Return the video to its normal size after having been in full screen mode
|
||||
>
|
||||
> myPlayer.cancelFullScreen();
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player` self
|
||||
|
||||
_defined in_: [src/js/player.js#L864](https://github.com/videojs/video.js/blob/master/src/js/player.js#L864)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### controls( controls )
|
||||
> Get or set whether or not the controls are showing.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __controls__ `Boolean` Set controls to showing or not
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean` Controls are showing
|
||||
|
||||
_defined in_: [src/js/player.js#L1115](https://github.com/videojs/video.js/blob/master/src/js/player.js#L1115)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### currentTime( [seconds] )
|
||||
> Get or set the current time (in seconds)
|
||||
>
|
||||
> // get
|
||||
> var whereYouAt = myPlayer.currentTime();
|
||||
>
|
||||
> // set
|
||||
> myPlayer.currentTime(120); // 2 minutes into the video
|
||||
|
||||
##### PARAMETERS:
|
||||
* __seconds__ `Number|String` _(OPTIONAL)_ The time to seek to
|
||||
|
||||
##### RETURNS:
|
||||
* `Number` The time in seconds, when not setting
|
||||
* `vjs.Player` self, when the current time is set
|
||||
|
||||
_defined in_: [src/js/player.js#L641](https://github.com/videojs/video.js/blob/master/src/js/player.js#L641)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Destroys the video player and does any necessary cleanup
|
||||
>
|
||||
> myPlayer.dispose();
|
||||
>
|
||||
> This is especially helpful if you are dynamically adding and removing videos
|
||||
> to/from the DOM.
|
||||
|
||||
_defined in_: [src/js/player.js#L128](https://github.com/videojs/video.js/blob/master/src/js/player.js#L128)
|
||||
|
||||
---
|
||||
|
||||
### duration( seconds )
|
||||
> Get the length in time of the video in seconds
|
||||
>
|
||||
> var lengthOfVideo = myPlayer.duration();
|
||||
>
|
||||
> **NOTE**: The video must have started loading before the duration can be
|
||||
> known, and in the case of Flash, may not be known until the video starts
|
||||
> playing.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __seconds__
|
||||
|
||||
##### RETURNS:
|
||||
* `Number` The duration of the video in seconds
|
||||
|
||||
_defined in_: [src/js/player.js#L671](https://github.com/videojs/video.js/blob/master/src/js/player.js#L671)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( tag, [options], [ready] )
|
||||
> player's constructor function
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tag__ `Element` The original video tag used for configuring options
|
||||
* __options__ `Object` _(OPTIONAL)_ Player options
|
||||
* __ready__ `Function` _(OPTIONAL)_ Ready callback function
|
||||
|
||||
_defined in_: [src/js/player.js#L32](https://github.com/videojs/video.js/blob/master/src/js/player.js#L32)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### muted( [muted] )
|
||||
> Get the current muted state, or turn mute on or off
|
||||
>
|
||||
> // get
|
||||
> var isVolumeMuted = myPlayer.muted();
|
||||
>
|
||||
> // set
|
||||
> myPlayer.muted(true); // mute the volume
|
||||
|
||||
##### PARAMETERS:
|
||||
* __muted__ `Boolean` _(OPTIONAL)_ True to mute, false to unmute
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean` True if mute is on, false if not, when getting
|
||||
* `vjs.Player` self, when setting mute
|
||||
|
||||
_defined in_: [src/js/player.js#L792](https://github.com/videojs/video.js/blob/master/src/js/player.js#L792)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### pause()
|
||||
> Pause the video playback
|
||||
>
|
||||
> myPlayer.pause();
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player` self
|
||||
|
||||
_defined in_: [src/js/player.js#L610](https://github.com/videojs/video.js/blob/master/src/js/player.js#L610)
|
||||
|
||||
---
|
||||
|
||||
### paused()
|
||||
> Check if the player is paused
|
||||
>
|
||||
> var isPaused = myPlayer.paused();
|
||||
> var isPlaying = !myPlayer.paused();
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean` false if the media is currently playing, or true otherwise
|
||||
|
||||
_defined in_: [src/js/player.js#L623](https://github.com/videojs/video.js/blob/master/src/js/player.js#L623)
|
||||
|
||||
---
|
||||
|
||||
### play()
|
||||
> start media playback
|
||||
>
|
||||
> myPlayer.play();
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player` self
|
||||
|
||||
_defined in_: [src/js/player.js#L598](https://github.com/videojs/video.js/blob/master/src/js/player.js#L598)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### poster( [src] )
|
||||
> get or set the poster image source url
|
||||
>
|
||||
> ##### EXAMPLE:
|
||||
>
|
||||
> // getting
|
||||
> var currentPoster = myPlayer.poster();
|
||||
>
|
||||
> // setting
|
||||
> myPlayer.poster('http://example.com/myImage.jpg');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __src__ `String` _(OPTIONAL)_ Poster image source URL
|
||||
|
||||
##### RETURNS:
|
||||
* `String` poster URL when getting
|
||||
* `vjs.Player` self when setting
|
||||
|
||||
_defined in_: [src/js/player.js#L1095](https://github.com/videojs/video.js/blob/master/src/js/player.js#L1095)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### requestFullScreen()
|
||||
> Increase the size of the video to full screen
|
||||
>
|
||||
> myPlayer.requestFullScreen();
|
||||
>
|
||||
> In some browsers, full screen is not supported natively, so it enters
|
||||
> "full window mode", where the video fills the browser window.
|
||||
> In browsers and devices that support native full screen, sometimes the
|
||||
> browser's default controls will be shown, and not the Video.js custom skin.
|
||||
> This includes most mobile devices (iOS, Android) and older versions of
|
||||
> Safari.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player` self
|
||||
|
||||
_defined in_: [src/js/player.js#L817](https://github.com/videojs/video.js/blob/master/src/js/player.js#L817)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### src( [source] )
|
||||
> The source function updates the video source
|
||||
>
|
||||
> There are three types of variables you can pass as the argument.
|
||||
>
|
||||
> **URL String**: A URL to the the video file. Use this method if you are sure
|
||||
> the current playback technology (HTML5/Flash) can support the source you
|
||||
> provide. Currently only MP4 files can be used in both HTML5 and Flash.
|
||||
>
|
||||
> myPlayer.src("http://www.example.com/path/to/video.mp4");
|
||||
>
|
||||
> **Source Object (or element):** A javascript object containing information
|
||||
> about the source file. Use this method if you want the player to determine if
|
||||
> it can support the file using the type information.
|
||||
>
|
||||
> myPlayer.src({ type: "video/mp4", src: "http://www.example.com/path/to/video.mp4" });
|
||||
>
|
||||
> **Array of Source Objects:** To provide multiple versions of the source so
|
||||
> that it can be played using HTML5 across browsers you can use an array of
|
||||
> source objects. Video.js will detect which version is supported and load that
|
||||
> file.
|
||||
>
|
||||
> myPlayer.src([
|
||||
> { type: "video/mp4", src: "http://www.example.com/path/to/video.mp4" },
|
||||
> { type: "video/webm", src: "http://www.example.com/path/to/video.webm" },
|
||||
> { type: "video/ogg", src: "http://www.example.com/path/to/video.ogv" }
|
||||
> ]);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __source__ `String|Object|Array` _(OPTIONAL)_ The source URL, object, or array of sources
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player` self
|
||||
|
||||
_defined in_: [src/js/player.js#L979](https://github.com/videojs/video.js/blob/master/src/js/player.js#L979)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### volume( percentAsDecimal )
|
||||
> Get or set the current volume of the media
|
||||
>
|
||||
> // get
|
||||
> var howLoudIsIt = myPlayer.volume();
|
||||
>
|
||||
> // set
|
||||
> myPlayer.volume(0.5); // Set volume to half
|
||||
>
|
||||
> 0 is off (muted), 1.0 is all the way up, 0.5 is half way.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __percentAsDecimal__ `Number` The new volume as a decimal percent
|
||||
|
||||
##### RETURNS:
|
||||
* `Number` The current volume, when getting
|
||||
* `vjs.Player` self, when setting
|
||||
|
||||
_defined in_: [src/js/player.js#L762](https://github.com/videojs/video.js/blob/master/src/js/player.js#L762)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### durationchange `EVENT`
|
||||
> Fired when the duration of the media resource is first known or changed
|
||||
|
||||
_defined in_: [src/js/player.js#L498](https://github.com/videojs/video.js/blob/master/src/js/player.js#L498)
|
||||
|
||||
---
|
||||
|
||||
### ended `EVENT`
|
||||
> Fired when the end of the media resource is reached (currentTime == duration)
|
||||
|
||||
_defined in_: [src/js/player.js#L487](https://github.com/videojs/video.js/blob/master/src/js/player.js#L487)
|
||||
|
||||
---
|
||||
|
||||
### error `EVENT`
|
||||
> Fired when there is an error in playback
|
||||
|
||||
##### PARAMETERS:
|
||||
* __e__
|
||||
|
||||
_defined in_: [src/js/player.js#L525](https://github.com/videojs/video.js/blob/master/src/js/player.js#L525)
|
||||
|
||||
---
|
||||
|
||||
### firstplay `EVENT`
|
||||
> Fired the first time a video is played
|
||||
>
|
||||
> Not part of the HLS spec, and we're not sure if this is the best
|
||||
> implementation yet, so use sparingly. If you don't have a reason to
|
||||
> prevent playback, use `myPlayer.one('play');` instead.
|
||||
|
||||
_defined in_: [src/js/player.js#L444](https://github.com/videojs/video.js/blob/master/src/js/player.js#L444)
|
||||
|
||||
---
|
||||
|
||||
### fullscreenchange `EVENT`
|
||||
> Fired when the player switches in or out of fullscreen mode
|
||||
|
||||
_defined in_: [src/js/player.js#L513](https://github.com/videojs/video.js/blob/master/src/js/player.js#L513)
|
||||
|
||||
---
|
||||
|
||||
### loadedalldata `EVENT`
|
||||
> Fired when the player has finished downloading the source data
|
||||
|
||||
_defined in_: [src/js/player.js#L424](https://github.com/videojs/video.js/blob/master/src/js/player.js#L424)
|
||||
|
||||
---
|
||||
|
||||
### loadeddata `EVENT`
|
||||
> Fired when the player has downloaded data at the current playback position
|
||||
|
||||
_defined in_: [src/js/player.js#L418](https://github.com/videojs/video.js/blob/master/src/js/player.js#L418)
|
||||
|
||||
---
|
||||
|
||||
### loadedmetadata `EVENT`
|
||||
> Fired when the player has initial duration and dimension information
|
||||
|
||||
_defined in_: [src/js/player.js#L412](https://github.com/videojs/video.js/blob/master/src/js/player.js#L412)
|
||||
|
||||
---
|
||||
|
||||
### loadstart `EVENT`
|
||||
> Fired when the user agent begins looking for media data
|
||||
|
||||
_defined in_: [src/js/player.js#L406](https://github.com/videojs/video.js/blob/master/src/js/player.js#L406)
|
||||
|
||||
---
|
||||
|
||||
### pause `EVENT`
|
||||
> Fired whenever the media has been paused
|
||||
|
||||
_defined in_: [src/js/player.js#L458](https://github.com/videojs/video.js/blob/master/src/js/player.js#L458)
|
||||
|
||||
---
|
||||
|
||||
### play `EVENT`
|
||||
> Fired whenever the media begins or resumes playback
|
||||
|
||||
_defined in_: [src/js/player.js#L430](https://github.com/videojs/video.js/blob/master/src/js/player.js#L430)
|
||||
|
||||
---
|
||||
|
||||
### progress `EVENT`
|
||||
> Fired while the user agent is downloading media data
|
||||
|
||||
_defined in_: [src/js/player.js#L476](https://github.com/videojs/video.js/blob/master/src/js/player.js#L476)
|
||||
|
||||
---
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
### timeupdate `EVENT`
|
||||
> Fired when the current playback position has changed
|
||||
>
|
||||
> During playback this is fired every 15-250 milliseconds, depnding on the
|
||||
> playback technology in use.
|
||||
|
||||
_defined in_: [src/js/player.js#L470](https://github.com/videojs/video.js/blob/master/src/js/player.js#L470)
|
||||
|
||||
---
|
||||
|
||||
### volumechange `EVENT`
|
||||
> Fired when the volume changes
|
||||
|
||||
_defined in_: [src/js/player.js#L507](https://github.com/videojs/video.js/blob/master/src/js/player.js#L507)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.PosterImage
|
||||
|
||||
__EXTENDS__: [vjs.Button](vjs.Button.md)
|
||||
__DEFINED IN__: [src/js/poster.js#L10](https://github.com/videojs/video.js/blob/master/src/js/poster.js#L10)
|
||||
|
||||
The component that handles showing the poster image.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/poster.js#L12](https://github.com/videojs/video.js/blob/master/src/js/poster.js#L12)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,501 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.ProgressControl
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/progress-control.js#L9](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L9)
|
||||
|
||||
The Progress Control component contains the seek bar, load progress,
|
||||
and play progress
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/progress-control.js#L11](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L11)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.RemainingTimeDisplay
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/time-display.js#L103](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L103)
|
||||
|
||||
Displays the time left in the video
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/time-display.js#L105](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L105)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,512 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.SeekBar
|
||||
|
||||
__EXTENDS__: [vjs.Slider](vjs.Slider.md)
|
||||
__DEFINED IN__: [src/js/control-bar/progress-control.js#L35](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L35)
|
||||
|
||||
Seek Bar and holder for the progress bars
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick-event-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/progress-control.js#L37](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L37)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick( event )
|
||||
> Listener for click events on slider, used to prevent clicks
|
||||
> from bubbling up to parent elements like button menus.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __event__ `Object` Event object
|
||||
|
||||
_inherited from_: [src/js/slider.js#L200](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L200)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.SeekHandle
|
||||
|
||||
__EXTENDS__: [vjs.SliderHandle](vjs.SliderHandle.md)
|
||||
__DEFINED IN__: [src/js/control-bar/progress-control.js#L185](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L185)
|
||||
|
||||
The Seek Handle shows the current position of the playhead during playback,
|
||||
and can be dragged to adjust the playhead.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [createEl](#createel-tagname-attributes-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-ready-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_defined in_: [src/js/control-bar/progress-control.js#L196](https://github.com/videojs/video.js/blob/master/src/js/control-bar/progress-control.js#L196)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_inherited from_: [src/js/component.js#L41](https://github.com/videojs/video.js/blob/master/src/js/component.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,512 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.Slider
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/slider.js#L10](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L10)
|
||||
|
||||
The base functionality for sliders like the volume bar and seek bar
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [onClick](#onclick-event-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/slider.js#L12](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L12)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick( event )
|
||||
> Listener for click events on slider, used to prevent clicks
|
||||
> from bubbling up to parent elements like button menus.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __event__ `Object` Event object
|
||||
|
||||
_defined in_: [src/js/slider.js#L200](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L200)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.SliderHandle
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/slider.js#L212](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L212)
|
||||
|
||||
SeekBar Behavior includes play progress bar, and seek handle
|
||||
Needed so it can determine seek position based on handle position/size
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [createEl](#createel-tagname-attributes-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-ready-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_defined in_: [src/js/slider.js#L223](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L223)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_inherited from_: [src/js/component.js#L41](https://github.com/videojs/video.js/blob/master/src/js/component.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,506 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.SubtitlesButton
|
||||
|
||||
__EXTENDS__: [vjs.TextTrackButton](vjs.TextTrackButton.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L883](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L883)
|
||||
|
||||
The button component for toggling and selecting subtitles
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [createItems](#createitems) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
_inherited from_: [src/js/menu.js#L157](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L157)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### createItems()
|
||||
> Create the list of menu items. Specific to each subclass.
|
||||
|
||||
_inherited from_: [src/js/menu.js#L154](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L154)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L885](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L885)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,637 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.SubtitlesTrack
|
||||
|
||||
__EXTENDS__: [vjs.TextTrack](vjs.TextTrack.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L689](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L689)
|
||||
|
||||
The track component for managing the hiding and showing of subtitles
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [activate](#activate) _`inherited`_
|
||||
- [activeCues](#activecues) _`inherited`_
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [adjustFontSize](#adjustfontsize) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel) _`inherited`_
|
||||
- [cues](#cues) _`inherited`_
|
||||
- [deactivate](#deactivate) _`inherited`_
|
||||
- [dflt](#dflt) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [kind](#kind) _`inherited`_
|
||||
- [label](#label) _`inherited`_
|
||||
- [language](#language) _`inherited`_
|
||||
- [mode](#mode) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [readyState](#readystate) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [src](#src) _`inherited`_
|
||||
- [title](#title) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### activate()
|
||||
> Turn on cue tracking. Tracks that are showing OR hidden are active.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L385](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L385)
|
||||
|
||||
---
|
||||
|
||||
### activeCues()
|
||||
> Get the track active cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L264](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L264)
|
||||
|
||||
---
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### adjustFontSize()
|
||||
> Change the font size of the text track to make it larger when playing in fullscreen mode
|
||||
> and restore it to its normal size when not in fullscreen mode.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L309](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L309)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl()
|
||||
> Create basic div to hold cue text
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L325](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L325)
|
||||
|
||||
---
|
||||
|
||||
### cues()
|
||||
> Get the track cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L249](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L249)
|
||||
|
||||
---
|
||||
|
||||
### deactivate()
|
||||
> Turn off cue tracking.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L408](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L408)
|
||||
|
||||
---
|
||||
|
||||
### dflt()
|
||||
> Get the track default value. ('default' is a reserved keyword)
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L190](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable: Mode Off/Disable (0)
|
||||
> Indicates that the text track is not active. Other than for the purposes of exposing the track in the DOM, the user agent is ignoring the text track.
|
||||
> No cues are active, no events are fired, and the user agent will not attempt to obtain the track's cues.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L371](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L371)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide: Mode Hidden (1)
|
||||
> Indicates that the text track is active, but that the user agent is not actively displaying the cues.
|
||||
> If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L356](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L356)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L128](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L128)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### kind()
|
||||
> Get the track kind value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L161](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L161)
|
||||
|
||||
---
|
||||
|
||||
### label()
|
||||
> Get the track label value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L234](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L234)
|
||||
|
||||
---
|
||||
|
||||
### language()
|
||||
> Get the track language value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L219](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L219)
|
||||
|
||||
---
|
||||
|
||||
### mode()
|
||||
> Get the track mode
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L301](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L301)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### readyState()
|
||||
> Get the track readyState
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L283](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L283)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show: Mode Showing (2)
|
||||
> Indicates that the text track is active. If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
> In addition, for text tracks whose kind is subtitles or captions, the cues are being displayed over the video as appropriate;
|
||||
> for text tracks whose kind is descriptions, the user agent is making the cues available to the user in a non-visual fashion;
|
||||
> and for text tracks whose kind is chapters, the user agent is making available to the user a mechanism by which the user can navigate to any point in the media resource by selecting a cue.
|
||||
> The showing by default state is used in conjunction with the default attribute on track elements to indicate that the text track was enabled due to that attribute.
|
||||
> This allows the user agent to override the state if a later track is discovered that is more appropriate per the user's preferences.
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L341](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L341)
|
||||
|
||||
---
|
||||
|
||||
### src()
|
||||
> Get the track src value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L175](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L175)
|
||||
|
||||
---
|
||||
|
||||
### title()
|
||||
> Get the track title value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/tracks.js#L204](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L204)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,639 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.TextTrack
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L126](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L126)
|
||||
|
||||
The base class for all text tracks
|
||||
|
||||
Handles the parsing, hiding, and showing of text track cues
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [activate](#activate)
|
||||
- [activeCues](#activecues)
|
||||
- [adjustFontSize](#adjustfontsize)
|
||||
- [createEl](#createel)
|
||||
- [cues](#cues)
|
||||
- [deactivate](#deactivate)
|
||||
- [dflt](#dflt)
|
||||
- [disable](#disable)
|
||||
- [hide](#hide)
|
||||
- [init](#init-player-options-)
|
||||
- [kind](#kind)
|
||||
- [label](#label)
|
||||
- [language](#language)
|
||||
- [mode](#mode)
|
||||
- [readyState](#readystate)
|
||||
- [show](#show)
|
||||
- [src](#src)
|
||||
- [title](#title)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### activate()
|
||||
> Turn on cue tracking. Tracks that are showing OR hidden are active.
|
||||
|
||||
_defined in_: [src/js/tracks.js#L385](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L385)
|
||||
|
||||
---
|
||||
|
||||
### activeCues()
|
||||
> Get the track active cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L264](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L264)
|
||||
|
||||
---
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### adjustFontSize()
|
||||
> Change the font size of the text track to make it larger when playing in fullscreen mode
|
||||
> and restore it to its normal size when not in fullscreen mode.
|
||||
|
||||
_defined in_: [src/js/tracks.js#L309](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L309)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl()
|
||||
> Create basic div to hold cue text
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L325](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L325)
|
||||
|
||||
---
|
||||
|
||||
### cues()
|
||||
> Get the track cues
|
||||
|
||||
##### RETURNS:
|
||||
* `Array`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L249](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L249)
|
||||
|
||||
---
|
||||
|
||||
### deactivate()
|
||||
> Turn off cue tracking.
|
||||
|
||||
_defined in_: [src/js/tracks.js#L408](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L408)
|
||||
|
||||
---
|
||||
|
||||
### dflt()
|
||||
> Get the track default value. ('default' is a reserved keyword)
|
||||
|
||||
##### RETURNS:
|
||||
* `Boolean`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L190](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable: Mode Off/Disable (0)
|
||||
> Indicates that the text track is not active. Other than for the purposes of exposing the track in the DOM, the user agent is ignoring the text track.
|
||||
> No cues are active, no events are fired, and the user agent will not attempt to obtain the track's cues.
|
||||
|
||||
_defined in_: [src/js/tracks.js#L371](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L371)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide: Mode Hidden (1)
|
||||
> Indicates that the text track is active, but that the user agent is not actively displaying the cues.
|
||||
> If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
|
||||
_defined in_: [src/js/tracks.js#L356](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L356)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L128](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L128)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### kind()
|
||||
> Get the track kind value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L161](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L161)
|
||||
|
||||
---
|
||||
|
||||
### label()
|
||||
> Get the track label value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L234](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L234)
|
||||
|
||||
---
|
||||
|
||||
### language()
|
||||
> Get the track language value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L219](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L219)
|
||||
|
||||
---
|
||||
|
||||
### mode()
|
||||
> Get the track mode
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L301](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L301)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### readyState()
|
||||
> Get the track readyState
|
||||
|
||||
##### RETURNS:
|
||||
* `Number`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L283](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L283)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show: Mode Showing (2)
|
||||
> Indicates that the text track is active. If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
|
||||
> The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
|
||||
> In addition, for text tracks whose kind is subtitles or captions, the cues are being displayed over the video as appropriate;
|
||||
> for text tracks whose kind is descriptions, the user agent is making the cues available to the user in a non-visual fashion;
|
||||
> and for text tracks whose kind is chapters, the user agent is making available to the user a mechanism by which the user can navigate to any point in the media resource by selecting a cue.
|
||||
> The showing by default state is used in conjunction with the default attribute on track elements to indicate that the text track was enabled due to that attribute.
|
||||
> This allows the user agent to override the state if a later track is discovered that is more appropriate per the user's preferences.
|
||||
|
||||
_defined in_: [src/js/tracks.js#L341](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L341)
|
||||
|
||||
---
|
||||
|
||||
### src()
|
||||
> Get the track src value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L175](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L175)
|
||||
|
||||
---
|
||||
|
||||
### title()
|
||||
> Get the track title value
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_defined in_: [src/js/tracks.js#L204](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L204)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,505 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.TextTrackButton
|
||||
|
||||
__EXTENDS__: [vjs.MenuButton](vjs.MenuButton.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L807](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L807)
|
||||
|
||||
The base class for buttons that toggle specific text track types (e.g. subtitles)
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [createItems](#createitems) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
_inherited from_: [src/js/menu.js#L157](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L157)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### createItems()
|
||||
> Create the list of menu items. Specific to each subclass.
|
||||
|
||||
_inherited from_: [src/js/menu.js#L154](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L154)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L809](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L809)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,501 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.TextTrackDisplay
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L710](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L710)
|
||||
|
||||
The component for displaying text track cues
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-ready-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L712](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L712)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,516 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.TextTrackMenuItem
|
||||
|
||||
__EXTENDS__: [vjs.MenuItem](vjs.MenuItem.md)
|
||||
__DEFINED IN__: [src/js/tracks.js#L737](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L737)
|
||||
|
||||
The specific menu item type for selecting a language within a text track kind
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [selected](#selected-selected-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_inherited from_: [src/js/menu.js#L64](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L64)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/tracks.js#L739](https://github.com/videojs/video.js/blob/master/src/js/tracks.js#L739)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick()
|
||||
> Handle a click on the menu item, and set it to selected
|
||||
|
||||
_inherited from_: [src/js/menu.js#L74](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### selected( selected )
|
||||
> Set this menu item as selected or not
|
||||
|
||||
##### PARAMETERS:
|
||||
* __selected__ `Boolean`
|
||||
|
||||
_inherited from_: [src/js/menu.js#L82](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L82)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,502 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.TimeDivider
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/time-display.js#L83](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L83)
|
||||
|
||||
The separator between the current time and duration
|
||||
|
||||
Can be hidden if it's not needed in the design.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/time-display.js#L85](https://github.com/videojs/video.js/blob/master/src/js/control-bar/time-display.js#L85)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,512 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.VolumeBar
|
||||
|
||||
__EXTENDS__: [vjs.Slider](vjs.Slider.md)
|
||||
__DEFINED IN__: [src/js/control-bar/volume-control.js#L46](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L46)
|
||||
|
||||
The bar that contains the volume level and can be clicked on to adjust the level
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [onClick](#onclick-event-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/volume-control.js#L48](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L48)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### onClick( event )
|
||||
> Listener for click events on slider, used to prevent clicks
|
||||
> from bubbling up to parent elements like button menus.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __event__ `Object` Event object
|
||||
|
||||
_inherited from_: [src/js/slider.js#L200](https://github.com/videojs/video.js/blob/master/src/js/slider.js#L200)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.VolumeControl
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/volume-control.js#L8](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L8)
|
||||
|
||||
The component for controlling the volume level
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/volume-control.js#L10](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L10)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,499 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.VolumeHandle
|
||||
|
||||
__EXTENDS__: [vjs.SliderHandle](vjs.SliderHandle.md)
|
||||
__DEFINED IN__: [src/js/control-bar/volume-control.js#L132](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L132)
|
||||
|
||||
The volume handle can be dragged to adjust the volume level
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [createEl](#createel-tagname-attributes-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [init](#init-player-options-ready-) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
_defined in_: [src/js/control-bar/volume-control.js#L137](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L137)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options, ready )
|
||||
> the constructor funciton for the class
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
* __ready__
|
||||
|
||||
_inherited from_: [src/js/component.js#L41](https://github.com/videojs/video.js/blob/master/src/js/component.js#L41)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,500 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.VolumeLevel
|
||||
|
||||
__EXTENDS__: [vjs.Component](vjs.Component.md)
|
||||
__DEFINED IN__: [src/js/control-bar/volume-control.js#L111](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L111)
|
||||
|
||||
Shows volume level
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
##### RETURNS:
|
||||
* `String` The constructed class name
|
||||
|
||||
_inherited from_: [src/js/component.js#L471](https://github.com/videojs/video.js/blob/master/src/js/component.js#L471)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/volume-control.js#L113](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-control.js#L113)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,505 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.VolumeMenuButton
|
||||
|
||||
__EXTENDS__: [vjs.MenuButton](vjs.MenuButton.md)
|
||||
__DEFINED IN__: [src/js/control-bar/volume-menu-button.js#L5](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-menu-button.js#L5)
|
||||
|
||||
Menu button with a popup for showing the volume slider.
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [init](#init-player-options-)
|
||||
- [addChild](#addchild-child-options-) _`inherited`_
|
||||
- [addClass](#addclass-classtoadd-) _`inherited`_
|
||||
- [buildCSSClass](#buildcssclass) _`inherited`_
|
||||
- [children](#children) _`inherited`_
|
||||
- [contentEl](#contentel) _`inherited`_
|
||||
- [createEl](#createel-tagname-attributes-) _`inherited`_
|
||||
- [createItems](#createitems) _`inherited`_
|
||||
- [dimensions](#dimensions-width-height-) _`inherited`_
|
||||
- [disable](#disable) _`inherited`_
|
||||
- [dispose](#dispose) _`inherited`_
|
||||
- [el](#el) _`inherited`_
|
||||
- [getChild](#getchild-name-) _`inherited`_
|
||||
- [getChildById](#getchildbyid-id-) _`inherited`_
|
||||
- [height](#height-num-skiplisteners-) _`inherited`_
|
||||
- [hide](#hide) _`inherited`_
|
||||
- [id](#id) _`inherited`_
|
||||
- [initChildren](#initchildren) _`inherited`_
|
||||
- [name](#name) _`inherited`_
|
||||
- [off](#off-type-fn-) _`inherited`_
|
||||
- [on](#on-type-fn-) _`inherited`_
|
||||
- [one](#one-type-fn-) _`inherited`_
|
||||
- [options](#options-obj-) _`inherited`_
|
||||
- [player](#player) _`inherited`_
|
||||
- [ready](#ready-fn-) _`inherited`_
|
||||
- [removeChild](#removechild-component-) _`inherited`_
|
||||
- [removeClass](#removeclass-classtoremove-) _`inherited`_
|
||||
- [show](#show) _`inherited`_
|
||||
- [trigger](#trigger-type-event-) _`inherited`_
|
||||
- [triggerReady](#triggerready) _`inherited`_
|
||||
- [width](#width-num-skiplisteners-) _`inherited`_
|
||||
|
||||
- [EVENTS](#events)
|
||||
- [resize](#resize-event) _`inherited`_
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### addChild( child, [options] )
|
||||
> Adds a child component inside this component
|
||||
>
|
||||
> myComponent.el();
|
||||
> // -> <div class='my-component'></div>
|
||||
> myComonent.children();
|
||||
> // [empty array]
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton');
|
||||
> // -> <div class='my-component'><div class="my-button">myButton<div></div>
|
||||
> // -> myButton === myComonent.children()[0];
|
||||
>
|
||||
> Pass in options for child constructors and options for children of the child
|
||||
>
|
||||
> var myButton = myComponent.addChild('MyButton', {
|
||||
> text: 'Press Me',
|
||||
> children: {
|
||||
> buttonChildExample: {
|
||||
> buttonChildOption: true
|
||||
> }
|
||||
> }
|
||||
> });
|
||||
|
||||
##### PARAMETERS:
|
||||
* __child__ `String|vjs.Component` The class name or instance of a child to add
|
||||
* __options__ `Object` _(OPTIONAL)_ Options, including options to be passed to children of the child.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The child component (created by this process if a string was used)
|
||||
|
||||
_inherited from_: [src/js/component.js#L343](https://github.com/videojs/video.js/blob/master/src/js/component.js#L343)
|
||||
|
||||
---
|
||||
|
||||
### addClass( classToAdd )
|
||||
> Add a CSS class name to the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToAdd__ `String` Classname to add
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L628](https://github.com/videojs/video.js/blob/master/src/js/component.js#L628)
|
||||
|
||||
---
|
||||
|
||||
### buildCSSClass()
|
||||
> Allows sub components to stack CSS class names
|
||||
|
||||
_inherited from_: [src/js/menu.js#L157](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L157)
|
||||
|
||||
---
|
||||
|
||||
### children()
|
||||
> Get an array of all child components
|
||||
>
|
||||
> var kids = myComponent.children();
|
||||
|
||||
##### RETURNS:
|
||||
* `Array` The children
|
||||
|
||||
_inherited from_: [src/js/component.js#L277](https://github.com/videojs/video.js/blob/master/src/js/component.js#L277)
|
||||
|
||||
---
|
||||
|
||||
### contentEl()
|
||||
> Return the component's DOM element for embedding content.
|
||||
> Will either be el_ or a new element defined in createEl.
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L220](https://github.com/videojs/video.js/blob/master/src/js/component.js#L220)
|
||||
|
||||
---
|
||||
|
||||
### createEl( [tagName], [attributes] )
|
||||
> Create the component's DOM element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __tagName__ `String` _(OPTIONAL)_ Element's node type. e.g. 'div'
|
||||
* __attributes__ `Object` _(OPTIONAL)_ An object of element attributes that should be set on the element
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L190](https://github.com/videojs/video.js/blob/master/src/js/component.js#L190)
|
||||
|
||||
---
|
||||
|
||||
### createItems()
|
||||
> Create the list of menu items. Specific to each subclass.
|
||||
|
||||
_inherited from_: [src/js/menu.js#L154](https://github.com/videojs/video.js/blob/master/src/js/menu.js#L154)
|
||||
|
||||
---
|
||||
|
||||
### dimensions( width, height )
|
||||
> Set both width and height at the same time
|
||||
|
||||
##### PARAMETERS:
|
||||
* __width__ `Number|String`
|
||||
* __height__ `Number|String`
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component
|
||||
|
||||
_inherited from_: [src/js/component.js#L730](https://github.com/videojs/video.js/blob/master/src/js/component.js#L730)
|
||||
|
||||
---
|
||||
|
||||
### disable()
|
||||
> Disable component by making it unshowable
|
||||
|
||||
_inherited from_: [src/js/component.js#L691](https://github.com/videojs/video.js/blob/master/src/js/component.js#L691)
|
||||
|
||||
---
|
||||
|
||||
### dispose()
|
||||
> Dispose of the component and all child components
|
||||
|
||||
_inherited from_: [src/js/component.js#L74](https://github.com/videojs/video.js/blob/master/src/js/component.js#L74)
|
||||
|
||||
---
|
||||
|
||||
### el()
|
||||
> Get the component's DOM element
|
||||
>
|
||||
> var domEl = myComponent.el();
|
||||
|
||||
##### RETURNS:
|
||||
* `Element`
|
||||
|
||||
_inherited from_: [src/js/component.js#L201](https://github.com/videojs/video.js/blob/master/src/js/component.js#L201)
|
||||
|
||||
---
|
||||
|
||||
### getChild( name )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L311](https://github.com/videojs/video.js/blob/master/src/js/component.js#L311)
|
||||
|
||||
---
|
||||
|
||||
### getChildById( id )
|
||||
> Returns a child component with the provided ID
|
||||
|
||||
##### PARAMETERS:
|
||||
* __id__
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L294](https://github.com/videojs/video.js/blob/master/src/js/component.js#L294)
|
||||
|
||||
---
|
||||
|
||||
### height( [num], [skipListeners] )
|
||||
> Get or set the height of the component (CSS values)
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ New component height
|
||||
* __skipListeners__ `Boolean` _(OPTIONAL)_ Skip the resize event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` The component if the height was set
|
||||
* `Number|String` The height if it wasn't set
|
||||
|
||||
_inherited from_: [src/js/component.js#L719](https://github.com/videojs/video.js/blob/master/src/js/component.js#L719)
|
||||
|
||||
---
|
||||
|
||||
### hide()
|
||||
> Hide the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L659](https://github.com/videojs/video.js/blob/master/src/js/component.js#L659)
|
||||
|
||||
---
|
||||
|
||||
### id()
|
||||
> Get the component's ID
|
||||
>
|
||||
> var id = myComponent.id();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L239](https://github.com/videojs/video.js/blob/master/src/js/component.js#L239)
|
||||
|
||||
---
|
||||
|
||||
### init( player, options )
|
||||
|
||||
##### PARAMETERS:
|
||||
* __player__
|
||||
* __options__
|
||||
|
||||
_defined in_: [src/js/control-bar/volume-menu-button.js#L7](https://github.com/videojs/video.js/blob/master/src/js/control-bar/volume-menu-button.js#L7)
|
||||
|
||||
---
|
||||
|
||||
### initChildren()
|
||||
> Add and initialize default child components from options
|
||||
>
|
||||
> // when an instance of MyComponent is created, all children in options
|
||||
> // will be added to the instance by their name strings and options
|
||||
> MyComponent.prototype.options_.children = {
|
||||
> myChildComponent: {
|
||||
> myChildOption: true
|
||||
> }
|
||||
> }
|
||||
|
||||
_inherited from_: [src/js/component.js#L439](https://github.com/videojs/video.js/blob/master/src/js/component.js#L439)
|
||||
|
||||
---
|
||||
|
||||
### name()
|
||||
> Get the component's name. The name is often used to reference the component.
|
||||
>
|
||||
> var name = myComponent.name();
|
||||
|
||||
##### RETURNS:
|
||||
* `String`
|
||||
|
||||
_inherited from_: [src/js/component.js#L258](https://github.com/videojs/video.js/blob/master/src/js/component.js#L258)
|
||||
|
||||
---
|
||||
|
||||
### off( [type], [fn] )
|
||||
> Remove an event listener from the component's element
|
||||
>
|
||||
> myComponent.off("eventName", myFunc);
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` _(OPTIONAL)_ Event type. Without type it will remove all listeners.
|
||||
* __fn__ `Function` _(OPTIONAL)_ Event listener. Without fn it will remove all listeners for a type.
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L510](https://github.com/videojs/video.js/blob/master/src/js/component.js#L510)
|
||||
|
||||
---
|
||||
|
||||
### on( type, fn )
|
||||
> Add an event listener to this component's element
|
||||
>
|
||||
> var myFunc = function(){
|
||||
> var myPlayer = this;
|
||||
> // Do something when the event is fired
|
||||
> };
|
||||
>
|
||||
> myPlayer.on("eventName", myFunc);
|
||||
>
|
||||
> The context will be the component.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type e.g. 'click'
|
||||
* __fn__ `Function` The event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L496](https://github.com/videojs/video.js/blob/master/src/js/component.js#L496)
|
||||
|
||||
---
|
||||
|
||||
### one( type, fn )
|
||||
> Add an event listener to be triggered only once and then removed
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` Event type
|
||||
* __fn__ `Function` Event listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L522](https://github.com/videojs/video.js/blob/master/src/js/component.js#L522)
|
||||
|
||||
---
|
||||
|
||||
### options( obj )
|
||||
> Deep merge of options objects
|
||||
>
|
||||
> Whenever a property is an object on both options objects
|
||||
> the two properties will be merged using vjs.obj.deepMerge.
|
||||
>
|
||||
> This is used for merging options for child components. We
|
||||
> want it to be easy to override individual options on a child
|
||||
> component without having to rewrite all the other default options.
|
||||
>
|
||||
> Parent.prototype.options_ = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
|
||||
> 'childTwo': {},
|
||||
> 'childThree': {}
|
||||
> }
|
||||
> }
|
||||
> newOptions = {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'abc': '123' }
|
||||
> 'childTwo': null,
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
>
|
||||
> this.options(newOptions);
|
||||
>
|
||||
> RESULT
|
||||
>
|
||||
> {
|
||||
> children: {
|
||||
> 'childOne': { 'foo': 'baz', 'asdf': 'fdsa', 'abc': '123' },
|
||||
> 'childTwo': null, // Disabled. Won't be initialized.
|
||||
> 'childThree': {},
|
||||
> 'childFour': {}
|
||||
> }
|
||||
> }
|
||||
|
||||
##### PARAMETERS:
|
||||
* __obj__ `Object` Object whose values will be overwritten
|
||||
|
||||
##### RETURNS:
|
||||
* `Object` NEW merged object. Does not return obj1.
|
||||
|
||||
_inherited from_: [src/js/component.js#L169](https://github.com/videojs/video.js/blob/master/src/js/component.js#L169)
|
||||
|
||||
---
|
||||
|
||||
### player()
|
||||
> Return the component's player
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Player`
|
||||
|
||||
_inherited from_: [src/js/component.js#L116](https://github.com/videojs/video.js/blob/master/src/js/component.js#L116)
|
||||
|
||||
---
|
||||
|
||||
### ready( fn )
|
||||
> Bind a listener to the component's ready state
|
||||
>
|
||||
> Different from event listeners in that if the ready event has already happend
|
||||
> it will trigger the function immediately.
|
||||
|
||||
##### PARAMETERS:
|
||||
* __fn__ `Function` Ready listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L581](https://github.com/videojs/video.js/blob/master/src/js/component.js#L581)
|
||||
|
||||
---
|
||||
|
||||
### removeChild( component )
|
||||
> Remove a child component from this component's list of children, and the
|
||||
> child component's element from this component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __component__ `vjs.Component` Component to remove
|
||||
|
||||
_inherited from_: [src/js/component.js#L401](https://github.com/videojs/video.js/blob/master/src/js/component.js#L401)
|
||||
|
||||
---
|
||||
|
||||
### removeClass( classToRemove )
|
||||
> Remove a CSS class name from the component's element
|
||||
|
||||
##### PARAMETERS:
|
||||
* __classToRemove__ `String` Classname to remove
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L639](https://github.com/videojs/video.js/blob/master/src/js/component.js#L639)
|
||||
|
||||
---
|
||||
|
||||
### show()
|
||||
> Show the component element if hidden
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L649](https://github.com/videojs/video.js/blob/master/src/js/component.js#L649)
|
||||
|
||||
---
|
||||
|
||||
### trigger( type, event )
|
||||
> Trigger an event on an element
|
||||
>
|
||||
> myComponent.trigger('eventName');
|
||||
|
||||
##### PARAMETERS:
|
||||
* __type__ `String` The event type to trigger, e.g. 'click'
|
||||
* __event__ `Event|Object` The event object to be passed to the listener
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` self
|
||||
|
||||
_inherited from_: [src/js/component.js#L536](https://github.com/videojs/video.js/blob/master/src/js/component.js#L536)
|
||||
|
||||
---
|
||||
|
||||
### triggerReady()
|
||||
> Trigger the ready listeners
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component`
|
||||
|
||||
_inherited from_: [src/js/component.js#L600](https://github.com/videojs/video.js/blob/master/src/js/component.js#L600)
|
||||
|
||||
---
|
||||
|
||||
### width( [num], skipListeners )
|
||||
> Set or get the width of the component (CSS values)
|
||||
>
|
||||
> Video tag width/height only work in pixels. No percents.
|
||||
> But allowing limited percents use. e.g. width() will return number+%, not computed width
|
||||
|
||||
##### PARAMETERS:
|
||||
* __num__ `Number|String` _(OPTIONAL)_ Optional width number
|
||||
* __skipListeners__ `Boolean` Skip the 'resize' event trigger
|
||||
|
||||
##### RETURNS:
|
||||
* `vjs.Component` Returns 'this' if width was set
|
||||
* `Number|String` Returns the width if nothing was set
|
||||
|
||||
_inherited from_: [src/js/component.js#L707](https://github.com/videojs/video.js/blob/master/src/js/component.js#L707)
|
||||
|
||||
---
|
||||
|
||||
## EVENTS
|
||||
|
||||
### resize `EVENT`
|
||||
> Fired when the width and/or height of the component changes
|
||||
|
||||
_inherited from_: [src/js/component.js#L809](https://github.com/videojs/video.js/blob/master/src/js/component.js#L809)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,108 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs
|
||||
|
||||
__DEFINED IN__: [src/js/core.js#L26](https://github.com/videojs/video.js/blob/master/src/js/core.js#L26)
|
||||
|
||||
Doubles as the main function for users to create a player instance and also
|
||||
the main library object.
|
||||
|
||||
**ALIASES** videojs, _V_ (deprecated)
|
||||
|
||||
The `vjs` function can be used to initialize or retrieve a player.
|
||||
|
||||
var myPlayer = vjs('my_video_id');
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [PROPERTIES](#properties)
|
||||
- [options](#options)
|
||||
- [players](#players)
|
||||
|
||||
- CLASSES
|
||||
- [BigPlayButton](vjs.BigPlayButton.md)
|
||||
- [Button](vjs.Button.md)
|
||||
- [CaptionsButton](vjs.CaptionsButton.md)
|
||||
- [CaptionsTrack](vjs.CaptionsTrack.md)
|
||||
- [ChaptersButton](vjs.ChaptersButton.md)
|
||||
- [ChaptersTrack](vjs.ChaptersTrack.md)
|
||||
- [ChaptersTrackMenuItem](vjs.ChaptersTrackMenuItem.md)
|
||||
- [Component](vjs.Component.md)
|
||||
- [ControlBar](vjs.ControlBar.md)
|
||||
- [CoreObject](vjs.CoreObject.md)
|
||||
- [CurrentTimeDisplay](vjs.CurrentTimeDisplay.md)
|
||||
- [DurationDisplay](vjs.DurationDisplay.md)
|
||||
- [Flash](vjs.Flash.md)
|
||||
- [FullscreenToggle](vjs.FullscreenToggle.md)
|
||||
- [Html5](vjs.Html5.md)
|
||||
- [LoadProgressBar](vjs.LoadProgressBar.md)
|
||||
- [LoadingSpinner](vjs.LoadingSpinner.md)
|
||||
- [MediaLoader](vjs.MediaLoader.md)
|
||||
- [MediaTechController](vjs.MediaTechController.md)
|
||||
- [Menu](vjs.Menu.md)
|
||||
- [MenuButton](vjs.MenuButton.md)
|
||||
- [MenuItem](vjs.MenuItem.md)
|
||||
- [MuteToggle](vjs.MuteToggle.md)
|
||||
- [OffTextTrackMenuItem](vjs.OffTextTrackMenuItem.md)
|
||||
- [PlayProgressBar](vjs.PlayProgressBar.md)
|
||||
- [PlayToggle](vjs.PlayToggle.md)
|
||||
- [Player](vjs.Player.md)
|
||||
- [PosterImage](vjs.PosterImage.md)
|
||||
- [ProgressControl](vjs.ProgressControl.md)
|
||||
- [RemainingTimeDisplay](vjs.RemainingTimeDisplay.md)
|
||||
- [SeekBar](vjs.SeekBar.md)
|
||||
- [SeekHandle](vjs.SeekHandle.md)
|
||||
- [Slider](vjs.Slider.md)
|
||||
- [SliderHandle](vjs.SliderHandle.md)
|
||||
- [SubtitlesButton](vjs.SubtitlesButton.md)
|
||||
- [SubtitlesTrack](vjs.SubtitlesTrack.md)
|
||||
- [TextTrack](vjs.TextTrack.md)
|
||||
- [TextTrackButton](vjs.TextTrackButton.md)
|
||||
- [TextTrackDisplay](vjs.TextTrackDisplay.md)
|
||||
- [TextTrackMenuItem](vjs.TextTrackMenuItem.md)
|
||||
- [TimeDivider](vjs.TimeDivider.md)
|
||||
- [VolumeBar](vjs.VolumeBar.md)
|
||||
- [VolumeControl](vjs.VolumeControl.md)
|
||||
- [VolumeHandle](vjs.VolumeHandle.md)
|
||||
- [VolumeLevel](vjs.VolumeLevel.md)
|
||||
- [VolumeMenuButton](vjs.VolumeMenuButton.md)
|
||||
|
||||
- [METHODS](#methods)
|
||||
- [plugin](#plugin-name-init-)
|
||||
|
||||
---
|
||||
|
||||
## PROPERTIES
|
||||
|
||||
### options
|
||||
> Global Player instance options, surfaced from vjs.Player.prototype.options_
|
||||
> vjs.options = vjs.Player.prototype.options_
|
||||
> All options should use string keys so they avoid
|
||||
> renaming by closure compiler
|
||||
|
||||
_defined in_: [src/js/core.js#L77](https://github.com/videojs/video.js/blob/master/src/js/core.js#L77)
|
||||
|
||||
---
|
||||
|
||||
### players
|
||||
> Global player list
|
||||
|
||||
_defined in_: [src/js/core.js#L118](https://github.com/videojs/video.js/blob/master/src/js/core.js#L118)
|
||||
|
||||
---
|
||||
|
||||
## METHODS
|
||||
|
||||
### plugin( name, init )
|
||||
> the method for registering a video.js plugin
|
||||
|
||||
##### PARAMETERS:
|
||||
* __name__ `String` The name of the plugin
|
||||
* __init__ `Function` The function that is run when the player inits
|
||||
|
||||
_defined in_: [src/js/plugins.js#L7](https://github.com/videojs/video.js/blob/master/src/js/plugins.js#L7)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
<!-- GENERATED FROM SOURCE -->
|
||||
|
||||
# vjs.media
|
||||
|
||||
|
||||
---
|
||||
|
||||
## INDEX
|
||||
|
||||
- [UNDEFINED](#undefined)
|
||||
- [ApiMethods](#apimethods)
|
||||
|
||||
---
|
||||
|
||||
## UNDEFINED
|
||||
|
||||
### ApiMethods
|
||||
> List of default API methods for any MediaTechController
|
||||
|
||||
_defined in_: [src/js/media/media.js#L174](https://github.com/videojs/video.js/blob/master/src/js/media/media.js#L174)
|
||||
|
||||
---
|
||||
|
||||
@@ -0,0 +1,44 @@
|
||||
API
|
||||
===
|
||||
|
||||
The Video.js API allows you to interact with the video through JavaScript, whether the browser is playing the video through HTML5 video, Flash, or any other supported playback technologies.
|
||||
|
||||
Referencing the Player
|
||||
----------------------
|
||||
To use the API functions, you need access to the player object. Luckily this is easy to get. You just need to make sure your video tag has an ID. The example embed code has an ID of "example\_video_1". If you have multiple videos on one page, make sure every video tag has a unique ID.
|
||||
|
||||
```js
|
||||
var myPlayer = videojs('example_video_1');
|
||||
```
|
||||
|
||||
(If the player hasn't been initialized yet via the data-setup attribute or another method, this will also initialize the player.)
|
||||
|
||||
Wait Until the Player is Ready
|
||||
------------------------------
|
||||
The time it takes Video.js to set up the video and API will vary depending on the playback technology being used (HTML5 will often be much faster to load than Flash). For that reason we want to use the player's 'ready' function to trigger any code that requires the player's API.
|
||||
|
||||
```javascript
|
||||
videojs("example_video_1").ready(function(){
|
||||
var myPlayer = this;
|
||||
|
||||
// EXAMPLE: Start playing the video.
|
||||
myPlayer.play();
|
||||
|
||||
});
|
||||
```
|
||||
|
||||
API Methods
|
||||
-----------
|
||||
Now that you have access to a ready player, you can control the video, get values, or respond to video events. The Video.js API function names follow the [HTML5 media API](http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html). The main difference is that getter/setter functions are used for video properties.
|
||||
|
||||
```js
|
||||
|
||||
// setting a property on a bare HTML5 video element
|
||||
myVideoElement.currentTime = "120";
|
||||
|
||||
// setting a property on a Video.js player
|
||||
myPlayer.currentTime(120);
|
||||
|
||||
```
|
||||
|
||||
The full list of player API methods and events can be found in the [player API docs](../api/player.md).
|
||||
@@ -0,0 +1,59 @@
|
||||
Components
|
||||
===
|
||||
The Video.js player is built on top of a simple, custom UI components architecture. The player class and all control classes inherit from the Component class, or a subclass of Component.
|
||||
|
||||
```js
|
||||
videojs.Control = videojs.Component.extend();
|
||||
videojs.Button = videojs.Control.extend();
|
||||
videojs.PlayToggle = videojs.Button.extend();
|
||||
```
|
||||
|
||||
The UI component architecture makes it easier to add child components to a parent component and build up an entire user interface, like the controls for the Video.js player.
|
||||
|
||||
```js
|
||||
// Adding a new control to the player
|
||||
myPlayer.addChild('BigPlayButton');
|
||||
```
|
||||
|
||||
Every component has an associated DOM element, and when you add a child component, it inserts the element of that child into the element of the parent.
|
||||
|
||||
```js
|
||||
myPlayer.addChild('BigPlayButton');
|
||||
```
|
||||
|
||||
Results in:
|
||||
|
||||
```html
|
||||
<!-- Player Element -->
|
||||
<div class="video-js">
|
||||
<!-- BigPlayButton Element -->
|
||||
<div class="vjs-big-play-button"></div>
|
||||
</div>
|
||||
```
|
||||
|
||||
The actual default component structure of the Video.js player looks something like this:
|
||||
|
||||
```
|
||||
Player
|
||||
PosterImage
|
||||
TextTrackDisplay
|
||||
LoadingSpinner
|
||||
BigPlayButton
|
||||
ControlBar
|
||||
PlayToggle
|
||||
FullscreenToggle
|
||||
CurrentTimeDisplay
|
||||
TimeDivider
|
||||
DurationDisplay
|
||||
RemainingTimeDisplay
|
||||
ProgressControl
|
||||
SeekBar
|
||||
LoadProgressBar
|
||||
PlayProgressBar
|
||||
SeekHandle
|
||||
VolumeControl
|
||||
VolumeBar
|
||||
VolumeLevel
|
||||
VolumeHandle
|
||||
MuteToggle
|
||||
```
|
||||
@@ -1,26 +1,19 @@
|
||||
---
|
||||
layout: docs
|
||||
title: VideoJS Glossary
|
||||
description: Video.JS Glossary
|
||||
body_id: glossary
|
||||
body_class: docs subpage
|
||||
---
|
||||
|
||||
|
||||
Glossary
|
||||
========
|
||||
Terms related to web video.
|
||||
|
||||
### DOM (Document Object Model)
|
||||
The container of elements on the page that must be loaded before you can interact with the elements with through Javascript.
|
||||
http://en.wikipedia.org/wiki/Document_Object_Model
|
||||
|
||||
|
||||
### Flash Fallback
|
||||
The Flash video player (SWF) used to play a video when HTML5 isn't supported.
|
||||
|
||||
<a name="timerange"></a>
|
||||
|
||||
### TimeRange
|
||||
|
||||
<a name="html5-video"></a>
|
||||
|
||||
### HTML5 Video
|
||||
HTML is the markup language that makes up every page on the web. The newest version, HTML5, includes specifications for a video tag, that is meant to allow website developers to add a video to a page the same way they would add an image. In order for this to work, web browser developers (Mozilla, Apple, Microsoft, Google, Opera, etc.) have to build the video playback functionality into their browsers. The W3C has created directions on how video should work in browsers, and it’s up to browser developers to follow those directions, so that video works the same across all browsers. This doesn’t always happen thanks to technology, legal, and financial choices made by browser developers, but so far no one’s varying too far from the specifications. However the specifications are still being changed and refined, so browsers developers have to keep up with that as well.
|
||||
|
||||
@@ -28,7 +21,7 @@ Playing video in a web page may not seem so special since you can already view v
|
||||
|
||||
A prime example of this is the iPhone and iPad. Apple has decided not to support Flash on their mobile devices, but they do support HTML5 video. Since Flash is currently the most common way video is added to web pages, most web video (aside from YouTube who has a special relationship with Apple) can’t be viewed on the iPhone or iPad. These devices are very popular, so many web sites are switching to hybrid HTML5/Flash player setups (like VideoJS).
|
||||
|
||||
<a name="video-tag"></a>
|
||||
|
||||
### Video Tag
|
||||
There are a number of great resources that will give you an introduction to the video tag an how it is used including:
|
||||
|
||||
@@ -38,10 +31,9 @@ There are a number of great resources that will give you an introduction to the
|
||||
An if you really want to dig in, you can read the (W3C Spec)[http://www.w3.org/TR/html5/video.html]. (Warning - not for the faint of heart)
|
||||
|
||||
|
||||
<a name="skin"></a>
|
||||
### Skin
|
||||
"Skin" refers to the design of the player's controls, also sometimes called the chrome. With VideoJS, new skins can be built simply by creating a new stylesheet.
|
||||
|
||||
<a name="cdn"></a>
|
||||
|
||||
### Content Delivery Network (CDN)
|
||||
A network of servers around the world that host copies of a file. When your browser requests one of these files, the CDN automatically determines which server is closest to your location and delivers the file from there. This drastically increases delivery time, especially internationally.
|
||||
@@ -0,0 +1,114 @@
|
||||
Options
|
||||
=======
|
||||
|
||||
Setting Options
|
||||
---------------
|
||||
|
||||
The Video.js embed code is simply an HTML5 video tag, so for many of the options you can use the standard tag attributes to set the options.
|
||||
|
||||
```html
|
||||
<video controls autoplay preload="auto" ...>
|
||||
```
|
||||
|
||||
Alternatively, you can use the data-setup attribute to provide options in the [JSON](http://json.org/example.html) format. This is also how you would set options that aren't standard to the video tag.
|
||||
|
||||
```html
|
||||
<video data-setup='{ "controls": true, "autoplay": false, "preload": "auto" }'...>
|
||||
```
|
||||
|
||||
Finally, if you're not using the data-setup attribute to trigger the player setup, you can pass in an object with the player options as the second argument in the javascript setup function.
|
||||
|
||||
```js
|
||||
videojs("example_video_1", { "controls": true, "autoplay": false, "preload": "auto" });
|
||||
```
|
||||
|
||||
|
||||
Individual Options
|
||||
------------------
|
||||
|
||||
> ### Note on Video Tag Attributes ###
|
||||
> With HTML5 video tag attributes that can only be true or false (boolean), you simply include the attribute (no equals sign) to turn it on, or exclude it to turn it off. For example, to turn controls on:
|
||||
|
||||
WRONG
|
||||
```html
|
||||
<video controls="true" ...>
|
||||
```
|
||||
|
||||
RIGHT
|
||||
```html
|
||||
<video controls ...>
|
||||
```
|
||||
|
||||
> The biggest issue people run into is trying to set these values to false using false as the value (e.g. controls="false") which actually does the opposite and sets the value to true because the attribute is still included. If you need the attribute to include an equals sign for XHTML validation, you can set the attribute's value to the same as its name (e.g. controls="controls").
|
||||
|
||||
|
||||
### controls ###
|
||||
The controls option sets whether or not the player has controls that the user can interact with. Without controls the only way to start the video playing is with the autoplay attribute or through the API.
|
||||
|
||||
```html
|
||||
<video controls ...>
|
||||
or
|
||||
{ "controls": true }
|
||||
```
|
||||
|
||||
|
||||
### autoplay ###
|
||||
If autoplay is true, the video will start playing as soon as page is loaded (without any interaction from the user).
|
||||
NOT SUPPORTED BY APPLE iOS DEVICES. Apple blocks the autoplay functionality in an effort to protect it's customers from unwillingly using a lot of their (often expensive) monthly data plans. A user touch/click is required to start the video in this case.
|
||||
```html
|
||||
<video autoplay ...>
|
||||
or
|
||||
{ "autoplay": true }
|
||||
```
|
||||
|
||||
|
||||
### preload ###
|
||||
The preload attribute informs the browser whether or not the video data should begin downloading as soon as the video tag is loaded. The options are auto, metadata, and none.
|
||||
|
||||
'auto': Start loading the video immediately (if the browser agrees). Some mobile devices like iPhones and iPads will not preload the video in order to protect their users' bandwidth. This is why the value is called 'auto' and not something more final like 'true'.
|
||||
|
||||
'metadata': Load only the meta data of the video, which includes information like the duration and dimensions of the video.
|
||||
|
||||
'none': Don't preload any of the video data. This will wait until the user clicks play to begin downloading.
|
||||
|
||||
```html
|
||||
<video preload ...>
|
||||
or
|
||||
{ "preload": "auto" }
|
||||
```
|
||||
|
||||
|
||||
### poster ###
|
||||
The poster attribute sets the image that displays before the video begins playing. This is often a frame of the video or a custom title screen. As soon as the user clicks play the image will go away.
|
||||
```html
|
||||
<video poster="myPoster.jpg" ...>
|
||||
or
|
||||
{ "poster": "myPoster.jpg" }
|
||||
```
|
||||
|
||||
|
||||
### loop ###
|
||||
The loop attribute causes the video to start over as soon as it ends. This could be used for a visual affect like clouds in the background.
|
||||
```html
|
||||
<video loop ...>
|
||||
or
|
||||
{ "loop": "true" }
|
||||
```
|
||||
|
||||
|
||||
### width ###
|
||||
The width attribute sets the display width of the video.
|
||||
```html
|
||||
<video width="640" ...>
|
||||
or
|
||||
{ "width": 640 }
|
||||
```
|
||||
|
||||
|
||||
### height ###
|
||||
The height attribute sets the display height of the video.
|
||||
```html
|
||||
<video height="480" ...>
|
||||
or
|
||||
{ "height": 480 }
|
||||
```
|
||||
@@ -0,0 +1,41 @@
|
||||
Plugins
|
||||
=======
|
||||
If you've built something cool with Video.js, you can easily share it with the rest of the world by creating a plugin.
|
||||
|
||||
Step 1: Write Some Javascript
|
||||
-----------------------------
|
||||
You may have already done this step. Code up something interesting and then wrap it in a function. At the most basic level, that's all a video.js plugin is. By convention, plugins take a hash of options as their first argument:
|
||||
|
||||
function examplePlugin(options) {
|
||||
this.on('play', function(e) {
|
||||
console.log('playback has started!');
|
||||
});
|
||||
};
|
||||
|
||||
When it's activated, `this` will be the Video.js player your plugin is attached to. You can use anything you'd like in the [Video.js API](api.md) when you're writing a plugin: change the `src`, mess up the DOM, or listen for and emit your own events.
|
||||
|
||||
Step 2: Registering A Plugin
|
||||
-------------------------------
|
||||
It's time to give the rest of the world the opportunity to be awed by your genius. When your plugin is loaded, it needs to let Video.js know this amazing new functionality is now available:
|
||||
|
||||
vjs.plugin('examplePlugin', examplePlugin);
|
||||
|
||||
From this point on, your plugin will be added to the Video.js prototype and will show up as a property on every instance created. Make sure you choose a unique name that doesn't clash with any of the properties already in Video.js. Which leads us to...
|
||||
|
||||
Step 3: Using A Plugin
|
||||
----------------------
|
||||
There are two ways to initialize a plugin. If you're creating your video tag dynamically, you can specify the plugins you'd like to initialize with it and any options you want to pass to them:
|
||||
|
||||
vjs('vidId', {
|
||||
plugins: {
|
||||
examplePlugin: {
|
||||
exampleOption: true
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
If you've already initialized your video tag, you can activate a plugin at any time by calling its setup function directly:
|
||||
|
||||
video.examplePlugin({ exampleOption: true });
|
||||
|
||||
That's it. Head on over to the Video.js wiki and add your plugin to the list so everyone else can check it out.
|
||||
@@ -0,0 +1,88 @@
|
||||
Setup
|
||||
=====
|
||||
|
||||
Video.js is pretty easy to set up. It can take a matter of seconds to get the player up and working on your web page.
|
||||
|
||||
Step 1: Include the Video.js Javascript and CSS files in the head of your page.
|
||||
------------------------------------------------------------------------------
|
||||
|
||||
You can download the Video.js source and host it on your own servers, or use the free CDN hosted version. It's often recommended now to put JavaScript before the end body tag (</body>) instead of the head (<head>), but Video.js includes an 'HTML5 Shiv', which needs to be in the head for older IE versions to respect the video tag as a valid element.
|
||||
|
||||
> NOTE: If you're already using an HTML5 shiv like [Modernizr](http://modernizr.com/) you can include the Video.js JavaScript anywhere, however make sure your version of Modernizr includes the shiv for video.
|
||||
|
||||
> If you're not using something like Modernizr but still want to include Video.JS before the closing body tag, you can add your own shiv. Include this in the head of your document:
|
||||
|
||||
> ```html
|
||||
<script type="text/javascript">
|
||||
document.createElement('video');document.createElement('audio');
|
||||
</script>
|
||||
```
|
||||
|
||||
### CDN Version ###
|
||||
```html
|
||||
<link href="//vjs.zencdn.net/4.2/video-js.css" rel="stylesheet">
|
||||
<script src="//vjs.zencdn.net/4.2/video.js"></script>
|
||||
```
|
||||
|
||||
### Self Hosted. ###
|
||||
With the self hosted option you'll also want to update the location of the video-js.swf file.
|
||||
```html
|
||||
<link href="//example.com/path/to/video-js.css" rel="stylesheet">
|
||||
<script src="//example.com/path/to/video.js"></script>
|
||||
<script>
|
||||
videojs.options.flash.swf = "http://example.com/path/to/video-js.swf"
|
||||
</script>
|
||||
```
|
||||
|
||||
|
||||
Step 2: Add an HTML5 video tag to your page.
|
||||
--------------------------------------------
|
||||
With Video.js you just use an HTML5 video tag to embed a video. Video.js will then read the tag and make it work in all browsers, not just ones that support HTML5 video. Beyond the basic markup, Video.js needs a few extra pieces.
|
||||
|
||||
1. The 'data-setup' Atrribute tells Video.js to automatically set up the video when the page is ready, and read any options (in JSON format) from the attribute (see [options](options.md)). There are other methods for initializing the player, but this is the easiest.
|
||||
|
||||
2. The 'id' Attribute: Should be used and unique for every video on the same page.
|
||||
|
||||
3. The 'class' attribute contains two classes:
|
||||
- `video-js` applies styles that are required for Video.js functionality, like fullscreen and subtitles.
|
||||
- `vjs-default-skin` applies the default skin to the HTML controls, and can be removed or overridden to create your own controls design.
|
||||
|
||||
Otherwise include/exclude attributes, settings, sources, and tracks exactly as you would for HTML5 video.
|
||||
|
||||
```html
|
||||
<video id="example_video_1" class="video-js vjs-default-skin"
|
||||
controls preload="auto" width="640" height="264"
|
||||
poster="http://video-js.zencoder.com/oceans-clip.png"
|
||||
data-setup='{"example_option":true}'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
|
||||
</video>
|
||||
```
|
||||
|
||||
By default, the big play button is located in the upper left hand corner so it doesn't cover up the interesting parts of the poster. If you'd prefer to center the big play button, you can add an additional `vjs-big-play-centered` class to your video element. For example:
|
||||
|
||||
```html
|
||||
<video id="example_video_1" class="video-js vjs-default-skin vjs-big-play-centered"
|
||||
controls preload="auto" width="640" height="264"
|
||||
poster="http://video-js.zencoder.com/oceans-clip.png"
|
||||
data-setup='{"example_option":true}'>
|
||||
...
|
||||
</video>
|
||||
```
|
||||
|
||||
Alternative Setup for Dynamically Loaded HTML
|
||||
---------------------------------------------
|
||||
If your web page or application loads the video tag dynamically (ajax, appendChild, etc.), so that it may not exist when the page loads, you'll want to manually set up the player instead of relying on the data-setup attribute. To do this, first remove the data-setup attribute from the tag so there's no confusion around when the player is initialized. Next, run the following javascript some time after the Video.js javascript library has loaded, and after the video tag has been loaded into the DOM.
|
||||
```js
|
||||
videojs("example_video_1", {}, function(){
|
||||
// Player (this) is initialized and ready.
|
||||
});
|
||||
```
|
||||
|
||||
The first argument in the `videojs` function is the ID of your video tag. Replace it with your own.
|
||||
|
||||
The second argument is an options object. It allows you to set additional options like you can with the data-setup attribute.
|
||||
|
||||
The third argument is a 'ready' callback. Once Video.js has initialized it will call this function.
|
||||
|
||||
@@ -0,0 +1,28 @@
|
||||
Skins
|
||||
=====
|
||||
|
||||
The default Video.js skin is made using HTML and CSS, so there's no need to learn a complicated skinning language to update colors or even create an entirely new skin.
|
||||
|
||||
## Icons
|
||||
|
||||
New in version 4.0 is the use of font icons. All of the icons (play, pause, etc.) use the new custom font, which allows the icons to be scaled and colored just like any other text font.
|
||||
|
||||
All of the icons are available as variables in the [LESS](https://github.com/videojs/video.js/blob/master/src/css/video-js.less#L87-L99) source, making it easy to replace icons (such as the loading spinner). The easiest way to try this out is by using the [player skin designer](http://designer.videojs.com/).
|
||||
|
||||

|
||||
|
||||
## Customization
|
||||
|
||||
When you create a new skin, you can either override styles in the default skin:
|
||||
|
||||
```css
|
||||
.vjs-default-skin .vjs-play-progress { background: #900; }
|
||||
```
|
||||
|
||||
Or remove the 'vjs-default-skin' class from the video tag and create a new skin from scratch.
|
||||
|
||||
```html
|
||||
<video class="video-js my-custom-skin" ...>
|
||||
```
|
||||
|
||||
More custom skins will be available for download soon. If you have one you like you can share it by forking [this example on CodePen.io](http://codepen.io/heff/pen/EarCt), and adding a link on the [Skins wiki page](https://github.com/videojs/video.js/wiki/Skins).
|
||||
@@ -0,0 +1,68 @@
|
||||
Playback Technology ("Tech")
|
||||
============================
|
||||
Playback Technology refers to the specific browser or plugin technology used to play the video or audio. When using HTML5, the playback technology is the video or audio element. When using Flash, the playback technology is the specific Flash player used, e.g. Flowplayer, YouTube Player, video-js.swf, etc. (not just "Flash"). This could also include Silverlight, Quicktime, or any other plugin that will play back video in the browser, as long as there is an API wrapper written for it.
|
||||
|
||||
Essentially we're using HTML5 and plugins only as video decoders, and using HTML and JavaScript to create a consistent API and skinning experience across all of them.
|
||||
|
||||
Building an API Wrapper
|
||||
-----------------------
|
||||
We'll write a more complete guide on writing a wrapper soon, but for now the best resource is the [Video.js](https://github.com/zencoder/video-js/tree/master/src) source where you can see how both the HTML5 and video-js.swf API wrappers were created.
|
||||
|
||||
Required Methods
|
||||
----------------
|
||||
canPlayType
|
||||
play
|
||||
pause
|
||||
currentTime
|
||||
volume
|
||||
duration
|
||||
buffered
|
||||
supportsFullScreen
|
||||
|
||||
Required Events
|
||||
---------------
|
||||
loadstart
|
||||
play
|
||||
pause
|
||||
playing
|
||||
ended
|
||||
volumechange
|
||||
durationchange
|
||||
error
|
||||
|
||||
Optional Events (include if supported)
|
||||
--------------------------------------
|
||||
timeupdate
|
||||
progress
|
||||
enterFullScreen
|
||||
exitFullScreen
|
||||
|
||||
Adding Playback Technology
|
||||
==================
|
||||
When adding additional Tech to a video player, make sure to add the supported tech to the video object.
|
||||
|
||||
### Tag Method: ###
|
||||
<video data-setup='{"techOrder": ["html5", "flash", "other supported tech"]}'
|
||||
|
||||
### Object Method: ###
|
||||
videojs("videoID", {
|
||||
techOrder: ["html5", "flash", "other supported tech"]
|
||||
});
|
||||
|
||||
Flash Technology
|
||||
==================
|
||||
The Flash playback tech is a part of the default `techOrder`. You may notice undesirable playback behavior in browsers that are subject to using this playback tech, in particular when scrubbing and seeking within a video. This behavior is a result of Flash's progressive video playback.
|
||||
|
||||
Enabling Streaming Playback
|
||||
--------------------------------
|
||||
In order to force the Flash tech to choose streaming playback, you need to provide a valid streaming source **before other valid Flash video sources**. This is necessary because of the source selection algorithm, where playback tech chooses the first possible source object with a valid type. Valid streaming `type` values include `rtmp/mp4` and `rtmp/flv`. The streaming `src` value requires valid connection and stream strings, separated by an `&`. An example of supplying a streaming source through your HTML markup might look like:
|
||||
|
||||
<source src="rtmp://your.streaming.provider.net/cfx/st/&mp4:path/to/video.mp4" type="rtmp/mp4">
|
||||
<source src="http://your.static.provider.net/path/to/video.mp4" type="video/mp4">
|
||||
<source src="http://your.static.provider.net/path/to/video.webm" type="video/webm">
|
||||
|
||||
You may optionally use the last `/` as the separator between connection and stream strings, for example:
|
||||
|
||||
<source src="rtmp://your.streaming.provider.net/cfx/st/mp4:video.mp4" type="rtmp/mp4">
|
||||
|
||||
All four RTMP protocols are valid in the `src` (RTMP, RTMPT, RTMPE, and RTMPS).
|
||||
@@ -0,0 +1,225 @@
|
||||
Tracks
|
||||
======
|
||||
|
||||
Text Tracks are a function of HTML5 video for providing time triggered text to the viewer. Video.js makes tracks work across all browsers. There are currently five types of tracks:
|
||||
|
||||
- **Subtitles**: Translations of the dialogue in the video for when audio is available but not understood. Subtitles are shown over the video.
|
||||
- **Captions**: Transcription of the dialogue, sound effects, musical cues, and other audio information for when the viewer is deaf/hard of hearing, or the video is muted. Captions are also shown over the video.
|
||||
- **Chapters**: Chapter titles that are used to create navigation within the video. Typically they're in the form of a list of chapters that the viewer can click on to go to a specific chapter.
|
||||
- **Descriptions** (not supported yet): Text descriptions of what's happening in the video for when the video portion isn't available, because the viewer is blind, not using a screen, or driving and about to crash because they're trying to enjoy a video while driving. Descriptions are read by a screen reader or turned into a separate audio track.
|
||||
- **Metadata** (not supported yet): Tracks that have data meant for javascript to parse and do something with. These aren't shown to the user.
|
||||
|
||||
Creating the Text File
|
||||
----------------------
|
||||
Timed text requires a text file in [WebVTT](http://dev.w3.org/html5/webvtt/) format. This format defines a list of "cues" that have a start time, and end time, and text to display. [Microsoft has a builder](http://ie.microsoft.com/testdrive/Graphics/CaptionMaker/) that can help you get started on the file.
|
||||
|
||||
When creating captions, there's also additional [caption formatting techniques](http://www.theneitherworld.com/mcpoodle/SCC_TOOLS/DOCS/SCC_FORMAT.HTML#style) that would be good to use, like brackets around sound effects. [ sound effect ]
|
||||
|
||||
Adding to Video.js
|
||||
------------------
|
||||
Once you have your WebVTT file created, you can add it to Video.js using the track trag. Put your track track tag after all the source elements, and before any fallback content.
|
||||
|
||||
```html
|
||||
<video id="example_video_1" class="video-js vjs-default-skin"
|
||||
controls preload="auto" width="640" height="264"
|
||||
data-setup='{"example_option":true}'>
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
|
||||
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
|
||||
|
||||
<track kind="captions" src="http://example.com/path/to/captions.vtt" srclang="en" label="English" default>
|
||||
|
||||
</video>
|
||||
```
|
||||
|
||||
Track Attributes
|
||||
----------------
|
||||
Additional settings for track tags.
|
||||
|
||||
### kind
|
||||
One of the five track types listed above. Kind defaults to subtitles if no kind is included.
|
||||
|
||||
### label
|
||||
The label for the track that will be show to the user, for example in a menu that list the different languages available for subtitles.
|
||||
|
||||
### default
|
||||
The default attribute can be used to have a track default to showing. Otherwise the viewer would need to select their language from the captions or subtitles menu.
|
||||
NOTE: For chapters, default is required if you want the chapters menu to show.
|
||||
|
||||
### srclang
|
||||
The two-letter code (valid BCP 47 language tag) for the language of the text track, for example "en" for English. Here's a list of available language codes.
|
||||
|
||||
<table border="0" cellspacing="5" cellpadding="5">
|
||||
<tr>
|
||||
<td>
|
||||
|
||||
<table>
|
||||
<tr><th>ab<th><td>Abkhazian</td></tr>
|
||||
<tr><th>aa<th><td>Afar</td></tr>
|
||||
<tr><th>af<th><td>Afrikaans</td></tr>
|
||||
<tr><th>sq<th><td>Albanian</td></tr>
|
||||
<tr><th>am<th><td>Amharic</td></tr>
|
||||
<tr><th>ar<th><td>Arabic</td></tr>
|
||||
<tr><th>an<th><td>Aragonese</td></tr>
|
||||
<tr><th>hy<th><td>Armenian</td></tr>
|
||||
<tr><th>as<th><td>Assamese</td></tr>
|
||||
<tr><th>ay<th><td>Aymara</td></tr>
|
||||
<tr><th>az<th><td>Azerbaijani</td></tr>
|
||||
<tr><th>ba<th><td>Bashkir</td></tr>
|
||||
<tr><th>eu<th><td>Basque</td></tr>
|
||||
<tr><th>bn<th><td>Bengali (Bangla)</td></tr>
|
||||
<tr><th>dz<th><td>Bhutani</td></tr>
|
||||
<tr><th>bh<th><td>Bihari</td></tr>
|
||||
<tr><th>bi<th><td>Bislama</td></tr>
|
||||
<tr><th>br<th><td>Breton</td></tr>
|
||||
<tr><th>bg<th><td>Bulgarian</td></tr>
|
||||
<tr><th>my<th><td>Burmese</td></tr>
|
||||
<tr><th>be<th><td>Byelorussian (Belarusian)</td></tr>
|
||||
<tr><th>km<th><td>Cambodian</td></tr>
|
||||
<tr><th>ca<th><td>Catalan</td></tr>
|
||||
<tr><th>zh<th><td>Chinese (Simplified)</td></tr>
|
||||
<tr><th>zh<th><td>Chinese (Traditional)</td></tr>
|
||||
<tr><th>co<th><td>Corsican</td></tr>
|
||||
<tr><th>hr<th><td>Croatian</td></tr>
|
||||
<tr><th>cs<th><td>Czech</td></tr>
|
||||
<tr><th>da<th><td>Danish</td></tr>
|
||||
<tr><th>nl<th><td>Dutch</td></tr>
|
||||
<tr><th>en<th><td>English</td></tr>
|
||||
<tr><th>eo<th><td>Esperanto</td></tr>
|
||||
<tr><th>et<th><td>Estonian</td></tr>
|
||||
<tr><th>fo<th><td>Faeroese</td></tr>
|
||||
<tr><th>fa<th><td>Farsi</td></tr>
|
||||
<tr><th>fj<th><td>Fiji</td></tr>
|
||||
<tr><th>fi<th><td>Finnish</td></tr>
|
||||
</table>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
|
||||
<table>
|
||||
<tr><th>fr<th><td>French</td></tr>
|
||||
<tr><th>fy<th><td>Frisian</td></tr>
|
||||
<tr><th>gl<th><td>Galician</td></tr>
|
||||
<tr><th>gd<th><td>Gaelic (Scottish)</td></tr>
|
||||
<tr><th>gv<th><td>Gaelic (Manx)</td></tr>
|
||||
<tr><th>ka<th><td>Georgian</td></tr>
|
||||
<tr><th>de<th><td>German</td></tr>
|
||||
<tr><th>el<th><td>Greek</td></tr>
|
||||
<tr><th>kl<th><td>Greenlandic</td></tr>
|
||||
<tr><th>gn<th><td>Guarani</td></tr>
|
||||
<tr><th>gu<th><td>Gujarati</td></tr>
|
||||
<tr><th>ht<th><td>Haitian Creole</td></tr>
|
||||
<tr><th>ha<th><td>Hausa</td></tr>
|
||||
<tr><th>he<th><td>Hebrew</td></tr>
|
||||
<tr><th>hi<th><td>Hindi</td></tr>
|
||||
<tr><th>hu<th><td>Hungarian</td></tr>
|
||||
<tr><th>is<th><td>Icelandic</td></tr>
|
||||
<tr><th>io<th><td>Ido</td></tr>
|
||||
<tr><th>id<th><td>Indonesian</td></tr>
|
||||
<tr><th>ia<th><td>Interlingua</td></tr>
|
||||
<tr><th>ie<th><td>Interlingue</td></tr>
|
||||
<tr><th>iu<th><td>Inuktitut</td></tr>
|
||||
<tr><th>ik<th><td>Inupiak</td></tr>
|
||||
<tr><th>ga<th><td>Irish</td></tr>
|
||||
<tr><th>it<th><td>Italian</td></tr>
|
||||
<tr><th>ja<th><td>Japanese</td></tr>
|
||||
<tr><th>jv<th><td>Javanese</td></tr>
|
||||
<tr><th>kn<th><td>Kannada</td></tr>
|
||||
<tr><th>ks<th><td>Kashmiri</td></tr>
|
||||
<tr><th>kk<th><td>Kazakh</td></tr>
|
||||
<tr><th>rw<th><td>Kinyarwanda (Ruanda)</td></tr>
|
||||
<tr><th>ky<th><td>Kirghiz</td></tr>
|
||||
<tr><th>rn<th><td>Kirundi (Rundi)</td></tr>
|
||||
<tr><th>ko<th><td>Korean</td></tr>
|
||||
<tr><th>ku<th><td>Kurdish</td></tr>
|
||||
<tr><th>lo<th><td>Laothian</td></tr>
|
||||
<tr><th>la<th><td>Latin</td></tr>
|
||||
</table>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
|
||||
<table>
|
||||
<tr><th>lv<th><td>Latvian (Lettish)</td></tr>
|
||||
<tr><th>li<th><td>Limburgish ( Limburger)</td></tr>
|
||||
<tr><th>ln<th><td>Lingala</td></tr>
|
||||
<tr><th>lt<th><td>Lithuanian</td></tr>
|
||||
<tr><th>mk<th><td>Macedonian</td></tr>
|
||||
<tr><th>mg<th><td>Malagasy</td></tr>
|
||||
<tr><th>ms<th><td>Malay</td></tr>
|
||||
<tr><th>ml<th><td>Malayalam</td></tr>
|
||||
<tr><th>mt<th><td>Maltese</td></tr>
|
||||
<tr><th>mi<th><td>Maori</td></tr>
|
||||
<tr><th>mr<th><td>Marathi</td></tr>
|
||||
<tr><th>mo<th><td>Moldavian</td></tr>
|
||||
<tr><th>mn<th><td>Mongolian</td></tr>
|
||||
<tr><th>na<th><td>Nauru</td></tr>
|
||||
<tr><th>ne<th><td>Nepali</td></tr>
|
||||
<tr><th>no<th><td>Norwegian</td></tr>
|
||||
<tr><th>oc<th><td>Occitan</td></tr>
|
||||
<tr><th>or<th><td>Oriya</td></tr>
|
||||
<tr><th>om<th><td>Oromo (Afan, Galla)</td></tr>
|
||||
<tr><th>ps<th><td>Pashto (Pushto)</td></tr>
|
||||
<tr><th>pl<th><td>Polish</td></tr>
|
||||
<tr><th>pt<th><td>Portuguese</td></tr>
|
||||
<tr><th>pa<th><td>Punjabi</td></tr>
|
||||
<tr><th>qu<th><td>Quechua</td></tr>
|
||||
<tr><th>rm<th><td>Rhaeto-Romance</td></tr>
|
||||
<tr><th>ro<th><td>Romanian</td></tr>
|
||||
<tr><th>ru<th><td>Russian</td></tr>
|
||||
<tr><th>sm<th><td>Samoan</td></tr>
|
||||
<tr><th>sg<th><td>Sangro</td></tr>
|
||||
<tr><th>sa<th><td>Sanskrit</td></tr>
|
||||
<tr><th>sr<th><td>Serbian</td></tr>
|
||||
<tr><th>sh<th><td>Serbo-Croatian</td></tr>
|
||||
<tr><th>st<th><td>Sesotho</td></tr>
|
||||
<tr><th>tn<th><td>Setswana</td></tr>
|
||||
<tr><th>sn<th><td>Shona</td></tr>
|
||||
<tr><th>ii<th><td>Sichuan Yi</td></tr>
|
||||
<tr><th>sd<th><td>Sindhi</td></tr>
|
||||
</table>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
|
||||
<table>
|
||||
<tr><th>si<th><td>Sinhalese</td></tr>
|
||||
<tr><th>ss<th><td>Siswati</td></tr>
|
||||
<tr><th>sk<th><td>Slovak</td></tr>
|
||||
<tr><th>sl<th><td>Slovenian</td></tr>
|
||||
<tr><th>so<th><td>Somali</td></tr>
|
||||
<tr><th>es<th><td>Spanish</td></tr>
|
||||
<tr><th>su<th><td>Sundanese</td></tr>
|
||||
<tr><th>sw<th><td>Swahili (Kiswahili)</td></tr>
|
||||
<tr><th>sv<th><td>Swedish</td></tr>
|
||||
<tr><th>tl<th><td>Tagalog</td></tr>
|
||||
<tr><th>tg<th><td>Tajik</td></tr>
|
||||
<tr><th>ta<th><td>Tamil</td></tr>
|
||||
<tr><th>tt<th><td>Tatar</td></tr>
|
||||
<tr><th>te<th><td>Telugu</td></tr>
|
||||
<tr><th>th<th><td>Thai</td></tr>
|
||||
<tr><th>bo<th><td>Tibetan</td></tr>
|
||||
<tr><th>ti<th><td>Tigrinya</td></tr>
|
||||
<tr><th>to<th><td>Tonga</td></tr>
|
||||
<tr><th>ts<th><td>Tsonga</td></tr>
|
||||
<tr><th>tr<th><td>Turkish</td></tr>
|
||||
<tr><th>tk<th><td>Turkmen</td></tr>
|
||||
<tr><th>tw<th><td>Twi</td></tr>
|
||||
<tr><th>ug<th><td>Uighur</td></tr>
|
||||
<tr><th>uk<th><td>Ukrainian</td></tr>
|
||||
<tr><th>ur<th><td>Urdu</td></tr>
|
||||
<tr><th>uz<th><td>Uzbek</td></tr>
|
||||
<tr><th>vi<th><td>Vietnamese</td></tr>
|
||||
<tr><th>vo<th><td>Volapük</td></tr>
|
||||
<tr><th>wa<th><td>Wallon</td></tr>
|
||||
<tr><th>cy<th><td>Welsh</td></tr>
|
||||
<tr><th>wo<th><td>Wolof</td></tr>
|
||||
<tr><th>xh<th><td>Xhosa</td></tr>
|
||||
<tr><th>yi<th><td>Yiddish</td></tr>
|
||||
<tr><th>yo<th><td>Yoruba</td></tr>
|
||||
<tr><th>zu<th><td>Zulu</td></tr>
|
||||
</table>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
+27
-21
@@ -1,29 +1,35 @@
|
||||
---
|
||||
layout: docs
|
||||
title: Docs
|
||||
description: Video.JS Docs
|
||||
body_id: docs
|
||||
body_class: docs subpage
|
||||
---
|
||||
[Video.js homepage](http://videojs.com)
|
||||
|
||||
<h1>Start</h1>
|
||||
<h1>Video.js Documentation</h1>
|
||||
|
||||
The Video.js documentation is here to help you setup and use the player. These docs can be found and contributed to in the [Video.js library repository](https://github.com/zencoder/video-js/tree/master/docs).
|
||||
There are two categories of docs: [Guides](./guides/) and [API docs](./api/). Guides explain general topics and use cases (e.g. setup). API docs are automatically generated from the codebase and give specific details about functions, properties, and events.
|
||||
|
||||
### [Setup](/docs/setup)
|
||||
Check out the [5 second setup](/#setup) if you're just getting started. The setup documentation gives a deeper view of the additional methods you can use to trigger the player setup.
|
||||
(Corrections and additions welcome)
|
||||
|
||||
### [Options](/docs/options/)
|
||||
There are a number of options that can be used to change how the player behaves, starting with the HTML5 media options like autoplay and preload, and expanding to Video.JS specific options.
|
||||
## Guides
|
||||
|
||||
### [API](/docs/api/)
|
||||
The Video.js API allows you to control the video through javascript or trigger event listeners, whether the video is playing through HTML5, flash, or another playback technology.
|
||||
### Getting Started
|
||||
|
||||
### [Skins](/docs/skins/)
|
||||
You can change the look of the player across playback technologies just by editing a CSS file. The skins documentation gives you a intro to how the HTML and CSS of the default skin is put together.
|
||||
* [Setup](./guides/setup.md) - Check out the [5 second setup](http://videojs.com/#section5) if you're just getting started. The setup documentation gives a deeper view of the additional methods you can use to trigger the player setup.
|
||||
|
||||
### [Tech](/docs/tech/)
|
||||
A 'playback technology' is the term we're using to represent HTML5 video, Flash, and other video plugins, as well as other players like the YouTube player. Basically anything that has a unique API to audio or video. Additional playback technologies can be added relatively easily.
|
||||
* [Options](./guides/options.md) - There are a number of options that can be used to change how the player behaves, starting with the HTML5 media options like autoplay and preload, and expanding to Video.JS specific options.
|
||||
|
||||
### [Glossary](/docs/glossary/)
|
||||
Some helpful definitions.
|
||||
* [Tracks](./guides/tracks.md) - Text Tracks are used to display subtitles and captions, and add a menu for navigating between chapters in a video.
|
||||
|
||||
### Customizing
|
||||
|
||||
* [API](./guides/api.md) - The Video.js API allows you to control the video through javascript or trigger event listeners, whether the video is playing through HTML5, flash, or another playback technology.
|
||||
|
||||
* [Skins](./guides/skins.md) - You can change the look of the player across playback technologies just by editing a CSS file. The skins documentation gives you a intro to how the HTML and CSS of the default skin is put together.
|
||||
|
||||
* [Tech](./guides/tech.md) - A 'playback technology' is the term we're using to represent HTML5 video, Flash, and other video plugins, as well as other players like the YouTube player. Basically anything that has a unique API to audio or video. Additional playback technologies can be added relatively easily.
|
||||
|
||||
* [Plugins](./guides/plugins.md) - You can package up interesting Video.js customizations and reuse them elsewhere. Find out how to build your own plugin or use one created by someone else.
|
||||
|
||||
### Resources
|
||||
|
||||
* [Glossary](./guides/glossary.md) - Some helpful definitions.
|
||||
|
||||
## API Docs
|
||||
- The most relevant API doc is the [player API doc](./api/player.md).
|
||||
- [Full list of API Docs](./api/)
|
||||
|
||||
@@ -1,30 +0,0 @@
|
||||
---
|
||||
layout: docs
|
||||
title: Options
|
||||
description: Player Options
|
||||
body_id: options
|
||||
body_class: docs subpage
|
||||
---
|
||||
|
||||
Options
|
||||
=======
|
||||
|
||||
The Video.js emebed code is simply an HTML5 video tag with the video.js classes. So for many of the options you can use the standard tag attributes to set video.js options.
|
||||
|
||||
{% highlight html %}
|
||||
<video controls autoplay preload="auto" ...>
|
||||
{% endhighlight %}
|
||||
|
||||
Alternatively, you can use the data-setup attribute to provide options in the JSON format. This is also how you would set options that aren't standard to the video tag.
|
||||
|
||||
{% highlight html %}
|
||||
<video data-setup='{ "controls": true, "autoplay": false, "preload": "auto" }'...>
|
||||
{% endhighlight %}
|
||||
|
||||
Finally, if you're not using the data-setup attribute to trigger the player setup, you can pass in an object with the player options as the second argument in the setup function.
|
||||
|
||||
{% highlight javascript %}
|
||||
_V_("myVideoID", { "controls": true, "autoplay": false, "preload": "auto" });
|
||||
{% endhighlight %}
|
||||
|
||||
(More options documentation coming soon.)
|
||||
Alguns arquivos não foram exibidos porque demasiados arquivos foram alterados neste diff Mostrar Mais
Referência em uma Nova Issue
Bloquear um usuário