2020-05-20 23:13:28 +02:00
|
|
|
Ant = this
|
2020-06-05 17:45:07 +02:00
|
|
|
class ShowCase extends this.OS.application.BaseApplication
|
2020-05-20 23:13:28 +02:00
|
|
|
constructor: (args) ->
|
|
|
|
super "ShowCase", args
|
|
|
|
|
|
|
|
main: () ->
|
|
|
|
|
|
|
|
bt = @find 'bttest'
|
|
|
|
|
|
|
|
@observable.on "btclick", (e) =>
|
|
|
|
@notify "button clicked"
|
2021-03-15 13:17:09 +01:00
|
|
|
|
|
|
|
@bindKey("CTRL-SHIFT-P", (e) => @notify("CTRL-SHIFT-P shortcut executed"))
|
|
|
|
|
2020-05-20 23:13:28 +02:00
|
|
|
list = @find 'list'
|
|
|
|
|
2020-06-05 17:45:07 +02:00
|
|
|
list.data = [
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "some thing with avery long text" },
|
|
|
|
{ text: "some thing 1", closable: true },
|
|
|
|
{ text: "some thing 2", iconclass: "fa fa-camera-retro fa-lg" },
|
|
|
|
{ text: "some thing 3" },
|
|
|
|
{ text: "some thing 4" },
|
|
|
|
{ text: "some thing 5" }
|
|
|
|
]
|
2020-06-05 17:45:07 +02:00
|
|
|
|
|
|
|
list.onlistselect = (e) => @notify(e.data.items)
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
sw = @find 'switch'
|
2020-06-05 17:45:07 +02:00
|
|
|
sw.onswchange = (e) =>
|
2020-05-20 23:13:28 +02:00
|
|
|
@notify e.data
|
|
|
|
|
|
|
|
spin = @find 'spin'
|
2020-06-05 17:45:07 +02:00
|
|
|
spin.onvaluechange = (e) =>
|
2020-05-20 23:13:28 +02:00
|
|
|
@notify e.data
|
|
|
|
|
|
|
|
menu = @find 'menu'
|
2022-12-31 22:45:42 +01:00
|
|
|
menu.nodes = @menu()
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
list.contextmenuHandle = (e, m) =>
|
2020-06-05 17:45:07 +02:00
|
|
|
m.items = @menu()
|
2020-05-20 23:13:28 +02:00
|
|
|
m.show e
|
|
|
|
|
|
|
|
grid = @find 'grid'
|
2020-06-05 17:45:07 +02:00
|
|
|
grid.oncelldbclick = (e) =>
|
2020-05-20 23:13:28 +02:00
|
|
|
@notify "on dbclick", e
|
2020-06-05 17:45:07 +02:00
|
|
|
grid.onrowselect = (e) =>
|
|
|
|
@notify "on rowselect"
|
2020-05-20 23:13:28 +02:00
|
|
|
|
2020-06-05 17:45:07 +02:00
|
|
|
grid.header = [{ text: "header1", width: 80 }, { text: "header2" }, { text: "header3" }]
|
|
|
|
grid.rows = [
|
2020-05-20 23:13:28 +02:00
|
|
|
[{ text: "text 1" }, { text: "text 2" }, { text: "text 3" }],
|
|
|
|
[{ text: "text 4" }, { text: "text 5" }, { text: "text 6" }],
|
|
|
|
[{ text: "text 7" }, { text: "text 8" }, { text: "text 9" }],
|
2020-06-05 17:45:07 +02:00
|
|
|
[{ text: "text 10" }, { text: "this is a long text" }, { text: "text 11" }]
|
2020-05-20 23:13:28 +02:00
|
|
|
]
|
|
|
|
|
|
|
|
tdata = {
|
2020-06-05 17:45:07 +02:00
|
|
|
text: 'Tree root',
|
2020-05-20 23:13:28 +02:00
|
|
|
nodes: [
|
2020-06-05 17:45:07 +02:00
|
|
|
{ text: 'leaf 1', iconclass:'fa fa-car'},
|
|
|
|
{ text: 'leaf 2' },
|
2020-05-20 23:13:28 +02:00
|
|
|
{
|
2020-06-05 17:45:07 +02:00
|
|
|
text: 'sub tree 1',
|
2020-05-20 23:13:28 +02:00
|
|
|
nodes: [
|
|
|
|
{
|
2020-06-05 17:45:07 +02:00
|
|
|
text: 'sub sub tree 1',
|
2020-05-20 23:13:28 +02:00
|
|
|
nodes: [
|
2020-06-05 17:45:07 +02:00
|
|
|
{ text: 'leaf 1 of sub sub tree 1' },
|
|
|
|
{ text: 'leaf 2 of sub sub tree 1' }
|
2020-05-20 23:13:28 +02:00
|
|
|
]
|
|
|
|
},
|
2020-06-05 17:45:07 +02:00
|
|
|
{ text: 'leaf 1 of sub tree' },
|
|
|
|
{ text: 'leaf 2 of sub tree' },
|
2020-05-20 23:13:28 +02:00
|
|
|
{
|
2020-06-05 17:45:07 +02:00
|
|
|
text: 'sub sub tree 2',
|
2020-05-20 23:13:28 +02:00
|
|
|
nodes: [
|
2020-06-05 17:45:07 +02:00
|
|
|
{ text: 'leaf 1 of sub sub tree 2' },
|
|
|
|
{ text: 'leaf 2 of sub sub tree 2' }
|
2020-05-20 23:13:28 +02:00
|
|
|
]
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
|
|
|
|
tree = @find 'tree'
|
2020-06-05 17:45:07 +02:00
|
|
|
tree.data = tdata
|
|
|
|
tree.ontreeselect = (e) =>
|
|
|
|
@notify e.data.item.treepath
|
|
|
|
tree.ontreedbclick = (e) =>
|
|
|
|
@notify "treedbclick"
|
2020-05-20 23:13:28 +02:00
|
|
|
@observable.on "treedbclick", (e) =>
|
2020-06-05 17:45:07 +02:00
|
|
|
@notify "observable treedbclick"
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
slider = @find 'slider'
|
2020-06-05 17:45:07 +02:00
|
|
|
slider.onvaluechange = (v) =>
|
2020-05-20 23:13:28 +02:00
|
|
|
@notify v
|
|
|
|
|
|
|
|
cal = @find 'cal'
|
2020-06-05 17:45:07 +02:00
|
|
|
cal.ondateselect = (e) =>
|
|
|
|
@notify e.data.toString()
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
pk = @find 'cpk'
|
2020-06-05 17:45:07 +02:00
|
|
|
pk.oncolorselect = (e) =>
|
|
|
|
@notify JSON.stringify(e)
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
fileview = @find 'fileview'
|
2020-06-05 17:45:07 +02:00
|
|
|
fileview.fetch = (path) ->
|
2020-05-20 23:13:28 +02:00
|
|
|
new Promise (resolve, reject) ->
|
|
|
|
dir = path.asFileHandle()
|
|
|
|
dir.read().then (d) ->
|
|
|
|
p = dir.parent().asFileHandle()
|
|
|
|
p.filename = "[..]"
|
|
|
|
p.type = "dir"
|
|
|
|
return reject d.error if d.error
|
|
|
|
d.result.unshift p
|
|
|
|
resolve d.result
|
2020-06-05 17:45:07 +02:00
|
|
|
fileview.path = "home:///"
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
viewoption = @find 'viewoption'
|
2020-06-05 17:45:07 +02:00
|
|
|
viewoption.data = [
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "icon" },
|
|
|
|
{ text: "list" },
|
|
|
|
{ text: "tree" }
|
|
|
|
]
|
2020-06-05 17:45:07 +02:00
|
|
|
viewoption.onlistselect = (e) =>
|
|
|
|
@notify e.data.item.data.text
|
|
|
|
fileview.view = e.data.item.data.text
|
2020-05-20 23:13:28 +02:00
|
|
|
|
|
|
|
dllist = @find "dialoglist"
|
|
|
|
btrun = @find "btrundia"
|
|
|
|
|
2020-06-05 17:45:07 +02:00
|
|
|
dllist.data = [
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "Prompt dialog", id: "prompt" },
|
|
|
|
{ text: "Calendar dialog", id: "calendar" },
|
|
|
|
{ text: "Color picker dialog", id: "colorpicker" },
|
|
|
|
{ text: "Info dialog", id: "info" },
|
|
|
|
{ text: "YesNo dialog", id: "yesno" },
|
|
|
|
{ text: "Selection dialog", id: "selection" },
|
|
|
|
{ text: "About dialog", id: "about" },
|
2020-05-21 17:28:02 +02:00
|
|
|
{ text: "File dialog", id: "file" },
|
2021-03-15 13:17:09 +01:00
|
|
|
{ text: "Text dialog", id: "text" },
|
2021-03-30 20:06:32 +02:00
|
|
|
{ text: "Multi-input dialog", id: "minputs" },
|
|
|
|
{ text: "Multi key value dialog", id: "mkv" }
|
2020-05-20 23:13:28 +02:00
|
|
|
]
|
|
|
|
|
2020-06-05 17:45:07 +02:00
|
|
|
btrun.onbtclick = (e) =>
|
|
|
|
item = dllist.selectedItem
|
2020-05-20 23:13:28 +02:00
|
|
|
return unless item
|
2020-06-05 17:45:07 +02:00
|
|
|
switch item.data.id
|
2020-05-20 23:13:28 +02:00
|
|
|
when "prompt"
|
|
|
|
@openDialog("PromptDialog", {
|
|
|
|
title: "Prompt review",
|
|
|
|
value: "txt data",
|
|
|
|
label: "enter value"
|
|
|
|
})
|
|
|
|
.then (d) =>
|
|
|
|
@notify d
|
|
|
|
when "calendar"
|
|
|
|
@openDialog("CalendarDialog", {
|
2020-06-05 17:45:07 +02:00
|
|
|
title: "Calendar dialog"
|
2020-05-20 23:13:28 +02:00
|
|
|
})
|
|
|
|
.then (d) =>
|
2020-06-05 17:45:07 +02:00
|
|
|
@notify d.toString()
|
2020-05-20 23:13:28 +02:00
|
|
|
when "colorpicker"
|
|
|
|
@openDialog("ColorPickerDialog")
|
|
|
|
.then (d) =>
|
2020-06-05 17:45:07 +02:00
|
|
|
@notify JSON.stringify(d)
|
2020-05-20 23:13:28 +02:00
|
|
|
when "info"
|
|
|
|
@openDialog("InfoDialog", {
|
|
|
|
title: "Info application",
|
|
|
|
name: "Show case",
|
|
|
|
date: "10/12/2014",
|
|
|
|
description: "the brown fox jumps over the lazy dog"
|
|
|
|
})
|
|
|
|
.then (d) ->
|
|
|
|
when "yesno"
|
|
|
|
@openDialog("YesNoDialog", {
|
|
|
|
title: "Question ?",
|
|
|
|
text: "Do you realy want to delete file ?"
|
|
|
|
})
|
|
|
|
.then (d) =>
|
|
|
|
@notify d
|
|
|
|
when "selection"
|
|
|
|
@openDialog("SelectionDialog", {
|
|
|
|
title: "Select data ?",
|
|
|
|
data: [
|
|
|
|
{ text: "Option 1" },
|
|
|
|
{ text: "Option 2" },
|
|
|
|
{ text: "Option 3", iconclass: "fa fa-camera-retro fa-lg" }
|
|
|
|
]
|
|
|
|
})
|
|
|
|
.then (d) =>
|
|
|
|
@notify d.text
|
|
|
|
when "about"
|
|
|
|
@openDialog("AboutDialog" )
|
|
|
|
.then (d) =>
|
|
|
|
when "file"
|
|
|
|
@openDialog("FileDialog", {
|
|
|
|
title: "Select file ?",
|
|
|
|
#root: "home:///",
|
|
|
|
mimes: ["text/*", "dir"],
|
|
|
|
file: "Untitled".asFileHandle()
|
|
|
|
})
|
|
|
|
.then (f, name) =>
|
|
|
|
@notify f, name
|
2020-05-21 17:28:02 +02:00
|
|
|
|
|
|
|
when "text"
|
|
|
|
@openDialog("TextDialog", {
|
|
|
|
title: "Text dialog review",
|
2022-12-31 22:45:42 +01:00
|
|
|
value: "txt data",
|
|
|
|
label: "this is the label"
|
2020-05-21 17:28:02 +02:00
|
|
|
})
|
|
|
|
.then (d) =>
|
|
|
|
@notify d
|
2021-03-15 13:17:09 +01:00
|
|
|
when "minputs"
|
|
|
|
@openDialog("MultiInputDialog", {
|
|
|
|
title: "Multi-inputs",
|
|
|
|
model: {
|
|
|
|
name: "Your name",
|
|
|
|
email: "Your email",
|
|
|
|
where: "Your address"
|
|
|
|
},
|
|
|
|
allow_empty: false,
|
|
|
|
data: {
|
|
|
|
name: "John Doe",
|
|
|
|
email: "jd@mail.com",
|
|
|
|
where: "Anywhere on Earth"
|
|
|
|
}
|
|
|
|
})
|
|
|
|
.then (d) =>
|
|
|
|
@notify JSON.stringify(d)
|
2021-03-30 20:06:32 +02:00
|
|
|
|
|
|
|
when "mkv"
|
|
|
|
@openDialog("KeyValueDialog", {
|
|
|
|
title: "Multi key-values",
|
|
|
|
data: {
|
|
|
|
name: "John Doe",
|
|
|
|
email: "jd@mail.com",
|
|
|
|
where: "Anywhere on Earth"
|
|
|
|
}
|
|
|
|
})
|
|
|
|
.then (d) =>
|
|
|
|
@notify JSON.stringify(d)
|
2020-05-20 23:13:28 +02:00
|
|
|
else return
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
mnFile: () ->
|
|
|
|
#@notify file
|
|
|
|
arr = {
|
|
|
|
text: "__(File)",
|
2020-06-05 17:45:07 +02:00
|
|
|
nodes: [
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "__(New file)", dataid: "#{@name}-mkf", shortcut: 'C-F' },
|
|
|
|
{ text: "__(New folder)", dataid: "#{@name}-mkdir", shortcut: 'C-D' },
|
|
|
|
{ text: "__(Open with)", dataid: "#{@name}-open", child: @apps },
|
|
|
|
{ text: "__(Upload)", dataid: "#{@name}-upload", shortcut: 'C-U' },
|
|
|
|
{ text: "__(Download)", dataid: "#{@name}-download" },
|
|
|
|
{ text: "__(Share file)", dataid: "#{@name}-share", shortcut: 'C-S' },
|
|
|
|
{ text: "__(Properties)", dataid: "#{@name}-info", shortcut: 'C-I' }
|
2020-06-05 17:45:07 +02:00
|
|
|
], onchildselect: (e) => @notify e.data.item.data.text
|
2020-05-20 23:13:28 +02:00
|
|
|
}
|
|
|
|
return arr
|
|
|
|
mnEdit: () ->
|
|
|
|
|
|
|
|
{
|
|
|
|
text: "__(Edit)",
|
2020-06-05 17:45:07 +02:00
|
|
|
nodes: [
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "__(Rename)", dataid: "#{@name}-mv", shortcut: 'C-R' },
|
|
|
|
{ text: "__(Delete)", dataid: "#{@name}-rm", shortcut: 'C-M' },
|
|
|
|
{ text: "__(Cut)", dataid: "#{@name}-cut", shortcut: 'C-X' },
|
|
|
|
{ text: "__(Copy)", dataid: "#{@name}-copy", shortcut: 'C-C' },
|
|
|
|
{ text: "__(Paste)", dataid: "#{@name}-paste", shortcut: 'C-P' }
|
2020-06-05 17:45:07 +02:00
|
|
|
], onchildselect: (e) => @notify e.data.item.data.text
|
2020-05-20 23:13:28 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
menu: () ->
|
|
|
|
menu = [
|
|
|
|
@mnFile(),
|
|
|
|
@mnEdit(),
|
|
|
|
{
|
|
|
|
text: "__(View)",
|
2020-06-05 17:45:07 +02:00
|
|
|
nodes: [
|
|
|
|
{ text: "__(Refresh)", dataid: "#{@name}-refresh"},
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "__(Sidebar)", switch: true, checked: true },
|
|
|
|
{ text: "__(Navigation bar)", switch: true, checked: false },
|
|
|
|
{ text: "__(Hidden files)", switch: true, checked: true, dataid: "#{@name}-hidden" },
|
2022-12-31 22:45:42 +01:00
|
|
|
{ text: "__(Type)", nodes: [
|
2020-05-20 23:13:28 +02:00
|
|
|
{ text: "__(Icon view)", radio: true, checked: true, dataid: "#{@name}-icon", type: 'icon' },
|
|
|
|
{ text: "__(List view)", radio:true, checked: false, dataid: "#{@name}-list", type: 'list' },
|
|
|
|
{ text: "__(Tree view)", radio:true, checked: false, dataid: "#{@name}-tree", type: 'tree' }
|
2022-12-31 22:45:42 +01:00
|
|
|
], onchildselect: (e) => @notify e.data.item.data.text
|
2020-05-20 23:13:28 +02:00
|
|
|
},
|
2020-06-05 17:45:07 +02:00
|
|
|
], onchildselect: (e) => @notify e.data.item.data.text
|
2020-05-20 23:13:28 +02:00
|
|
|
},
|
|
|
|
]
|
|
|
|
menu
|
|
|
|
ShowCase.singleton = true
|
|
|
|
this.OS.register "ShowCase", ShowCase
|