emacs
/
org-reveal
mirror of https://github.com/yjwen/org-reveal.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #417 from f279801/iframe_support 

Add iframe support for reveal_background
This commit is contained in:
Yujie Wen 2020-04-27 23:48:11 +08:00 committed by GitHub
parent 16b1f4c307 63c043f7b7
commit 7f8b78cc94
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 120 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
Readme.org
View File

@ -85,8 +85,9 @@
- [[Javascript Src Block][Javascript Src Block]]([[https://github.com/yjwen/org-reveal#javascript-src-block][gh]]) - [[Javascript Src Block][Javascript Src Block]]([[https://github.com/yjwen/org-reveal#javascript-src-block][gh]])
- [[Perl Src Block (not klipsified)][Perl Src Block (not klipsified)]]([[https://github.com/yjwen/org-reveal#perl-src-block-(not-klipsified)][gh]]) - [[Perl Src Block (not klipsified)][Perl Src Block (not klipsified)]]([[https://github.com/yjwen/org-reveal#perl-src-block-(not-klipsified)][gh]])
- [[Properties for Sub-headings][Properties for Sub-headings]]([[https://github.com/yjwen/org-reveal#properties-for-sub-headings][gh]]) - [[Properties for Sub-headings][Properties for Sub-headings]]([[https://github.com/yjwen/org-reveal#properties-for-sub-headings][gh]])
- [[My org-reveal presentation among many within the same Org-mode file][My org-reveal presentation among many within the same Org-mode file]]([[https://github.com/yjwen/org-reveal#my-org-reveal-presentation-among-many-within-the-same-org-mode-file][gh]]) - [[Customize iframe background slide][Customize iframe background slide]]([[https://github.com/yjwen/org-reveal#customize-iframe-background-slide][gh]])
- [[Thanks][Thanks]]([[https://github.com/yjwen/org-reveal#thanks][gh]]) - [[Thanks][Thanks]]([[https://github.com/yjwen/org-reveal#thanks][gh]])
* Reveal.js and Org-Reveal * Reveal.js and Org-Reveal
- *Reveal.js* is a tool for creating good-looking HTML presentations, - *Reveal.js* is a tool for creating good-looking HTML presentations,
@ -320,8 +321,8 @@ Available transitions are: default|cube|page|concave|zoom|linear|fade|none.
** Set Slide Background ** Set Slide Background
Slide background can be set to a color, an image or a repeating image Slide background can be set to a color, an image, a repeating image
array by setting heading properties. array or an iframe by setting heading properties.
*** Single Colored Background *** Single Colored Background
:PROPERTIES: :PROPERTIES:
@ -379,6 +380,25 @@ Available transitions are: default|cube|page|concave|zoom|linear|fade|none.
:END: :END:
#+END_SRC #+END_SRC
*** Iframe background
:PROPERTIES:
:reveal_background_iframe: https://hakim.se
:reveal_background: rgb(0,0,0)
:reveal_background_opacity: 0.8
:END:
When =iframe= is being used as slide background, the content of the slide will
be put inside a dedicated division. The other background options can be used to
configure this new division. The =reveal_background= supports both color and
image as a normal slide.
#+BEGIN_SRC org
:PROPERTIES:
:reveal_background_iframe: https://hakim.se
:reveal_background: rgb(0,0,0)
:reveal_background_opacity: 0.8
:END:
#+END_SRC
*** Title Slide Background Image *** Title Slide Background Image
To set the title slide's background image, please specify the To set the title slide's background image, please specify the
@ -908,19 +928,34 @@ to properties of sub-headings like:
This way, each org-reveal presentation can have its own settings. An example heading with corresponding settings would look like: This way, each org-reveal presentation can have its own settings. An example heading with corresponding settings would look like:
#+BEGIN_SRC org #+BEGIN_SRC org
* My org-reveal presentation among many within the same Org-mode file ,* My org-reveal presentation among many within the same Org-mode file
:PROPERTIES: :PROPERTIES:
:reveal_overview: t :reveal_overview: t
:EXPORT_AUTHOR: Test Author :EXPORT_AUTHOR: Test Author
:EXPORT_DATE: 2018-01-01 :EXPORT_DATE: 2018-01-01
:EXPORT_TITLE: My Title :EXPORT_TITLE: My Title
:EXPORT_EMAIL: Test@example.com :EXPORT_EMAIL: Test@example.com
:EXPORT_OPTIONS: num:nil toc:nil reveal_keyboard:t reveal_overview:t :EXPORT_OPTIONS: num:nil toc:nil reveal_keyboard:t reveal_overview:t
:EXPORT_REVEAL_HLEVEL: 3 :EXPORT_REVEAL_HLEVEL: 3
:EXPORT_REVEAL_MARGIN: 200 :EXPORT_REVEAL_MARGIN: 200
:END: :END:
#+END_SRC #+END_SRC
** Customize iframe background slide
:PROPERTIES:
:reveal_background_iframe: https://hakim.se
:reveal_background: rgb(0,0,0)
:reveal_background_opacity: 0.8
:reveal_background_position: absolute
:reveal_extra_attr: height: 200px; bottom: -700px; border-radius: 10px; padding: 20px
:END:
#+REVEAL_HTML: <smaller>
#+BEGIN_SRC org
:reveal_background_position: absolute
:reveal_extra_attr: height: 200px; bottom: -700px; border-radius: 10px; padding: 20px
#+END_SRC
#+REVEAL_HTML: </smaller>
* Thanks * Thanks
Courtesy to: Courtesy to:

96
ox-reveal.el
View File

@ -385,6 +385,13 @@ exporter."
(format "<aside class=\"notes\">\n%s\n</aside>\n" contents)) (format "<aside class=\"notes\">\n%s\n</aside>\n" contents))
(org-html-special-block special-block contents info)))) (org-html-special-block special-block contents info))))
(defun org-reveal-is-background-img (info)
"Check if a background string is an image format or not."
(and info
(string-match-p
"\\(\\(^\\(http\\|https\\|file\\)://\\)\\|\\(\\\.\\(svg\\|png\\|jpg\\|jpeg\\|gif\\|bmp\\)\\([?#\\\s]\\|$\\)\\)\\)"
info)))
(defun org-reveal-slide-section-tag (headline info for-split) (defun org-reveal-slide-section-tag (headline info for-split)
"Generate the <section> tag for a slide." "Generate the <section> tag for a slide."
(let* ((preferred-id (or (org-element-property :CUSTOM_ID headline) (let* ((preferred-id (or (org-element-property :CUSTOM_ID headline)
@ -394,30 +401,65 @@ exporter."
(default-slide-background-position (plist-get info :reveal-default-slide-background-position)) (default-slide-background-position (plist-get info :reveal-default-slide-background-position))
(default-slide-background-repeat (plist-get info :reveal-default-slide-background-repeat)) (default-slide-background-repeat (plist-get info :reveal-default-slide-background-repeat))
(default-slide-background-transition (plist-get info :reveal-default-slide-background-transition)) (default-slide-background-transition (plist-get info :reveal-default-slide-background-transition))
) (slide-background-iframe (org-element-property :REVEAL_BACKGROUND_IFRAME headline))
(format "<section %s%s>\n" )
(org-html--make-attribute-string (if slide-background-iframe
`(:id ,(concat org-reveal-slide-id-head ;; for iframe, we will wrap the slide in a new div
preferred-id ;; all the background configuration of the original slide will be used for this new div
(if for-split "-split" "")) (format "<section %s data-background-interactive>\n<div %s>\n"
:class ,(org-element-property :HTML_CONTAINER_CLASS headline) (org-html--make-attribute-string
:data-transition ,(org-element-property :REVEAL_DATA_TRANSITION headline) `(:id ,(concat org-reveal-slide-id-head
:data-state ,(org-element-property :REVEAL_DATA_STATE headline) preferred-id
:data-background ,(or (org-element-property :REVEAL_BACKGROUND headline) (if for-split "-split" ""))
default-slide-background) :class ,(org-element-property :HTML_CONTAINER_CLASS headline)
:data-background-size ,(or (org-element-property :REVEAL_BACKGROUND_SIZE headline) :data-transition ,(org-element-property :REVEAL_DATA_TRANSITION headline)
default-slide-background-size) :data-state ,(org-element-property :REVEAL_DATA_STATE headline)
:data-background-position ,(or (org-element-property :REVEAL_BACKGROUND_POSITION headline) :data-background-iframe ,slide-background-iframe))
default-slide-background-position) (concat
:data-background-repeat ,(or (org-element-property :REVEAL_BACKGROUND_REPEAT headline) "style=\""
default-slide-background-repeat) (let ((attr (or (org-element-property :REVEAL_BACKGROUND headline)
:data-background-transition ,(or (org-element-property :REVEAL_BACKGROUND_TRANS headline) default-slide-background)))
default-slide-background-transition) (if (org-reveal-is-background-img attr)
:data-background-opacity (format "background-image: url('%s'); " attr)
,(or (org-element-property :REVEAL_BACKGROUND_OPACITY headline) (if-format "background: %s; " attr)))
(plist-get info :reveal-default-slide-background-opacity)))) (let ((attr (or (org-element-property :REVEAL_BACKGROUND_REPEAT headline)
(let ((extra-attrs (org-element-property :REVEAL_EXTRA_ATTR headline))) default-slide-background-repeat)))
(if-format " %s" extra-attrs))))) (if-format "background-repeat: %s; " attr))
(let ((attr (or (org-element-property :REVEAL_BACKGROUND_SIZE headline)
default-slide-background)))
(if-format "background-size: %s; " attr))
(let ((attr (or (org-element-property :REVEAL_BACKGROUND_POSITION headline)
default-slide-background)))
(if-format "position: %s; " attr))
(let ((attr (or (org-element-property :REVEAL_BACKGROUND_OPACITY headline)
default-slide-background)))
(if-format "opacity: %s; " attr))
(let ((extra-attrs (org-element-property :REVEAL_EXTRA_ATTR headline)))
(if-format "%s;" extra-attrs))
"\""))
(format "<section %s%s>\n"
(org-html--make-attribute-string
`(:id ,(concat org-reveal-slide-id-head
preferred-id
(if for-split "-split" ""))
:class ,(org-element-property :HTML_CONTAINER_CLASS headline)
:data-transition ,(org-element-property :REVEAL_DATA_TRANSITION headline)
:data-state ,(org-element-property :REVEAL_DATA_STATE headline)
:data-background ,(or (org-element-property :REVEAL_BACKGROUND headline)
default-slide-background)
:data-background-size ,(or (org-element-property :REVEAL_BACKGROUND_SIZE headline)
default-slide-background-size)
:data-background-position ,(or (org-element-property :REVEAL_BACKGROUND_POSITION headline)
default-slide-background-position)
:data-background-repeat ,(or (org-element-property :REVEAL_BACKGROUND_REPEAT headline)
default-slide-background-repeat)
:data-background-transition ,(or (org-element-property :REVEAL_BACKGROUND_TRANS headline)
default-slide-background-transition)
:data-background-opacity
,(or (org-element-property :REVEAL_BACKGROUND_OPACITY headline)
(plist-get info :reveal-default-slide-background-opacity))))
(let ((extra-attrs (org-element-property :REVEAL_EXTRA_ATTR headline)))
(if-format " %s" extra-attrs))))))
;; Copied from org-html-headline and modified to embed org-reveal ;; Copied from org-html-headline and modified to embed org-reveal
;; specific attributes. ;; specific attributes.
@ -483,7 +525,11 @@ holding contextual information."
(concat (concat
;; Slide footer if any ;; Slide footer if any
footer-div footer-div
"</section>\n</section>\n"))))))) (if (org-element-property :REVEAL_BACKGROUND_IFRAME headline)
"</div>")
"</section>\n</section>\n")
(if (org-element-property :REVEAL_BACKGROUND_IFRAME headline)
"</div>")))))))
(defgroup org-export-reveal nil (defgroup org-export-reveal nil
"Options for exporting Orgmode files to reveal.js HTML pressentations." "Options for exporting Orgmode files to reveal.js HTML pressentations."