summaryrefslogtreecommitdiff
path: root/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js
Unidiff
Diffstat (limited to 'frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js') (more/less context) (ignore whitespace changes)
-rw-r--r--frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js27
1 files changed, 24 insertions, 3 deletions
diff --git a/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js b/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js
index a0e4879..dbab41b 100644
--- a/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js
+++ b/frontend/gamma/js/Clipperz/PM/UI/Mobile/Components/CardList.js
@@ -8,121 +8,142 @@ refer to http://www.clipperz.com.
8 8
9* Clipperz is free software: you can redistribute it and/or modify it 9* Clipperz is free software: you can redistribute it and/or modify it
10 under the terms of the GNU Affero General Public License as published 10 under the terms of the GNU Affero General Public License as published
11 by the Free Software Foundation, either version 3 of the License, or 11 by the Free Software Foundation, either version 3 of the License, or
12 (at your option) any later version. 12 (at your option) any later version.
13 13
14* Clipperz is distributed in the hope that it will be useful, but 14* Clipperz is distributed in the hope that it will be useful, but
15 WITHOUT ANY WARRANTY; without even the implied warranty of 15 WITHOUT ANY WARRANTY; without even the implied warranty of
16 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. 16 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
17 See the GNU Affero General Public License for more details. 17 See the GNU Affero General Public License for more details.
18 18
19* You should have received a copy of the GNU Affero General Public 19* You should have received a copy of the GNU Affero General Public
20 License along with Clipperz. If not, see http://www.gnu.org/licenses/. 20 License along with Clipperz. If not, see http://www.gnu.org/licenses/.
21 21
22*/ 22*/
23 23
24Clipperz.Base.module('Clipperz.PM.UI.Mobile.Components'); 24Clipperz.Base.module('Clipperz.PM.UI.Mobile.Components');
25 25
26Clipperz.PM.UI.Mobile.Components.CardList = function(args) { 26Clipperz.PM.UI.Mobile.Components.CardList = function(args) {
27 args = args || {}; 27 args = args || {};
28 28
29 Clipperz.PM.UI.Mobile.Components.CardList.superclass.constructor.apply(this, arguments); 29 Clipperz.PM.UI.Mobile.Components.CardList.superclass.constructor.apply(this, arguments);
30 30
31 this._cardDetail = null; 31 this._cardDetail = null;
32 32 this.render();
33
33 return this; 34 return this;
34} 35}
35 36
36//============================================================================= 37//=============================================================================
37 38
38Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.CardList, Clipperz.PM.UI.Common.Components.BaseComponent, { 39Clipperz.Base.extend(Clipperz.PM.UI.Mobile.Components.CardList, Clipperz.PM.UI.Mobile.Components.BaseComponent, {
39 40
40 //------------------------------------------------------------------------- 41 //-------------------------------------------------------------------------
41 42
42 'toString': function () { 43 'toString': function () {
43 return "Clipperz.PM.UI.Mobile.Components.CardList component"; 44 return "Clipperz.PM.UI.Mobile.Components.CardList component";
44 }, 45 },
45 46
46 //------------------------------------------------------------------------- 47 //-------------------------------------------------------------------------
47 48
48 'renderSelf': function () { 49 'renderSelf': function () {
50 varheaderElement;
51
52 headerElement = MochiKit.Selector.findChildElements(this.element().parentNode, ['div[data-role=header]'])[0];
53 this.append(this.element(),
54 {tag:'div', /*cls:'scroll',*/ id:this.getId('listBox'), children:[
55 {tag:'ul', /*cls:'rounded',*/ id:this.getId('list'), children:[
56 {tag:'li', html:'loading'}
57 ]}
58 ]}
59 );
60
61 this.append(headerElement,
62 // {tag:'a', href:"#", 'data-icon':'gear', cls:'ui-btn-right', html:"Options" }
63 {tag:'a', href:"#", id:this.getId('preferences'), cls:'ui-btn-right', html:"options" }
64 );
65
66 MochiKit.Signal.connect(this.getElement('preferences'), 'onclick', MochiKit.Base.partial(MochiKit.Signal.signal, Clipperz.Signal.NotificationCenter, 'showPreferences'));
67
68/*
49 this.append(this.element(), {tag:'div', cls:'cardList', children:[ 69 this.append(this.element(), {tag:'div', cls:'cardList', children:[
50 {tag:'div', cls:'toolbar', children:[ 70 {tag:'div', cls:'toolbar', children:[
51 {tag:'h1', html:"clipperz"}, 71 {tag:'h1', html:"clipperz"},
52 // {tag:'input', name:'search', type:'search', autocomplete:'off', placeholder:"search", id:this.getId('search')}, 72 // {tag:'input', name:'search', type:'search', autocomplete:'off', placeholder:"search", id:this.getId('search')},
53 {tag:'a', href:'#', id:'settings', cls:'button', html:"*"} 73 {tag:'a', href:'#', id:'settings', cls:'button', html:"*"}
54 ]}, 74 ]},
55 {tag:'div', cls:'scroll', id:this.getId('listBox'), children:[ 75 {tag:'div', cls:'scroll', id:this.getId('listBox'), children:[
56 {tag:'ul', cls:'rounded', id:this.getId('list'), children:[ 76 {tag:'ul', cls:'rounded', id:this.getId('list'), children:[
57 {tag:'li', html:'loading'} 77 {tag:'li', html:'loading'}
58 ]} 78 ]}
59 ]} 79 ]}
60 ]}); 80 ]});
61 81
62 MochiKit.Signal.connect(this.getElement('list'), 'onclick', this, 'cardSelectionHandler'); 82 MochiKit.Signal.connect(this.getElement('list'), 'onclick', this, 'cardSelectionHandler');
63 MochiKit.Signal.connect(this.getElement('list'), 'ontouchstart',this, 'cardSelectionHandler'); 83 MochiKit.Signal.connect(this.getElement('list'), 'ontouchstart',this, 'cardSelectionHandler');
64 // MochiKit.Signal.connect(this.getElement('cardListSearchForm'), 'onsubmit', this,'searchHandler'); 84 // MochiKit.Signal.connect(this.getElement('cardListSearchForm'), 'onsubmit', this,'searchHandler');
65 // MochiKit.Signal.connect(this.getElement('cardListSearchForm'), 'onkeydown', this,'searchHandler'); 85 // MochiKit.Signal.connect(this.getElement('cardListSearchForm'), 'onkeydown', this,'searchHandler');
66 // MochiKit.Signal.connect(this.getElement('cardListSearchForm'), 'onkeyup', this,'searchHandler'); 86 // MochiKit.Signal.connect(this.getElement('cardListSearchForm'), 'onkeyup', this,'searchHandler');
67 87
68 // MochiKit.Signal.connect(this.getElement('cardListPanel'), 'onclick', this,'cardListClickHandler'); 88 // MochiKit.Signal.connect(this.getElement('cardListPanel'), 'onclick', this,'cardListClickHandler');
69 // MochiKit.Signal.connect('backButton', 'onclick', this,'backButtonClickHandler'); 89 // MochiKit.Signal.connect('backButton', 'onclick', this,'backButtonClickHandler');
70 90
71 // MochiKit.Style.hideElement('backButton'); 91 // MochiKit.Style.hideElement('backButton');
72 // MochiKit.Style.hideElement(this.getElement('cardDetail')); 92 // MochiKit.Style.hideElement(this.getElement('cardDetail'));
93*/
73 }, 94 },
74 95
75 'showCards': function (someCards) { 96 'showCards': function (someCards) {
76 varcardListElement; 97 varcardListElement;
77 if (this.isFullyRendered() == false) { 98 if (this.isFullyRendered() == false) {
78 this.render(); 99 this.render();
79 }; 100 };
80 101
81 cardListElement = this.getElement('list') 102 cardListElement = this.getElement('list')
82 103
83 cardInfo = { 104 cardInfo = {
84 '_rowObject': MochiKit.Async.succeed, 105 '_rowObject': MochiKit.Async.succeed,
85 '_reference': MochiKit.Base.methodcaller('reference'), 106 '_reference': MochiKit.Base.methodcaller('reference'),
86 '_searchableContent':MochiKit.Base.methodcaller('searchableContent'), 107 '_searchableContent':MochiKit.Base.methodcaller('searchableContent'),
87 'label': MochiKit.Base.methodcaller('label'), 108 'label': MochiKit.Base.methodcaller('label'),
88 'favicon': MochiKit.Base.methodcaller('favicon') 109 'favicon': MochiKit.Base.methodcaller('favicon')
89 }; 110 };
90 111
91 deferredResult = new Clipperz.Async.Deferred("CardList.showCards", {trace:false}); 112 deferredResult = new Clipperz.Async.Deferred("CardList.showCards", {trace:false});
92 deferredResult.addCallback(MochiKit.Base.map, Clipperz.Async.collectResults("CardList.value - collectResults", cardInfo, {trace:false})); 113 deferredResult.addCallback(MochiKit.Base.map, Clipperz.Async.collectResults("CardList.value - collectResults", cardInfo, {trace:false}));
93 deferredResult.addCallback(Clipperz.Async.collectAll); 114 deferredResult.addCallback(Clipperz.Async.collectAll);
94 deferredResult.addCallback(MochiKit.Base.methodcaller('sort', Clipperz.Base.caseInsensitiveKeyComparator('label'))); 115 deferredResult.addCallback(MochiKit.Base.methodcaller('sort', Clipperz.Base.caseInsensitiveKeyComparator('label')));
95 deferredResult.addCallbackPass(MochiKit.DOM.replaceChildNodes, cardListElement); 116 deferredResult.addCallbackPass(MochiKit.DOM.replaceChildNodes, cardListElement);
96 // deferredResult.addCallbackPass(MochiKit.DOM.removeElementClass, cardListElement, 'loading'); 117 // deferredResult.addCallbackPass(MochiKit.DOM.removeElementClass, cardListElement, 'loading');
97 deferredResult.addCallback(MochiKit.Base.map, MochiKit.Base.method(this, 'appendCardToList', cardListElement)); 118 deferredResult.addCallback(MochiKit.Base.map, MochiKit.Base.method(this, 'appendCardToList', cardListElement));
98 deferredResult.callback(someCards); 119 deferredResult.callback(someCards);
99 }, 120 },
100 121
101 'appendCardToList': function (aCardListElement, aCardInfo) { 122 'appendCardToList': function (aCardListElement, aCardInfo) {
102 this.append(aCardListElement, {tag:'li', cls:'cardListItem arrow', cardreference:aCardInfo['_reference'], children:[ 123 this.append(aCardListElement, {tag:'li', cls:'cardListItem arrow', cardreference:aCardInfo['_reference'], children:[
103 {tag:'a', href:'#', html:aCardInfo['label'], children:[ 124 {tag:'a', href:'#', html:aCardInfo['label'], children:[
104 {tag:'small', cls:'favicon', children:[{tag:'img', cls:'favicon', src:aCardInfo['favicon']}]} 125 // {tag:'small', cls:'favicon', children:[{tag:'img', cls:'favicon', src:aCardInfo['favicon']}]}
105 ]} 126 ]}
106 ]}); 127 ]});
107 }, 128 },
108 129
109 'cardSelectionHandler': function (anEvent) { 130 'cardSelectionHandler': function (anEvent) {
110 var listElement; 131 var listElement;
111 varcardReference; 132 varcardReference;
112 133
113 anEvent.preventDefault(); 134 anEvent.preventDefault();
114 135
115 listElement = anEvent.target(); 136 listElement = anEvent.target();
116 if (MochiKit.DOM.getNodeAttribute(listElement, 'cardreference') == null) { 137 if (MochiKit.DOM.getNodeAttribute(listElement, 'cardreference') == null) {
117 listElement = MochiKit.DOM.getFirstParentByTagAndClassName(anEvent.target(), tagName='li', className='cardListItem'); 138 listElement = MochiKit.DOM.getFirstParentByTagAndClassName(anEvent.target(), tagName='li', className='cardListItem');
118 } 139 }
119 cardReference = MochiKit.DOM.getNodeAttribute(listElement, 'cardreference'); 140 cardReference = MochiKit.DOM.getNodeAttribute(listElement, 'cardreference');
120 //TODO: Notify card with reference MochiKit.DOM.getNodeAttribute(listElement, 'cardreference') has been selected 141 //TODO: Notify card with reference MochiKit.DOM.getNodeAttribute(listElement, 'cardreference') has been selected
121 MochiKit.Signal.signal(this, 'selectedCard', cardReference); 142 MochiKit.Signal.signal(this, 'selectedCard', cardReference);
122 }, 143 },
123 144
124 //------------------------------------------------------------------------- 145 //-------------------------------------------------------------------------
125/* 146/*
126 'searchHandler': function (anEvent) { 147 'searchHandler': function (anEvent) {
127 if ((typeof(anEvent.key()) != 'undefined') && (anEvent.key().string == 'KEY_ENTER')) { //RETURN 148 if ((typeof(anEvent.key()) != 'undefined') && (anEvent.key().string == 'KEY_ENTER')) { //RETURN
128 anEvent.preventDefault(); 149 anEvent.preventDefault();