Interim synchronization with internal repository
This is an intermir commit to share what is going on with the development of the new /delta version.
This commit is contained in:
Giulio Cesare Solaroli
@@ -0,0 +1,78 @@
|
||||
/*
|
||||
|
||||
Copyright 2008-2013 Clipperz Srl
|
||||
|
||||
This file is part of Clipperz, the online password manager.
|
||||
For further information about its features and functionalities please
|
||||
refer to http://www.clipperz.com.
|
||||
|
||||
* Clipperz is free software: you can redistribute it and/or modify it
|
||||
under the terms of the GNU Affero General Public License as published
|
||||
by the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
* Clipperz is distributed in the hope that it will be useful, but
|
||||
WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
|
||||
See the GNU Affero General Public License for more details.
|
||||
|
||||
* You should have received a copy of the GNU Affero General Public
|
||||
License along with Clipperz. If not, see http://www.gnu.org/licenses/.
|
||||
|
||||
*/
|
||||
|
||||
Clipperz.Base.module('Clipperz.PM.UI.Components.Panels');
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.ExtraFeaturesPanel = React.createClass({
|
||||
|
||||
settingsToggleHandler: function (anEvent) {
|
||||
//console.log("settingsToggleHandler");
|
||||
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'toggleSettingsPanel');
|
||||
},
|
||||
|
||||
//=========================================================================
|
||||
|
||||
render: function () {
|
||||
var classes = {
|
||||
'panel': true,
|
||||
'right': true,
|
||||
'open': this.props['settingsPanelStatus'] == 'OPEN'
|
||||
}
|
||||
|
||||
return React.DOM.div({key:'extraFeaturesPanel', id:'extraFeaturesPanel', className:React.addons.classSet(classes)}, [
|
||||
React.DOM.header({}, [
|
||||
React.DOM.div({className:'settingsToggle'}, [
|
||||
Clipperz.PM.UI.Components.Button({eventName:'settingsToggleButton', label:"menu", handler:this.settingsToggleHandler})
|
||||
])
|
||||
]),
|
||||
React.DOM.h2({}, "Extra features")
|
||||
]);
|
||||
/*
|
||||
<div id="extraFeaturesPanel" class="panel extraFeatures">
|
||||
|
||||
<div class="warnings">
|
||||
<ul>
|
||||
<li>Synchronize local data</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
<li>Account</li>
|
||||
<li>Subscription</li>
|
||||
</ul>
|
||||
|
||||
<ul>
|
||||
<li>Local Data</li>
|
||||
<li>OTP</li>
|
||||
</ul>
|
||||
|
||||
<div class="donation">
|
||||
<a>Make a donation</a>
|
||||
</div>
|
||||
</div>
|
||||
*/
|
||||
|
||||
}
|
||||
|
||||
//=========================================================================
|
||||
});
|
||||
193
frontend/delta/js/Clipperz/PM/UI/Components/Panels/MainPanel.js
Normal file
193
frontend/delta/js/Clipperz/PM/UI/Components/Panels/MainPanel.js
Normal file
@@ -0,0 +1,193 @@
|
||||
/*
|
||||
|
||||
Copyright 2008-2013 Clipperz Srl
|
||||
|
||||
This file is part of Clipperz, the online password manager.
|
||||
For further information about its features and functionalities please
|
||||
refer to http://www.clipperz.com.
|
||||
|
||||
* Clipperz is free software: you can redistribute it and/or modify it
|
||||
under the terms of the GNU Affero General Public License as published
|
||||
by the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
* Clipperz is distributed in the hope that it will be useful, but
|
||||
WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
|
||||
See the GNU Affero General Public License for more details.
|
||||
|
||||
* You should have received a copy of the GNU Affero General Public
|
||||
License along with Clipperz. If not, see http://www.gnu.org/licenses/.
|
||||
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
Clipperz.Base.module('Clipperz.PM.UI.Components.Panels');
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.MainPanel = React.createClass({
|
||||
|
||||
//=========================================================================
|
||||
|
||||
propTypes: {
|
||||
'messageBox': React.PropTypes.object.isRequired,
|
||||
'featureSet': React.PropTypes.oneOf(['FULL', 'EXPIRED', 'TRIAL']).isRequired,
|
||||
'style': React.PropTypes.oneOf(Clipperz_PM_UI_availableStyles).isRequired,
|
||||
},
|
||||
|
||||
getDefaultProps: function () {
|
||||
return {
|
||||
featureSet: 'FULL'
|
||||
};
|
||||
},
|
||||
|
||||
style: function () {
|
||||
return this.props['style'];
|
||||
},
|
||||
|
||||
featureSet: function () {
|
||||
return this.props['featureSet'];
|
||||
},
|
||||
|
||||
handleMaskClick: function () {
|
||||
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'maskClick');
|
||||
},
|
||||
|
||||
handleAddCardClick: function () {
|
||||
MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'addCardClick');
|
||||
},
|
||||
|
||||
//----------------------------------------------------------------------------
|
||||
|
||||
renderToolbarFrame: function (anInnerComponent) {
|
||||
return React.DOM.div({'className':'cardToolbarFrame'}, [
|
||||
this.renderToolbar(),
|
||||
anInnerComponent
|
||||
]);
|
||||
},
|
||||
|
||||
renderCardFrame: function (firstColumnComponents, secondColumnComponents) {
|
||||
var addCardButton = React.DOM.div({'className': 'addCardButton', 'onClick':this.handleAddCardClick}, 'add card');
|
||||
|
||||
return React.DOM.div({'key':'cardContent', 'className':'cardContent'}, [
|
||||
React.DOM.div({'className':'cardListColumn column'}, [addCardButton, firstColumnComponents]),
|
||||
React.DOM.div({'className':'cardDetail column right'}, secondColumnComponents)
|
||||
])
|
||||
},
|
||||
|
||||
//----------------------------------------------------------------------------
|
||||
|
||||
renderToolbar: function () {
|
||||
var cardToolbarProps;
|
||||
|
||||
cardToolbarProps = MochiKit.Base.merge(this.props, {
|
||||
'key': 'toolbar',
|
||||
'style': this.style(),
|
||||
'enableSidePanels': (this.props['featureSet'] != 'EXPIRED')
|
||||
});
|
||||
|
||||
return Clipperz.PM.UI.Components.CardToolbar(cardToolbarProps);
|
||||
},
|
||||
|
||||
renderExpiredPanel: function () {
|
||||
return this.featureSet() == 'EXPIRED' ? Clipperz.PM.UI.Components.ExpiredPanel(this.props) : null;
|
||||
},
|
||||
|
||||
//----------------------------------------------------------------------------
|
||||
|
||||
viewComponentProps: function () {
|
||||
var result;
|
||||
|
||||
result = this.props['selectedCard'];
|
||||
if (result) {
|
||||
result['style'] = this.props['style'];
|
||||
}
|
||||
|
||||
return result;
|
||||
},
|
||||
|
||||
renderExtraWide: function () {
|
||||
return [
|
||||
React.DOM.div({'className':'selection subpanel'}, [Clipperz.PM.UI.Components.Selections(this.props)]),
|
||||
React.DOM.div({'className':'cardContent subpanel'}, [
|
||||
this.renderToolbarFrame(
|
||||
this.renderCardFrame(
|
||||
[Clipperz.PM.UI.Components.Cards.List(this.props)],
|
||||
[
|
||||
this.renderExpiredPanel(),
|
||||
Clipperz.PM.UI.Components.Cards.View(this.viewComponentProps())
|
||||
]
|
||||
)
|
||||
)
|
||||
])
|
||||
]
|
||||
},
|
||||
|
||||
//----------------------------------------------------------------------------
|
||||
|
||||
renderWide: function () {
|
||||
return [
|
||||
this.renderToolbarFrame(
|
||||
this.renderCardFrame(
|
||||
[Clipperz.PM.UI.Components.Cards.List(this.props)],
|
||||
[
|
||||
this.renderExpiredPanel(),
|
||||
Clipperz.PM.UI.Components.Cards.View(this.viewComponentProps())
|
||||
]
|
||||
)
|
||||
)
|
||||
];
|
||||
},
|
||||
|
||||
//----------------------------------------------------------------------------
|
||||
|
||||
renderNarrow: function () {
|
||||
return this.renderCardFrame(
|
||||
this.renderToolbarFrame([
|
||||
this.renderExpiredPanel(),
|
||||
Clipperz.PM.UI.Components.Cards.List(this.props),
|
||||
]),
|
||||
[Clipperz.PM.UI.Components.Cards.View(this.viewComponentProps())]
|
||||
);
|
||||
},
|
||||
|
||||
//----------------------------------------------------------------------------
|
||||
|
||||
renderLayout: function (aLayout) {
|
||||
var result;
|
||||
|
||||
if (aLayout == 'extra-wide') {
|
||||
result = this.renderExtraWide();
|
||||
} else if (aLayout == 'wide') {
|
||||
result = this.renderWide();
|
||||
} else if (aLayout == 'narrow') {
|
||||
result = this.renderNarrow();
|
||||
} else if (aLayout == 'extra-short') {
|
||||
result = this.renderNarrow();
|
||||
} else {
|
||||
Clipperz.Base.exception.raise('UnknownType');
|
||||
}
|
||||
|
||||
return result;
|
||||
},
|
||||
|
||||
render: function () {
|
||||
//console.log("MainPanel.cards", this.props['cards']);
|
||||
var classes = {
|
||||
'panel': true,
|
||||
'left': this.props['selectionPanelStatus'] == 'OPEN',
|
||||
'right': this.props['settingsPanelStatus'] == 'OPEN',
|
||||
'open': this.props['selectionPanelStatus'] == 'OPEN' || this.props['settingsPanelStatus'] == 'OPEN'
|
||||
};
|
||||
classes[this.style()] = true;
|
||||
|
||||
return React.DOM.div({'key':'mainPanel', 'id':'mainPanel', 'className':React.addons.classSet(classes)}, [
|
||||
React.DOM.div({'className':'mask', 'onClick': this.handleMaskClick}),
|
||||
React.DOM.div({'className':'container'},
|
||||
// this.style() == 'extra-wide' ? this.renderExtraWide() : this.renderOther()
|
||||
this.renderLayout(this.style())
|
||||
)
|
||||
]);
|
||||
}
|
||||
|
||||
//=========================================================================
|
||||
});
|
||||
@@ -0,0 +1,49 @@
|
||||
/*
|
||||
|
||||
Copyright 2008-2013 Clipperz Srl
|
||||
|
||||
This file is part of Clipperz, the online password manager.
|
||||
For further information about its features and functionalities please
|
||||
refer to http://www.clipperz.com.
|
||||
|
||||
* Clipperz is free software: you can redistribute it and/or modify it
|
||||
under the terms of the GNU Affero General Public License as published
|
||||
by the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
* Clipperz is distributed in the hope that it will be useful, but
|
||||
WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
|
||||
See the GNU Affero General Public License for more details.
|
||||
|
||||
* You should have received a copy of the GNU Affero General Public
|
||||
License along with Clipperz. If not, see http://www.gnu.org/licenses/.
|
||||
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
Clipperz.Base.module('Clipperz.PM.UI.Components.Panels');
|
||||
|
||||
Clipperz.PM.UI.Components.Panels.SelectionPanel = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
selectionPanelStatus: React.PropTypes.oneOf(['OPEN', 'CLOSED']).isRequired
|
||||
},
|
||||
|
||||
//=========================================================================
|
||||
|
||||
render: function () {
|
||||
//console.log("SelectionPanel", this.props);
|
||||
var classes = React.addons.classSet({
|
||||
'panel': true,
|
||||
'left': true,
|
||||
'open': this.props['selectionPanelStatus'] == 'OPEN'
|
||||
});
|
||||
|
||||
return React.DOM.div({'key':'selectionPanel', 'id':'selectionPanel', 'className':classes}, [
|
||||
Clipperz.PM.UI.Components.Selections(this.props),
|
||||
]);
|
||||
}
|
||||
|
||||
//=========================================================================
|
||||
});
|
||||
Reference in New Issue
Block a user