WordPress.org
Get WordPress

Plugin Directory

Changeset 2175652


Ignore:
Timestamp:
10/18/2019 02:21:13 PM (6 years ago)
Author:
iseulde
Message:

v0.0.10

Location:
slide/trunk
Files:
1 added
7 edited

Legend:

Unmodified
Added
Removed

  • slide/trunk/common.css

    r2171722 r2175652  
    1 section.wp-block-slide-slide {
    2     padding: 0.2em !important;
     1.wp-block-slide-slide {
     2    box-sizing: border-box;
    33    line-height: 1.3;
    44}
    55
    6 section.wp-block-slide-slide h1,
    7 section.wp-block-slide-slide h2,
    8 section.wp-block-slide-slide h3,
    9 section.wp-block-slide-slide h4,
    10 section.wp-block-slide-slide h5,
    11 section.wp-block-slide-slide h6 {
     6.wp-block-slide-slide * {
     7    box-sizing: inherit;
     8}
     9
     10.wp-block-slide-slide h1,
     11.wp-block-slide-slide h2,
     12.wp-block-slide-slide h3,
     13.wp-block-slide-slide h4,
     14.wp-block-slide-slide h5,
     15.wp-block-slide-slide h6 {
    1216    line-height: 1.2;
    1317    word-wrap: break-word;
    … …  
    1519}
    1620
    17 section.wp-block-slide-slide h1 {
     21.wp-block-slide-slide h1 {
    1822    font-size: 2.5em;
    1923}
    2024
    21 section.wp-block-slide-slide h2 {
     25.wp-block-slide-slide h2 {
    2226    font-size: 1.6em;
    2327}
    2428
    25 section.wp-block-slide-slide h3 {
     29.wp-block-slide-slide h3 {
    2630    font-size: 1.3em;
    2731}
    2832
    29 section.wp-block-slide-slide h4 {
     33.wp-block-slide-slide h4 {
    3034    font-size: 1em;
    3135}
    3236
    33 section.wp-block-slide-slide p {
     37.wp-block-slide-slide p {
    3438    margin: 20px 0;
    3539}

  • slide/trunk/index.css

    r2174452 r2175652  
    5050}
    5151
     52body {
     53    counter-reset: slidecounter;
     54}
     55
     56div[data-type="slide/slide"]:before {
     57    content: counter( slidecounter );
     58    counter-increment: slidecounter;
     59    font-size: 24px;
     60}
     61
     62div.is-selected[data-type="slide/slide"]:before {
     63    content: '';
     64}
     65
    5266.block-editor-default-block-appender textarea.block-editor-default-block-appender__content {
    5367    font-size: inherit;
    … …  
    5973}
    6074
    61 section.wp-block-slide-slide {
     75.wp-block-slide-slide__body {
     76    position: relative;
     77    padding: 50px;
     78    overflow: hidden;
    6279    outline: 1px dashed currentColor;
    63     width: 1060px !important;
    64     height: 700px !important;
    65     padding: calc( 50px + 0.2em ) !important;
     80}
     81
     82.wp-block-slide-slide {
     83    position: relative;
     84    width: 960px !important;
     85    height: 720px !important;
     86    padding: 0.2em;
    6687    display: flex;
    6788    flex-direction: column;
    6889    justify-content: center;
     90    outline: 1px dashed currentColor;
    6991}
    7092
    … …  
    7799}
    78100
     101.wp-block-slide-slide__background iframe {
     102    width: 100%;
     103    height: 100%;
     104    max-height: 100%;
     105    max-width: 100%;
     106    pointer-events: none;
     107}
     108
     109.is-selected .wp-block-slide-slide__background iframe {
     110    pointer-events: all;
     111}
     112
    79113.wp-block-slide-slide .fragment {
    80114    opacity: 0.5;
    81115}
     116
     117div[data-type="slide/slide"] div[data-block] > .components-notice {
     118    margin: 0;
     119}
     120
     121/* Hide appender displayed if a block or previous block is selected. */
     122.block-editor-inner-blocks .block-editor-block-list__block.is-selected + .block-list-appender,
     123.is-selected .block-editor-inner-blocks .block-editor-block-list__block + .block-list-appender {
     124    display: none;
     125}
     126
     127/* Show appender if it's at the end of a list */
     128.block-editor-inner-blocks .block-editor-block-list__block.is-selected + .block-list-appender:last-child {
     129    display: block;
     130    height: 0;
     131    margin-top: 0;
     132    margin-bottom: 0;
     133}

  • slide/trunk/index.js

    r2175315 r2175652  
    1919  const { PluginDocumentSettingPanel } = editPost;
    2020  const { useSelect, useDispatch, subscribe, select, dispatch } = data;
    21   const { TextareaControl, ColorPicker, PanelBody, RangeControl, SelectControl, ToggleControl, Button, FocalPointPicker, ExternalLink } = components;
     21  const { TextareaControl, ColorPicker, PanelBody, RangeControl, SelectControl, ToggleControl, Button, FocalPointPicker, ExternalLink, Notice, TextControl, RadioControl } = components;
    2222  const { MediaUpload, __experimentalGradientPickerControl, InnerBlocks, InspectorControls, RichTextToolbarButton } = blockEditor;
    2323  const { addQueryArgs } = url;
    … …  
    3939  const controlsKey = 'presentation-controls';
    4040  const progressKey = 'presentation-progress';
    41   const cssPrefix = '.block-editor-block-list__layout .block-editor-block-list__block[data-type="slide/slide"]';
     41  const widthKey = 'presentation-width';
     42  const horizontalPaddingKey = 'presentation-horizontal-padding';
     43  const verticalPaddingKey = 'presentation-vertical-padding';
    4244
    4345  const CodeEditor = memo(({ onChange, ...props }) => {
    … …  
    8082
    8183    const slide = createBlock('slide/slide', {}, [
    82       createBlock(block.name, block.attributes)
     84      block.name === 'core/paragraph'
     85        ? createBlock('core/heading')
     86        : createBlock(block.name, block.attributes)
    8387    ]);
    8488
    … …  
    98102        meta: { ...meta, [key]: value }
    99103      });
    100       const rules = {
    101         color: meta[colorKey] || '#000',
     104
     105      const bodyRules = {
    102106        'background-color': meta[bgColorKey] || '#fff',
    103107        'background-image': meta[backgroundGradientKey] || 'none',
     108        color: meta[colorKey] || '#000',
    104109        'font-size': (meta[fontSizeKey] || '42') + 'px',
    105110        'font-family': meta[fontFamilyKey] || 'Helvetica, sans-serif'
     111      };
     112
     113      const rules = {
     114        width: meta[widthKey] ? meta[widthKey] + 'px !important' : undefined,
     115        'padding-top': meta[verticalPaddingKey] ? meta[verticalPaddingKey] : '0.2em',
     116        'padding-bottom': meta[verticalPaddingKey] ? meta[verticalPaddingKey] : '0.2em',
     117        'padding-left': meta[horizontalPaddingKey] ? meta[horizontalPaddingKey] : '0.2em',
     118        'padding-right': meta[horizontalPaddingKey] ? meta[horizontalPaddingKey] : '0.2em'
    106119      };
    107120
    … …  
    113126      };
    114127
    115       console.log(meta[fontFamilyUrlKey]);
    116 
    117128      return [
     129        ...Object.keys(bodyRules).map((key) => {
     130          return e(
     131            'style',
     132            null,
     133            `.wp-block-slide-slide__body {${key}:${bodyRules[key]}}`
     134          );
     135        }),
    118136        ...Object.keys(rules).map((key) => {
    119137          return e(
    120138            'style',
    121139            null,
    122             `${cssPrefix} section {${key}:${rules[key]}}`
     140            `.wp-block-slide-slide {${key}:${rules[key]}}`
    123141          );
    124142        }),
    … …  
    127145            'style',
    128146            null,
    129             `${cssPrefix} section .wp-block-slide-slide__background {${key}:${backgroundRules[key]}}`
     147            `.wp-block-slide-slide__background {${key}:${backgroundRules[key]}}`
    130148          );
    131149        }),
    … …  
    140158          null,
    141159          (meta[fontFamilyHeadingUrlKey] ? `@import url("${meta[fontFamilyHeadingUrlKey]}");` : '') +
    142           `${cssPrefix} section h1, ${cssPrefix} section h2, ${cssPrefix} section h3, ${cssPrefix} section h4, ${cssPrefix} section h5, ${cssPrefix} section h6 { font-family: ${meta[fontFamilyHeadingKey]} }`
     160          `.wp-block-slide-slide h1, .wp-block-slide-slide h2, .wp-block-slide-slide h3, .wp-block-slide-slide h4, .wp-block-slide-slide h5, .wp-block-slide-slide h6 { font-family: ${meta[fontFamilyHeadingKey]} }`
     161        ),
     162        !!meta[widthKey] && e(
     163          'style',
     164          null,
     165          `.editor-styles-wrapper .editor-writing-flow { width: ${parseInt(meta[widthKey], 10) + 130}px !important; }`
     166        ),
     167        e(
     168          PluginDocumentSettingPanel,
     169          {
     170            name: 'slide-dimensions',
     171            title: __('Setup', 'slide'),
     172            icon: 'editor-expand'
     173          },
     174          e(RadioControl, {
     175            selected: meta[widthKey] === '1280' ? '16:9' : '',
     176            options: [
     177              { label: __('Standard 4:3'), value: '' },
     178              { label: __('Widescreen 16:9'), value: '16:9' }
     179            ],
     180            onChange: (value) => {
     181              editPost({
     182                meta: {
     183                  [widthKey]: value === '16:9' ? '1280' : ''
     184                }
     185              });
     186            }
     187          }),
     188          e(TextControl, {
     189            label: __('Horizontal Padding'),
     190            placeholder: '0.2em',
     191            value: meta[horizontalPaddingKey],
     192            onChange: (value) => updateMeta(value, horizontalPaddingKey)
     193          }),
     194          e(TextControl, {
     195            label: __('Vertical Padding'),
     196            placeholder: '0.2em',
     197            value: meta[verticalPaddingKey],
     198            onChange: (value) => updateMeta(value, verticalPaddingKey)
     199          })
    143200        ),
    144201        e(
    … …  
    449506      backgroundOpacity: {
    450507        type: 'string'
     508      },
     509      hidden: {
     510        type: 'boolean'
     511      },
     512      backgroundIframeUrl: {
     513        type: 'string'
    451514      }
    452515    },
    … …  
    465528            PanelBody,
    466529            {
    467               title: __('Slide Notes', 'slide'),
     530              title: __('Speaker Notes', 'slide'),
    468531              icon: 'edit',
    469532              initialOpen: false
    … …  
    472535              label: __('Anything you want to remember.', 'slide'),
    473536              value: attributes.notes,
    474               onChange: (notes) => setAttributes({ notes })
     537              onChange: (notes) => setAttributes({ notes }),
     538              rows: 10
    475539            })
    476540          ),
    … …  
    598662              })
    599663            })
     664          ),
     665          e(
     666            PanelBody,
     667            {
     668              title: __('Background Iframe', 'slide'),
     669              icon: 'format-image',
     670              initialOpen: false
     671            },
     672            e(TextControl, {
     673              label: __('Iframe URL'),
     674              value: attributes.backgroundIframeUrl,
     675              onChange: (backgroundIframeUrl) => setAttributes({ backgroundIframeUrl })
     676            }),
     677            e('br'), e('br'),
     678            !!attributes.backgroundIframeUrl && e(RangeControl, {
     679              label: __('Opacity', 'slide'),
     680              value: attributes.backgroundOpacity ? parseInt(attributes.backgroundOpacity, 10) : undefined,
     681              min: 0,
     682              max: 100,
     683              initialPosition: 100,
     684              onChange: (value) => setAttributes({
     685                backgroundOpacity: value + ''
     686              })
     687            })
     688          ),
     689          e(
     690            PanelBody,
     691            {
     692              title: __('Visibility', 'slide'),
     693              icon: 'visibility',
     694              initialOpen: false
     695            },
     696            e(ToggleControl, {
     697              label: __('Hide Slide', 'slide'),
     698              checked: attributes.hidden,
     699              onChange: (hidden) => setAttributes({ hidden })
     700            })
    600701          )
    601702        ),
    602         e(
    603           'section',
    604           {
    605             className,
     703        attributes.hidden && e(
     704          Notice,
     705          { status: 'warning', isDismissible: false },
     706          'This slide is hidden'
     707        ),
     708        e(
     709          'div',
     710          {
     711            className: 'wp-block-slide-slide__body',
    606712            style: {
    607713              color: attributes.color || undefined,
    … …  
    620726                opacity: attributes.backgroundOpacity ? attributes.backgroundOpacity / 100 : undefined
    621727              }
    622             }
     728            },
     729            !!attributes.backgroundIframeUrl && e('iframe', {
     730              src: attributes.backgroundIframeUrl
     731            })
    623732          ),
    624           e(InnerBlocks)
     733          e(
     734            'section',
     735            { className },
     736            e(InnerBlocks)
     737          )
    625738        )
    626739      );
    627740    },
    628741    save: ({ attributes }) => e(
    629       'section',
     742      attributes.hidden ? 'div' : 'section',
    630743      {
    631744        style: {
    632           color: attributes.color || undefined
     745          color: attributes.color || undefined,
     746          display: attributes.hidden ? 'none' : undefined
    633747        },
    634748        'data-background-color': attributes.backgroundColor || undefined,
    635749        'data-background-image': attributes.backgroundUrl ? attributes.backgroundUrl : undefined,
    636750        'data-background-position': attributes.focalPoint ? `${attributes.focalPoint.x * 100}% ${attributes.focalPoint.y * 100}%` : undefined,
    637         'data-background-opacity': attributes.backgroundOpacity ? attributes.backgroundOpacity / 100 : undefined
     751        'data-background-opacity': attributes.backgroundOpacity ? attributes.backgroundOpacity / 100 : undefined,
     752        'data-background-iframe': attributes.backgroundIframeUrl ? attributes.backgroundIframeUrl : undefined
    638753      },
    639754      e(InnerBlocks.Content)

  • slide/trunk/index.php

    r2175315 r2175652  
    55 * Plugin URI:  https://wordpress.org/plugins/slide/
    66 * Description: Allows you to create presentations with the block editor.
    7  * Version:     0.0.9
     7 * Version:     0.0.10
    88 * Author:      Ella van Durpe
    99 * Author URI:  https://ellavandurpe.com
    … …  
    173173}, 99999 );
    174174
    175 add_action( 'load-post.php', function() {
    176     if ( get_current_screen()->post_type !== 'presentation' ) {
    177         return;
    178     }
    179 
    180     remove_editor_styles();
    181 }, 99999 );
    182 
    183 add_action( 'load-post-new.php', function() {
    184     if ( get_current_screen()->post_type !== 'presentation' ) {
    185         return;
    186     }
    187 
    188     remove_editor_styles();
    189 }, 99999 );
     175foreach ( array(
     176    'load-post.php',
     177    'load-post-new.php',
     178) as $tag ) {
     179    add_action( $tag, function() {
     180        if ( get_current_screen()->post_type !== 'presentation' ) {
     181            return;
     182        }
     183
     184        remove_editor_styles();
     185        remove_theme_support( 'editor-color-palette' );
     186        remove_theme_support( 'editor-font-sizes' );
     187    }, 99999 );
     188}
    190189
    191190add_action( 'admin_bar_menu', function ( $wp_admin_bar ) {
    … …  
    206205    }
    207206
    208     return "<!-- wp:slide/slide -->\n<section class=\"wp-block-slide-slide\"></section>\n<!-- /wp:slide/slide -->";
     207    return file_get_contents( __DIR__ . '/default-content.html' );
    209208}, 10, 2 );

  • slide/trunk/readme.md

    r2175315 r2175652  
    66    Requires PHP:      5.6
    77    Tested up to:      5.3
    8     Stable tag:        0.0.9
     8    Stable tag:        0.0.10
    99    License:           GPL-2.0-or-later
    1010    License URI:       http://www.gnu.org/licenses/gpl-2.0.html

  • slide/trunk/register.php

    r2175315 r2175652  
    6868    'controls',
    6969    'progress',
     70    'width',
     71    'horizontal-padding',
     72    'vertical-padding',
    7073) as $key ) {
    7174    register_post_meta( 'presentation', "presentation-$key", array(

  • slide/trunk/template.php

    r2175315 r2175652  
    7272        }
    7373
     74        section.wp-block-slide-slide {
     75            padding-top: <?php echo get_post_meta( get_the_ID(), 'presentation-vertical-padding', true ) ?: '0.2em'; ?> !important;
     76            padding-bottom: <?php echo get_post_meta( get_the_ID(), 'presentation-vertical-padding', true ) ?: '0.2em'; ?> !important;
     77            padding-left: <?php echo get_post_meta( get_the_ID(), 'presentation-horizontal-padding', true ) ?: '0.2em'; ?> !important;
     78            padding-right: <?php echo get_post_meta( get_the_ID(), 'presentation-horizontal-padding', true ) ?: '0.2em'; ?> !important;
     79        }
     80
    7481        .reveal .slides {
    7582            text-align: inherit;
    … …  
    114121            preloadIframes: true,
    115122            hideAddressBar: true,
     123            height: 720,
     124            width: <?php echo get_post_meta( get_the_ID(), 'presentation-width', true ) ?: '960'; ?>,
     125            margin: 0.08,
    116126        } );
    117127        window.addEventListener( 'DOMContentLoaded', function() {
Note: See TracChangeset for help on using the changeset viewer.