Adds media and jcrop scripts. temporaly remove dequeing for admin css. Adds higher z-index to media upload modal.
This commit is contained in:
Mateus Machado Luna
parent
36ff71ca0b
commit
c6e42c964b
|
|
@ -57,46 +57,51 @@ class Admin {
|
|||
wp_enqueue_style( 'tainacan-admin-page', $TAINACAN_BASE_URL . '/assets/css/tainacan-admin.css' );
|
||||
|
||||
$undesired_wp_styles = [
|
||||
'admin-menu',
|
||||
'admin-bar',
|
||||
'code-editor',
|
||||
'color-picker',
|
||||
'customize-controls',
|
||||
'customize-nav-menus',
|
||||
'customize-widgets',
|
||||
'dashboard',
|
||||
'dashicons',
|
||||
'deprecated-media',
|
||||
'edit',
|
||||
'wp-pointer',
|
||||
'farbtastic',
|
||||
'forms',
|
||||
'common',
|
||||
'install',
|
||||
'wp-auth-check',
|
||||
'site-icon',
|
||||
'buttons',
|
||||
'l10n',
|
||||
'list-tables',
|
||||
'login',
|
||||
'media',
|
||||
'nav-menus',
|
||||
'revisions',
|
||||
'themes',
|
||||
'widgets',
|
||||
'wp-admin'
|
||||
//'admin-menu',
|
||||
//'admin-bar',
|
||||
//'code-editor',
|
||||
//'color-picker',
|
||||
//'customize-controls',
|
||||
//'customize-nav-menus',
|
||||
//'customize-widgets',
|
||||
//'dashboard',
|
||||
//'dashicons',
|
||||
//'deprecated-media',
|
||||
//'edit',
|
||||
//'wp-pointer',
|
||||
//'farbtastic',
|
||||
//'forms',
|
||||
//'common',
|
||||
//'install',
|
||||
//'wp-auth-check',
|
||||
//'site-icon',
|
||||
//'buttons',
|
||||
//'l10n',
|
||||
//'list-tables',
|
||||
//'login',
|
||||
//'media',
|
||||
//'nav-menus',
|
||||
//'revisions',
|
||||
//'themes',
|
||||
//'widgets',
|
||||
//'wp-admin'
|
||||
];
|
||||
|
||||
wp_dequeue_style( $undesired_wp_styles );
|
||||
wp_deregister_style( $undesired_wp_styles );
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
function add_admin_js() {
|
||||
global $TAINACAN_BASE_URL;
|
||||
|
||||
wp_enqueue_script( 'tainacan-user-admin', $TAINACAN_BASE_URL . '/assets/user_admin-components.js', [], null, true );
|
||||
|
||||
wp_enqueue_media();
|
||||
wp_enqueue_script('jcrop');
|
||||
|
||||
wp_enqueue_script( 'tainacan-user-admin', $TAINACAN_BASE_URL . '/assets/user_admin-components.js', [], null, true );
|
||||
|
||||
$settings = $this->get_admin_js_localization_params();
|
||||
|
||||
wp_localize_script( 'tainacan-user-admin', 'tainacan_plugin', $settings );
|
||||
|
|
|
|||
|
|
@ -67,6 +67,44 @@
|
|||
</div>
|
||||
</b-field>
|
||||
|
||||
<button
|
||||
id="frame-uploader"
|
||||
class="buttton"
|
||||
@click="openFrameUploader($event)">Enviar</button>
|
||||
|
||||
|
||||
<!-- Your image container, which can be manipulated with js -->
|
||||
<div class="custom-img-container">
|
||||
<img
|
||||
v-if="you_have_img"
|
||||
:src="your_img_src"
|
||||
alt=""
|
||||
style="max-width:100%;">
|
||||
</div>
|
||||
|
||||
<!-- Your add & remove image links -->
|
||||
<p class="hide-if-no-js">
|
||||
<a
|
||||
class="upload-custom-img"
|
||||
:class="{ 'hidden': you_have_img, 'hidden' : !you_have_img}"
|
||||
:href="upload_link">
|
||||
Set custom image
|
||||
</a>
|
||||
<a
|
||||
class="delete-custom-img"
|
||||
:class="{'hidden' : !you_have_img, 'visible' : you_have_img }"
|
||||
href="#">
|
||||
Remove this image
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<!-- A hidden input to set and post the chosen image id -->
|
||||
<input
|
||||
class="custom-img-id"
|
||||
name="custom-img-id"
|
||||
type="hidden"
|
||||
:value="your_img_id">
|
||||
|
||||
<!-- Cover Image-------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
|
|
@ -228,7 +266,7 @@
|
|||
@focus="clearErrors('slug')"/>
|
||||
</b-field>
|
||||
|
||||
<!-- Attachments -------------------------------- -->
|
||||
<!-- Form submit -------------------------------- -->
|
||||
<div class="field is-grouped form-submit">
|
||||
<div class="control">
|
||||
<button
|
||||
|
|
@ -296,7 +334,15 @@ export default {
|
|||
coverPageEditPath: '',
|
||||
editFormErrors: {},
|
||||
formErrorMessage: '',
|
||||
isNewCollection: false
|
||||
isNewCollection: false,
|
||||
// Fream Uploader variables
|
||||
frameUploader: undefined,
|
||||
your_img_src: '',
|
||||
your_img_id: '',
|
||||
you_have_img: false,
|
||||
upload_link: '',
|
||||
custom_img_id: ''
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -476,6 +522,42 @@ export default {
|
|||
this.coverPage = {};
|
||||
this.coverPageTitle = '';
|
||||
this.form.cover_page_id = '';
|
||||
},
|
||||
openFrameUploader(event) {
|
||||
event.preventDefault();
|
||||
|
||||
// If the media frame already exists, reopen it.
|
||||
if ( this.frameUploader ) {
|
||||
this.frameUploader.open();
|
||||
return;
|
||||
}
|
||||
|
||||
// Create a new media frame
|
||||
this.frameUploader = wp.media.frames.frame_uploader = wp.media({
|
||||
title: 'Select or Upload Media Of Your Chosen Persuasion',
|
||||
button: {
|
||||
text: 'Use this media'
|
||||
},
|
||||
multiple: false,
|
||||
|
||||
});
|
||||
|
||||
wp.media.view.settings.post = {
|
||||
id: this.collectionId,
|
||||
featuredImageId: this.collection.featured_img_id
|
||||
}
|
||||
|
||||
//console.log(wp.wp_get_image_editor())
|
||||
|
||||
this.frameUploader.on('select', () => {
|
||||
|
||||
let media = this.frameUploader.state().get( 'selection' ).first().toJSON();
|
||||
|
||||
console.log(media);
|
||||
|
||||
});
|
||||
|
||||
this.frameUploader.open();
|
||||
}
|
||||
|
||||
},
|
||||
|
|
|
|||
|
|
@ -111,7 +111,7 @@ export default {
|
|||
transition: max-width 0.2s linear;
|
||||
max-width: $side-menu-width;
|
||||
z-index: 99;
|
||||
|
||||
.menu { padding-top: 0px; }
|
||||
.menu-header {
|
||||
background-color: rgba(0,0,0,0.1);
|
||||
height: $header-height;
|
||||
|
|
|
|||
|
|
@ -31,6 +31,17 @@ html {
|
|||
font-family: $family-sans-serif;
|
||||
}
|
||||
|
||||
.media-modal {
|
||||
left: 130px;
|
||||
top: 130px;
|
||||
bottom: 130px;
|
||||
right: 130px;
|
||||
z-index: 99999999999 !important;
|
||||
}
|
||||
.media-modal-backdrop {
|
||||
z-index: 9999999 !important;
|
||||
}
|
||||
|
||||
/* Rules for sizing the icon. */
|
||||
.material-icons.md-18 { font-size: 18px; }
|
||||
.material-icons.md-24 { font-size: 24px; }
|
||||
|
|
|
|||
Loading…
Reference in New Issue