From ccc1aa7825236b800411bfdf95ffa714da59552b Mon Sep 17 00:00:00 2001 From: thawk Date: Sat, 14 Aug 2021 16:42:00 +0800 Subject: [PATCH 01/10] add relative move and rotate to rel plugin --- examples/3D-positions/index.html | 169 + examples/index.html | 1 + js/impress.js | 506 +- karma.conf.js | 3 + package-lock.json | 8521 ++++++++++++++++- package.json | 4 +- qunit_test_runner.html | 3 + src/plugins/rel/README.md | 29 + src/plugins/rel/rel.js | 506 +- test/plugins/rel/padding_tests.js | 151 + .../rel/padding_tests_presentation.html | 63 + test/plugins/rel/rotation_tests.js | 92 + .../rel/rotation_tests_presentation.html | 78 + 13 files changed, 10028 insertions(+), 98 deletions(-) create mode 100644 examples/3D-positions/index.html create mode 100644 test/plugins/rel/padding_tests.js create mode 100644 test/plugins/rel/padding_tests_presentation.html create mode 100644 test/plugins/rel/rotation_tests.js create mode 100644 test/plugins/rel/rotation_tests_presentation.html diff --git a/examples/3D-positions/index.html b/examples/3D-positions/index.html new file mode 100644 index 000000000..475dd9c33 --- /dev/null +++ b/examples/3D-positions/index.html @@ -0,0 +1,169 @@ + + + + + relative rotations + + + + + +
+
+
+

Demo of data-rel-position

+

This demo use data-rel-position="relative"
+ and data-rel-rotate-x/y/z
+ to easy 3D positioning of slides.

+
+
+ +
Front +

There's two nested box here.

+
+
Inside Front
+
Inside Right
+
Right
+
Back
+
Inside Back
+
Inside Top
+
Top
+
Left
+
Inside Left
+
Inside Bottom
+
Bottom
+ +
+

Slide one

+

This is a ring of 8 slides.

+

It's easy constucted with data-rel-position="relative" without calculates the coordinates of all slides.

+
+ +
+

Slide two

+

The position of this slide is calculated as relatived position and rotation of the first slide.

+

The following slides don't need to set any position attributes, they are inherit from this slide.

+
+ +
+

Slide three

+
+ +
+

Slide four

+
+ +
+

Slide five

+
+ +
+

Slide six

+
+ +
+

Slide seven

+
+ +
+

Slide eight

+
+ +
+

Slide one

+

This is another ring of slides.

+

Except for the this slide, its code is just cloned from the yellow ring.

+

Just change the position of first slide, all the following slides are position relatived to it.

+
+ +
+

Slide two

+
+ +
+

Slide three

+
+ +
+

Slide four

+
+ +
+

Slide five

+
+ +
+

Slide six

+
+ +
+

Slide seven

+
+ +
+

Slide eight

+
+
+ +
+
+ + + + + diff --git a/examples/index.html b/examples/index.html index 1e5924b3f..f10ca60a1 100644 --- a/examples/index.html +++ b/examples/index.html @@ -5,6 +5,7 @@

Example presentations