Browse Source

initial color function

Taco 1 year ago
parent
commit
5b11b5e802
4 changed files with 22708 additions and 2 deletions
  1. 37 0
      diff.xml
  2. 838 0
      entitlements.html
  3. 188 2
      entitlements.org
  4. 21645 0
      processing.js

+ 37 - 0
diff.xml

@@ -0,0 +1,37 @@
1
+<?xml version="1.0"?>
2
+<result>
3
+  <request>
4
+    <application>decodeapp:facebook</application>
5
+    <required>
6
+      <property>decode:name</property>
7
+      <property>decode:email</property>
8
+      <property>decode:address</property>
9
+    </required>
10
+    <optional>
11
+      <property>decode:phone</property>
12
+    </optional>
13
+  </request>
14
+  <diffs>
15
+    <diff>
16
+      <contextName>personal</contextName>
17
+      <intersect>
18
+        <property>decode:name</property>
19
+        <property>decode:email</property>
20
+        <property>decode:address</property>
21
+        <property>decode:phone</property>
22
+      </intersect>
23
+      <except/>
24
+    </diff>
25
+    <diff>
26
+      <contextName>professional</contextName>
27
+      <intersect>
28
+        <property>decode:name</property>
29
+        <property>decode:email</property>
30
+        <property>decode:address</property>
31
+      </intersect>
32
+      <except>
33
+        <property>decode:phone</property>
34
+      </except>
35
+    </diff>
36
+  </diffs>
37
+</result>

+ 838 - 0
entitlements.html

@@ -0,0 +1,838 @@
1
+<?xml version="1.0" encoding="utf-8"?>
2
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
3
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
4
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
5
+<head>
6
+<!-- 2018-03-30 Fri 10:51 -->
7
+<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
8
+<meta name="viewport" content="width=device-width, initial-scale=1" />
9
+<title>&lrm;</title>
10
+<meta name="generator" content="Org mode" />
11
+<meta name="author" content="Taco" />
12
+<style type="text/css">
13
+ <!--/*--><![CDATA[/*><!--*/
14
+  .title  { text-align: center;
15
+             margin-bottom: .2em; }
16
+  .subtitle { text-align: center;
17
+              font-size: medium;
18
+              font-weight: bold;
19
+              margin-top:0; }
20
+  .todo   { font-family: monospace; color: red; }
21
+  .done   { font-family: monospace; color: green; }
22
+  .priority { font-family: monospace; color: orange; }
23
+  .tag    { background-color: #eee; font-family: monospace;
24
+            padding: 2px; font-size: 80%; font-weight: normal; }
25
+  .timestamp { color: #bebebe; }
26
+  .timestamp-kwd { color: #5f9ea0; }
27
+  .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
28
+  .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
29
+  .org-center { margin-left: auto; margin-right: auto; text-align: center; }
30
+  .underline { text-decoration: underline; }
31
+  #postamble p, #preamble p { font-size: 90%; margin: .2em; }
32
+  p.verse { margin-left: 3%; }
33
+  pre {
34
+    border: 1px solid #ccc;
35
+    box-shadow: 3px 3px 3px #eee;
36
+    padding: 8pt;
37
+    font-family: monospace;
38
+    overflow: auto;
39
+    margin: 1.2em;
40
+  }
41
+  pre.src {
42
+    position: relative;
43
+    overflow: visible;
44
+    padding-top: 1.2em;
45
+  }
46
+  pre.src:before {
47
+    display: none;
48
+    position: absolute;
49
+    background-color: white;
50
+    top: -10px;
51
+    right: 10px;
52
+    padding: 3px;
53
+    border: 1px solid black;
54
+  }
55
+  pre.src:hover:before { display: inline;}
56
+  /* Languages per Org manual */
57
+  pre.src-asymptote:before { content: 'Asymptote'; }
58
+  pre.src-awk:before { content: 'Awk'; }
59
+  pre.src-C:before { content: 'C'; }
60
+  /* pre.src-C++ doesn't work in CSS */
61
+  pre.src-clojure:before { content: 'Clojure'; }
62
+  pre.src-css:before { content: 'CSS'; }
63
+  pre.src-D:before { content: 'D'; }
64
+  pre.src-ditaa:before { content: 'ditaa'; }
65
+  pre.src-dot:before { content: 'Graphviz'; }
66
+  pre.src-calc:before { content: 'Emacs Calc'; }
67
+  pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
68
+  pre.src-fortran:before { content: 'Fortran'; }
69
+  pre.src-gnuplot:before { content: 'gnuplot'; }
70
+  pre.src-haskell:before { content: 'Haskell'; }
71
+  pre.src-hledger:before { content: 'hledger'; }
72
+  pre.src-java:before { content: 'Java'; }
73
+  pre.src-js:before { content: 'Javascript'; }
74
+  pre.src-latex:before { content: 'LaTeX'; }
75
+  pre.src-ledger:before { content: 'Ledger'; }
76
+  pre.src-lisp:before { content: 'Lisp'; }
77
+  pre.src-lilypond:before { content: 'Lilypond'; }
78
+  pre.src-lua:before { content: 'Lua'; }
79
+  pre.src-matlab:before { content: 'MATLAB'; }
80
+  pre.src-mscgen:before { content: 'Mscgen'; }
81
+  pre.src-ocaml:before { content: 'Objective Caml'; }
82
+  pre.src-octave:before { content: 'Octave'; }
83
+  pre.src-org:before { content: 'Org mode'; }
84
+  pre.src-oz:before { content: 'OZ'; }
85
+  pre.src-plantuml:before { content: 'Plantuml'; }
86
+  pre.src-processing:before { content: 'Processing.js'; }
87
+  pre.src-python:before { content: 'Python'; }
88
+  pre.src-R:before { content: 'R'; }
89
+  pre.src-ruby:before { content: 'Ruby'; }
90
+  pre.src-sass:before { content: 'Sass'; }
91
+  pre.src-scheme:before { content: 'Scheme'; }
92
+  pre.src-screen:before { content: 'Gnu Screen'; }
93
+  pre.src-sed:before { content: 'Sed'; }
94
+  pre.src-sh:before { content: 'shell'; }
95
+  pre.src-sql:before { content: 'SQL'; }
96
+  pre.src-sqlite:before { content: 'SQLite'; }
97
+  /* additional languages in org.el's org-babel-load-languages alist */
98
+  pre.src-forth:before { content: 'Forth'; }
99
+  pre.src-io:before { content: 'IO'; }
100
+  pre.src-J:before { content: 'J'; }
101
+  pre.src-makefile:before { content: 'Makefile'; }
102
+  pre.src-maxima:before { content: 'Maxima'; }
103
+  pre.src-perl:before { content: 'Perl'; }
104
+  pre.src-picolisp:before { content: 'Pico Lisp'; }
105
+  pre.src-scala:before { content: 'Scala'; }
106
+  pre.src-shell:before { content: 'Shell Script'; }
107
+  pre.src-ebnf2ps:before { content: 'ebfn2ps'; }
108
+  /* additional language identifiers per "defun org-babel-execute"
109
+       in ob-*.el */
110
+  pre.src-cpp:before  { content: 'C++'; }
111
+  pre.src-abc:before  { content: 'ABC'; }
112
+  pre.src-coq:before  { content: 'Coq'; }
113
+  pre.src-groovy:before  { content: 'Groovy'; }
114
+  /* additional language identifiers from org-babel-shell-names in
115
+     ob-shell.el: ob-shell is the only babel language using a lambda to put
116
+     the execution function name together. */
117
+  pre.src-bash:before  { content: 'bash'; }
118
+  pre.src-csh:before  { content: 'csh'; }
119
+  pre.src-ash:before  { content: 'ash'; }
120
+  pre.src-dash:before  { content: 'dash'; }
121
+  pre.src-ksh:before  { content: 'ksh'; }
122
+  pre.src-mksh:before  { content: 'mksh'; }
123
+  pre.src-posh:before  { content: 'posh'; }
124
+  /* Additional Emacs modes also supported by the LaTeX listings package */
125
+  pre.src-ada:before { content: 'Ada'; }
126
+  pre.src-asm:before { content: 'Assembler'; }
127
+  pre.src-caml:before { content: 'Caml'; }
128
+  pre.src-delphi:before { content: 'Delphi'; }
129
+  pre.src-html:before { content: 'HTML'; }
130
+  pre.src-idl:before { content: 'IDL'; }
131
+  pre.src-mercury:before { content: 'Mercury'; }
132
+  pre.src-metapost:before { content: 'MetaPost'; }
133
+  pre.src-modula-2:before { content: 'Modula-2'; }
134
+  pre.src-pascal:before { content: 'Pascal'; }
135
+  pre.src-ps:before { content: 'PostScript'; }
136
+  pre.src-prolog:before { content: 'Prolog'; }
137
+  pre.src-simula:before { content: 'Simula'; }
138
+  pre.src-tcl:before { content: 'tcl'; }
139
+  pre.src-tex:before { content: 'TeX'; }
140
+  pre.src-plain-tex:before { content: 'Plain TeX'; }
141
+  pre.src-verilog:before { content: 'Verilog'; }
142
+  pre.src-vhdl:before { content: 'VHDL'; }
143
+  pre.src-xml:before { content: 'XML'; }
144
+  pre.src-nxml:before { content: 'XML'; }
145
+  /* add a generic configuration mode; LaTeX export needs an additional
146
+     (add-to-list 'org-latex-listings-langs '(conf " ")) in .emacs */
147
+  pre.src-conf:before { content: 'Configuration File'; }
148
+
149
+  table { border-collapse:collapse; }
150
+  caption.t-above { caption-side: top; }
151
+  caption.t-bottom { caption-side: bottom; }
152
+  td, th { vertical-align:top;  }
153
+  th.org-right  { text-align: center;  }
154
+  th.org-left   { text-align: center;   }
155
+  th.org-center { text-align: center; }
156
+  td.org-right  { text-align: right;  }
157
+  td.org-left   { text-align: left;   }
158
+  td.org-center { text-align: center; }
159
+  dt { font-weight: bold; }
160
+  .footpara { display: inline; }
161
+  .footdef  { margin-bottom: 1em; }
162
+  .figure { padding: 1em; }
163
+  .figure p { text-align: center; }
164
+  .inlinetask {
165
+    padding: 10px;
166
+    border: 2px solid gray;
167
+    margin: 10px;
168
+    background: #ffffcc;
169
+  }
170
+  #org-div-home-and-up
171
+   { text-align: right; font-size: 70%; white-space: nowrap; }
172
+  textarea { overflow-x: auto; }
173
+  .linenr { font-size: smaller }
174
+  .code-highlighted { background-color: #ffff00; }
175
+  .org-info-js_info-navigation { border-style: none; }
176
+  #org-info-js_console-label
177
+    { font-size: 10px; font-weight: bold; white-space: nowrap; }
178
+  .org-info-js_search-highlight
179
+    { background-color: #ffff00; color: #000000; font-weight: bold; }
180
+  .org-svg { width: 90%; }
181
+  /*]]>*/-->
182
+</style>
183
+<script type="text/javascript">
184
+/*
185
+@licstart  The following is the entire license notice for the
186
+JavaScript code in this tag.
187
+
188
+Copyright (C) 2012-2018 Free Software Foundation, Inc.
189
+
190
+The JavaScript code in this tag is free software: you can
191
+redistribute it and/or modify it under the terms of the GNU
192
+General Public License (GNU GPL) as published by the Free Software
193
+Foundation, either version 3 of the License, or (at your option)
194
+any later version.  The code is distributed WITHOUT ANY WARRANTY;
195
+without even the implied warranty of MERCHANTABILITY or FITNESS
196
+FOR A PARTICULAR PURPOSE.  See the GNU GPL for more details.
197
+
198
+As additional permission under GNU GPL version 3 section 7, you
199
+may distribute non-source (e.g., minimized or compacted) forms of
200
+that code without the copy of the GNU GPL normally required by
201
+section 4, provided you include this license notice and a URL
202
+through which recipients can access the Corresponding Source.
203
+
204
+
205
+@licend  The above is the entire license notice
206
+for the JavaScript code in this tag.
207
+*/
208
+<!--/*--><![CDATA[/*><!--*/
209
+ function CodeHighlightOn(elem, id)
210
+ {
211
+   var target = document.getElementById(id);
212
+   if(null != target) {
213
+     elem.cacheClassElem = elem.className;
214
+     elem.cacheClassTarget = target.className;
215
+     target.className = "code-highlighted";
216
+     elem.className   = "code-highlighted";
217
+   }
218
+ }
219
+ function CodeHighlightOff(elem, id)
220
+ {
221
+   var target = document.getElementById(id);
222
+   if(elem.cacheClassElem)
223
+     elem.className = elem.cacheClassElem;
224
+   if(elem.cacheClassTarget)
225
+     target.className = elem.cacheClassTarget;
226
+ }
227
+/*]]>*///-->
228
+</script>
229
+</head>
230
+<body>
231
+<div id="content">
232
+<div id="table-of-contents">
233
+<h2>Table of Contents</h2>
234
+<div id="text-table-of-contents">
235
+<ul>
236
+<li><a href="#orgc3cfd80">1. Introduction</a></li>
237
+<li><a href="#orgc5415b0">2. Data Model</a>
238
+<ul>
239
+<li><a href="#orgd1b3a20">2.1. Example wallet profile</a>
240
+<ul>
241
+<li><a href="#org8f3c06c">2.1.1. Things to further investigate</a></li>
242
+</ul>
243
+</li>
244
+<li><a href="#org5248b99">2.2. Example request</a>
245
+<ul>
246
+<li><a href="#org149ff3d">2.2.1. Things to further investigate</a></li>
247
+</ul>
248
+</li>
249
+</ul>
250
+</li>
251
+<li><a href="#org621de56">3. Data Comparison</a>
252
+<ul>
253
+<li>
254
+<ul>
255
+<li><a href="#orgbe4f8a9">3.0.1. Things to further investigate</a></li>
256
+</ul>
257
+</li>
258
+</ul>
259
+</li>
260
+<li><a href="#org257bb1e">4. Visualization</a>
261
+<ul>
262
+<li><a href="#org68ac265">4.1. Request</a></li>
263
+<li><a href="#org6c34147">4.2. Contexts</a>
264
+<ul>
265
+<li><a href="#org29dda27">4.2.1. Things to further investigate</a></li>
266
+</ul>
267
+</li>
268
+</ul>
269
+</li>
270
+<li><a href="#org4624557">5. Interaction</a>
271
+<ul>
272
+<li>
273
+<ul>
274
+<li><a href="#orgce786c6">5.0.1. Things to further investigate</a></li>
275
+</ul>
276
+</li>
277
+</ul>
278
+</li>
279
+</ul>
280
+</div>
281
+</div>
282
+<div id="outline-container-orgc3cfd80" class="outline-2">
283
+<h2 id="orgc3cfd80"><span class="section-number-2">1</span> Introduction</h2>
284
+<div class="outline-text-2" id="text-1">
285
+<p>
286
+The purpose of this document is to investigate possible User Interaction designs for Decode task 4.4.
287
+More specifically the focus is on investigating how the user of a decode wallet grants permission to decode application for a specific set of personal data.
288
+</p>
289
+</div>
290
+</div>
291
+
292
+<div id="outline-container-orgc5415b0" class="outline-2">
293
+<h2 id="orgc5415b0"><span class="section-number-2">2</span> Data Model</h2>
294
+<div class="outline-text-2" id="text-2">
295
+</div>
296
+<div id="outline-container-orgd1b3a20" class="outline-3">
297
+<h3 id="orgd1b3a20"><span class="section-number-3">2.1</span> Example wallet profile</h3>
298
+<div class="outline-text-3" id="text-2-1">
299
+<p>
300
+This sample wallet profile datastructure consists of multiple contexts.
301
+No assumptions are made about ontology for now so mention of existing e.g. skos/foaf, 
302
+everything is in the decode namespace which is well known across applications.
303
+</p>
304
+
305
+<p>
306
+Each context has a name and groups on or more properties that consist of a well known type and a value.
307
+A type can be part of more than one context. 
308
+</p>
309
+<div class="org-src-container">
310
+<pre class="src src-js" id="org50f08cd"><span style="color: #4f97d7; font-weight: bold;">var</span> <span style="color: #7590db;">profile</span> = <span style="color: #4f97d7;">{</span>
311
+    contexts : 
312
+    <span style="color: #bc6ec5;">[</span>
313
+        <span style="color: #2d9574;">{</span>
314
+           title : <span style="color: #2d9574;">"personal"</span>,
315
+            properties : 
316
+            <span style="color: #67b11d;">[</span>
317
+                <span style="color: #b1951d;">{</span>
318
+                    type : <span style="color: #2d9574;">"decode:name"</span>,
319
+                    value: <span style="color: #2d9574;">"Taco van Dijk"</span>
320
+                <span style="color: #b1951d;">}</span>,
321
+                <span style="color: #b1951d;">{</span>
322
+                    type : <span style="color: #2d9574;">"decode:email"</span>,
323
+                    value : <span style="color: #2d9574;">"[REDACTED]"</span>
324
+                <span style="color: #b1951d;">}</span>,
325
+                <span style="color: #b1951d;">{</span>
326
+                    type: <span style="color: #2d9574;">"decode:address"</span>,
327
+                    value: <span style="color: #2d9574;">"[REDACTED]"</span>
328
+                <span style="color: #b1951d;">}</span>,
329
+                <span style="color: #b1951d;">{</span>
330
+                    type: <span style="color: #2d9574;">"decode:phone"</span>,
331
+                    value : <span style="color: #2d9574;">"[REDACTED]"</span>
332
+                <span style="color: #b1951d;">}</span>
333
+            <span style="color: #67b11d;">]</span>
334
+        <span style="color: #2d9574;">}</span>,
335
+        <span style="color: #2d9574;">{</span>
336
+            title: <span style="color: #2d9574;">"professional"</span>,
337
+            properties : 
338
+            <span style="color: #67b11d;">[</span>
339
+                <span style="color: #b1951d;">{</span>
340
+                    type : <span style="color: #2d9574;">"decode:name"</span>,
341
+                    value : <span style="color: #2d9574;">"Taco van Dijk"</span>
342
+                <span style="color: #b1951d;">}</span>,
343
+                <span style="color: #b1951d;">{</span>
344
+                    type : <span style="color: #2d9574;">"decode:email"</span>,
345
+                    value : <span style="color: #2d9574;">"taco@waag.org"</span>
346
+                <span style="color: #b1951d;">}</span>,
347
+                <span style="color: #b1951d;">{</span>
348
+                    type : <span style="color: #2d9574;">"decode:address"</span>,
349
+                    value : <span style="color: #2d9574;">"St. Antoniesbreestraat 69"</span> 
350
+                <span style="color: #b1951d;">}</span>
351
+            <span style="color: #67b11d;">]</span>
352
+        <span style="color: #2d9574;">}</span>
353
+    <span style="color: #bc6ec5;">]</span>
354
+<span style="color: #4f97d7;">}</span>;
355
+process.stdout.write<span style="color: #4f97d7;">(</span>JSON.stringify<span style="color: #bc6ec5;">(</span>profile<span style="color: #bc6ec5;">)</span><span style="color: #4f97d7;">)</span>;
356
+</pre>
357
+</div>
358
+</div>
359
+
360
+<div id="outline-container-org8f3c06c" class="outline-4">
361
+<h4 id="org8f3c06c"><span class="section-number-4">2.1.1</span> Things to further investigate</h4>
362
+<div class="outline-text-4" id="text-2-1-1">
363
+<ul class="org-ul">
364
+<li>Make a big list of possible property types (at least properties that are used in Gebied Online)</li>
365
+<li>Make a big list of possible context names</li>
366
+<li>Make a list of context types / privacy levels</li>
367
+<li>Create a generator that seeds profiles with random contexts from the aforementioned lists.</li>
368
+<li>Apply default weights to each property type, for example a high weight for the type ssn, and low for twitter@.</li>
369
+
370
+<li>Privacy level is context type? ("public space", "friends", "private", "public", "confidential")</li>
371
+</ul>
372
+</div>
373
+</div>
374
+</div>
375
+
376
+<div id="outline-container-org5248b99" class="outline-3">
377
+<h3 id="org5248b99"><span class="section-number-3">2.2</span> Example request</h3>
378
+<div class="outline-text-3" id="text-2-2">
379
+<p>
380
+This sample application request consists of an application name, a set of required property types and a set of optional property types.
381
+</p>
382
+
383
+<div class="org-src-container">
384
+<pre class="src src-js" id="org1990662"><span style="color: #4f97d7; font-weight: bold;">var</span> <span style="color: #7590db;">request</span> = <span style="color: #4f97d7;">{</span>
385
+    application : <span style="color: #2d9574;">"decodeapp:facebook"</span>,
386
+    required : <span style="color: #bc6ec5;">[</span><span style="color: #2d9574;">"decode:name"</span>, <span style="color: #2d9574;">"decode:email"</span>, <span style="color: #2d9574;">"decode:address"</span><span style="color: #bc6ec5;">]</span>,
387
+    optional : <span style="color: #bc6ec5;">[</span><span style="color: #2d9574;">"decode:phone"</span><span style="color: #bc6ec5;">]</span>
388
+<span style="color: #4f97d7;">}</span>
389
+<span style="color: #4f97d7; font-weight: bold;">var</span> <span style="color: #7590db;">data</span> = JSON.stringify<span style="color: #4f97d7;">(</span>request<span style="color: #4f97d7;">)</span> + <span style="color: #2d9574;">"\n"</span>;
390
+process.stdout.write<span style="color: #4f97d7;">(</span>data<span style="color: #4f97d7;">)</span>;
391
+</pre>
392
+</div>
393
+</div>
394
+
395
+<div id="outline-container-org149ff3d" class="outline-4">
396
+<h4 id="org149ff3d"><span class="section-number-4">2.2.1</span> Things to further investigate</h4>
397
+<div class="outline-text-4" id="text-2-2-1">
398
+<ul class="org-ul">
399
+<li>Create a generator that seeds a request with random required and optional property types</li>
400
+<li>Add a 'sphere / context type' to each application. So tha</li>
401
+</ul>
402
+</div>
403
+</div>
404
+</div>
405
+</div>
406
+
407
+<div id="outline-container-org621de56" class="outline-2">
408
+<h2 id="org621de56"><span class="section-number-2">3</span> Data Comparison</h2>
409
+<div class="outline-text-2" id="text-3">
410
+<p>
411
+During the interaction we want to give the user insight into a couple of things;
412
+</p>
413
+<ul class="org-ul">
414
+<li>How does the requested set of properties relate to the different contexts? How well does a context match to the request?</li>
415
+<li>What would it mean for the context if the request was accepted? How many / which properties would have to be added to the context in order to fulfill the request?</li>
416
+<li>What would it mean for the cumulative weight of the context?</li>
417
+</ul>
418
+
419
+<p>
420
+In below ruby code a comparison is made by on creating the intersection and its inverse between the request and each context.
421
+</p>
422
+
423
+<div class="org-src-container">
424
+<pre class="src src-ruby" id="org63b56d6"><span style="color: #4f97d7;">require</span> <span style="color: #2d9574;">'json'</span>
425
+<span style="color: #4f97d7;">require</span> <span style="color: #2d9574;">'nokogiri'</span> <span style="color: #2aa1ae; background-color: #292e34;">#</span><span style="color: #2aa1ae; background-color: #292e34;">for creating xml</span>
426
+
427
+request = <span style="color: #ce537a; font-weight: bold;">JSON</span>.parse<span style="color: #4f97d7;">(</span>request_data<span style="color: #4f97d7;">)</span>
428
+profile = <span style="color: #ce537a; font-weight: bold;">JSON</span>.parse<span style="color: #4f97d7;">(</span>profile_data<span style="color: #4f97d7;">)</span>
429
+
430
+context_diffs = <span style="color: #4f97d7;">[]</span>
431
+profile<span style="color: #4f97d7;">[</span><span style="color: #2d9574;">"contexts"</span><span style="color: #4f97d7;">]</span>.each <span style="color: #4f97d7; font-weight: bold;">do</span> | context |
432
+  requested = request<span style="color: #4f97d7;">[</span><span style="color: #2d9574;">"required"</span><span style="color: #4f97d7;">]</span> + request<span style="color: #4f97d7;">[</span><span style="color: #2d9574;">"optional"</span><span style="color: #4f97d7;">]</span>
433
+  available = context<span style="color: #4f97d7;">[</span><span style="color: #2d9574;">"properties"</span><span style="color: #4f97d7;">]</span>.map <span style="color: #4f97d7;">{</span>|p| <span style="color: #4f97d7;">p</span><span style="color: #bc6ec5;">[</span><span style="color: #2d9574;">"type"</span><span style="color: #bc6ec5;">]</span><span style="color: #4f97d7;">}</span>
434
+
435
+  intersect = available &amp; requested
436
+  except = requested - available
437
+  diff = <span style="color: #4f97d7;">{</span><span style="color: #a45bad;">:context</span> =&gt; context<span style="color: #bc6ec5;">[</span><span style="color: #2d9574;">"title"</span><span style="color: #bc6ec5;">]</span>, <span style="color: #a45bad;">:intersect</span> =&gt; intersect, <span style="color: #a45bad;">:except</span> =&gt; except<span style="color: #4f97d7;">}</span>
438
+
439
+  context_diffs &lt;&lt; diff
440
+<span style="color: #4f97d7; font-weight: bold;">end</span>
441
+
442
+<span style="color: #2aa1ae; background-color: #292e34;"># </span><span style="color: #2aa1ae; background-color: #292e34;">unfortunately processing.js doesn't support json yet, so we have to use xml</span>
443
+doc = <span style="color: #ce537a; font-weight: bold;">Nokogiri</span>::<span style="color: #ce537a; font-weight: bold;">XML</span>::<span style="color: #ce537a; font-weight: bold;">Builder</span>.new <span style="color: #4f97d7; font-weight: bold;">do</span> |xml|
444
+xml.result <span style="color: #4f97d7;">{</span>
445
+  xml.request <span style="color: #bc6ec5;">{</span> 
446
+    xml.application request<span style="color: #2d9574;">[</span><span style="color: #2d9574;">"application"</span><span style="color: #2d9574;">]</span> 
447
+    xml.required <span style="color: #2d9574;">{</span>
448
+      request<span style="color: #67b11d;">[</span><span style="color: #2d9574;">"required"</span><span style="color: #67b11d;">]</span>.each <span style="color: #4f97d7; font-weight: bold;">do</span> |p| xml.property <span style="color: #4f97d7;">p</span> <span style="color: #4f97d7; font-weight: bold;">end</span>
449
+    <span style="color: #2d9574;">}</span> 
450
+    xml.optional <span style="color: #2d9574;">{</span>
451
+      request<span style="color: #67b11d;">[</span><span style="color: #2d9574;">"optional"</span><span style="color: #67b11d;">]</span>.each <span style="color: #4f97d7; font-weight: bold;">do</span> |p| xml.property <span style="color: #4f97d7;">p</span> <span style="color: #4f97d7; font-weight: bold;">end</span>
452
+    <span style="color: #2d9574;">}</span>
453
+  <span style="color: #bc6ec5;">}</span>
454
+  xml.diffs <span style="color: #bc6ec5;">{</span>
455
+    context_diffs.each <span style="color: #4f97d7; font-weight: bold;">do</span> |diff|
456
+     xml.diff <span style="color: #2d9574;">{</span>
457
+      xml.contextName diff<span style="color: #67b11d;">[</span><span style="color: #a45bad;">:context</span><span style="color: #67b11d;">]</span>
458
+      xml.intersect <span style="color: #67b11d;">{</span>
459
+        diff<span style="color: #b1951d;">[</span><span style="color: #a45bad;">:intersect</span><span style="color: #b1951d;">]</span>.each <span style="color: #4f97d7; font-weight: bold;">do</span> |p| xml.property <span style="color: #4f97d7;">p</span> <span style="color: #4f97d7; font-weight: bold;">end</span>
460
+      <span style="color: #67b11d;">}</span>
461
+      xml.except <span style="color: #67b11d;">{</span>
462
+        diff<span style="color: #b1951d;">[</span><span style="color: #a45bad;">:except</span><span style="color: #b1951d;">]</span>.each <span style="color: #4f97d7; font-weight: bold;">do</span> |p| xml.property <span style="color: #4f97d7;">p</span> <span style="color: #4f97d7; font-weight: bold;">end</span>
463
+      <span style="color: #67b11d;">}</span>
464
+     <span style="color: #2d9574;">}</span>
465
+    <span style="color: #4f97d7; font-weight: bold;">end</span>
466
+  <span style="color: #bc6ec5;">}</span>
467
+<span style="color: #4f97d7;">}</span>
468
+<span style="color: #4f97d7; font-weight: bold;">end</span>
469
+path = <span style="color: #2d9574;">"diff.xml"</span>
470
+<span style="color: #ce537a; font-weight: bold;">File</span>.write<span style="color: #4f97d7;">(</span>path, doc.to_xml<span style="color: #4f97d7;">)</span> 
471
+path
472
+</pre>
473
+</div>
474
+</div>
475
+
476
+<div id="outline-container-orgbe4f8a9" class="outline-4">
477
+<h4 id="orgbe4f8a9"><span class="section-number-4">3.0.1</span> Things to further investigate</h4>
478
+<div class="outline-text-4" id="text-3-0-1">
479
+<ul class="org-ul">
480
+<li>Calculate the weight of each context before and after giving permission</li>
481
+</ul>
482
+
483
+<p>
484
+NOTE: We export to file diff.xml here for easy parsing in processing.js below.
485
+</p>
486
+
487
+<p>
488
+/de relatieve grootte van de cirkel kan zijn op basis van hoeveel data je erin hebt. 
489
+personal is size 4, professional size 3
490
+request is size 3
491
+</p>
492
+</div>
493
+</div>
494
+</div>
495
+
496
+<div id="outline-container-org257bb1e" class="outline-2">
497
+<h2 id="org257bb1e"><span class="section-number-2">4</span> Visualization</h2>
498
+<div class="outline-text-2" id="text-4">
499
+<p>
500
+We want to visualize the following things;
501
+</p>
502
+<ul class="org-ul">
503
+<li>The request with the application name and it's size / quality (Who's asking what)</li>
504
+<li>The different contexts with it's name and size / quality relative to the request. (What would it mean to accept?)</li>
505
+</ul>
506
+
507
+<p>
508
+Per the design of Dyne, we want to use color to indicate the relation between the request and each context.
509
+</p>
510
+<script src="processing.js"></script>
511
+ <script type="text/processing" data-processing-target="ob-a8ca6153dc3f4dcea5960a1d135a98b56cb78842">
512
+//color definitions
513
+color a3 = #3A3B58;
514
+color b3 = #734246;
515
+color d3 = #B4561F;
516
+color c3 = #336F60;
517
+color f3 = #7A3E2A;
518
+color g3 = #A48137;
519
+color e2 = #97BBCB;
520
+color a4 = #3B4257;
521
+color b4 = #6A4345;
522
+color d4 = #86451F;
523
+color c4 = #345A48;
524
+color f4 = #A92F21;
525
+color g4 = #BC983B;
526
+color a5 = #3D4358;
527
+color b5 = #402623;
528
+color d5 = #85442D;
529
+color c5 = #3B403A;
530
+color f5 = #7A150B;
531
+color g5 = #252F2B;
532
+color a1 = #597099;
533
+color e4 = #0A3878;
534
+color b1 = #D16365;
535
+color d1 = #FFD43B;
536
+color c1 = #B7BF98;
537
+color e1 = #CAD2C8;
538
+color e0 = #F5EDE5;
539
+color f1 = #D17978;
540
+color g1 = #FDD23E;
541
+color a0 = #C5C3CC;
542
+color e3 = #0485B1;
543
+color b0 = #FFDCD6;
544
+color d0 = #FFE9BE;
545
+color c0 = #F0E9D5;
546
+color f0 = #E4C8BF;
547
+color g0 = #FBE6BA;
548
+color a2 = #3D4B79;
549
+color e5 = #084064;
550
+color b2 = #974244;
551
+color d2 = #F8AA08;
552
+color c2 = #4E937F;
553
+color f2 = #8F4330;
554
+color g2 = #FFDB03;
555
+
556
+color colors[][] = {
557
+  {a0,a1,a2,a3,a4,a5},
558
+  {b0,b1,b2,b3,b4,b5},
559
+  {c0,c1,c2,c3,c4,c5},
560
+  {d0,d1,d2,d3,d4,d5},
561
+  {e0,e1,e2,e3,e4,e5},
562
+  {f0,f1,f2,f3,f4,f5},
563
+  {g0,g1,g2,g3,g4,g5}
564
+};
565
+
566
+class PrivacyLevel {
567
+  public static int SECRET = 5; //passwords, keys etc. 
568
+  public static int PRIVATE = 4;//ssn etc, strict need to know basis stuff 
569
+  public static int INTIMATE = 3;//e.g. stuff you share with family 
570
+  public static int AFFILIATE = 2;//e.g. stuff you share with work, project etc 
571
+  public static int PUBLIC = 1;//e.g. stuff that everybody may know, your e.g. twitter handle 
572
+  public static int COMMONS = 0;//stuff that is intended for the public good / commons, anonimized IoT stuff 
573
+}
574
+
575
+class ContextType {
576
+  public static int SELF = 5; //stuff that applies strictly to yourself 
577
+  public static int FAMILY = 4;//stuff that applies to you and your family (hopefully not facebook pics)
578
+  public static int FRIENDS = 3;//stuff you share with friends 
579
+  public static int WORK = 2;//stuff you share in a professional context
580
+  public static int HOBBY = 1;//stuff you share in the context of a pastime
581
+  public static int WORLD = 0;//stuff that is intended for the public good / commons 
582
+}
583
+
584
+public int getColor(int privacy_level, int context_type)
585
+{
586
+  return colors[context_type][privacy_level];
587
+}
588
+
589
+void draw(){
590
+  size(100,100);
591
+  background(0);
592
+  noStroke();
593
+  int level = PrivacyLevel.SECRET;
594
+  int contextType = ContextType.SELF;
595
+  color private_self = getColor(level, contextType);//should be dark red
596
+  fill(private_self);
597
+  ellipse(50,50,50,50);
598
+}
599
+</script> <canvas id="ob-a8ca6153dc3f4dcea5960a1d135a98b56cb78842"></canvas>
600
+</div>
601
+
602
+<div id="outline-container-org68ac265" class="outline-3">
603
+<h3 id="org68ac265"><span class="section-number-3">4.1</span> Request</h3>
604
+<div class="outline-text-3" id="text-4-1">
605
+<script src="processing.js"></script>
606
+ <script type="text/processing" data-processing-target="ob-358673b6aca53ef65765ed4baecf23b8c3889682">
607
+class Request
608
+{
609
+  public String application;
610
+  public String[] required_properties;
611
+  public String[] optional_properties;
612
+
613
+  public Request(String app, String[] req, String[] opt)
614
+  {
615
+    this.application = app;
616
+    this.required_properties = req;
617
+    this.optional_properties = opt;
618
+  }
619
+}
620
+
621
+class Diff
622
+{
623
+  public String context;
624
+  public String[] intersect;
625
+  public String[] except;
626
+
627
+  public Diff(String ctx, String[] intersect, String[] except)
628
+  {
629
+    this.context = ctx;
630
+    this.intersect = intersect;
631
+    this.except = except;
632
+  } 
633
+}
634
+
635
+XMLElement doc = new XMLElement(this, 'diff.xml');
636
+//create typed versions because this is java :-(
637
+void parseRequest(xml)
638
+{
639
+  XMLElement req = xml.getChild(0);
640
+  String name = req.getChild(0).getContent();
641
+  String[] required = new String[req.getChild(1).getChildCount()];
642
+  String[] optional = new String[req.getChild(2).getChildCount()];
643
+  
644
+  for (int i = 0; i < required.length; i++) {
645
+    required[i] = req.getChild(1).getChild(i).getContent();
646
+  }
647
+
648
+  for (int i = 0; i < optional.length; i++) {
649
+    optional[i] = req.getChild(2).getChild(i).getContent();
650
+  }
651
+
652
+  Request r = new Request(name,required,optional);
653
+  return r;
654
+}
655
+
656
+//create typed versions because this is java :-(
657
+void parseDiffs(xml)
658
+{
659
+  XMLElement diffsEl = xml.getChild(1);
660
+  Diff[] diffs = new Diff[diffsEl.getChildCount()];
661
+  for(int i = 0; i < diffs.length; i++)
662
+  {
663
+    String contextName = diffsEl.getChild(i).getChild(0).getContent();
664
+    String[] intersects = new String[diffsEl.getChild(i).getChild(1).getChildCount()];
665
+    String[] except = new String[diffsEl.getChild(i).getChild(2).getChildCount()];
666
+    
667
+    for(int j = 0; j < intersects.length; j++)
668
+    {
669
+      intersects[j] = diffsEl.getChild(i).getChild(1).getChild(j).getContent();
670
+    }
671
+
672
+    for(int j = 0; j < except.length; j++)
673
+    {
674
+      except[j] = diffsEl.getChild(i).getChild(2).getChild(j).getContent();
675
+    }
676
+
677
+    Diff diff = new Diff(contextName,intersects,except);
678
+    diffs[i] = diff;
679
+  }
680
+  return diffs;
681
+}
682
+Request r = parseRequest(doc);
683
+Diff[] d = parseDiffs(doc);
684
+//set up font for labels
685
+//PFont label_font = createFont("Arial",16,true);
686
+//textFont(label_font,12);
687
+
688
+//draw the difference for each context with the request
689
+size(200,200);
690
+background(0);
691
+noFill();
692
+stroke(255);
693
+ellipse(56, 46, 55, 55);
694
+//fill(255);
695
+text(r.application, 10, 10);
696
+</script> <canvas id="ob-358673b6aca53ef65765ed4baecf23b8c3889682"></canvas>
697
+</div>
698
+</div>
699
+
700
+<div id="outline-container-org6c34147" class="outline-3">
701
+<h3 id="org6c34147"><span class="section-number-3">4.2</span> Contexts</h3>
702
+<div class="outline-text-3" id="text-4-2">
703
+<p>
704
+How do we visulize each context? Intend to do this in processing too.
705
+</p>
706
+<script src="processing.js"></script>
707
+ <script type="text/processing" data-processing-target="ob-efa176753d914243c7a44088a4a08201dd1f5913">
708
+class Request
709
+{
710
+  public String application;
711
+  public String[] required_properties;
712
+  public String[] optional_properties;
713
+
714
+  public Request(String app, String[] req, String[] opt)
715
+  {
716
+    this.application = app;
717
+    this.required_properties = req;
718
+    this.optional_properties = opt;
719
+  }
720
+}
721
+
722
+class Diff
723
+{
724
+  public String context;
725
+  public String[] intersect;
726
+  public String[] except;
727
+
728
+  public Diff(String ctx, String[] intersect, String[] except)
729
+  {
730
+    this.context = ctx;
731
+    this.intersect = intersect;
732
+    this.except = except;
733
+  } 
734
+}
735
+
736
+XMLElement doc = new XMLElement(this, 'diff.xml');
737
+//create typed versions because this is java :-(
738
+void parseRequest(xml)
739
+{
740
+  XMLElement req = xml.getChild(0);
741
+  String name = req.getChild(0).getContent();
742
+  String[] required = new String[req.getChild(1).getChildCount()];
743
+  String[] optional = new String[req.getChild(2).getChildCount()];
744
+  
745
+  for (int i = 0; i < required.length; i++) {
746
+    required[i] = req.getChild(1).getChild(i).getContent();
747
+  }
748
+
749
+  for (int i = 0; i < optional.length; i++) {
750
+    optional[i] = req.getChild(2).getChild(i).getContent();
751
+  }
752
+
753
+  Request r = new Request(name,required,optional);
754
+  return r;
755
+}
756
+
757
+//create typed versions because this is java :-(
758
+void parseDiffs(xml)
759
+{
760
+  XMLElement diffsEl = xml.getChild(1);
761
+  Diff[] diffs = new Diff[diffsEl.getChildCount()];
762
+  for(int i = 0; i < diffs.length; i++)
763
+  {
764
+    String contextName = diffsEl.getChild(i).getChild(0).getContent();
765
+    String[] intersects = new String[diffsEl.getChild(i).getChild(1).getChildCount()];
766
+    String[] except = new String[diffsEl.getChild(i).getChild(2).getChildCount()];
767
+    
768
+    for(int j = 0; j < intersects.length; j++)
769
+    {
770
+      intersects[j] = diffsEl.getChild(i).getChild(1).getChild(j).getContent();
771
+    }
772
+
773
+    for(int j = 0; j < except.length; j++)
774
+    {
775
+      except[j] = diffsEl.getChild(i).getChild(2).getChild(j).getContent();
776
+    }
777
+
778
+    Diff diff = new Diff(contextName,intersects,except);
779
+    diffs[i] = diff;
780
+  }
781
+  return diffs;
782
+}
783
+Request r = parseRequest(doc);
784
+Diff[] d = parseDiffs(doc);
785
+//set up font for labels
786
+//PFont label_font = createFont("Arial",16,true);
787
+//textFont(label_font,12);
788
+
789
+//draw the difference for each context with the request
790
+size(200,200);
791
+background(0);
792
+noFill();
793
+stroke(255);
794
+ellipse(56, 46, 55, 55);
795
+//fill(255);
796
+text(d[0].context, 10, 10);
797
+</script> <canvas id="ob-efa176753d914243c7a44088a4a08201dd1f5913"></canvas>
798
+</div>
799
+
800
+<div id="outline-container-org29dda27" class="outline-4">
801
+<h4 id="org29dda27"><span class="section-number-4">4.2.1</span> Things to further investigate</h4>
802
+<div class="outline-text-4" id="text-4-2-1">
803
+<ul class="org-ul">
804
+<li>How do we show relation between request and each context with color?</li>
805
+<li>Can we use distance as well as color to indicate the relation?</li>
806
+<li>Can we use size of the circle to indicate the weight, or use badges?</li>
807
+</ul>
808
+</div>
809
+</div>
810
+</div>
811
+</div>
812
+
813
+<div id="outline-container-org4624557" class="outline-2">
814
+<h2 id="org4624557"><span class="section-number-2">5</span> Interaction</h2>
815
+<div class="outline-text-2" id="text-5">
816
+<p>
817
+We intend to investigate this in Processing as well.
818
+</p>
819
+</div>
820
+
821
+<div id="outline-container-orgce786c6" class="outline-4">
822
+<h4 id="orgce786c6"><span class="section-number-4">5.0.1</span> Things to further investigate</h4>
823
+<div class="outline-text-4" id="text-5-0-1">
824
+<ul class="org-ul">
825
+<li>How does the end user actually accept the request? Is it by dragging the request onto the context?</li>
826
+<li>How does the end user decline the request?</li>
827
+</ul>
828
+</div>
829
+</div>
830
+</div>
831
+</div>
832
+<div id="postamble" class="status">
833
+<p class="author">Author: Taco</p>
834
+<p class="date">Created: 2018-03-30 Fri 10:51</p>
835
+<p class="validation"><a href="http://validator.w3.org/check?uri=referer">Validate</a></p>
836
+</div>
837
+</body>
838
+</html>

+ 188 - 2
entitlements.org

@@ -67,9 +67,12 @@ A type can be part of more than one context.
67 67
 *** Things to further investigate
68 68
     - Make a big list of possible property types (at least properties that are used in Gebied Online)
69 69
     - Make a big list of possible context names
70
+    - Make a list of context types / privacy levels
70 71
     - Create a generator that seeds profiles with random contexts from the aforementioned lists.
71 72
     - Apply default weights to each property type, for example a high weight for the type ssn, and low for twitter@.
72
- 
73
+
74
+    - Privacy level is context type? ("public space", "friends", "private", "public", "confidential")
75
+
73 76
 ** Example request 
74 77
 
75 78
 This sample application request consists of an application name, a set of required property types and a set of optional property types.
@@ -176,7 +179,190 @@ We want to visualize the following things;
176 179
 - The different contexts with it's name and size / quality relative to the request. (What would it mean to accept?)
177 180
 
178 181
 Per the design of Dyne, we want to use color to indicate the relation between the request and each context.
179
-- 
182
+#+name: colors
183
+#+BEGIN_SRC processing
184
+//color definitions
185
+color a3 = #3A3B58;
186
+color b3 = #734246;
187
+color d3 = #B4561F;
188
+color c3 = #336F60;
189
+color f3 = #7A3E2A;
190
+color g3 = #A48137;
191
+color e2 = #97BBCB;
192
+color a4 = #3B4257;
193
+color b4 = #6A4345;
194
+color d4 = #86451F;
195
+color c4 = #345A48;
196
+color f4 = #A92F21;
197
+color g4 = #BC983B;
198
+color a5 = #3D4358;
199
+color b5 = #402623;
200
+color d5 = #85442D;
201
+color c5 = #3B403A;
202
+color f5 = #7A150B;
203
+color g5 = #252F2B;
204
+color a1 = #597099;
205
+color e4 = #0A3878;
206
+color b1 = #D16365;
207
+color d1 = #FFD43B;
208
+color c1 = #B7BF98;
209
+color e1 = #CAD2C8;
210
+color e0 = #F5EDE5;
211
+color f1 = #D17978;
212
+color g1 = #FDD23E;
213
+color a0 = #C5C3CC;
214
+color e3 = #0485B1;
215
+color b0 = #FFDCD6;
216
+color d0 = #FFE9BE;
217
+color c0 = #F0E9D5;
218
+color f0 = #E4C8BF;
219
+color g0 = #FBE6BA;
220
+color a2 = #3D4B79;
221
+color e5 = #084064;
222
+color b2 = #974244;
223
+color d2 = #F8AA08;
224
+color c2 = #4E937F;
225
+color f2 = #8F4330;
226
+color g2 = #FFDB03;
227
+
228
+color colors[][] = {
229
+  {a0,a1,a2,a3,a4,a5},
230
+  {b0,b1,b2,b3,b4,b5},
231
+  {c0,c1,c2,c3,c4,c5},
232
+  {d0,d1,d2,d3,d4,d5},
233
+  {e0,e1,e2,e3,e4,e5},
234
+  {f0,f1,f2,f3,f4,f5},
235
+  {g0,g1,g2,g3,g4,g5}
236
+};
237
+
238
+class PrivacyLevel {
239
+  public static int SECRET = 5; //passwords, keys etc. 
240
+  public static int PRIVATE = 4;//ssn etc, strict need to know basis stuff 
241
+  public static int INTIMATE = 3;//e.g. stuff you share with family 
242
+  public static int AFFILIATE = 2;//e.g. stuff you share with work, project etc 
243
+  public static int PUBLIC = 1;//e.g. stuff that everybody may know, your e.g. twitter handle 
244
+  public static int COMMONS = 0;//stuff that is intended for the public good / commons, anonimized IoT stuff 
245
+}
246
+
247
+class ContextType {
248
+  public static int SELF = 5; //stuff that applies strictly to yourself 
249
+  public static int FAMILY = 4;//stuff that applies to you and your family (hopefully not facebook pics)
250
+  public static int FRIENDS = 3;//stuff you share with friends 
251
+  public static int WORK = 2;//stuff you share in a professional context
252
+  public static int HOBBY = 1;//stuff you share in the context of a pastime
253
+  public static int WORLD = 0;//stuff that is intended for the public good / commons 
254
+}
255
+
256
+public int getColor(int privacy_level, int context_type)
257
+{
258
+  return colors[context_type][privacy_level];
259
+}
260
+
261
+void draw(){
262
+  size(100,100);
263
+  background(0);
264
+  noStroke();
265
+  int level = PrivacyLevel.SECRET;
266
+  int contextType = ContextType.SELF;
267
+  color private_self = getColor(level, contextType);//should be dark red
268
+  fill(private_self);
269
+  ellipse(50,50,50,50);
270
+}
271
+#+END_SRC 
272
+
273
+#+RESULTS: colors
274
+#+BEGIN_EXPORT html
275
+<script src="processing.js"></script>
276
+ <script type="text/processing" data-processing-target="ob-a8ca6153dc3f4dcea5960a1d135a98b56cb78842">
277
+//color definitions
278
+color a3 = #3A3B58;
279
+color b3 = #734246;
280
+color d3 = #B4561F;
281
+color c3 = #336F60;
282
+color f3 = #7A3E2A;
283
+color g3 = #A48137;
284
+color e2 = #97BBCB;
285
+color a4 = #3B4257;
286
+color b4 = #6A4345;
287
+color d4 = #86451F;
288
+color c4 = #345A48;
289
+color f4 = #A92F21;
290
+color g4 = #BC983B;
291
+color a5 = #3D4358;
292
+color b5 = #402623;
293
+color d5 = #85442D;
294
+color c5 = #3B403A;
295
+color f5 = #7A150B;
296
+color g5 = #252F2B;
297
+color a1 = #597099;
298
+color e4 = #0A3878;
299
+color b1 = #D16365;
300
+color d1 = #FFD43B;
301
+color c1 = #B7BF98;
302
+color e1 = #CAD2C8;
303
+color e0 = #F5EDE5;
304
+color f1 = #D17978;
305
+color g1 = #FDD23E;
306
+color a0 = #C5C3CC;
307
+color e3 = #0485B1;
308
+color b0 = #FFDCD6;
309
+color d0 = #FFE9BE;
310
+color c0 = #F0E9D5;
311
+color f0 = #E4C8BF;
312
+color g0 = #FBE6BA;
313
+color a2 = #3D4B79;
314
+color e5 = #084064;
315
+color b2 = #974244;
316
+color d2 = #F8AA08;
317
+color c2 = #4E937F;
318
+color f2 = #8F4330;
319
+color g2 = #FFDB03;
320
+
321
+color colors[][] = {
322
+  {a0,a1,a2,a3,a4,a5},
323
+  {b0,b1,b2,b3,b4,b5},
324
+  {c0,c1,c2,c3,c4,c5},
325
+  {d0,d1,d2,d3,d4,d5},
326
+  {e0,e1,e2,e3,e4,e5},
327
+  {f0,f1,f2,f3,f4,f5},
328
+  {g0,g1,g2,g3,g4,g5}
329
+};
330
+
331
+class PrivacyLevel {
332
+  public static int SECRET = 5; //passwords, keys etc. 
333
+  public static int PRIVATE = 4;//ssn etc, strict need to know basis stuff 
334
+  public static int INTIMATE = 3;//e.g. stuff you share with family 
335
+  public static int AFFILIATE = 2;//e.g. stuff you share with work, project etc 
336
+  public static int PUBLIC = 1;//e.g. stuff that everybody may know, your e.g. twitter handle 
337
+  public static int COMMONS = 0;//stuff that is intended for the public good / commons, anonimized IoT stuff 
338
+}
339
+
340
+class ContextType {
341
+  public static int SELF = 5; //stuff that applies strictly to yourself 
342
+  public static int FAMILY = 4;//stuff that applies to you and your family (hopefully not facebook pics)
343
+  public static int FRIENDS = 3;//stuff you share with friends 
344
+  public static int WORK = 2;//stuff you share in a professional context
345
+  public static int HOBBY = 1;//stuff you share in the context of a pastime
346
+  public static int WORLD = 0;//stuff that is intended for the public good / commons 
347
+}
348
+
349
+public int getColor(int privacy_level, int context_type)
350
+{
351
+  return colors[context_type][privacy_level];
352
+}
353
+
354
+void draw(){
355
+  size(100,100);
356
+  background(0);
357
+  noStroke();
358
+  int level = PrivacyLevel.SECRET;
359
+  int contextType = ContextType.SELF;
360
+  color private_self = getColor(level, contextType);//should be dark red
361
+  fill(private_self);
362
+  ellipse(50,50,50,50);
363
+}
364
+</script> <canvas id="ob-a8ca6153dc3f4dcea5960a1d135a98b56cb78842"></canvas>
365
+#+END_EXPORT
180 366
 
181 367
 #+name: glue 
182 368
 #+BEGIN_SRC processing :exports none 

File diff suppressed because it is too large
+ 21645 - 0
processing.js