Skip to content

Rewrite - Standalone frame #582

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mattheu wants to merge 35 commits into
base: master
Choose a base branch
from
Open

Rewrite - Standalone frame #582

Show file tree
Hide file tree
Changes from 31 commits
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
175e739
First pass at rewrite
mattheu Feb 9, 2016
bf37e46
Rewrite 1
mattheu Feb 22, 2016
dc331f1
Update
mattheu Feb 27, 2016
b906b48
Second pass at rewrite
mattheu Feb 28, 2016
5634c85
Refactor to use standalone frame
mattheu Feb 28, 2016
1670d5e
Escape bad regex
mattheu Feb 29, 2016
b8dc371
Hide back link when updating
mattheu Feb 29, 2016
73a91fb
Better naming
mattheu Feb 29, 2016
1c4ae1b
Update tests
mattheu Feb 29, 2016
3852378
Rename var
mattheu Feb 29, 2016
e7e08f6
Don't bundle core files
mattheu Feb 29, 2016
7cc50f8
docs in gruntfile
mattheu Feb 29, 2016
526f194
Cleanup
mattheu Feb 29, 2016
d28752c
Revert file rename to make nicer diff
mattheu Feb 29, 2016
23c0f8a
delete WIP file
mattheu Feb 29, 2016
520be2b
Don't bundle core files
mattheu Feb 29, 2016
a69ac03
docs in gruntfile
mattheu Feb 29, 2016
4197cb9
Don't bundle core files for tests
mattheu Feb 29, 2016
893393a
Merge branch 'master' of github.com:wp-shortcake/shortcake into dont-…
mattheu Feb 29, 2016
48b5903
Fix failing test
mattheu Feb 29, 2016
6a775bf
Remove new scripts
mattheu Feb 29, 2016
4227c86
remove wp-backbone
mattheu Feb 29, 2016
70a3f2d
install WP for JS tests
mattheu Feb 29, 2016
d71fb98
Consolidate before_scripts
mattheu Feb 29, 2016
5d94c45
Merge branch 'master' of github.com:wp-shortcake/shortcake into dont-…
mattheu Feb 29, 2016
2e07314
Use test WP install
mattheu Feb 29, 2016
ef58741
Don't run jasmine as part of standard scripts task
mattheu Feb 29, 2016
6d6d28c
Allow passing abspath as an option
mattheu Feb 29, 2016
68109b7
Merge branch 'dont-bundle-wp-scripts' into rewrite-2-standalone-frame
mattheu Feb 29, 2016
2404222
Merge in #551
mattheu Feb 29, 2016
4a3d453
Tabs not spaces
mattheu Feb 29, 2016
a0486e3
Merge branch 'master' of github.com:wp-shortcake/shortcake into rewri…
mattheu Mar 3, 2016
adcc210
If no abspath provided, read from environment variable
mattheu Mar 3, 2016
6c2ffa1
Fix JS error
mattheu Mar 3, 2016
4eaf48b
Make sure all strings are localized
mattheu Mar 3, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .travis.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ cache:

before_script:
- |
if [[ "$WP_TRAVISCI" == "travis:phpunit" ]] ; then
if [[ "$WP_TRAVISCI" == "travis:phpunit" ]] || [[ "$WP_TRAVISCI" == "travis:js-tests" ]]; then
bash bin/install-wp-tests.sh wordpress_test root '' localhost $WP_VERSION
fi
- |
Expand Down
23 changes: 15 additions & 8 deletions Gruntfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,12 @@ module.exports = function( grunt ) {

'use strict';
var remapify = require('remapify');
var banner = '/**\n * <%= pkg.homepage %>\n * Copyright (c) <%= grunt.template.today("yyyy") %>\n * This file is generated automatically. Do not edit.\n */\n';
var banner = '/**\n * <%= pkg.homepage %>\n * Copyright (c) <%= grunt.template.today("yyyy") %>\n * This file is generated automatically. Do not edit.\n */\n';

// Path to WordPress install. Either absoloute or relative to this plugin.
// Change this by passing --abspath="new/path" as a grunt option.
var abspath = grunt.option( "abspath" ) ? grunt.option( "abspath" ) : '/tmp/wordpress';
Copy link
Contributor

@danielbachhuber danielbachhuber Mar 2, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it be possible to sniff the WP_DEVELOP_DIR environment variable too, so it works interchangeably with how PHPUnit tests work?

Copy link
Contributor Author

@mattheu mattheu Mar 3, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've added this too. Prioritiy is

  1. If passing abspath use that. (Allows running tests without setting up full test install)
  2. If environment var defined use that
  3. Else use /tmp/wordpress


// Project configuration
grunt.initConfig( {

Expand Down Expand Up @@ -135,12 +140,14 @@ module.exports = function( grunt ) {
specs: 'js-tests/build/specs.js',
helpers: 'js-tests/build/helpers.js',
vendor: [
'js-tests/vendor/jquery.js',
'js-tests/vendor/underscore.js',
'js-tests/vendor/backbone.js',
'js-tests/vendor/wp-shortcode.js',
'js-tests/vendor/wp-util.js',
'js-tests/vendor/wp-editors.js',
abspath + '/wp-includes/js/jquery/jquery.js',
abspath + '/wp-includes/js/underscore.min.js',
abspath + '/wp-includes/js/backbone.min.js',
abspath + '/wp-includes/js/wp-util.js',
abspath + '/wp-includes/js/shortcode.js',
abspath + '/wp-admin/js/editor.js',
abspath + '/wp-includes/js/media-models.js',
abspath + '/wp-includes/js/media-views.js',
'js-tests/vendor/mock-ajax.js',
],
}
Expand Down Expand Up @@ -196,7 +203,7 @@ module.exports = function( grunt ) {
grunt.loadNpmTasks( 'grunt-contrib-jasmine' );
grunt.loadNpmTasks( 'grunt-contrib-jshint' );

grunt.registerTask( 'scripts', [ 'browserify', 'jasmine', 'jshint' ] );
grunt.registerTask( 'scripts', [ 'browserify', 'jshint' ] );
grunt.registerTask( 'styles', [ 'sass', 'postcss' ] );
grunt.registerTask( 'default', [ 'scripts', 'styles' ] );
grunt.registerTask( 'i18n', ['addtextdomain', 'makepot'] );
Expand Down
119 changes: 72 additions & 47 deletions css/sass/shortcode-ui.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,60 +16,85 @@

}

.add-shortcode-list {
padding: 0 10px;

.shortcode-list-item {
margin: 10px;
float: left;
-webkit-box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.1 );
box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.1 );
background: #eee;
cursor: pointer;
position: relative;
text-align: center;
width: 150px;
height: 150px;
.button-shortcode-ui-insert span {
display: inline-block;
width: 18px;
height: 18px;
vertical-align: text-top;
margin: -2px 7px 0 -3px;
left: -2px;
color: #82878c;
}

.insert-shortcode-list {

.add-shortcode-list {
padding: 0 10px;

.add-shortcode-list-item-icon {
.shortcode-list-item {
margin: 10px;
float: left;
-webkit-box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.1 );
box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.1 );
background: #eee;
cursor: pointer;
position: relative;
height: 120px;
font-size: 64px;
text-align: center;
width: 150px;
height: 150px;

.add-shortcode-list-item-icon {
position: relative;
height: 120px;
font-size: 64px;

.dashicons,
img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: inherit;
line-height: inherit;
width: auto;
height: auto;
max-width: 80%;
max-height: 80%;
}

.dashicons,
img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: inherit;
line-height: inherit;
width: auto;
height: auto;
max-width: 80%;
max-height: 80%;
}

.add-shortcode-list-item-title {
box-sizing: border-box;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
margin: 0;
line-height: 1.2;
padding: 8px;
overflow: hidden;
max-height: 100%;
word-wrap: break-word;
text-align: center;
font-weight: bold;
background: rgba( 255, 255, 255, 0.8 );
-webkit-box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 );
box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 );
}
}
}

.add-shortcode-list-item-title {
box-sizing: border-box;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
margin: 0;
line-height: 1.2;
padding: 8px;
overflow: hidden;
max-height: 100%;
word-wrap: break-word;
text-align: center;
font-weight: bold;
background: rgba( 255, 255, 255, 0.8 );
-webkit-box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 );
box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 );
}
&.has-search {
padding-top: 25px;
}

.search {
position: absolute;
top: 0px;
right: 10px;
width: 100%;
max-width: 300px;
}

}
Expand Down
2 changes: 2 additions & 0 deletions css/shortcode-ui-editor-styles.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion css/shortcode-ui-editor-styles.css.map
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

45 changes: 34 additions & 11 deletions css/shortcode-ui.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion css/shortcode-ui.css.map
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 14 additions & 0 deletions inc/class-shortcode-ui.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,7 @@ private function __construct() {
private function setup_actions() {
add_action( 'admin_enqueue_scripts', array( $this, 'action_admin_enqueue_scripts' ) );
add_action( 'wp_enqueue_editor', array( $this, 'action_wp_enqueue_editor' ) );
add_action( 'media_buttons', array( $this, 'action_media_buttons' ) );
add_action( 'wp_ajax_bulk_do_shortcode', array( $this, 'handle_ajax_bulk_do_shortcode' ) );
add_filter( 'wp_editor_settings', array( $this, 'filter_wp_editor_settings' ), 10, 2 );
}
Expand Down Expand Up @@ -273,10 +274,23 @@ public function action_wp_enqueue_editor() {
do_action( 'shortcode_ui_loaded_editor' );
}

/**
* Output an "Add Post Element" button with the media buttons.
*/
public function action_media_buttons( $editor_id ) {
printf( '<button type="button" class="button shortcake-add-post-element" data-editor="%s">' .
'<span class="wp-media-buttons-icon dashicons dashicons-migrate"></span> %s' .
'</button>',
esc_attr( $editor_id ),
esc_html__( 'Add Post Element', 'shortcode-ui' )
);
}

/**
* Output required underscore.js templates in the footer
*/
public function action_admin_print_footer_scripts() {

echo $this->get_view( 'media-frame' ); // WPCS: xss ok
echo $this->get_view( 'list-item' ); // WPCS: xss ok
echo $this->get_view( 'edit-form' ); // WPCS: xss ok
Expand Down
1 change: 0 additions & 1 deletion inc/templates/edit-form.tpl.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
<script type="text/html" id="tmpl-shortcode-default-edit-form">
<form class="edit-shortcode-form">
<p><a href="#" class="edit-shortcode-form-cancel">&#8592; <?php esc_html_e( 'Back to list', 'shortcode-ui' ); ?></a></p>

<div class="edit-shortcode-form-fields shortcode-ui-edit-{{ data.model.attributes.shortcode_tag }}"></div>
</form>
</script>
Expand Down
Loading