mirror of
https://github.com/antos-rde/antosdk-apps.git
synced 2024-12-26 04:08:21 +01:00
add clipper
This commit is contained in:
parent
4b9645edb1
commit
9192578205
13
Clipper/README.md
Normal file
13
Clipper/README.md
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
# Clipper
|
||||||
|
|
||||||
|
VDE screen capture tool.
|
||||||
|
|
||||||
|
Clipper use `html2canvas` to capture AntOS desktop or a specific window.
|
||||||
|
It is able to crop the captured image before saving to a file
|
||||||
|
|
||||||
|
## Change logs
|
||||||
|
* v0.1.0-a initial version
|
||||||
|
|
||||||
|
|
||||||
|
## Credit
|
||||||
|
* [html2canvas](https://html2canvas.hertzen.com/)
|
BIN
Clipper/assets/bg.jpg
Normal file
BIN
Clipper/assets/bg.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 7.5 KiB |
15
Clipper/assets/scheme.html
Normal file
15
Clipper/assets/scheme.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<afx-app-window apptitle="Clipper" width="500" height="400" data-id="Clipper">
|
||||||
|
<afx-hbox >
|
||||||
|
<afx-vbox>
|
||||||
|
<div data-height="30" data-id="toolbar">
|
||||||
|
<afx-button data-id="btnCptScreen" text="__(Capture screen)" iconclass="fa fa-camera-retro"></afx-button>
|
||||||
|
<afx-button data-id="btnCptWindow" text="__(Capture a window)" iconclass="fa fa-window-maximize"></afx-button>
|
||||||
|
<afx-button data-id="btnCrop" text="__(Crop)" toggle="true" selected="false" iconclass="fa fa-crop"></afx-button>
|
||||||
|
</div>
|
||||||
|
<div data-id="wrapper">
|
||||||
|
<canvas data-id="scene"></canvas>
|
||||||
|
<div data-id="cropwin"></div>
|
||||||
|
</div>
|
||||||
|
</afx-vbox>
|
||||||
|
</afx-hbox>
|
||||||
|
</afx-app-window>
|
13
Clipper/build/debug/README.md
Normal file
13
Clipper/build/debug/README.md
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
# Clipper
|
||||||
|
|
||||||
|
VDE screen capture tool.
|
||||||
|
|
||||||
|
Clipper use `html2canvas` to capture AntOS desktop or a specific window.
|
||||||
|
It is able to crop the captured image before saving to a file
|
||||||
|
|
||||||
|
## Change logs
|
||||||
|
* v0.1.0-a initial version
|
||||||
|
|
||||||
|
|
||||||
|
## Credit
|
||||||
|
* [html2canvas](https://html2canvas.hertzen.com/)
|
BIN
Clipper/build/debug/bg.jpg
Normal file
BIN
Clipper/build/debug/bg.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 7.5 KiB |
BIN
Clipper/build/debug/chessboard.gif
Normal file
BIN
Clipper/build/debug/chessboard.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 8.5 KiB |
21
Clipper/build/debug/main.css
Normal file
21
Clipper/build/debug/main.css
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] div[data-id = "wrapper"] {
|
||||||
|
overflow: auto;
|
||||||
|
background-image: url("bg.jpg");
|
||||||
|
background-repeat: repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] div[data-id = "toolbar"] {
|
||||||
|
padding-left: 5px;
|
||||||
|
display:inline-block;
|
||||||
|
text-align:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] afx-button[data-id = "btnCrop"] button.selected {
|
||||||
|
background-color: #116cd6;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] div[data-id = "cropwin"] {
|
||||||
|
border:1px dashed chocolate;
|
||||||
|
}
|
19
Clipper/build/debug/main.js
Normal file
19
Clipper/build/debug/main.js
Normal file
File diff suppressed because one or more lines are too long
14
Clipper/build/debug/package.json
Normal file
14
Clipper/build/debug/package.json
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"app":"Clipper",
|
||||||
|
"name":"Clipper",
|
||||||
|
"description":"Clipper",
|
||||||
|
"info":{
|
||||||
|
"author": "",
|
||||||
|
"email": ""
|
||||||
|
},
|
||||||
|
"version":"0.1.0-a",
|
||||||
|
"category":"Other",
|
||||||
|
"iconclass":"fa fa-scissors",
|
||||||
|
"mimes":["none"],
|
||||||
|
"locale": {}
|
||||||
|
}
|
15
Clipper/build/debug/scheme.html
Normal file
15
Clipper/build/debug/scheme.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<afx-app-window apptitle="Clipper" width="500" height="400" data-id="Clipper">
|
||||||
|
<afx-hbox >
|
||||||
|
<afx-vbox>
|
||||||
|
<div data-height="30" data-id="toolbar">
|
||||||
|
<afx-button data-id="btnCptScreen" text="__(Capture screen)" iconclass="fa fa-camera-retro"></afx-button>
|
||||||
|
<afx-button data-id="btnCptWindow" text="__(Capture a window)" iconclass="fa fa-window-maximize"></afx-button>
|
||||||
|
<afx-button data-id="btnCrop" text="__(Crop)" toggle="true" selected="false" iconclass="fa fa-crop"></afx-button>
|
||||||
|
</div>
|
||||||
|
<div data-id="wrapper">
|
||||||
|
<canvas data-id="scene"></canvas>
|
||||||
|
<div data-id="cropwin"></div>
|
||||||
|
</div>
|
||||||
|
</afx-vbox>
|
||||||
|
</afx-hbox>
|
||||||
|
</afx-app-window>
|
BIN
Clipper/build/release/Clipper.zip
Normal file
BIN
Clipper/build/release/Clipper.zip
Normal file
Binary file not shown.
156
Clipper/coffees/main.coffee
Normal file
156
Clipper/coffees/main.coffee
Normal file
@ -0,0 +1,156 @@
|
|||||||
|
class Clipper extends this.OS.application.BaseApplication
|
||||||
|
constructor: ( args ) ->
|
||||||
|
super "Clipper", args
|
||||||
|
|
||||||
|
main: () ->
|
||||||
|
@scene = @find("scene")
|
||||||
|
@wrapper = @find("wrapper")
|
||||||
|
@cropwin = @find("cropwin")
|
||||||
|
@dirty = false
|
||||||
|
@currfile = "Untitled".asFileHandle()
|
||||||
|
$(@cropwin)
|
||||||
|
.css "position", "absolute"
|
||||||
|
.hide()
|
||||||
|
@find("btnCptScreen").onbtclick = () =>
|
||||||
|
@capture document.body, true
|
||||||
|
|
||||||
|
@find("btnCptWindow").onbtclick = () =>
|
||||||
|
# select a window
|
||||||
|
wins = []
|
||||||
|
for k, v of OS.PM.processes
|
||||||
|
for process in v
|
||||||
|
if OS.application[process.name].type is 0
|
||||||
|
wins.push {
|
||||||
|
text: process.scheme.apptitle,
|
||||||
|
el: process.scheme,
|
||||||
|
icon: process.meta().icon,
|
||||||
|
iconclass: process.meta().iconclass
|
||||||
|
}
|
||||||
|
@openDialog "SelectionDialog", {
|
||||||
|
title: "Select a window",
|
||||||
|
data: wins
|
||||||
|
}
|
||||||
|
.then (sel) =>
|
||||||
|
return unless sel
|
||||||
|
@capture sel.el
|
||||||
|
|
||||||
|
btncrop = @find("btnCrop")
|
||||||
|
|
||||||
|
@cropselect = (e) =>
|
||||||
|
offset = $(@cropwin).offset()
|
||||||
|
w = e.clientX - offset.left
|
||||||
|
h = e.clientY - offset.top
|
||||||
|
$(@cropwin)
|
||||||
|
.css "width", "#{w}px"
|
||||||
|
.css "height", "#{h}px"
|
||||||
|
|
||||||
|
@cropup = (e) =>
|
||||||
|
$(window).off "mousemove", @cropselect
|
||||||
|
$(window).off "mouseup", @cropup
|
||||||
|
|
||||||
|
@ask { text: __("Crop the selected zone ?") }
|
||||||
|
.then (b) =>
|
||||||
|
btncrop.enable = true
|
||||||
|
btncrop.selected = false
|
||||||
|
croff = $(@cropwin).offset()
|
||||||
|
scenoff = $(@scene).offset()
|
||||||
|
x = croff.left - scenoff.left
|
||||||
|
y = croff.top - scenoff.top
|
||||||
|
w = $(@cropwin).width()
|
||||||
|
h = $(@cropwin).height()
|
||||||
|
$(@cropwin).hide()
|
||||||
|
$(@cropwin)
|
||||||
|
.css "width", "0px"
|
||||||
|
.css "height", "0px"
|
||||||
|
return unless b
|
||||||
|
ctx = @scene.getContext('2d')
|
||||||
|
data = ctx.getImageData(x,y, w, h)
|
||||||
|
@scene.width = w
|
||||||
|
@scene.height = h
|
||||||
|
ctx.putImageData(data, 0,0)
|
||||||
|
@dirty = true
|
||||||
|
|
||||||
|
@cropdown = (e) =>
|
||||||
|
btncrop.enable = false
|
||||||
|
offset = $(@scheme).offset()
|
||||||
|
$(@cropwin)
|
||||||
|
.css "left", "#{e.clientX - offset.left}px"
|
||||||
|
.css "top", "#{e.clientY - offset.top}px"
|
||||||
|
.show()
|
||||||
|
$(window).off "mousedown", @cropdown
|
||||||
|
$(window).mousemove @cropselect
|
||||||
|
$(window).mouseup @cropup
|
||||||
|
|
||||||
|
btncrop.onbtclick = () =>
|
||||||
|
if btncrop.selected
|
||||||
|
$(window).mousedown @cropdown
|
||||||
|
else
|
||||||
|
$(window).off "mousedown", @cropdown
|
||||||
|
|
||||||
|
@bindKey "CTRL-S", () => @actionFile "#{@name}-Save"
|
||||||
|
@bindKey "ALT-W", () => @actionFile "#{@name}-Saveas"
|
||||||
|
|
||||||
|
capture: (el, windoff) ->
|
||||||
|
@hide() if windoff
|
||||||
|
html2canvas(el).then (canvas) =>
|
||||||
|
@scene.height = canvas.height
|
||||||
|
@scene.width = canvas.width
|
||||||
|
@scene.getContext('2d').drawImage(canvas, 0, 0)
|
||||||
|
@notify __("Screen captured")
|
||||||
|
@show() if windoff
|
||||||
|
@dirty = true
|
||||||
|
.catch (e) => @error e.toString(), e
|
||||||
|
|
||||||
|
menu: () ->
|
||||||
|
menu = [{
|
||||||
|
text: "__(File)",
|
||||||
|
nodes: [
|
||||||
|
{ text: "__(Save)", dataid: "#{@name}-Save", shortcut: "C-S" },
|
||||||
|
{ text: "__(Save as)", dataid: "#{@name}-Saveas", shortcut: "A-W" }
|
||||||
|
],
|
||||||
|
onchildselect: (e) => @actionFile e.data.item.data.dataid
|
||||||
|
}]
|
||||||
|
menu
|
||||||
|
|
||||||
|
save: ()->
|
||||||
|
@currfile.cache = @scene.toDataURL("image/png")
|
||||||
|
@currfile.write "base64"
|
||||||
|
.then (r) =>
|
||||||
|
@notify __("File saved")
|
||||||
|
@dirty = false
|
||||||
|
.catch (e) => @error __("Cannot save to file: {0}", e.toString()), e
|
||||||
|
|
||||||
|
actionFile: (e) ->
|
||||||
|
saveas = () =>
|
||||||
|
@openDialog("FileDialog", {
|
||||||
|
title: __("Save as"),
|
||||||
|
file: @currfile
|
||||||
|
})
|
||||||
|
.then (f) =>
|
||||||
|
d = f.file.path.asFileHandle()
|
||||||
|
d = d.parent() if f.file.type is "file"
|
||||||
|
@currfile.setPath "#{d.path}/#{f.name}"
|
||||||
|
@save @currfile
|
||||||
|
|
||||||
|
switch e
|
||||||
|
when "#{@name}-Save"
|
||||||
|
return @save() if @currfile.basename
|
||||||
|
saveas()
|
||||||
|
|
||||||
|
when "#{@name}-Saveas"
|
||||||
|
saveas()
|
||||||
|
|
||||||
|
cleanup: (evt) ->
|
||||||
|
return unless @dirty
|
||||||
|
evt.preventDefault()
|
||||||
|
@ask {
|
||||||
|
title: __("Quit"),
|
||||||
|
text: __("Quit without saving ?")
|
||||||
|
}
|
||||||
|
.then (d) =>
|
||||||
|
if d
|
||||||
|
@dirty = false
|
||||||
|
@quit()
|
||||||
|
|
||||||
|
|
||||||
|
this.OS.register "Clipper", Clipper
|
20
Clipper/css/main.css
Normal file
20
Clipper/css/main.css
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
afx-app-window[data-id = "Clipper"] div[data-id = "wrapper"] {
|
||||||
|
overflow: auto;
|
||||||
|
background-image: url("bg.jpg");
|
||||||
|
background-repeat: repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] div[data-id = "toolbar"] {
|
||||||
|
padding-left: 5px;
|
||||||
|
display:inline-block;
|
||||||
|
text-align:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] afx-button[data-id = "btnCrop"] button.selected {
|
||||||
|
background-color: #116cd6;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
afx-app-window[data-id = "Clipper"] div[data-id = "cropwin"] {
|
||||||
|
border:1px dashed chocolate;
|
||||||
|
}
|
7044
Clipper/javascripts/html2canvas.js
Normal file
7044
Clipper/javascripts/html2canvas.js
Normal file
File diff suppressed because one or more lines are too long
14
Clipper/package.json
Normal file
14
Clipper/package.json
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"app":"Clipper",
|
||||||
|
"name":"Clipper",
|
||||||
|
"description":"Clipper",
|
||||||
|
"info":{
|
||||||
|
"author": "",
|
||||||
|
"email": ""
|
||||||
|
},
|
||||||
|
"version":"0.1.0-a",
|
||||||
|
"category":"Other",
|
||||||
|
"iconclass":"fa fa-scissors",
|
||||||
|
"mimes":["none"],
|
||||||
|
"locale": {}
|
||||||
|
}
|
8
Clipper/project.json
Normal file
8
Clipper/project.json
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"name": "Clipper",
|
||||||
|
"root": "home://workspace/antosdk-apps/Clipper",
|
||||||
|
"css": ["css/main.css"],
|
||||||
|
"javascripts": ["javascripts/html2canvas.js"],
|
||||||
|
"coffees": ["coffees/main.coffee"],
|
||||||
|
"copies": ["assets/scheme.html", "assets/bg.jpg", "package.json", "README.md"]
|
||||||
|
}
|
@ -44,6 +44,15 @@
|
|||||||
"version": "0.1.0-a",
|
"version": "0.1.0-a",
|
||||||
"download": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/Booklet/build/release/Booklet.zip"
|
"download": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/Booklet/build/release/Booklet.zip"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"pkgname": "Clipper",
|
||||||
|
"name": "Clipper",
|
||||||
|
"description": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/Clipper/README.md",
|
||||||
|
"category": "Other",
|
||||||
|
"author": "",
|
||||||
|
"version": "0.1.0-a",
|
||||||
|
"download": "https://raw.githubusercontent.com/lxsang/antosdk-apps/master/Clipper/build/release/Clipper.zip"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"pkgname": "DBDecoder",
|
"pkgname": "DBDecoder",
|
||||||
"name": "DBDecoder",
|
"name": "DBDecoder",
|
||||||
|
Loading…
Reference in New Issue
Block a user