Skip to content
This repository has been archived by the owner on Feb 1, 2021. It is now read-only.

Commit

Permalink
Redone display function of block (fixes #31, fixes #27, fixes #19, fixes
Browse files Browse the repository at this point in the history 
 #3)
  • Loading branch information
Kristian Kosorin committed Sep 28, 2019
1 parent d8a823e commit d25a17e
Show file tree
Hide file tree
Showing 9 changed files with 219 additions and 88 deletions.
3 changes: 2 additions & 1 deletion plugin/admin/editor.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,8 @@ function file_selection() {
*/
function get_folder_content( $service, $folder = null ) {
if ( ! isset( $folder ) ) {
$folder = end( \Sgdd\Admin\Options\Options::$root_path->get() );
$root_path = \Sgdd\Admin\Options\Options::$root_path->get();
$folder = end( $root_path );
}

$result = [];
Expand Down
14 changes: 10 additions & 4 deletions plugin/admin/options/class-options.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,10 @@ class Options {
public static $embed_width;
public static $embed_height;

public static $size_unit;
public static $folder_type;

public static $list_width;
public static $grid_cols;

public static function init() {
$url = wp_parse_url( get_site_url() );
Expand All @@ -29,9 +32,12 @@ public static function init() {

self::$root_path = new \Sgdd\Admin\Options\OptionTypes\PathField( 'root_path', '', 'basic', 'path_selection', [] );

self::$embed_width = new \Sgdd\Admin\Options\OptionTypes\IntegerField( 'embed_width', __( 'Width', 'skaut-google-drive-documents' ), 'advanced', 'embed', '50' );
self::$embed_height = new \Sgdd\Admin\Options\OptionTypes\IntegerField( 'embed_height', __( 'Height', 'skaut-google-drive-documents' ), 'advanced', 'embed', '50' );
self::$embed_width = new \Sgdd\Admin\Options\OptionTypes\IntegerField( 'embed_width', __( 'Width', 'skaut-google-drive-documents' ), 'advanced', 'embed', '800' );
self::$embed_height = new \Sgdd\Admin\Options\OptionTypes\IntegerField( 'embed_height', __( 'Height', 'skaut-google-drive-documents' ), 'advanced', 'embed', '600' );

self::$folder_type = new \Sgdd\Admin\Options\OptionTypes\SelectField( 'folder_type', __( 'Folder type', 'skaut-google-drive-documents' ), 'advanced', 'embed', 'list' );

self::$size_unit = new \Sgdd\Admin\Options\OptionTypes\SelectField( 'size_unit', __( 'Units', 'skaut-google-drive-documents' ), 'advanced', 'embed', 'percentage' );
self::$list_width = new \Sgdd\Admin\Options\OptionTypes\IntegerField( 'list_width', __( 'List width', 'skaut-google-drive-documents' ), 'advanced', 'embed', '800' );
self::$grid_cols = new \Sgdd\Admin\Options\OptionTypes\IntegerField( 'grid_cols', __( 'Grid columns', 'skaut-google-drive-documents' ), 'advanced', 'embed', '3' );
}
}
4 changes: 2 additions & 2 deletions plugin/admin/options/option-types/class-selectfield.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,11 @@ public function sanitize( $value ) {

public function display() {
echo '<label for="sgdd-' . esc_attr( $this->id ) . '">
<input type="radio" id="sgdd-' . esc_attr( $this->id ) . '-px" name="' . esc_attr( $this->id ) . '" value="pixels" ' . ( $this->get() === 'pixels' ? 'checked' : '' ) . '> px
<input type="radio" id="sgdd-' . esc_attr( $this->id ) . '-list" name="' . esc_attr( $this->id ) . '" value="list" ' . ( $this->get() === 'list' ? 'checked' : '' ) . '> List
</label>
<br>
<label for="sgdd-' . esc_attr( $this->id ) . '">
<input type="radio" id="sgdd-' . esc_attr( $this->id ) . '-per" name="' . esc_attr( $this->id ) . '" value="percentage" ' . ( $this->get() === 'percentage' ? 'checked' : '' ) . '> %
<input type="radio" id="sgdd-' . esc_attr( $this->id ) . '-grid" name="' . esc_attr( $this->id ) . '" value="grid" ' . ( $this->get() === 'grid' ? 'checked' : '' ) . '> Grid
</label>
';
}
Expand Down
4 changes: 3 additions & 1 deletion plugin/admin/settings-pages/advanced/embed.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,9 @@ function add() {
add_settings_section( 'sgdd_embed', esc_html__( 'Embed', 'skaut-google-drive-documents' ), '\\Sgdd\\Admin\\SettingsPages\\Advanced\\Embed\\display', 'sgdd_advanced' );
\Sgdd\Admin\Options\Options::$embed_width->add_field();
\Sgdd\Admin\Options\Options::$embed_height->add_field();
\Sgdd\Admin\Options\Options::$size_unit->add_field();
\Sgdd\Admin\Options\Options::$folder_type->add_field();
\Sgdd\Admin\Options\Options::$list_width->add_field();
\Sgdd\Admin\Options\Options::$grid_cols->add_field();
}

function display() {
Expand Down
189 changes: 122 additions & 67 deletions plugin/public/block.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,9 @@ function add_block() {
'embedHeight' => [ esc_html__( 'Height', 'skaut-google-drive-documents' ), \Sgdd\Admin\Options\Options::$embed_height->get() ],
'list' => esc_html__( 'List', 'skaut-google-drive-documents' ),
'grid' => esc_html__( 'Grid', 'skaut-google-drive-documents' ),
'folderType' => [ esc_html__( 'List folder as', 'skaut-google-drive-documents' ) ],
'folderType' => [ esc_html__( 'List folder as', 'skaut-google-drive-documents' ), \Sgdd\Admin\Options\Options::$folder_type->get() ],
'listWidth' => [ esc_html__( 'List width', 'skaut-google-drive-documents' ), \Sgdd\Admin\Options\Options::$list_width->get() ],
'gridCols' => [ esc_html__( 'Grid columns', 'skaut-google-drive-documents' ), \Sgdd\Admin\Options\Options::$grid_cols->get() ],
]
);

Expand All @@ -51,102 +53,106 @@ function add_block() {

/* -- WIP -- */
function display( $attr ) {
$size = '';
//var_dump($attr); //debug

if ( isset( $attr['embedWidth'] ) ) {
$size .= 'width:' . $attr['embedWidth'] . 'px;';
}

if ( isset( $attr['embedHeight'] ) ) {
$size .= 'height:' . $attr['embedHeight'] . 'px;';
}

if ( isset( $attr['folderType'] ) ) {
$list = show_folder( $attr['folderId'] );

if ( 'list' === $attr['folderType'] ) {
//LIST - almost done
//display folder
$folderId;
$content;
$width;
$cols;
$result;

//set folderId variable
if ( isset( $attr['folderId'] ) ) {
$folderId = $attr['folderId'];
} else {
$folderId = \Sgdd\Admin\Options\Options::$root_path->get();
}

$result = '<table>'
. '<tbody>';
//gdrive request to fetch content of folder
$content = fetch_folder_content( $folderId );

foreach( $list as $file ) {
//var_dump($file);
$result .= '<tr>';
$result .= '<td><img src="' . $file['iconLink'] . '"></td>';
$result .= '<td><a href="' . $file['webViewLink'] . '" target="_blank">' . $file['name'] . '</a></td>';
$result .= '</tr>';
if ( 'list' === $attr['folderType'] ) {
//display list
if ( isset( $attr['listWidth'] ) ) {
$result = build_result( $content, 'list', array( 'width' => $attr['listWidth'] ) );
} else {
$result = build_result( $content, 'list', array() );
}


} else {
//GRID - add setting - num of columns
// - add thumbnails

$result = '<table style="table-layout:fixed;">'
. '<tbody>';

$i = 0;
foreach( $list as $file ) {
//var_dump($file);
$i % 3 == 0 ? $result .= '<tr>' : $result .= '';
if (!$file['hasThumbnail']){
$result .= '<td style="margin:auto;"><a href="' . $file['webViewLink'] . '" target="_blank"><img src="' . preg_replace('(16)', '128',$file['iconLink']) . '"></a><br>' . $file['name'] . '</td>';
} else {
$result .= '<td style="margin:auto;"><a href="' . $file['webViewLink'] . '" target="_blank"><img src="' . $file['thumbnailLink'] . '"></a><br>' . $file['name'] . '</td>';
}
$i % 3 == 2 ? $result .= '</tr>' : $result .= '';
$i++;
//display grid
if ( isset( $attr['gridCols'] ) ) {
$cols = $attr['gridCols'];
} else {
$cols = \Sgdd\Admin\Options\Options::$grid_cols->get();
}

if ( isset( $attr['listWidth'] ) ) {
$result = build_result( $content, 'grid', array( 'width' => $attr['listWidth'], 'cols' => $cols ) );
} else {
$result = build_result( $content, 'grid', array( 'cols' => $cols ) );
}

}

$result .= '</tbody>'
. '</table>';
$result .= '</tbody>
</table>';

return $result;
} else {
$test = print_file( $attr['fileId'] );
$link = $test['id'];
$result = '<iframe src="https://docs.google.com/viewer?srcid=' . $link . '&pid=explorer&efh=false&a=v&chrome=false&embedded=true" style="' . $size . ' border:0;"></iframe>';
}
//display file
$size = '';

return $result;
}
if ( isset( $attr['fileId'] ) ) {
$id = $attr['fileId'];
} else {
//throw error
return '<div class="notice notice-error">Error<br>Please select file to display or enable "display folder" function</div>';
}

$temp = set_file_permissions( $id );
//var_dump($temp); //debug

if ( isset( $attr['embedWidth'] ) ) {
$size .= 'width:' . $attr['embedWidth'] . 'px; ';
}

if ( isset( $attr['embedHeight'] ) ) {
$size .= 'height:' . $attr['embedHeight'] . 'px; ';
}

function print_file( $file_id ) {
//TODO: make efficient and more simple
$result = '<iframe src="https://drive.google.com/file/d/' . $id . '/preview" style="' . $size . 'border:0;"></iframe>';

return $result;
}
}

//Only to set permissions to display file
function set_file_permissions( $fileId ) {
try {
$service = \Sgdd\Admin\GoogleAPILib\get_drive_client();

$domain_permission = new \Sgdd\Vendor\Google_Service_Drive_Permission(
[
'role' => 'reader',
'type' => 'anyone',
]
);

$request = $service->permissions->create( $file_id, $domain_permission, [ 'supportsTeamDrives' => true ] );
$request = $service->permissions->create( $fileId, $domain_permission, [ 'supportsTeamDrives' => true ] );
$get_options = [
'supportsAllDrives' => true,
'fields' => '*',
'fields' => 'id',
];

$response = $service->files->get( $file_id, $get_options );

$response = $service->files->get( $fileId, $get_options );
return $response;
} catch ( \Exception $e ) {
return $e->getMessage();
}
}

function show_folder( $folderId ) {
//TODO

function fetch_folder_content( $folderId ) {
$service = \Sgdd\Admin\GoogleAPILib\get_drive_client();

if ( ! isset( $folderId ) ) {
$folderId = end( \Sgdd\Admin\Options\Options::$root_path->get() );
}

$result = [];
$page_token = null;

do {
Expand All @@ -157,7 +163,7 @@ function show_folder( $folderId ) {
'includeItemsFromAllDrives' => true,
'pageToken' => $page_token,
'pageSize' => 1000,
'fields' => '*',
'fields' => 'files',
)
);

Expand All @@ -170,4 +176,53 @@ function show_folder( $folderId ) {
} while ( null !== $page_token );

return $response;
}

function build_result( $content, $type, $arg ) {
$result;

if ( $type === 'list' ) {
//build list table
if ( !empty( $arg ) ) {
$result = '<table style="width:' . $arg['width'] . 'px"><tbody>';
} else {
$result = '<table><tbody>';
}

foreach ( $content as $element ) {
$result .= '<tr>
<td><img src="' . $element['iconLink'] . '"></td>
<td><a href="' . $element['webViewLink'] . '" target="_blank">' . $element['name'] . '</a></td>
</tr>';
}

return $result;
} else {
//build grid table
$i = 0;
$width;
$cols = $arg['cols'];

if ( array_key_exists( 'width', $arg ) ) {
$result = '<table style="table-layout:fixed; border-collapse:separate; width:' . $arg['width'] . 'px"><tbody>';
} else {
$result = '<table style="table-layout:fixed; border-collapse:separate;"><tbody>';
}

foreach ( $content as $element ) {
//var_dump($element); //debug

$i % $cols == 0 ? $result .= '<tr>' : $result .= '';

if ( !$element['hasThumbnail'] || preg_match( '/\b(google-apps)/', $element['mimeType'] ) ){
$result .= '<td><div class="element"><a href="' . $element['webViewLink'] . '" target="_blank"><div class="image"><img src="' . preg_replace('(16)', '128',$element['iconLink']) . '"></div><div class="caption">' . $element['name'] . '</div></a></div></td>';
} else {
$result .= '<td><div class="element"><a href="' . $element['webViewLink'] . '" target="_blank"><div class="image"><img src="' . $element['thumbnailLink'] . '"></div><div class="caption">' . $element['name'] . '</div></a></div></td>';
}
$i % $cols == $cols - 1 ? $result .= '</tr>' : $result .= '';
$i++;
}

return $result;
}
}
25 changes: 25 additions & 0 deletions plugin/public/css/block.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,4 +63,29 @@

.sgdd-block-units {
display: inline-table;
}

.element {
border: solid 1px;
border-color: rgba(51, 51, 51, 0.1);
border-radius: 10px;
margin: auto;
vertical-align: center;
padding: 10px;
}

.image img {
display: block;
/*max-width: 100px;
max-height: 100px;*/
margin: auto;
}

.caption {
margin: auto;
text-align: center;
}

.caption a {
text-decoration: none !important;
}
14 changes: 11 additions & 3 deletions plugin/public/js/block.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,11 @@ registerBlockType( 'skaut-google-drive-documents/block', {
},
fileId: {
type: 'string',
default: undefined
default: ''
},
folderId: {
type: 'string',
default: undefined
default: ''
},
embedWidth: {
type: 'int',
Expand All @@ -35,9 +35,17 @@ registerBlockType( 'skaut-google-drive-documents/block', {
type: 'int',
default: undefined
},
listWidth: {
type: 'int',
default: undefined
},
gridCols: {
type: 'int',
default: undefined
},
folderType: {
type: 'string',
default: ''
default: undefined
}
},

Expand Down
Loading

0 comments on commit d25a17e

Please sign in to comment.