From 32c6382db336530b4493e609be3841bac9134af6 Mon Sep 17 00:00:00 2001 From: Aiko Mastboom Date: Fri, 10 May 2013 02:53:06 +0200 Subject: [PATCH] added close tab button, added add attribute input box --- public/index.html | 126 +++++++++++++++++++++++++++++++++++----------- public/style.less | 72 ++++++++++++++++++++++++++ 2 files changed, 168 insertions(+), 30 deletions(-) diff --git a/public/index.html b/public/index.html index a8e6aac..67926ec 100644 --- a/public/index.html +++ b/public/index.html @@ -33,6 +33,15 @@ "name" : "test1" } ] + }, + { + "title" : "Test Two", + "docs" : [ + { + "collection" : "tests", + "name" : "test2" + } + ] } ] }{ @@ -196,6 +205,15 @@ click: $root._openAttribute"> +
  • + +
    • @@ -224,20 +242,14 @@
  • - + +
    + + +
    +
    • -
    @@ -324,6 +336,10 @@ function main_functions(app, vmName) { } }, + setReadOnly: function (value) { + editor.ace.setReadOnly(value); + }, + setDoc: function (attribute, callback) { //noinspection JSUnresolvedFunction editor.ace.setReadOnly(true); @@ -489,7 +505,6 @@ function initViewModel_main(app, vmName) { var viewModel = app.ko.mapping.fromJS(snapshot, mapping); - viewModel._newAttribute = app.ko.observable(); viewModel._selectedMode = app.ko.observable(); var noneAceMode = null; @@ -566,6 +581,7 @@ function initViewModel_main(app, vmName) { viewModel._activeAttributes = app.ko.observableArray(activeAttribute); viewModel._goToAttribute = function (attribute) { + app.debug && console.log('_goToAttribute',attribute); viewModel._chosenAttribute(attribute); viewModel._updateSelectedMode(); callFunction(app, 'main').setDoc(attribute, function (err) { @@ -582,20 +598,6 @@ function initViewModel_main(app, vmName) { }; - /* TODO: move to projects viewModel - viewModel._newAttribute.subscribe(function (newValue) { - if (newValue) { - app.doc.main.submitOp({ - p: [newValue], - oi: {} - }, function (err, result) { - //viewModel._newAttribute(""); - }); - viewModel._goToAttribute(newValue); - } - }); - */ - viewModel._previewAttribute = function () { var attribute = viewModel._chosenAttribute(); if (attribute) { @@ -631,6 +633,11 @@ function initViewModel_main(app, vmName) { viewModel._closeDoc = function (attribute) { console.log('closing ', attribute); + var mainViewModel = getViewModel(app, 'main'); + if(mainViewModel._isChosenAttribute(attribute)) { + callFunction(app, 'main').setReadOnly(true); + } + callFunction(app, 'user').removeActiveAttribute(attribute); }; app.debug && console.log('mainViewModel', viewModel); @@ -647,7 +654,6 @@ function updateViewModel_main(app, vmName) { addComputed(snapshot); app.debug && console.log('updating main viewModel', snapshot, viewModel, vm_config); app.ko.mapping.fromJS(snapshot, mapping, viewModel); - viewModel._newAttribute(""); app.debug && console.log('updated main viewModel', viewModel); } @@ -778,6 +784,42 @@ function user_functions(app, vmName) { }); }, + removeActiveAttribute: function (attribute, callback) { + var path = ['active']; + var user_doc = getDoc(app, 'user'); + this.ensurePath(user_doc, path, true, function (err, ops, current) { + if (err) { + console.error('removeActiveAttribute.ensurePath', err); + return callback && callback(err); + } + var currentIndex=null; + _.any(current, function(value, index, list) { + if (equalAttributes(value, attribute)) { + currentIndex=index; + return true; + } + }); + if (currentIndex != null){ + path.push(currentIndex); + ops.push({ + p: path, + ld: normalizeLocation(attribute) + }); + app.debug && console.log('removeActiveAttribute ops', ops); + return user_doc.submitOp(ops, function (err) { + if (err) { + console.error('user_doc.submitOp', err); + return callback && callback(err); + } + return callback && callback(err); + }); + + } else { + return callback && callback(null); + } + }); + }, + getActiveAttributes: function () { var active_list = getDoc(app, 'user').at(['active']); var attributes = null; @@ -803,7 +845,6 @@ function post_updateViewModel_user(app, vmName) { ); } - function initViewModel_user(app, vmName) { var vm_config = getViewModelConfig(app, vmName); var mapping = vm_config.mapping; @@ -913,6 +954,31 @@ function initViewModel_projects(app, vmName) { } else { project.docs()[index]._attributeDocNames = app.ko.observableArray(); } + project.docs()[index]._newAttribute = app.ko.observable(); + project.docs()[index]._newAttribute.subscribe(function (newValue, aaaa) { + if (newValue) { + var docId = keyFromLocation(loc); + var doc = getDoc(app, docId); + + doc.submitOp({ + p: [newValue], + oi: {} + }, function (err, result) { + project.docs()[index]._newAttribute(""); + }); + var _loc = normalizeLocation(loc); + var attribute = { + collection: _loc.collection, + name: _loc.name, + attribute: newValue + }; + // TODO: a callback would be nice so we can clear the + // _newAttribute box after the document has been written to. + // currently it just wierd in 'guest' mode as you can not + // have any tabs open. + viewModel._openAttribute(attribute); + } + }); }) }); @@ -930,7 +996,7 @@ function initViewModel_projects(app, vmName) { attributes ); } - + key_doc.on('change', onChange); onChange(); }); } diff --git a/public/style.less b/public/style.less index 538099a..9392aa4 100644 --- a/public/style.less +++ b/public/style.less @@ -78,6 +78,60 @@ body { float: right; } + +.nav-pills>li>a>div { + padding-top: 0px; + padding-bottom: 0px; +} + +li.active .btn-pill, li.active .btn-pill[disabled] { + background-color: transparent; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + color: #ffffff; +} + +.btn-pill { + background-color: transparent; + border-color: transparent; + background-image: none; + cursor: pointer; + color: #0088cc; + -webkit-border-radius: 0; + -moz-border-radius: 0; + border-radius: 0; + padding: 0; + border:0; +} + + +.btn-pill:hover, .btn-pill:focus { + color: #005580; + text-decoration: underline; + background-color: transparent; +} + +.btn-pill[disabled]:hover, .btn-pill[disabled]:focus { + color: #333333; + text-decoration: none; +} + +.nav-pills>li>a.nav-pill { + padding-top: 5px; + padding-bottom: 6px; +} + +.nav-pills>li>a { + padding-top: 8px; + padding-bottom: 8px; + margin-top: 2px; + margin-bottom: 2px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} + #editor { margin: 0; position: absolute; @@ -89,11 +143,24 @@ body { #project_tree { left: 0; + bottom: 0; right: @content-divider; width: @content-divider; margin: 5px; } +#project_tree .nav { + margin-bottom: 0; +} + +#project_tree .label { + margin-bottom: 0; +} + +#project_tree .input-append { + margin-bottom: 0; +} + #project_tree input { width: 125px; } @@ -102,12 +169,17 @@ body { width: 140px; } +#project_tree input { + width: 100px; +} + #htext a { color: #aaf; font-weight: bold; } .nav i[class*="icon-"] { + margin-top: -4px; vertical-align: middle; }