PicShare/index.html at develop · stormageddon/PicShare · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="index.css"></link>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"></link>
  </head>
  <body style="background: #F5F5F5;">
    <section class="header">
      <div id="brand">
        <h1 class="title">PicShare</h1>
      </div>
      <div id="actions">
	<i class="fa fa-cog" onclick="openSettings()"></i>

      </div>
    <span style="height: 100%">
    <div style="height: 35px; width: 100%; background: #F5F5F5; margin-top: 365px; margin-left: -8px;">
      <div id="footer-brand">
	<p id="version"> v0.0.0 </p>
      </div>
    </div>

    </section>


    <div class="content" style="padding-bottom: 20px;">
      <ul class="photo-list" id="photoList">
      </ul>
    </div>


    <script type="text/javascript" src="moment.js"></script>
    <script>
      document.addEventListener('drop', function(e) {
        e.preventDefault();
        e.stopPropagation();
      });
      document.addEventListener('dragover', function(e) {
        e.preventDefault();
        e.stopPropagation();
      });

      var ipc = require('electron').ipcRenderer;
      var exit = function() {
        ipc.send('exit', true);
      }

      var copy = function(url) {
        ipc.send('copy', url);
      }

      var openSettings = function() {
        ipc.send('openSettings');
      }

      ipc.on('authedUser', function(event, data) {
        delete data.user.password // Don't store password
        potentialUser = localStorage.getItem('user');
        if(!potentialUser) {
          localStorage.setItem('user', JSON.stringify(data));
        }
      }).on('pictures', function(event, message) {
        autoLaunchMenuItem.checked = message.autolaunch
        var photoHTML = "";
        if (message.images.length === 0) {
          document.getElementById("photoList").innerHTML = "<p id='no-images-text'>\u2318+shift+5 to take your first screen shot!</p>";
        }
        else {
          for(var i = 0; i < message.images.length; i++) {
            var link = message.root + "/v1/app/" + message.appid + "/user/binary/" + message.images[i].filename + "?apikey=" + message.apikey + "&shared=true";
            photoHTML += "<li class='table-row'>";
            photoHTML += "<div class='img-container'>";
            photoHTML += "<img class='thumbnail' src='" + link + "' />";
	    photoHTML += "</div>";
            photoHTML += "<span class='filename'>";
            photoHTML += message.images[i].filename;
	    photoHTML += "</span>"
	    photoHTML += "<i class='fa fa-ellipsis-v fa-2x file-menu-button' onclick=showFileMenu('" + JSON.stringify(message.images[i]) + "')></i><br>";
            photoHTML += "<p class='date-added'>added ";
            photoHTML += moment(message.images[i]['__created__']).from(moment());
            photoHTML += "</p>";
            photoHTML += "</li>";
          }
	  document.getElementById("photoList").innerHTML = photoHTML;
	}
        document.getElementById("version").innerHTML = "v" + message.version;
      });

      remote = require('electron').remote;
      Menu = remote.Menu;
      MenuItem = remote.MenuItem;


      var showFileMenu = function(file) {
        fileMenu = new Menu();
        fileMenu.append(new MenuItem({ label: 'Copy Link', click: function() { ipc.send('copyFile', file); } }));
        //fileMenu.append(new MenuItem({ label: 'Download', click: function() { ipc.send('downloadFile', file); } }));
        fileMenu.append(new MenuItem({ label: 'Delete', click: function() { ipc.send('deleteFile', file); } }));
        fileMenu.popup();
      }


      var checkboxClicked = function() {
        ipc.send('toggleCheck', autoLaunchMenuItem.checked);
      }


      var menu = new Menu();
      //menu.append(new MenuItem({ label: 'Dev tools', click: function() { ipc.send('openDevTools'); } }));
      menu.append(new MenuItem({ label: 'Log Out', click: function() { localStorage.clear(); ipc.send('logout'); } }));

      autoLaunchMenuItem = new MenuItem({ label: 'Launch on login', type: 'checkbox', checked: true, click: checkboxClicked });

      menu.append(autoLaunchMenuItem);

      menu.append(new MenuItem({ type: 'separator' }));
      menu.append(new MenuItem({ label: 'Quit', click: function() { ipc.send('quit'); } }));

      ipc.on('contextMenu', function(event) {
        menu.popup();
      });

      ipc.on('notify', function(event, notification) {
        Notification.requestPermission();
        Notification(notification.title, { body: notification.body, icon: notification.icon });
      });
    </script>
  </body>
</html>