kopia lustrzana https://github.com/backface/turtlestitch
refactored IDE project dialog ops
jmoenig
rodzic
54da6fe7a5
commit
38fc35ec9f
255
src/gui.js
255
src/gui.js
|
|
@ -6125,8 +6125,6 @@ function ProjectDialogMorph(ide, label) {
|
||||||
}
|
}
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.init = function (ide, task) {
|
ProjectDialogMorph.prototype.init = function (ide, task) {
|
||||||
var myself = this;
|
|
||||||
|
|
||||||
// additional properties:
|
// additional properties:
|
||||||
this.ide = ide;
|
this.ide = ide;
|
||||||
this.task = task || 'open'; // String describing what do do (open, save)
|
this.task = task || 'open'; // String describing what do do (open, save)
|
||||||
|
|
@ -6172,9 +6170,8 @@ ProjectDialogMorph.prototype.init = function (ide, task) {
|
||||||
this.source = 'disk';
|
this.source = 'disk';
|
||||||
} else {
|
} else {
|
||||||
this.buildContents();
|
this.buildContents();
|
||||||
this.onNextStep = function () { // yield to show "updating" message
|
this.onNextStep = () => // yield to show "updating" message
|
||||||
myself.setSource(myself.source);
|
this.setSource(this.source);
|
||||||
};
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -6397,8 +6394,7 @@ ProjectDialogMorph.prototype.addSourceButton = function (
|
||||||
label,
|
label,
|
||||||
symbol
|
symbol
|
||||||
) {
|
) {
|
||||||
var myself = this,
|
var lbl1 = new StringMorph(
|
||||||
lbl1 = new StringMorph(
|
|
||||||
label,
|
label,
|
||||||
10,
|
10,
|
||||||
null,
|
null,
|
||||||
|
|
@ -6453,14 +6449,10 @@ ProjectDialogMorph.prototype.addSourceButton = function (
|
||||||
|
|
||||||
button = new ToggleButtonMorph(
|
button = new ToggleButtonMorph(
|
||||||
null, //colors,
|
null, //colors,
|
||||||
myself, // the ProjectDialog is the target
|
this, // the ProjectDialog is the target
|
||||||
function () { // action
|
() => this.setSource(source), // action
|
||||||
myself.setSource(source);
|
|
||||||
},
|
|
||||||
[l1, l2],
|
[l1, l2],
|
||||||
function () { // query
|
() => this.source === source // query
|
||||||
return myself.source === source;
|
|
||||||
}
|
|
||||||
);
|
);
|
||||||
|
|
||||||
button.corner = this.buttonCorner;
|
button.corner = this.buttonCorner;
|
||||||
|
|
@ -6482,10 +6474,9 @@ ProjectDialogMorph.prototype.addSourceButton = function (
|
||||||
ProjectDialogMorph.prototype.fixListFieldItemColors = function () {
|
ProjectDialogMorph.prototype.fixListFieldItemColors = function () {
|
||||||
// remember to always fixLayout() afterwards for the changes
|
// remember to always fixLayout() afterwards for the changes
|
||||||
// to take effect
|
// to take effect
|
||||||
var myself = this;
|
|
||||||
this.listField.contents.children[0].alpha = 0;
|
this.listField.contents.children[0].alpha = 0;
|
||||||
this.listField.contents.children[0].children.forEach(function (item) {
|
this.listField.contents.children[0].children.forEach(item => {
|
||||||
item.pressColor = myself.titleBarColor.darker(20);
|
item.pressColor = this.titleBarColor.darker(20);
|
||||||
item.color = new Color(0, 0, 0, 0);
|
item.color = new Color(0, 0, 0, 0);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
@ -6496,11 +6487,11 @@ ProjectDialogMorph.prototype.buildFilterField = function () {
|
||||||
var myself = this;
|
var myself = this;
|
||||||
|
|
||||||
this.filterField = new InputFieldMorph('');
|
this.filterField = new InputFieldMorph('');
|
||||||
this.magnifyingGlass =
|
this.magnifyingGlass = new SymbolMorph(
|
||||||
new SymbolMorph(
|
|
||||||
'magnifyingGlass',
|
'magnifyingGlass',
|
||||||
this.filterField.height(),
|
this.filterField.height(),
|
||||||
this.titleBarColor.darker(50));
|
this.titleBarColor.darker(50)
|
||||||
|
);
|
||||||
|
|
||||||
this.body.add(this.magnifyingGlass);
|
this.body.add(this.magnifyingGlass);
|
||||||
this.body.add(this.filterField);
|
this.body.add(this.filterField);
|
||||||
|
|
@ -6509,10 +6500,9 @@ ProjectDialogMorph.prototype.buildFilterField = function () {
|
||||||
var text = this.getValue();
|
var text = this.getValue();
|
||||||
|
|
||||||
myself.listField.elements =
|
myself.listField.elements =
|
||||||
myself.projectList.filter(function (aProject) {
|
myself.projectList.filter(aProject => {
|
||||||
var name = aProject.projectname || aProject.name,
|
var name = aProject.projectname || aProject.name,
|
||||||
notes = aProject.notes || '';
|
notes = aProject.notes || '';
|
||||||
|
|
||||||
return name.toLowerCase().indexOf(text.toLowerCase()) > -1 ||
|
return name.toLowerCase().indexOf(text.toLowerCase()) > -1 ||
|
||||||
notes.toLowerCase().indexOf(text.toLowerCase()) > -1;
|
notes.toLowerCase().indexOf(text.toLowerCase()) > -1;
|
||||||
});
|
});
|
||||||
|
|
@ -6533,29 +6523,28 @@ ProjectDialogMorph.prototype.buildFilterField = function () {
|
||||||
// ProjectDialogMorph ops
|
// ProjectDialogMorph ops
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.setSource = function (source) {
|
ProjectDialogMorph.prototype.setSource = function (source) {
|
||||||
var myself = this,
|
var msg;
|
||||||
msg;
|
|
||||||
|
|
||||||
this.source = source;
|
this.source = source;
|
||||||
this.srcBar.children.forEach(function (button) {
|
this.srcBar.children.forEach(button =>
|
||||||
button.refresh();
|
button.refresh()
|
||||||
});
|
);
|
||||||
|
|
||||||
switch (this.source) {
|
switch (this.source) {
|
||||||
case 'cloud':
|
case 'cloud':
|
||||||
msg = myself.ide.showMessage('Updating\nproject list...');
|
msg = this.ide.showMessage('Updating\nproject list...');
|
||||||
this.projectList = [];
|
this.projectList = [];
|
||||||
myself.ide.cloud.getProjectList(
|
this.ide.cloud.getProjectList(
|
||||||
function (response) {
|
response => {
|
||||||
// Don't show cloud projects if user has since switched panes.
|
// Don't show cloud projects if user has since switched panes.
|
||||||
if (myself.source === 'cloud') {
|
if (this.source === 'cloud') {
|
||||||
myself.installCloudProjectList(response.projects);
|
this.installCloudProjectList(response.projects);
|
||||||
}
|
}
|
||||||
msg.destroy();
|
msg.destroy();
|
||||||
},
|
},
|
||||||
function (err, lbl) {
|
(err, lbl) => {
|
||||||
msg.destroy();
|
msg.destroy();
|
||||||
myself.ide.cloudError().call(null, err, lbl);
|
this.ide.cloudError().call(null, err, lbl);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
|
|
@ -6581,11 +6570,10 @@ ProjectDialogMorph.prototype.setSource = function (source) {
|
||||||
this.listField = new ListMorph(
|
this.listField = new ListMorph(
|
||||||
this.projectList,
|
this.projectList,
|
||||||
this.projectList.length > 0 ?
|
this.projectList.length > 0 ?
|
||||||
function (element) {
|
(element) => {return element.name || element; }
|
||||||
return element.name || element;
|
: null,
|
||||||
} : null,
|
|
||||||
null,
|
null,
|
||||||
function () {myself.ok(); }
|
() => this.ok()
|
||||||
);
|
);
|
||||||
if (this.source === 'disk') {
|
if (this.source === 'disk') {
|
||||||
this.listField.hide();
|
this.listField.hide();
|
||||||
|
|
@ -6601,53 +6589,46 @@ ProjectDialogMorph.prototype.setSource = function (source) {
|
||||||
this.listField.drawRectBorder = InputFieldMorph.prototype.drawRectBorder;
|
this.listField.drawRectBorder = InputFieldMorph.prototype.drawRectBorder;
|
||||||
|
|
||||||
if (this.source === 'local') {
|
if (this.source === 'local') {
|
||||||
this.listField.action = function (item) {
|
this.listField.action = (item) => {
|
||||||
var src, xml;
|
var src, xml;
|
||||||
|
|
||||||
if (item === undefined) {return; }
|
if (item === undefined) {return; }
|
||||||
if (myself.nameField) {
|
if (this.nameField) {
|
||||||
myself.nameField.setContents(item.name || '');
|
this.nameField.setContents(item.name || '');
|
||||||
}
|
}
|
||||||
if (myself.task === 'open') {
|
if (this.task === 'open') {
|
||||||
|
|
||||||
src = localStorage['-snap-project-' + item.name];
|
src = localStorage['-snap-project-' + item.name];
|
||||||
|
|
||||||
if (src) {
|
if (src) {
|
||||||
xml = myself.ide.serializer.parse(src);
|
xml = this.ide.serializer.parse(src);
|
||||||
|
this.notesText.text =
|
||||||
myself.notesText.text = xml.childNamed('notes').contents
|
xml.childNamed('notes').contents || '';
|
||||||
|| '';
|
this.notesText.rerender();
|
||||||
myself.notesText.rerender();
|
this.notesField.contents.adjustBounds();
|
||||||
myself.notesField.contents.adjustBounds();
|
this.preview.texture =
|
||||||
myself.preview.texture =
|
|
||||||
xml.childNamed('thumbnail').contents || null;
|
xml.childNamed('thumbnail').contents || null;
|
||||||
myself.preview.cachedTexture = null;
|
this.preview.cachedTexture = null;
|
||||||
myself.preview.rerender();
|
this.preview.rerender();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
myself.edit();
|
this.edit();
|
||||||
};
|
};
|
||||||
} else { // 'examples'; 'cloud' is initialized elsewhere
|
} else { // 'examples'; 'cloud' is initialized elsewhere
|
||||||
this.listField.action = function (item) {
|
this.listField.action = (item) => {
|
||||||
var src, xml;
|
var src, xml;
|
||||||
if (item === undefined) {return; }
|
if (item === undefined) {return; }
|
||||||
if (myself.nameField) {
|
if (this.nameField) {
|
||||||
myself.nameField.setContents(item.name || '');
|
this.nameField.setContents(item.name || '');
|
||||||
}
|
}
|
||||||
src = myself.ide.getURL(
|
src = this.ide.getURL(
|
||||||
myself.ide.resourceURL('Examples', item.fileName)
|
this.ide.resourceURL('Examples', item.fileName)
|
||||||
);
|
);
|
||||||
|
xml = this.ide.serializer.parse(src);
|
||||||
xml = myself.ide.serializer.parse(src);
|
this.notesText.text = xml.childNamed('notes').contents || '';
|
||||||
myself.notesText.text = xml.childNamed('notes').contents
|
this.notesText.rerender();
|
||||||
|| '';
|
this.notesField.contents.adjustBounds();
|
||||||
myself.notesText.rerender();
|
this.preview.texture = xml.childNamed('thumbnail').contents || null;
|
||||||
myself.notesField.contents.adjustBounds();
|
this.preview.cachedTexture = null;
|
||||||
myself.preview.texture = xml.childNamed('thumbnail').contents
|
this.preview.rerender();
|
||||||
|| null;
|
this.edit();
|
||||||
myself.preview.cachedTexture = null;
|
|
||||||
myself.preview.rerender();
|
|
||||||
myself.edit();
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
this.body.add(this.listField);
|
this.body.add(this.listField);
|
||||||
|
|
@ -6676,9 +6657,9 @@ ProjectDialogMorph.prototype.hasLocalProjects = function () {
|
||||||
// check and report whether old projects still exist in the
|
// check and report whether old projects still exist in the
|
||||||
// browser's local storage, which as of v5 has been deprecated,
|
// browser's local storage, which as of v5 has been deprecated,
|
||||||
// so the user can recover and move them elsewhere
|
// so the user can recover and move them elsewhere
|
||||||
return Object.keys(localStorage).some(function (any) {
|
return Object.keys(localStorage).some(any =>
|
||||||
return any.indexOf('-snap-project-') === 0;
|
any.indexOf('-snap-project-') === 0
|
||||||
});
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.getLocalProjectList = function () {
|
ProjectDialogMorph.prototype.getLocalProjectList = function () {
|
||||||
|
|
@ -6696,9 +6677,9 @@ ProjectDialogMorph.prototype.getLocalProjectList = function () {
|
||||||
projects.push(dta);
|
projects.push(dta);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
projects.sort(function (x, y) {
|
projects.sort((x, y) =>
|
||||||
return x.name.toLowerCase() < y.name.toLowerCase() ? -1 : 1;
|
x.name.toLowerCase() < y.name.toLowerCase() ? -1 : 1
|
||||||
});
|
);
|
||||||
return projects;
|
return projects;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -6707,31 +6688,28 @@ ProjectDialogMorph.prototype.getExamplesProjectList = function () {
|
||||||
};
|
};
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.installCloudProjectList = function (pl) {
|
ProjectDialogMorph.prototype.installCloudProjectList = function (pl) {
|
||||||
var myself = this;
|
|
||||||
this.projectList = pl[0] ? pl : [];
|
this.projectList = pl[0] ? pl : [];
|
||||||
this.projectList.sort(function (x, y) {
|
this.projectList.sort((x, y) =>
|
||||||
return x.projectname.toLowerCase() < y.projectname.toLowerCase() ?
|
x.projectname.toLowerCase() < y.projectname.toLowerCase() ? -1 : 1
|
||||||
-1 : 1;
|
);
|
||||||
});
|
|
||||||
|
|
||||||
this.listField.destroy();
|
this.listField.destroy();
|
||||||
this.listField = new ListMorph(
|
this.listField = new ListMorph(
|
||||||
this.projectList,
|
this.projectList,
|
||||||
this.projectList.length > 0 ?
|
this.projectList.length > 0 ?
|
||||||
function (element) {
|
(element) => {return element.projectname || element; }
|
||||||
return element.projectname || element;
|
: null,
|
||||||
} : null,
|
|
||||||
[ // format: display shared project names bold
|
[ // format: display shared project names bold
|
||||||
[
|
[
|
||||||
'bold',
|
'bold',
|
||||||
function (proj) { return proj.ispublic; }
|
proj => proj.ispublic
|
||||||
],
|
],
|
||||||
[
|
[
|
||||||
'italic',
|
'italic',
|
||||||
function (proj) { return proj.ispublished; }
|
proj => proj.ispublished
|
||||||
]
|
]
|
||||||
],
|
],
|
||||||
function () { myself.ok(); }
|
() => this.ok()
|
||||||
);
|
);
|
||||||
this.fixListFieldItemColors();
|
this.fixListFieldItemColors();
|
||||||
this.listField.fixLayout = nop;
|
this.listField.fixLayout = nop;
|
||||||
|
|
@ -6742,57 +6720,57 @@ ProjectDialogMorph.prototype.installCloudProjectList = function (pl) {
|
||||||
this.listField.render = InputFieldMorph.prototype.render;
|
this.listField.render = InputFieldMorph.prototype.render;
|
||||||
this.listField.drawRectBorder = InputFieldMorph.prototype.drawRectBorder;
|
this.listField.drawRectBorder = InputFieldMorph.prototype.drawRectBorder;
|
||||||
|
|
||||||
this.listField.action = function (item) {
|
this.listField.action = (item) => {
|
||||||
if (item === undefined) {return; }
|
if (item === undefined) {return; }
|
||||||
if (myself.nameField) {
|
if (this.nameField) {
|
||||||
myself.nameField.setContents(item.projectname || '');
|
this.nameField.setContents(item.projectname || '');
|
||||||
}
|
}
|
||||||
if (myself.task === 'open') {
|
if (this.task === 'open') {
|
||||||
myself.notesText.text = item.notes || '';
|
this.notesText.text = item.notes || '';
|
||||||
myself.notesText.rerender();
|
this.notesText.rerender();
|
||||||
myself.notesField.contents.adjustBounds();
|
this.notesField.contents.adjustBounds();
|
||||||
myself.preview.texture = '';
|
this.preview.texture = '';
|
||||||
myself.preview.rerender();
|
this.preview.rerender();
|
||||||
// we ask for the thumbnail when selecting a project
|
// we ask for the thumbnail when selecting a project
|
||||||
myself.ide.cloud.getThumbnail(
|
this.ide.cloud.getThumbnail(
|
||||||
null, // username is implicit
|
null, // username is implicit
|
||||||
item.projectname,
|
item.projectname,
|
||||||
function (thumbnail) {
|
thumbnail => {
|
||||||
myself.preview.texture = thumbnail;
|
this.preview.texture = thumbnail;
|
||||||
myself.preview.cachedTexture = null;
|
this.preview.cachedTexture = null;
|
||||||
myself.preview.rerender();
|
this.preview.rerender();
|
||||||
});
|
});
|
||||||
(new SpeechBubbleMorph(new TextMorph(
|
new SpeechBubbleMorph(new TextMorph(
|
||||||
localize('last changed') + '\n' + item.lastupdated,
|
localize('last changed') + '\n' + item.lastupdated,
|
||||||
null,
|
null,
|
||||||
null,
|
null,
|
||||||
null,
|
null,
|
||||||
null,
|
null,
|
||||||
'center'
|
'center'
|
||||||
))).popUp(
|
)).popUp(
|
||||||
myself.world(),
|
this.world(),
|
||||||
myself.preview.rightCenter().add(new Point(2, 0))
|
this.preview.rightCenter().add(new Point(2, 0))
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
if (item.ispublic) {
|
if (item.ispublic) {
|
||||||
myself.shareButton.hide();
|
this.shareButton.hide();
|
||||||
myself.unshareButton.show();
|
this.unshareButton.show();
|
||||||
if (item.ispublished) {
|
if (item.ispublished) {
|
||||||
myself.publishButton.hide();
|
this.publishButton.hide();
|
||||||
myself.unpublishButton.show();
|
this.unpublishButton.show();
|
||||||
} else {
|
} else {
|
||||||
myself.publishButton.show();
|
this.publishButton.show();
|
||||||
myself.unpublishButton.hide();
|
this.unpublishButton.hide();
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
myself.unshareButton.hide();
|
this.unshareButton.hide();
|
||||||
myself.shareButton.show();
|
this.shareButton.show();
|
||||||
myself.publishButton.hide();
|
this.publishButton.hide();
|
||||||
myself.unpublishButton.hide();
|
this.unpublishButton.hide();
|
||||||
}
|
}
|
||||||
myself.buttons.fixLayout();
|
this.buttons.fixLayout();
|
||||||
myself.fixLayout();
|
this.fixLayout();
|
||||||
myself.edit();
|
this.edit();
|
||||||
};
|
};
|
||||||
this.body.add(this.listField);
|
this.body.add(this.listField);
|
||||||
if (this.task === 'open') {
|
if (this.task === 'open') {
|
||||||
|
|
@ -6844,67 +6822,58 @@ ProjectDialogMorph.prototype.openProject = function () {
|
||||||
};
|
};
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.openCloudProject = function (project, delta) {
|
ProjectDialogMorph.prototype.openCloudProject = function (project, delta) {
|
||||||
var myself = this;
|
this.ide.nextSteps([
|
||||||
myself.ide.nextSteps([
|
() => this.ide.showMessage('Fetching project\nfrom the cloud...'),
|
||||||
function () {
|
() => this.rawOpenCloudProject(project, delta)
|
||||||
myself.ide.showMessage('Fetching project\nfrom the cloud...');
|
|
||||||
},
|
|
||||||
function () {
|
|
||||||
myself.rawOpenCloudProject(project, delta);
|
|
||||||
}
|
|
||||||
]);
|
]);
|
||||||
};
|
};
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.rawOpenCloudProject = function (proj, delta) {
|
ProjectDialogMorph.prototype.rawOpenCloudProject = function (proj, delta) {
|
||||||
var myself = this;
|
|
||||||
this.ide.cloud.getProject(
|
this.ide.cloud.getProject(
|
||||||
proj.projectname,
|
proj.projectname,
|
||||||
delta,
|
delta,
|
||||||
function (clouddata) {
|
clouddata => {
|
||||||
myself.ide.source = 'cloud';
|
this.ide.source = 'cloud';
|
||||||
myself.ide.nextSteps([
|
this.ide.nextSteps([
|
||||||
function () {
|
() => this.ide.openCloudDataString(clouddata)
|
||||||
myself.ide.openCloudDataString(clouddata);
|
|
||||||
}
|
|
||||||
]);
|
]);
|
||||||
location.hash = '';
|
location.hash = '';
|
||||||
if (proj.ispublic) {
|
if (proj.ispublic) {
|
||||||
location.hash = '#present:Username=' +
|
location.hash = '#present:Username=' +
|
||||||
encodeURIComponent(myself.ide.cloud.username) +
|
encodeURIComponent(this.ide.cloud.username) +
|
||||||
'&ProjectName=' +
|
'&ProjectName=' +
|
||||||
encodeURIComponent(proj.projectname);
|
encodeURIComponent(proj.projectname);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
myself.ide.cloudError()
|
this.ide.cloudError()
|
||||||
);
|
);
|
||||||
this.destroy();
|
this.destroy();
|
||||||
};
|
};
|
||||||
|
|
||||||
ProjectDialogMorph.prototype.saveProject = function () {
|
ProjectDialogMorph.prototype.saveProject = function () {
|
||||||
var name = this.nameField.contents().text.text,
|
var name = this.nameField.contents().text.text,
|
||||||
notes = this.notesText.text,
|
notes = this.notesText.text;
|
||||||
myself = this;
|
|
||||||
|
|
||||||
this.ide.projectNotes = notes || this.ide.projectNotes;
|
this.ide.projectNotes = notes || this.ide.projectNotes;
|
||||||
if (name) {
|
if (name) {
|
||||||
if (this.source === 'cloud') {
|
if (this.source === 'cloud') {
|
||||||
if (detect(
|
if (detect(
|
||||||
this.projectList,
|
this.projectList,
|
||||||
function (item) {return item.projectname === name; }
|
item => item.projectname === name
|
||||||
)) {
|
)) {
|
||||||
this.ide.confirm(
|
this.ide.confirm(
|
||||||
localize(
|
localize(
|
||||||
'Are you sure you want to replace'
|
'Are you sure you want to replace'
|
||||||
) + '\n"' + name + '"?',
|
) + '\n"' + name + '"?',
|
||||||
'Replace Project',
|
'Replace Project',
|
||||||
function () {
|
() => {
|
||||||
myself.ide.setProjectName(name);
|
this.ide.setProjectName(name);
|
||||||
myself.saveCloudProject();
|
this.saveCloudProject();
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
this.ide.setProjectName(name);
|
this.ide.setProjectName(name);
|
||||||
myself.saveCloudProject();
|
this.saveCloudProject();
|
||||||
}
|
}
|
||||||
} else if (this.source === 'disk') {
|
} else if (this.source === 'disk') {
|
||||||
this.ide.exportProject(name, false);
|
this.ide.exportProject(name, false);
|
||||||
|
|
|
||||||
Ładowanie…
Reference in New Issue