1 /* 2 * Copyright (c) 2022-2023 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16 #ifndef FOUNDATION_ACE_FRAMEWORK_JAVASCRIPT_BRIDGE_JS_VIEW_JS_OFFSCREEN_CANVAS_H 17 #define FOUNDATION_ACE_FRAMEWORK_JAVASCRIPT_BRIDGE_JS_VIEW_JS_OFFSCREEN_CANVAS_H 18 19 #include "bridge/declarative_frontend/jsview/js_offscreen_rendering_context.h" 20 #include "core/common/ace_engine.h" 21 #include "core/components/common/properties/paint_state.h" 22 #include "core/components_ng/pattern/custom_paint/offscreen_canvas_pattern.h" 23 24 namespace OHOS::Ace::Framework { 25 26 class JSOffscreenCanvas : public AceType, public JSInteractableView, public JSViewAbstract { 27 DECLARE_ACE_TYPE(JSOffscreenCanvas, AceType); 28 public: 29 JSOffscreenCanvas() = default; 30 ~JSOffscreenCanvas() override = default; 31 32 static void JSBind(BindingTarget globalObj, void* nativeEngine); 33 static napi_value Constructor(napi_env env, napi_callback_info info); 34 static napi_value InitOffscreenCanvas(napi_env env); 35 static napi_value JsTransferToImageBitmap(napi_env env, napi_callback_info info); 36 static napi_value JsGetContext(napi_env env, napi_callback_info info); 37 static napi_value JsGetWidth(napi_env env, napi_callback_info info); 38 static napi_value JsGetHeight(napi_env env, napi_callback_info info); 39 static napi_value JsSetHeight(napi_env env, napi_callback_info info); 40 static napi_value JsSetWidth(napi_env env, napi_callback_info info); 41 napi_value OnGetWidth(napi_env env); 42 napi_value OnGetHeight(napi_env env); 43 JsCreateRadialGradient(const JSCallbackInfo & info)44 void JsCreateRadialGradient(const JSCallbackInfo& info) {} JsFillRect(const JSCallbackInfo & info)45 void JsFillRect(const JSCallbackInfo& info) {} JsStrokeRect(const JSCallbackInfo & info)46 void JsStrokeRect(const JSCallbackInfo& info) {} JsClearRect(const JSCallbackInfo & info)47 void JsClearRect(const JSCallbackInfo& info) {} JsCreateLinearGradient(const JSCallbackInfo & info)48 void JsCreateLinearGradient(const JSCallbackInfo& info) {} JsFillText(const JSCallbackInfo & info)49 void JsFillText(const JSCallbackInfo& info) {} JsStrokeText(const JSCallbackInfo & info)50 void JsStrokeText(const JSCallbackInfo& info) {} JsMeasureText(const JSCallbackInfo & info)51 void JsMeasureText(const JSCallbackInfo& info) {} JsMoveTo(const JSCallbackInfo & info)52 void JsMoveTo(const JSCallbackInfo& info) {} JsLineTo(const JSCallbackInfo & info)53 void JsLineTo(const JSCallbackInfo& info) {} JsBezierCurveTo(const JSCallbackInfo & info)54 void JsBezierCurveTo(const JSCallbackInfo& info) {} JsQuadraticCurveTo(const JSCallbackInfo & info)55 void JsQuadraticCurveTo(const JSCallbackInfo& info) {} JsArcTo(const JSCallbackInfo & info)56 void JsArcTo(const JSCallbackInfo& info) {} JsArc(const JSCallbackInfo & info)57 void JsArc(const JSCallbackInfo& info) {} JsEllipse(const JSCallbackInfo & info)58 void JsEllipse(const JSCallbackInfo& info) {} JsFill(const JSCallbackInfo & info)59 void JsFill(const JSCallbackInfo& info) {} JsStroke(const JSCallbackInfo & info)60 void JsStroke(const JSCallbackInfo& info) {} JsClip(const JSCallbackInfo & info)61 void JsClip(const JSCallbackInfo& info) {} JsRect(const JSCallbackInfo & info)62 void JsRect(const JSCallbackInfo& info) {} JsBeginPath(const JSCallbackInfo & info)63 void JsBeginPath(const JSCallbackInfo& info) {} JsClosePath(const JSCallbackInfo & info)64 void JsClosePath(const JSCallbackInfo& info) {} JsRestore(const JSCallbackInfo & info)65 void JsRestore(const JSCallbackInfo& info) {} JsSave(const JSCallbackInfo & info)66 void JsSave(const JSCallbackInfo& info) {} JsRotate(const JSCallbackInfo & info)67 void JsRotate(const JSCallbackInfo& info) {} JsScale(const JSCallbackInfo & info)68 void JsScale(const JSCallbackInfo& info) {} JsGetTransform(const JSCallbackInfo & info)69 void JsGetTransform(const JSCallbackInfo& info) {} JsSetTransform(const JSCallbackInfo & info)70 void JsSetTransform(const JSCallbackInfo& info) {} JsResetTransform(const JSCallbackInfo & info)71 void JsResetTransform(const JSCallbackInfo& info) {} JsTransform(const JSCallbackInfo & info)72 void JsTransform(const JSCallbackInfo& info) {} JsTranslate(const JSCallbackInfo & info)73 void JsTranslate(const JSCallbackInfo& info) {} JsSetLineDash(const JSCallbackInfo & info)74 void JsSetLineDash(const JSCallbackInfo& info) {} JsGetLineDash(const JSCallbackInfo & info)75 void JsGetLineDash(const JSCallbackInfo& info) {} JsDrawImage(const JSCallbackInfo & info)76 void JsDrawImage(const JSCallbackInfo& info) {} JsCreatePattern(const JSCallbackInfo & info)77 void JsCreatePattern(const JSCallbackInfo& info) {} JsCreateImageData(const JSCallbackInfo & info)78 void JsCreateImageData(const JSCallbackInfo& info) {} JsPutImageData(const JSCallbackInfo & info)79 void JsPutImageData(const JSCallbackInfo& info) {} JsGetImageData(const JSCallbackInfo & info)80 void JsGetImageData(const JSCallbackInfo& info) {} JsGetJsonData(const JSCallbackInfo & info)81 void JsGetJsonData(const JSCallbackInfo& info) {} JsGetPixelMap(const JSCallbackInfo & info)82 void JsGetPixelMap(const JSCallbackInfo& info) {} JsSetPixelMap(const JSCallbackInfo & info)83 void JsSetPixelMap(const JSCallbackInfo& info) {} JsCreateConicGradient(const JSCallbackInfo & info)84 void JsCreateConicGradient(const JSCallbackInfo& info) {} JsSetFilter(const JSCallbackInfo & info)85 void JsSetFilter(const JSCallbackInfo& info) {} JsGetFilter(const JSCallbackInfo & info)86 void JsGetFilter(const JSCallbackInfo& info) {} JsSetDirection(const JSCallbackInfo & info)87 void JsSetDirection(const JSCallbackInfo& info) {} JsGetDirection(const JSCallbackInfo & info)88 void JsGetDirection(const JSCallbackInfo& info) {} JsSetFillStyle(const JSCallbackInfo & info)89 void JsSetFillStyle(const JSCallbackInfo& info) {} JsGetFillStyle(const JSCallbackInfo & info)90 void JsGetFillStyle(const JSCallbackInfo& info) {} JsSetStrokeStyle(const JSCallbackInfo & info)91 void JsSetStrokeStyle(const JSCallbackInfo& info) {} JsGetStrokeStyle(const JSCallbackInfo & info)92 void JsGetStrokeStyle(const JSCallbackInfo& info) {} JsSetLineCap(const JSCallbackInfo & info)93 void JsSetLineCap(const JSCallbackInfo& info) {} JsGetLineCap(const JSCallbackInfo & info)94 void JsGetLineCap(const JSCallbackInfo& info) {} JsSetLineJoin(const JSCallbackInfo & info)95 void JsSetLineJoin(const JSCallbackInfo& info) {} JsGetLineJoin(const JSCallbackInfo & info)96 void JsGetLineJoin(const JSCallbackInfo& info) {} JsSetMiterLimit(const JSCallbackInfo & info)97 void JsSetMiterLimit(const JSCallbackInfo& info) {} JsGetMiterLimit(const JSCallbackInfo & info)98 void JsGetMiterLimit(const JSCallbackInfo& info) {} JsSetLineWidth(const JSCallbackInfo & info)99 void JsSetLineWidth(const JSCallbackInfo& info) {} JsGetLineWidth(const JSCallbackInfo & info)100 void JsGetLineWidth(const JSCallbackInfo& info) {} JsSetFont(const JSCallbackInfo & info)101 void JsSetFont(const JSCallbackInfo& info) {} JsGetFont(const JSCallbackInfo & info)102 void JsGetFont(const JSCallbackInfo& info) {} JsSetTextAlign(const JSCallbackInfo & info)103 void JsSetTextAlign(const JSCallbackInfo& info) {} JsGetTextAlign(const JSCallbackInfo & info)104 void JsGetTextAlign(const JSCallbackInfo& info) {} JsSetTextBaseline(const JSCallbackInfo & info)105 void JsSetTextBaseline(const JSCallbackInfo& info) {} JsGetTextBaseline(const JSCallbackInfo & info)106 void JsGetTextBaseline(const JSCallbackInfo& info) {} JsSetGlobalAlpha(const JSCallbackInfo & info)107 void JsSetGlobalAlpha(const JSCallbackInfo& info) {} JsGetGlobalAlpha(const JSCallbackInfo & info)108 void JsGetGlobalAlpha(const JSCallbackInfo& info) {} JsSetGlobalCompositeOperation(const JSCallbackInfo & info)109 void JsSetGlobalCompositeOperation(const JSCallbackInfo& info) {} JsGetGlobalCompositeOperation(const JSCallbackInfo & info)110 void JsGetGlobalCompositeOperation(const JSCallbackInfo& info) {} JsSetLineDashOffset(const JSCallbackInfo & info)111 void JsSetLineDashOffset(const JSCallbackInfo& info) {} JsGetLineDashOffset(const JSCallbackInfo & info)112 void JsGetLineDashOffset(const JSCallbackInfo& info) {} JsSetShadowBlur(const JSCallbackInfo & info)113 void JsSetShadowBlur(const JSCallbackInfo& info) {} JsGetShadowBlur(const JSCallbackInfo & info)114 void JsGetShadowBlur(const JSCallbackInfo& info) {} JsSetShadowColor(const JSCallbackInfo & info)115 void JsSetShadowColor(const JSCallbackInfo& info) {} JsGetShadowColor(const JSCallbackInfo & info)116 void JsGetShadowColor(const JSCallbackInfo& info) {} JsSetShadowOffsetX(const JSCallbackInfo & info)117 void JsSetShadowOffsetX(const JSCallbackInfo& info) {} JsGetShadowOffsetX(const JSCallbackInfo & info)118 void JsGetShadowOffsetX(const JSCallbackInfo& info) {} JsSetShadowOffsetY(const JSCallbackInfo & info)119 void JsSetShadowOffsetY(const JSCallbackInfo& info) {} JsGetShadowOffsetY(const JSCallbackInfo & info)120 void JsGetShadowOffsetY(const JSCallbackInfo& info) {} JsSetImageSmoothingEnabled(const JSCallbackInfo & info)121 void JsSetImageSmoothingEnabled(const JSCallbackInfo& info) {} JsGetImageSmoothingEnabled(const JSCallbackInfo & info)122 void JsGetImageSmoothingEnabled(const JSCallbackInfo& info) {} JsSetImageSmoothingQuality(const JSCallbackInfo & info)123 void JsSetImageSmoothingQuality(const JSCallbackInfo& info) {} JsGetImageSmoothingQuality(const JSCallbackInfo & info)124 void JsGetImageSmoothingQuality(const JSCallbackInfo& info) {} JSTransferFromImageBitmap(const JSCallbackInfo & info)125 void JSTransferFromImageBitmap(const JSCallbackInfo& info) {} JsSaveLayer(const JSCallbackInfo & info)126 void JsSaveLayer(const JSCallbackInfo& info) {} JsRestoreLayer(const JSCallbackInfo & info)127 void JsRestoreLayer(const JSCallbackInfo& info) {} 128 SetWidth(double width)129 void SetWidth(double width) 130 { 131 width_ = width; 132 } 133 GetWidth()134 double GetWidth() const 135 { 136 return width_; 137 } 138 SetHeight(double height)139 void SetHeight(double height) 140 { 141 height_ = height; 142 } 143 GetHeight()144 double GetHeight() const 145 { 146 return height_; 147 } 148 GetContext()149 RefPtr<PipelineBase> GetContext() const 150 { 151 if (instanceId_ == -1) { 152 return nullptr; 153 } 154 auto container = AceEngine::Get().GetContainer(instanceId_); 155 if (container == nullptr) { 156 return nullptr; 157 } 158 auto context = container->GetPipelineContext(); 159 return context; 160 } 161 SetDetachStatus(bool isDetached)162 void SetDetachStatus(bool isDetached) 163 { 164 isDetached_ = isDetached; 165 } 166 IsDetached()167 bool IsDetached() const 168 { 169 return isDetached_; 170 } 171 IsGetContext()172 bool IsGetContext() const 173 { 174 return isGetContext_; 175 } 176 177 enum class ContextType { 178 CONTEXT_2D = 0, 179 }; 180 181 ACE_DISALLOW_COPY_AND_MOVE(JSOffscreenCanvas); 182 private: 183 napi_value CreateContext2d(napi_env env, double width, double height); 184 napi_value onTransferToImageBitmap(napi_env env); 185 napi_value onGetContext(napi_env env, napi_callback_info info); 186 napi_value OnSetWidth(napi_env env, napi_callback_info info); 187 napi_value OnSetHeight(napi_env env, napi_callback_info info); 188 189 RefPtr<NG::OffscreenCanvasPattern> offscreenCanvasPattern_; 190 RefPtr<JSOffscreenRenderingContext> offscreenCanvasContext_; 191 RefPtr<JSRenderingContextSettings> offscreenCanvasSettings_; 192 double width_ = 0.0f; 193 double height_ = 0.0f; 194 int32_t instanceId_ = INSTANCE_ID_UNDEFINED; 195 ContextType contextType_; 196 bool isGetContext_ = false; 197 bool isDetached_ = false; 198 }; 199 200 } // namespace OHOS::Ace::Framework 201 202 #endif // FOUNDATION_ACE_FRAMEWORK_JAVASCRIPT_BRIDGE_JS_VIEW_JS_OFFSCREEN_CANVAS_H 203