19

我正在使用 node-webkit 创建一个应用程序，所以有很多 javascript。我编写了一个 node.js 函数，它将截屏并将其保存到磁盘，但是，它将它保存到项目根目录，我想提示用户选择保存位置，但我找不到创建保存文件对话框的方法。当前代码：

screen_shot.js：

var fs = require('fs');
exports.buildFile = function(name, value) {
    var img = new Buffer(value, encoding='base64');
    fs.writeFile(name, img, function(err) {
        if(err) {
            console.log(err);
        } else {
            console.log("The file was saved!");
        }
    });
};

索引.html：

...
    <script>
        var sc= require('screen_shot');

        function wait() {
            $('#close-popup').click();
            setTimeout(function() {screen_shot()}, 10);
        }

        function screen_shot() {
            html2canvas($('body'), {
              onrendered: function(canvas) {
                  var img = canvas.toDataURL("image/png").split(',')[1];
                  var decodedImg = window.atob(img);
                  sc.buildFile("sc.png", img);
              }
            });
        }
    </script>
...

<a href="#" onclick="wait();" data-role="button" data-theme="j">Screen shot</a>

等待功能只是为了在截屏之前给我正在使用的弹出窗口关闭时间。

我一直在阅读node-webkit 文件对话框文档，但它不是我想要的，或者我无法使其正常工作。

4

1 回答 1

1

Wiki 中的文件对话框页面提到了保存对话框文件输入

nwsaveas 将打开一个另存为对话框，让用户输入文件的路径，并且可以选择与默认文件输入标签不同的不存在文件：

您可以在自定义对话框中使用它，例如模态框左右来向用户查询该输入。

基于您提供的代码的非常基本的示例：

<script>
  var fs = require('fs');

  var buildFile = function(name, value) {
    var img = new Buffer(value, 'base64');
    fs.writeFile(name, img, function(err) {
      if(err) {
        console.log(err);
      } else {
        console.log("The file was saved!");
      }
    });
  }

  function wait() {
    $('#close-popup').click();
    setTimeout(function() {screen_shot()}, 10);
  }

  function screen_shot() {
    html2canvas($('body'), {
      onrendered: function(canvas) {
        var img = canvas.toDataURL("image/png").split(',')[1];
        var decodedImg = window.atob(img);
        query_for_save_path(function (save_path) {
          buildFile(save_path, img);
          alert('Screenshot saved to: ' + save_path);
        });
      }
    });
  }

  function query_for_save_path(cb) {
    $('#dialog').show();
    $('#dialog input').one('change', function (event) {
      cb($(this).val());
    });
  }
</script>

<a href="#" onclick="wait();" data-role="button" data-theme="j">Screen shot</a>

<div id="dialog" style="display:none;">
    Choose a path to save your shot:
    <input type="file" nwsaveas />
</div>
于 2013-08-02T23:21:23.553 回答