style: indent issues

This commit is contained in:
prssanna 2021-01-29 13:06:39 +05:30
parent a5b06c5cfc
commit f925ba2a1d
9 changed files with 380 additions and 325 deletions

View file

@ -232,10 +232,10 @@ export default class GridRow {
<div class="hidden-xs edit-grid-row">Edit</div>
</div>
`)
.appendTo($('<div class="col col-xs-1"></div>').appendTo(this.row))
.on('click', function() {
me.toggle_view(); return false;
});
.appendTo($('<div class="col col-xs-1"></div>').appendTo(this.row))
.on('click', function() {
me.toggle_view(); return false;
});
if(this.is_too_small()) {
// narrow

View file

@ -8,9 +8,7 @@ frappe.ui.get_print_settings = function(
var default_letter_head =
locals[":Company"] && frappe.defaults.get_default("company")
? locals[":Company"][frappe.defaults.get_default("company")][
"default_letter_head"
]
? locals[":Company"][frappe.defaults.get_default("company")]["default_letter_head"]
: "";
var columns = [

View file

@ -169,7 +169,7 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
</button>`
)
.click(() => this.show_restrictions(match_rules_list))
.appendTo(this.page.page_form);
.appendTo(this.page.page_form);
}
}

View file

@ -161,8 +161,8 @@ frappe.ui.Page = Class.extend({
if (this.disable_sidebar_toggle || !sidebar_wrapper.length) {
sidebar_toggle.remove();
} else {
sidebar_toggle.attr("title", __("Toggle Sidebar")).tooltip(
{ delay: { "show": 600, "hide": 100 },
sidebar_toggle.attr("title", __("Toggle Sidebar")).tooltip({
delay: { "show": 600, "hide": 100 },
trigger : "hover",
});
sidebar_toggle.click(() => {

View file

@ -1,4 +1,4 @@
frappe.provide('frappe.search');
frappe.provide("frappe.search");
frappe.search.SearchDialog = class {
constructor(opts) {
@ -7,31 +7,36 @@ frappe.search.SearchDialog = class {
}
make() {
this.search_dialog = new frappe.ui.Dialog({ minimizable: true, size: 'large' });
this.search_dialog = new frappe.ui.Dialog({
minimizable: true,
size: "large"
});
this.set_header();
this.$wrapper = $(this.search_dialog.$wrapper).addClass('search-dialog');
this.$wrapper = $(this.search_dialog.$wrapper).addClass(
"search-dialog"
);
this.$body = $(this.search_dialog.body);
this.$input = this.$wrapper.find('.search-input');
this.$input = this.$wrapper.find(".search-input");
this.setup();
}
set_header() {
this.search_dialog.header
.addClass('search-header')
.find('.title-section')
.addClass("search-header")
.find(".title-section")
.html(
`<div class="input-group text-muted">
<input type="text" class="form-control search-input">
</div>
<span class="search-icon">
${frappe.utils.icon('search')}
${frappe.utils.icon("search")}
</span>`
);
}
setup() {
this.modal_state = 0;
this.current_keyword = '';
this.current_keyword = "";
this.more_count = 20;
this.full_lists = {};
this.nav_lists = {};
@ -43,62 +48,64 @@ frappe.search.SearchDialog = class {
init_search_objects() {
this.searches = {
global_search: {
input_placeholder: __('Search'),
empty_state_text: __('Search for anything'),
no_results_status: () => __('No Results found'),
input_placeholder: __("Search"),
empty_state_text: __("Search for anything"),
no_results_status: () => __("No Results found"),
get_results: (keywords, callback) => {
let start = 0,
limit = 1000;
let results = frappe.search.utils.get_nav_results(keywords);
frappe.search.utils.get_global_results(keywords, start, limit).then(
(global_results) => {
results = results.concat(global_results);
callback(results, keywords);
},
(err) => {
console.error(err);
}
);
},
frappe.search.utils
.get_global_results(keywords, start, limit)
.then(
global_results => {
results = results.concat(global_results);
callback(results, keywords);
},
err => {
console.error(err);
}
);
}
},
tags: {
input_placeholder: __('Search'),
empty_state_text: __('Search for anything'),
no_results_status: (keyword) =>
'<div>' +
__('No documents found tagged with {0}', [keyword]) +
'</div>',
input_placeholder: __("Search"),
empty_state_text: __("Search for anything"),
no_results_status: keyword =>
"<div>" +
__("No documents found tagged with {0}", [keyword]) +
"</div>",
get_results: (keywords, callback) => {
var results = frappe.search.utils.get_nav_results(keywords);
frappe.tags.utils.get_tag_results(keywords).then(
(global_results) => {
global_results => {
results = results.concat(global_results);
callback(results, keywords);
},
(err) => {
err => {
console.error(err);
}
);
},
},
}
}
};
}
update($r) {
this.$wrapper.find('.loading-state').addClass('hide');
this.$wrapper.find(".loading-state").addClass("hide");
this.$body.append($r);
if (this.$body.find('.search-results').length > 1) {
if (this.$body.find(".search-results").length > 1) {
this.$body
.find('.search-results')
.find(".search-results")
.first()
.addClass('hide');
$r.removeClass('hide');
.addClass("hide");
$r.removeClass("hide");
this.$body
.find('.search-results')
.find(".search-results")
.first()
.remove();
} else {
$r.removeClass('hide');
$r.removeClass("hide");
}
}
@ -118,18 +125,18 @@ frappe.search.SearchDialog = class {
}
bind_input() {
this.$input.on('input', (e) => {
this.$input.on("input", e => {
const $el = $(e.currentTarget);
clearTimeout($el.data('timeout'));
clearTimeout($el.data("timeout"));
$el.data(
'timeout',
"timeout",
setTimeout(() => {
if (this.$input.val() === this.current_keyword) return;
let keywords = this.$input.val();
if (keywords.length > 1) {
this.get_results(keywords);
} else {
this.current_keyword = '';
this.current_keyword = "";
this.put_placeholder(this.search.empty_state_text);
}
}, 300)
@ -139,49 +146,49 @@ frappe.search.SearchDialog = class {
bind_events() {
// Sidebar
this.$body.on('click', '.list-link', (e) => {
this.$body.on("click", ".list-link", e => {
const $link = $(e.currentTarget);
this.$body
.find('.search-sidebar')
.find('.list-link')
.removeClass('active selected');
$link.addClass('active selected');
const type = $link.attr('data-category');
.find(".search-sidebar")
.find(".list-link")
.removeClass("active selected");
$link.addClass("active selected");
const type = $link.attr("data-category");
this.$body
.find('.results-area')
.find(".results-area")
.empty()
.html(this.full_lists[type]);
this.$body
.find('.module-section-link')
.find(".module-section-link")
.first()
.focus();
});
// Summary more links
this.$body.on('click', '.section-more', (e) => {
this.$body.on("click", ".section-more", e => {
const $section = $(e.currentTarget);
const type = $section.attr('data-category');
const type = $section.attr("data-category");
this.$body
.find('.search-sidebar')
.find(".search-sidebar")
.find('*[data-category="' + type + '"]')
.trigger('click');
.trigger("click");
});
// Back-links (mobile-view)
this.$body.on('click', '.all-results-link', () => {
this.$body.on("click", ".all-results-link", () => {
this.$body
.find('.search-sidebar')
.find(".search-sidebar")
.find('*[data-category="All Results"]')
.trigger('click');
.trigger("click");
});
// Full list more links
this.$body.on('click', '.list-more', (e) => {
this.$body.on("click", ".list-more", e => {
const $el = $(e.currentTarget);
const type = $el.attr('data-category');
const fetch_type = $el.attr('data-search');
var current_count = this.$body.find('.result').length;
if (fetch_type === 'Global') {
const type = $el.attr("data-category");
const fetch_type = $el.attr("data-search");
var current_count = this.$body.find(".result").length;
if (fetch_type === "Global") {
frappe.search.utils
.get_global_results(
this.current_keyword,
@ -190,10 +197,11 @@ frappe.search.SearchDialog = class {
type
)
.then(
(doctype_results) => {
doctype_results.length && this.add_more_results(doctype_results);
doctype_results => {
doctype_results.length &&
this.add_more_results(doctype_results);
},
(err) => {
err => {
console.error(err);
}
);
@ -205,9 +213,9 @@ frappe.search.SearchDialog = class {
});
// Switch to global search link
this.$body.on('click', '.switch-to-global-search', () => {
this.search = this.searches['global_search'];
this.$input.attr('placeholder', this.search.input_placeholder);
this.$body.on("click", ".switch-to-global-search", () => {
this.search = this.searches["global_search"];
this.$input.attr("placeholder", this.search.input_placeholder);
this.put_placeholder(this.search.empty_state_text);
this.get_results(this.current_keyword);
});
@ -215,7 +223,7 @@ frappe.search.SearchDialog = class {
init_search(keywords, search_type) {
this.search = this.searches[search_type];
this.$input.attr('placeholder', this.search.input_placeholder);
this.$input.attr("placeholder", this.search.input_placeholder);
this.put_placeholder(this.search.empty_state_text);
this.get_results(keywords);
this.search_dialog.show();
@ -225,16 +233,16 @@ frappe.search.SearchDialog = class {
get_results(keywords) {
this.current_keyword = keywords;
if (this.$body.find('.empty-state').length > 0) {
this.put_placeholder(__('Searching ...'));
if (this.$body.find(".empty-state").length > 0) {
this.put_placeholder(__("Searching ..."));
} else {
this.$wrapper.find('.loading-state').removeClass('hide');
this.$wrapper.find(".loading-state").removeClass("hide");
}
if (this.current_keyword.charAt(0) === '#') {
this.search = this.searches['tags'];
if (this.current_keyword.charAt(0) === "#") {
this.search = this.searches["tags"];
} else {
this.search = this.searches['global_search'];
this.search = this.searches["global_search"];
}
this.search.get_results(keywords, this.parse_results.bind(this));
@ -252,19 +260,21 @@ frappe.search.SearchDialog = class {
}
render_data(result_sets) {
let $search_results = $(frappe.render_template('search')).addClass('hide');
let $sidebar = $search_results.find('.search-sidebar').empty();
let $search_results = $(frappe.render_template("search")).addClass(
"hide"
);
let $sidebar = $search_results.find(".search-sidebar").empty();
let sidebar_item_html =
'<li class="search-sidebar-item standard-sidebar-item list-link" data-category="{0}">' +
'<a><span class="ellipsis">{0}</span></a></li>';
this.modal_state = 0;
this.full_lists = {
'All Results': $('<div class="results-summary"></div>'),
"All Results": $('<div class="results-summary"></div>')
};
this.nav_lists = {};
result_sets.forEach((set) => {
result_sets.forEach(set => {
$sidebar.append($(__(sidebar_item_html, [set.title])));
this.add_section_to_summary(set.title, set.results);
this.full_lists[set.title] = this.render_full_list(
@ -275,14 +285,14 @@ frappe.search.SearchDialog = class {
});
if (result_sets.length > 1) {
$sidebar.prepend($(__(sidebar_item_html, ['All Results'])));
$sidebar.prepend($(__(sidebar_item_html, ["All Results"])));
}
this.update($search_results.clone());
this.$body
.find('.list-link')
.find(".list-link")
.first()
.trigger('click');
.trigger("click");
}
render_full_list(type, results, fetch_type) {
@ -296,20 +306,20 @@ frappe.search.SearchDialog = class {
</div>
</div>`);
results.slice(0, max_length).forEach((result) => {
results.slice(0, max_length).forEach(result => {
$results_list
.find('.result-body')
.find(".result-body")
.append(this.render_result(type, result));
});
if (results.length > 0) {
if (fetch_type === 'Nav') this.nav_lists[type] = results;
if (fetch_type === "Nav") this.nav_lists[type] = results;
if (results.length > max_length) {
$(`<a class="list-more" data-search="${fetch_type}"
data-category="${type}" data-count="${max_length}">
${__('More')}
</a>`).appendTo($results_list.find('.result-body'));
${__("More")}
</a>`).appendTo($results_list.find(".result-body"));
}
}
return $results_list;
@ -317,12 +327,12 @@ frappe.search.SearchDialog = class {
add_section_to_summary(type, results) {
let section_length = 4;
let more_html = '';
let get_result_html = (result) => this.render_result(type, result);
let more_html = "";
let get_result_html = result => this.render_result(type, result);
if (results.length > section_length) {
more_html = `<div>
<a class="section-more" data-category="${type}">${__('More')}</a>
<a class="section-more" data-category="${type}">${__("More")}</a>
</div>`;
}
@ -331,17 +341,17 @@ frappe.search.SearchDialog = class {
<div class="result-body">
${more_html}
</div>
</div>`).appendTo(this.full_lists['All Results']);
</div>`).appendTo(this.full_lists["All Results"]);
$result_section
.find('.result-body')
.find(".result-body")
.prepend(results.slice(0, section_length).map(get_result_html));
}
get_link(result) {
let link = '';
let link = "";
if (result.route) {
link = `href="#${result.route.join('/')}"`;
link = `href="#${result.route.join("/")}"`;
} else if (result.data_path) {
link = `data-path=${result.data_path}"`;
}
@ -349,10 +359,10 @@ frappe.search.SearchDialog = class {
}
render_result(type, result) {
let image_html = '';
let image_html = "";
if (result.image !== undefined) {
let avatar_html = frappe.get_avatar(
'avatar-medium',
"avatar-medium",
result.label,
result.image
);
@ -363,9 +373,9 @@ frappe.search.SearchDialog = class {
</a>`;
}
let link_html = `<a ${this.get_link(result)} class="result-section-link">${
result.label
}</a>`;
let link_html = `<a ${this.get_link(
result
)} class="result-section-link">${result.label}</a>`;
let title_html = !result.description
? link_html
: `<b>${link_html}</b><div class="description"> ${
@ -379,7 +389,7 @@ frappe.search.SearchDialog = class {
let $result = $(`<div class="result ${type}-result">
${image_html}
${result_text}
${result.subtypes || ''}
${result.subtypes || ""}
</div>`);
if (!result.description) {
@ -393,7 +403,7 @@ frappe.search.SearchDialog = class {
if (result.route_options) {
frappe.route_options = result.route_options;
}
$result.on('click', (e) => {
$result.on("click", e => {
// this.toggle_minimize();
if (result.onclick) {
result.onclick(result.match);
@ -411,21 +421,25 @@ frappe.search.SearchDialog = class {
add_more_results(results_set) {
let more_results = $('<div class="more-results last"></div>');
if (results_set[0].results) {
results_set[0].results.forEach((result) => {
more_results.append(this.render_result(results_set[0].title, result));
results_set[0].results.forEach(result => {
more_results.append(
this.render_result(results_set[0].title, result)
);
});
}
this.$body.find('.list-more').before(more_results);
this.$body.find(".list-more").before(more_results);
if (results_set[0].results.length < this.more_count) {
// hide more button and add a result count
this.$body.find('.list-more').hide();
let no_of_results = this.$body.find('.result').length;
this.$body.find(".list-more").hide();
let no_of_results = this.$body.find(".result").length;
let no_of_results_cue = $(
'<div class="results-status">' + no_of_results + ' results found</div>'
'<div class="results-status">' +
no_of_results +
" results found</div>"
);
this.$body.find('.more-results:last').append(no_of_results_cue);
this.$body.find(".more-results:last").append(no_of_results_cue);
}
this.$body.find('.more-results.last').slideDown(200, function() {});
this.$body.find(".more-results.last").slideDown(200, function() {});
}
};

View file

@ -367,8 +367,8 @@ frappe.utils.new_auto_repeat_prompt = function (frm) {
}
});
},
__('Auto Repeat'),
__('Save')
__('Auto Repeat'),
__('Save')
);
}

View file

@ -1,13 +1,13 @@
frappe.provide('frappe.views');
frappe.provide("frappe.views");
frappe.views.FileView = class FileView extends frappe.views.ListView {
static load_last_view() {
const route = frappe.get_route();
if (route.length === 2) {
const view_user_settings = frappe.get_user_settings('File', 'File');
const view_user_settings = frappe.get_user_settings("File", "File");
frappe.set_route(
'List',
'File',
"List",
"File",
view_user_settings.last_folder || frappe.boot.home_folder
);
return true;
@ -16,7 +16,7 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
}
get view_name() {
return 'File';
return "File";
}
show() {
@ -28,9 +28,9 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
setup_view() {
this.render_header();
this.setup_events();
this.$page.find('.layout-main-section-wrapper').addClass('file-view');
this.$page.find(".layout-main-section-wrapper").addClass("file-view");
this.add_file_action_buttons();
this.page.add_button(__('Toggle Grid View'), () => {
this.page.add_button(__("Toggle Grid View"), () => {
frappe.views.FileView.grid_view = !frappe.views.FileView.grid_view;
this.refresh();
});
@ -50,7 +50,7 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
let args = super.get_args();
if (frappe.views.FileView.grid_view) {
Object.assign(args, {
order_by: `is_folder desc, ${this.sort_by} ${this.sort_order}`,
order_by: `is_folder desc, ${this.sort_by} ${this.sort_order}`
});
}
return args;
@ -60,23 +60,23 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
const route = frappe.get_route();
route.splice(-1);
const last_folder = route[route.length - 1];
if (last_folder === 'File') return;
if (last_folder === "File") return;
frappe.breadcrumbs.add({
type: 'Custom',
label: __('Home'),
route: '/app/List/File/Home',
type: "Custom",
label: __("Home"),
route: "/app/List/File/Home"
});
}
setup_defaults() {
return super.setup_defaults().then(() => {
this.page_title = __('File Manager');
this.page_title = __("File Manager");
const route = frappe.get_route();
this.current_folder = route.slice(2).join('/');
this.filters = [['File', 'folder', '=', this.current_folder, true]];
this.order_by = this.view_user_settings.order_by || 'file_name asc';
this.current_folder = route.slice(2).join("/");
this.filters = [["File", "folder", "=", this.current_folder, true]];
this.order_by = this.view_user_settings.order_by || "file_name asc";
this.menu_items = this.menu_items.concat(this.file_menu_items());
});
@ -85,57 +85,69 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
file_menu_items() {
const items = [
{
label: __('Home'),
label: __("Home"),
action: () => {
frappe.set_route('List', 'File', 'Home');
},
frappe.set_route("List", "File", "Home");
}
},
{
label: __('New Folder'),
label: __("New Folder"),
action: () => {
frappe.prompt(
__('Name'),
(values) => {
if (values.value.indexOf('/') > -1) {
frappe.throw(__("Folder name should not include '/' (slash)"));
__("Name"),
values => {
if (values.value.indexOf("/") > -1) {
frappe.throw(
__(
"Folder name should not include '/' (slash)"
)
);
}
const data = {
file_name: values.value,
folder: this.current_folder,
folder: this.current_folder
};
frappe.call({
method: 'frappe.core.doctype.file.file.create_new_folder',
args: data,
method:
"frappe.core.doctype.file.file.create_new_folder",
args: data
});
},
__('Enter folder name'),
__('Create')
__("Enter folder name"),
__("Create")
);
},
}
},
{
label: __('Import Zip'),
label: __("Import Zip"),
action: () => {
new frappe.ui.FileUploader({
folder: this.current_folder,
restrictions: {
allowed_file_types: ['.zip'],
allowed_file_types: [".zip"]
},
on_success: (file) => {
frappe.show_alert(__('Unzipping files...'));
on_success: file => {
frappe.show_alert(__("Unzipping files..."));
frappe
.call('frappe.core.doctype.file.file.unzip_file', {
name: file.name,
})
.then((r) => {
.call(
"frappe.core.doctype.file.file.unzip_file",
{
name: file.name
}
)
.then(r => {
if (r.message) {
frappe.show_alert(__('Unzipped {0} files', [r.message]));
frappe.show_alert(
__("Unzipped {0} files", [
r.message
])
);
}
});
},
}
});
},
},
}
}
];
return items;
@ -143,14 +155,17 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
add_file_action_buttons() {
this.$cut_button = this.page
.add_button(__('Cut'), () => {
frappe.file_manager.cut(this.get_checked_items(), this.current_folder);
this.$checks.parents('.file-wrapper').addClass('cut');
.add_button(__("Cut"), () => {
frappe.file_manager.cut(
this.get_checked_items(),
this.current_folder
);
this.$checks.parents(".file-wrapper").addClass("cut");
})
.hide();
this.$paste_btn = this.page
.add_button(__('Paste'), () =>
.add_button(__("Paste"), () =>
frappe.file_manager.paste(this.current_folder)
)
.hide();
@ -158,19 +173,21 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
set_fields() {
this.fields = this.meta.fields
.filter((df) => frappe.model.is_value_type(df.fieldtype) && !df.hidden)
.map((df) => df.fieldname)
.concat(['name', 'modified', 'creation']);
.filter(
df => frappe.model.is_value_type(df.fieldtype) && !df.hidden
)
.map(df => df.fieldname)
.concat(["name", "modified", "creation"]);
}
prepare_data(data) {
super.prepare_data(data);
this.data = this.data.map((d) => this.prepare_datum(d));
this.data = this.data.map(d => this.prepare_datum(d));
// Bring folders to the top
const { sort_by } = this.sort_selector;
if (sort_by === 'file_name') {
if (sort_by === "file_name") {
this.data.sort((a, b) => {
if (a.is_folder && !b.is_folder) {
return -1;
@ -184,17 +201,17 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
}
prepare_datum(d) {
let icon_class = '';
let type = '';
let icon_class = "";
let type = "";
if (d.is_folder) {
icon_class = 'folder-normal';
type = 'folder';
icon_class = "folder-normal";
type = "folder";
} else if (frappe.utils.is_image_file(d.file_name)) {
icon_class = 'image';
type = 'image';
icon_class = "image";
type = "image";
} else {
icon_class = 'file';
type = 'file';
icon_class = "file";
type = "file";
}
let title = d.file_name || d.file_url;
@ -206,7 +223,7 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
d.subject_html = `
${frappe.utils.icon(icon_class)}
<span>${title}</span>
${d.is_private ? '<i class="fa fa-lock fa-fw text-warning"></i>' : ''}
${d.is_private ? '<i class="fa fa-lock fa-fw text-warning"></i>' : ""}
`;
return d;
}
@ -214,17 +231,17 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
before_render() {
super.before_render();
frappe.model.user_settings.save(
'File',
'grid_view',
"File",
"grid_view",
frappe.views.FileView.grid_view
);
this.save_view_user_settings({
last_folder: this.current_folder,
last_folder: this.current_folder
});
}
render() {
this.$result.empty().removeClass('file-grid-view');
this.$result.empty().removeClass("file-grid-view");
if (frappe.views.FileView.grid_view) {
this.render_grid_view();
} else {
@ -244,17 +261,24 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
}
render_grid_view() {
let html = this.data.map(d => {
const icon_class = d.icon_class + '-large';
let file_body_html = d._type == 'image'
? `<div class="file-image"><img src="${d.file_url}" alt="${
d.file_name
}"></div>`
: frappe.utils.icon(icon_class, { width: '40px', height: '45px' });
const name = escape(d.name);
const draggable = d.type == 'Folder' ? false : true;
return `
<a href="${this.get_route_url(d)}" draggable="${draggable}" class="file-wrapper ellipsis" data-name="${name}">
let html = this.data
.map(d => {
const icon_class = d.icon_class + "-large";
let file_body_html =
d._type == "image"
? `<div class="file-image"><img src="${
d.file_url
}" alt="${d.file_name}"></div>`
: frappe.utils.icon(icon_class, {
width: "40px",
height: "45px"
});
const name = escape(d.name);
const draggable = d.type == "Folder" ? false : true;
return `
<a href="${this.get_route_url(
d
)}" draggable="${draggable}" class="file-wrapper ellipsis" data-name="${name}">
<div class="file-header">
<input class="level-item list-row-checkbox hidden-xs" type="checkbox" data-name="${name}">
</div>
@ -267,9 +291,10 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
</div>
</a>
`;
}).join('');
})
.join("");
this.$result.addClass('file-grid-view');
this.$result.addClass("file-grid-view");
this.$result.empty().html(
`<div class="file-grid">
${html}
@ -281,23 +306,21 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
const route = frappe.router.parse();
const folders = route.slice(2);
return (
folders
.map((folder, i) => {
if (i === folders.length - 1) {
return `<span>${folder}</span>`;
return folders
.map((folder, i) => {
if (i === folders.length - 1) {
return `<span>${folder}</span>`;
}
const route = folders.reduce((acc, curr, j) => {
if (j <= i) {
acc += "/" + curr;
}
const route = folders.reduce((acc, curr, j) => {
if (j <= i) {
acc += '/' + curr;
}
return acc;
}, '/app/file');
return acc;
}, "/app/file");
return `<a href="${route}">${folder}</a>`;
})
.join('&nbsp;/&nbsp;')
);
return `<a href="${route}">${folder}</a>`;
})
.join("&nbsp;/&nbsp;");
}
get_header_html() {
@ -305,18 +328,18 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
let header_selector_html = !frappe.views.FileView.grid_view
? `<input class="level-item list-check-all hidden-xs" type="checkbox" title="${__(
'Select All'
"Select All"
)}">`
: '';
: "";
let header_columns_html = !frappe.views.FileView.grid_view
? `<div class="list-row-col ellipsis hidden-xs">
<span>${__('Size')}</span>
<span>${__("Size")}</span>
</div>
<div class="list-row-col ellipsis hidden-xs">
<span>${__('Created')}</span>
<span>${__("Created")}</span>
</div>`
: '';
: "";
let subject_html = `
<div class="list-row-col list-subject level">
@ -334,12 +357,12 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
get_route_url(file) {
return file.is_folder
? '/app/List/File/' + file.name
? "/app/List/File/" + file.name
: this.get_form_link(file);
}
get_creation_date(file) {
const [date] = file.creation.split(' ');
const [date] = file.creation.split(" ");
let created_on;
if (date === frappe.datetime.now_date()) {
created_on = comment_when(file.creation);
@ -353,7 +376,7 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
file = this.prepare_datum(file);
const file_size = file.file_size
? frappe.form.formatters.FileSize(file.file_size)
: '';
: "";
const route_url = this.get_route_url(file);
return `
@ -390,37 +413,37 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
}
setup_drag_events() {
this.$result.on('dragstart', '.files .file-wrapper', (e) => {
this.$result.on("dragstart", ".files .file-wrapper", e => {
e.stopPropagation();
e.originalEvent.dataTransfer.setData(
'Text',
$(e.currentTarget).attr('data-name')
"Text",
$(e.currentTarget).attr("data-name")
);
e.target.style.opacity = '0.4';
e.target.style.opacity = "0.4";
frappe.file_manager.cut(
[{ name: $(e.currentTarget).attr('data-name') }],
[{ name: $(e.currentTarget).attr("data-name") }],
this.current_folder
);
});
this.$result.on(
'dragover',
(e) => {
"dragover",
e => {
e.preventDefault();
},
false
);
this.$result.on('dragend', '.files .file-wrapper', (e) => {
this.$result.on("dragend", ".files .file-wrapper", e => {
e.preventDefault();
e.stopPropagation();
e.target.style.opacity = '1';
e.target.style.opacity = "1";
});
this.$result.on('drop', (e) => {
this.$result.on("drop", e => {
e.stopPropagation();
e.preventDefault();
const $el = $(e.target).parents('.file-wrapper');
const $el = $(e.target).parents(".file-wrapper");
let dataTransfer = e.originalEvent.dataTransfer;
if (!dataTransfer) return;
@ -428,14 +451,18 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
if (dataTransfer.files && dataTransfer.files.length > 0) {
new frappe.ui.FileUploader({
files: dataTransfer.files,
folder: this.current_folder,
folder: this.current_folder
});
} else if (dataTransfer.getData('Text')) {
if ($el.parents('.folders').length !== 0) {
const file_name = dataTransfer.getData('Text');
const folder_name = decodeURIComponent($el.attr('data-name'));
} else if (dataTransfer.getData("Text")) {
if ($el.parents(".folders").length !== 0) {
const file_name = dataTransfer.getData("Text");
const folder_name = decodeURIComponent(
$el.attr("data-name")
);
frappe.file_manager.paste(folder_name);
frappe.show_alert(`File ${file_name} moved to ${folder_name}`);
frappe.show_alert(
`File ${file_name} moved to ${folder_name}`
);
}
}
});
@ -463,14 +490,14 @@ frappe.views.FileView = class FileView extends frappe.views.ListView {
};
frappe.views.FileView.grid_view =
frappe.get_user_settings('File').grid_view || false;
frappe.get_user_settings("File").grid_view || false;
function redirect_to_home_if_invalid_route() {
const route = frappe.get_route();
if (route[2] === 'List') {
if (route[2] === "List") {
// if the user somehow redirects to List/File/List
// redirect back to Home
frappe.set_route('List', 'File', 'Home');
frappe.set_route("List", "File", "Home");
return true;
}
return false;

View file

@ -5,14 +5,13 @@ frappe.provide("frappe.views");
frappe.views.ImageView = class ImageView extends frappe.views.ListView {
get view_name() {
return 'Image';
return "Image";
}
setup_defaults() {
return super.setup_defaults()
.then(() => {
this.page_title = this.page_title + ' ' + __('Images');
})
return super.setup_defaults().then(() => {
this.page_title = this.page_title + " " + __("Images");
});
}
setup_view() {
@ -23,11 +22,11 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
set_fields() {
this.fields = [
'name',
...this.get_fields_in_list_view().map((el)=> el.fieldname),
"name",
...this.get_fields_in_list_view().map(el => el.fieldname),
this.meta.title_field,
this.meta.image_field,
'_liked_by'
"_liked_by"
];
}
@ -41,22 +40,21 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
}
render() {
this.get_attached_images()
.then(() => {
this.render_image_view();
this.get_attached_images().then(() => {
this.render_image_view();
if (!this.gallery) {
this.setup_gallery();
} else {
this.gallery.prepare_pswp_items(this.items, this.images_map);
}
});
if (!this.gallery) {
this.setup_gallery();
} else {
this.gallery.prepare_pswp_items(this.items, this.images_map);
}
});
}
render_image_view() {
var html = this.items.map(this.item_html.bind(this)).join("");
this.$page.find('.layout-main-section-wrapper').addClass('image-view');
this.$page.find(".layout-main-section-wrapper").addClass("image-view");
this.$result.html(`
<div class="image-view-container">
@ -69,8 +67,9 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
item_details_html(item) {
// TODO: Image view field in DocType
let info_fields = this.get_fields_in_list_view().map((el)=> el.fieldname) || [];
const title_field = this.meta.title_field || 'name';
let info_fields =
this.get_fields_in_list_view().map(el => el.fieldname) || [];
const title_field = this.meta.title_field || "name";
info_fields = info_fields.filter(field => field !== title_field);
let info_html = `<div><ul class="list-unstyled image-view-info">`;
let set = false;
@ -80,7 +79,7 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
else info_html += `<li class="text-muted">${item[field]}</li>`;
set = true;
}
})
});
info_html += `</ul></div>`;
return info_html;
}
@ -88,22 +87,24 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
item_html(item) {
item._name = encodeURI(item.name);
const encoded_name = item._name;
const title = strip_html(item[this.meta.title_field || 'name']);
const title = strip_html(item[this.meta.title_field || "name"]);
const escaped_title = frappe.utils.escape_html(title);
const _class = !item._image_url ? 'no-image' : '';
const _html = item._image_url ?
`<img data-name="${encoded_name}" src="${ item._image_url }" alt="${ title }">` :
`<span class="placeholder-text">
${ frappe.get_abbr(title) }
const _class = !item._image_url ? "no-image" : "";
const _html = item._image_url
? `<img data-name="${encoded_name}" src="${
item._image_url
}" alt="${title}">`
: `<span class="placeholder-text">
${frappe.get_abbr(title)}
</span>`;
let details = this.item_details_html(item);
const expand_button_html = item._image_url
? `<div class="zoom-view" data-name="${encoded_name}">
${frappe.utils.icon('expand', 'xs')}
${frappe.utils.icon("expand", "xs")}
</div>`
: '';
: "";
return `
<div class="image-view-item ellipsis">
@ -135,8 +136,8 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
<a class="ellipsis" href="${this.get_form_link(
item
)}" title="${escaped_title}" data-doctype="${
this.doctype
}" data-name="${item.name}">
this.doctype
}" data-name="${item.name}">
${title}
</a>
</span>
@ -162,15 +163,20 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
}
get_attached_images() {
return frappe.call({
method: 'frappe.core.doctype.file.file.get_attached_images',
args: {
doctype: this.doctype,
names: this.items.map(i => i.name)
}
}).then(r => {
this.images_map = Object.assign(this.images_map || {}, r.message);
});
return frappe
.call({
method: "frappe.core.doctype.file.file.get_attached_images",
args: {
doctype: this.doctype,
names: this.items.map(i => i.name)
}
})
.then(r => {
this.images_map = Object.assign(
this.images_map || {},
r.message
);
});
}
get_header_html() {
@ -199,7 +205,7 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
wrapper: this.$result,
images_map: this.images_map
});
this.$result.on('click', '.zoom-view', function (e) {
this.$result.on("click", ".zoom-view", function(e) {
e.preventDefault();
e.stopPropagation();
var name = $(this).data().name;
@ -211,24 +217,24 @@ frappe.views.ImageView = class ImageView extends frappe.views.ListView {
};
frappe.views.GalleryView = Class.extend({
init: function (opts) {
init: function(opts) {
$.extend(this, opts);
var me = this;
this.lib_ready = this.load_lib();
this.lib_ready.then(function () {
this.lib_ready.then(function() {
me.prepare();
});
},
prepare: function () {
prepare: function() {
// keep only one pswp dom element
this.pswp_root = $('body > .pswp');
this.pswp_root = $("body > .pswp");
if (this.pswp_root.length === 0) {
var pswp = frappe.render_template('photoswipe_dom');
this.pswp_root = $(pswp).appendTo('body');
var pswp = frappe.render_template("photoswipe_dom");
this.pswp_root = $(pswp).appendTo("body");
}
},
prepare_pswp_items: function (_items, _images_map) {
prepare_pswp_items: function(_items, _images_map) {
var me = this;
if (_items) {
@ -238,7 +244,7 @@ frappe.views.GalleryView = Class.extend({
}
return new Promise(resolve => {
const items = this.items.map(function (i) {
const items = this.items.map(function(i) {
const query = 'img[data-name="' + i._name + '"]';
let el = me.wrapper.find(query).get(0);
@ -249,7 +255,9 @@ frappe.views.GalleryView = Class.extend({
}
if (!el) {
el = me.wrapper.find('.image-field[data-name="' + i._name + '"]').get(0);
el = me.wrapper
.find('.image-field[data-name="' + i._name + '"]')
.get(0);
width = el.getBoundingClientRect().width;
height = el.getBoundingClientRect().height;
}
@ -267,19 +275,19 @@ frappe.views.GalleryView = Class.extend({
resolve();
});
},
show: function (docname) {
show: function(docname) {
this.lib_ready
.then(() => this.prepare_pswp_items())
.then(() => this._show(docname));
},
_show: function (docname) {
_show: function(docname) {
const me = this;
const items = this.pswp_items;
const item_index = items.findIndex(item => item.name === docname);
var options = {
index: item_index,
getThumbBoundsFn: function (index) {
getThumbBoundsFn: function(index) {
const query = 'img[data-name="' + items[index]._name + '"]';
let thumbnail = me.wrapper.find(query).get(0);
@ -287,7 +295,9 @@ frappe.views.GalleryView = Class.extend({
return;
}
var pageYScroll = window.pageYOffset || document.documentElement.scrollTop,
var pageYScroll =
window.pageYOffset ||
document.documentElement.scrollTop,
rect = thumbnail.getBoundingClientRect();
return {
@ -311,15 +321,15 @@ frappe.views.GalleryView = Class.extend({
this.browse_images();
this.pswp.init();
},
browse_images: function () {
const $more_items = this.pswp_root.find('.pswp__more-items');
browse_images: function() {
const $more_items = this.pswp_root.find(".pswp__more-items");
const images_map = this.images_map;
let last_hide_timeout = null;
this.pswp.listen('afterChange', function () {
this.pswp.listen("afterChange", function() {
const images = images_map[this.currItem.name];
if (!images || images.length === 1) {
$more_items.html('');
$more_items.html("");
return;
}
@ -328,16 +338,18 @@ frappe.views.GalleryView = Class.extend({
$more_items.html(html);
});
this.pswp.listen('beforeChange', hide_more_items);
this.pswp.listen('initialZoomOut', hide_more_items);
this.pswp.listen('destroy', () => {
$(document).off('mousemove', hide_more_items_after_2s);
this.pswp.listen("beforeChange", hide_more_items);
this.pswp.listen("initialZoomOut", hide_more_items);
this.pswp.listen("destroy", () => {
$(document).off("mousemove", hide_more_items_after_2s);
});
// Replace current image on click
$more_items.on('click', '.pswp__more-item', (e) => {
$more_items.on("click", ".pswp__more-item", e => {
const img_el = e.target;
const index = this.pswp.items.findIndex(i => i.name === this.pswp.currItem.name);
const index = this.pswp.items.findIndex(
i => i.name === this.pswp.currItem.name
);
this.pswp.goTo(index);
this.pswp.items.splice(index, 1, {
@ -351,7 +363,7 @@ frappe.views.GalleryView = Class.extend({
});
// hide more-images 2s after mousemove
$(document).on('mousemove', hide_more_items_after_2s);
$(document).on("mousemove", hide_more_items_after_2s);
function hide_more_items_after_2s() {
clearTimeout(last_hide_timeout);
@ -373,15 +385,18 @@ frappe.views.GalleryView = Class.extend({
</div>`;
}
},
load_lib: function () {
load_lib: function() {
return new Promise(resolve => {
var asset_dir = 'assets/frappe/js/lib/photoswipe/';
frappe.require([
asset_dir + 'photoswipe.css',
asset_dir + 'default-skin.css',
asset_dir + 'photoswipe.js',
asset_dir + 'photoswipe-ui-default.js'
], resolve);
var asset_dir = "assets/frappe/js/lib/photoswipe/";
frappe.require(
[
asset_dir + "photoswipe.css",
asset_dir + "default-skin.css",
asset_dir + "photoswipe.js",
asset_dir + "photoswipe-ui-default.js"
],
resolve
);
});
}
});
});

View file

@ -40,16 +40,17 @@ export default class LinksWidget extends Widget {
const get_link_for_item = item => {
if (is_link_disabled(item)) {
return `<span class="link-content ellipsis disabled-link">${item.label ? item.label : item.name
}</span>
<div class="module-link-popover popover fade top in" role="tooltip" style="display: none;">
<div class="arrow"></div>
<h3 class="popover-title" style="display: none;"></h3>
<div class="popover-content" style="padding: 12px;">
<div class="small text-muted">${__("You need to create these first: ")}</div>
<div class="small">${item.incomplete_dependencies.join(", ")}</div>
</div>
</div>`;
return `<span class="link-content ellipsis disabled-link">${
item.label ? item.label : item.name
}</span>
<div class="module-link-popover popover fade top in" role="tooltip" style="display: none;">
<div class="arrow"></div>
<h3 class="popover-title" style="display: none;"></h3>
<div class="popover-content" style="padding: 12px;">
<div class="small text-muted">${__("You need to create these first: ")}</div>
<div class="small">${item.incomplete_dependencies.join(", ")}</div>
</div>
</div>`;
}
if (item.youtube_id)