archive-gh-me/Hilo
1
0
Fork 0
mirror of https://github.com/hiloteam/Hilo.git synced 2026-01-25 16:25:48 +00:00
Code Issues Projects Releases Wiki Activity
Hilo/docs/api/symbols/src/src_view_Drawable.js.html
墨水 a74d7e44ef first commit
2016-01-28 17:59:23 +08:00

75 lines
14 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"> <style>
.KEYW {color: #933;}
.COMM {color: #bbb; font-style: italic;}
.NUMB {color: #393;}
.STRN {color: #393;}
.REGX {color: #339;}
.line {border-right: 1px dotted #666; color: #666; font-style: normal;}
</style></head><body><pre><span class='line'> 1</span> <span class="COMM">/**
<span class='line'> 2</span> * Hilo
<span class='line'> 3</span> * Copyright 2015 alibaba.com
<span class='line'> 4</span> * Licensed under the MIT License
<span class='line'> 5</span> */</span><span class="WHIT">
<span class='line'> 6</span>
<span class='line'> 7</span> </span><span class="COMM">/**
<span class='line'> 8</span> * @class Drawable是可绘制图像的包装。
<span class='line'> 9</span> * @param {Object} properties 创建对象的属性参数。可包含此类所有可写属性。
<span class='line'> 10</span> * @module hilo/view/Drawable
<span class='line'> 11</span> * @requires hilo/core/Hilo
<span class='line'> 12</span> * @requires hilo/core/Class
<span class='line'> 13</span> * @property {Object} image 要绘制的图像。即可被CanvasRenderingContext2D.drawImage使用的对象类型，可以是HTMLImageElement、HTMLCanvasElement、HTMLVideoElement等对象。
<span class='line'> 14</span> * @property {array} rect 要绘制的图像的矩形区域。
<span class='line'> 15</span> */</span><span class="WHIT">
<span class='line'> 16</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">Drawable</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Class.create</span><span class="PUNC">(</span><span class="COMM">/** @lends Drawable.prototype */</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 17</span> </span><span class="WHIT"> </span><span class="NAME">constructor</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">properties</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 18</span> </span><span class="WHIT"> </span><span class="NAME">this.init</span><span class="PUNC">(</span><span class="NAME">properties</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 19</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'> 20</span>
<span class='line'> 21</span> </span><span class="WHIT"> </span><span class="NAME">image</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'> 22</span> </span><span class="WHIT"> </span><span class="NAME">rect</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'> 23</span>
<span class='line'> 24</span> </span><span class="WHIT"> </span><span class="COMM">/**
<span class='line'> 25</span> * 初始化可绘制对象。
<span class='line'> 26</span> * @param {Object} properties 要初始化的属性。
<span class='line'> 27</span> */</span><span class="WHIT">
<span class='line'> 28</span> </span><span class="WHIT"> </span><span class="NAME">init</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">properties</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 29</span> </span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">me</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">this</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">oldImage</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">me.image</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 30</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="PUNC">(</span><span class="NAME">Drawable.isDrawable</span><span class="PUNC">(</span><span class="NAME">properties</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 31</span> </span><span class="WHIT"> </span><span class="NAME">me.image</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">properties</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 32</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="KEYW">else</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 33</span> </span><span class="WHIT"> </span><span class="NAME">Hilo.copy</span><span class="PUNC">(</span><span class="NAME">me</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">properties</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 34</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 35</span>
<span class='line'> 36</span> </span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">image</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">me.image</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 37</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="PUNC">(</span><span class="KEYW">typeof</span><span class="WHIT"> </span><span class="NAME">image</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="STRN">'string'</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 38</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="PUNC">(</span><span class="NAME">oldImage</span><span class="WHIT"> </span><span class="PUNC">&&</span><span class="WHIT"> </span><span class="NAME">image</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="NAME">oldImage.getAttribute</span><span class="PUNC">(</span><span class="STRN">'src'</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 39</span> </span><span class="WHIT"> </span><span class="NAME">image</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">me.image</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">oldImage</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 40</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="KEYW">else</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 41</span> </span><span class="WHIT"> </span><span class="NAME">me.image</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 42</span> </span><span class="WHIT"> </span><span class="COMM">//load image dynamically</span><span class="WHIT">
<span class='line'> 43</span> </span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">img</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">Image</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 44</span> </span><span class="WHIT"> </span><span class="NAME">img.onload</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 45</span> </span><span class="WHIT"> </span><span class="NAME">img.onload</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 46</span> </span><span class="WHIT"> </span><span class="NAME">me.init</span><span class="PUNC">(</span><span class="NAME">img</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 47</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 48</span> </span><span class="WHIT"> </span><span class="NAME">img.src</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">image</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 49</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 50</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 51</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 52</span>
<span class='line'> 53</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="PUNC">(</span><span class="NAME">image</span><span class="WHIT"> </span><span class="PUNC">&&</span><span class="WHIT"> </span><span class="PUNC">!</span><span class="NAME">me.rect</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="NAME">me.rect</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="NUMB">0</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">image.width</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">image.height</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 54</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'> 55</span>
<span class='line'> 56</span> </span><span class="WHIT"> </span><span class="NAME">Statics</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="COMM">/** @lends Drawable */</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 57</span> </span><span class="WHIT"> </span><span class="COMM">/**
<span class='line'> 58</span> * 判断参数elem指定的元素是否可包装成Drawable对象。
<span class='line'> 59</span> * @param {Object} elem 要测试的对象。
<span class='line'> 60</span> * @return {Boolean} 如果是可包装成Drawable对象则返回true，否则为false。
<span class='line'> 61</span> */</span><span class="WHIT">
<span class='line'> 62</span> </span><span class="WHIT"> </span><span class="NAME">isDrawable</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">elem</span><span class="PUNC">)</span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 63</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="PUNC">(</span><span class="PUNC">!</span><span class="NAME">elem</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT"> </span><span class="PUNC">!</span><span class="NAME">elem.tagName</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 64</span> </span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">tagName</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">elem.tagName.toLowerCase</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 65</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">tagName</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="STRN">"img"</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT"> </span><span class="NAME">tagName</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="STRN">"canvas"</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT"> </span><span class="NAME">tagName</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="STRN">"video"</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 66</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 67</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 68</span> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span></pre></body></html>
Reference in New Issue View Git Blame Copy Permalink