[Cosmo-dev] Re: [commits-cosmo] (mde) [2473] Add UI elements
for jump-to date.
Matthew Eernisse
mde at osafoundation.org
Fri Sep 15 16:05:27 PDT 2006
Actually TBH, I'm not sold on widgets for the Cosmo UI. For all our UI
elements that have variable DOM-element structures and more complicated
behaviors, splitting the element construction between a static template
file and programmatically-generated bits seems needlessly cumbersome to me.
Even with simpler pieces like the form, putting stuff into a template
file means that conditional logic about what's enabled/disabled,
localized default text for certain fields, and element behaviors
("disable that other element when this option is selected"), have to go
in a separate JS file. That's way more annoying to me than what we're
doing now -- particularly since the template files cache, and I have to
dump cache each time I make any kind of change to see the results.
So what is actually "a lot easier" is a fairly mushy question, and may
ultimately devolve down to a matter of taste. What we have in our code
now is not 'the Dojo way,' but it is a fairly standard way of doing
things -- as evinced by the fact that Towns was able to jump right in
and make additions and changes to the UI pretty much without any help or
input from me. And he's even just a *manager.* :)
So I think the answer re. widgets in the short- to mid-term is this: we
have some significant reorganization of the UI to do fairly soon to
accommodate multiple views and different types of items (beyond calendar
events), so at this point I do not plan to do any significant rewrites
or reorganization of the UI-element code to use Dojo widgets. When I
look at the list of all the stuff we need to solve, that seems pretty
low in priority.
There are other parts of the app that need some serious help -- mainly
the event management/communication, and packaging up our increasingly
unwieldy laundry-list of JS includes in a sane way. (I don't have the
Java chops needed to work with the packaging, but somebody's going to
have to figure that stuff out. We have a ridiculous number of JS
includes.) That's where I plan to start working in the Dojo stuff --
where we get the most bang for the buck.
I also know you put some significant effort into that button widget. I
somehow missed the fact that you were done working on it. I'll have a
look at it, and if it does everything the current Button library does,
I'll look at where I can start putting it into action.
M.
Bobby Rullo wrote:
> Actually,
>
> How come this whole thing isn't a widget? Are we going to go ahead with
> dojo widgets or not? I think we should. Templates are a lot easier to
> deal with than inline HTML or DOM. And plus it's OO, the whole lifecycle
> is maintained, etc. etc. etc.
>
> Bobby
>
> On Sep 12, 2006, at 5:07 PM, svncheckin at osafoundation.org
> <mailto:svncheckin at osafoundation.org> wrote:
>
>> Revision
>> 2473 <http://cvs.osafoundation.org/viewcvs.cgi?rev=2473&view=rev>
>> Author
>> mde
>> Date
>> 2006-09-12 17:07:33 -0700 (Tue, 12 Sep 2006)
>>
>>
>> Log Message
>>
>> Add UI elements for jump-to date.
>>
>>
>> Modified Paths
>>
>> * cosmo/trunk/src/webapp/WEB-INF/jsp/pim/pim.jsp
>> <#cosmotrunksrcwebappWEBINFjsppimpimjsp>
>> * cosmo/trunk/src/webapp/js/cosmo/ui/cal_form.js
>> <#cosmotrunksrcwebappjscosmouical_formjs>
>> * cosmo/trunk/src/webapp/js/cosmo/ui/cal_main.js
>> <#cosmotrunksrcwebappjscosmouical_mainjs>
>> * cosmo/trunk/src/webapp/js/cosmo/ui/minical.js
>> <#cosmotrunksrcwebappjscosmouiminicaljs>
>> * cosmo/trunk/src/webapp/templates/default/ui.css
>> <#cosmotrunksrcwebapptemplatesdefaultuicss>
>>
>>
>> Diff
>>
>>
>> Modified: cosmo/trunk/src/webapp/WEB-INF/jsp/pim/pim.jsp (2472
>> => 2473)
>>
>> --- cosmo/trunk/src/webapp/WEB-INF/jsp/pim/pim.jsp 2006-09-13 00:06:38 UTC (rev 2472)
>> +++ cosmo/trunk/src/webapp/WEB-INF/jsp/pim/pim.jsp 2006-09-13 00:07:33 UTC (rev 2473)
>> @@ -97,6 +97,7 @@
>> <form method="post" id="calForm" name="calForm" action="">
>> <div id="leftSidebarDiv">
>> <div id="calSelectNav"></div>
>> + <div id="jumpToDateDiv"></div>
>> <div id="miniCalDiv"></div>
>> </div>
>> <div id="calTopNavDiv">
>>
>>
>> Modified: cosmo/trunk/src/webapp/js/cosmo/ui/cal_form.js (2472
>> => 2473)
>>
>> --- cosmo/trunk/src/webapp/js/cosmo/ui/cal_form.js 2006-09-13 00:06:38 UTC (rev 2472)
>> +++ cosmo/trunk/src/webapp/js/cosmo/ui/cal_form.js 2006-09-13 00:07:33 UTC (rev 2473)
>> @@ -716,4 +716,37 @@
>>
>> descrTxt = null; // Set DOM-node-ref to null to avoid IE memleak
>> };
>> + this.addJumpToDate = function(dc) {
>> + var top = parseInt(MiniCal.displayContext.style.top);
>> + var d = null;
>> +
>> + // place the div just above minical
>> + top -= 28;
>> + dc.style.top = top + 'px';
>> +
>> + d = document.createElement('div');
>> + d.className = 'formElem floatLeft';
>> + dc.appendChild(d);
>> + this.createInput('text', 'jumpto', 'jumpto',
>> + 10, 10, null, 'inputText', d);
>> + this.setTextInput(this.form.jumpto, 'mm/dd/yyyy', true, false);
>> + this.form.jumpto.onclick = Cal.calForm.emptyTextInput;
>> +
>> + d = document.createElement('div');
>> + d.className = 'floatLeft';
>> + this.createNbsp(d);
>> + this.createNbsp(d);
>> + dc.appendChild(d);
>> +
>> + d = document.createElement('div');
>> + d.className = 'floatLeft';
>> + dc.appendChild(d);
>> + butJump = new Button('jumpToButton', 38, function() { alert('This does nothing yet.') },
>> + getText('App.Button.Go'), true);
>> + d.appendChild(butJump.domNode);
>> +
>> + d = document.createElement('div');
>> + d.className = 'clearAll';
>> + dc.appendChild(d);
>> + };
>> }
>>
>>
>> Modified: cosmo/trunk/src/webapp/js/cosmo/ui/cal_main.js (2472
>> => 2473)
>>
>> --- cosmo/trunk/src/webapp/js/cosmo/ui/cal_main.js 2006-09-13 00:06:38 UTC (rev 2472)
>> +++ cosmo/trunk/src/webapp/js/cosmo/ui/cal_main.js 2006-09-13 00:07:33 UTC (rev 2473)
>> @@ -216,10 +216,14 @@
>> var dummyElem = document.createElement('div');
>> allDayDiv.appendChild(dummyElem);
>> }
>> -
>> +
>> + // Load minical and jump-to date
>> var mcDiv = document.getElementById('miniCalDiv');
>> - MiniCal.init(Cal, mcDiv);
>> -
>> + var jpDiv = document.getElementById('jumpToDateDiv');
>> + // Place jump-to date based on mini-cal pos
>> + if (MiniCal.init(Cal, mcDiv)) {
>> + this.calForm.addJumpToDate(jpDiv);
>> + }
>> };
>>
>> // ==========================
>>
>>
>> Modified: cosmo/trunk/src/webapp/js/cosmo/ui/minical.js (2472
>> => 2473)
>>
>> --- cosmo/trunk/src/webapp/js/cosmo/ui/minical.js 2006-09-13 00:06:38 UTC (rev 2472)
>> +++ cosmo/trunk/src/webapp/js/cosmo/ui/minical.js 2006-09-13 00:07:33 UTC (rev 2473)
>> @@ -74,6 +74,7 @@
>> self.hide();
>> self.render();
>> self.show();
>> + return true;
>> };
>>
>> /**
>>
>>
>> Modified: cosmo/trunk/src/webapp/templates/default/ui.css
>> (2472 => 2473)
>>
>> --- cosmo/trunk/src/webapp/templates/default/ui.css 2006-09-13 00:06:38 UTC (rev 2472)
>> +++ cosmo/trunk/src/webapp/templates/default/ui.css 2006-09-13 00:07:33 UTC (rev 2473)
>> @@ -385,6 +385,12 @@
>> position:absolute;
>> top:8px;
>> }
>> +/* Jump-to date box */
>> +#jumpToDateDiv {
>> + padding-left:8px;
>> + padding-right:8px;
>> + position:absolute;
>> +}
>> /* Right sidebar
>> * --------------------- */
>> /* Right sidebar main */
>>
>> _______________________________________________
>> Commits-Cosmo mailing list
>> Commits-Cosmo at osafoundation.org <mailto:Commits-Cosmo at osafoundation.org>
>> http://lists.osafoundation.org/cgi-bin/mailman/listinfo/commits-cosmo
>
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> cosmo-dev mailing list
> cosmo-dev at lists.osafoundation.org
> http://lists.osafoundation.org/mailman/listinfo/cosmo-dev
More information about the cosmo-dev
mailing list