Skip to content

Commit 7626aa7

Browse files
author
Tim Berners-Lee
committed
widget improvements and add askName()
1 parent d6bccad commit 7626aa7

5 files changed

Lines changed: 132 additions & 9 deletions

File tree

lib/icons/noun_145978.svg

Lines changed: 1 addition & 0 deletions
Loading

lib/pad.js

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,10 @@ UI.pad.manageParticipation = function(dom, container, padDoc, subject, me, optio
7474

7575
var parps = kb.each(subject, ns.wf('participation')).filter(function(pn){
7676
return kb.holds(pn, ns.wf('participant'), me)});
77-
if (parps.length > 1) throw "Multiple my participations";
77+
if (parps.length > 1) {
78+
container.appendChild(UI.widgets.errorMessageBlock(dom, "Multiple notes of my participation!")) // Clean up?
79+
//throw "Multiple my participations";
80+
}
7881
if (!parps.length) {
7982
var participation = UI.widgets.newThing(padDoc);
8083
var ins = [
@@ -94,7 +97,7 @@ UI.pad.manageParticipation = function(dom, container, padDoc, subject, me, optio
9497
} else {
9598
UI.pad.renderPartipants(dom, table, padDoc, subject, me, options)
9699
}
97-
return table // won't be set up yet
100+
return table // won't be set up yet
98101
}
99102

100103

@@ -201,7 +204,7 @@ UI.pad.notepad = function (dom, padDoc, subject, me, options) {
201204
} else if (xhr.status === 409) { // Conflict
202205
setPartStyle(part,'color: black; background-color: #ffd;'); // yellow
203206
part.state = 0; // Needs downstream refresh
204-
UI.widgets.beep(0.5, 512); // Ooops clash with other person
207+
UI.utils.beep(0.5, 512); // Ooops clash with other person
205208
setTimeout(function(){
206209
updater.requestDownstreamAction(padDoc, reloadAndSync);
207210
}, 1000);
@@ -363,7 +366,7 @@ UI.pad.notepad = function (dom, padDoc, subject, me, options) {
363366
if (xhr.status === 409) { // Conflict - @@ we assume someone else
364367
setPartStyle(part,'color: black; background-color: #fdd;');
365368
part.state = 0; // Needs downstream refresh
366-
UI.widgets.beep(0.5, 512); // Ooops clash with other person
369+
UI.utils.beep(0.5, 512); // Ooops clash with other person
367370
setTimeout(function(){
368371
updater.requestDownstreamAction(padDoc, reloadAndSync);
369372
}, 1000);
@@ -372,7 +375,7 @@ UI.pad.notepad = function (dom, padDoc, subject, me, options) {
372375
setPartStyle(part,'color: black; background-color: #fdd;'); // failed pink
373376
part.state = 0;
374377
complain(" Error " + xhr.status + " sending data: " + error_body, true);
375-
UI.widgets.beep(1.0, 128); // Other
378+
UI.utils.beep(1.0, 128); // Other
376379
// @@@ Do soemthing more serious with other errors eg auth, etc
377380
}
378381
} else {

lib/tabs.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ UI.tabs.tabWidget = function(options){
9696
margins = margins.concat(margins).slice(orientation, orientation + 4)
9797
margins = 'margin: ' + margins.join(' ') + ';'
9898

99-
var tabStyle = corners + 'padding: 0.7em;' // border: 0.05em 0 0.5em 0.05em; border-color: grey;
99+
var tabStyle = corners + 'padding: 0.7em; max-width: 20em;' // border: 0.05em 0 0.5em 0.05em; border-color: grey;
100100
var unselectedStyle = tabStyle + 'opacity: 50%; margin: 0.3em; background-color: #ddc;' // @@ rotate border
101101
var selectedStyle = tabStyle + margins + ' background-color: #eed;'
102102
var shownStyle = ''

lib/utils.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ if (UI.utils.audioContext) {
8686
var ctx = new(UI.utils.audioContext)
8787
return function (duration, frequency, type, finishedCallback) {
8888

89-
duration = + (duration | 0.3)
89+
duration = + (duration || 0.3)
9090

9191
// Only 0-4 are valid types.
9292
type = type || 'sine'; // sine, square, sawtooth, triangle

lib/widgets.js

Lines changed: 121 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -229,6 +229,63 @@ UI.widgets.deleteButtonWithCheck = function (dom, container, noun, deleteFunctio
229229
return delButton
230230
}
231231

232+
//////////////////////////////////////// Frab a name for a new thing
233+
234+
235+
236+
237+
// Form to get the name of a new thing before we create it
238+
// Returns a promise of (a name or null if cancelled)
239+
UI.widgets.askName = function (dom, kb, container, predicate, klass) {
240+
return new Promise(function(resolve, reject){
241+
var form = dom.createElement('div') // form is broken as HTML behaviour can resurface on js error
242+
// classLabel = UI.utils.label(ns.vcard('Individual'))
243+
predicate = predicate || UI.ns.foaf('name')
244+
var prompt = klass ? UI.utils.label(klass) + ' ' : ''
245+
prompt += UI.utils.label(predicate) + ': '
246+
form.appendChild(dom.createElement('p')).textContent = prompt
247+
var namefield = dom.createElement('input')
248+
namefield.setAttribute('type', 'text')
249+
namefield.setAttribute('size', '100')
250+
namefield.setAttribute('maxLength', '2048') // No arbitrary limits
251+
namefield.select() // focus next user input
252+
form.appendChild(namefield)
253+
container.appendChild(form)
254+
255+
var gotName = function () {
256+
// namefield.setAttribute('class', 'pendingedit')
257+
// namefield.disabled = true
258+
form.parentNode.removeChild(form)
259+
resolve(namefield.value)
260+
}
261+
262+
namefield.addEventListener('keyup', function (e) {
263+
if (e.keyCode == 13) {
264+
gotName()
265+
}
266+
}, false)
267+
268+
var br = form.appendChild(dom.createElement('br'))
269+
270+
var cancel = form.appendChild(dom.createElement('button'))
271+
cancel.setAttribute('type', 'button')
272+
cancel.innerHTML = 'Cancel'
273+
cancel.addEventListener('click', function (e) {
274+
form.parentNode.removeChild(form)
275+
resolve(null)
276+
}, false)
277+
278+
var b = form.appendChild(dom.createElement('button'))
279+
b.setAttribute('type', 'button')
280+
b.innerHTML = 'Continue'
281+
b.addEventListener('click', function (e) {
282+
gotName()
283+
}, false)
284+
285+
}) // Promise
286+
}
287+
288+
232289
///////////////////////////////////////////////////// DRAG AND drop
233290

234291

@@ -335,7 +392,9 @@ UI.widgets.makeDraggable = function(tr, obj){
335392
UI.widgets.linkIcon = function(dom, subject, iconURI){
336393
var anchor = dom.createElement('a')
337394
anchor.setAttribute('href', subject.uri)
338-
anchor.setAttribute('target', '_blank') // open in a new tab or window
395+
if (subject.uri.startsWith('http')){ // If diff web page
396+
anchor.setAttribute('target', '_blank') // open in a new tab or window
397+
} // as mailboxes and mail messages do not need new browser window
339398
var img = anchor.appendChild(dom.createElement('img'))
340399
img.setAttribute('src', iconURI || (UI.icons.originalIconBase + 'go-to-this.png'))
341400
img.setAttribute('style','margin: 0.3em;')
@@ -364,7 +423,7 @@ UI.widgets.personTR = function (dom, pred, obj, options) {
364423

365424
UI.widgets.setName(td2, agent)
366425
if (options.deleteFunction) {
367-
UI.widgets.deleteButtonWithCheck(dom, td3, 'person', options.deleteFunction)
426+
UI.widgets.deleteButtonWithCheck(dom, td3, options.noun || 'one', options.deleteFunction)
368427
}
369428
if (options.link !== false) {
370429
var anchor = td3.appendChild(UI.widgets.linkIcon(dom, obj))
@@ -378,6 +437,66 @@ UI.widgets.personTR = function (dom, pred, obj, options) {
378437
return tr
379438
}
380439

440+
// List of attachments accepting drop
441+
442+
UI.widgets.attachmentList = function(dom, subject, div){
443+
var kb = UI.store
444+
var ns = UI.ns
445+
var attachmentOuter = div.appendChild(dom.createElement('table'))
446+
attachmentOuter.setAttribute('style','margin-top: 1em; margin-bottom: 1em;')
447+
var attachmentOne = attachmentOuter.appendChild(dom.createElement('tr'))
448+
var attachmentLeft = attachmentOne.appendChild(dom.createElement('td'))
449+
var attachmentRight = attachmentOne.appendChild(dom.createElement('td'))
450+
var attachmentTable = attachmentRight.appendChild(dom.createElement('table'))
451+
var attachmentTableTop = attachmentTable.appendChild(dom.createElement('tr'))
452+
453+
var paperclip = attachmentLeft.appendChild(dom.createElement('img'))
454+
paperclip.setAttribute('src', UI.icons.iconBase + 'noun_25830.svg')
455+
paperclip.setAttribute('style', 'width; 2em; height: 2em; margin: 0.5em;')
456+
paperclip.setAttribute('draggable', 'false')
457+
458+
var deleteAttachment = function(target){
459+
kb.updater.update($rdf.st(subject, UI.ns.wf('attachment'), target, subject.doc()), [], function(uri, ok, error_body, xhr){
460+
if (ok){
461+
refresh()
462+
} else {
463+
complain('Error deleting attachment: ' + error_body)
464+
}
465+
})
466+
}
467+
var createNewRow = function(target){
468+
var options = { deleteFunction: function(){deleteAttachment(target)}, noun: "attachment"}
469+
return UI.widgets.personTR(dom, ns.wf('attachment'), target, options)
470+
}
471+
var refresh = attachmentTable.refresh = function(){
472+
var things = kb.each(subject, UI.ns.wf('attachment'))
473+
things.sort()
474+
UI.utils.syncTableToArray(attachmentTable, things, createNewRow)
475+
}
476+
refresh()
477+
478+
var droppedURIHandler = function(uris){
479+
var ins = []
480+
uris.map(function (u) {
481+
var target = $rdf.sym(u) // Attachment needs text label to disinguish I think not icon.
482+
console.log('Dropped on attachemnt ' + u) // icon was: UI.icons.iconBase + 'noun_25830.svg'
483+
ins.push($rdf.st(subject, UI.ns.wf('attachment'), target, subject.doc()))
484+
})
485+
kb.updater.update([], ins, function(uri, ok, error_body, xhr){
486+
if (ok){
487+
refresh()
488+
} else {
489+
complain('Error adding attachment: ' + error_body)
490+
}
491+
})
492+
}
493+
UI.widgets.makeDropTarget(attachmentLeft, droppedURIHandler)
494+
return attachmentOuter
495+
}
496+
497+
498+
499+
381500
// ///////////////////////////////////////////////////////////////////////
382501

383502
/* Form Field implementations

0 commit comments

Comments
 (0)