[Sugar-devel] Web activities canvas element

laurent bernabe laurent.bernabe at gmail.com
Thu Oct 10 08:32:56 EDT 2013


I've changed the prefs.json file, in order to set a resolution of 1200x900
on HDMI1, but it does not seem to have changed anything.

{
    "output": "HDMI1",
    "resolution": "1200x900"
}

Width still takes the whole screen width.
Same for height.

(I've stopped and restarted osbuild shell).


2013/10/10 laurent bernabe <laurent.bernabe at gmail.com>

> Are you talking about options from this page :
> http://developer.sugarlabs.org/dev-environment.md.html ?
>
> Regards
>
>
> 2013/10/10 Daniel Narvaez <dwnarvaez at gmail.com>
>
>> 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>
>>>
>>>> Hello,
>>>>
>>>> 2013/10/10 Manuel Quiñones <manuq at laptop.org>
>>>>
>>>>> 2013/10/9 laurent bernabe <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/3986ce3b/attachment.html>


More information about the Sugar-devel mailing list