[Sugar-devel] Web activities canvas element

[Daniel Narvaez]

It might be helpful to change the sugar-runner window size, see the dev
environment documentation on developer.sugarlabs.org

On Thursday, 10 October 2013, laurent bernabe wrote:

> Otherwise,
>
> I thought, as my laptop may have wider screen than OLPC, I can try to
> restrict the activity zone (toolbar + canvas zone) with css (even if that
> task can be hard) and have it centered on my screen. And maybe add a bit of
> Javascript in order to restrict mouse interaction to the "emulated zone".
>
> Maybe that can be silly, but at least, I will "have a screen" close to the
> real XO, and a more realistic result.
>
> Regards
>
>
> 2013/10/10 laurent bernabe <laurent.bernabe at gmail.com <javascript:_e({},
> 'cvml', 'laurent.bernabe at gmail.com');>>
>
>> Hello,
>>
>> 2013/10/10 Manuel Quiñones <manuq at laptop.org <javascript:_e({}, 'cvml',
>> 'manuq at laptop.org');>>
>>
>>> 2013/10/9 laurent bernabe <laurent.bernabe at gmail.com <javascript:_e({},
>>> 'cvml', 'laurent.bernabe at gmail.com');>>:
>>> > Hello,
>>> >
>>> > *) I am wondering whether I can safely replace, in an index.html file
>>> of a
>>> > web activity, the <div id="canvas></div> with <canvas
>>> id="canvas"></canvas>
>>> > ?
>>> >
>>> > Because the library I am using need a real canvas element.
>>>
>>> You just put your <canvas> inside that <div>.
>>>
>>
>> I've put my canvas element inside the #canvas div and it worked.
>>
>>
>>>
>>> > *) Also, if I can use a real canvas element, how can set its size to
>>> the
>>> > remaining size of the screen ? (As my laptop has a wider screen than XO
>>> > ones).
>>>
>>> It's possible by connecting to the window resize event in JS.  You can
>>> see an example in Clock Web activity.
>>>
>>> https://github.com/manuq/clock-web
>>> http://manuq.github.io/clock-web
>>
>>
>>
>> Wouldn't be simpler to use CSS instead ? I've seen that there are two css
>> media added in the index.html, which seem to do what I am waiting for
>> (#canvas => width:100%, overflow-y: auto, and top: 75px), but it seem that
>> none are used. (Canvas lays at top = 0 px and left = 0px, width is about
>> 300px ...)
>>
>> Regards
>>
>
>

-- 
Daniel Narvaez
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.sugarlabs.org/archive/sugar-devel/attachments/20131010/14cb4824/attachment-0001.html>